/* ===== الفهد ستور — landing ===== */
@font-face{font-family:Alx;font-weight:400;font-display:swap;src:url(../fonts/alexandria-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:Alx;font-weight:500;font-display:swap;src:url(../fonts/alexandria-arabic-500-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:Alx;font-weight:700;font-display:swap;src:url(../fonts/alexandria-arabic-700-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:Alx;font-weight:900;font-display:swap;src:url(../fonts/alexandria-arabic-900-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:Alx;font-weight:400;font-display:swap;src:url(../fonts/alexandria-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2212}
@font-face{font-family:Alx;font-weight:500;font-display:swap;src:url(../fonts/alexandria-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2212}
@font-face{font-family:Alx;font-weight:700;font-display:swap;src:url(../fonts/alexandria-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2212}
@font-face{font-family:Alx;font-weight:900;font-display:swap;src:url(../fonts/alexandria-latin-900-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+2212}
@font-face{font-family:Sai;font-weight:700;font-style:italic;font-display:swap;src:url(../fonts/saira-latin-700-italic.woff2) format('woff2')}
@font-face{font-family:Sai;font-weight:800;font-style:italic;font-display:swap;src:url(../fonts/saira-latin-800-italic.woff2) format('woff2')}

:root{
  --graphite:#111215; --carbon:#1A1B1F; --carbon-2:#232429;
  --titanium:#C9CBD1; --steel:#8B8E97; --white:#F6F6F4; --paper:#EDEDEA;
  --signal:#E3202E; --signal-d:#B5141F; --ok:#1F9D55;
  --line:rgba(201,203,209,.14); --line-2:rgba(201,203,209,.26);
  --metal:linear-gradient(180deg,#FFFFFF 0%,#E3E4E8 38%,#A9ACB4 72%,#D9DADF 100%);
  --font:Alx,"Segoe UI",Tahoma,sans-serif; --num:Sai,Alx,sans-serif;
  --wrap:1140px; --gut:20px; --ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html,body{overflow-x:clip}
body{margin:0;background:var(--graphite);color:var(--white);font:400 16px/1.8 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}
a{color:inherit}
h1,h2,h3,p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.num{font-family:var(--num);font-style:italic;font-weight:800;letter-spacing:.01em}
:focus-visible{outline:2px solid var(--titanium);outline-offset:3px;border-radius:8px}
.skip{position:absolute;top:8px;inset-inline-start:8px;z-index:300;padding:8px 14px;border-radius:10px;background:var(--white);color:var(--graphite);transform:translateY(-200%)}
.skip:focus{transform:none}

/* ---- buttons ---- */
.btn{position:relative;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:58px;padding:12px 28px;border:0;border-radius:14px;background:var(--signal);color:#fff;font:700 18px/1.3 var(--font);text-decoration:none;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 14px 34px -14px rgba(227,32,46,.75);transition:transform .15s var(--ease),background-color .2s;-webkit-tap-highlight-color:transparent;overflow:hidden}
.btn small{font:500 12.5px/1.35 var(--font);color:rgba(255,255,255,.82)}
.btn:hover{background:#EC2735}
.btn:active{transform:scale(.98)}

/* ---- header ---- */
.top{position:sticky;top:0;z-index:60;background:rgba(17,18,21,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid var(--line)}
.top__in{display:flex;align-items:center;justify-content:space-between;height:60px}
.top__logo img{height:42px;width:auto}
.top__cta{font:700 14px/1 var(--font);text-decoration:none;color:var(--white);padding:11px 16px;border-radius:11px;border:1px solid var(--line-2);transition:border-color .2s,background-color .2s}
.top__cta:hover{border-color:var(--titanium);background:rgba(255,255,255,.04)}

/* ---- section titles ---- */
.sec-head{margin-bottom:26px}
.sec-title{font:900 clamp(28px,7.6vw,48px)/1.2 var(--font);letter-spacing:-.01em;text-wrap:balance}
.sec-sub{margin-top:8px;color:var(--steel);font-size:15.5px;max-width:52ch}

/* ===== HERO ===== */
.hero{position:relative;overflow:hidden;isolation:isolate;padding:22px 0 34px;background:
  radial-gradient(80% 55% at 50% 72%,rgba(201,203,209,.10),transparent 70%),
  radial-gradient(60% 40% at 50% 100%,rgba(227,32,46,.16),transparent 70%),var(--graphite)}
.hero__bgword{position:absolute;z-index:-1;inset-inline:0;top:46%;text-align:center;font:800 italic clamp(120px,38vw,420px)/1 var(--num);color:transparent;-webkit-text-stroke:1px rgba(201,203,209,.09);letter-spacing:-.02em;white-space:nowrap;direction:ltr;pointer-events:none;user-select:none}
.hero__in{display:grid;gap:8px}
.hero__kicker{color:var(--steel);font:500 14px/1.5 var(--font);margin-bottom:10px}
.hero__title{font:900 clamp(34px,9.6vw,68px)/1.16 var(--font);letter-spacing:-.015em}
.hero__title .ln{display:block}
.hero__title .ln--soft{color:var(--titanium);font-weight:700}
.price{display:flex;align-items:flex-end;gap:12px;margin:18px 0 18px}
.price__n{font-size:clamp(76px,22vw,124px);line-height:.82;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;padding-inline-end:.06em;filter:drop-shadow(0 6px 22px rgba(201,203,209,.15))}
.price__c{display:flex;flex-direction:column;font:700 22px/1.2 var(--font);color:var(--white);padding-bottom:6px}
.price__c small{font:400 13px/1.4 var(--font);color:var(--steel)}
.btn--hero{width:100%;min-height:64px;font-size:20px}
.facts{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:16px;color:var(--titanium);font:500 13.5px/1.4 var(--font)}
.facts li{display:flex;align-items:center;gap:7px}
.facts svg{width:18px;height:18px;fill:none;stroke:var(--titanium);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* stage */
.stage{position:relative;order:-1;height:min(92vw,470px);margin:0 -4px 6px}
.stage__glow{position:absolute;inset:auto 6% 10%;height:62%;border-radius:50%;background:radial-gradient(closest-side,rgba(201,203,209,.16),rgba(201,203,209,0));filter:blur(6px)}
.prod{position:absolute;bottom:14%;width:56%}
.prod__img{position:relative;z-index:2;width:100%}
.prod__ref{position:absolute;top:100%;left:0;width:100%;transform:scaleY(-1) translateY(2px);opacity:.28;-webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.9) 0,transparent 55%);mask-image:linear-gradient(to top,rgba(0,0,0,.9) 0,transparent 55%);filter:blur(1px);pointer-events:none}
.prod--watch{right:-2%;width:62%;z-index:3;bottom:18%}
.prod--watch .prod__img{filter:drop-shadow(0 28px 36px rgba(0,0,0,.7)) drop-shadow(0 0 34px rgba(70,110,255,.22))}
.prod--buds{left:2%;width:52%;z-index:4;bottom:8%}
.prod--buds .prod__img{filter:drop-shadow(0 24px 30px rgba(0,0,0,.7)) drop-shadow(0 0 22px rgba(255,255,255,.12))}
.stage__floor{position:absolute;inset-inline:4%;bottom:5%;height:6%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.7),transparent)}
.stage__streak{position:absolute;top:50%;height:2px;width:70%;left:-80%;border-radius:2px;background:linear-gradient(90deg,rgba(227,32,46,0),rgba(227,32,46,.9) 70%,#fff);box-shadow:0 0 18px rgba(227,32,46,.7);opacity:0}
.stage__streak--2{top:56%;height:1px;width:45%}
.chip{position:absolute;z-index:5;padding:7px 12px;border-radius:999px;background:rgba(26,27,31,.8);border:1px solid var(--line-2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font:500 12.5px/1 var(--font);color:var(--white);white-space:nowrap}
.chip--a{top:8%;right:6%;direction:ltr;font-family:var(--num);font-style:italic;font-weight:700;letter-spacing:.02em}
.chip--b{top:30%;left:4%}

/* hero load sequence (the one orchestrated moment) */
.js .prod--watch{opacity:0;transform:translateX(-12%) scale(.94)}
.js .prod--buds{opacity:0;transform:translateX(12%) translateY(6%) scale(.94)}
.js .chip{opacity:0}
.js .hero__title .ln,.js .hero__kicker,.js .price,.js .hero__save,.js .btn--hero,.js .facts{opacity:0;transform:translateY(14px)}
.go .stage__streak{animation:streak 1.1s var(--ease) .05s forwards}
.go .stage__streak--2{animation:streak 1.1s var(--ease) .2s forwards}
.go .prod--watch{animation:watchIn 1s var(--ease) .32s forwards}
.go .prod--buds{animation:watchIn .9s var(--ease) .55s forwards}
.go .chip--a{animation:fade .6s ease 1.1s forwards}
.go .chip--b{animation:fade .6s ease 1.25s forwards}
.go .hero__kicker{animation:rise .7s var(--ease) .15s forwards}
.go .hero__title .ln:nth-child(1){animation:rise .7s var(--ease) .25s forwards}
.go .hero__title .ln:nth-child(2){animation:rise .7s var(--ease) .35s forwards}
.go .hero__title .ln:nth-child(3){animation:rise .7s var(--ease) .45s forwards}
.go .price{animation:rise .7s var(--ease) .6s forwards}
.go .hero__save{animation:rise .7s var(--ease) .66s forwards}
.go .btn--hero{animation:rise .7s var(--ease) .74s forwards}
.go .facts{animation:rise .7s var(--ease) .84s forwards}
@keyframes streak{0%{left:-80%;opacity:0}15%{opacity:1}100%{left:120%;opacity:0}}
@keyframes watchIn{to{opacity:1;transform:none}}
@keyframes fade{to{opacity:1}}
@keyframes rise{to{opacity:1;transform:none}}

/* ===== INSIDE ===== */
.inside{padding:64px 0 56px;background:linear-gradient(180deg,var(--graphite),#15161A)}
.inside__grid{display:grid;gap:14px}
.inside__photo{position:relative;margin:0;border-radius:22px;overflow:hidden;border:1px solid var(--line)}
.inside__photo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.inside__photo figcaption{position:absolute;inset-inline:0;bottom:0;padding:40px 18px 16px;background:linear-gradient(180deg,transparent,rgba(17,18,21,.9));font:700 16px/1.3 var(--font)}
.inside__photo figcaption b{font-size:30px;margin-inline-end:4px;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.items{display:grid;grid-template-columns:1fr 1fr;gap:10px;counter-reset:it}
.item{counter-increment:it;position:relative;display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:18px;background:var(--carbon);border:1px solid var(--line)}
.item::before{content:counter(it);position:absolute;top:10px;inset-inline-start:12px;font:800 italic 13px/1 var(--num);color:var(--steel)}
.item img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:12px;background:radial-gradient(closest-side,rgba(255,255,255,.07),transparent)}
.item:not(.item--lead) img{object-fit:cover;background:none}
.item b{display:block;font:700 15px/1.35 var(--font)}
.item span{display:block;font:400 12.5px/1.4 var(--font);color:var(--steel)}
.item--lead{grid-column:span 1;background:linear-gradient(160deg,var(--carbon-2),var(--carbon))}

/* ===== USE ===== */
.use{padding:56px 0 60px;background:#15161A}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:68%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gut) 8px;scroll-padding-inline:var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.shot{position:relative;margin:0;scroll-snap-align:start;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--carbon)}
.shot img{width:100%;aspect-ratio:4/5;object-fit:cover}
.shot figcaption{position:absolute;inset-inline:0;bottom:0;padding:44px 16px 14px;background:linear-gradient(180deg,transparent,rgba(10,10,12,.92));font:400 13px/1.5 var(--font);color:var(--titanium)}
.shot figcaption b{display:block;font:700 17px/1.35 var(--font);color:var(--white)}
.colors{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;margin-top:30px}
.colors__t{font:700 18px/1.4 var(--font)}
.colors__pair{display:flex;gap:10px}
.colors__pair figure{margin:0;width:96px;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--carbon)}
.colors__pair img{width:100%;aspect-ratio:3/4;object-fit:cover}
.colors__pair figcaption{display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 0;font:500 13px/1 var(--font)}
.sw{width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.sw--k{background:#0d0d0f}.sw--s{background:linear-gradient(135deg,#f3f3f5,#9a9ca4)}

/* ===== BRAND ===== */
.brand{position:relative;isolation:isolate;overflow:hidden;padding:min(78vw,420px) 0 64px;text-align:center}
.brand__img{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(17,18,21,.15) 0%,rgba(17,18,21,.1) 35%,rgba(17,18,21,.85) 62%,var(--graphite) 78%),url(../img/store.webp) 30% 0/auto 82% no-repeat,var(--graphite)}
.brand__logo{width:190px;margin:0 auto 10px}
.brand__line{font:900 clamp(23px,6vw,40px)/1.35 var(--font);text-wrap:balance}
.brand__sub{margin:8px auto 0;max-width:42ch;color:var(--titanium);font-size:15px}

/* ===== HOW ===== */
.how{padding:60px 0;background:var(--graphite)}
.steps{display:grid;gap:0;border-top:1px solid var(--line)}
.steps li{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line)}
.steps__n{flex:none;width:44px;font-size:34px;line-height:1;color:var(--steel)}
.steps li:last-child .steps__n{color:var(--signal)}
.steps b{display:block;font:700 18px/1.4 var(--font)}
.steps p{color:var(--steel);font-size:14.5px;line-height:1.7}

/* ===== REVIEWS ===== */
.reviews{padding:56px 0;background:#15161A}
.reviews__grid{display:grid;gap:12px}
.review{padding:16px;border-radius:18px;background:var(--carbon);border:1px solid var(--line)}
.review__stars{color:#F2C94C;letter-spacing:2px}
.review__by{margin-top:6px;color:var(--steel);font-size:13px}
.review img{margin-top:10px;border-radius:12px}

/* ===== ORDER ===== */
.order{scroll-margin-top:60px;padding:44px 0 56px;background:radial-gradient(70% 40% at 50% 0%,rgba(227,32,46,.13),transparent 70%),var(--graphite)}
.oform{padding:20px 16px 18px;border-radius:24px;background:var(--white);color:var(--graphite);box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
.flabel{display:block;margin-bottom:7px;font:700 14.5px/1.3 var(--font);color:var(--graphite)}
.qty{border:0;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.qty legend{grid-column:1/-1;padding:0}
.q{position:relative;cursor:pointer}
.q input{position:absolute;opacity:0;pointer-events:none}
.q__box{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 4px 10px;border-radius:14px;border:1.5px solid #D9D9DD;background:#fff;text-align:center;transition:border-color .2s,box-shadow .2s,background-color .2s}
.q__t{font:700 13.5px/1.3 var(--font)}
.q__p{font:500 12px/1.3 var(--font);color:#5F616A}
.q__p b{font-size:20px;color:var(--graphite)}
.q__save{margin-top:3px;padding:2px 8px;border-radius:999px;background:#F1F1F3;font:700 11px/1.5 var(--font);color:var(--signal-d)}
.q input:checked + .q__box{border-color:var(--graphite);background:#F7F7F8;box-shadow:0 0 0 3px rgba(17,18,21,.1)}
.q input:checked + .q__box .q__save{background:var(--signal);color:#fff}
.q input:focus-visible + .q__box{outline:2px solid var(--graphite);outline-offset:2px}
.field{margin-bottom:12px}
.field input,.field textarea{width:100%;padding:14px 15px;border-radius:13px;border:1.5px solid #D9D9DD;background:#fff;color:var(--graphite);font:500 16px/1.4 var(--font);transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.field textarea{resize:vertical;min-height:76px}
.field input::placeholder,.field textarea::placeholder{color:#A2A4AC;font-weight:400}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--graphite);box-shadow:0 0 0 3px rgba(17,18,21,.1)}
.ferr{display:none;margin-top:6px;font:500 12.5px/1.4 var(--font);color:var(--signal-d)}
.field.is-bad input,.field.is-bad textarea{border-color:var(--signal)}
.field.is-bad .ferr{display:block}
.field.is-ok input,.field.is-ok textarea{border-color:#9FD9B5}
.oform{position:relative}
.hp{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;opacity:0;pointer-events:none;clip-path:inset(50%);overflow:hidden}
.sum{margin:16px 0 14px;padding:12px 14px;border-radius:14px;background:#F2F2F3}
.sum__r{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;font:500 14px/1.4 var(--font);color:#4C4E56}
.sum__r b{font-size:17px;color:var(--graphite)}
.sum__r--save{color:var(--ok)}.sum__r--save b{color:var(--ok)}
.sum__r--total{margin-top:6px;padding-top:11px;border-top:1px solid #DCDCE0;font-weight:700;color:var(--graphite)}
.sum__r--total b{font-size:26px;color:var(--signal)}
.sum__r--total b.tick{animation:tick .45s var(--ease)}
@keyframes tick{0%{transform:scale(1.18)}100%{transform:none}}
.btn--submit{width:100%;min-height:62px;font-size:19px}
.btn__spin{display:none;position:absolute;inset-inline-start:18px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .8s linear infinite}
.btn.is-busy .btn__spin{display:block}.btn.is-busy{pointer-events:none;opacity:.9}
@keyframes spin{to{transform:rotate(360deg)}}
.form-msg{margin-top:10px;font:700 14px/1.5 var(--font);color:var(--signal-d);text-align:center}
.form-msg:empty{display:none}
.fail{margin-top:12px;padding:14px;border-radius:14px;background:#FFF1F2;border:1px solid #F4C2C6;color:#7A0D15;font:500 14px/1.6 var(--font)}
.fail a{display:flex;align-items:center;justify-content:center;margin-top:10px;min-height:52px;border-radius:12px;background:var(--ok);color:#fff;text-decoration:none;font:700 16px/1.2 var(--font)}
.wa-alt{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding:10px;font:500 14px/1.4 var(--font);color:#4C4E56;text-decoration:none}
.wa-alt svg{width:20px;height:20px;fill:var(--ok)}
.wa-alt:hover{color:var(--graphite)}

/* ===== FAQ ===== */
.faq{padding:56px 0 64px;background:var(--graphite)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 0;cursor:pointer;list-style:none;font:700 16.5px/1.5 var(--font)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;border-inline-end:2px solid var(--titanium);border-bottom:2px solid var(--titanium);transform:rotate(45deg) translateY(-3px);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg) translateY(-3px)}
.faq details p{padding:0 0 18px;color:var(--titanium);font-size:15px;max-width:62ch}

/* ===== FOOTER ===== */
.foot{padding:40px 0 120px;border-top:1px solid var(--line);background:#0E0F12;color:var(--steel);text-align:center;font-size:14px}
.foot__logo{width:120px;margin:0 auto 14px;opacity:.9}
.foot__links{display:flex;justify-content:center;gap:22px;margin-bottom:10px}
.foot__links a{color:var(--titanium);text-decoration:none}
.foot__links a:hover{color:var(--white)}

/* ===== STICKY (mobile) ===== */
.sticky{position:fixed;z-index:70;inset-inline:10px;bottom:calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:10px;padding:8px 8px 8px 8px;border-radius:18px;background:rgba(26,27,31,.86);border:1px solid var(--line-2);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transform:translateY(140%);transition:transform .4s var(--ease)}
.sticky.is-on{transform:none}
.sticky__p{display:flex;flex-direction:column;padding-inline:8px 2px;line-height:1}
.sticky__p b{font-size:28px;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.sticky__p span{font:400 11px/1.4 var(--font);color:var(--steel)}
.sticky__btn{flex:1;min-height:50px;font-size:16.5px;padding:10px 14px}
.sticky__wa{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:14px;background:var(--carbon-2);border:1px solid var(--line)}
.sticky__wa svg{width:24px;height:24px;fill:#3DDC84}

/* ===== THANK YOU ===== */
.done{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:18px;background:rgba(8,8,10,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.done__card{width:100%;max-width:420px;padding:28px 22px 20px;border-radius:24px;background:var(--white);color:var(--graphite);text-align:center;animation:pop .45s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.done__check svg{width:64px;height:64px;margin:0 auto 10px;fill:none;stroke:var(--ok);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.done__check circle{stroke-dasharray:151;stroke-dashoffset:151;animation:draw .6s ease .1s forwards}
.done__check path{stroke-dasharray:40;stroke-dashoffset:40;animation:draw .4s ease .55s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.done h2{font:900 26px/1.3 var(--font)}
.done__id{margin-top:4px;color:#5F616A;font-size:14px}
.done__sum{margin:14px 0;padding:10px 14px;border-radius:14px;background:#F2F2F3;text-align:start}
.done__sum li{display:flex;justify-content:space-between;padding:4px 0;font-size:14px}
.done__next{font-size:14.5px;color:#4C4E56}
.done__wa{width:100%;margin-top:14px;background:var(--ok);box-shadow:none}
.done__wa:hover{background:#22A85C}
.done__close{margin-top:8px;padding:10px 20px;border:0;background:none;color:#5F616A;font:500 15px/1 var(--font);cursor:pointer}

/* ===== DESKTOP ===== */
@media (min-width:880px){
  :root{--gut:32px}
  .hero{padding:40px 0 70px;min-height:calc(100vh - 60px);display:flex;align-items:center}
  .hero__in{grid-template-columns:1.1fr 1fr;align-items:center;gap:40px}
  .stage{order:0;height:620px;margin:0}
  .prod--watch{width:68%;bottom:20%;right:-4%}
  .prod--buds{width:56%;bottom:9%;left:-2%}
  .chip--b{top:26%;left:2%}
  .btn--hero{width:auto;min-width:340px}
  .hero__bgword{top:52%}
  .inside{padding:110px 0 100px}
  .inside__grid{grid-template-columns:.9fr 1.1fr;gap:20px;align-items:start}
  .inside__photo{position:sticky;top:84px}
  .items{grid-template-columns:repeat(3,1fr);gap:12px}
  .item--lead{grid-column:span 3;flex-direction:row;align-items:center;gap:18px}
  .item--lead img{width:40%}
  .item--lead b{font-size:20px}
  .use{padding:100px 0}
  .rail{grid-auto-columns:300px;padding-inline:max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)))}
  .colors{justify-content:start;grid-template-columns:auto auto;gap:28px}
  .colors__pair figure{width:120px}
  .brand{padding:0;min-height:620px;display:flex;align-items:center;text-align:start}.brand__img{inset:0 auto 0 0;width:64%;background:url(../img/store.webp) 40% center/cover no-repeat;-webkit-mask-image:linear-gradient(to left,transparent 0%,#000 38%),linear-gradient(to top,transparent 0%,#000 22%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to left,transparent 0%,#000 38%),linear-gradient(to top,transparent 0%,#000 22%);mask-composite:intersect}.brand__in{max-width:var(--wrap)}.brand__in>*{max-width:480px}.brand__sub{margin-inline:0}
  .how{padding:100px 0}
  .steps{grid-template-columns:repeat(4,1fr);gap:24px;border-top:0}
  .steps li{flex-direction:column;border-bottom:0;border-top:1px solid var(--line-2);padding-top:22px}
  .order{padding:110px 0}
  .order__in{display:grid;grid-template-columns:1fr 480px;gap:60px;align-items:start}
  .order__head{position:sticky;top:100px}
  .oform{padding:28px 26px 22px}
  .faq{padding:100px 0}
  .faq__in{max-width:820px}
  .sticky{display:none}
  .foot{padding-bottom:44px}
}
@media (prefers-reduced-motion:reduce){
  .js .prod--watch,.js .prod--buds,.js .chip{opacity:1;transform:none}
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}
  .stage__streak{display:none}
}

/* ===== conversion additions ===== */
.strip{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 10px;padding:8px var(--gut);background:var(--carbon);border-bottom:1px solid var(--line);font:500 12px/1.3 var(--font);color:var(--titanium)}
.strip i{width:4px;height:4px;border-radius:50%;background:var(--signal);flex:none}
.hero__save{margin:-8px 0 16px;font:500 13.5px/1.5 var(--font);color:var(--titanium)}
.order__pts{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font:500 13px/1.5 var(--font);color:var(--titanium)}
.order__pts li{display:flex;align-items:center;gap:6px}
.order__pts li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ok)}
.call-alt{display:block;text-align:center;margin-top:2px;padding:6px;font:500 13.5px/1.4 var(--font);color:#4C4E56;text-decoration:none}
.call-alt b{font-family:var(--num);font-weight:700;color:var(--graphite)}
.value{padding:60px 0;background:#15161A}
.value__rows{border-top:1px solid var(--line)}
.value__rows li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);font:500 15px/1.5 var(--font);color:var(--titanium)}
.value__rows b{flex:none;font:500 13px/1 var(--font);color:var(--steel);white-space:nowrap}
.value__rows b i{font-size:22px;color:var(--white)}
.value__tot{color:var(--white)}
.value__tot b i{color:var(--titanium);text-decoration:line-through;text-decoration-color:var(--signal);text-decoration-thickness:3px}
.value__ours{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 16px;margin-top:18px;padding:18px 18px 16px;border-radius:20px;background:var(--carbon);border:1px solid var(--line-2)}
.value__ours span{font:700 15px/1.4 var(--font)}
.value__ours b{grid-row:span 2;font-size:64px;line-height:.9;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent}
.value__ours .btn{grid-column:1;min-height:52px;font-size:16px;padding:8px 18px}
.guar{padding:56px 0;background:var(--graphite)}
.guar__in{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:start;padding:24px 20px;border-radius:24px;background:linear-gradient(160deg,var(--carbon-2),var(--carbon));border:1px solid var(--line-2)}
.guar__ic{width:64px;height:64px;fill:none;stroke:var(--ok);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.guar .sec-title{font-size:clamp(22px,6vw,32px);margin-bottom:8px}
.guar p{color:var(--titanium);font-size:15px}
.final{padding:60px 0 70px;background:radial-gradient(70% 50% at 50% 100%,rgba(227,32,46,.18),transparent 70%),#0E0F12;text-align:center}
.final__t{font:700 20px/1.4 var(--font);margin-bottom:16px}
.final__t b{font-size:40px;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;vertical-align:-4px}
.btn--final{width:100%;min-height:64px;font-size:20px}
.final__wa{display:inline-block;margin-top:14px;color:var(--titanium);font:500 14.5px/1.4 var(--font)}
@media (min-width:880px){
  .strip{font-size:13.5px;gap:18px}
  .value{padding:100px 0}.value__rows{max-width:620px}.value__ours{max-width:620px}
  .guar{padding:90px 0}.guar__in{padding:36px 40px;grid-template-columns:80px 1fr;gap:28px}.guar__ic{width:80px;height:80px}
  .final{padding:100px 0}.btn--final{width:auto;min-width:360px}
}