/* BARAKA NON — ommaviy sayt. Ranglar brend: qora + oltin (#f4c400). */
:root{
  --bg:#0d0b07; --bg2:#15120b; --card:#1a160e; --card2:#221d12; --line:rgba(244,196,0,.12); --line2:rgba(255,255,255,.08);
  --ink:#f6f1e3; --mut:#a59d88; --dim:#6f6855;
  --gold:#f4c400; --gold2:#ffd84d; --amber:#e8a200; --ember:#ff7a1a; --ok:#5fd38a; --bad:#ff6b5b;
  --r:22px; --r-sm:14px;
  --pad:clamp(16px,4vw,48px);
  --ease:cubic-bezier(.22,1,.36,1);
  --head:"Unbounded",system-ui,sans-serif;
  --body:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]:not(.cart-fab){display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:84px}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font:16px/1.55 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.lock{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--head);margin:0;line-height:1.05;letter-spacing:-.02em}
.gold{color:var(--gold)}
.ic{width:18px;height:18px;fill:currentColor;flex:0 0 auto}
::selection{background:var(--gold);color:#000}

/* fon: bug'doy zarralari (canvas) + don */
.grain-field{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.55}
body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.06;
  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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
main,footer,.nav{position:relative;z-index:2}
.glow-cursor{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(244,196,0,.10),rgba(244,196,0,0) 62%);transition:opacity .4s;opacity:0}
.progress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);z-index:60;
  background:linear-gradient(90deg,var(--amber),var(--gold2))}

/* Ochilish — botdagi (webapp/index.html #intro) bilan bir xil, o'lchamlari kattaroq */
@property --ia{syntax:"<angle>";inherits:false;initial-value:0deg}
#intro{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:#0B0B0B;overflow:hidden;cursor:pointer;
  transition:opacity .6s ease,transform .7s var(--ease)}
#intro.out{opacity:0;transform:scale(1.04);pointer-events:none}
#introGl{display:none;width:min(88vw,540px);height:min(88vw,540px)}
/* intro.js o'lchamni canvas.clientWidth dan oladi: shuning uchun canvas oldindan joyida (ko'rinmas) turadi, aks holda 340px da chizib cho'zadi */
#intro.gl #introGl{display:block;visibility:hidden;margin-bottom:-46px}
#intro.gl-on #introGl{visibility:visible}
#intro.gl .em{display:none}
#intro.gl .word{opacity:0;animation:none}
#intro.gl .tag{display:block}
#intro.gl-on #introGl{display:block;margin-bottom:-46px;transition:transform .5s ease}
#intro.gl-on.out #introGl{transform:scale(1.08)}
#intro .tag{position:static;background:none;border:0;border-radius:0;-webkit-backdrop-filter:none;backdrop-filter:none;
  display:none;font:600 clamp(15px,2.2vw,20px)/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:.06em;color:#BFAE88;opacity:0;text-align:center;padding:0 16px}
#intro.gl-on .word{animation:iWordGl .9s 1.28s cubic-bezier(.2,.8,.2,1) forwards;background:linear-gradient(100deg,#B8860B 0%,#F5C518 35%,#FFF3C4 50%,#F5C518 65%,#B8860B 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
#intro.gl-on .tag{animation:iTag .7s 1.7s ease-out forwards}
#intro .em{position:relative;width:min(62vw,280px);height:min(62vw,280px)}
#intro .em img{position:absolute;inset:0;width:100%;height:100%;display:block}
#intro .glow{position:absolute;inset:-46%;border-radius:50%;background:radial-gradient(circle,rgba(245,197,24,.34),rgba(245,197,24,0) 62%);opacity:0;animation:iGlow 1.8s ease-out forwards}
#intro .ring{-webkit-mask-image:conic-gradient(from 180deg,#000 var(--ia),transparent 0);mask-image:conic-gradient(from 180deg,#000 var(--ia),transparent 0);animation:iRing .8s cubic-bezier(.5,.05,.2,1) forwards}
#intro .hands{opacity:0;transform:translateY(20%);animation:iHands .6s .3s cubic-bezier(.2,.9,.25,1.1) forwards}
#intro .wl,#intro .wr{opacity:0;transform-origin:50% 78%;animation:iWheat .6s .62s cubic-bezier(.2,.9,.25,1.15) forwards}
#intro .wl{--r:-14deg}#intro .wr{--r:14deg;animation-delay:.72s}
#intro .shine{position:absolute;inset:0;overflow:hidden;-webkit-mask:url(/webapp/intro/full.webp) center/100% 100% no-repeat;mask:url(/webapp/intro/full.webp) center/100% 100% no-repeat}
#intro .shine i{position:absolute;top:-30%;bottom:-30%;left:-60%;width:46%;background:linear-gradient(100deg,transparent,rgba(255,250,225,.95),transparent);transform:skewX(-14deg);animation:iShine .7s 1.2s ease-in-out forwards}
#intro .word{font:800 clamp(34px,6.4vw,56px)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:.42em;margin-right:-.42em;color:#F5C518;opacity:0;animation:iWord .6s 1.1s ease-out forwards}
#intro:not(.gl) .tag{display:block;animation:iTag .7s 1.5s ease-out forwards}
@keyframes iRing{to{--ia:360deg}}
@keyframes iHands{to{opacity:1;transform:none}}
@keyframes iWheat{from{opacity:0;transform:rotate(var(--r)) scaleY(.35)}to{opacity:1;transform:none}}
@keyframes iShine{to{left:125%}}
@keyframes iWord{from{opacity:0;letter-spacing:.7em;margin-right:-.7em}to{opacity:1;letter-spacing:.42em;margin-right:-.42em}}
@keyframes iWordGl{from{opacity:0;transform:translateY(9px);letter-spacing:.62em;margin-right:-.62em;background-position:100% 0}to{opacity:1;transform:none;letter-spacing:.42em;margin-right:-.42em;background-position:0 0}}
@keyframes iTag{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes iGlow{0%,45%{opacity:0;transform:scale(.7)}72%{opacity:1;transform:scale(1.05)}100%{opacity:.55;transform:scale(1)}}

/* Menyu */
.nav{position:fixed;left:0;right:0;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px var(--pad);transition:background .4s,padding .4s,border-color .4s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(13,11,7,.78);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);padding-top:10px;padding-bottom:10px;border-color:var(--line)}
.brand{display:flex;align-items:center;gap:10px;font:800 17px var(--head);letter-spacing:.08em}
.brand img{width:36px;height:36px;transition:transform .8s var(--ease)}
.brand:hover img{transform:rotate(-20deg) scale(1.08)}
.brand em{font-style:normal;color:var(--gold);font-weight:500;letter-spacing:0;margin-left:4px;font-size:13px}
.links{display:flex;gap:4px;padding:5px;border:1px solid var(--line2);border-radius:99px;background:rgba(255,255,255,.03)}
.links a{padding:8px 15px;border-radius:99px;font-weight:600;font-size:14px;color:var(--mut);transition:color .25s,background .25s}
.links a:hover,.links a.on{color:var(--ink);background:rgba(244,196,0,.12)}
.nav-right{display:flex;align-items:center;gap:10px}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line2);background:rgba(255,255,255,.04);position:relative;cursor:pointer}
.burger i{position:absolute;left:13px;right:13px;height:2px;background:var(--ink);border-radius:2px;transition:transform .35s var(--ease),top .35s var(--ease)}
.burger i:first-child{top:17px}.burger i:last-child{top:25px}
.burger[aria-expanded=true] i:first-child{top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] i:last-child{top:21px;transform:rotate(-45deg)}

/* Tugmalar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:15px 24px;border-radius:99px;font-weight:800;font-size:15px;
  border:1px solid transparent;cursor:pointer;transition:transform .35s var(--ease),background .25s,border-color .25s,box-shadow .35s;white-space:nowrap;will-change:transform}
.btn .arr{display:inline-block;transition:transform .35s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn-gold{background:var(--gold);color:#120f05;box-shadow:0 10px 30px -10px rgba(244,196,0,.55)}
.btn-gold:hover{background:var(--gold2);box-shadow:0 16px 40px -12px rgba(244,196,0,.75)}
.btn-ghost{background:rgba(255,255,255,.04);border-color:var(--line2)}
.btn-ghost:hover{border-color:rgba(244,196,0,.5);background:rgba(244,196,0,.07)}
.btn-sm{padding:10px 18px;font-size:14px}
.btn.wide{width:100%}
.btn:active{transform:scale(.97)}
.btn:focus-visible,.links a:focus-visible,.chip:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* HERO */
.hero{min-height:100svh;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:24px;padding:110px var(--pad) 70px;position:relative;max-width:1440px;margin:0 auto}
.pill{display:inline-flex;align-items:center;gap:9px;padding:8px 15px 8px 12px;border:1px solid var(--line);border-radius:99px;background:rgba(244,196,0,.06);font-size:13px;font-weight:700;color:var(--gold2)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(244,196,0,.6);animation:ping 1.8s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(244,196,0,.6)}100%{box-shadow:0 0 0 12px rgba(244,196,0,0)}}
.hero-title{font-size:clamp(44px,7.4vw,112px);font-weight:900;margin:24px 0 22px;letter-spacing:-.035em;line-height:.98}
.hero-title .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero-title .line>span{display:inline-block;transform:translateY(110%);transition:transform 1.1s var(--ease)}
.ready .hero-title .line>span{transform:none}
.ready .hero-title .line:nth-child(2)>span{transition-delay:.08s}
.ready .hero-title .line:nth-child(3)>span{transition-delay:.16s}
.rot-wrap{color:var(--gold);position:relative;white-space:nowrap}
.rot{display:inline-block;transition:transform .55s var(--ease),opacity .45s,filter .45s}
.rot.out{transform:translateY(-60%) rotateX(60deg);opacity:0;filter:blur(6px)}
.rot.in{transform:translateY(60%) rotateX(-60deg);opacity:0;filter:blur(6px);transition:none}
.lead{font-size:clamp(16px,1.35vw,19px);color:var(--mut);max-width:540px;margin:0 0 30px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-stats{display:flex;gap:clamp(18px,3vw,44px);margin-top:44px;padding-top:26px;border-top:1px solid var(--line2);max-width:540px}
.hero-stats b{display:block;font:800 clamp(26px,2.6vw,36px) var(--head);color:var(--ink)}
.hero-stats span{font-size:13px;color:var(--mut)}

.hero-art{position:relative;aspect-ratio:1;width:min(100%,600px);justify-self:center}
.sun{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(255,216,77,.38),rgba(244,196,0,.12) 45%,rgba(244,196,0,0) 70%);filter:blur(10px);animation:breathe 6s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.08);opacity:.8}}
.orbit{position:absolute;inset:0;width:100%;height:100%;animation:spin 40s linear infinite}
.orbit text{font:700 15.5px var(--head);letter-spacing:.32em;fill:rgba(244,196,0,.55)}
@keyframes spin{to{transform:rotate(360deg)}}
.emblem{position:absolute;inset:22%;width:56%;height:56%;object-fit:contain;filter:drop-shadow(0 20px 60px rgba(244,196,0,.35));opacity:0;transform:scale(.7) rotate(-12deg);transition:opacity 1.2s .2s var(--ease),transform 1.4s .2s var(--ease)}
.ready .emblem{opacity:1;transform:none}
.float-card{position:absolute;width:clamp(96px,11vw,150px);aspect-ratio:1;border-radius:24px;background:var(--card2) center/cover no-repeat;border:1px solid rgba(255,255,255,.1);
  box-shadow:0 24px 50px -18px rgba(0,0,0,.8);opacity:0;transition:opacity 1s var(--ease)}
.ready .float-card{opacity:1}
.float-card::after{content:attr(data-label);position:absolute;left:8px;right:8px;bottom:8px;padding:5px 8px;border-radius:10px;background:rgba(13,11,7,.78);backdrop-filter:blur(6px);
  font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc1{left:-2%;top:12%;transform:rotate(-8deg);animation:bob 7s ease-in-out infinite}
.fc2{right:-1%;top:6%;transform:rotate(7deg);animation:bob 8s -2s ease-in-out infinite}
.fc3{right:6%;bottom:6%;transform:rotate(-5deg);animation:bob 6.5s -4s ease-in-out infinite}
.fc1,.fc2,.fc3{transition-delay:.5s}
@keyframes bob{50%{translate:0 -12px}}
.chip-live{position:absolute;left:4%;bottom:12%;display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;background:rgba(26,22,14,.85);
  border:1px solid var(--line);backdrop-filter:blur(8px);font-size:13px;font-weight:700;box-shadow:0 18px 40px -16px rgba(0,0,0,.8)}
.chip-live .dot{background:var(--ok);animation:none;box-shadow:0 0 10px var(--ok)}
.scroll-hint{position:absolute;left:50%;bottom:22px;width:26px;height:42px;border:2px solid rgba(255,255,255,.22);border-radius:14px;transform:translateX(-50%)}
.scroll-hint span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--gold);animation:wheel 1.8s infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* Yuguruvchi qatorlar */
.marquee{padding:30px 0;border-block:1px solid var(--line);background:linear-gradient(180deg,rgba(244,196,0,.04),rgba(244,196,0,0));overflow:hidden;position:relative;z-index:2}
.mq-row{overflow:hidden;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mq-track{display:inline-flex;gap:0;animation:mq 60s linear infinite}
.mq-row.rev .mq-track{animation-direction:reverse;animation-duration:75s}
.mq-row+.mq-row{margin-top:10px}
.mq-track span{font:800 clamp(28px,4.4vw,58px) var(--head);letter-spacing:-.02em;padding:0 .5em;color:transparent;-webkit-text-stroke:1.2px rgba(244,196,0,.55)}
.mq-track span:nth-child(3n+1){color:var(--ink);-webkit-text-stroke:0}
.mq-track span.star{color:var(--gold);-webkit-text-stroke:0;padding:0 .1em}
.mq-row.rev .mq-track span{font-size:clamp(18px,2.2vw,28px);font-family:var(--body);font-weight:700;color:var(--mut);-webkit-text-stroke:0}
.mq-row.rev .mq-track span.star{color:var(--gold)}
@keyframes mq{to{transform:translateX(-50%)}}
.marquee:hover .mq-track{animation-play-state:paused}

/* Bo'limlar */
section{position:relative;z-index:2}
.why,.catalog,.process,.partner,.faq,.contact{max-width:1280px;margin:0 auto;padding:clamp(80px,11vw,150px) var(--pad) 0}
.sec-head{margin-bottom:clamp(30px,5vw,56px)}
.sec-head.row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.kicker::before{content:"";width:28px;height:2px;background:var(--gold);border-radius:2px}
.sec-head h2{font-size:clamp(32px,5vw,68px);font-weight:800}

/* Nega Baraka: aylantirganda yonadigan ro'yxat */
.why-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line2)}
.why-list li{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:20px;padding:clamp(22px,3vw,34px) 0;border-bottom:1px solid var(--line2);transition:padding .6s var(--ease)}
.why-list .n{font:700 15px var(--head);color:var(--dim);transition:color .5s}
.why-list h3{font-size:clamp(26px,4.4vw,58px);font-weight:800;color:rgba(246,241,227,.16);transition:color .6s var(--ease),transform .6s var(--ease);transform-origin:0 50%}
.why-list p{margin:0;max-height:0;opacity:0;overflow:hidden;color:var(--mut);font-size:clamp(15px,1.2vw,18px);transition:max-height .6s var(--ease),opacity .5s,margin .6s var(--ease);max-width:560px}
.why-list .emo{font-size:clamp(28px,3vw,42px);opacity:0;transform:scale(.4) rotate(-30deg);transition:opacity .5s,transform .7s var(--ease)}
.why-list li.on .n{color:var(--gold)}
.why-list li.on h3{color:var(--gold)}
.why-list li.on p{max-height:120px;opacity:1;margin-top:10px}
.why-list li.on .emo{opacity:1;transform:none}
.why-list li.seen h3{color:rgba(246,241,227,.55)}

/* Katalog */
.cat-tools{display:flex;gap:10px;margin-bottom:14px}
.search{flex:1;display:flex;align-items:center;gap:10px;padding:0 16px;border-radius:16px;background:var(--card);border:1px solid var(--line2);transition:border-color .25s,box-shadow .25s}
.search:focus-within{border-color:rgba(244,196,0,.6);box-shadow:0 0 0 4px rgba(244,196,0,.1)}
.search .ic{color:var(--mut)}
.search input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--ink);font:600 16px var(--body);padding:15px 0}
.search input::placeholder{color:var(--dim)}
#sort{appearance:none;-webkit-appearance:none;background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a59d88'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") right 10px center/22px no-repeat;
  border:1px solid var(--line2);border-radius:16px;color:var(--ink);font:700 14px var(--body);padding:0 40px 0 16px;cursor:pointer;outline:0}
#sort:focus{border-color:rgba(244,196,0,.6)}
#sort option{background:var(--card);color:var(--ink)}
.chips{display:flex;gap:8px;overflow-x:auto;padding:4px 0 18px;scrollbar-width:none;margin-bottom:8px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-radius:99px;border:1px solid var(--line2);background:rgba(255,255,255,.03);font-weight:700;font-size:14px;cursor:pointer;transition:all .25s var(--ease)}
.chip small{font-size:11px;color:var(--dim);font-weight:800}
.chip:hover{border-color:rgba(244,196,0,.5)}
.chip.on{background:var(--gold);color:#120f05;border-color:var(--gold)}
.chip.on small{color:rgba(0,0,0,.55)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{position:relative;background:var(--card);border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;cursor:pointer;
  transform-style:preserve-3d;transition:transform .5s var(--ease),border-color .3s,box-shadow .5s;opacity:0;translate:0 26px;animation:cardIn .7s var(--ease) forwards}
@keyframes cardIn{to{opacity:1;translate:0 0}}
.card:hover{border-color:rgba(244,196,0,.4);box-shadow:0 30px 60px -30px rgba(244,196,0,.35)}
.card .im{aspect-ratio:1/1;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 40%,#2c2416,#17130b)}
.card .im img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease),opacity .5s;opacity:0}
.card .im img.ok{opacity:1}
.card:hover .im img{transform:scale(1.07)}
.card .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(44px,5vw,64px);filter:saturate(1.1)}
.card .ph::after{content:"";position:absolute;inset:auto 18% 16% 18%;height:12px;border-radius:50%;background:rgba(0,0,0,.45);filter:blur(8px)}
.card .shine{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,230,140,.18),transparent 45%);opacity:0;transition:opacity .3s}
.card:hover .shine{opacity:1}
.card .b{padding:14px 14px 14px;display:flex;flex-direction:column;gap:4px;flex:1}
.card .n{font-weight:800;font-size:15px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .c{font-size:12px;color:var(--dim);font-weight:700}
.card .pr{margin-top:auto;padding-top:10px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.card .pr b{font:800 17px var(--head);letter-spacing:-.01em}
.card .pr b small{font:600 12px var(--body);color:var(--mut);margin-left:2px}
.card .pr s{color:var(--dim);font-size:12px;display:block}
.card .pr .ask{color:var(--gold);font-weight:700;font-size:14px}
.mb-tx .p.ask{color:var(--gold);font-size:22px}
.add{width:40px;height:40px;flex:0 0 auto;border-radius:50%;border:0;background:var(--gold);color:#120f05;font:800 22px/1 var(--body);cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:transform .35s var(--ease),background .25s}
.add:hover{transform:rotate(90deg) scale(1.08);background:var(--gold2)}
.add.qty{width:auto;padding:0 6px;gap:4px;border-radius:99px;font-size:14px}
.add.qty:hover{transform:none}
.add.qty i{font-style:normal;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:18px}
.add.qty i:hover{background:rgba(0,0,0,.12)}
.tag{position:absolute;top:12px;left:12px;z-index:2;padding:5px 10px;border-radius:99px;font-size:11px;font-weight:800;background:rgba(13,11,7,.8);backdrop-filter:blur(6px);border:1px solid var(--line)}
.tag.hot{background:var(--ember);color:#fff;border-color:transparent}
.tag.pop{color:var(--gold2)}
.card.out{opacity:.5}
.card.out .add{background:#3a3424;color:var(--dim);cursor:not-allowed}
.tag.outt{background:#3a3424;color:var(--mut)}
.card.flash{animation:cardIn .7s var(--ease) forwards,flash 1.6s .2s}
@keyframes flash{0%,100%{box-shadow:0 0 0 0 rgba(244,196,0,0)}30%{box-shadow:0 0 0 4px var(--gold),0 0 60px rgba(244,196,0,.6)}}
.skel{aspect-ratio:3/4;border-radius:var(--r);background:linear-gradient(100deg,var(--card) 30%,var(--card2) 50%,var(--card) 70%);background-size:300% 100%;animation:sk 1.4s infinite}
@keyframes sk{to{background-position:-150% 0}}
.empty{grid-column:1/-1;text-align:center;padding:60px 10px;color:var(--mut);font-weight:700}
.empty span{display:block;font-size:46px;margin-bottom:6px}
.more-wrap{display:flex;justify-content:center;margin-top:28px}
.cat-note{text-align:center;color:var(--dim);font-size:13px;margin:18px 0 0}

/* Jarayon */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.steps-line{position:absolute;left:28px;right:28px;top:27px;height:2px;background:var(--line2);border-radius:2px;overflow:hidden}
.steps-line i{position:absolute;inset:0;background:linear-gradient(90deg,var(--amber),var(--gold2));transform-origin:0 50%;transform:scaleX(0)}
.step{position:relative}
.step-dot{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 18px var(--head);background:var(--bg);border:2px solid var(--line2);color:var(--dim);
  transition:all .6s var(--ease);position:relative;z-index:1;margin-bottom:22px}
.step.on .step-dot{border-color:var(--gold);color:#120f05;background:var(--gold);box-shadow:0 0 40px rgba(244,196,0,.45)}
.step h3{font-size:clamp(20px,2vw,26px);margin-bottom:8px;transition:color .5s}
.step p{margin:0;color:var(--mut);font-size:15px}
.step:not(.on) h3{color:var(--dim)}

/* Hamkorlik */
.partner-card{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center;padding:clamp(28px,5vw,64px);border-radius:32px;overflow:hidden;position:relative;
  background:radial-gradient(120% 120% at 100% 0%,rgba(244,196,0,.20),rgba(244,196,0,0) 55%),linear-gradient(160deg,#1d180e,#120f08);border:1px solid var(--line)}
.partner-card::before{content:"";position:absolute;right:-120px;bottom:-140px;width:420px;height:420px;background:url(/webapp/intro/full.webp) center/contain no-repeat;opacity:.05;pointer-events:none}
.partner-text h2{font-size:clamp(30px,4vw,52px);font-weight:800;margin-bottom:24px}
.ticks{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:12px}
.ticks li{display:flex;gap:12px;align-items:flex-start;font-weight:600;color:#ddd5c0}
.ticks li::before{content:"✓";flex:0 0 26px;height:26px;border-radius:50%;background:rgba(244,196,0,.15);color:var(--gold);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:13px}
.partner-phone{display:flex;justify-content:center}
.phone{width:min(300px,100%);border-radius:36px;padding:18px 14px 22px;background:#0b0a07;border:8px solid #29241a;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(244,196,0,.2);
  display:flex;flex-direction:column;gap:10px;transform:rotate(4deg);transition:transform .8s var(--ease)}
.partner-card:hover .phone{transform:rotate(0) translateY(-6px)}
.ph-top{display:flex;align-items:center;gap:10px;padding:0 4px 10px;border-bottom:1px solid var(--line2);margin-bottom:4px}
.ph-top img{width:34px;height:34px;border-radius:50%;background:#1a160e;padding:3px}
.ph-top b{display:block;font-size:14px}.ph-top small{color:var(--ok);font-size:12px;font-weight:700}
.bubble{max-width:86%;padding:10px 13px;border-radius:16px;font-size:13px;font-weight:600;line-height:1.4;opacity:0;transform:translateY(10px) scale(.96)}
.bubble.in{align-self:flex-start;background:#26211a;border-bottom-left-radius:5px}
.bubble.out{align-self:flex-end;background:var(--gold);color:#16120a;border-bottom-right-radius:5px}
.bubble.small{font-size:12px;background:rgba(244,196,0,.14);color:var(--gold2);border:1px solid var(--line)}
.vis .bubble{animation:bub .6s var(--ease) forwards}
.vis .bubble:nth-child(3){animation-delay:.9s}.vis .bubble:nth-child(4){animation-delay:1.7s}
@keyframes bub{to{opacity:1;transform:none}}
.typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:#26211a;border-radius:16px;opacity:0}
.vis .typing{animation:bub .4s 2.4s forwards}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--mut);animation:tdot 1.2s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes tdot{30%{transform:translateY(-4px);background:var(--gold)}}

/* Savollar */
.faq-list{display:grid;gap:12px;max-width:900px}
details{border:1px solid var(--line2);border-radius:20px;background:var(--card);transition:border-color .3s,background .3s}
details[open]{border-color:rgba(244,196,0,.4);background:var(--card2)}
summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;font:700 clamp(16px,1.5vw,19px) var(--body)}
summary::-webkit-details-marker{display:none}
summary i{flex:0 0 32px;height:32px;border-radius:50%;border:1px solid var(--line2);position:relative;transition:transform .4s var(--ease),background .3s}
summary i::before,summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--gold);border-radius:2px}
summary i::after{transform:rotate(90deg);transition:transform .4s var(--ease)}
details[open] summary i{transform:rotate(180deg);background:rgba(244,196,0,.12)}
details[open] summary i::after{transform:rotate(0)}
details p{margin:0;padding:0 24px 22px;color:var(--mut);max-width:720px}

/* Aloqa */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.c-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:26px;border-radius:24px;background:var(--card);border:1px solid var(--line2);overflow:hidden;min-height:220px;
  transition:transform .5s var(--ease),border-color .3s}
.c-card::before{content:"";position:absolute;inset:auto -30% -60% auto;width:240px;height:240px;border-radius:50%;background:var(--accent,var(--gold));opacity:.08;transition:transform .7s var(--ease),opacity .4s}
.c-card:hover{transform:translateY(-6px);border-color:rgba(244,196,0,.4)}
.c-card:hover::before{transform:scale(1.8);opacity:.14}
.c-card.tg{--accent:#2aabee}.c-card.ig{--accent:#e1306c}.c-card.ph{--accent:var(--ok)}.c-card.ch{--accent:#2aabee}.c-card.mp{--accent:var(--ember)}
.c-phones,.c-maps{display:flex;flex-direction:column;gap:6px;position:relative;z-index:1}
.c-phones a{font:800 clamp(17px,1.4vw,19px)/1.3 var(--body);letter-spacing:.01em;white-space:nowrap;transition:color .25s}
.c-phones a:hover,.c-maps a:hover{color:var(--gold)}
.c-maps{flex-direction:row;flex-wrap:wrap;gap:14px;margin-top:6px}
.c-maps a{font-size:14px;font-weight:700;color:var(--gold)}
.c-v.small{font-size:clamp(15px,1.3vw,17px);line-height:1.35}
.c-card.wide{grid-column:span 2;flex-direction:row;align-items:stretch;justify-content:space-between;gap:20px}
.mp-text{display:flex;flex-direction:column;gap:6px;position:relative;z-index:1;min-width:0}
.mp-qr{position:relative;z-index:1;flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;align-self:center;transition:transform .5s var(--ease)}
.mp-qr img{width:150px;height:150px;border-radius:14px;box-shadow:0 14px 34px -14px rgba(0,0,0,.9),0 0 0 4px rgba(244,196,0,.18)}
.mp-qr small{font-size:12px;font-weight:700;color:var(--mut)}
.mp-qr:hover{transform:scale(1.04) rotate(-1.5deg)}
@media (max-width:560px){.c-card.wide{grid-column:auto;flex-direction:column}.mp-qr{align-self:flex-start}.mp-qr img{width:170px;height:170px}}
.c-ic{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--accent);margin-bottom:auto}
.c-ic svg{width:26px;height:26px;fill:#fff}
.c-card.ph .c-ic svg{fill:#08240f}
.c-l{font-size:13px;color:var(--mut);font-weight:700;margin-top:26px}
.c-v{font:800 clamp(18px,1.7vw,22px) var(--head);word-break:break-word}
.c-go{font-size:14px;font-weight:700;color:var(--gold);margin-top:6px}
.info-rows{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.info-rows .r{display:flex;gap:14px;padding:20px 22px;border-radius:20px;background:var(--card);border:1px solid var(--line2)}
.info-rows .r .e{font-size:22px}
.info-rows .r small{display:block;color:var(--mut);font-weight:700;font-size:12px}
.info-rows .r a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.open-b{display:inline-block;margin-left:6px;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:800;background:rgba(255,107,91,.14);color:var(--bad)}
.open-b.on{background:rgba(95,211,138,.14);color:var(--ok)}

/* Pastki qism */
.foot{margin-top:clamp(90px,12vw,160px);border-top:1px solid var(--line);overflow:hidden}
.foot-big{font:900 clamp(56px,16vw,260px)/.8 var(--head);letter-spacing:-.05em;white-space:nowrap;text-align:center;padding-top:.1em;
  background:linear-gradient(180deg,rgba(244,196,0,.9),rgba(244,196,0,.08));-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none}
.isfar-band{display:flex;align-items:center;gap:18px;margin:clamp(22px,4vw,40px) var(--pad) 6px;padding:18px 22px;border-radius:22px;position:relative;overflow:hidden;
  background:linear-gradient(110deg,#0f1630,#16204a 55%,#1b2a5e);border:1px solid rgba(245,197,24,.28);transition:transform .5s var(--ease),box-shadow .5s,border-color .3s}
.isfar-band::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.08) 50%,transparent 70%);transform:translateX(-100%);transition:transform .9s var(--ease)}
.isfar-band:hover{transform:translateY(-3px);box-shadow:0 22px 50px -24px rgba(245,197,24,.45);border-color:rgba(245,197,24,.6)}
.isfar-band:hover::after{transform:translateX(100%)}
.isfar-logo{flex:0 0 54px;height:54px;border-radius:16px;background:radial-gradient(circle at 50% 65%,#1c2a60,#0b1129 70%);display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.08)}
.isfar-logo svg{width:40px;height:40px;fill:none;stroke-linecap:round;overflow:visible}
.isfar-logo .wheel{transform-box:view-box;transform-origin:20px 25px;animation:sunWheel 9s linear infinite}
.isfar-logo .r{stroke:#f5c518;stroke-width:2.4;transform:translateY(5px)}
.isfar-logo .r2{stroke:rgba(245,197,24,.55);stroke-width:1.6;transform:translateY(5px)}
.isfar-logo .s{fill:#f5c518;filter:drop-shadow(0 0 4px rgba(245,197,24,.7))}
.isfar-logo .l{stroke:#fff;stroke-width:2.4}
@keyframes sunWheel{to{transform:rotate(360deg)}}
.isfar-band:hover .isfar-logo .wheel{animation-duration:3s}
.isfar-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.isfar-txt b{font-size:clamp(15px,1.45vw,18px);color:#fff;line-height:1.3}
.isfar-txt small{color:#cdd5f0;font-size:clamp(13.5px,1.2vw,15px);font-weight:700}
.isfar-txt small span{color:#f5c518;font-weight:800}
.isfar-go{flex:0 0 auto;padding:11px 18px;border-radius:99px;background:#f5c518;color:#0b1129;font-weight:800;font-size:14px;white-space:nowrap}
.made-by{color:var(--mut);transition:color .25s}
.made-by b{color:#f5c518}
.made-by:hover{color:var(--ink)}
@media (max-width:640px){.isfar-band{flex-wrap:wrap;gap:12px}.isfar-go{width:100%;text-align:center}}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:22px var(--pad) calc(22px + env(safe-area-inset-bottom));color:var(--mut);font-size:14px;font-weight:600}
.foot-links{display:flex;gap:20px}
.foot-links a:hover{color:var(--gold)}
.totop{width:44px;height:44px;border-radius:50%;border:1px solid var(--line2);display:flex;align-items:center;justify-content:center;font-size:18px;transition:all .3s}
.totop:hover{background:var(--gold);color:#120f05;border-color:var(--gold)}

/* Savatcha */
.cart-fab{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:55;display:flex;align-items:center;gap:10px;padding:10px 18px 10px 12px;
  border:0;border-radius:99px;background:var(--gold);color:#120f05;font-weight:800;cursor:pointer;box-shadow:0 18px 40px -12px rgba(244,196,0,.6);
  transform:translateY(0);transition:transform .45s var(--ease)}
.cart-fab[hidden]{display:flex;transform:translateY(140%)}
.cart-fab svg{width:24px;height:24px;fill:currentColor}
.cart-fab .cnt{min-width:24px;height:24px;border-radius:12px;background:#120f05;color:var(--gold);font-size:13px;display:flex;align-items:center;justify-content:center;padding:0 6px}
.cart-fab.bump{animation:bump .5s var(--ease)}
@keyframes bump{40%{transform:scale(1.12)}}
.drawer,.modal{position:fixed;inset:0;z-index:80;visibility:hidden}
.drawer.open,.modal.open{visibility:visible}
.drawer-bg,.modal-bg{position:absolute;inset:0;background:rgba(5,4,2,.65);backdrop-filter:blur(4px);opacity:0;transition:opacity .4s}
.open .drawer-bg,.open .modal-bg{opacity:1}
.drawer-panel{position:absolute;right:0;top:0;bottom:0;width:min(430px,100%);background:var(--bg2);border-left:1px solid var(--line);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .55s var(--ease)}
.drawer.open .drawer-panel{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:22px 22px 14px}
.drawer-head h3{font-size:22px}
.x{width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);background:rgba(255,255,255,.04);cursor:pointer;font-size:15px;transition:transform .35s var(--ease)}
.x:hover{transform:rotate(90deg)}
.drawer-list{flex:1;overflow:auto;padding:0 22px;display:flex;flex-direction:column;gap:10px}
.ci{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:10px;border-radius:16px;background:var(--card);border:1px solid var(--line2)}
.ci .t{width:56px;height:56px;border-radius:12px;background:#221d12 center/cover;display:flex;align-items:center;justify-content:center;font-size:26px}
.ci b{font-size:14px;display:block;line-height:1.3}
.ci small{color:var(--mut);font-weight:700}
.qty-ctl{display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.05);border-radius:99px;padding:3px}
.qty-ctl button{width:30px;height:30px;border-radius:50%;border:0;background:none;cursor:pointer;font-size:18px;font-weight:800;color:var(--gold)}
.qty-ctl button:hover{background:rgba(244,196,0,.12)}
.qty-ctl span{min-width:22px;text-align:center;font-weight:800;font-size:14px}
.drawer-foot{padding:18px 22px calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--line2)}
.total{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;font-weight:700;color:var(--mut)}
.total b{font:800 24px var(--head);color:var(--ink)}
.hint{color:var(--dim);font-size:12.5px;text-align:center;margin:10px 0 4px}
.link-btn{display:block;margin:0 auto;background:none;border:0;color:var(--mut);font-size:13px;font-weight:700;text-decoration:underline;cursor:pointer;padding:6px}
.cart-empty{text-align:center;color:var(--mut);padding:50px 0;font-weight:700}
.cart-empty span{font-size:44px;display:block;margin-bottom:6px}

/* Mahsulot oynasi */
.modal{display:flex;align-items:center;justify-content:center;padding:16px}
.modal-card{position:relative;width:min(760px,100%);max-height:calc(100svh - 32px);overflow:auto;background:var(--bg2);border:1px solid var(--line);border-radius:28px;
  transform:translateY(30px) scale(.96);opacity:0;transition:transform .5s var(--ease),opacity .35s}
.modal.open .modal-card{transform:none;opacity:1}
.modal-card>.x{position:absolute;top:14px;right:14px;z-index:3;background:rgba(13,11,7,.7);backdrop-filter:blur(6px)}
.modal-body{display:grid;grid-template-columns:1fr 1fr}
.mb-im{aspect-ratio:1;background:radial-gradient(circle at 50% 40%,#2c2416,#17130b) center/cover;display:flex;align-items:center;justify-content:center;font-size:90px}
.mb-tx{padding:30px 28px;display:flex;flex-direction:column;gap:10px}
.mb-tx .c{color:var(--gold);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.mb-tx h3{font-size:clamp(22px,2.6vw,30px);line-height:1.15}
.mb-tx .p{font:800 30px var(--head);margin-top:6px}
.mb-tx .p small{font:600 15px var(--body);color:var(--mut)}
.mb-tx .st{font-weight:700;font-size:14px}
.mb-tx .st.ok{color:var(--ok)}.mb-tx .st.no{color:var(--bad)}
.mb-act{margin-top:auto;display:grid;gap:10px;padding-top:16px}

/* Hamkorlik oynasi */
.hk-card{width:min(980px,100%)}
.hk{padding:clamp(26px,4vw,48px);position:relative;overflow:hidden;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(24px,4vw,48px);align-items:start}
.hk::before{content:"";position:absolute;left:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(244,196,0,.18),transparent 65%);pointer-events:none}
.hk h3{font-size:clamp(28px,3.6vw,44px);line-height:1.06;margin-bottom:16px}
.hk-lead{color:var(--mut);margin:0 0 22px;font-size:clamp(15px,1.3vw,17px)}
.hk-info{position:relative}
.hk-call{margin-top:22px;color:var(--mut);font-size:14px;font-weight:600;line-height:1.7}
.hk-call a{color:var(--gold);font-weight:800;white-space:nowrap}
.hk-form{position:relative;display:grid;gap:14px;padding:clamp(18px,2.6vw,28px);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));border:1px solid var(--line)}
.f{display:grid;gap:7px}
.f>span{font-weight:800;font-size:14px}
.f em{font-style:normal;font-weight:600;color:var(--dim);font-size:12.5px}
.f input,.f select,.f textarea{width:100%;background:var(--bg);border:1px solid var(--line2);border-radius:14px;color:var(--ink);font:600 16px var(--body);padding:13px 15px;outline:0;
  transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
.f textarea{resize:vertical;min-height:84px}
.f select{background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a59d88'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") right 12px center/22px no-repeat;padding-right:42px;cursor:pointer}
.f select option{background:var(--card)}
.f input::placeholder,.f textarea::placeholder{color:var(--dim)}
.f input:focus,.f select:focus,.f textarea:focus{border-color:rgba(244,196,0,.65);box-shadow:0 0 0 4px rgba(244,196,0,.1)}
.f.bad input,.f.bad select{border-color:var(--bad);box-shadow:0 0 0 4px rgba(255,107,91,.1)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.agree{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;color:var(--mut);cursor:pointer;line-height:1.45}
.agree input{flex:0 0 20px;width:20px;height:20px;margin:1px 0 0;accent-color:var(--gold);cursor:pointer}
.agree.bad span{color:var(--bad)}
.f-err{min-height:0;color:var(--bad);font-weight:700;font-size:14px}
.f-err:empty{display:none}
#hkSend[disabled]{opacity:.7;cursor:wait}
#hkSend .spin{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(0,0,0,.25);border-top-color:#120f05;animation:spin .8s linear infinite}
.hk-alt{text-align:center;font-size:13.5px;font-weight:700;color:var(--mut)}
.hk-alt:hover{color:var(--gold)}
.hk-done{grid-column:1/-1;text-align:center;padding:30px 10px;display:flex;flex-direction:column;align-items:center;gap:12px}
.hk-done[hidden]{display:none}
.hk-done h3{font-size:clamp(26px,3.4vw,38px)}
.hk-done p{color:var(--mut);margin:0 0 10px;max-width:440px}
.done-ic svg{width:88px;height:88px;fill:none;stroke:var(--ok);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.done-ic circle{stroke-dasharray:151;stroke-dashoffset:151;animation:dash .7s var(--ease) forwards}
.done-ic path{stroke-dasharray:40;stroke-dashoffset:40;animation:dash .45s .55s var(--ease) forwards}
@keyframes dash{to{stroke-dashoffset:0}}
.hk.sent .hk-info,.hk.sent .hk-form{display:none}
@media (max-width:820px){.hk{grid-template-columns:1fr}.hk h3{padding-right:36px}}

.toast{position:fixed;left:50%;bottom:90px;z-index:120;transform:translate(-50%,30px);opacity:0;pointer-events:none;padding:13px 20px;border-radius:14px;background:#f6f1e3;color:#120f05;font-weight:800;font-size:14px;
  box-shadow:0 20px 40px -14px rgba(0,0,0,.8);transition:transform .45s var(--ease),opacity .3s;max-width:calc(100% - 32px);text-align:center}
.toast.show{transform:translate(-50%,0);opacity:1}

/* Paydo bo'lish */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.vis{opacity:1;transform:none}

/* Moslashuv */
@media (max-width:1100px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:960px){
  .links{position:fixed;left:12px;right:12px;top:72px;flex-direction:column;gap:2px;padding:10px;border-radius:24px;background:rgba(20,17,10,.96);backdrop-filter:blur(14px);
    border-color:var(--line);opacity:0;transform:translateY(-10px) scale(.98);pointer-events:none;transition:opacity .3s,transform .4s var(--ease)}
  .links.open{opacity:1;transform:none;pointer-events:auto}
  .links a{padding:14px 18px;font-size:17px;color:var(--ink)}
  .burger{display:block}
  .hero{grid-template-columns:1fr;padding-top:100px;text-align:left;gap:10px}
  .hero-art{order:-1;width:min(84vw,420px)}
  .scroll-hint{display:none}
  .steps{grid-template-columns:1fr 1fr;row-gap:36px}
  .steps-line{display:none}
  .partner-card{grid-template-columns:1fr}
  .modal-body{grid-template-columns:1fr}
  .mb-im{aspect-ratio:16/11}
}
@media (max-width:640px){
  .nav .btn-sm{display:none}
  .grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .card .b{padding:11px}
  .card .n{font-size:14px}
  .card .pr b{font-size:15px}
  .add{width:36px;height:36px;font-size:20px}
  .add.qty i{width:24px;height:24px}
  .why-list li{grid-template-columns:40px 1fr;gap:12px}
  .why-list .emo{display:none}
  .why-list li p{max-height:none;opacity:1;margin-top:8px}
  .cat-tools{flex-direction:column}
  #sort{padding:14px 40px 14px 16px}
  .hero-stats{gap:22px}
  .float-card{width:84px;border-radius:18px}
  .float-card::after{display:none}
  .chip-live{font-size:11.5px;padding:8px 11px}
  .steps{grid-template-columns:1fr}
  .tag{top:8px;left:8px}
  .glow-cursor{display:none}
}
@media (hover:none){.glow-cursor{display:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
  .hero-title .line>span{transform:none}
}