/* Global & Variables */
* { margin: 0; padding: 0; box-sizing: border-box; }
:root { --primary-green:#22c55e; --dark-green:#16a34a; --light-green:#86efac; --bg-light:#f0fdf4; --text-dark:#052e16; --white:#ffffff; --gray:#6b7280; }
html{overflow-x:hidden}
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; color:var(--text-dark); overflow-x:hidden; line-height:1.6; }

/* Animations */
@keyframes fadeInUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
@keyframes slideInRight { from{opacity:0;transform:translateX(-50px)} to{opacity:1;transform:translateX(0)} }
@keyframes pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.05)} }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-20px)} }
@keyframes gradientShift { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }

/* Header */
.header{background:rgba(255,255,255,.95); backdrop-filter:blur(10px); position:fixed; width:100%; top:0; z-index:1000; box-shadow:0 2px 20px rgba(0,0,0,.05); transition:all .3s ease}
.header.scrolled{box-shadow:0 4px 30px rgba(0,0,0,.1)}
.nav{max-width:1200px; margin:0 auto; padding:20px 24px; display:flex; justify-content:space-between; align-items:center}
.logo{font-size:28px; font-weight:800; background:linear-gradient(135deg,var(--primary-green),var(--dark-green)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:pulse 2s infinite}
.nav-menu{display:flex; list-style:none; gap:40px}
.nav-menu a{text-decoration:none; color:var(--text-dark); font-weight:500; position:relative; transition:color .3s}
.nav-menu a::after{content:""; position:absolute; bottom:-5px; left:0; width:0; height:2px; background:var(--primary-green); transition:width .3s}
.nav-menu a:hover{color:var(--primary-green)}
.nav-menu a:hover::after{width:100%}

/* Brand */
.brand{display:flex; flex-direction:column; align-items:flex-start; line-height:1.1}
.brand-title{font-size:2rem; font-weight:800; background:linear-gradient(135deg,var(--primary-green),var(--dark-green)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:pulse 2s infinite}
.brand-subtitle{font-size:.95rem; color:var(--primary-green); font-weight:500; margin-top:2px}

/* Hero */
.hero{margin-top:80px; min-height:600px; background:linear-gradient(135deg,var(--bg-light) 0%,var(--white) 100%); position:relative; overflow:hidden; display:flex; align-items:center}
.hero::before{content:""; position:absolute; width:500px; height:500px; background:radial-gradient(circle,var(--light-green) 0%,transparent 70%); top:-200px; right:-200px; opacity:.3; animation:float 6s ease-in-out infinite}
.hero::after{content:""; position:absolute; width:400px; height:400px; background:radial-gradient(circle,var(--primary-green) 0%,transparent 70%); bottom:-150px; left:-150px; opacity:.2; animation:float 8s ease-in-out infinite}
.hero-content{width:100%; max-width:100%; margin:0 auto; padding:80px 24px; position:relative; z-index:1; text-align:center}
.hero h1{font-size:clamp(24px,6vw,44px); font-weight:800; color:var(--text-dark); margin-bottom:24px; animation:fadeInUp .8s ease-out; line-height:1.2}
.hero h1 span{background:linear-gradient(135deg,var(--primary-green),var(--dark-green)); -webkit-background-clip:text; -webkit-text-fill-color:transparent}
.hero p{font-size:clamp(16px,3.5vw,22px); color:var(--gray); margin-bottom:48px; animation:fadeInUp .8s ease-out .2s both}

/* Hero actions */
.hero-actions{display:flex; gap:24px; justify-content:center; margin-bottom:32px; flex-wrap:wrap}

.cta-button{display:inline-block; background:linear-gradient(135deg,var(--primary-green),var(--dark-green)); color:#fff; padding:20px 48px; font-size:18px; font-weight:600; border:none; border-radius:50px; cursor:pointer; text-decoration:none; transition:all .3s; animation:fadeInUp .8s ease-out .4s both; position:relative; overflow:hidden; box-shadow:0 10px 30px rgba(34,197,94,.3)}
.cta-button::before{content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent); transition:left .6s}
.cta-button:hover{transform:translateY(-3px); box-shadow:0 15px 40px rgba(34,197,94,.4)}
.cta-button:hover::before{left:100%}
/* Outline button variant */
.cta-button--outline{background:var(--white); color:var(--primary-green); border:2px solid var(--primary-green); box-shadow:none}

/* Trust Badges */
.trust-badges{display:flex; justify-content:center; gap:40px; margin-top:60px; animation:fadeInUp .8s ease-out .6s both}
.badge{text-align:center}
.badge-number{font-size:36px; font-weight:800; color:var(--primary-green); display:block}
.badge-text{font-size:14px; color:var(--gray)}

/* Hero note */
.hero-note{margin-top:32px; text-align:center; font-size:13px; color:#6b7280}
.hero-note a{color:var(--primary-green); text-decoration:underline}
.hero-note-asterisk{font-size:16px; vertical-align:super; line-height:0}

/* Hero marquee wrapper */
.marquee-wrapper--hero{overflow:hidden; width:100%; background:transparent; margin:32px 0 0 0}
.marquee-wrapper--hero .marquee{white-space:nowrap; font-size:18px; color:var(--dark-green); font-weight:600; padding:8px 0}

/* Features */
.features{padding:100px 24px; background:var(--white)}
.features-container{max-width:1200px; margin:0 auto}
.features h2{text-align:center; font-size:clamp(26px,7vw,36px); font-weight:800; margin-bottom:40px; color:var(--text-dark); line-height:1.2}
.features-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(350px,1fr)); gap:40px; align-items:stretch}
.feature-card{background:var(--white); padding:48px; border-radius:24px; box-shadow:0 10px 40px rgba(0,0,0,.05); transition:all .4s ease; position:relative; overflow:hidden; opacity:0; animation:fadeInUp .6s ease-out forwards; height:100%; display:flex; flex-direction:column}
.feature-card:nth-child(1){animation-delay:.1s}
.feature-card:nth-child(2){animation-delay:.2s}
.feature-card:nth-child(3){animation-delay:.3s}
.feature-card::before{content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--primary-green),var(--dark-green)); transform:scaleX(0); transform-origin:left; transition:transform .4s ease}
.feature-card:hover{transform:translateY(-10px); box-shadow:0 20px 60px rgba(0,0,0,.1)}
.feature-card:hover::before{transform:scaleX(1)}
.feature-icon{width:80px; height:80px; min-height:80px; background:linear-gradient(135deg,var(--light-green),var(--primary-green)); border-radius:20px; display:flex; align-items:center; justify-content:center; font-size:40px; margin-bottom:24px; animation:float 4s ease-in-out infinite}
@media (max-width:480px){ .feature-icon{width:56px; height:56px; min-height:56px; font-size:28px; border-radius:14px} }
.feature-card h3{font-size:clamp(18px,5.4vw,20px); font-weight:700; margin-bottom:16px; color:var(--text-dark); min-height:48px; display:flex; align-items:flex-end}
.feature-card p{color:var(--gray); line-height:1.8; min-height:60px; display:flex; align-items:flex-start}

/* Documents */
.documents{background:linear-gradient(135deg,var(--bg-light) 0%,var(--white) 100%); padding:100px 24px; position:relative}
.documents-container{max-width:1200px; margin:0 auto}
.documents h2{text-align:center; font-size:clamp(26px,7vw,36px); font-weight:800; margin-bottom:40px; color:var(--text-dark); line-height:1.2}
.documents-grid{display:grid !important; grid-template-columns:repeat(4,1fr); gap:24px; max-width:1200px; margin:0 auto}
@media (max-width:900px){ .documents-grid{grid-template-columns:1fr; gap:16px} }
.doc-item{background:var(--white); padding:32px; border-radius:16px; display:flex; align-items:center; gap:24px; transition:all .3s ease; position:relative; overflow:hidden; opacity:0; animation:slideInRight .6s ease-out forwards}
.doc-item:nth-child(1){animation-delay:.1s}
.doc-item:nth-child(2){animation-delay:.2s}
.doc-item:nth-child(3){animation-delay:.3s}
.doc-item:nth-child(4){animation-delay:.4s}
.doc-item:nth-child(5){animation-delay:.5s}
.doc-item::before{content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--primary-green); transform:scaleY(0); transition:transform .3s ease}
.doc-item:hover{transform:translateX(10px); box-shadow:0 10px 30px rgba(0,0,0,.1)}
.doc-item:hover::before{transform:scaleY(1)}
.doc-number{font-size:28px; font-weight:800; color:var(--primary-green); min-width:44px}
.doc-content h3{font-size:18px; font-weight:600; margin-bottom:4px; color:var(--text-dark)}
.doc-content p{color:var(--gray); font-size:14px}

/* Steps */
.steps{padding:100px 24px; background:var(--white); position:relative}
.steps-container{max-width:1200px; margin:0 auto}
.steps h2{text-align:center; font-size:clamp(26px,7vw,36px); font-weight:800; margin-bottom:48px; color:var(--text-dark); line-height:1.2}
.steps-timeline{display:flex; justify-content:space-between; position:relative; padding:0 40px}
.steps-timeline::before{content:""; position:absolute; top:30px; left:80px; right:80px; height:3px; background:linear-gradient(90deg,var(--primary-green) 0%,var(--dark-green) 100%); opacity:.3}
.step{flex:1; text-align:center; position:relative; opacity:0; animation:fadeInUp .6s ease-out forwards}
.step:nth-child(1){animation-delay:.1s}
.step:nth-child(2){animation-delay:.3s}
.step:nth-child(3){animation-delay:.5s}
.step:nth-child(4){animation-delay:.7s}
.step-icon{width:60px; height:60px; background:linear-gradient(135deg,var(--primary-green),var(--dark-green)); border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:24px; font-weight:bold; margin:0 auto 24px; position:relative; z-index:1; transition:transform .3s ease}
.step:hover .step-icon{transform:scale(1.2) rotate(360deg)}
.step h3{font-size:clamp(18px,4.8vw,20px); font-weight:600; margin-bottom:12px; color:var(--text-dark)}
.step p{color:var(--gray); font-size:14px; max-width:200px; margin:0 auto}

/* CTA */
.cta-section{background:linear-gradient(135deg,var(--primary-green),var(--dark-green)); padding:80px 24px; text-align:center; position:relative; overflow:hidden}
.cta-section::before,.cta-section::after{content:""; position:absolute; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.1)}
.cta-section::before{top:-150px; left:-150px; animation:float 6s ease-in-out infinite}
.cta-section::after{bottom:-150px; right:-150px; animation:float 8s ease-in-out infinite reverse}
.cta-content{position:relative; z-index:1; max-width:800px; margin:0 auto}
.cta-content h2{font-size:40px; font-weight:800; color:#fff; margin-bottom:20px}
.cta-content p{font-size:20px; color:rgba(255,255,255,.9); margin-bottom:28px}
.cta-button-white{background:#fff; color:var(--primary-green); padding:20px 48px; font-size:18px; font-weight:600; border:none; border-radius:50px; cursor:pointer; text-decoration:none; display:inline-block; transition:all .3s; box-shadow:0 10px 30px rgba(0,0,0,.2)}
.cta-button-white:hover{transform:translateY(-3px); box-shadow:0 15px 40px rgba(0,0,0,.3)}

/* Footer */
.footer{background:var(--text-dark); color:#fff; padding:40px 20px 28px}
.footer-content{max-width:1200px; margin:0 auto; padding:0 16px; display:flex; flex-direction:row; justify-content:flex-start; align-items:flex-start; gap:32px; flex-wrap:wrap; margin-bottom:24px}
.footer-about{flex:1 1 600px; min-width:260px}
.footer-contacts{flex:1 1 400px; min-width:220px; margin-left:auto; text-align:right}
.footer-text{color:#e5e7eb; font-size:16px}
.footer-phone{color:#e5e7eb; font-size:18px; font-weight:600; text-decoration:none}
.footer-bottom{text-align:center; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.6)}
.footer-column h3,.footer-content h3{font-size:20px; margin-bottom:12px; color:var(--primary-green)}
@media (max-width:768px){ .nav-menu{display:none} .trust-badges{flex-wrap:wrap; gap:20px} .features-grid{grid-template-columns:1fr} .documents-grid{grid-template-columns:1fr} .steps-timeline{flex-direction:column; gap:24px; padding:0} .steps-timeline::before{display:none} .footer{padding:28px 16px 20px} .footer-content{flex-direction:column; gap:12px; text-align:center; align-items:center; margin-bottom:12px; padding:0} .footer-about{flex-basis:auto} .footer-contacts{margin-left:0; text-align:center} .brand-title{font-size:1.5rem} }

@media (max-width:480px){
  .nav{padding:14px 16px}
  .hero{min-height:auto; padding:24px 0}
  .hero-content{padding:56px 16px}
  .hero h1{font-size:28px}
  .hero p{font-size:16px; margin-bottom:24px}
  .hero-actions{flex-direction:column; align-items:stretch; gap:12px; margin-bottom:20px}
  .cta-button{width:100%; max-width:none; padding:16px 20px}
  .cta-button--outline{width:100%; max-width:none}
  .badge-number{font-size:26px}
  .brand-title{font-size:1.25rem}
  .brand-subtitle{font-size:.85rem}
  .marquee{font-size:14px}
  .marquee-wrapper--hero{margin-top:16px}
  .marquee{animation-duration:40s}
  .features{padding:40px 16px}
  .documents{padding:40px 16px}
  .steps{padding:40px 16px}
  .cta-content h2{font-size:clamp(22px,8vw,28px)}
  .cta-content p{font-size:15px}
}

/* Ultra-narrow safety (prevents accidental horizontal scroll) */
@media (max-width:360px){
  .hero h1{font-size:24px}
  .hero p{font-size:15px}
  .marquee{animation-play-state:paused}
}

/* Modal */
.modal-overlay{position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.7); display:none; justify-content:center; align-items:center; z-index:2000; padding:20px; opacity:0; transition:opacity .3s ease}
.modal-overlay.active{display:flex; opacity:1}
.modal-content{background:#fff; border-radius:24px; width:100%; max-width:700px; max-height:90vh; overflow-y:auto; position:relative; transform:scale(.9); transition:transform .3s ease; box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal-overlay.active .modal-content{transform:scale(1)}
.modal-content--narrow{max-width:400px}
.modal-header{padding:30px 40px; border-bottom:1px solid #eee; display:flex; justify-content:space-between; align-items:center; position:sticky; top:0; background:#fff; z-index:10; border-radius:24px 24px 0 0}
.modal-title{font-size:24px; font-weight:700; color:var(--text-dark)}
.modal-close{width:40px; height:40px; border-radius:50%; border:none; background:var(--bg-light); color:var(--text-dark); font-size:24px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s}
.modal-close:hover{background:var(--primary-green); color:#fff; transform:rotate(90deg)}
.modal-body{padding:40px}
@media (max-width:768px){ .modal-header{padding:20px} .modal-body{padding:20px} .modal-title{font-size:20px} }

/* FAQ */
.faq-section{background:#f0fdf4; padding:80px 24px}
.faq-container{max-width:800px; margin:0 auto}
.section-title{text-align:center; font-size:clamp(26px,7vw,36px); font-weight:800; margin-bottom:32px; color:var(--text-dark)}
.faq-list{display:flex; flex-direction:column; gap:16px}
.faq-item{background:#fff; border-radius:18px; box-shadow:0 4px 32px rgba(34,197,94,.07); overflow:hidden; transition:box-shadow .25s, border .25s; border:1.5px solid #e6fbe9}
.faq-item.open{box-shadow:0 8px 40px rgba(34,197,94,.13); border:1.5px solid var(--primary-green)}
.faq-question{width:100%; text-align:left; background:none; border:none; outline:none; font-size:clamp(16px,4.8vw,21px); font-weight:700; color:var(--text-dark); padding:24px 56px 24px 24px; cursor:pointer; position:relative; transition:background .2s; display:flex; align-items:center; line-height:1.35}
.faq-item.open .faq-question{background:#f0fdf4}
.faq-question::after{content:""; display:inline-block; margin-left:auto; width:22px; height:22px; border-radius:50%; background:#e6fbe9; box-shadow:0 2px 8px rgba(34,197,94,.07); position:absolute; right:24px; top:50%; transform:translateY(-50%) rotate(0deg); transition:background .2s, transform .3s cubic-bezier(.4,2,.6,1), box-shadow .2s}
.faq-question::before{content:""; position:absolute; right:34px; top:50%; width:8px; height:8px; border-bottom:2.5px solid var(--primary-green); border-right:2.5px solid var(--primary-green); transform:translateY(-60%) rotate(45deg); transition:transform .3s cubic-bezier(.4,2,.6,1)}
.faq-item.open .faq-question::after{background:var(--primary-green); box-shadow:0 4px 16px rgba(34,197,94,.13)}
.faq-item.open .faq-question::before{transform:translateY(-60%) rotate(135deg); border-color:#fff}
.faq-answer{display:block; max-height:0; overflow:hidden; padding:0 24px; color:var(--gray); font-size:16px; line-height:1.6; background:#fff; opacity:0; will-change:max-height,opacity,padding; transition:max-height .6s cubic-bezier(.4,2,.6,1), opacity .5s, padding .5s}
.faq-item.open .faq-answer{padding:0 24px 20px 24px; max-height:500px; opacity:1; animation:none}

/* Marquee */
@keyframes marquee{ 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.marquee{display:flex; will-change:transform; width:max-content; animation:marquee 32s linear infinite}
.marquee-group{display:flex; align-items:center; gap:48px; flex-shrink:0}
@media (max-width:900px){ .marquee{font-size:16px} .marquee-group{gap:24px} }

/* Buttons hover tweaks */
#manager-submit:hover:enabled{background:linear-gradient(90deg,#16a34a 0%,#22c55e 100%); box-shadow:0 8px 32px rgba(34,197,94,.18)}

/* Manager form extracted styles */
#manager-form{display:flex; flex-direction:column; gap:14px; max-width:340px; margin:0 auto; background:#f8fdf9; border-radius:18px; box-shadow:0 4px 32px rgba(34,197,94,.07); padding:24px 18px 18px}
#manager-form input[type="text"],
#manager-form input[type="tel"]{padding:14px 16px; font-size:16px; border-radius:10px; border:1.5px solid #e5e7eb; background:#fff; transition:border .2s; outline:none; margin-bottom:4px}
#manager-form label{display:flex; align-items:flex-start; gap:8px; font-size:13px; color:#374151; margin:8px 0 0}
#manager-agree{accent-color:#22c55e; width:18px; height:18px; margin-top:2px}
#manager-form-success{display:none; color:var(--primary-green); text-align:center; margin-top:16px; font-size:18px}
#manager-submit{margin-top:12px; min-width:0; width:100%; height:48px; padding:0 24px; border-radius:14px; font-size:18px; font-weight:700; background:linear-gradient(90deg,#22c55e 0%,#16a34a 100%); box-shadow:0 4px 24px rgba(34,197,94,.10); transition:background .2s, box-shadow .2s; display:inline-flex; align-items:center; justify-content:center; line-height:1}

/* Partners marquee extracted */
.partners-marquee{width:100%; background:#fff; padding:0; margin:0}
.marquee-wrapper--partners{overflow:hidden; width:100%; background:#fff; border-top:1px solid #e6fbe9; border-bottom:1px solid #e6fbe9; padding:18px 0}
.marquee--partners{white-space:nowrap; font-size:20px; color:#16a34a; font-weight:600; padding:12px 0}

/* Global H2/H3 unify */
h2{font-size:clamp(26px,7vw,36px)}
h3{font-size:clamp(18px,5.5vw,22px); line-height:1.3}