/* ============================================================
   KAMII HERBALS — style.css  (Final Clean Version)
   NO external font imports — uses system fonts for instant load
   Edit :root variables to retheme the entire site
   ============================================================ */

:root {
  /* ── BRAND COLORS — edit these to retheme ── */
  --g900: #0b2e0b;
  --g800: #174d17;
  --g700: #1d6b1d;
  --g600: #2a8c2a;
  --g500: #38aa38;
  --g400: #56bf56;
  --g300: #7dd67d;
  --g100: #c8edc8;
  --g50:  #eaf7ea;
  --gold: #c8a84b;
  --cream:      #fdf8f0;
  --warm:       #fffef9;
  --txt:        #182818;
  --txt2:       #3a4e3a;
  --txt3:       #687868;
  --txt4:       #9ab09a;
  --white:      #ffffff;
  --bdr:        rgba(42,140,42,0.15);
  --sh1:        0 2px 12px rgba(23,77,23,0.07);
  --sh2:        0 8px 32px rgba(23,77,23,0.12);
  --sh3:        0 20px 60px rgba(23,77,23,0.16);
  /* ── FONTS — system stack, loads instantly ── */
  --fd: 'Georgia', 'Times New Roman', serif;
  --fb: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  /* ── SHAPE ── */
  --r1: 8px; --r2: 14px; --r3: 22px; --r4: 40px;
  --w:  1180px;
  --tr: 0.28s ease;
}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--cream);color:var(--txt2);line-height:1.7;overflow-x:hidden}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{font-family:var(--fb);cursor:pointer;border:none;outline:none}
input,textarea,select{font-family:var(--fb);outline:none}

/* ── LAYOUT ── */
.wrap{max-width:var(--w);margin:0 auto;padding:0 24px}
section{padding:80px 0}
.sec-head{text-align:center;margin-bottom:50px}
.lbl{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--g600);margin-bottom:12px}
.lbl::before,.lbl::after{content:'';display:inline-block;width:24px;height:1.5px;background:var(--g400)}
.stitle{font-family:var(--fd);font-size:clamp(28px,4vw,46px);color:var(--txt);margin-bottom:14px;line-height:1.2}
.ssub{color:var(--txt3);font-size:15px;max-width:540px;margin:0 auto;line-height:1.8}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:var(--r4);font-size:14px;font-weight:700;letter-spacing:.3px;transition:all var(--tr);white-space:nowrap;border:none;cursor:pointer}
.btn-g{background:var(--g600);color:#fff;box-shadow:0 4px 16px rgba(42,140,42,.3)}
.btn-g:hover{background:var(--g700);transform:translateY(-2px);box-shadow:0 8px 24px rgba(42,140,42,.4)}
.btn-o{border:2px solid var(--g600);color:var(--g700);background:transparent}
.btn-o:hover{background:var(--g600);color:#fff;transform:translateY(-2px)}
.btn-w{background:#fff;color:var(--g700)}
.btn-w:hover{background:var(--g50);transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:#fff;box-shadow:0 4px 14px rgba(200,168,75,.3)}
.btn-gold:hover{background:#a8902e;transform:translateY(-2px)}

/* ── TOPBAR ── */
.topbar{background:var(--g800);color:rgba(255,255,255,.72);font-size:12px;padding:6px 0}
.topbar-in{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px}
.topbar a{color:rgba(255,255,255,.72);transition:color var(--tr)}
.topbar a:hover{color:#fff}
.tl,.tr{display:flex;gap:18px;align-items:center}
.tsoc a{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.1);display:inline-flex;align-items:center;justify-content:center;font-size:10px;transition:background var(--tr)}
.tsoc a:hover{background:var(--g500);color:#fff}

/* ── NAVBAR ── */
.nav{background:rgba(255,255,255,.98);position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--bdr);transition:box-shadow var(--tr)}
.nav.scrolled{box-shadow:var(--sh2)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:70px}
.logo{display:flex;align-items:center;gap:10px}
.logo img{height:50px;width:auto}
.logo-txt{font-family:var(--fd);font-size:20px;font-weight:700;color:var(--g800)}
.links{display:flex;align-items:center;gap:2px}
.links a{padding:7px 15px;font-size:14px;font-weight:600;color:var(--txt2);border-radius:var(--r1);transition:all var(--tr);position:relative}
.links a:hover,.links a.active{color:var(--g700);background:var(--g50)}
.links a.active::after{content:'';position:absolute;bottom:3px;left:50%;transform:translateX(-50%);width:14px;height:2px;background:var(--g500);border-radius:2px}
.nav-cta{margin-left:8px}
.hbg{display:none;flex-direction:column;gap:5px;background:none;padding:6px;border:none}
.hbg span{display:block;width:22px;height:2px;background:var(--txt);border-radius:2px;transition:all .28s}
.hbg.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hbg.open span:nth-child(2){opacity:0}
.hbg.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
.mnav{display:none;flex-direction:column;padding:10px 20px 14px;border-top:1px solid var(--bdr);gap:2px;background:#fff}
.mnav.open{display:flex}
.mnav a{padding:10px 14px;border-radius:var(--r1);font-size:14px;font-weight:600;color:var(--txt2);transition:background var(--tr)}
.mnav a:hover,.mnav a.active{background:var(--g50);color:var(--g700)}
.mnav .btn{margin-top:8px;justify-content:center}

/* ── HERO SLIDER ── */
.slider{position:relative;overflow:hidden;height:88vh;min-height:520px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .85s ease;display:flex;align-items:center}
.slide.on{opacity:1;z-index:1}
.slide-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-color:var(--g800)}
.slide-ov{position:absolute;inset:0;background:linear-gradient(110deg,rgba(11,46,11,.86) 0%,rgba(23,77,23,.62) 55%,rgba(0,0,0,.12) 100%)}
.slide-cnt{position:relative;z-index:2;max-width:620px}
.slide.on .slide-cnt{animation:sup .75s ease both}
@keyframes sup{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
.sbadge{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);color:rgba(255,255,255,.88);font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:5px 14px;border-radius:28px;margin-bottom:18px}
.stit{font-family:var(--fd);font-size:clamp(34px,5.5vw,66px);color:#fff;line-height:1.1;margin-bottom:16px}
.stit em{color:var(--g300);font-style:italic}
.sdesc{color:rgba(255,255,255,.82);font-size:16px;line-height:1.75;margin-bottom:30px;max-width:480px}
.sbtns{display:flex;gap:12px;flex-wrap:wrap}
.sdots{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;gap:9px;z-index:10}
.dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.38);cursor:pointer;transition:all var(--tr);border:none}
.dot.on{background:#fff;width:26px;border-radius:4px}
.sarrows{position:absolute;top:50%;transform:translateY(-50%);width:100%;display:flex;justify-content:space-between;padding:0 18px;z-index:10;pointer-events:none}
.sarr{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);color:#fff;font-size:17px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--tr);pointer-events:all}
.sarr:hover{background:rgba(255,255,255,.32)}

/* ── STATS ── */
.stats{background:var(--g800);padding:26px 0}
.sg{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}
.si{padding:8px 16px;border-right:1px solid rgba(255,255,255,.1)}
.si:last-child{border-right:none}
.sn{font-family:var(--fd);font-size:38px;font-weight:700;color:var(--g300);line-height:1}
.sl{font-size:11px;color:rgba(255,255,255,.62);margin-top:4px;letter-spacing:1px;text-transform:uppercase}

/* ── PRODUCT CARDS ── */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px}
.pcard{background:#fff;border-radius:var(--r3);overflow:hidden;box-shadow:var(--sh1);transition:transform var(--tr),box-shadow var(--tr);position:relative}
.pcard:hover{transform:translateY(-7px);box-shadow:var(--sh3)}
.pimgw{height:196px;background:var(--g50);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
.pimgw img{width:100%;height:100%;object-fit:contain;padding:14px;transition:transform .35s ease}
.pcard:hover .pimgw img{transform:scale(1.07)}
.pbadge{position:absolute;top:10px;right:10px;background:var(--g600);color:#fff;font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:3px 9px;border-radius:18px}
.pbody{padding:18px}
.pcat{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--g600);margin-bottom:5px}
.pname{font-family:var(--fd);font-size:19px;color:var(--txt);margin-bottom:7px}
.pdesc{font-size:12px;color:var(--txt3);line-height:1.6}
.pfooter{padding:12px 18px;border-top:1px solid var(--g50);display:flex;justify-content:space-between;align-items:center}
.ptag{background:var(--g50);color:var(--g700);font-size:10px;font-weight:700;padding:3px 11px;border-radius:18px}
.pbtn{width:32px;height:32px;border-radius:50%;background:var(--g600);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;border:none;cursor:pointer;transition:background var(--tr)}
.pcard:hover .pbtn{background:var(--g800)}

/* ── WHY US ── */
.wgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.wcard{background:#fff;border-radius:var(--r3);padding:32px 24px;text-align:center;box-shadow:var(--sh1);transition:transform var(--tr),box-shadow var(--tr),border-bottom-color var(--tr);border-bottom:3px solid transparent}
.wcard:hover{transform:translateY(-5px);box-shadow:var(--sh2);border-bottom-color:var(--g500)}
.wico{width:66px;height:66px;border-radius:50%;background:var(--g50);display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 18px;transition:background var(--tr)}
.wcard:hover .wico{background:var(--g100)}
.wcard h3{font-family:var(--fd);font-size:19px;margin-bottom:9px}
.wcard p{font-size:13px;color:var(--txt3);line-height:1.65}

/* ── TESTIMONIALS ── */
.tblock{background:var(--g900);padding:80px 0}
.tblock .lbl{color:var(--g300)}
.tblock .lbl::before,.tblock .lbl::after{background:var(--g500)}
.tblock .stitle{color:#fff}
.tgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px}
.tcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--r3);padding:28px 24px;transition:transform var(--tr),background var(--tr)}
.tcard:hover{transform:translateY(-4px);background:rgba(255,255,255,.08)}
.tstars{color:var(--gold);font-size:14px;margin-bottom:14px}
.ttxt{font-size:14px;font-style:italic;color:rgba(255,255,255,.76);line-height:1.8;margin-bottom:22px}
.tauth{display:flex;align-items:center;gap:12px}
.tav{width:44px;height:44px;border-radius:50%;background:var(--g700);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:15px;flex-shrink:0}
.tname{font-weight:700;color:#fff;font-size:13px}
.tloc{font-size:11px;color:rgba(255,255,255,.48);margin-top:2px}

/* ── CTA ── */
.cta{background:linear-gradient(120deg,var(--g700) 0%,var(--g500) 50%,var(--g600) 100%);padding:68px 0;text-align:center;position:relative;overflow:hidden}
.cta::before{content:'';position:absolute;top:-80px;right:-80px;width:360px;height:360px;border-radius:50%;background:rgba(255,255,255,.05);pointer-events:none}
.cta h2{color:#fff;font-family:var(--fd);font-size:clamp(26px,4vw,44px);margin-bottom:12px;position:relative;z-index:1}
.cta p{color:rgba(255,255,255,.84);font-size:15px;margin-bottom:28px;position:relative;z-index:1}
.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}

/* ── NEWSLETTER ── */
.nl{background:var(--g50);padding:56px 0}
.nl-in{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.nl-txt h3{font-family:var(--fd);font-size:24px;margin-bottom:5px}
.nl-txt p{color:var(--txt3);font-size:13px}
.nl-form{display:flex;gap:10px;flex-wrap:wrap;flex:1;max-width:480px}
.nl-form input{flex:1;min-width:200px;padding:12px 16px;border:1.5px solid var(--bdr);border-radius:var(--r4);font-size:13px;background:#fff;color:var(--txt);transition:border-color var(--tr)}
.nl-form input:focus{border-color:var(--g500)}
.nl-form input::placeholder{color:var(--txt4)}

/* ── FOOTER ── */
footer{background:var(--g900);color:rgba(255,255,255,.58);padding:60px 0 0}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:36px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.08)}
.fb-logo img{height:42px;filter:brightness(0) invert(1);opacity:.88;margin-bottom:14px}
.fb p{font-size:13px;line-height:1.75}
.fsoc{display:flex;gap:9px;margin-top:18px}
.fsoc a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:12px;color:rgba(255,255,255,.68);transition:background var(--tr)}
.fsoc a:hover{background:var(--g600);color:#fff}
.fcol h5{color:#fff;font-family:var(--fd);font-size:17px;font-weight:600;margin-bottom:18px}
.fcol ul li{margin-bottom:9px}
.fcol ul li a{font-size:13px;color:rgba(255,255,255,.58);transition:color var(--tr);display:flex;align-items:center;gap:6px}
.fcol ul li a::before{content:'›';font-size:14px;color:var(--g400)}
.fcol ul li a:hover{color:var(--g300)}
.fci{display:flex;align-items:flex-start;gap:9px;font-size:12px;margin-bottom:12px}
.fci-i{color:var(--g400);font-size:14px;flex-shrink:0;margin-top:2px}
.fbot{padding:18px 0;display:flex;justify-content:space-between;align-items:center;font-size:12px;flex-wrap:wrap;gap:8px}
.fbot a{color:var(--g400)}

/* ── WHATSAPP FLOAT ── */
.wa{position:fixed;bottom:26px;right:26px;z-index:999;width:54px;height:54px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(37,211,102,.42);transition:transform var(--tr),box-shadow var(--tr);animation:wap 2.5s ease-in-out infinite}
.wa:hover{transform:scale(1.1);box-shadow:0 6px 26px rgba(37,211,102,.58);animation:none}
.wa svg{width:27px;height:27px}
@keyframes wap{0%,100%{box-shadow:0 4px 18px rgba(37,211,102,.42)}50%{box-shadow:0 4px 28px rgba(37,211,102,.68),0 0 0 7px rgba(37,211,102,.09)}}

/* ── BACK TOP ── */
.bktop{position:fixed;bottom:92px;right:26px;z-index:999;width:42px;height:42px;border-radius:50%;background:var(--g700);color:#fff;display:flex;align-items:center;justify-content:center;font-size:17px;opacity:0;pointer-events:none;transition:opacity var(--tr),transform var(--tr);box-shadow:var(--sh1);border:none;cursor:pointer}
.bktop.show{opacity:1;pointer-events:all}
.bktop:hover{transform:translateY(-3px);background:var(--g800)}

/* ── PAGE HERO ── */
.phero{background:linear-gradient(135deg,var(--g900) 0%,var(--g700) 60%,var(--g600) 100%);padding:72px 0 62px;text-align:center;position:relative;overflow:hidden}
.phero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M20 20.5V18H0v5h5v5H0v5h20v-9.5zm-2 4.5h-1v-1h1v1zm-1 4h1v1h-1v-1zm2-4h1v1h-1v-1zm2-2h1v1h-1v-1z'/%3E%3C/g%3E%3C/svg%3E")}
.phero h1{color:#fff;position:relative;z-index:1;font-family:var(--fd);font-size:clamp(32px,5vw,58px)}
.phero p{color:rgba(255,255,255,.76);font-size:15px;margin-top:10px;position:relative;z-index:1}
.bcrumb{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:14px;font-size:12px;color:rgba(255,255,255,.5);position:relative;z-index:1}
.bcrumb a{color:var(--g300)}
.bcrumb span{color:rgba(255,255,255,.35)}

/* ── REVEAL ANIMATION ── */
.rv{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.rv.on{opacity:1;transform:translateY(0)}
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s} .d4{transition-delay:.4s}

/* ── MODAL ── */
#mover{position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:2000;display:none;align-items:center;justify-content:center;padding:18px}
#mover.on{display:flex}
#mbox{background:#fff;border-radius:var(--r3);max-width:580px;width:100%;padding:28px;position:relative;max-height:90vh;overflow-y:auto;animation:mIn .28s ease}
@keyframes mIn{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
.mclose{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;background:var(--g50);border:none;cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;transition:background var(--tr)}
.mclose:hover{background:var(--g100)}
.mimgw{height:200px;background:var(--g50);border-radius:var(--r2);display:flex;align-items:center;justify-content:center;margin-bottom:18px;overflow:hidden}
.mimg{max-height:185px;object-fit:contain}
.mcat{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--g600);margin-bottom:5px}
.mtitle{font-family:var(--fd);font-size:26px;color:var(--txt);margin-bottom:10px}
.mdesc{font-size:14px;color:var(--txt3);line-height:1.8;margin-bottom:18px}
.mbene h4{font-size:14px;color:var(--txt);margin-bottom:8px}
.mbene-item{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--txt3);margin-bottom:5px}
.mbene-item::before{content:'✓';color:var(--g600);font-weight:700;flex-shrink:0}
.mbtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}

/* ── FILTER BAR ── */
.fbar{background:#fff;padding:14px 0;border-bottom:1px solid var(--bdr);position:sticky;top:70px;z-index:90;box-shadow:var(--sh1)}
.fbar-in{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.fblbl{font-size:12px;font-weight:700;color:var(--txt3);margin-right:4px}
.fb2{padding:7px 16px;border-radius:var(--r4);font-size:12px;font-weight:700;border:1.5px solid var(--bdr);color:var(--txt3);background:#fff;cursor:pointer;transition:all var(--tr)}
.fb2:hover,.fb2.on{background:var(--g600);color:#fff;border-color:var(--g600)}

/* ── TABS ── */
.tnav{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:28px}
.tbtn{padding:9px 20px;border-radius:var(--r4);border:1.5px solid var(--bdr);font-size:13px;font-weight:700;color:var(--txt3);background:#fff;cursor:pointer;transition:all var(--tr)}
.tbtn.on,.tbtn:hover{background:var(--g600);color:#fff;border-color:var(--g600)}
.tpanel{display:none}
.tpanel.on{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;animation:fi .35s ease}
@keyframes fi{from{opacity:0}to{opacity:1}}
.tlist li{display:flex;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid var(--g50)}
.tlist li:last-child{border-bottom:none}
.tico{width:34px;height:34px;border-radius:9px;background:var(--g50);color:var(--g600);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.tlist li h5{font-size:14px;color:var(--txt);margin-bottom:2px}
.tlist li p{font-size:12px;color:var(--txt3);line-height:1.5}
.tpanel img{border-radius:var(--r3);box-shadow:var(--sh2);width:100%;height:360px;object-fit:cover}

/* ── FAQ ── */
.faql{max-width:760px;margin:0 auto}
.faqi{background:#fff;border-radius:var(--r2);margin-bottom:10px;overflow:hidden;box-shadow:var(--sh1)}
.faqq{width:100%;display:flex;justify-content:space-between;align-items:center;padding:18px 22px;font-size:14px;font-weight:700;color:var(--txt);background:none;border:none;cursor:pointer;text-align:left;font-family:var(--fb);transition:color var(--tr)}
.faqq:hover{color:var(--g700)}
.faqq .arr{font-size:16px;transition:transform var(--tr);flex-shrink:0;margin-left:10px}
.faqi.on .faqq .arr{transform:rotate(180deg)}
.faqa{max-height:0;overflow:hidden;transition:max-height .38s ease;padding:0 22px}
.faqi.on .faqa{max-height:220px}
.faqa p{font-size:13px;color:var(--txt3);line-height:1.75;padding-bottom:16px}

/* ── FORMS ── */
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fg2{margin-bottom:16px}
.fg2 label{display:block;font-size:12px;font-weight:700;color:var(--txt);margin-bottom:5px}
.fg2 input,.fg2 textarea,.fg2 select{width:100%;padding:11px 14px;border:1.5px solid #d8e8d8;border-radius:var(--r2);font-size:13px;color:var(--txt);background:#f8fdf8;transition:border-color var(--tr),box-shadow var(--tr)}
.fg2 input:focus,.fg2 textarea:focus,.fg2 select:focus{border-color:var(--g500);box-shadow:0 0 0 3px rgba(56,170,56,.1);background:#fff}
.fg2 textarea{min-height:110px;resize:vertical}
.fg2 input::placeholder,.fg2 textarea::placeholder{color:var(--txt4)}
.fsuccess{display:none;background:var(--g50);border:1px solid var(--g300);border-radius:var(--r2);padding:12px 16px;color:var(--g700);font-size:13px;font-weight:700;margin-top:14px;text-align:center}
.subbtn{width:100%;padding:13px;background:var(--g600);color:#fff;border:none;border-radius:var(--r4);font-size:14px;font-weight:700;cursor:pointer;transition:background var(--tr),transform var(--tr)}
.subbtn:hover{background:var(--g700);transform:translateY(-1px)}
.subbtn:disabled{opacity:.6;cursor:not-allowed;transform:none}

/* ── ABOUT PAGE SPECIFICS ── */
.aimgs{position:relative;height:420px}
.aim1{position:absolute;top:0;left:0;width:70%;height:320px;object-fit:cover;border-radius:var(--r3);box-shadow:var(--sh2)}
.aim2{position:absolute;bottom:0;right:0;width:50%;height:228px;object-fit:cover;border-radius:var(--r3);box-shadow:var(--sh2);border:5px solid var(--cream)}
.expb{position:absolute;top:44%;left:52%;transform:translate(-50%,-50%);width:88px;height:88px;border-radius:50%;background:var(--g600);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 5px 22px rgba(42,140,42,.38);z-index:2;font-family:var(--fd)}
.expb span:first-child{font-size:28px;font-weight:700;line-height:1}
.expb span:last-child{font-size:9px;text-align:center;opacity:.88}
.af{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;color:var(--txt)}
.af::before{content:'✓';width:20px;height:20px;border-radius:50%;background:var(--g50);color:var(--g600);display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0}
.mv-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.mv-card{border-radius:var(--r3);padding:36px 32px;position:relative;overflow:hidden}
.mv-card.mis{background:var(--g800);color:#fff}
.mv-card.vis{background:var(--g50)}
.mv-card h3{font-family:var(--fd);font-size:26px;margin-bottom:12px}
.mv-card.mis h3,.mv-card.mis p{color:#fff}
.mv-card p{font-size:14px;line-height:1.8;color:var(--txt3)}
.tl{position:relative;padding-left:28px}
.tl::before{content:'';position:absolute;left:9px;top:0;bottom:0;width:2px;background:var(--g100)}
.tli{position:relative;margin-bottom:26px}
.tli::before{content:'';position:absolute;left:-22px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--g500);border:2px solid #fff;box-shadow:0 0 0 3px var(--g100)}
.tyr{font-size:11px;font-weight:700;color:var(--g600);letter-spacing:1px;margin-bottom:3px}
.tli h4{font-size:15px;color:var(--txt);margin-bottom:3px}
.tli p{font-size:12px;color:var(--txt3);line-height:1.6}
.vgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.vcard{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--r3);padding:28px 22px;transition:background var(--tr)}
.vcard:hover{background:rgba(255,255,255,.1)}
.vcard h4{color:#fff;font-size:17px;margin-bottom:8px}
.vcard p{color:rgba(255,255,255,.62);font-size:13px;line-height:1.7}
.tnum{font-family:var(--fd);font-size:42px;font-weight:700;color:var(--g600);line-height:1}

/* ── BENEFITS PAGE SPECIFICS ── */
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:22px}
.bcard{background:#fff;border-radius:var(--r3);padding:28px 22px;box-shadow:var(--sh1);transition:transform var(--tr),box-shadow var(--tr);display:flex;gap:18px;align-items:flex-start}
.bcard:hover{transform:translateY(-4px);box-shadow:var(--sh2)}
.bicow{width:52px;height:52px;border-radius:12px;background:var(--g50);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;transition:background var(--tr)}
.bcard:hover .bicow{background:var(--g100)}
.bcard h4{font-size:16px;margin-bottom:7px;color:var(--txt)}
.bcard p{font-size:12px;color:var(--txt3);line-height:1.65}
.ctable{width:100%;border-collapse:collapse;box-shadow:var(--sh1);border-radius:var(--r3);overflow:hidden}
.ctable th{padding:16px 22px;font-size:14px;font-weight:700;text-align:left}
.ctable th:first-child{background:var(--g50);color:var(--txt)}
.ctable th.ck{background:var(--g700);color:#fff}
.ctable th.cx{background:#f5f0e8;color:var(--txt3)}
.ctable td{padding:14px 22px;font-size:13px;border-top:1px solid var(--bdr)}
.ctable tr:nth-child(even) td{background:rgba(234,247,234,.4)}
.ctable td.ck{color:var(--g700);font-weight:700}
.ctable td.cx{color:var(--txt3)}
.cok{color:var(--g600)} .cno{color:#c0392b}

/* ── CONTACT PAGE SPECIFICS ── */
.cicard{background:var(--g800);border-radius:var(--r3);padding:36px 30px;color:rgba(255,255,255,.78);position:relative;overflow:hidden}
.cicard::before{content:'';position:absolute;bottom:-50px;right:-50px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.04)}
.cicard h3{font-family:var(--fd);font-size:24px;color:#fff;margin-bottom:7px}
.cicard > p{font-size:13px;margin-bottom:28px}
.cii{display:flex;align-items:flex-start;gap:12px;margin-bottom:20px;position:relative;z-index:1}
.ciico{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.cii strong{display:block;color:#fff;font-size:13px;margin-bottom:2px}
.cii a,.cii span{font-size:12px;color:rgba(255,255,255,.62)}
.cii a:hover{color:var(--g300)}
.cidiv{border:none;border-top:1px solid rgba(255,255,255,.1);margin:20px 0}
.cisoc{display:flex;gap:9px}
.cisoc a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:12px;color:rgba(255,255,255,.68);transition:background var(--tr)}
.cisoc a:hover{background:var(--g600);color:#fff}
.wabtn{display:inline-flex;align-items:center;gap:9px;background:#25d366;color:#fff;padding:11px 18px;border-radius:var(--r4);font-size:13px;font-weight:700;margin-top:20px;transition:background var(--tr),transform var(--tr);position:relative;z-index:1}
.wabtn:hover{background:#1da851;transform:translateY(-2px)}
.wabtn svg{width:18px;height:18px}
.cfcard{background:#fff;border-radius:var(--r3);padding:36px 30px;box-shadow:var(--sh1)}
.cfcard h3{font-family:var(--fd);font-size:24px;margin-bottom:7px}
.cfcard > p{font-size:13px;color:var(--txt3);margin-bottom:24px}
.mapw{height:400px;overflow:hidden}
.mapw iframe{width:100%;height:100%;border:none}
.qcgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px}
.qcard{background:#fff;border-radius:var(--r3);padding:24px 20px;text-align:center;box-shadow:var(--sh1);transition:transform var(--tr)}
.qcard:hover{transform:translateY(-4px)}
.qcard .qi{font-size:34px;margin-bottom:10px}
.qcard h4{font-size:15px;margin-bottom:5px}
.qcard p,.qcard a{font-size:12px;color:var(--txt3)}
.qcard a:hover{color:var(--g600)}

/* ── RESPONSIVE ── */
@media(max-width:1024px){.fg{grid-template-columns:1fr 1fr}.sg{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){
  section{padding:56px 0}
  .links,.nav-cta{display:none}
  .hbg{display:flex}
  .fg{grid-template-columns:1fr}
  .nl-in{flex-direction:column}
  .nl-txt{text-align:center}
  .tl-left{display:none}
  .sg{grid-template-columns:repeat(2,1fr)}
  .fbot{justify-content:center;text-align:center}
  .tpanel.on{grid-template-columns:1fr}
  .tpanel img{height:220px}
  .frow{grid-template-columns:1fr}
  .mv-grid{grid-template-columns:1fr}
  .aimgs{height:260px}
  .aim1{width:73%;height:210px}
  .aim2{width:50%;height:155px}
  .cicard{margin-bottom:24px}
}
@media(max-width:480px){
  .sg{grid-template-columns:1fr 1fr}
  .pgrid{grid-template-columns:1fr}
  .wgrid{grid-template-columns:1fr}
  .tgrid{grid-template-columns:1fr}
  .bgrid{grid-template-columns:1fr}
  .vgrid{grid-template-columns:1fr}
}