/* ═══════════════════════════════════════════ DESIGN TOKENS ═══════════════════════════════════════════ */
:root{
  --green:#1F7A1F; --green-d:#155715; --green-l:#E6F4E6;
  --gold:#E8A82C; --gold-d:#C48818; --gold-l:#FDF4E0;
  --blue:#0E78D3; --blue-d:#0A5DAA; --blue-l:#E6F1FB;
  --ink:#0F1419; --ink-2:#2A3239; --ink-3:#5A6470; --ink-4:#8A929C;
  --bg:#FFFFFF; --bg-2:#F7F8FA; --bg-3:#EEF1F5;
  --border:#E5E8EC; --border-2:#D5D9DF;
  --red:#D9534F;
  --serif:'Fraunces',Georgia,serif;
  --sans:'DM Sans',system-ui,sans-serif;
  --r-sm:8px; --r:12px; --r-lg:20px; --r-xl:28px;
  --sh-sm:0 1px 3px rgba(15,20,25,.06);
  --sh:0 4px 16px rgba(15,20,25,.08);
  --sh-lg:0 12px 40px rgba(15,20,25,.12);
  --ease:cubic-bezier(.22,1,.36,1);
}
.dark{--bg:#0E1419;--bg-2:#161D25;--bg-3:#1F2731;--ink:#F0F2F5;--ink-2:#CFD4DA;--ink-3:#8A929C;--ink-4:#5A6470;--border:rgba(255,255,255,.09);--border-2:rgba(255,255,255,.16);}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-size:15px;line-height:1.55;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:14px}

/* ANNOUNCEMENT */
.announce{background:linear-gradient(90deg,var(--green),var(--green-d));color:#fff;text-align:center;padding:9px 16px;font-size:13px;font-weight:500;letter-spacing:.2px}
.announce strong{color:var(--gold);font-weight:700}

/* NAV */
.nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding:14px max(5%,18px);display:flex;align-items:center;justify-content:space-between}
.dark .nav{background:rgba(14,20,25,.92)}
.logo{display:flex;align-items:center;gap:0;font-family:var(--serif);font-size:28px;font-weight:800;letter-spacing:-.5px;line-height:1}
.logo .a{color:var(--green)}
.logo .b{color:var(--gold)}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{font-size:14px;font-weight:500;color:var(--ink-2);position:relative;padding:6px 0;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:var(--ink)}
.nav-actions{display:flex;gap:8px;align-items:center}
.icon-btn{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-2);font-size:16px;transition:background .2s;position:relative}
.icon-btn:hover{background:var(--bg-2)}
.cart-badge{position:absolute;top:-2px;right:-2px;background:var(--red);color:#fff;font-size:10px;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.cart-badge.hide{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:14px;padding:11px 22px;border-radius:999px;transition:all .22s var(--ease);white-space:nowrap;font-family:var(--sans)}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-d);transform:translateY(-1px);box-shadow:0 6px 20px rgba(14,120,211,.3)}
.btn-ghost{background:transparent;color:var(--ink-2);border:1.5px solid var(--border-2)}
.btn-ghost:hover{border-color:var(--ink);color:var(--ink)}
.btn-gold{background:var(--gold);color:#fff}
.btn-gold:hover{background:var(--gold-d)}
.btn-wa{background:#25D366;color:#fff}
.btn-wa:hover{background:#1ebd5b}
.btn-lg{padding:14px 28px;font-size:15px}
.btn-xl{padding:16px 32px;font-size:15px}
.ham{display:none;width:38px;height:38px;border-radius:50%;align-items:center;justify-content:center;color:var(--ink)}
@media (max-width:880px){
  .nav-links,.nav-actions .btn{display:none}
  .ham{display:flex}
}

/* DRAWER */
.dov{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:300;opacity:0;pointer-events:none;transition:opacity .3s}
.dov.op{opacity:1;pointer-events:all}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(330px,90vw);background:#fff;z-index:301;transform:translateX(110%);transition:transform .35s var(--ease);padding:24px 22px;display:flex;flex-direction:column}
.dark .drawer{background:var(--bg-2)}
.drawer.op{transform:none}
.drawer-close{align-self:flex-end;width:38px;height:38px;border-radius:50%;background:var(--bg-2);font-size:18px}
.drawer a{display:block;padding:14px 0;font-size:16px;font-weight:600;border-bottom:1px solid var(--border);color:var(--ink-2)}
.drawer a:hover{color:var(--blue)}
.drawer .btn{margin-top:14px}

/* SHARED SECTION */
section{padding:88px max(5%,20px)}
@media (max-width:680px){section{padding:64px 18px}}
.sec-head{text-align:center;max-width:680px;margin:0 auto 56px}
.sec-head.left{text-align:left;margin:0 0 56px}
.eyebrow{display:inline-block;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--blue);margin-bottom:14px}
.eyebrow.gold{color:var(--gold-d)}
h2{font-family:var(--serif);font-size:clamp(30px,4.5vw,52px);font-weight:700;line-height:1.06;letter-spacing:-1px;margin-bottom:14px;color:var(--ink);text-wrap:balance}
h2 em{font-style:italic;color:var(--blue);font-weight:600}
h2 .g{color:var(--gold-d)}
.sec-sub{font-size:16px;color:var(--ink-3);line-height:1.7;max-width:560px;margin:0 auto;font-weight:400}
.sec-head.left .sec-sub{margin:0}

/* PAGE HEADER (used by pricing/offers/track pages) */
.page-hero{padding:80px max(5%,20px) 56px;background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg) 100%);text-align:center;border-bottom:1px solid var(--border)}
.page-hero .eyebrow{margin-bottom:14px}
.page-hero h1{font-family:var(--serif);font-size:clamp(36px,5.5vw,60px);font-weight:700;line-height:1.05;letter-spacing:-1.2px;margin-bottom:14px;color:var(--ink);text-wrap:balance}
.page-hero h1 em{font-style:italic;color:var(--blue);font-weight:600}
.page-hero h1 .g{color:var(--gold-d)}
.page-hero p{font-size:16.5px;color:var(--ink-3);max-width:620px;margin:0 auto;line-height:1.65}
.crumb{font-size:12.5px;color:var(--ink-4);margin-bottom:18px;letter-spacing:.3px}
.crumb a{color:var(--ink-3);font-weight:500;border-bottom:1px solid transparent;transition:border .2s}
.crumb a:hover{border-color:var(--ink-3)}

/* FOOTER */
footer{background:#0A0E12;color:#fff;padding:56px max(5%,20px) 24px}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:42px;max-width:1280px;margin:0 auto 36px}
@media (max-width:780px){.fgrid{grid-template-columns:1fr 1fr;gap:30px}.fbrand{grid-column:1 / -1}}
.fbrand .logo{margin-bottom:14px;font-size:30px}
.fbrand .logo .a{color:#4ABF4A}
.fbrand p{font-size:13.5px;color:rgba(255,255,255,.5);line-height:1.7;margin-bottom:18px;max-width:300px}
.socrow{display:flex;gap:8px}
.soc{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s;color:#fff}
.soc:hover{background:var(--blue);border-color:var(--blue)}
.fcol h4{font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:14px}
.fcol ul{list-style:none}
.fcol ul li{margin-bottom:9px}
.fcol ul li a{font-size:13.5px;color:rgba(255,255,255,.7);transition:color .2s;display:inline-block}
.fcol ul li a:hover{color:#fff}
.fbot{border-top:1px solid rgba(255,255,255,.08);padding-top:22px;max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
.fbot p{font-size:12.5px;color:rgba(255,255,255,.4)}

/* MODAL */
.modal-ov{position:fixed;inset:0;z-index:500;background:rgba(8,12,16,.65);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s;display:flex;align-items:center;justify-content:center;padding:18px}
.modal-ov.op{opacity:1;pointer-events:all}
.modal{background:var(--bg);border-radius:var(--r-xl);width:min(540px,100%);max-height:92vh;overflow-y:auto;padding:36px 32px;position:relative;transform:scale(.94) translateY(20px);transition:transform .35s var(--ease)}
.dark .modal{background:var(--bg-2)}
.modal-ov.op .modal{transform:none}
.modal-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:var(--bg-2);color:var(--ink-3);font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .2s}
.modal-close:hover{background:var(--bg-3);color:var(--ink)}
.modal-title{font-family:var(--serif);font-size:26px;font-weight:700;margin-bottom:6px;letter-spacing:-.4px}
.modal-sub{font-size:13.5px;color:var(--ink-3);margin-bottom:24px}
.tab-switcher{display:flex;background:var(--bg-2);padding:4px;border-radius:10px;margin-bottom:20px;gap:4px}
.tabsw{flex:1;padding:9px;font-size:13px;font-weight:600;color:var(--ink-3);border-radius:7px;transition:all .2s}
.tabsw.on{background:var(--bg);color:var(--blue);box-shadow:var(--sh-sm)}
.tcon{display:none}
.tcon.on{display:block}
.otp-row{display:flex;gap:8px;justify-content:center}
.otp-inp{width:48px;height:54px;text-align:center;font-size:20px;font-weight:700;border:1.5px solid var(--border-2);border-radius:10px;background:var(--bg);outline:none}
.otp-inp:focus{border-color:var(--blue)}
.sl-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;border:1.5px solid var(--border-2);border-radius:10px;font-weight:600;font-size:14px;background:var(--bg);transition:all .2s}
.sl-btn:hover{border-color:var(--ink-3);background:var(--bg-2)}
.modal-note{font-size:12.5px;color:var(--ink-4);text-align:center;margin-top:16px}
.modal-note a{color:var(--blue);font-weight:600}

/* FORM */
.fg{margin-bottom:14px}
.fg-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fg label{display:block;font-size:12px;font-weight:600;color:var(--ink-2);margin-bottom:6px;letter-spacing:.3px}
.fg input,.fg select,.fg textarea{width:100%;padding:11px 14px;border:1.5px solid var(--border-2);border-radius:10px;background:var(--bg);color:var(--ink);transition:border .2s;font-family:var(--sans)}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--blue)}
.fg textarea{resize:vertical;min-height:80px}
.fsub{width:100%;padding:14px;background:var(--blue);color:#fff;font-weight:700;border-radius:10px;font-size:14.5px;margin-top:8px;transition:background .2s;font-family:var(--sans)}
.fsub:hover{background:var(--blue-d)}

/* CART DRAWER */
.cart-ov{position:fixed;inset:0;z-index:400;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .3s}
.cart-ov.op{opacity:1;pointer-events:all}
.cart-dwr{position:fixed;top:0;right:0;bottom:0;z-index:401;width:min(400px,95vw);background:var(--bg);box-shadow:-8px 0 48px rgba(0,0,0,.16);transform:translateX(110%);transition:transform .35s var(--ease);display:flex;flex-direction:column}
.dark .cart-dwr{background:var(--bg-2)}
.cart-dwr.op{transform:none}
.cart-hd{padding:20px 22px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.cart-hd h3{font-family:var(--serif);font-size:22px;font-weight:700}
.cart-bd{flex:1;overflow-y:auto;padding:14px 22px}
.cart-empty{text-align:center;padding:50px 16px;color:var(--ink-4)}
.cart-empty-ic{font-size:48px;margin-bottom:12px;opacity:.5}
.cart-item{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--border)}
.ci2-n{font-size:13.5px;font-weight:600;margin-bottom:3px}
.ci2-s{font-size:11.5px;color:var(--ink-4)}
.ci2-r{display:flex;align-items:center;gap:10px}
.ci2-p{font-family:var(--serif);font-size:16px;font-weight:700;color:var(--blue)}
.ci2-rm{color:var(--ink-4);font-size:16px;width:28px;height:28px;border-radius:50%;transition:all .15s}
.ci2-rm:hover{color:var(--red);background:rgba(217,83,79,.1)}
.cart-ft{padding:16px 22px;border-top:1px solid var(--border)}
.ct-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.ct-lbl{font-size:13px;color:var(--ink-3);font-weight:500}
.ct-val{font-family:var(--serif);font-size:24px;font-weight:700}
.ct-note{font-size:11.5px;color:var(--ink-4);margin-bottom:14px}
.cart-checkout{width:100%;padding:14px;background:#25D366;color:#fff;border-radius:10px;font-weight:700;font-size:14px;transition:background .2s}
.cart-checkout:hover{background:#1ebd5b}

/* CHATBOT */
.cfab{position:fixed;bottom:24px;left:24px;z-index:380;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;box-shadow:0 6px 24px rgba(14,120,211,.45);display:flex;align-items:center;justify-content:center;font-size:24px;transition:transform .2s}
.cfab:hover{transform:scale(1.08)}
.wafab{position:fixed;bottom:24px;right:24px;z-index:380;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 6px 24px rgba(37,211,102,.45);display:flex;align-items:center;justify-content:center;font-size:26px;transition:transform .2s;text-decoration:none}
.wafab:hover{transform:scale(1.08)}
.cwrap{position:fixed;bottom:92px;left:24px;z-index:380;width:min(360px,92vw);background:var(--bg);border-radius:18px;box-shadow:var(--sh-lg);border:1px solid var(--border);display:flex;flex-direction:column;transform:scale(.92) translateY(16px);opacity:0;pointer-events:none;transition:all .28s var(--ease);transform-origin:bottom left;max-height:540px}
.dark .cwrap{background:var(--bg-2)}
.cwrap.op{transform:none;opacity:1;pointer-events:all}
.chd{background:linear-gradient(135deg,var(--blue),var(--blue-d));padding:16px 18px;border-radius:18px 18px 0 0;display:flex;align-items:center;justify-content:space-between;color:#fff}
.chd-l{display:flex;align-items:center;gap:11px}
.chd-av{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:18px}
.chd-nm{font-size:14.5px;font-weight:700}
.chd-st{font-size:11px;color:rgba(255,255,255,.7)}
.cclose{color:rgba(255,255,255,.75);font-size:18px}
.cmsgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;min-height:200px;max-height:300px}
.cmsg{max-width:85%;padding:10px 14px;border-radius:14px;font-size:13.5px;line-height:1.55;animation:msgin .25s ease}
@keyframes msgin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.cmsg.bot{background:var(--bg-2);color:var(--ink);align-self:flex-start;border-radius:4px 14px 14px 14px;white-space:pre-line}
.cmsg.usr{background:var(--blue);color:#fff;align-self:flex-end;border-radius:14px 4px 14px 14px}
.cquick{padding:8px 14px;display:flex;gap:6px;flex-wrap:wrap;border-top:1px solid var(--border)}
.cqc{font-size:11.5px;font-weight:600;padding:6px 11px;border-radius:999px;background:var(--blue-l);color:var(--blue);border:1px solid var(--blue-l);transition:all .15s}
.cqc:hover{background:var(--blue);color:#fff}
.cinp-row{display:flex;gap:8px;padding:12px;border-top:1px solid var(--border)}
.cinp{flex:1;padding:10px 13px;border-radius:10px;border:1.5px solid var(--border-2);background:var(--bg);outline:none;transition:border .2s}
.cinp:focus{border-color:var(--blue)}
.csend{width:38px;height:38px;border-radius:10px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s}
.csend:hover{background:var(--blue-d)}

/* TOAST */
.toast{position:fixed;bottom:96px;right:24px;z-index:700;background:var(--ink);color:#fff;padding:13px 20px;border-radius:12px;font-size:13.5px;font-weight:500;display:flex;align-items:center;gap:10px;box-shadow:var(--sh-lg);transform:translateY(86px);opacity:0;transition:all .35s var(--ease);pointer-events:none;max-width:320px}
.toast.show{transform:none;opacity:1}

/* FADE-IN */
.fi{opacity:0;transform:translateY(20px);transition:all .7s var(--ease)}
.fi.v{opacity:1;transform:none}
.dark .icon-btn:hover{background:var(--bg-3)}