    /* ---------- Variables ---------- */
    :root{
      --primary:#2dc294; --primary-hover:#26a47e; --light:#ffffff;
      --dark:#26323A; --bg-top:#ffffff; --bg-bottom:#f7f9f9;
      --bg-section:#f5f6f8; --card-bg:#ffffff; --gray:#555555;
      --shine:rgba(0,0,0,.03);
      --section-padding:6rem;
      --section-margin:8rem;
      --card-radius:24px;
        --card-padding:2.5rem;
        --btn-radius:2rem;
        --footer-bg:#26323A;
        --footer-dark:#162859;
      }

    /* ---------- Reset ---------- */
    *{box-sizing:border-box;margin:0;padding:0;}
    body{
      font-family:'Montserrat',sans-serif;line-height:1.6;
      scroll-behavior:smooth;color:var(--dark);
      background:linear-gradient(to bottom,var(--bg-top) 0%,var(--bg-bottom) 100%);
      padding-top:80px; /* Add padding to account for fixed navbar */
    }
    a{color:inherit;text-decoration:none;}

    /* ---------- Navbar ---------- */
    .navbar{
      position:fixed;top:0;left:0;width:100%;z-index:1000;
      display:flex;align-items:center;justify-content:space-between;
      padding:1rem 2rem;background:var(--bg-top);
      box-shadow:0 1px 3px rgba(0,0,0,0.1);
      transition:all .3s ease;
    }
    .navbar.scrolled{
      background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);
      box-shadow:0 4px 20px rgba(0,0,0,0.1);
    }
    /* Remove the line that hides nav-center on scroll */
    /* .navbar.scrolled .nav-center{display:none;} */

.nav-brand{
  display:flex;
  align-items:center;
  gap:.75rem;
}
.nav-left{
  display:flex;
  align-items:center;
  gap:.75rem;
}

.nav-brand img{height:40px;transition:height .3s ease;}
.navbar.scrolled .nav-brand img{height:32px;}

    .nav-center,.nav-actions{display:flex;align-items:center;gap:2rem;}
    .nav-center a,
    .dropdown-toggle{
      font-weight:600;font-size:.95rem;color:var(--dark);
      transition:color .2s ease;
    }
    .nav-center a:hover,
    .dropdown-toggle:hover{color:var(--primary);}

    .dropdown{position:relative;}
    .dropdown-toggle{background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:.25rem;}
    .dropdown-toggle:after{content:"\25BC";font-size:.6rem;}
    .dropdown-toggle:focus{outline:2px solid var(--primary);outline-offset:2px;}
    
    .mega-menu{
      position:absolute;left:0;top:100%;background:var(--light);
      border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.12);
      padding:2rem;min-width:600px;opacity:0;pointer-events:none;
      transform:translateY(10px);transition:opacity .2s,transform .2s;z-index:999;
      margin-top:1rem; /* Add spacing between navbar and dropdown */
    }
    .dropdown.open .mega-menu{opacity:1;pointer-events:auto;transform:translateY(0);}
    
    .mega-menu-header{
      font-size:.75rem;font-weight:600;color:#6b7280;text-transform:uppercase;
      letter-spacing:.05em;margin-bottom:2rem; /* Increased bottom margin */
    }
    
    .mega-menu-grid{
      display:grid;grid-template-columns:repeat(3,1fr);gap:1rem; /* Adjusted for compact layout */
    }

    .mega-item{
      display:flex;align-items:flex-start;gap:.75rem;padding:.75rem; /* Reduced padding and gap */
      border-radius:8px;transition:background .2s ease;
      text-decoration:none;color:inherit;
    }
    .mega-item:hover{background:#f9fafb;}
    .mega-item:focus{outline:2px solid var(--primary);outline-offset:2px;}
    
    .mega-item-icon{
      width:40px;height:40px;border-radius:8px;background:#ecfdf5;
      display:flex;align-items:center;justify-content:center;flex-shrink:0;
    }
    
    .mega-item-content{
      display:flex;flex-direction:column;gap:.5rem; /* Increased gap */
    }
    
    .mega-item-title{
      font-weight:600;font-size:.9rem;color:var(--dark);
    }
    
    .mega-item-desc{
      font-size:.8rem;color:#6b7280;line-height:1.4; /* Adjusted for compact layout */
    }
    
    /* Icon styles */
    .addendas-icon{background:#ecfdf5;}
    .invoice-icon{background:#ecfdf5;}
    .billing-icon{background:#ecfdf5;}
    .payroll-icon{background:#ecfdf5;}
    .self-invoice-icon{background:#ecfdf5;}
    .addons-icon{background:#ecfdf5;}
    .qr-icon{background:#ecfdf5;}
    .whatsapp-icon{background:#ecfdf5;}
    .website-icon{background:#ecfdf5;}
    .dashboard-icon{background:#ecfdf5;}
    .agenda-icon{background:#ecfdf5;}
    .messages-icon{background:#ecfdf5;}
    .share-icon{background:#ecfdf5;}
    .api-icon{background:#ecfdf5;}
    .sdk-icon{background:#ecfdf5;}
    .webhooks-icon{background:#ecfdf5;}
    .blog-icon{background:#ecfdf5;}
    .encyclopedia-icon{background:#ecfdf5;}
    .help-icon{background:#ecfdf5;}
    .data-icon{background:#ecfdf5;}
    .contact-icon{background:#ecfdf5;}
    
    /* Mobile menu icons */
    .mobile-item-icon{
      width:32px;height:32px;border-radius:6px;background:#ecfdf5;
      display:flex;align-items:center;justify-content:center;flex-shrink:0;
    }

    .btn{font-size:1rem;font-weight:700;padding:1rem 2.5rem;border-radius:var(--btn-radius);}
    .nav-actions .btn{
      border:1px solid var(--primary);
      transition:.25s;
    }
    .btn-outline{background:none;color:var(--primary);}
    .btn-outline:hover{background:var(--primary-hover);color:var(--light);}
    .btn-fill{background:var(--primary);color:var(--light);}
    .btn-fill:hover{background:var(--primary-hover);}

.nav-icon{
  display:flex;align-items:center;justify-content:center;
  width:2.375rem;height:2.375rem;
  border:1px solid var(--primary);border-radius:10px;
  color:var(--primary);transition:background .25s ease,color .25s ease;
}
.nav-icon:hover{background:var(--primary-hover);color:var(--light);}


    /* Hamburger & drawer */
    #menu-toggle{display:none;}
    .hamburger{display:none;flex-direction:column;gap:4px;width:26px;height:20px;justify-content:center;cursor:pointer;}
    .hamburger span{height:3px;background:var(--dark);border-radius:2px;transition:.3s;}
    .mobile-menu{
      position:fixed;top:0;right:-100%;width:80%;height:100%;
      background:var(--bg-top);color:var(--dark);padding:4rem 2rem;
      display:flex;flex-direction:column;gap:2rem;transition:right .4s ease;z-index:999;
      box-shadow:-2px 0 8px rgba(0,0,0,0.05);
    }
    .mobile-menu a{font-size:1.1rem;display:flex;align-items:center;gap:.75rem;}
    .mobile-menu a svg{width:48px;height:48px;stroke:var(--primary);stroke-width:2;fill:none;}
    .mobile-menu a img{width:48px;height:48px;}
    .accordion-toggle{background:none;border:none;display:flex;justify-content:space-between;align-items:center;font-size:1.1rem;font-weight:600;color:var(--dark);cursor:pointer;}
    .accordion-toggle:after{content:"\25BC";transition:transform .2s;font-size:.75rem;}
    .accordion.open .accordion-toggle:after{transform:rotate(180deg);}
    .accordion-panel{display:none;flex-direction:column;gap:1rem;margin-top:.5rem;padding-left:1rem;}
    .accordion.open .accordion-panel{display:flex;}
    #menu-toggle:checked~.mobile-menu{right:0;}
    #menu-toggle:checked~label .hamburger span:nth-child(1){transform:rotate(45deg) translateY(8px);}
    #menu-toggle:checked~label .hamburger span:nth-child(2){opacity:0;}
    #menu-toggle:checked~label .hamburger span:nth-child(3){transform:rotate(-45deg) translateY(-8px);}

    /* ---------- Utilities ---------- */
    section{max-width:1200px;margin:var(--section-margin) auto;padding:var(--section-padding) 2rem;}
    h1,h3{font-weight:700;}
    h2{font-size:2.5rem;font-weight:600;margin-bottom:2rem;text-align:center;}

    .btn-primary{
      background:var(--primary);color:var(--light);border:none;
      border-radius:var(--btn-radius);padding:1rem 2.5rem;
      font-weight:700;font-size:1rem;cursor:pointer;transition:background .3s;
    }
    .btn-primary:hover{background:var(--primary-hover);}

    .grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
    .card{background:var(--card-bg);padding:var(--card-padding);border-radius:var(--card-radius);border:1px solid #eee;box-shadow:0 4px 10px rgba(0,0,0,0.05);transition:transform .3s,box-shadow .3s;}
    .card:hover{transform:translateY(-6px);box-shadow:0 8px 20px rgba(0,0,0,0.1);}
    .card h3{color:var(--primary);font-size:1.3rem;margin-bottom:1rem;} .card p{color:var(--gray);}
    section p,.card p{font-size:1.125rem;line-height:1.5;}

    .hero{
      padding:8rem 2rem 6rem;text-align:center;
      background:
        radial-gradient(circle at 30% 25%,var(--shine)0%,transparent 40%),
        radial-gradient(circle at 70% 75%,var(--shine)0%,transparent 45%),
        var(--light);
    }
    /* .hero h1 previously set to 3rem */
    .hero h1{font-size:4rem;font-weight:700;margin-bottom:1.5rem;}
    /* .hero p previously 1.25rem */
    .hero p{font-size:1.5rem;max-width:750px;margin:0 auto 2.5rem;}

    .cta-form{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;}
    .cta-form input{width:300px;padding:1rem;border:1px solid #ddd;border-radius:12px;font-size:1rem;background:var(--light);color:var(--dark);}

    .bg-alt{background:var(--bg-section);}

    .brand-image{
      position:relative;
      height:var(--media-base);
      overflow:hidden;
      padding-bottom:0;
      background:transparent;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .brand-image img{
      width:100%;
      height:100%;
      object-fit:cover;
      object-position:center;
      display:block;
      background:transparent;
    }

    .placeholder{position:relative;overflow:hidden;width:100%;height:0;padding-bottom:56%;background:var(--bg-section);border-radius:12px;}
    .placeholder::after{content:"PLACEHOLDER IMAGE";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#555;font-weight:600;font-size:1rem;}

    .faq-wrap{border-top:1px solid #eee;} .faq-item{border-bottom:1px solid #eee;}
    .faq-question{width:100%;padding:1.5rem 0;background:none;border:none;color:var(--dark);display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:1.1rem;font-weight:600;text-align:left;}
    .faq-icon{color:var(--primary);transition:transform .3s;}
    .faq-answer{max-height:0;overflow:hidden;color:var(--gray);transition:max-height .35s ease;padding-right:2rem;}
    .faq-item.open .faq-answer{max-height:200px;padding-bottom:1.25rem;} .faq-item.open .faq-icon{transform:rotate(180deg);}

    .metric{background:var(--card-bg);text-align:center;padding:2rem 1rem;border-radius:12px;border:1px solid #eee;box-shadow:0 4px 10px rgba(0,0,0,0.05);} .metric-number{font-size:2.5rem;color:var(--primary);} .metric-desc{margin-top:.5rem;color:var(--gray);}
    /* ---------- Footer ---------- */
    .site-footer{background:var(--footer-bg);color:var(--light);padding:40px 20px;}
    .site-footer a{color:var(--light);transition:color .2s ease;}
    .site-footer a:hover{color:var(--primary);}
    .footer-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:40px;max-width:1200px;margin:0 auto;}
    .footer-col h4{margin-bottom:1rem;font-size:1.1rem;color:var(--light);}
    .footer-col ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;}
    .footer-col li{line-height:1.4;}
    /* Increase logo size by 50% */
    .footer-brand img{width:180px;margin-bottom:1rem;}
    .footer-brand p{font-size:.95rem;line-height:1.4;}
    .footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,0.2);max-width:1200px;margin-left:auto;margin-right:auto;}
    .social-links{display:flex;gap:1rem;margin-bottom:1rem;}
    .social-links a svg{fill:currentColor;width:24px;height:24px;}
    .legal{font-size:.75rem;color:var(--light);}

    @media(max-width:600px){
      .footer-bottom{flex-direction:column;text-align:center;gap:1rem;}
    }

    @keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
    [data-animate]{animation:fadeIn .6s ease both;}

    @media(max-width:900px){.nav-center,.nav-actions{display:none;} .hamburger{display:flex;}}
    @media(max-width:768px){.hero h1{font-size:2.2rem;} h2{font-size:1.8rem;}}
