:root{
  --paper:#FEFDFA; --paper-warm:#FBF7EE; --mint-tint:#EAF7F0; --mint:#B9E6D2; --mint-deep:#5FBE97;
  --teal:#1B6E5D; --teal-deep:#0F4A3D; --gold:#F0AE4E; --gold-soft:#FBE6C4; --coral:#FF8A65; --coral-soft:#FFE3D8;
  --ink:#20302B; --ink-soft:#61716B; --line:#E8E2D0; --radius:18px; --max:1180px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--paper); color:var(--ink); font-family:'Inter', sans-serif; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden;}
h1,h2,h3,h4{font-family:'Bricolage Grotesque', sans-serif; font-weight:700; line-height:1.1; letter-spacing:-0.01em; color:var(--teal-deep);}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 32px; position:relative;}
.eyebrow{font-size:13px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--teal); display:flex; align-items:center; gap:8px;}
.eyebrow::before{content:""; width:18px; height:2px; background:var(--gold); display:inline-block;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:15px 28px; border-radius:999px; font-weight:700; font-size:15px; cursor:pointer; border:none; transition:transform .22s cubic-bezier(.34,1.56,.64,1), box-shadow .22s ease;}
.btn:hover{transform:translateY(-3px) scale(1.02);}
.btn:active{transform:translateY(0) scale(0.98);}
.btn-primary{background:var(--gold); color:var(--teal-deep); box-shadow:0 6px 0 #C88A2E;}
.btn-primary:hover{box-shadow:0 9px 0 #C88A2E;}
.btn-outline{background:var(--paper); color:var(--teal-deep); border:1.5px solid var(--line); box-shadow:0 4px 0 var(--line);}
.btn-outline:hover{border-color:var(--teal); box-shadow:0 6px 0 var(--line);}
.btn-dark{background:var(--teal-deep); color:var(--paper); box-shadow:0 6px 0 #082A21;}
.btn-dark:hover{box-shadow:0 8px 0 #082A21;}
.btn-sm{padding:11px 20px; font-size:13.5px;}

.blob{position:absolute; border-radius:50%; filter:blur(2px); opacity:0.55; pointer-events:none; animation:float 7s ease-in-out infinite;}
@keyframes float{0%,100%{transform:translateY(0) translateX(0);} 50%{transform:translateY(-18px) translateX(8px);}}
@keyframes floatSlow{0%,100%{transform:translateY(0);} 50%{transform:translateY(-12px);}}
@keyframes pulse{0%,100%{transform:scale(1); opacity:0.7;} 50%{transform:scale(1.12); opacity:1;}}
@keyframes spinSlow{from{transform:rotate(0deg);} to{transform:rotate(360deg);}}
@keyframes gradientShift{0%,100%{background-position:0% 50%;} 50%{background-position:100% 50%;}}
@keyframes bob{0%,100%{transform:translateY(0) rotate(var(--r,0deg));} 50%{transform:translateY(-14px) rotate(var(--r,0deg));}}
@keyframes sparkle{0%,100%{opacity:0.3; transform:scale(0.8);} 50%{opacity:1; transform:scale(1.15);}}
@keyframes cardFloat{0%,100%{transform:rotate(-2deg) translateY(0);} 50%{transform:rotate(-2deg) translateY(-16px);}}
@keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* reveal variants */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1);}
.reveal.in-view{opacity:1; transform:translateY(0);}
.reveal-l{opacity:0; transform:translateX(-40px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1);}
.reveal-l.in-view{opacity:1; transform:translateX(0);}
.reveal-r{opacity:0; transform:translateX(40px); transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1);}
.reveal-r.in-view{opacity:1; transform:translateX(0);}
.reveal-zoom{opacity:0; transform:scale(0.9); transition:opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1);}
.reveal-zoom.in-view{opacity:1; transform:scale(1);}
.delay-1{transition-delay:.08s;} .delay-2{transition-delay:.16s;} .delay-3{transition-delay:.24s;} .delay-4{transition-delay:.32s;}
@media (prefers-reduced-motion: reduce){ .reveal,.reveal-l,.reveal-r,.reveal-zoom{opacity:1; transform:none; transition:none;} .blob{animation:none;} }

/* HEADER */
header{position:sticky; top:0; z-index:50; background:rgba(254,253,250,0.85); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
nav{display:flex; align-items:center; justify-content:space-between; padding:10px 32px; max-width:var(--max); margin:0 auto;}
.logo{display:flex; align-items:center;}
.logo img{height:46px; width:auto; transition:transform .3s ease;}
.logo:hover img{transform:scale(1.05);}
@media (max-width:850px){ .logo img{height:38px;} }
.nav-links{display:flex; gap:6px; font-size:14px; font-weight:600; color:var(--ink-soft);}
.nav-links a{position:relative; display:flex; align-items:center; gap:7px; padding:9px 16px; border-radius:999px; transition:background .22s ease, color .22s ease, transform .22s ease;}
.nav-links a .nav-ico{font-size:15px; transform:translateY(-1px);}
.nav-links a:hover{color:var(--teal-deep); background:var(--mint-tint); transform:translateY(-2px);}
.nav-links a.active{color:var(--teal-deep); background:var(--mint-tint);}
.nav-toggle{display:none; background:none; border:none; font-size:24px; cursor:pointer; color:var(--teal-deep);}
@media (max-width:850px){
  .nav-links{position:fixed; inset:64px 0 auto 0; flex-direction:column; gap:4px; background:var(--paper); padding:16px 24px 24px; border-bottom:1px solid var(--line); transform:translateY(-120%); transition:transform .3s ease; box-shadow:0 20px 40px -20px rgba(15,74,61,0.25);}
  .nav-links.open{transform:translateY(0);}
  .nav-links a{padding:12px 16px;}
  .nav-toggle{display:block;}
}

/* PAGE HERO (inner pages) */
.page-hero{position:relative; overflow:hidden; padding:70px 0 60px; background:linear-gradient(180deg, var(--mint-tint) 0%, var(--paper) 100%); text-align:center;}
.page-hero .blob-a{width:300px; height:300px; background:var(--mint); top:-100px; right:-80px; animation-duration:9s;}
.page-hero .blob-b{width:150px; height:150px; background:var(--gold-soft); bottom:-40px; left:-40px; animation-duration:6s;}
.page-hero .ring-deco{position:absolute; width:440px; height:440px; border:2px dashed var(--mint); border-radius:50%; opacity:0.35; top:-160px; left:50%; margin-left:-220px; animation:spinSlow 40s linear infinite; pointer-events:none;}
.page-hero h1{font-size:clamp(34px,5vw,52px); margin:16px 0 14px; position:relative; z-index:2;}
.page-hero h1 .grad{background:linear-gradient(90deg, var(--mint-deep), var(--teal), var(--gold), var(--mint-deep)); background-size:300% auto; -webkit-background-clip:text; background-clip:text; color:transparent; animation:gradientShift 6s ease infinite;}
.page-hero p{font-size:17px; color:var(--ink-soft); max-width:560px; margin:0 auto; position:relative; z-index:2;}
.breadcrumb{display:inline-flex; gap:8px; align-items:center; font-size:13px; color:var(--ink-soft); margin-top:20px; position:relative; z-index:2;}
.breadcrumb a:hover{color:var(--teal);}
.breadcrumb span{color:var(--mint-deep);}

/* HOME HERO */
.hero{position:relative; overflow:hidden; padding:64px 0 70px; background:linear-gradient(180deg, var(--mint-tint) 0%, var(--paper) 100%);}
.hero .blob-a{width:340px; height:340px; background:var(--mint); top:-100px; right:-80px; animation-duration:9s;}
.hero .blob-b{width:160px; height:160px; background:var(--gold-soft); bottom:20px; left:-50px; animation-duration:6s; animation-delay:1s;}
.hero .blob-c{width:70px; height:70px; background:var(--coral-soft); top:140px; left:40%; animation:pulse 4s ease-in-out infinite;}
.hero-ring-deco{position:absolute; width:520px; height:520px; border:2px dashed var(--mint); border-radius:50%; opacity:0.4; top:-140px; right:-160px; animation:spinSlow 40s linear infinite; pointer-events:none;}
.hero-dots{position:absolute; width:140px; height:140px; top:60%; right:6%; opacity:0.5; pointer-events:none; background-image:radial-gradient(var(--mint-deep) 2.5px, transparent 2.5px); background-size:18px 18px;}
.hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; position:relative; z-index:2;}
@media (max-width:900px){ .hero-grid{grid-template-columns:1fr;} }
.hero-badge{display:inline-flex; align-items:center; gap:8px; background:var(--paper); border:1px solid var(--line); padding:7px 16px 7px 8px; border-radius:999px; font-size:12.5px; font-weight:700; color:var(--teal-deep); margin-bottom:18px; box-shadow:0 6px 16px -8px rgba(15,74,61,0.25);}
.hero-badge .pulse-dot{width:9px; height:9px; border-radius:50%; background:var(--mint-deep); position:relative;}
.hero-badge .pulse-dot::after{content:""; position:absolute; inset:-4px; border-radius:50%; border:2px solid var(--mint-deep); animation:pulse 1.8s ease-in-out infinite;}
.hero h1{font-size:clamp(40px, 5.6vw, 64px); margin:0 0 20px; color:var(--teal-deep);}
.hero h1 .grad{font-style:normal; background:linear-gradient(90deg, var(--mint-deep), var(--teal), var(--gold), var(--mint-deep)); background-size:300% auto; -webkit-background-clip:text; background-clip:text; color:transparent; animation:gradientShift 6s ease infinite; display:inline-block;}
.hero p.lead{font-size:18px; color:var(--ink-soft); max-width:480px; margin-bottom:32px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px;}
.hero-trust{display:flex; gap:30px; flex-wrap:wrap; padding-top:22px; border-top:1px solid var(--line);}
.hero-trust div strong{display:block; font-size:22px; font-family:'Bricolage Grotesque',sans-serif; color:var(--teal-deep);}
.hero-trust div span{font-size:12.5px; color:var(--ink-soft);}
.hero-visual{position:relative; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;}
.hero-spot{position:absolute; width:80%; height:70%; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,0.9) 0%, rgba(220,240,230,0.55) 45%, transparent 72%); top:14%; left:10%; animation:pulse 6s ease-in-out infinite; z-index:1;}
.hero-pack{position:relative; z-index:2; width:94%; filter:drop-shadow(0 24px 30px rgba(15,74,61,0.28)); animation:floatSlow 5s ease-in-out infinite;}
@media (max-width:500px){ .hero-ring-deco{display:none;} }

/* MARQUEE strip */
.marquee-strip{background:var(--teal-deep); color:var(--paper); padding:16px 0; overflow:hidden; white-space:nowrap;}
.marquee-track{display:inline-flex; gap:48px; animation:marquee 22s linear infinite; will-change:transform;}
.marquee-track span{font-family:'Bricolage Grotesque',sans-serif; font-weight:600; font-size:16px; display:inline-flex; align-items:center; gap:12px;}
.marquee-track span::after{content:"✦"; color:var(--gold); margin-left:36px;}

section{padding:88px 0; position:relative;}
.section-head{max-width:640px; margin-bottom:48px;}
.section-head h2{font-size:clamp(28px,3.4vw,42px); margin-top:14px;}
.section-head p{color:var(--ink-soft); font-size:16px; margin-top:14px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.section-head.center .eyebrow{justify-content:center;}

/* ABOUT block */
.about-wrap{background:var(--paper-warm); border-radius:32px; padding:64px; position:relative; overflow:hidden;}
@media (max-width:700px){ .about-wrap{padding:36px 24px;} }
.about-wrap .blob-d{width:200px; height:200px; background:var(--mint); top:-60px; right:-60px;}
.about-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:center; position:relative; z-index:2;}
@media (max-width:900px){ .about-grid{grid-template-columns:1fr;} }
.about-media{background:var(--paper); border-radius:20px; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; box-shadow:0 16px 40px -18px rgba(15,74,61,0.2); position:relative; overflow:hidden;}
.about-media .glow{position:absolute; width:260px; height:260px; background:radial-gradient(circle, var(--mint-tint), transparent 70%); border-radius:50%; animation:floatSlow 6s ease-in-out infinite;}
.about-media img{width:78%; position:relative; z-index:2;}
.about-copy p{color:var(--ink-soft); margin-bottom:16px; font-size:16px;}
.pillars{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:26px;}
.pillar{background:var(--paper); border-radius:16px; padding:20px; box-shadow:0 8px 20px -12px rgba(15,74,61,0.15); transition:transform .25s ease, box-shadow .25s ease;}
.pillar:hover{transform:translateY(-5px); box-shadow:0 14px 26px -12px rgba(15,74,61,0.25);}
.pillar-icon{width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:10px; font-size:18px;}
.pillar:nth-child(1) .pillar-icon{background:var(--mint-tint);}
.pillar:nth-child(2) .pillar-icon{background:var(--gold-soft);}
.pillar:nth-child(3) .pillar-icon{background:var(--coral-soft);}
.pillar:nth-child(4) .pillar-icon{background:var(--mint-tint);}
.pillar h4{font-size:16px; margin-bottom:6px;}
.pillar p{font-size:13.5px; color:var(--ink-soft); margin:0;}

/* MISSION / VISION / VALUES rows */
.mv-row{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; margin-bottom:40px;}
.mv-row:nth-child(even) .mv-media{order:2;}
@media (max-width:800px){ .mv-row{grid-template-columns:1fr; gap:24px;} .mv-row:nth-child(even) .mv-media{order:0;} }
.mv-media{background:var(--mint-tint); border-radius:24px; aspect-ratio:16/11; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.mv-media img{width:78%; max-width:360px; position:relative; z-index:2; animation:floatSlow 5s ease-in-out infinite;}
.mv-media .mv-blob{position:absolute; width:180px; height:180px; border-radius:50%; background:var(--mint); opacity:0.35; filter:blur(4px); animation:pulse 5s ease-in-out infinite;}
.mv-copy h3{font-size:26px; margin-bottom:12px;}
.mv-copy p{color:var(--ink-soft); font-size:16px;}
.value-chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:8px;}
.value-chips span{background:var(--paper); border:1px solid var(--line); padding:8px 16px; border-radius:999px; font-size:14px; font-weight:600; color:var(--teal-deep); transition:transform .2s ease, background .2s ease;}
.value-chips span:hover{transform:translateY(-3px); background:var(--mint-tint);}

/* PRODUCT FILTER TABS (reference style) */
.product-filter{display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom:44px;}
.filter-tab{background:var(--paper); border:1.5px solid var(--line); color:var(--ink-soft); padding:10px 24px; border-radius:999px; font-weight:600; font-size:14px; cursor:pointer; transition:all .22s ease;}
.filter-tab:hover{border-color:var(--mint-deep); color:var(--teal-deep); transform:translateY(-2px);}
.filter-tab.active{background:var(--teal-deep); border-color:var(--teal-deep); color:var(--paper); box-shadow:0 6px 16px -6px rgba(15,74,61,0.4);}

/* PRODUCTS - clean cards for 3D package renders (own bg + shadow) */
.product-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
@media (max-width:1000px){ .product-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .product-grid{grid-template-columns:1fr;} }
.product-card{background:var(--paper); border:1px solid var(--line); border-radius:22px; overflow:hidden; transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease; display:flex; flex-direction:column;}
.product-card.hide{display:none;}
.product-card:hover{transform:translateY(-8px); box-shadow:0 22px 44px -18px rgba(15,74,61,0.25);}
.product-media{position:relative; padding:22px 22px 16px; display:flex; align-items:center; justify-content:center; min-height:200px; background:#FFFFFF; border-bottom:1px solid var(--line);}
.product-media .packshot{position:relative; z-index:2; width:100%; transition:transform .38s cubic-bezier(.22,1,.36,1);}
.product-card:hover .product-media .packshot{transform:translateY(-4px) scale(1.04);}
.product-tag{position:absolute; top:16px; left:16px; z-index:3; background:var(--gold); color:var(--teal-deep); font-size:11px; font-weight:800; padding:5px 11px; border-radius:999px; letter-spacing:0.03em; box-shadow:0 4px 10px -3px rgba(240,174,78,0.6);}
.product-info{padding:20px 22px 24px; display:flex; flex-direction:column; flex:1;}
.product-info h3{font-size:17px; margin-bottom:5px;}
.product-info .price{font-size:13px; color:var(--ink-soft); margin-bottom:14px;}
.product-info .price b{color:var(--teal-deep); font-size:16px;}
.product-feats{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px;}
.product-feats span{font-size:11px; background:var(--paper-warm); color:var(--ink-soft); padding:4px 9px; border-radius:999px; font-weight:600;}
.product-info .btn{margin-top:auto;}

/* FEATURES */
.feature-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:900px){ .feature-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .feature-grid{grid-template-columns:1fr;} }
.feature-card{background:var(--paper); border:1px solid var(--line); border-radius:20px; padding:30px 26px; transition:transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s ease, border-color .25s ease; position:relative; overflow:hidden;}
.feature-card:hover{transform:translateY(-8px); box-shadow:0 20px 40px -16px rgba(15,74,61,0.22); border-color:transparent;}
.feature-icon{width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:18px; font-size:24px;}
.feature-card:nth-child(3n+1) .feature-icon{background:var(--mint-tint);}
.feature-card:nth-child(3n+2) .feature-icon{background:var(--gold-soft);}
.feature-card:nth-child(3n) .feature-icon{background:var(--coral-soft);}
.feature-card h3{font-size:19px; margin-bottom:10px;}
.feature-card p{color:var(--ink-soft); font-size:14.5px;}

/* AUDIENCE */
.audience{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
@media (max-width:800px){ .audience{grid-template-columns:1fr;} }
.audience-panel{padding:42px 38px; border-radius:24px; position:relative; overflow:hidden; transition:transform .3s ease;}
.audience-panel:hover{transform:translateY(-6px);}
.audience-panel.consumer{background:linear-gradient(155deg, var(--mint-tint), var(--paper));}
.audience-panel.partner{background:linear-gradient(155deg, var(--gold-soft), var(--paper));}
.audience-panel h3{font-size:24px; margin:12px 0 10px;}
.audience-panel p{color:var(--ink-soft); margin-bottom:22px; font-size:15px;}
.check-list{list-style:none; margin-bottom:26px;}
.check-list li{display:flex; gap:10px; font-size:14.5px; color:var(--ink); margin-bottom:11px; align-items:flex-start;}
.check-list li::before{content:"✓"; color:var(--teal); font-weight:800; background:var(--paper); width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; flex-shrink:0; box-shadow:0 2px 6px rgba(15,74,61,0.15);}

/* STATS */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
@media (max-width:800px){ .stats{grid-template-columns:1fr 1fr;} }
.stat{background:var(--paper-warm); border-radius:20px; padding:32px 20px; text-align:center; transition:transform .25s ease;}
.stat:hover{transform:translateY(-6px);}
.stat strong{display:block; font-family:'Bricolage Grotesque',sans-serif; font-size:36px; color:var(--teal-deep);}
.stat span{font-size:13px; color:var(--ink-soft);}

/* TESTIMONIALS */
.testi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:900px){ .testi-grid{grid-template-columns:1fr;} }
.testi-card{background:var(--paper); border:1px solid var(--line); border-radius:20px; padding:28px; transition:transform .25s ease, box-shadow .25s ease;}
.testi-card:hover{transform:translateY(-6px); box-shadow:0 16px 32px -16px rgba(15,74,61,0.2);}
.testi-stars{color:var(--gold); font-size:14px; margin-bottom:12px; letter-spacing:2px;}
.testi-card p{font-size:15px; color:var(--ink); margin-bottom:18px; font-style:italic;}
.testi-person{display:flex; align-items:center; gap:12px;}
.testi-avatar{width:40px; height:40px; border-radius:50%; background:var(--mint-tint); display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; color:var(--teal-deep);}
.testi-person strong{display:block; font-size:14px;}
.testi-person span{font-size:12.5px; color:var(--ink-soft);}

/* CERTIFIED STRIP */
.certified{background:var(--paper-warm); border-radius:24px; padding:38px 40px; text-align:center;}
.certified .eyebrow{justify-content:center; margin-bottom:18px;}
.cert-row{display:flex; flex-wrap:wrap; justify-content:center; gap:14px;}
.cert-badge{display:flex; align-items:center; gap:10px; background:var(--paper); border:1px solid var(--line); padding:14px 22px; border-radius:16px; font-weight:700; color:var(--teal-deep); font-size:14px; box-shadow:0 6px 16px -10px rgba(15,74,61,0.2); transition:transform .22s ease, box-shadow .22s ease;}
.cert-badge:hover{transform:translateY(-4px); box-shadow:0 12px 24px -12px rgba(15,74,61,0.28);}
.cert-badge .cert-ic{width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:17px;}
.cert-badge:nth-child(1) .cert-ic{background:var(--mint-tint);}
.cert-badge:nth-child(2) .cert-ic{background:var(--gold-soft);}
.cert-badge:nth-child(3) .cert-ic{background:var(--coral-soft);}
.cert-badge:nth-child(4) .cert-ic{background:var(--mint-tint);}
.cert-badge:nth-child(5) .cert-ic{background:var(--gold-soft);}
.cert-badge small{display:block; font-size:11px; color:var(--ink-soft); font-weight:600;}
.cta-banner{background:linear-gradient(135deg, var(--teal), var(--teal-deep)); border-radius:32px; padding:56px; text-align:center; position:relative; overflow:hidden;}
.cta-banner .blob{background:rgba(255,255,255,0.08); filter:blur(0);}
.cta-banner .cb1{width:200px; height:200px; top:-60px; left:-40px;}
.cta-banner .cb2{width:140px; height:140px; bottom:-50px; right:-30px; animation-delay:1s;}
.cta-banner h2{color:var(--paper); font-size:clamp(26px,3.4vw,40px); position:relative; z-index:2;}
.cta-banner p{color:rgba(255,255,255,0.8); max-width:520px; margin:14px auto 28px; position:relative; z-index:2;}
.cta-banner .btn{position:relative; z-index:2;}

/* CONTACT */
.contact-wrap{background:linear-gradient(155deg, var(--mint-tint), var(--paper-warm)); border-radius:32px; padding:64px; position:relative; overflow:hidden;}
@media (max-width:700px){ .contact-wrap{padding:36px 22px;} }
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; position:relative; z-index:2;}
@media (max-width:900px){ .contact-grid{grid-template-columns:1fr;} }
.contact-info h2{font-size:clamp(26px,3vw,36px);}
.contact-info p{color:var(--ink-soft); margin:16px 0 28px; max-width:420px;}
.contact-detail{display:flex; gap:14px; margin-bottom:16px; font-size:14.5px; align-items:center;}
.contact-detail .ico{width:40px; height:40px; border-radius:12px; background:var(--paper); display:flex; align-items:center; justify-content:center; box-shadow:0 4px 10px -4px rgba(15,74,61,0.2); flex-shrink:0; font-size:18px;}
.contact-detail b{color:var(--teal-deep); display:block; font-size:13px;}
.contact-detail small{color:var(--ink-soft); font-size:12px; text-transform:uppercase; letter-spacing:0.06em;}
form{background:var(--paper); border-radius:22px; padding:32px; display:grid; gap:16px; box-shadow:0 24px 60px -24px rgba(15,74,61,0.3);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media (max-width:500px){ .form-row{grid-template-columns:1fr;} }
label{font-size:13px; font-weight:600; color:var(--ink-soft); margin-bottom:6px; display:block;}
input, select, textarea{width:100%; padding:12px 14px; border-radius:10px; border:1.5px solid var(--line); font-family:'Inter',sans-serif; font-size:14.5px; background:var(--paper-warm); color:var(--ink); transition:border-color .2s ease;}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--mint-deep); background:var(--paper);}
textarea{resize:vertical; min-height:90px;}
.form-note{font-size:12px; color:var(--ink-soft);}

/* FAQ */
.faq{max-width:760px; margin:0 auto;}
.faq-item{background:var(--paper); border:1px solid var(--line); border-radius:16px; margin-bottom:14px; overflow:hidden; transition:box-shadow .25s ease;}
.faq-item:hover{box-shadow:0 10px 24px -14px rgba(15,74,61,0.2);}
.faq-q{padding:20px 24px; font-weight:700; color:var(--teal-deep); cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-size:15.5px;}
.faq-q .plus{transition:transform .3s ease; color:var(--mint-deep); font-size:22px;}
.faq-item.open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .35s ease; color:var(--ink-soft); font-size:14.5px;}
.faq-a div{padding:0 24px 20px;}

/* FOOTER */
footer{background:var(--paper-warm); color:var(--ink-soft); border-top:1px solid var(--line); padding:56px 0 32px; font-size:13.5px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1.3fr; gap:40px; margin-bottom:36px;}
@media (max-width:800px){ .footer-grid{grid-template-columns:1fr; gap:28px;} }
.footer-col h4{font-size:14px; color:var(--teal-deep); margin-bottom:14px; text-transform:uppercase; letter-spacing:0.08em;}
.footer-col img{height:44px; margin-bottom:14px;}
.footer-col p{margin-bottom:10px; max-width:280px;}
.footer-col ul{list-style:none;}
.footer-col ul li{margin-bottom:9px;}
.footer-col ul li a{transition:color .2s ease, padding-left .2s ease;}
.footer-col ul li a:hover{color:var(--teal-deep); padding-left:4px;}
.footer-contact div{display:flex; gap:10px; margin-bottom:12px; align-items:flex-start;}
.footer-contact .fi{font-size:16px;}
.footer-bottom{border-top:1px solid var(--line); padding-top:22px; text-align:center; display:flex; justify-content:center; align-items:center; gap:10px; flex-wrap:wrap;}
.footer-social{display:flex; gap:10px; margin-top:14px;}
.footer-social a{width:36px; height:36px; border-radius:10px; background:var(--paper); display:flex; align-items:center; justify-content:center; box-shadow:0 4px 10px -4px rgba(15,74,61,0.15); transition:transform .2s ease, background .2s ease;}
.footer-social a:hover{transform:translateY(-3px); background:var(--mint-tint);}

/* scroll progress bar */
.scroll-progress{position:fixed; top:0; left:0; height:3px; width:0; background:linear-gradient(90deg, var(--mint-deep), var(--gold)); z-index:100; transition:width .1s linear;}