/* GanievProduction — oq galereya: #fff va #f5f5f7 navbat bilan, 28px kartalar, soyasiz, ko'k faqat CTA uchun */
:root{
  --white:#ffffff; --mist:#f5f5f7; --frost:#fafafc; --hair:#d6d6d6; --ctrl:#e6e6e8;
  --ink:#1d1d1f; --slate:#6e6e73; --steel:#86868b; --link:#0066cc; --cta:#0071e3; --cta-hover:#0077ed;
  --launch:#b64400; --brand:#f6c042; --good:#1d7a3e;
  --f-display:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --f-text:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --r-card:28px; --r-img:28px; --r-nav:20px; --r-pill:9999px;
  --gap:20px; --section:90px; --wrap:1120px; --gutter:max(16px,4vw);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--f-text);font-size:17px;line-height:1.47;letter-spacing:-.374px;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01"}
img{max-width:100%;height:auto;display:block}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--cta);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:600;margin:0;text-wrap:balance;color:var(--ink)}
p{margin:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- navigation ---------- */
.gnav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--ctrl)}
.gnav .wrap{display:flex;align-items:center;gap:24px;height:52px}
.brand{display:flex;align-items:center;gap:9px;color:var(--ink);font-weight:600;font-size:17px;letter-spacing:-.3px;white-space:nowrap}
.brand:hover{text-decoration:none}
.brand img{width:26px;height:auto}
.brand b{font-weight:600}
.brand .dot{color:#e2463a}
.gnav nav{display:flex;gap:22px;margin-left:auto}
.gnav nav a{color:rgba(0,0,0,.8);font-size:12.5px;letter-spacing:-.12px;line-height:1}
.gnav nav a[aria-current=page]{color:var(--ink);font-weight:600}
.gnav nav a:hover{color:var(--ink);text-decoration:none}
.menu-btn{display:none;margin-left:auto;background:none;border:0;width:44px;height:44px;border-radius:12px;cursor:pointer;color:var(--ink)}
.menu-btn svg{width:20px;height:20px}
@media (max-width:900px){
  .gnav nav{position:fixed;inset:52px 0 auto 0;flex-direction:column;gap:0;background:var(--frost);border-bottom:1px solid var(--ctrl);padding:8px var(--gutter) 20px;margin:0}
  .gnav nav[hidden]{display:none!important}
  .gnav nav a{font-size:20px;font-weight:600;padding:12px 0;border-bottom:1px solid var(--ctrl);letter-spacing:-.3px}
  .gnav nav a:last-child{border:0}
  .menu-btn{display:inline-grid;place-items:center}
  .gnav .pill{display:none}
}
@media (min-width:901px){.gnav nav[hidden]{display:flex!important}}

/* ---------- controls ---------- */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:var(--r-pill);font-size:14px;line-height:1;padding:10px 18px;min-height:36px;font-weight:400;letter-spacing:-.2px;white-space:nowrap;border:1px solid transparent;cursor:pointer;font-family:inherit}
.pill:hover{text-decoration:none}
.pill-blue{background:var(--cta);color:#fff}
.pill-blue:hover{background:var(--cta-hover)}
.pill-line{background:transparent;color:var(--ink);border-color:var(--steel)}
.pill-line:hover{border-color:var(--ink)}
.pill-lg{font-size:17px;padding:14px 26px;min-height:48px}
.gnav .pill{font-size:12px;padding:7px 14px;min-height:28px}
.more{font-size:17px;color:var(--link);white-space:nowrap}
.more::after{content:" ›"}
.actions{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
.launch{color:var(--launch);font-size:12px;font-weight:600;letter-spacing:-.12px;line-height:16px}

/* ---------- sections & type ---------- */
.section{padding-block:var(--section)}
.band{background:var(--mist)}
.kicker{font-size:21px;font-weight:600;letter-spacing:.2px;line-height:1.1}
.eyebrow{font-size:14px;font-weight:600;color:var(--slate);letter-spacing:.2px;text-transform:uppercase}
.display{font-size:clamp(44px,8.2vw,80px);line-height:1.05;letter-spacing:-.015em;font-weight:600}
.h2{font-size:clamp(32px,5vw,48px);line-height:1.08;letter-spacing:-.01em}
.h3{font-size:clamp(24px,3vw,28px);line-height:1.14;letter-spacing:.005em}
.lead{font-size:clamp(19px,2.2vw,21px);line-height:1.38;color:var(--ink);letter-spacing:.01em;max-width:44ch}
.muted{color:var(--slate)}
.small{font-size:14px;line-height:1.43;letter-spacing:-.22px}
.head-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 28px;margin-bottom:40px}
.head-row .h2{max-width:18ch}
.center{text-align:center}
.stack{display:flex;flex-direction:column;gap:var(--gap)}
.prose{max-width:62ch;display:flex;flex-direction:column;gap:14px}

/* ---------- hero ---------- */
.hero{padding-block:72px 40px;text-align:center}
.hero .stack{align-items:center;gap:18px}
.hero .lead{margin-inline:auto;color:var(--slate)}
.hero .actions{justify-content:center;margin-top:8px}
.proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:64px;text-align:left}
.proof div{padding:8px 4px;border-top:1px solid var(--hair)}
.proof strong{display:block;font-size:clamp(40px,6.4vw,72px);font-weight:600;letter-spacing:-.03em;line-height:1.05;padding-top:18px}
.proof span{display:block;font-size:14px;color:var(--slate);margin-top:8px;max-width:26ch}
@media (max-width:680px){.proof{grid-template-columns:1fr;gap:0}.proof div{padding-bottom:18px}}
.callout{display:inline-flex;flex-wrap:wrap;align-items:center;gap:10px 16px;background:var(--white);border:1px solid var(--ctrl);border-radius:var(--r-card);padding:14px 14px 14px 22px;margin-top:36px;text-align:left}
.callout b{font-size:14px;font-weight:600}
.callout span{font-size:14px;color:var(--slate)}

/* ---------- cards ---------- */
.card{background:var(--white);border-radius:var(--r-card);padding:28px;min-width:0}
.band .card{background:var(--white)}
.section:not(.band) .card.soft{background:var(--mist)}
.grid{display:grid;gap:var(--gap)}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:980px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}

/* highlights scroller */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:min(78vw,380px);gap:var(--gap);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;padding-inline:var(--gutter);margin-inline:calc(var(--gutter) * -1);scrollbar-width:thin}
.rail>*{scroll-snap-align:start}
@media (min-width:1200px){.rail{margin-inline:0;padding-inline:0}}
.hl{display:flex;flex-direction:column;gap:14px;overflow:hidden;padding:28px 28px 0;color:var(--ink)}
.hl:hover{text-decoration:none}
.hl .eyebrow{font-size:12px}
.hl h3{font-size:24px;line-height:1.17;letter-spacing:.005em}
.hl p{font-size:14px;color:var(--slate);line-height:1.43}
.hl .big{font-size:44px;font-weight:600;letter-spacing:-.03em;line-height:1}
.hl img{margin-top:auto;border-radius:16px 16px 0 0;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}

/* service cards */
.svc{display:flex;flex-direction:column;gap:12px}
.svc .price{font-size:14px;color:var(--slate)}
.svc .price b{color:var(--ink);font-size:24px;font-weight:600;letter-spacing:-.02em}
.svc ul{margin:0;padding-left:18px;font-size:14px;line-height:1.5;color:var(--ink)}
.svc .sfoot{margin-top:auto;padding-top:8px;font-size:14px;color:var(--slate);border-top:1px solid var(--ctrl)}
.svc .tag{align-self:flex-start;font-size:12px;font-weight:600;color:var(--launch)}

/* editorial split */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:center}
.split.rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.split.rev .split-text{order:2}
@media (max-width:860px){.split,.split.rev{grid-template-columns:1fr;gap:28px}.split.rev .split-text{order:0}}
.split-text{display:flex;flex-direction:column;gap:16px;min-width:0}
.split-media{min-width:0}
.split-media img{border-radius:var(--r-img);width:100%}
.frame{border-radius:var(--r-img);overflow:hidden;background:var(--mist)}
.ticks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ticks li{position:relative;padding-left:26px;font-size:17px;line-height:1.35}
.ticks li::before{content:"";position:absolute;left:2px;top:.42em;width:12px;height:7px;border-left:2px solid var(--good);border-bottom:2px solid var(--good);transform:rotate(-45deg)}
.ticks.sm li{font-size:14px;line-height:1.43}

/* metrics */
.metric{display:flex;flex-direction:column;gap:6px}
.metric strong{font-size:clamp(34px,4vw,44px);font-weight:600;letter-spacing:-.03em;line-height:1}
.metric span{font-size:14px;color:var(--slate);line-height:1.35}
.metric em{font-style:normal;font-size:13px;color:var(--good);font-weight:600}

/* before-after bars */
.ba{display:flex;flex-direction:column;gap:18px}
.ba-row{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) auto;gap:6px 16px;align-items:center}
.ba-row .lbl{font-size:14px;font-weight:600}
.ba-row .bars{display:flex;flex-direction:column;gap:4px;min-width:0}
.ba-row .bar{height:10px;border-radius:5px;background:var(--hair);min-width:3px}
.ba-row .bar.now{background:var(--cta)}
.ba-row .vals{font-size:13px;color:var(--slate);text-align:right;line-height:1.35;white-space:nowrap}
.ba-row .vals b{color:var(--ink);font-weight:600}
.ba-row .up{grid-column:3;font-size:13px;font-weight:600;color:var(--good);text-align:right}
.legend{display:flex;gap:18px;font-size:13px;color:var(--slate);flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
@media (max-width:560px){.ba-row{grid-template-columns:1fr auto}.ba-row .bars{grid-column:1/-1;grid-row:2}.ba-row .vals{grid-row:1;grid-column:2}}

/* tables */
.tbl-wrap{overflow-x:auto;border-radius:20px;background:var(--white)}
table{border-collapse:collapse;width:100%;font-size:14px;letter-spacing:-.2px}
th,td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--ctrl);white-space:nowrap}
th{font-weight:600;color:var(--slate);font-size:12px;text-transform:uppercase;letter-spacing:.3px}
td.n{text-align:right;font-variant-numeric:tabular-nums}
tr:last-child td{border-bottom:0}

/* work blocks (balloon) */
.work{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;padding-block:56px;border-top:1px solid var(--hair);align-items:start}
.work:first-of-type{border-top:0}
@media (max-width:860px){.work{grid-template-columns:1fr;gap:24px;padding-block:40px}}
.work .split-text h3{font-size:clamp(26px,3.2vw,32px);line-height:1.12}
.work .res{background:var(--mist);border-radius:20px;padding:18px 20px;font-size:14px;line-height:1.45}
.band .work .res{background:var(--white)}
.work .res b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.3px;color:var(--good);margin-bottom:4px}
.shots{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
.shots.one{grid-template-columns:1fr}
.shots.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.shots button{padding:0;border:0;background:var(--mist);border-radius:18px;overflow:hidden;cursor:zoom-in;display:block;width:100%}
.band .shots button{background:var(--white)}
.shots img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9;transition:transform .5s ease}
.shots.tall img{aspect-ratio:3/4}
.shots button:hover img{transform:scale(1.02)}
.shots .span2{grid-column:1/-1}
.shots .span2 img{aspect-ratio:16/9}
.cap{font-size:12px;color:var(--slate);margin-top:8px}

/* local anchor nav */
.lnav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 52px);z-index:40;background:rgba(255,255,255,.9);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--ctrl)}
.lnav .wrap{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;height:48px;align-items:center}
.lnav .wrap::-webkit-scrollbar{display:none}
.lnav a{color:var(--ink);font-size:14px;font-weight:500;white-space:nowrap}
.lnav a.on{color:var(--link)}
.lnav .ttl{font-weight:600;font-size:15px;margin-right:6px;color:var(--ink)}

/* handles */
.handles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
@media (max-width:700px){.handles{grid-template-columns:1fr}}
.handles dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 18px;font-size:14px}
.handles dt{color:var(--slate)}
.handles dd{margin:0;overflow-wrap:anywhere}

/* videos */
.vids{display:grid;grid-auto-flow:column;grid-auto-columns:min(56vw,230px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;padding-inline:var(--gutter);margin-inline:calc(var(--gutter) * -1)}
@media (min-width:1200px){.vids{margin-inline:0;padding-inline:0}}
.vid{scroll-snap-align:start;position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#1d1d1f;border:0;padding:0;cursor:pointer;color:#fff;display:block;width:100%}
.vid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vid .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.9);display:grid;place-items:center;transition:transform .2s}
.vid:hover .play{transform:translate(-50%,-50%) scale(1.08)}
.vid .play::after{content:"";margin-left:4px;border-left:16px solid var(--ink);border-top:10px solid transparent;border-bottom:10px solid transparent}
.vid .vt{position:absolute;left:14px;bottom:12px;font-size:12px;font-weight:600;background:rgba(0,0,0,.45);padding:5px 10px;border-radius:99px}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* reviews */
.reviews{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);align-items:start}
@media (max-width:980px){.reviews{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.reviews{grid-template-columns:1fr}}
.review{display:flex;flex-direction:column;gap:14px}
.review blockquote{margin:0;font-size:17px;line-height:1.35;font-weight:500}
.review .who{font-size:13px;color:var(--slate)}
.review button{padding:0;border:0;background:#0e0e12;border-radius:16px;overflow:hidden;cursor:zoom-in}
.review button img{width:100%;max-height:260px;object-fit:cover;object-position:top}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);counter-reset:s}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.steps li{list-style:none;counter-increment:s;display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--hair);padding-top:18px}
.steps li::before{content:counter(s);font-size:14px;font-weight:600;color:var(--slate)}
.steps h3{font-size:21px}
.steps p{font-size:14px;color:var(--slate)}
ol.steps{padding:0;margin:0}

/* projects */
.proj{display:flex;flex-direction:column;gap:14px;color:var(--ink)}
.proj:hover{text-decoration:none}
.proj .thumb{border-radius:18px;background:var(--mist);aspect-ratio:16/10;overflow:hidden;display:grid;place-items:center}
.band .proj .thumb{background:var(--frost)}
.proj .thumb img{width:100%;height:100%;object-fit:cover}
.proj .thumb.logo img{object-fit:contain;padding:18px;background:transparent}
.proj h3{font-size:21px;line-height:1.2}
.proj p{font-size:14px;color:var(--slate)}
.chip{font-size:12px;font-weight:600;color:var(--slate)}

/* FAQ */
.faq{display:flex;flex-direction:column}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-size:19px;font-weight:600;letter-spacing:-.2px;line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;font-size:26px;line-height:1;color:var(--slate);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--slate);max-width:70ch}
.faq-group{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:40px;padding-block:40px;border-top:1px solid var(--hair)}
.faq-group:first-child{border-top:0}
@media (max-width:820px){.faq-group{grid-template-columns:1fr;gap:8px}}

/* forms */
.form{display:grid;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:14px;font-weight:600}
.field input,.field select,.field textarea{font:inherit;font-size:17px;padding:13px 16px;border:1px solid var(--steel);border-radius:14px;background:var(--white);color:var(--ink);width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--cta);outline-offset:0;border-color:var(--cta)}
.form-note{font-size:14px;color:var(--slate)}
.form-ok{background:var(--mist);border-radius:18px;padding:18px 20px;font-size:14px}
.copy-row{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.copy{font:inherit;font-size:12px;border:1px solid var(--hair);background:var(--white);border-radius:99px;padding:5px 12px;cursor:pointer;color:var(--ink)}

/* contact list */
.clist{display:flex;flex-direction:column}
.clist>div{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--ctrl);flex-wrap:wrap}
.clist dt,.clist .k{color:var(--slate);font-size:14px}
.clist .v{font-weight:600;font-size:17px;user-select:all}

/* resume */
.cv-item{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:28px;padding-block:36px;border-top:1px solid var(--hair)}
@media (max-width:760px){.cv-item{grid-template-columns:1fr;gap:10px}}
.cv-item .when{font-size:14px;color:var(--slate)}

/* footer */
.foot{background:var(--mist);padding-block:48px 40px;font-size:12px;color:var(--slate);letter-spacing:-.12px}
.foot-grid{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));gap:28px;padding-bottom:28px;border-bottom:1px solid var(--hair)}
@media (max-width:760px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot-grid>div:first-child{grid-column:1/-1}}
.foot h4{font-size:12px;color:var(--ink);font-weight:600;margin-bottom:10px}
.foot ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.foot a{color:var(--slate)}
.foot a:hover{color:var(--ink)}
.foot .bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:18px}
.foot p{max-width:44ch;line-height:1.5}

/* lightbox */
.lb{position:fixed;inset:0;z-index:100;background:rgba(245,245,247,.96);display:grid;grid-template-rows:auto 1fr auto;padding:calc(env(safe-area-inset-top,0px) + 12px) 12px calc(env(safe-area-inset-bottom,0px) + 12px)}
.lb[hidden]{display:none!important}
.lb-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:4px 8px 12px;font-size:14px;color:var(--slate)}
.lb-img{min-height:0;display:grid;place-items:center}
.lb-img img{max-height:100%;max-width:100%;object-fit:contain;border-radius:14px}
.lb-nav{display:flex;justify-content:center;gap:12px;padding-top:12px}
.lb button{font:inherit;border:1px solid var(--steel);background:var(--white);color:var(--ink);border-radius:99px;min-width:44px;height:40px;padding:0 16px;cursor:pointer}

/* reveal */
.rv{transition:opacity .7s ease,transform .7s ease}
.js .rv.pre{opacity:.001;transform:translateY(18px)}
@media (max-width:860px){#stat-grid,#contact-grid{grid-template-columns:1fr!important}}
#stat-grid>*,#contact-grid>*{min-width:0}
.ba{min-width:0}
.ba-row>*{min-width:0}
.proof{width:100%}
.head-row .h2{max-width:24ch}
th,td{padding:11px 12px}

/* ================= FX: harakat va 3D ================= */
.fx .splt .w{display:inline-block;perspective:700px;white-space:nowrap}
.fx .splt .c{display:inline-block;transform-origin:50% 100%;will-change:transform}
.fx .splt:not(.in) .c{opacity:0;transform:translateY(.55em) rotateX(-85deg);filter:blur(4px)}
.fx .splt.in .c{opacity:1;transform:none;filter:none;transition:transform .9s cubic-bezier(.2,.75,.15,1),opacity .6s ease,filter .6s ease;transition-delay:calc(var(--i) * 28ms)}
.fx .h2.splt.in .c,.fx .lead.splt.in .c,.fx .kicker.splt.in .c{transition-delay:calc(var(--i) * 45ms)}
.counting{font-variant-numeric:tabular-nums}
.fx .ba-row .bar{transition:width 1.4s cubic-bezier(.2,.75,.15,1)}
.fx .tin{opacity:.001;transform:perspective(1100px) rotateX(18deg) translateY(40px) scale(.96);transform-origin:50% 0}
.fx .tin.in{opacity:1;transform:none;transition:transform 1.1s cubic-bezier(.2,.75,.15,1) var(--d,0ms),opacity .8s ease var(--d,0ms)}
.tilt{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .35s cubic-bezier(.2,.75,.15,1);transform-style:preserve-3d;will-change:transform}
.tilt:hover{transition:transform .08s linear}
.proof{transform-origin:50% 0;will-change:transform}

/* 3D sahna */
.stage3d{position:relative;width:100%;height:clamp(280px,40vw,470px);margin-top:18px;cursor:grab;touch-action:pan-y}
.stage3d:active{cursor:grabbing}
.stage3d canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.stage3d .fallback{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(220px,40%)}
.stage3d.live .fallback{display:none}
.stage3d .hint{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);font-size:12px;color:var(--steel);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .6s}
.stage3d.live .hint{opacity:1}
@media (prefers-reduced-motion:reduce){.stage3d .hint{display:none}}

/* ================= RANG: brend palitrasi ================= */
:root{
  --brand:#f6c042; --brand-deep:#d99a12; --night:#0d0d12; --night-2:#18181f; --night-3:#24242d; --night-line:#2c2c36;
  --blue:#0071e3; --coral:#ff6b4a; --mint:#16b37c; --violet:#7c5cff; --sky:#2aa9ff;
  --t-yellow:#fff4d6; --t-blue:#e7f1ff; --t-coral:#ffebe5; --t-mint:#e1f7ee; --t-violet:#efebff; --t-sky:#e4f5ff;
}
.night{background:var(--night);color:#f5f5f7;position:relative;overflow:hidden}
.night h1,.night h2,.night h3,.night h4{color:#fff}
.night .muted,.night p.muted,.night .small.muted,.night .cap{color:#a1a1aa}
.night .eyebrow,.night .chip{color:var(--brand)}
.night .more{color:var(--brand)}
.night .card{background:var(--night-2);color:#f5f5f7}
.night .card p,.night .hl p{color:#a1a1aa}
.night .hl{color:#f5f5f7}
.night .hl .big,.night .metric strong,.night .proof strong{color:var(--brand)}
.night .metric span{color:#a1a1aa}
.night .metric em{color:#5ee2a8}
.night .shots button,.night .review button{background:var(--night-3)}
.night .work{border-color:var(--night-line)}
.night .work .res{background:var(--night-2);color:#e5e5ea}
.night .work .res b{color:#5ee2a8}
.night .ticks li::before{border-color:var(--brand)}
.night .tbl-wrap{background:var(--night-2)}
.night th{color:#8e8e96}
.night td{color:#e5e5ea;border-color:var(--night-line)}
.night .ba-row .bar{background:#3a3a44}
.night .ba-row .bar.now{background:var(--brand)}
.night .ba-row .vals{color:#a1a1aa}
.night .ba-row .vals b{color:#fff}
.night .legend{color:#a1a1aa}
.night .pill-blue{background:var(--brand);color:var(--ink);font-weight:600}
.night .pill-blue:hover{background:#ffd062}
.night .pill-line{color:#fff;border-color:#6e6e78}
.night .vid{background:var(--night-3)}
.night .head-row .h2,.night .h2{color:#fff}

.sun{background:var(--brand);color:var(--ink);position:relative;overflow:hidden}
.sun .muted,.sun p.muted,.sun .small.muted,.sun .cap{color:#5b4507}
.sun .eyebrow,.sun .chip{color:#6b4e00}
.sun .more{color:var(--ink);font-weight:600}
.sun .pill-blue{background:var(--ink);color:#fff}
.sun .pill-blue:hover{background:#000}
.sun .ticks li::before{border-color:var(--ink)}
.sun .shots button{background:rgba(255,255,255,.45)}
.sun .card{background:rgba(255,255,255,.7)}
.sun .metric span{color:#5b4507}
.sun .metric em{color:#0b6b42}

.tint-y{background:var(--t-yellow)}.tint-b{background:var(--t-blue)}.tint-v{background:var(--t-violet)}.tint-m{background:var(--t-mint)}.tint-c{background:var(--t-coral)}
.tint-y .card,.tint-b .card,.tint-v .card,.tint-m .card,.tint-c .card{background:#fff}
.tint-y .shots button,.tint-b .shots button{background:#fff}

/* rangli kartalar (xizmatlar, sohalar) */
.grid.g3 > .svc:nth-child(6n+1),.colorful > .card:nth-child(6n+1){background:var(--t-yellow)}
.grid.g3 > .svc:nth-child(6n+2),.colorful > .card:nth-child(6n+2){background:var(--t-blue)}
.grid.g3 > .svc:nth-child(6n+3),.colorful > .card:nth-child(6n+3){background:var(--t-coral)}
.grid.g3 > .svc:nth-child(6n+4),.colorful > .card:nth-child(6n+4){background:var(--t-mint)}
.grid.g3 > .svc:nth-child(6n+5),.colorful > .card:nth-child(6n+5){background:var(--t-violet)}
.grid.g3 > .svc:nth-child(6n+6),.colorful > .card:nth-child(6n+6){background:var(--night);color:#f5f5f7}
.grid.g3 > .svc:nth-child(6n+6) h3,.colorful > .card:nth-child(6n+6) h3{color:#fff}
.grid.g3 > .svc:nth-child(6n+6) .price,.grid.g3 > .svc:nth-child(6n+6) .sfoot,.grid.g3 > .svc:nth-child(6n+6) ul,.colorful > .card:nth-child(6n+6) p{color:#c7c7cc}
.grid.g3 > .svc:nth-child(6n+6) .price b{color:var(--brand)}
.grid.g3 > .svc:nth-child(6n+6) .tag{color:var(--brand)}
.grid.g3 > .svc:nth-child(6n+1) .price b{color:#b07800}
.grid.g3 > .svc:nth-child(6n+2) .price b{color:var(--blue)}
.grid.g3 > .svc:nth-child(6n+3) .price b{color:#e0431f}
.grid.g3 > .svc:nth-child(6n+4) .price b{color:#0e8f60}
.grid.g3 > .svc:nth-child(6n+5) .price b{color:var(--violet)}
.svc .sfoot{border-color:rgba(0,0,0,.08)}
.svc:nth-child(6n+6) .sfoot{border-color:rgba(255,255,255,.12)}
.svc h3{position:relative}
.grid.g3 > .svc::before{content:"";width:34px;height:34px;border-radius:10px;display:block;margin-bottom:4px;background:var(--c,var(--brand));transform:rotate(12deg)}
.grid.g3 > .svc:nth-child(6n+1){--c:var(--brand)}.grid.g3 > .svc:nth-child(6n+2){--c:var(--blue)}.grid.g3 > .svc:nth-child(6n+3){--c:var(--coral)}
.grid.g3 > .svc:nth-child(6n+4){--c:var(--mint)}.grid.g3 > .svc:nth-child(6n+5){--c:var(--violet)}.grid.g3 > .svc:nth-child(6n+6){--c:var(--brand)}

/* rangli metrikalar */
.metrics-color .metric:nth-child(5n+1) strong{color:#c58a00}
.metrics-color .metric:nth-child(5n+2) strong{color:var(--blue)}
.metrics-color .metric:nth-child(5n+3) strong{color:#e0431f}
.metrics-color .metric:nth-child(5n+4) strong{color:#0e8f60}
.metrics-color .metric:nth-child(5n+5) strong{color:var(--violet)}
.proof div:nth-child(1) strong{color:#1d1d1f}
.proof div:nth-child(1){border-color:var(--brand);border-top-width:3px}
.proof div:nth-child(2){border-color:var(--blue);border-top-width:3px}
.proof div:nth-child(3){border-color:var(--coral);border-top-width:3px}
.proof div:nth-child(2) strong{color:var(--blue)}
.proof div:nth-child(3) strong{color:#e0431f}

/* qadamlar */
.steps li:nth-child(1){border-color:var(--brand)}.steps li:nth-child(2){border-color:var(--blue)}.steps li:nth-child(3){border-color:var(--coral)}.steps li:nth-child(4){border-color:var(--mint)}
.steps li{border-top-width:3px}
.steps li::before{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;font-size:16px;background:var(--brand);color:var(--ink)}
.steps li:nth-child(2)::before{background:var(--blue);color:#fff}.steps li:nth-child(3)::before{background:var(--coral);color:#fff}.steps li:nth-child(4)::before{background:var(--mint);color:#fff}

/* sarlavhadagi marker */
.mk,.w.mk{background:linear-gradient(transparent 64%,var(--brand) 64%,var(--brand) 90%,transparent 90%);padding:0 .06em;margin:0 -.03em}
.night .mk,.night .w.mk{background:none;color:var(--brand)}
.sun .mk,.sun .w.mk{background:linear-gradient(transparent 64%,#fff 64%,#fff 90%,transparent 90%)}

/* hero yorug'lik dog'lari */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero::before,.hero::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none}
.hero::before{width:520px;height:520px;background:#ffd66b;left:50%;top:38%;transform:translateX(-80%);animation:blob 14s ease-in-out infinite alternate}
.hero::after{width:460px;height:460px;background:#9cc8ff;left:50%;top:48%;transform:translateX(0%);animation:blob2 16s ease-in-out infinite alternate}
.hero.sun::before{background:#fff1b8;opacity:.7}.hero.sun::after{background:#ffae3d;opacity:.5}
@keyframes blob{to{transform:translate(-40%,-12%) scale(1.15)}}
@keyframes blob2{to{transform:translate(-30%,10%) scale(.9)}}
.gnav{z-index:60}

/* CSS 3D kublar */
.cubes{position:absolute;inset:0;pointer-events:none;z-index:0;perspective:900px}
.night > .wrap,.sun > .wrap,.hero > .wrap{position:relative;z-index:1}
.cube3d{position:absolute;width:var(--s,40px);height:var(--s,40px);transform-style:preserve-3d;animation:cubespin var(--dur,16s) linear infinite,cubefloat calc(var(--dur,16s) / 2) ease-in-out infinite alternate;animation-delay:var(--delay,0s)}
.cube3d i{position:absolute;inset:0;background:var(--brand);opacity:var(--o,.95);border-radius:3px}
.cube3d i:nth-child(1){transform:translateZ(calc(var(--s,40px) / 2))}
.cube3d i:nth-child(2){transform:rotateY(180deg) translateZ(calc(var(--s,40px) / 2));filter:brightness(.8)}
.cube3d i:nth-child(3){transform:rotateY(90deg) translateZ(calc(var(--s,40px) / 2));filter:brightness(.72)}
.cube3d i:nth-child(4){transform:rotateY(-90deg) translateZ(calc(var(--s,40px) / 2));filter:brightness(.88)}
.cube3d i:nth-child(5){transform:rotateX(90deg) translateZ(calc(var(--s,40px) / 2));filter:brightness(1.08)}
.cube3d i:nth-child(6){transform:rotateX(-90deg) translateZ(calc(var(--s,40px) / 2));filter:brightness(.62)}
.cube3d.b i{background:var(--blue)}.cube3d.c i{background:var(--coral)}.cube3d.v i{background:var(--violet)}.cube3d.m i{background:var(--mint)}.cube3d.k i{background:var(--ink)}.cube3d.w i{background:#fff}
@keyframes cubespin{from{transform:rotateX(0) rotateY(0) rotateZ(0)}to{transform:rotateX(360deg) rotateY(720deg) rotateZ(360deg)}}
@keyframes cubefloat{from{margin-top:-14px}to{margin-top:18px}}
@media (max-width:700px){.cube3d{--s:22px!important}.cubes .hide-m{display:none}}

/* rasmlar: qiyshiq holatda turadi, uzoqdan keladi (JS scroll bilan) */
.depth{transform-style:preserve-3d;will-change:transform}
.shots figure,.split-media .frame{transition:box-shadow .4s}
.fx .shots figure.depth:hover{z-index:2}
.shots button img{border-radius:inherit}
.night .shots button,.sun .shots button{box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.shots button{box-shadow:0 24px 48px -28px rgba(20,20,40,.35)}

/* hero 3D sahna foni */
.stage3d::before{content:"";position:absolute;left:50%;top:50%;width:min(520px,80%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(246,192,66,.35),rgba(246,192,66,0) 65%);pointer-events:none}
.sun .stage3d::before{background:radial-gradient(circle,rgba(255,255,255,.55),rgba(255,255,255,0) 65%)}
.sun .stage3d .hint{color:#6b4e00}

/* night / sun ichidagi rail kartalar */
.night .hl img{border:1px solid var(--night-line);border-bottom:0}
.night .rail{perspective:1400px}
.rail > *{transform-style:preserve-3d}
.review:nth-child(4n+1){background:#fff}.tint-v .review blockquote{color:var(--ink)}
.tint-v .review:nth-child(2) blockquote::first-letter{color:var(--violet)}
.section.night .card.soft{background:var(--night-2)}
.section.night .card.soft h3{color:#fff}
#target .price b{color:#c58a00!important}#smm .price b{color:var(--blue)!important}#video .price b{color:#e0431f!important}
#dizayn .price b{color:#0e8f60!important}#bot .price b{color:var(--violet)!important}#full .price b{color:var(--ink)!important}
#target h3::before,#smm h3::before,#video h3::before,#dizayn h3::before,#bot h3::before,#full h3::before{content:"";display:block;width:30px;height:30px;border-radius:9px;margin-bottom:14px;transform:rotate(12deg);background:var(--brand)}
#smm h3::before{background:var(--blue)}#video h3::before{background:var(--coral)}#dizayn h3::before{background:var(--mint)}#bot h3::before{background:var(--violet)}#full h3::before{background:var(--ink)}

/* ================= V3: logo rangi, glossy menyu, loyiha kartalari ================= */
:root{--brand:#ffbf00;--brand-deep:#e0a800}
[id]{scroll-margin-top:110px}

/* --- glossy menyu --- */
.navwrap{position:sticky;top:0;z-index:70;padding:calc(env(safe-area-inset-top,0px) + 10px) max(10px,2vw) 0;pointer-events:none}
.gnav{pointer-events:auto;position:relative;max-width:1180px;margin:0 auto;height:60px;display:flex;align-items:center;gap:18px;padding:0 10px 0 16px;border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.62) 55%,rgba(255,255,255,.72) 100%);
  backdrop-filter:blur(22px) saturate(190%);-webkit-backdrop-filter:blur(22px) saturate(190%);
  border:1px solid rgba(255,255,255,.85);border-bottom-color:rgba(0,0,0,.06);
  box-shadow:0 12px 34px -14px rgba(25,25,45,.35),0 2px 6px -2px rgba(25,25,45,.08),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -8px 16px -12px rgba(255,191,0,.25)}
.gnav::before{content:"";position:absolute;inset:1px 1px 50% 1px;border-radius:21px 21px 40% 40%/21px 21px 14px 14px;background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0));pointer-events:none}
.gnav>*{position:relative}
.gnav .wrap{display:contents}
.brand img{width:30px;height:auto}
.gnav nav{display:flex;gap:4px;margin-left:auto;align-items:center}
.gnav nav a{font-size:13.5px;font-weight:500;color:#2a2a30;padding:9px 13px;border-radius:12px;line-height:1;transition:background .2s,color .2s,transform .2s}
.gnav nav a:hover{background:rgba(0,0,0,.05);text-decoration:none;transform:translateY(-1px)}
.gnav nav a[aria-current=page]{color:#1d1d1f;font-weight:600;background:linear-gradient(180deg,#ffe38a 0%,#ffbf00 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 4px 10px -4px rgba(224,168,0,.8)}
.gcta{font-size:13.5px;font-weight:600;color:#fff;padding:11px 18px;border-radius:14px;white-space:nowrap;background:linear-gradient(180deg,#3a3a42 0%,#111114 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 6px 16px -6px rgba(0,0,0,.6)}
.gcta:hover{text-decoration:none;filter:brightness(1.15)}
.nav-cta-m{display:none}
.menu-btn{display:none;width:44px;height:44px;border:0;border-radius:14px;background:rgba(0,0,0,.05);cursor:pointer;position:relative;margin-left:auto}
.menu-btn span{position:absolute;left:13px;right:13px;height:2px;border-radius:2px;background:#1d1d1f;transition:transform .3s,top .3s}
.menu-btn span:first-child{top:17px}.menu-btn span:last-child{top:25px}
.menu-btn[aria-expanded=true] span:first-child{top:21px;transform:rotate(45deg)}
.menu-btn[aria-expanded=true] span:last-child{top:21px;transform:rotate(-45deg)}
@media (max-width:980px){
  .gcta{display:none}
  .menu-btn{display:block}
  .gnav nav{position:absolute;top:68px;left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;padding:10px;border-radius:22px;margin:0;
    background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.8));backdrop-filter:blur(24px) saturate(190%);-webkit-backdrop-filter:blur(24px) saturate(190%);
    border:1px solid rgba(255,255,255,.9);box-shadow:0 24px 50px -20px rgba(25,25,45,.45),inset 0 1px 0 #fff;inset:68px 0 auto 0}
  .gnav nav a{font-size:18px;font-weight:600;padding:14px 16px;border:0;border-radius:14px}
  .gnav nav a.nav-cta-m{display:block;text-align:center;margin-top:6px;color:#fff;background:linear-gradient(180deg,#3a3a42,#111114)}
  .gnav nav[hidden]{display:none!important}
}
@media (min-width:981px){.gnav nav[hidden]{display:flex!important}}
.lnav{top:calc(env(safe-area-inset-top,0px) + 76px);background:rgba(255,255,255,.75)}
main{margin-top:-70px}
main>section:first-child{padding-top:120px}

/* --- logo uslubidagi piksellar (qora kubiklar o'rniga) --- */
.pixels{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.px{position:absolute;width:var(--s);height:var(--s);background:var(--c,var(--brand));border-radius:3px;opacity:.9;animation:pxfloat 7s ease-in-out infinite alternate,pxblink 4.5s ease-in-out infinite;animation-delay:calc(var(--d) * -1),var(--d)}
.night .px{opacity:.8}
.sun .px{--c:#fff!important;opacity:.55}
@keyframes pxfloat{from{transform:translate(0,0) rotate(0)}to{transform:translate(14px,-22px) rotate(8deg)}}
@keyframes pxblink{0%,100%{opacity:.9}50%{opacity:.35}}
@media (max-width:700px){.px.hide-m{display:none}}
.cubes,.cube3d{display:none!important}

/* --- natija kartalari rangi --- */
.night .hl .big{color:var(--hc,var(--brand))}

/* --- loyiha kartalari --- */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.chipf{font:inherit;font-size:14px;font-weight:600;padding:9px 16px;border-radius:99px;border:1px solid var(--hair);background:#fff;cursor:pointer;color:var(--ink)}
.chipf.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
@media (max-width:980px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.pgrid{grid-template-columns:1fr}}
.pcard{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px;border-radius:28px;background:var(--pt);overflow:hidden;isolation:isolate;min-width:0}
.pcard::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:40px;background:var(--pc);opacity:.12;transform:rotate(18deg);z-index:-1}
.pcard::before{content:"";position:absolute;right:22px;top:92px;width:14px;height:14px;border-radius:3px;background:var(--pc2);opacity:.9;box-shadow:-22px 12px 0 -3px var(--pc),-8px 30px 0 -5px var(--pc2)}
.pcard[hidden]{display:none}
.plogo{width:64px;height:64px;border-radius:18px;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:0 8px 20px -10px rgba(0,0,0,.25)}
.plogo img,.plogo svg{max-width:78%;max-height:78%;width:auto;height:auto;object-fit:contain}
.plogo svg{width:60%;height:60%}
.plogo .mono{font-weight:700;font-size:22px;letter-spacing:-.02em;color:var(--pc)}
.plogo .mono.serif{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:28px}
.ptag{font-size:12px;font-weight:600;color:var(--pc);letter-spacing:.2px}
.pcard h3{font-size:22px;line-height:1.15;letter-spacing:-.01em}
.pcard p{font-size:15px;color:#4a4a52;line-height:1.4}
.pstats{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.pstat{font-size:12.5px;color:#4a4a52;background:#fff;border-radius:12px;padding:7px 11px}
.pstat b{color:var(--pc);font-size:15px;font-weight:700;margin-right:3px}
.pbtn{margin-top:auto;align-self:flex-start;font:inherit;font-size:14px;font-weight:600;border:0;cursor:pointer;padding:11px 18px;border-radius:14px;color:var(--pink);background:linear-gradient(180deg,color-mix(in srgb,var(--pc) 80%,#fff) 0%,var(--pc) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 18px -8px var(--pc);transition:transform .2s}
.pbtn:hover{transform:translateY(-2px)}
.pbtn span{display:inline-block;transition:transform .2s}.pbtn:hover span{transform:translateX(3px)}

/* --- modal (Batafsil) --- */
.modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:16px;background:rgba(14,14,20,.45);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transition:opacity .25s}
.modal.open{opacity:1}
.modal[hidden]{display:none!important}
.mbox{width:min(640px,100%);max-height:min(86vh,860px);overflow:auto;background:#fff;border-radius:28px;box-shadow:0 40px 90px -30px rgba(0,0,0,.5);transform:translateY(24px) scale(.97);transition:transform .35s cubic-bezier(.2,.75,.15,1)}
.modal.open .mbox{transform:none}
.mhead{position:relative;display:flex;gap:16px;align-items:center;padding:26px 26px 22px;background:var(--pc);color:var(--pink);overflow:hidden}
.mhead::after{content:"";position:absolute;right:-30px;bottom:-50px;width:150px;height:150px;border-radius:36px;background:var(--pc2);opacity:.35;transform:rotate(20deg)}
.mhead h2{font-size:26px;color:var(--pink);line-height:1.1}
.mhead .ptag{color:var(--pink);opacity:.85}
.mbody{padding:24px 26px 28px;display:flex;flex-direction:column;gap:16px;font-size:16px}
.mbody p{color:#3a3a40}
.mbody .ticks li::before{border-color:var(--pc)}
.mgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:520px){.mgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mgrid div{background:var(--mist);border-radius:14px;padding:12px}
.mgrid b{display:block;font-size:22px;color:var(--pc);letter-spacing:-.02em}
.mgrid span{font-size:12px;color:var(--slate);line-height:1.3;display:block;margin-top:2px}
.plink{background:var(--mist);color:var(--ink);border-color:transparent;font-weight:600}
.mclose{position:absolute;top:14px;right:14px;z-index:2;width:40px;height:40px;border-radius:12px;border:0;background:rgba(255,255,255,.25);color:inherit;font-size:22px;cursor:pointer;backdrop-filter:blur(6px)}
@media (max-width:600px){.modal{padding:0;place-items:end center}.mbox{border-radius:26px 26px 0 0;max-height:90vh}}

/* --- Batafsil ochiladigan blok --- */
.more-box summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;padding:9px 16px;border-radius:12px;background:rgba(0,0,0,.05);color:var(--ink);user-select:none}
.more-box summary::-webkit-details-marker{display:none}
.more-box summary::after{content:"+";font-size:18px;line-height:1;transition:transform .2s}
.more-box[open] summary::after{transform:rotate(45deg)}
.night .more-box summary{background:rgba(255,255,255,.1);color:#fff}
.sun .more-box summary{background:rgba(255,255,255,.55)}

/* --- xizmatlar qatorlari --- */
.srows{display:flex;flex-direction:column;gap:14px}
.srow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 24px;align-items:center;padding:22px 24px;border-radius:24px;background:var(--mist)}
.srow:nth-child(1){background:var(--t-yellow)}.srow:nth-child(2){background:var(--t-blue)}.srow:nth-child(3){background:var(--t-coral)}
.srow:nth-child(4){background:var(--t-mint)}.srow:nth-child(5){background:var(--t-violet)}.srow:nth-child(6){background:#16161c;color:#fff}
.srow:nth-child(6) h3{color:#fff}.srow:nth-child(6) .muted{color:#a1a1aa}.srow:nth-child(6) .sprice b{color:var(--brand)}
.srow:nth-child(6) .more-box summary{background:rgba(255,255,255,.12);color:#fff}
.srow h3{font-size:22px}
.srow .sprice{text-align:right}
.srow .sprice b{font-size:28px;font-weight:700;letter-spacing:-.02em}
.srow .sprice span{font-size:14px;color:var(--slate)}
.srow-more{grid-column:1/-1}
.srow h3::before{display:none!important}
@media (max-width:600px){.srow{grid-template-columns:1fr}.srow .sprice{text-align:left}}

/* --- ariza formasi --- */
.cta-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;align-items:center}
@media (max-width:860px){.cta-grid{grid-template-columns:1fr}}
.cta-sec{text-align:left}
.lead-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.lead-row.two{grid-template-columns:minmax(0,2fr) minmax(0,1fr);margin-top:12px}
@media (max-width:640px){.lead-row,.lead-row.two{grid-template-columns:1fr}}
form.leadform{display:flex;flex-direction:column;gap:14px}
form.leadform .field input,form.leadform .field select,form.leadform .field textarea{border-color:rgba(0,0,0,.18);background:#fff}
form.leadform.dark .field label{color:#e5e5ea}
form.leadform.dark .field input,form.leadform.dark .field select,form.leadform.dark .field textarea{background:#1f1f27;border-color:#34343f;color:#fff}
.lead-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.lead-msg{font-size:14px;font-weight:600}
.lead-msg.ok{color:#15a360}.lead-msg.err{color:#e0431f}
.night .lead-msg.ok{color:#5ee2a8}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.pill-blue{background:linear-gradient(180deg,#2a8cff,#0071e3);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 8px 18px -8px rgba(0,113,227,.8)}

/* --- slaydlar telefonda o'rtaga kelsin --- */
@media (max-width:700px){
  .rail{grid-auto-columns:78vw;padding-inline:11vw;scroll-padding-inline:11vw}
  .rail>*{scroll-snap-align:center}
  .vids{grid-auto-columns:60vw;padding-inline:20vw;scroll-padding-inline:20vw}
  .vids>*{scroll-snap-align:center}
}
.vids>*{scroll-snap-align:center}
.vid img{background:#222}