/* ============ RELIFI — homepage prototype ============ */
@property --split { syntax: '<percentage>'; inherits: true; initial-value: 50%; }

:root{
  --forest:#0E3B2B; --forest-2:#16503A; --leaf:#3BAA4A; --leaf-2:#2F8F3E;
  --porcelain:#F6F3EC; --sage:#E4EBE1; --sage-2:#CFDCCB; --mist:#EDF1EA;
  --amber:#B4621C; --amber-1:#F3E6D6; --amber-2:#E8CDA9; --khaki:#9C8A5C; --khaki-d:#7E6F45;
  --ink:#14201A; --stone:#66706A; --line:rgba(14,59,43,.12); --white:#fff; --gold:#E0A526;
  --r-lg:24px; --r-md:16px; --r-sm:12px;
  --shadow:0 1px 2px rgba(14,59,43,.05),0 12px 32px -12px rgba(14,59,43,.18);
  --shadow-lg:0 2px 4px rgba(14,59,43,.05),0 30px 60px -24px rgba(14,59,43,.28);
  --ease:cubic-bezier(.22,1,.36,1);
  --f-head:'Satoshi',system-ui,sans-serif; --f-body:'Satoshi',system-ui,sans-serif;
  --f-serif:'Fraunces',Georgia,serif; --f-urdu:'Noto Nastaliq Urdu',serif;
  --wrap:1200px; --gut:clamp(16px,4vw,40px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html{overflow-x:clip}
body{margin:0;background:var(--porcelain);color:var(--ink);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0}
svg{width:1em;height:1em;flex:none}
s{color:var(--stone)}
.wrap{max-width:calc(var(--wrap) + var(--gut)*2);margin:0 auto;padding:0 var(--gut)}
.center{text-align:center}
.muted{color:var(--stone);margin:0}
.small{font-size:13px}

/* ---------- type ---------- */
.h1,.h2,h3{font-family:var(--f-head);letter-spacing:-.03em;color:var(--forest);margin:0}
.h1{font-size:clamp(40px,5.2vw,76px);line-height:1;font-weight:900;letter-spacing:-.04em}
.h2{font-size:clamp(30px,3.8vw,52px);line-height:1.05;font-weight:700;letter-spacing:-.035em}
.h2--light{color:#fff}
.h1 em,.h2 em{font-family:var(--f-serif);font-style:italic;font-weight:500;letter-spacing:-.02em;color:var(--leaf-2)}
.h2--light em{color:#8FD99A}
.h1 em{font-size:.98em}
.h2 em{font-size:1em}
.eyebrow{font:700 12.5px/1 var(--f-head);letter-spacing:.24em;text-transform:uppercase;color:var(--forest);margin:0 0 14px}
.eyebrow--lines{display:flex;align-items:center;justify-content:center;gap:16px}
.eyebrow--lines::before,.eyebrow--lines::after{content:"";width:44px;height:1px;background:currentColor;opacity:.5;transform-origin:var(--o,right)}
.eyebrow--lines::after{--o:left}
.eyebrow--amber{color:var(--amber)} .eyebrow--khaki{color:var(--khaki-d)} .eyebrow--leaf{color:#7fd38a} .eyebrow--plain{margin:18px 0 10px;color:var(--stone);font-size:11px}
.sub{color:var(--stone);font-size:18px;margin:10px 0 0}
.lead{font-size:17px;color:#4b524c;max-width:46ch;margin:16px 0 22px}

/* ---------- buttons ---------- */
.btn{--h:52px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:12px;height:var(--h);padding:0 26px;border-radius:999px;font:700 16px/1 var(--f-head);letter-spacing:-.01em;transition:transform .25s var(--ease),background .25s,box-shadow .25s,color .25s;white-space:nowrap;position:relative}
.btn:active{transform:scale(.97)}
.btn--primary{background:var(--forest);color:#fff;box-shadow:0 12px 26px -12px rgba(14,59,43,.65)}
.btn--primary:hover{background:var(--forest-2)}
.btn--ghost{border:1.6px solid var(--forest);color:var(--forest);background:rgba(255,255,255,.6)}
.btn--ghost:hover{background:var(--forest);color:#fff}
.btn--lg{--h:60px;font-size:18px;padding:0 10px 0 30px}
.btn--sm{--h:40px;font-size:14px;padding:0 18px}
.btn--block{width:100%}
.btn .chip{width:40px;height:40px;border-radius:50%;background:var(--leaf);display:grid;place-items:center;transition:transform .3s var(--ease)}
.btn--lg .chip{width:44px;height:44px}
.btn .chip svg{width:20px;height:20px;color:#fff}
.btn:hover .chip{transform:translateX(4px)}
.btn--primary:not(.btn--lg) .chip{margin-right:-18px}
.btn.is-loading{pointer-events:none}
.btn.is-loading{color:transparent !important}
.btn.is-loading > *{opacity:0}
.btn.is-loading::after{content:"";position:absolute;width:20px;height:20px;border-radius:50% 0 50% 50%;transform:rotate(-45deg);background:var(--amber);animation:dropspin .7s linear infinite}
.btn--ghost.is-loading::after{background:var(--amber)}
@keyframes dropspin{to{transform:rotate(315deg)}}
.btn.is-done{background:var(--leaf);border-color:var(--leaf);color:#fff}
.btn--wa{background:#1fa855;color:#fff;--h:46px;font-size:15px;width:calc(100% - 40px);margin:4px 20px 20px}
.btn--wa svg{width:20px;height:20px}
.link{font-weight:600;color:var(--forest);text-underline-offset:4px;font-size:15px}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;position:relative;transition:background .2s}
.icon-btn:hover{background:rgba(14,59,43,.06)}
.icon-btn svg{width:24px;height:24px}

/* ---------- progress + announce + header ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;pointer-events:none}
.progress span{display:block;height:100%;background:var(--leaf);transform-origin:left;transform:scaleX(0)}
.announce{background:var(--forest);color:#fff;font:500 14px/1 var(--f-body);height:42px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.announce__track{display:flex;gap:14px;align-items:center;white-space:nowrap}
.announce .dot{width:5px;height:5px;border-radius:50%;background:var(--leaf)}
.header{position:sticky;top:0;z-index:50;background:rgba(246,243,236,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
.header__in{display:flex;align-items:center;gap:28px;height:78px;transition:height .35s var(--ease)}
.header.is-compact .header__in{height:64px}
.header.is-compact{box-shadow:0 8px 24px -16px rgba(14,59,43,.25)}
.logo img{height:44px;width:auto;transition:height .35s var(--ease)}
.header.is-compact .logo img{height:36px}
.header__menu{display:none}
.nav{display:flex;gap:30px;margin:0 auto;padding-left:28px;border-left:1px solid var(--line)}
.nav a{text-decoration:none;font:600 15px/1 var(--f-head);color:var(--ink);position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--leaf);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.header__actions{display:flex;align-items:center;gap:10px}
.pill-help{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border:1.6px solid var(--forest);border-radius:999px;text-decoration:none;font:600 14px/1 var(--f-head);color:var(--forest)}
.pill-help svg{width:18px;height:18px;color:#1fa855}
.header__cta{display:none}
.header.is-compact .header__cta{display:inline-flex;animation:popin .4s var(--ease)}
.header.is-compact .pill-help{display:none}
@keyframes popin{from{opacity:0;transform:translateY(-6px) scale(.96)}}
.cart-count{position:absolute;top:4px;right:2px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--forest);color:#fff;font:700 11px/19px var(--f-head);text-align:center;border:2px solid var(--porcelain)}
.cart-count.bump{animation:bump .5s var(--ease)}
@keyframes bump{40%{transform:scale(1.45)}}

/* ---------- HERO ---------- */
.hero{position:relative;overflow:hidden;padding:30px 0 0;--split:50%}
.hero__worlds{position:absolute;inset:0;pointer-events:none}
.world{position:absolute;inset:0}
.world--amber{background:radial-gradient(120% 90% at 0% 40%,#EFDFC9 0%,#F4ECE0 45%,rgba(244,236,224,0) 80%),linear-gradient(180deg,#F8F4EC,#F2EADF);clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.world--sage{background:radial-gradient(120% 90% at 100% 40%,#D3DFCD 0%,var(--sage) 45%,rgba(228,235,225,0) 80%),linear-gradient(180deg,#EEF2EB,#E4EBE1);clip-path:inset(0 0 0 var(--split))}
.seam{position:absolute;top:0;bottom:0;left:var(--split);width:240px;transform:translateX(-50%);background:linear-gradient(90deg,rgba(242,234,223,0),rgba(246,243,236,.9) 50%,rgba(228,235,225,0));filter:blur(8px)}
.hero::before{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(180deg,rgba(255,249,241,0),var(--porcelain));pointer-events:none}
.giant-drop{position:absolute;left:-70px;top:120px;width:190px;filter:drop-shadow(0 30px 40px rgba(180,98,28,.28));opacity:.95}
.powder{position:absolute;right:0;top:0;width:45%;height:70%}
.hero__in{position:relative}
.hero__copy{text-align:center}
.h1 .line{display:block;overflow:hidden;padding-bottom:.08em}
.h1 .line>span{display:inline-block}
.hero__sub{font-size:21px;color:#5a6159;margin:8px 0 0;font-family:var(--f-head);font-weight:500}

.hero__stage{display:grid;grid-template-columns:260px 1fr 260px;align-items:center;gap:24px;margin-top:6px}
.side-card{min-height:262px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(255,255,255,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:var(--r-lg);padding:22px 20px;text-align:center;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.9);transition:transform .45s var(--ease),box-shadow .45s}
.side-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.side-card h3{font-size:24px;margin:14px 0 6px}
.side-card p{margin:0 0 12px;color:#4b524c;font-size:15px;line-height:1.4}
.side-card .price{display:block;font:800 26px/1 var(--f-head);color:var(--forest);margin-bottom:14px}
.side-card .btn{width:130px}
.tag{display:inline-block;padding:7px 14px;border-radius:999px;font:700 11.5px/1 var(--f-head);letter-spacing:.1em;text-transform:uppercase;color:#fff}
.tag--amber{background:var(--amber)} .tag--khaki{background:var(--khaki-d)}

.stage{position:relative;height:410px}
.stage__products{position:absolute;left:0;right:0;bottom:30px;height:390px}
.stage__products img{position:absolute;bottom:0;mix-blend-mode:multiply;will-change:transform}
.p-duo{height:385px;width:auto;left:calc(50% - 173px)}
.plinth{position:absolute;left:0;right:0;margin:0 auto;bottom:12px;width:480px;max-width:100%;height:96px}
.plinth__top{position:absolute;inset:0 0 auto 0;height:82px;border-radius:50%;background:
  radial-gradient(ellipse at 30% 40%,rgba(255,255,255,.95),rgba(255,255,255,0) 60%),
  repeating-linear-gradient(115deg,rgba(150,150,150,0) 0 38px,rgba(150,150,150,.12) 39px 40px,rgba(150,150,150,0) 41px 90px),
  linear-gradient(180deg,#fbfbfa,#ebe9e4);box-shadow:inset 0 -6px 14px rgba(0,0,0,.06);z-index:1}
.plinth__side{position:absolute;left:0;right:0;top:41px;height:52px;border-radius:0 0 50% 50% / 0 0 48px 48px;background:linear-gradient(90deg,#d7d4cd,#f4f3ef 30%,#fbfaf8 50%,#e6e3dc 80%,#cfcbc3);box-shadow:0 26px 40px -20px rgba(14,59,43,.35)}
.mint{position:absolute;width:62px;left:calc(50% + 175px);bottom:78px;transform:rotate(-24deg);z-index:3;filter:drop-shadow(0 6px 6px rgba(0,0,0,.12))}
.stage__drop{position:absolute;left:calc(50% - 215px);top:0;width:18px;height:320px;z-index:4;pointer-events:none}
.stage__drop i{position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50% 0 50% 50%;transform:rotate(-45deg) scale(0);background:radial-gradient(circle at 35% 35%,#FFD48E,#C9771F 55%,#7d3e0c);box-shadow:0 6px 14px rgba(180,98,28,.4)}
.stage__ripple{position:absolute;left:calc(50% - 207px);bottom:92px;width:0;height:0;z-index:1}
.stage__ripple i{position:absolute;left:-60px;top:-14px;width:120px;height:28px;border-radius:50%;border:2px solid rgba(180,98,28,.5);opacity:0;transform:scale(.2)}

.hero__cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 18px;margin-top:-6px}
.was{font:600 20px/1 var(--f-head)}
.save{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:999px;background:var(--leaf);color:#fff;font:700 14.5px/1 var(--f-head)}
.hero__note{flex-basis:100%;text-align:center;margin:0;color:var(--stone);font-size:14.5px}
.proof{position:relative;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-lg);margin:26px auto 0;max-width:1060px;padding:20px 8px}
.proof>div{display:flex;align-items:center;justify-content:center;gap:14px;padding:4px 16px}
.proof>div+div{border-left:1px solid var(--line)}
.proof svg{width:30px;height:30px;color:var(--forest)}
.proof p{margin:0;display:flex;flex-direction:column;line-height:1.25}
.proof b{font:800 18px/1.2 var(--f-head);color:var(--forest)}
.proof small{color:var(--stone);font-size:13.5px}

/* ---------- FINDER ---------- */
.finder{padding:110px 0 100px}
.finder__tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.tile{position:relative;display:flex;flex-direction:column;text-align:left;background:#fff;border-radius:var(--r-lg);padding:24px 22px 0;border:1.6px solid var(--c,var(--line));transition:translate .4s var(--ease),box-shadow .4s,border-color .3s,background .3s;overflow:hidden;min-height:250px}
.tile--amber{--c:rgba(180,98,28,.35)} .tile--khaki{--c:rgba(143,124,79,.4)} .tile--kit{--c:rgba(14,59,43,.25)}
.tile:hover{translate:0 -4px;box-shadow:var(--shadow)}
.tile.is-on{border:2.4px solid var(--forest);background:linear-gradient(180deg,#EEF3EB,#fff);box-shadow:var(--shadow-lg)}
.tile .radio{position:absolute;left:22px;top:26px;width:26px;height:26px;border-radius:50%;border:2px solid #9aa39b;transition:border-color .25s}
.tile .radio::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--leaf);transform:scale(0);transition:transform .35s var(--ease)}
.tile.is-on .radio{border-color:var(--leaf)} .tile.is-on .radio::after{transform:scale(1)}
.tile__t{padding-left:40px;font:700 20px/1.25 var(--f-head);letter-spacing:-.02em;color:var(--ink);min-height:50px}
.tile__img{margin-top:auto;height:160px;display:flex;align-items:flex-end;justify-content:center;gap:0;padding-bottom:12px}
.tile__img img{height:140px;width:auto;mix-blend-mode:multiply;transition:transform .5s var(--ease)}
.tile:hover .tile__img img{transform:translateY(-4px)}
.tile__badge{position:absolute;top:0;left:50%;transform:translateX(-50%);background:var(--amber);color:#fff;font:700 11.5px/1 var(--f-head);letter-spacing:.1em;text-transform:uppercase;padding:7px 14px;border-radius:0 0 10px 10px}
.duo{display:flex;align-items:flex-end;justify-content:center}
.duo img{mix-blend-mode:multiply}
.duo img:first-child{height:100%;width:auto;position:relative;z-index:1;margin-right:-6%}
.duo img+img{height:auto;width:62%}
.tile__img.kitimg img{height:140px;width:auto}
.tile__img.duo img+img{width:auto;height:100px}

.result{position:relative;display:grid;grid-template-columns:260px 1fr 280px;align-items:center;gap:32px;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-lg);margin-top:30px;padding:26px 32px}
.result__pointer{position:absolute;top:-11px;left:var(--px,50%);width:22px;height:22px;background:#fff;transform:translateX(-50%) rotate(45deg);border-radius:4px 0 0 0;transition:left .5s var(--ease)}
.result__img{height:170px}
.result__img img:first-child{height:170px}
.result__img img+img{height:auto;width:58%}
.result__img.single img{height:170px;width:auto;margin:0}
.result__body h3{font-size:28px;margin:4px 0 14px}
.checks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.checks li{display:flex;align-items:center;gap:12px;font-size:16px}
.checks li::before{content:"";width:22px;height:22px;flex:none;border-radius:50%;background:var(--leaf) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.result__buy{border-left:1px solid var(--line);padding-left:32px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.big-price{font:800 40px/1 var(--f-head);color:var(--forest);margin:0;letter-spacing:-.03em}
.result__buy .btn{margin:10px 0 2px}
.swap-out{opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}

/* ---------- PRODUCT WORLDS ---------- */
.pworld{position:relative;padding:100px 0;overflow:hidden}
.pworld--amber{background:radial-gradient(70% 90% at 15% 50%,#EEDCC4,rgba(238,220,196,0) 70%),linear-gradient(180deg,#F8F3EB,#F1E7DA)}
.pworld--sage{background:radial-gradient(70% 90% at 85% 50%,#D3DFCD,rgba(211,223,205,0) 70%),linear-gradient(180deg,#EEF2EB,var(--sage))}
.pworld__in{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:60px}
.pworld__in--flip{grid-template-columns:1fr 1.05fr}
.pworld__media{position:relative;height:500px}
.macro{position:absolute;width:400px;height:400px;border-radius:50%;overflow:hidden;right:20px;top:20px;border:8px solid #fff;box-shadow:var(--shadow-lg)}
.macro img{width:100%;height:100%;object-fit:cover}
.media-card{position:absolute;right:0;top:40px;width:min(470px,86%);height:auto;border-radius:var(--r-lg);box-shadow:var(--shadow-lg);z-index:1}
.pworld__in--flip .media-card{right:auto;left:auto;right:0}
.plain{text-decoration:none;color:inherit}
.float-tag{position:absolute;right:24px;bottom:24px;z-index:3;display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.85);backdrop-filter:blur(8px);padding:12px 18px;border-radius:999px;font:600 14px/1 var(--f-head);color:var(--forest);box-shadow:var(--shadow)}
.float-tag--r{right:auto;left:10px;bottom:30px}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.dot--amber{background:var(--amber)} .dot--khaki{background:var(--khaki)}
.steps{list-style:none;margin:0 0 24px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.steps li{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.85);border-radius:var(--r-md);padding:16px 14px;box-shadow:0 1px 2px rgba(0,0,0,.04);font-size:14.5px;line-height:1.3}
.steps svg{width:28px;height:28px;color:var(--forest);padding-right:12px;border-right:1px solid var(--line);box-sizing:content-box}
.steps b{font-family:var(--f-head)}
.buyrow{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.price-lg{font:800 34px/1 var(--f-head);color:var(--forest);letter-spacing:-.02em}
.note-chip{display:inline-block;margin:22px 0 0;padding:9px 16px;border-radius:999px;background:rgba(255,255,255,.6);font-size:13.5px;color:var(--stone)}
.daynight{display:flex;align-items:center;gap:12px;margin:0 0 22px;color:#4b524c}
.dn-icon{position:relative;width:28px;height:28px}
.dn-icon svg{position:absolute;inset:0;width:28px;height:28px}
.dn-icon .sun{color:#d79b2a;animation:sunmoon 6s var(--ease) infinite}
.dn-icon .moon{color:var(--forest);animation:sunmoon 6s var(--ease) infinite reverse;opacity:0}
@keyframes sunmoon{0%,40%{opacity:1;transform:rotate(0)}50%,90%{opacity:0;transform:rotate(90deg) scale(.6)}100%{opacity:1;transform:rotate(0)}}
.macro--sm{width:190px;height:190px;right:auto;left:0;top:auto;bottom:30px;z-index:2}

/* ---------- REVIEWS ---------- */
.reviews{padding:110px 0 100px}
.reviews__top{display:grid;grid-template-columns:auto 260px 1fr;gap:44px;align-items:center;margin-bottom:46px}
.score__n{font:800 96px/.9 var(--f-head);color:var(--forest);margin:0;letter-spacing:-.05em}
.stars{display:flex;gap:3px;color:var(--gold);margin:10px 0 8px}
.stars svg{width:24px;height:24px}
.stars.sm svg{width:16px;height:16px}
.stars.sm{margin:0 0 8px}
.bars{list-style:none;margin:0;padding:0 0 0 0;display:grid;gap:8px;font-size:13px;color:var(--stone)}
.bars li{display:grid;grid-template-columns:16px 1fr 34px;align-items:center;gap:10px}
.bars i{height:8px;border-radius:9px;background:#E7ECE5;position:relative;overflow:hidden}
.bars i::after{content:"";position:absolute;inset:0;width:var(--v);background:var(--forest);border-radius:9px;transform-origin:left;transform:scaleX(var(--s,1))}
.bars em{font-style:normal;text-align:right}
.reviews__head{padding-left:44px;border-left:1px solid var(--line)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips span{padding:9px 16px;border:1.4px solid var(--line);border-radius:999px;font-size:14px;font-weight:500;background:#fff}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rcard{display:flex;gap:16px;background:#fff;border-radius:20px;padding:16px;box-shadow:var(--shadow);transition:translate .4s var(--ease),box-shadow .4s}
.rcard:hover{translate:0 -4px;box-shadow:var(--shadow-lg)}
.rcard--photo img{width:132px;height:150px;object-fit:cover;border-radius:14px;flex:none}
.avatar{width:52px;height:52px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--sage);color:var(--forest);font:800 20px/1 var(--f-head)}
.rcard blockquote{margin:0 0 10px;font:600 16px/1.4 var(--f-head);color:var(--ink);letter-spacing:-.01em}
.who{margin:0;font-size:14px;color:var(--stone)} .who b{color:var(--ink)}
.ver{margin:6px 0 0;display:flex;align-items:center;gap:6px;color:var(--leaf-2);font-size:13.5px;font-weight:600}
.ver svg{width:16px;height:16px;padding:2px;border-radius:50%;background:var(--leaf);color:#fff}
.center-row{display:flex;justify-content:center;align-items:center;gap:28px;margin-top:44px;flex-wrap:wrap}

/* ---------- COD ---------- */
.cod{position:relative;background:var(--forest);color:#fff;padding:90px 0 120px;overflow:hidden}
.cod::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E");pointer-events:none}
.cod::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-60px;height:120px;background:var(--porcelain);border-radius:50% 50% 0 0}
.cod__in{position:relative;z-index:1;display:grid;grid-template-columns:1fr 290px;gap:50px;align-items:center}
.cod__steps{position:relative;list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cod__line{position:absolute;left:16%;right:16%;top:44px;width:68%;height:2px;overflow:visible}
.cod__line line{stroke:rgba(255,255,255,.45);stroke-width:2;stroke-dasharray:4 6;vector-effect:non-scaling-stroke}
.cod__steps li{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center}
.cod__steps .ico{width:88px;height:88px;border-radius:50%;border:1.5px solid rgba(255,255,255,.5);display:grid;place-items:center;background:var(--forest);margin-bottom:18px}
.cod__steps .ico svg{width:38px;height:38px}
.cod__steps .num{position:absolute;top:-10px;left:calc(50% - 50px);width:32px;height:32px;border-radius:50%;background:var(--leaf);display:grid;place-items:center;font:800 15px/1 var(--f-head);z-index:1;box-shadow:0 0 0 4px var(--forest)}
.cod__steps b{font:700 19px/1.25 var(--f-head)}
.cod__steps small{color:rgba(255,255,255,.72);font-size:14.5px;margin-top:4px}
.promise{background:#fff;color:var(--forest);border-radius:var(--r-lg);padding:26px 24px;display:flex;gap:16px;align-items:center;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.promise svg{width:48px;height:48px;flex:none}
.promise p{margin:0;font:600 18px/1.35 var(--f-head)}

/* ---------- INSPECTOR ---------- */
.inspect{padding:70px 0 90px}
.inspect__stage{position:relative;height:560px;max-width:1000px;margin:30px auto 18px}
.inspect__bottle{position:absolute;left:50%;top:10px;height:500px;width:auto;transform:translateX(-50%);mix-blend-mode:multiply}
.inspect__stage::after{content:"";position:absolute;left:50%;bottom:24px;width:320px;height:50px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(14,59,43,.16),transparent);z-index:-1}
.inspect__lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.inspect__lines path{fill:none;stroke:var(--forest);stroke-width:1.5}
.inspect__lines circle{fill:var(--forest)}
.inspect__lines .pulse{fill:none;stroke:var(--leaf);stroke-width:2}
.callout{position:absolute;left:var(--x,auto);right:auto;top:var(--y);display:flex;align-items:center;gap:14px;background:#fff;padding:14px 22px 14px 14px;border-radius:999px;box-shadow:var(--shadow);font:600 17px/1.25 var(--f-head);color:var(--ink);max-width:300px}
.callout--r{left:auto;right:0}
.callout span{width:32px;height:32px;flex:none;border-radius:50%;background:var(--forest);color:#fff;display:grid;place-items:center;font-size:15px}

/* ---------- PACKS ---------- */
.packs{background:linear-gradient(180deg,var(--mist),var(--sage));padding:100px 0 80px}
.packs__grid{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:24px;align-items:stretch;margin-top:46px}
.pack{position:relative;background:#fff;border-radius:var(--r-lg);padding:30px 26px 26px;text-align:center;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;gap:6px;transition:translate .45s var(--ease),box-shadow .45s}
.pack:hover{translate:0 -6px;box-shadow:var(--shadow-lg)}
.pack h3{font-size:24px;margin-top:8px}
.pack__img{height:190px;display:flex;align-items:flex-end;justify-content:center}
.pack__img>img{height:180px;width:auto;mix-blend-mode:multiply}
.pack__img.duo img:first-child{height:170px}
.pack__img.duo img+img{height:auto;width:170px}
.pack__img{position:relative}
.times{position:absolute;right:-6px;top:6px;width:48px;height:48px;border-radius:50%;background:#B08D4A;color:#fff;display:grid;place-items:center;font:800 18px/1 var(--f-head);box-shadow:0 8px 18px -8px rgba(0,0,0,.35)}
.pack__price{font:800 32px/1.1 var(--f-head);color:var(--forest);margin:4px 0 0;letter-spacing:-.02em}
.pack__price s{font-size:20px;font-weight:600;margin-right:8px}
.pack .btn{margin-top:14px}
.pack--hero{border:2.4px solid var(--forest);padding:40px 28px 30px;box-shadow:var(--shadow-lg),0 0 0 8px rgba(59,170,74,.1)}
.pack__badge{position:absolute;top:-15px;left:50%;transform:translateX(-50%);background:var(--forest);color:#fff;font:700 12px/1 var(--f-head);letter-spacing:.12em;text-transform:uppercase;padding:9px 18px;border-radius:999px;white-space:nowrap}
.pack__badge--gold{background:#B08D4A;color:#fff}
.pay{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin-top:36px}
.pay span{background:#fff;border-radius:10px;padding:9px 16px;font:800 14px/1 var(--f-head);color:#1d2a6b;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.pay span:first-child{color:var(--forest)}
.pay em{display:inline-flex;align-items:center;gap:8px;font-style:normal;font-weight:600;color:var(--leaf-2);background:#fff;padding:9px 16px;border-radius:999px;margin-left:12px}
.pay em svg{width:18px;height:18px}

/* ---------- FAQ ---------- */
.faq{padding:100px 0 80px}
.faq__in{display:grid;grid-template-columns:400px 1fr;gap:60px;align-items:start}
.chat{margin-top:30px;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden}
.chat__head{display:flex;align-items:center;gap:10px;background:var(--forest);color:#fff;padding:16px 20px;font:700 16px/1 var(--f-head)}
.chat__head svg{width:26px;height:26px;color:#5fd47c}
.chat__head span{color:#9fe3ae;font-weight:500}
.chat__body{padding:20px;display:flex;flex-direction:column;gap:10px;min-height:150px}
.bubble{margin:0;padding:11px 15px;border-radius:16px;font-size:15px;max-width:85%;line-height:1.4}
.bubble--me{align-self:flex-end;background:#DCF3D9;border-bottom-right-radius:4px;display:flex;gap:8px;align-items:center}
.bubble--me svg{color:#34b7f1;width:16px;height:16px}
.bubble--them{align-self:flex-start;background:#F2F3F1;border-bottom-left-radius:4px}
.typing{align-self:flex-start;display:flex;gap:4px;background:#F2F3F1;padding:14px 16px;border-radius:16px;margin:0}
.typing i{width:7px;height:7px;border-radius:50%;background:#9aa19b;animation:typ 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes typ{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.acc details{background:#fff;border-radius:var(--r-md);margin-bottom:12px;box-shadow:0 1px 2px rgba(0,0,0,.04);border:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;font:700 17px/1.3 var(--f-head);color:var(--ink)}
.acc summary::-webkit-details-marker{display:none}
.acc summary i{position:relative;width:18px;height:18px;flex:none;transition:transform .35s var(--ease)}
.acc summary i::before,.acc summary i::after{content:"";position:absolute;left:0;right:0;top:8px;height:2px;background:var(--forest);border-radius:2px}
.acc summary i::after{transform:rotate(90deg);transition:transform .35s var(--ease)}
.acc details[open] summary i::after{transform:rotate(0)}
.acc details>div{overflow:hidden}
.acc details p{margin:0;padding:0 22px 20px;color:#4b524c}
.disclaimer{display:flex;align-items:center;justify-content:center;gap:10px;margin:0;background:var(--sage);padding:18px var(--gut);font-size:14px;color:#5d655e;text-align:center}
.disclaimer svg{width:20px;height:20px;color:var(--leaf)}

/* ---------- FOOTER ---------- */
.footer{position:relative;background:var(--forest);color:rgba(255,255,255,.82);padding:60px 0 0;overflow:hidden}
.footer__in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;position:relative;z-index:1}
.footer__brand img{height:52px;width:auto}
.footer h4{font:700 16px/1 var(--f-head);color:#fff;margin:8px 0 16px}
.footer a{display:block;text-decoration:none;margin-bottom:10px;font-size:15px}
.footer a:hover{color:#fff}
.social{display:flex;gap:14px}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.25);display:grid;place-items:center;margin:0}
.social svg{width:20px;height:20px}
.footer__bar{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.14);margin-top:40px;padding-top:22px;padding-bottom:28px;font-size:14px}
.footer__bar p{margin:0}
.footer__bar a{display:inline;margin:0}
.pay--dark{margin:0}
.pay--dark span{background:rgba(255,255,255,.1);color:#fff !important;box-shadow:none;font-size:12px;padding:7px 12px}
.urdu{font-family:var(--f-urdu);font-size:18px;line-height:2}
.footer__word{position:absolute;right:-20px;bottom:-60px;font:800 clamp(140px,20vw,280px)/1 var(--f-head);letter-spacing:-.06em;color:rgba(255,255,255,.05);pointer-events:none;user-select:none}

/* ---------- floating UI ---------- */
.sticky-bar{display:none}
.wa-float{position:fixed;left:22px;bottom:22px;z-index:40;width:58px;height:58px;border-radius:50%;background:#1fa855;color:#fff;display:grid;place-items:center;box-shadow:0 12px 26px -8px rgba(31,168,85,.6);animation:breathe 8s ease-in-out infinite}
.wa-float svg{width:30px;height:30px}
@keyframes breathe{0%,85%,100%{transform:scale(1)}90%{transform:scale(1.1)}95%{transform:scale(.97)}}
.scrim{position:fixed;inset:0;background:rgba(14,30,22,.45);opacity:0;pointer-events:none;transition:opacity .35s;z-index:70}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--porcelain);z-index:71;transform:translateX(102%);transition:transform .5s var(--ease);display:flex;flex-direction:column;box-shadow:-20px 0 60px -20px rgba(0,0,0,.3)}
body.cart-open .scrim{opacity:1;pointer-events:auto}
body.cart-open .drawer{transform:none}
.drawer__head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--line)}
.drawer__head h3{font-size:22px}
.freebar{padding:16px 22px;background:#fff;border-bottom:1px solid var(--line)}
.freebar p{margin:0 0 10px;font-weight:600;font-size:14.5px;color:var(--forest)}
.freebar__track{height:8px;background:#E7ECE5;border-radius:9px;overflow:hidden}
.freebar__track i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--leaf),#6cc977);border-radius:9px;transition:width .8s var(--ease)}
.drawer__items{flex:1;overflow:auto;padding:12px 22px}
.cline{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.cline__img{height:64px;background:#fff;border-radius:12px;display:flex;align-items:flex-end;justify-content:center;padding:4px;overflow:hidden}
.cline__img img{height:56px;width:auto;mix-blend-mode:multiply}
.cline__img.duo img+img{height:auto;width:36px}
.cline__img.duo img:first-child{height:54px}
.cline b{font:700 15px/1.3 var(--f-head);display:block}
.cline small{color:var(--stone)}
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:#fff}
.qty button{width:30px;height:30px;font-size:18px;font-weight:600;color:var(--forest)}
.qty span{min-width:20px;text-align:center;font-weight:700;font-size:14px}
.empty{text-align:center;color:var(--stone);padding:40px 0}
.upsell{margin:0 22px 12px;background:var(--sage);border-radius:var(--r-md);padding:16px}
.upsell__row{display:flex;gap:12px;align-items:center;margin:12px 0}
.upsell__img{height:56px;width:70px}
.upsell__img img:first-child{height:56px}
.upsell__img img+img{height:auto;width:40px}
.upsell p{margin:0;display:flex;flex-direction:column;font-size:14px}
.upsell b{font-family:var(--f-head)}
.drawer__foot{padding:16px 22px 22px;background:#fff;border-top:1px solid var(--line)}
.drawer__foot>p:not(.muted){display:flex;justify-content:space-between;margin:0 0 6px;font-size:15px}
.drawer__foot .total{font-size:18px !important;margin:10px 0 14px !important}
.drawer__foot .total b{font-family:var(--f-head);color:var(--forest)}
.drawer__foot .muted{margin-top:10px;display:flex;align-items:center;justify-content:center;gap:6px}
.fly{position:fixed;z-index:80;width:60px;height:60px;border-radius:50%;background:#fff;box-shadow:var(--shadow-lg);display:grid;place-items:center;pointer-events:none}
.fly img{height:46px;width:auto;mix-blend-mode:multiply}

/* reveal default (JS adds .js) */
.js .reveal{opacity:0;transform:translateY(24px)}
.js .hero__copy .eyebrow,.js .hero__sub,.js .plinth,.js .stage__products img,.js .mint,.js .side-card,.js .hero__cta>*,.js .proof,.js .giant-drop{opacity:0}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .hero__stage{grid-template-columns:210px 1fr 210px;gap:14px}
  .side-card{padding:18px 14px} .side-card h3{font-size:20px}
  .nav{gap:20px}
  .reviews__top{grid-template-columns:auto 1fr}
  .reviews__head{grid-column:1/-1;padding-left:0;border-left:0}
  .pworld__in,.pworld__in--flip{gap:30px}
  .macro{width:330px;height:330px}
}
@media (max-width:900px){
  .nav,.pill-help,.header__actions .header__cta{display:none !important}
  .header__menu{display:grid}
  .header__in{justify-content:space-between;gap:8px;height:64px}
  .logo img{height:36px}
  .hero{padding-top:28px}
  .hero__in{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}
  .hero__copy,.stage,.hero__cta,.proof{grid-column:1/-1}
  .hero__stage{display:contents}
  .hero__copy{order:1} .stage{order:2;height:340px} .hero__cta{order:3;margin-top:0} .side-card{order:4;margin-top:22px} .proof{order:5}
  .eyebrow{letter-spacing:.16em;font-size:11.5px}
  .eyebrow--lines::before,.eyebrow--lines::after{width:24px}
  .tag{font-size:9.5px;letter-spacing:.04em;padding:6px 9px;white-space:nowrap}
  .side-card{min-width:0}
  .stage__products{bottom:38px;height:300px}
  .p-duo{height:290px;left:calc(50% - 131px)}
  .stage__drop{left:calc(50% - 160px)} .stage__ripple{left:calc(50% - 152px)}
  .plinth{width:400px;height:90px;bottom:14px}
  .plinth__top{height:76px} .plinth__side{top:38px;height:48px}
  .stage__ripple{bottom:92px}
  .mint{left:calc(50% - 210px);bottom:74px;width:54px}
  .giant-drop{width:110px;left:-50px;top:70px}
  .side-card{padding:14px 12px;min-height:0}
  .side-card p{display:none}
  .side-card h3{font-size:17px;margin:10px 0 6px}
  .side-card .price{font-size:20px;margin-bottom:10px}
  .side-card .btn{width:100%}
  .proof{grid-template-columns:1fr 1fr;row-gap:16px}
  .proof>div:nth-child(3){border-left:0}
  .proof>div{justify-content:flex-start}
  .finder__tiles{grid-template-columns:1fr;gap:12px}
  .tile{flex-direction:row;align-items:center;min-height:0;padding:16px 16px 16px 18px}
  .tile .radio{position:relative;left:0;top:0;flex:none;margin-right:12px}
  .tile__t{padding:0;min-height:0;font-size:17px;flex:1}
  .tile__img{margin:0;height:84px;padding:0;width:110px}
  .tile__img img{height:80px}
  .tile__img.duo img:first-child{height:80px} .tile__img.duo img+img{height:58px}
  .result{grid-template-columns:1fr;padding:22px;gap:16px;text-align:left}
  .result__pointer{display:none}
  .result__img{height:150px} .result__img img:first-child{height:150px}
  .result__buy{border:0;padding:0}
  .result__buy .btn{width:100%}
  .pworld{padding:70px 0}
  .pworld__in,.pworld__in--flip{grid-template-columns:1fr}
  .pworld__in--flip .pworld__media{order:-1}
  .pworld__media{height:380px}
  .media-card{width:88%;top:0}
  .macro--sm{width:130px;height:130px;left:0;bottom:10px}
  .pworld__media{height:auto;aspect-ratio:1/0.92}
  .steps{grid-template-columns:1fr}
  .reviews__top{grid-template-columns:1fr;gap:24px}
  .rgrid{grid-template-columns:1fr}
  .cod__in{grid-template-columns:1fr}
  .cod__steps{grid-template-columns:1fr;gap:28px}
  .cod__line{display:none}
  .cod__steps li{flex-direction:row;text-align:left;gap:18px;align-items:center}
  .cod__steps .ico{margin:0;width:70px;height:70px;flex:none}
  .cod__steps .num{left:-6px;top:-6px}
  .cod__steps li>b,.cod__steps li>small{display:block}
  .cod__steps li{display:grid;grid-template-columns:70px 1fr;column-gap:18px}
  .cod__steps .ico{grid-row:1/3}
  .cod__steps b{align-self:end}
  .cod__steps small{align-self:start;margin:0}
  .inspect__stage{height:auto;display:flex;flex-direction:column;gap:10px}
  .inspect__bottle{position:relative;left:auto;transform:none;height:340px;margin:0 auto 10px;top:0}
  .inspect__lines{display:none}
  .callout{position:relative;left:auto;right:auto;top:auto;max-width:none;font-size:15px}
  .packs__grid{grid-template-columns:1fr;gap:30px}
  .pack--hero{order:-1}
  .faq__in{grid-template-columns:1fr;gap:30px}
  .footer__in{grid-template-columns:1fr 1fr}
  .footer__brand{grid-column:1/-1}
  .sticky-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);box-shadow:0 -10px 30px -16px rgba(0,0,0,.25);transform:translateY(110%);transition:transform .45s var(--ease)}
  .sticky-bar.is-on{transform:none}
  .sticky-bar__thumb{height:46px;width:56px}
  .sticky-bar__thumb img:first-child{height:46px} .sticky-bar__thumb img+img{height:auto;width:32px}
  .sticky-bar p{margin:0;flex:1;display:flex;flex-direction:column;line-height:1.2}
  .sticky-bar b{font:800 18px/1.1 var(--f-head);color:var(--forest)}
  .sticky-bar small{color:var(--stone);font-size:12.5px}
  .wa-float{bottom:86px;left:14px;width:52px;height:52px}
  .footer{padding-bottom:80px}
}
@media (max-width:560px){
  .announce{font-size:12.5px;height:36px}
  .announce__track{position:relative;width:100%;justify-content:center}
  .announce .dot{display:none}
  .announce__track span:not(.dot){display:none}
  .announce__track span.is-on{display:block;animation:popin .45s var(--ease)}
  .h1{font-size:40px}
  .hero__sub{font-size:18px}
  .stage{height:300px}
  .stage__products{height:260px;bottom:36px}
  .p-duo{height:262px;left:calc(50% - 118px)}
  .stage__drop{left:calc(50% - 140px)} .stage__ripple{left:calc(50% - 132px)}
  .plinth{width:320px;height:80px}
  .plinth__top{height:64px} .plinth__side{top:32px;height:42px}
  .mint{display:none}
  .stage__ripple{bottom:82px}
  .btn--lg{font-size:16px;padding:0 8px 0 22px;--h:58px;width:100%;justify-content:space-between}
  .hero__cta .was{font-size:17px}
  .save{font-size:13px;height:32px;padding:0 12px}
  .proof{margin-top:24px;padding:16px 6px}
  .proof>div{padding:4px 10px;gap:10px}
  .proof svg{width:24px;height:24px}
  .proof b{font-size:15px} .proof small{font-size:12px}
  .finder{padding:70px 0}
  .h2{font-size:31px}
  .big-price{font-size:34px}
  .pworld__media{height:330px}
  .float-tag{right:8px;bottom:8px;font-size:12.5px;padding:9px 13px}
  .buyrow{gap:14px}
  .buyrow .btn{flex:1}
  .rcard--photo img{width:96px;height:120px}
  .score__n{font-size:76px}
  .cod{padding:70px 0 100px}
  .promise p{font-size:16px}
  .footer__bar{flex-direction:column;align-items:flex-start}
  .pay em{margin:6px 0 0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .wa-float,.dn-icon svg{animation:none !important}
}

/* ---------- real-photo kit thumbnails ---------- */
.kitimg{display:flex;align-items:flex-end;justify-content:center}
.kitimg img{mix-blend-mode:multiply;width:auto;max-width:100%}
.result__img.kitimg img{height:180px}
.pack__img.kitimg img{height:185px}
.sticky-bar__thumb.kitimg img{height:46px}
.upsell__img.kitimg img{height:56px}
.cline__img img{height:56px;width:auto}
@media (max-width:900px){
  .tile__img.kitimg img{height:84px}
  .result__img.kitimg img{height:150px}
}

/* ===== WhatsApp under Buy Now ===== */
.btn--wa-outline{border:1.6px solid #1fa855;color:#178a45;background:#fff}
.btn--wa-outline svg{width:22px;height:22px;color:#1fa855;flex:none}
.btn--wa-outline:hover{background:#1fa855;color:#fff} .btn--wa-outline:hover svg{color:#fff}
.hero__cta{flex-direction:column;flex-wrap:nowrap;gap:12px}
.cta-price{display:flex;align-items:center;justify-content:center;gap:14px}
.cta-stack{display:flex;flex-direction:column;align-items:stretch;gap:10px;width:min(440px,100%)}
.cta-stack .btn{width:100%}
.cta-stack .btn--lg{justify-content:space-between}
.cta-stack .wa-under{--h:54px;justify-content:center;gap:10px;font-size:16px;padding:0 24px}
.hero__note{flex-basis:auto}

/* ===== Recent order popup ===== */
.buzz{position:fixed;left:22px;bottom:22px;z-index:44;display:flex;align-items:center;gap:12px;width:min(340px,calc(100vw - 28px));padding:10px 38px 10px 10px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 40px -14px rgba(14,59,43,.35);transform:translateY(calc(100% + 40px));opacity:0;transition:transform .55s var(--ease),opacity .4s}
.buzz.is-on{transform:none;opacity:1}
.buzz[hidden]{display:none}
.buzz__img{flex:none;width:58px;height:58px;border-radius:12px;background:var(--sage);display:grid;place-items:center;overflow:hidden}
.buzz__img img{max-width:88%;max-height:88%;object-fit:contain;mix-blend-mode:multiply}
.buzz p{margin:0;display:flex;flex-direction:column;gap:2px;line-height:1.25;min-width:0}
.buzz__who{font:700 14.5px/1.2 var(--f-head);color:var(--forest)}
.buzz__what{font-size:13.5px;color:var(--ink)}
.buzz__when{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--stone)}
.buzz__when svg{width:13px;height:13px;color:var(--leaf)}
.buzz__x{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:var(--stone);background:transparent}
.buzz__x svg{width:13px;height:13px}
.buzz__x:hover{background:var(--sage)}
@media (max-width:900px){
  .buzz{left:12px;bottom:84px;width:min(310px,calc(100vw - 24px));padding:8px 34px 8px 8px;border-radius:16px}
  .buzz__img{width:48px;height:48px}
  .buzz__who{font-size:13.5px} .buzz__what{font-size:12.5px}
}
@media (max-width:560px){
  .cta-stack{width:100%}
}
@media (prefers-reduced-motion:reduce){.buzz{transition:opacity .3s}}

/* ===== Floating widgets: WhatsApp <-> sale popup swap, sit low until sticky bar shows ===== */
.wa-float{transition:opacity .35s,transform .45s var(--ease),bottom .45s var(--ease)}
body.buzz-on .wa-float{opacity:0;transform:scale(.6);pointer-events:none}
.buzz{transition:transform .55s var(--ease),opacity .4s,bottom .45s var(--ease)}
@media (max-width:900px){
  .wa-float{bottom:calc(14px + env(safe-area-inset-bottom));left:14px}
  .buzz{bottom:calc(14px + env(safe-area-inset-bottom))}
  body.bar-up .wa-float,body.bar-up .buzz{bottom:calc(84px + env(safe-area-inset-bottom))}
}

/* sale popup: fit tall product photos (Instant bottle) inside the thumb */
.buzz__img{position:relative}
.buzz__img img{position:absolute;left:4px;top:4px;width:calc(100% - 8px);height:calc(100% - 8px);max-width:none;max-height:none;object-fit:contain}

/* ===== Quiet WhatsApp link (secondary to the buy button) ===== */
.wa-link{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:6px 12px;color:var(--stone);font:500 14.5px/1.3 var(--f-body);text-decoration:none;border-radius:12px;transition:color .2s,background .2s}
.wa-link svg{width:18px;height:18px;color:#1fa855;flex:none}
.wa-link u{text-decoration:underline;text-decoration-color:rgba(31,168,85,.45);text-underline-offset:3px;color:#178a45;font-weight:600}
.wa-link:hover{background:rgba(31,168,85,.08)} .wa-link:hover u{text-decoration-color:#1fa855}

/* packs: equal-height cards, buttons on one line */
.pack .btn{margin-top:auto}
.pack>.btn:last-child{margin-top:auto}
.packs__grid .pack{justify-content:flex-start}
.pack .muted.small{margin-bottom:14px}

/* homepage → product page links */
.stage__link{display:contents}
.stage__link img{cursor:pointer}
.hero__more{color:var(--forest);font-weight:700;text-underline-offset:3px;white-space:nowrap}
.hero__more:hover{color:var(--leaf-2)}
.result__more{display:inline-block;margin-top:6px;font-size:14px}
.result h3 a.plain:hover{color:var(--leaf-2)}
a.pack__img{display:flex;text-decoration:none}
.pack h3 a.plain:hover{color:var(--leaf-2)}
.rcard__link{display:contents}
a.sticky-bar__thumb{display:flex;text-decoration:none}

.side-card h3 a.plain:hover{color:var(--leaf-2)}