/* ==========================================================================
   Deep Vision — Odoo ERP landing
   Ranglar/o'lchamlar shu yerda. Brendni o'zgartirish uchun :root ni tahrirlang.
   ========================================================================== */

:root{
  /* Fon */
  --bg:        #0A0A0B;
  --bg-2:      #0E0E10;
  --card:      #141416;
  --card-2:    #1A1A1D;

  /* Chiziqlar */
  --line:      rgba(255,255,255,.08);
  --line-2:    rgba(255,255,255,.16);

  /* Aksent — oltin */
  --gold:      #E5B45B;
  --gold-l:    #F7D89A;
  --gold-d:    #C08A2E;
  --gold-a08:  rgba(229,180,91,.08);
  --gold-a16:  rgba(229,180,91,.16);
  --gold-a30:  rgba(229,180,91,.30);

  /* Matn */
  --txt:       #F4F4F3;
  --mut:       #9E9EA4;
  --dim:       #6B6B71;

  /* Shakl */
  --r-sm: 12px;
  --r:    18px;
  --r-lg: 26px;
  --wrap: 1200px;
  --pad:  clamp(18px, 4vw, 32px);

  --ease: cubic-bezier(.22,.75,.28,1);
}

*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scrollbar-color:#2A2A2E var(--bg); }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--bg); }
::-webkit-scrollbar-thumb{ background:#2A2A2E; border-radius:100px; border:2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover{ background:#3A3A40; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--bg);
  color:var(--txt);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; }
::selection{ background:var(--gold); color:#0A0A0B; }

:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:6px; }

/* Chrome/Edge avtomatik to'ldirganda maydonni oq-ko'kimtir qilib bo'yaydi.
   Fon rangi o'tishini "cheksiz" kechiktiramiz — brauzer o'z ranggini chizmaydi. */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
select:-webkit-autofill{
  -webkit-text-fill-color:var(--txt);
  caret-color:var(--txt);
  transition:background-color 600000s 0s, color 600000s 0s;
}
input:autofill, select:autofill{
  -webkit-text-fill-color:var(--txt); caret-color:var(--txt);
  background-color:transparent;
}
/* Chrome autofill matnga o'z shriftini ham qo'yadi */
input:-webkit-autofill::first-line{
  font-family:inherit; font-size:clamp(17px,1.9vw,20px); color:var(--txt);
}

/* ---------- Layout ---------- */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.wrap--nr{ max-width:860px; }
.wrap--wide{ max-width:1330px; }

.sec{ padding:clamp(64px,9vw,120px) 0; position:relative; }
.sec--alt{ background:var(--bg-2); border-block:1px solid var(--line); }
.sec--tight{ padding-block:clamp(52px,7vw,90px); }

/* ---------- Tipografiya ---------- */
.h1{
  margin:0 0 18px;
  font-size:clamp(32px,5.4vw,60px);
  line-height:1.06;
  letter-spacing:-.03em;
  font-weight:800;
}
.h2{
  margin:0 0 12px;
  font-size:clamp(26px,3.6vw,44px);
  line-height:1.12;
  letter-spacing:-.025em;
  font-weight:700;
}
.lead{ margin:0; font-size:clamp(15px,1.6vw,18px); color:var(--mut); max-width:52ch; }
.sub{ margin:0; color:var(--mut); font-size:clamp(14.5px,1.4vw,17px); max-width:56ch; }

.grad{
  background:linear-gradient(100deg,var(--gold-l),var(--gold) 45%,var(--gold-d));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.gold{ color:var(--gold); }

.sec__head{ margin-bottom:clamp(30px,4vw,52px); }
.sec__head--c{ text-align:center; }
.sec__head--c .sub{ margin-inline:auto; }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); margin-bottom:14px;
}

/* ---------- Ikonkalar ---------- */
.ic{
  width:20px; height:20px; flex:0 0 auto;
  fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}
.ic--gold{ color:var(--gold); }
#i-play, .vid__play .ic{ }
.vid__play .ic{ fill:currentColor; stroke:none; }
.mbar__tel .ic, .cta__contact .ic, .btn .ic{ }

/* ---------- Tugmalar ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:12px 20px; border-radius:100px; border:1px solid transparent;
  font-weight:600; font-size:14.5px; line-height:1; cursor:pointer;
  transition:transform .18s var(--ease), background .2s, border-color .2s, box-shadow .25s;
  white-space:nowrap;
}
.btn .ic{ width:17px; height:17px; transition:transform .2s var(--ease); }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }

.btn--gold{
  background:linear-gradient(180deg,var(--gold-l),var(--gold));
  color:#100C04; font-weight:700;
  box-shadow:0 6px 22px -6px rgba(229,180,91,.5), inset 0 1px 0 rgba(255,255,255,.4);
}
.btn--gold:hover{ box-shadow:0 12px 30px -8px rgba(229,180,91,.65), inset 0 1px 0 rgba(255,255,255,.5); }
.btn--gold:hover .ic{ transform:translateX(3px); }

.btn--line{ background:transparent; border-color:var(--line-2); color:var(--txt); }
.btn--line:hover{ background:rgba(255,255,255,.05); border-color:var(--gold-a30); }

.btn--ghost{ background:rgba(255,255,255,.04); border-color:var(--line); color:var(--txt); }
.btn--ghost:hover{ background:rgba(255,255,255,.08); }

.btn--sm{ padding:9px 15px; font-size:13.5px; }
.btn--lg{ padding:15px 26px; font-size:15.5px; }
.btn--full{ width:100%; }

/* ---------- Header ---------- */
.hdr{
  position:fixed; inset:0 0 auto; z-index:60;
  transition:background .3s, border-color .3s, backdrop-filter .3s;
  border-bottom:1px solid transparent;
}
.hdr.is-stuck{
  background:rgba(10,10,11,.82);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom-color:var(--line);
}
.hdr__in{ display:flex; align-items:center; gap:20px; height:68px; }

.logo{ display:inline-flex; align-items:center; gap:10px; flex:0 0 auto; }

/* Logotip rasmi. Fayl bo'lmasa — matnli variant ko'rinadi (JS onerror qo'yadi). */
.logo__img{ display:block; height:34px; width:auto; max-width:200px; object-fit:contain; }
.logo__fb{ display:none; align-items:center; gap:10px; }
.logo.is-fb .logo__fb{ display:inline-flex; }
.ftr .logo__img{ height:28px; }
.logo__mark{
  width:28px; height:28px; border-radius:9px; display:grid; place-items:center;
  border:1.5px solid var(--gold); position:relative;
}
.logo__mark i{ width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 12px var(--gold-a30); }
.logo__txt{ font-size:14px; font-weight:600; letter-spacing:.14em; color:var(--mut); }
.logo__txt b{ color:var(--txt); font-weight:800; }

.nav{ display:flex; gap:26px; margin-inline:auto; }
.nav a{ font-size:14px; color:var(--mut); transition:color .2s; position:relative; }
.nav a::after{
  content:''; position:absolute; left:0; right:100%; bottom:-5px; height:1.5px;
  background:var(--gold); transition:right .25s var(--ease);
}
.nav a:hover{ color:var(--txt); }
.nav a:hover::after{ right:0; }

.hdr__cta{ display:flex; gap:9px; flex:0 0 auto; }

.burger{
  display:none; width:40px; height:40px; border:1px solid var(--line);
  background:rgba(255,255,255,.04); border-radius:11px; cursor:pointer;
  flex-direction:column; align-items:center; justify-content:center; gap:4.5px; padding:0;
}
.burger span{ width:16px; height:1.6px; background:var(--txt); border-radius:2px; transition:.25s var(--ease); }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.1px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.1px) rotate(-45deg); }

/* ---------- HERO ---------- */
.hero{ position:relative; padding-top:clamp(104px,13vw,150px); overflow:hidden; }

.hero__glow{
  position:absolute; top:-24%; left:50%; transform:translateX(-50%);
  width:min(1100px,140vw); aspect-ratio:1.5/1; pointer-events:none;
  background:
    radial-gradient(ellipse at 30% 40%, rgba(229,180,91,.15), transparent 62%),
    radial-gradient(ellipse at 72% 30%, rgba(229,180,91,.08), transparent 60%);
  filter:blur(28px);
}
.hero__grid-bg{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 90% 55% at 50% 0%, #000 20%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 90% 55% at 50% 0%, #000 20%, transparent 75%);
}

.hero__in{
  position:relative; z-index:1;
  display:grid; grid-template-columns:1.05fr .85fr; gap:clamp(28px,5vw,64px);
  align-items:center; padding-bottom:clamp(44px,6vw,72px);
}

.pill{
  display:inline-flex; align-items:center; gap:9px;
  padding:7px 16px; border-radius:100px;
  border:1px solid var(--gold-a30); background:var(--gold-a08);
  font-size:12.5px; color:var(--mut); margin-bottom:20px;
}
.pill b{ color:var(--gold); font-weight:600; }

.hero__btns{ display:flex; flex-wrap:wrap; gap:11px; margin-top:28px; }

.hero__trust{ display:flex; align-items:center; gap:12px; margin-top:26px; }
.hero__trust p{ margin:0; font-size:13.5px; color:var(--dim); }
.hero__trust b{ color:var(--txt); font-weight:600; }
.avatars{ display:flex; }
.avatars span{
  width:30px; height:30px; border-radius:50%; margin-left:-9px;
  border:2px solid var(--bg); display:grid; place-items:center;
  font-size:11px; font-weight:700; color:#100C04;
  background:linear-gradient(140deg,var(--gold-l),var(--gold-d));
}
.avatars span:first-child{ margin-left:0; }
.avatars span::before{ content:attr(data-l); }

/* Founder rasm */
.hero__visual{ position:relative; }
.founder{
  margin:0; position:relative; border-radius:var(--r-lg); overflow:hidden;
  border:1px solid var(--line); background:var(--card);
  aspect-ratio:4/4.6; box-shadow:0 40px 90px -40px rgba(0,0,0,.9);
}
.founder img{ width:100%; height:100%; object-fit:cover; }
.founder::after{
  content:''; position:absolute; inset:auto 0 0; height:52%;
  background:linear-gradient(to top,rgba(8,8,9,.95),transparent);
  pointer-events:none;
}
.founder__ph{
  display:none; position:absolute; inset:0;
  flex-direction:column; align-items:center; justify-content:center; gap:12px;
  color:var(--dim); font-size:12px;
  background:
    radial-gradient(circle at 50% 35%, rgba(229,180,91,.12), transparent 60%),
    repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0 12px,transparent 12px 24px);
}
.founder__ph svg{ width:56px; height:56px; fill:none; stroke:var(--gold-a30); stroke-width:1.3; }
.founder.is-empty .founder__ph{ display:flex; }

.founder__cap{
  position:absolute; left:20px; bottom:18px; z-index:2;
  display:flex; flex-direction:column;
}
.founder__cap b{ font-size:14px; letter-spacing:.06em; text-transform:uppercase; }
.founder__cap span{ font-size:12.5px; color:var(--gold); }


/* Statistika */
.stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line);
  border-radius:var(--r); overflow:hidden;
}
.stat{ background:var(--bg); padding:22px 20px; }
.stat b{ display:block; font-size:clamp(18px,2.2vw,24px); font-weight:700; letter-spacing:-.02em; margin-bottom:5px; }
.stat span{ font-size:12.5px; color:var(--dim); line-height:1.45; display:block; }

/* ---------- MUAMMO ---------- */
.pains{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.pain{
  display:flex; align-items:center; gap:13px;
  padding:20px; border-radius:var(--r); background:var(--card);
  border:1px solid var(--line); font-size:14.5px; line-height:1.5;
  transition:border-color .25s, background .25s, transform .25s var(--ease);
}
.pain:hover{ border-color:var(--line-2); background:var(--card-2); transform:translateY(-3px); }
.pain__x{
  flex:0 0 auto; width:28px; height:28px; border-radius:9px; display:grid; place-items:center;
  background:rgba(226,90,80,.12); color:#E2685E;
}
.pain__x .ic{ width:14px; height:14px; stroke-width:2.2; }

.pains__note{
  margin:26px 0 0; text-align:center; font-size:15px; color:var(--mut);
}
.pains__note b{ color:var(--gold); }

/* ---------- YECHIM: xarita (chip → strelka → Odoo oynasi) ---------- */
.eyebrow--pill{
  padding:7px 15px; border-radius:100px;
  border:1px solid var(--gold-a30); background:var(--gold-a08);
}

.sysmap{
  display:grid;
  /* o'rtadagi ustun aniq cheklangan: `auto` bo'lsa, ichidagi rasmning
     tabiiy kengligi (1135px) yon ustunlarni siqib qo'yadi */
  grid-template-columns:minmax(0,1fr) minmax(0,500px) minmax(0,1fr);
  align-items:center;
  gap:clamp(10px,1.6vw,26px);
}

.side{ display:flex; flex-direction:column; gap:clamp(20px,3vw,42px); }
.link{ display:flex; align-items:center; min-height:72px; }
.side--r .link{ flex-direction:row-reverse; }

/* --- Yon kartochkalar --- */
.chip{
  flex:1 1 auto; min-width:0;
  display:flex; align-items:center; gap:12px;
  padding:13px 16px; border-radius:16px;
  background:rgba(255,255,255,.035); border:1px solid var(--line);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  transition:border-color .25s, background .25s, transform .25s var(--ease);
}
.chip:hover{ border-color:var(--line-2); background:rgba(255,255,255,.06); transform:translateY(-3px); }
.chip__ic{
  flex:0 0 auto; width:38px; height:38px; border-radius:11px;
  display:grid; place-items:center; color:#fff;
  background:linear-gradient(150deg,var(--a),var(--b));
  box-shadow:0 6px 16px -8px var(--b);
}
.chip__ic .ic{ width:19px; height:19px; stroke-width:1.9; }
.chip__t{ min-width:0; overflow-wrap:anywhere; }
.chip__t b{ display:block; font-size:14.5px; font-weight:600; letter-spacing:-.01em; }
.chip__t span{ display:block; font-size:12px; color:var(--dim); line-height:1.4; }

/* --- Qo'lda chizilgandek strelka + yozuv --- */
.conn{
  flex:0 0 auto; position:relative;
  width:clamp(56px,5.6vw,96px); height:60px;
  --rot:0deg; --flip:1;
}
.link:nth-child(1) .conn{ --rot:10deg; }
.link:nth-child(2) .conn{ --rot:-4deg; }
.link:nth-child(3) .conn{ --rot:-22deg; }
.side--r .conn{ --flip:-1; }

.arrow{
  width:100%; height:100%; overflow:visible;
  fill:none; stroke:currentColor; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round;
  transform:scaleX(var(--flip)) rotate(var(--rot));
  color:var(--gold);
}
.side--l .link:nth-child(1) .arrow{ color:#4CC9A7; }
.side--l .link:nth-child(2) .arrow{ color:#B07BF0; }
.side--l .link:nth-child(3) .arrow{ color:#F0A93C; }
.side--r .link:nth-child(1) .arrow{ color:#5AB6F5; }
.side--r .link:nth-child(2) .arrow{ color:#B07BF0; }
.side--r .link:nth-child(3) .arrow{ color:#4CC9A7; }

.conn__t{
  position:absolute; left:50%; bottom:calc(100% - 12px);
  transform:translateX(-50%) rotate(calc(var(--flip) * -7deg));
  font-family:'Caveat','Segoe Script',cursive;
  font-size:clamp(14px,1.5vw,19px); line-height:1.15; font-weight:600;
  color:currentColor; white-space:nowrap; pointer-events:none;
}
.side--l .link:nth-child(1) .conn__t{ color:#79E0C4; }
.side--l .link:nth-child(2) .conn__t{ color:#C9A2FB; }
.side--l .link:nth-child(3) .conn__t{ color:#F5C173; }
.side--r .link:nth-child(1) .conn__t{ color:#8CCDF8; }
.side--r .link:nth-child(2) .conn__t{ color:#C9A2FB; }
.side--r .link:nth-child(3) .conn__t{ color:#79E0C4; }

/* --- Markazdagi oyna --- */
.win{
  width:100%; max-width:500px; justify-self:center;
  border-radius:22px; overflow:hidden;
  background:#F3F4F6;                 /* rasm foni bilan bir xil */
  border:1px solid var(--line-2);
  box-shadow:0 60px 120px -50px rgba(0,0,0,1), 0 0 0 1px rgba(229,180,91,.05);
}
.win__bar{
  display:flex; align-items:center; gap:7px; padding:12px 16px;
  border-bottom:1px solid #E2E3E8; background:#E9EAEE;
}
.win__bar span{ width:9px; height:9px; border-radius:50%; background:var(--line-2); }
.win__bar span:nth-child(1){ background:#F0655A; }
.win__bar span:nth-child(2){ background:#F1BE4F; }
.win__bar span:nth-child(3){ background:#5BC66B; }

.win__shot{ display:block; width:100%; height:auto; }

/* --- Qo'lda chizilgandek oval --- */
.oval{
  display:flex; align-items:center; justify-content:center; gap:14px;
  margin:clamp(28px,4vw,46px) 0 0;
}
.oval__in{
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 30px; border-radius:100px;
  border:2px solid var(--gold-a30); color:var(--txt);
  font-size:clamp(14px,1.5vw,16px); font-weight:600;
  transform:rotate(-.7deg);
  box-shadow:0 0 34px -14px rgba(229,180,91,.55);
}
.oval__in .ic{ width:19px; height:19px; color:var(--gold); stroke-width:2.2; }
.oval__spark{ position:relative; width:26px; height:26px; flex:0 0 auto; opacity:.65; }
.oval__spark::before,
.oval__spark::after{
  content:''; position:absolute; width:11px; height:2px; border-radius:2px;
  background:var(--gold);
}
.oval__spark::before{ top:5px;  left:0; width:13px; transform:rotate(-18deg); }
.oval__spark::after { top:15px; left:3px; width:9px;  transform:rotate(-18deg); }
.oval__spark--r{ transform:scaleX(-1); }

/* --- Belgilar ro'yxati (bu yerda ham, CTA bo'limida ham ishlatiladi) --- */
.ticks{
  list-style:none; margin:30px 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center;
}
.ticks li{ display:flex; align-items:center; gap:9px; font-size:14px; color:var(--mut); }
.ticks .ic{ width:16px; height:16px; color:var(--gold); stroke-width:2.4; }
.ticks--col{
  flex-direction:column; justify-content:flex-start; align-items:flex-start;
  gap:11px; margin-top:24px;
}

/* --- Pastki belgilar qatori --- */
.ticks--row{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:0; margin-top:clamp(24px,3.4vw,38px);
}
.ticks--row li{
  padding:4px clamp(14px,2.2vw,28px);
  border-left:1px solid var(--line);
  font-size:13.5px;
}
.ticks--row li:first-child{ border-left:0; }

/* ---------- NATIJALAR ---------- */
.case{
  border-radius:var(--r-lg); padding:clamp(24px,3.6vw,40px);
  background:
    radial-gradient(900px 320px at 12% 0%, rgba(229,180,91,.10), transparent 65%),
    var(--card);
  border:1px solid var(--line-2);
  margin-bottom:14px;
}
.case__tags{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px; }
.tag{
  padding:5px 11px; border-radius:100px; font-size:10.5px; font-weight:600;
  letter-spacing:.11em; text-transform:uppercase;
  background:rgba(255,255,255,.05); border:1px solid var(--line); color:var(--mut);
}
.tag--gold{ background:var(--gold-a16); border-color:var(--gold-a30); color:var(--gold); }

.case__title{ margin:0 0 10px; font-size:clamp(22px,3.2vw,38px); line-height:1.12; letter-spacing:-.025em; font-weight:700; }
.case__txt{ margin:0 0 26px; color:var(--mut); max-width:62ch; font-size:15px; }

.case__nums{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.case__nums div{
  padding:18px 20px; border-radius:var(--r);
  background:rgba(10,10,11,.5); border:1px solid var(--line);
}
.case__nums b{ display:block; font-size:clamp(20px,2.6vw,28px); font-weight:700; color:var(--gold); letter-spacing:-.02em; }
.case__nums span{ display:block; font-size:12.5px; color:var(--dim); margin-top:4px; }

.bento{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.bcard{
  padding:clamp(20px,2.6vw,28px); border-radius:var(--r-lg);
  background:var(--card); border:1px solid var(--line);
  transition:border-color .25s, transform .25s var(--ease), background .25s;
}
.bcard:hover{ border-color:var(--line-2); transform:translateY(-4px); background:var(--card-2); }
.bcard--wide{ grid-column:span 2; }
.bcard__ic{ width:24px; height:24px; margin-bottom:16px; }
.bcard__big{ display:block; font-size:clamp(26px,3.4vw,40px); font-weight:700; letter-spacing:-.03em; line-height:1.05; margin-bottom:9px; }
.bcard p{ margin:0; font-size:14px; color:var(--mut); max-width:44ch; }

.bcard--gold{
  background:linear-gradient(150deg,var(--gold-l),var(--gold) 55%,var(--gold-d));
  border-color:transparent; color:#120D04;
}
.bcard--gold p{ color:rgba(18,13,4,.72); }
.bcard--gold .bcard__ic{ color:#120D04; fill:currentColor; stroke:none; }
.bcard--gold:hover{ background:linear-gradient(150deg,var(--gold-l),var(--gold) 55%,var(--gold-d)); }

/* ---------- VIDEO ---------- */
.vids{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,22px); }
.vid h3{ margin:14px 0 5px; font-size:15.5px; font-weight:600; letter-spacing:-.01em; }
.vid p{ margin:0; font-size:13.5px; color:var(--dim); line-height:1.5; }

.vid__thumb{
  position:relative; display:block; width:100%; padding:0; cursor:pointer;
  aspect-ratio:16/10; border-radius:var(--r); overflow:hidden;
  border:1px solid var(--line);
  background:
    radial-gradient(120% 120% at 25% 15%, rgba(229,180,91,.20), transparent 55%),
    linear-gradient(150deg,#1C1C20,#0E0E10);
}
.vid__thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.vid__thumb::after{
  content:''; position:absolute; inset:0; background:rgba(0,0,0,.18);
  opacity:0; transition:opacity .25s;
}
.vid__thumb:hover::after{ opacity:1; }
.vid__play{
  position:absolute; inset:0; margin:auto; z-index:2;
  width:54px; height:54px; border-radius:50%;
  display:grid; place-items:center;
  background:linear-gradient(180deg,var(--gold-l),var(--gold));
  color:#120D04;
  box-shadow:0 10px 30px -8px rgba(229,180,91,.6);
  transition:transform .25s var(--ease);
}
.vid__play .ic{ width:20px; height:20px; margin-left:2px; }
.vid__thumb:hover .vid__play{ transform:scale(1.1); }

/* ---------- MARQUEE ---------- */
.marq{
  display:grid; gap:12px; overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marq__row{ overflow:hidden; }
.marq__track{ display:flex; gap:12px; width:max-content; animation:slide 42s linear infinite; }
.marq__row--rev .marq__track{ animation-direction:reverse; animation-duration:52s; }
.marq:hover .marq__track{ animation-play-state:paused; }
@keyframes slide{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marq__track{ animation:none; } }

.lg{
  flex:0 0 auto; display:grid; place-items:center;
  min-width:170px; height:76px; padding:0 26px;
  border-radius:var(--r); border:1px solid var(--line); background:var(--card);
  font-size:14px; font-weight:600; color:var(--mut); letter-spacing:.01em;
  transition:color .25s, border-color .25s, background .25s;
}
.lg:hover{ color:var(--txt); border-color:var(--gold-a30); background:var(--card-2); }

/* ---------- JARAYON ---------- */
.steps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); gap:14px; counter-reset:s; }
.step{
  position:relative; padding:26px 22px 24px; border-radius:var(--r-lg);
  background:var(--card); border:1px solid var(--line);
  transition:border-color .25s, transform .25s var(--ease);
}
.step:hover{ border-color:var(--gold-a30); transform:translateY(-4px); }
.step__n{
  display:inline-grid; place-items:center; width:38px; height:38px; border-radius:12px;
  background:var(--gold-a08); border:1px solid var(--gold-a30); color:var(--gold);
  font-size:13px; font-weight:700; letter-spacing:.02em; margin-bottom:16px;
}
.step h3{ margin:0 0 7px; font-size:16px; font-weight:600; letter-spacing:-.01em; }
.step p{ margin:0; font-size:13.5px; color:var(--mut); line-height:1.55; }

/* ---------- FAQ ---------- */
.faq{ display:grid; gap:9px; }
.faq__i{
  border-radius:var(--r); border:1px solid var(--line); background:var(--card);
  overflow:hidden; transition:border-color .25s, background .25s;
}
.faq__i[open]{ border-color:var(--gold-a30); background:var(--card-2); }
.faq__i summary{
  list-style:none; cursor:pointer; padding:18px 54px 18px 20px; position:relative;
  font-size:15px; font-weight:500; line-height:1.45;
}
.faq__i summary::-webkit-details-marker{ display:none; }
.faq__i summary i{
  position:absolute; right:20px; top:50%; transform:translateY(-50%);
  width:16px; height:16px;
}
.faq__i summary i::before,
.faq__i summary i::after{
  content:''; position:absolute; inset:50% 0 auto; height:1.6px; background:var(--gold);
  border-radius:2px; transition:transform .28s var(--ease);
}
.faq__i summary i::after{ transform:rotate(90deg); }
.faq__i[open] summary i::after{ transform:rotate(0); }
.faq__b{ padding:0 20px 20px; }
.faq__b p{ margin:0; font-size:14px; color:var(--mut); line-height:1.65; }

/* ---------- CTA / FORMA ---------- */
.cta{ position:relative; padding:clamp(64px,9vw,110px) 0; overflow:hidden; border-top:1px solid var(--line); }
.cta__glow{
  position:absolute; inset:auto 0 -40% ; height:80%; pointer-events:none;
  background:radial-gradient(ellipse 60% 100% at 50% 100%, rgba(229,180,91,.14), transparent 70%);
  filter:blur(20px);
}
.cta__in{ position:relative; z-index:1; display:grid; grid-template-columns:1fr .9fr; gap:clamp(28px,4.5vw,60px); align-items:center; }
.cta__contacts{ display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.cta__contact{
  display:inline-flex; align-items:center; gap:9px; padding:11px 18px;
  border-radius:100px; border:1px solid var(--line); background:rgba(255,255,255,.03);
  font-size:14px; font-weight:500; transition:border-color .2s, background .2s;
}
.cta__contact:hover{ border-color:var(--gold-a30); background:var(--gold-a08); }
.cta__contact .ic{ width:17px; height:17px; color:var(--gold); }
.js-tg .ic{ fill:currentColor; stroke:none; }

.formwrap{
  border-radius:var(--r-lg); padding:1px;
  background:linear-gradient(160deg,var(--gold-a30),transparent 42%,transparent 62%,rgba(229,180,91,.14));
}

/* ---------- Bosqichli forma (kviz) ---------- */
.quiz{
  position:relative; border-radius:calc(var(--r-lg) - 1px);
  background:var(--card); padding:clamp(24px,3.2vw,38px);
  box-shadow:0 40px 90px -50px rgba(0,0,0,1);
}

/* --- Spring egri chizig'i (framer-motion spring'ining CSS muqobili) --- */
:root{ --spring: cubic-bezier(.34,1.56,.64,1); }

/* Tepa qator: chapda nuqtalar, o'ngda "SAVOL n / N" */
.quiz__top{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  margin-bottom:clamp(22px,3vw,30px);
}

/* Progress: nuqtalar ustidan o'sadigan oltin kapsula */
.quiz__prog{
  position:relative; display:flex; align-items:center; gap:20px;
  height:8px; width:max-content; flex:0 0 auto;
  margin:0;
}
.quiz__dot{
  position:relative; z-index:1;
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,.18);
  transition:background .35s var(--ease);
}
.quiz__dot.is-done{ background:#120D04; }
.quiz__pill{
  position:absolute; left:-6px; top:50%; z-index:0;
  height:18px; width:20px; border-radius:100px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,var(--gold-d),var(--gold) 55%,var(--gold-l));
  box-shadow:0 4px 18px -5px rgba(229,180,91,.6);
  transition:width .55s var(--spring);
}

/* Bosqichlar konteyneri — balandligi jonli o'zgaradi */
.quiz__stage{ position:relative; transition:height .36s var(--ease); }

/* Chiquvchi bosqich: --x tomoniga surilib so'nadi.
   visibility kechikish bilan o'chadi — so'nib bo'lgunicha ko'rinib turadi. */
.q{
  position:absolute; inset:0 0 auto; width:100%;
  opacity:0; visibility:hidden;
  transform:translateX(var(--x,16px));
  transition:opacity .2s var(--ease),
             transform .34s var(--ease),
             visibility 0s linear .34s;
}
/* Kiruvchi bosqich: sal kechikib paydo bo'ladi — ikkovi ustma-ust ko'rinmaydi */
.q.is-on{
  position:relative; opacity:1; visibility:visible; transform:none;
  transition:opacity .28s var(--ease) .1s,
             transform .36s var(--ease),
             visibility 0s;
}

.q__n{
  display:flex; align-items:center; gap:9px; margin:0; flex:0 0 auto;
  font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold);
  white-space:nowrap;
}
.q__n b{ font-weight:600; }

.q__t{
  margin:0 0 clamp(18px,2.4vw,26px);
  font-size:clamp(20px,2.4vw,29px); line-height:1.22;
  letter-spacing:-.02em; font-weight:600;
}

/* --- Variantlar --- */
.opts{ display:grid; gap:10px; }
.opt{
  display:flex; align-items:center; gap:14px; cursor:pointer;
  padding:15px 18px; border-radius:14px;
  background:var(--bg-2); border:1px solid var(--line);
  transition:border-color .2s, background .2s, transform .18s var(--ease);
}
.opt:hover{ border-color:var(--line-2); background:var(--card-2); }
.opt:active{ transform:scale(.99); }
.opt input{ position:absolute; opacity:0; width:0; height:0; }

.opt__k{
  flex:0 0 auto; width:30px; height:30px; border-radius:9px;
  display:grid; place-items:center;
  background:rgba(255,255,255,.06); color:var(--mut);
  font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  font-size:12px; font-weight:600;
  transition:background .2s, color .2s;
}
.opt__l{ font-size:15px; line-height:1.4; }

.opt:has(input:checked){ border-color:var(--gold); background:rgba(229,180,91,.07); }
.opt:has(input:checked) .opt__k{ background:var(--gold); color:#120D04; }
.opt:has(input:focus-visible){ outline:2px solid var(--gold); outline-offset:3px; }

/* Fallback: :has() ni qo'llamaydigan brauzerlar uchun JS klass qo'yadi */
.opt.is-sel{ border-color:var(--gold); background:rgba(229,180,91,.07); }
.opt.is-sel .opt__k{ background:var(--gold); color:#120D04; }

/* --- Chiziqli maydonlar --- */
.line{ display:block; position:relative; }
.line input, .line select{
  width:100%; padding:8px 0 13px; border:0; border-bottom:2px solid var(--gold);
  background:transparent; color:var(--txt);
  font-family:inherit; font-size:clamp(17px,1.9vw,20px); line-height:1.3;
  border-radius:0; appearance:none; -webkit-appearance:none;
  transition:border-color .2s;
}
.line input::placeholder{ color:#5A5A60; }
.line input:focus, .line select:focus{ outline:none; border-bottom-color:var(--gold-l); }

.line--sel{ position:relative; }
.line--sel::after{
  content:''; position:absolute; right:2px; top:14px; width:11px; height:11px;
  border-right:2px solid var(--gold); border-bottom:2px solid var(--gold);
  transform:rotate(45deg); pointer-events:none;
}
.line select{ cursor:pointer; padding-right:28px; }
.line select option{ background:#141416; color:var(--txt); }
.line select:invalid, .line select option[value=""]{ color:var(--mut); }

/* Telefon: kod + raqam */
.tel{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:end; }
.tel__cc{
  display:flex; align-items:baseline; gap:7px;
  padding:8px 0 13px; border-bottom:2px solid rgba(255,255,255,.16);
  font-size:clamp(17px,1.9vw,20px); color:var(--txt); white-space:nowrap;
}
.tel__cc b{
  font-size:12px; font-weight:600; color:var(--mut);
  text-transform:uppercase; letter-spacing:.06em;
}

/* --- Xato va tugmalar --- */
.q__err{ margin:12px 0 0; font-size:13px; color:#E2685E; }

/* Tugmalar qatori. 1-bosqichda umuman yo'q — variant tanlansa o'zi keyingisiga o'tadi,
   shuning uchun u yerda tugma ortiqcha. 2-bosqichda ochilib chiqadi.
   padding + manfiy margin — oltin tugmaning nuri qirqilmasligi uchun. */
.quiz__nav{
  display:flex; align-items:center; gap:10px; overflow:hidden;
  margin-top:clamp(14px,2.2vw,22px); margin-bottom:-20px;
  padding:8px 0 20px;
  max-height:100px; opacity:1;
  transition:max-height .45s var(--spring), opacity .3s var(--ease),
             margin .4s var(--ease), padding .4s var(--ease);
}
.quiz.is-first .quiz__nav{
  max-height:0; opacity:0; margin-top:0; margin-bottom:0;
  padding-top:0; padding-bottom:0; pointer-events:none;
}

.qbtn{
  border:1px solid transparent; cursor:pointer; border-radius:100px;
  font-family:inherit; font-weight:600; font-size:15px; line-height:1;
  padding:15px 20px; white-space:nowrap;
  transition:width .5s var(--spring), margin .5s var(--spring),
             padding .4s var(--spring), transform .5s var(--spring),
             opacity .25s var(--ease), background .2s, box-shadow .25s;
}

/* Ortga — kulrang kapsula */
.qbtn--back{
  flex:0 0 auto; width:98px; overflow:hidden;
  background:rgba(255,255,255,.06); border-color:var(--line); color:var(--txt);
}
.qbtn--back:hover{ background:rgba(255,255,255,.11); }

/* 1-bosqichda yig'ilib yo'qoladi — "Davom etish" esa o'zi cho'ziladi */
.quiz.is-first .qbtn--back{
  width:0; padding-left:0; padding-right:0; margin-right:-10px;
  opacity:0; transform:scale(.8); border-width:0; pointer-events:none;
}

/* Davom etish / Yuborish */
.qbtn--go{
  flex:1 1 auto; display:flex; align-items:center; justify-content:center; gap:8px;
  background:linear-gradient(180deg,var(--gold-l),var(--gold));
  color:#100C04; font-weight:700;
  box-shadow:0 6px 22px -6px rgba(229,180,91,.5), inset 0 1px 0 rgba(255,255,255,.4);
}
.qbtn--go:hover{ box-shadow:0 12px 30px -8px rgba(229,180,91,.65), inset 0 1px 0 rgba(255,255,255,.5); }
.qbtn--go:active{ transform:scale(.985); }
.qbtn--go.is-load{ pointer-events:none; opacity:.7; }

/* Oxirgi bosqichda belgi "otilib" chiqadi */
.qbtn__ic{
  display:grid; place-items:center; overflow:hidden;
  width:0; opacity:0; transform:scale(0);
  transition:width .45s var(--spring), transform .45s var(--spring), opacity .28s var(--ease);
}
.qbtn__ic .ic{ width:18px; height:18px; stroke-width:2.4; }
.quiz.is-last .qbtn__ic{ width:18px; opacity:1; transform:scale(1); }

/* Rozilik matni faqat oxirgi bosqichda */
.quiz__legal{
  margin:0; font-size:11.5px; color:var(--dim); line-height:1.5; max-width:42ch;
  opacity:0; max-height:0; overflow:hidden;
  transition:opacity .3s var(--ease), max-height .4s var(--ease), margin .4s var(--ease);
}
.quiz.is-last .quiz__legal{ opacity:1; max-height:70px; margin-top:16px; }

/* --- Muvaffaqiyat ekrani --- */
.form__ok{
  position:absolute; inset:0; z-index:2; border-radius:inherit;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  text-align:center; padding:30px; background:var(--card);
  animation:fade .4s var(--ease);
}
.form__ok b{ font-size:19px; }
.form__ok p{ margin:0; font-size:14px; color:var(--mut); }
.form__okic{
  width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
  background:var(--gold-a16); color:var(--gold); margin-bottom:4px;
}
.form__okic .ic{ width:26px; height:26px; stroke-width:2.4; }
@keyframes fade{ from{ opacity:0; transform:scale(.97); } to{ opacity:1; transform:none; } }

@media (prefers-reduced-motion:reduce){
  .quiz__stage, .q, .quiz__pill, .qbtn, .qbtn__ic, .quiz__nav, .quiz__legal{ transition:none; }
}

/* ---------- FOOTER ---------- */
.ftr{ border-top:1px solid var(--line); background:var(--bg-2); padding-top:clamp(40px,5vw,58px); }
.ftr__in{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:30px; padding-bottom:34px; }
.ftr__brand p{ margin:14px 0 0; font-size:13.5px; color:var(--dim); max-width:36ch; line-height:1.6; }
.ftr__nav, .ftr__c{ display:flex; flex-direction:column; gap:10px; font-size:14px; color:var(--mut); }
.ftr__nav a:hover, .ftr__c a:hover{ color:var(--gold); }
.ftr__bot{ border-top:1px solid var(--line); padding-block:18px; font-size:12.5px; color:var(--dim); }

/* ---------- MOBIL STICKY BAR ---------- */
.mbar{
  position:fixed; z-index:55; left:0; right:0; bottom:0;
  display:none; gap:9px; padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom));
  background:rgba(10,10,11,.9); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-top:1px solid var(--line);
  transform:translateY(110%); transition:transform .3s var(--ease);
}
.mbar.is-on{ transform:none; }
.mbar__btn{ flex:1; }
.mbar__tel{
  flex:0 0 auto; width:46px; height:46px; border-radius:100px; display:grid; place-items:center;
  border:1px solid var(--line-2); background:rgba(255,255,255,.05); color:var(--gold);
}

/* ---------- MODAL ---------- */
.modal{
  position:fixed; inset:0; z-index:200; display:grid; place-items:center;
  padding:var(--pad); background:rgba(6,6,7,.88);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  animation:fade .25s var(--ease);
}
.modal[hidden]{ display:none; }
.modal__box{ width:min(960px,100%); aspect-ratio:16/9; border-radius:var(--r); overflow:hidden; background:#000; border:1px solid var(--line-2); }
.modal__box iframe{ width:100%; height:100%; border:0; display:block; }
.modal__close{
  position:absolute; top:18px; right:18px; width:42px; height:42px; border-radius:50%;
  border:1px solid var(--line-2); background:rgba(255,255,255,.06); cursor:pointer;
  display:grid; place-items:center; color:var(--txt);
}
.modal__close:hover{ background:rgba(255,255,255,.12); }
body.is-locked{ overflow:hidden; }

/* ---------- REVEAL animatsiya ---------- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease) var(--d,0s), transform .6s var(--ease) var(--d,0s); }
.reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1080px){
  .hero__in{ grid-template-columns:1fr; }
  .hero__visual{ max-width:440px; margin-inline:auto; width:100%; }
  .cta__in{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:repeat(2,1fr); }

  /* Yechim: 3 ustun sig'maydi — oyna tepada, 6 kartochka ostida bitta panjarada.
     display:contents yon ustunlarni "eritadi", shunda kataklar bo'sh qolmaydi. */
  .sysmap{
    grid-template-columns:repeat(2,1fr);
    max-width:680px; margin-inline:auto;
    gap:10px; justify-items:stretch;
  }
  .win{ order:-1; grid-column:1/-1; width:100%; max-width:680px; justify-self:center; }
  .side{ display:contents; }
  .side--r .link{ flex-direction:row; }
  .link{ min-height:0; }
  .conn{ display:none; }
}

@media (max-width:900px){
  .nav{
    position:fixed; inset:68px 0 auto; flex-direction:column; gap:0;
    background:#0B0B0D;                 /* to'liq xira — orqa fon ko'rinmasin */
    border-bottom:1px solid var(--line);
    box-shadow:0 24px 40px -24px rgba(0,0,0,.9);
    padding:8px var(--pad) 20px; margin:0;
    transform:translateY(-140%); transition:transform .35s var(--ease);
    z-index:-1;                          /* header ostidan sirg'alib chiqadi */
  }
  .nav.is-open{ transform:none; }
  .nav a{ padding:14px 0; font-size:16px; border-bottom:1px solid var(--line); color:var(--txt); }
  .nav a::after{ display:none; }
  .burger{ display:flex; }

  /* .nav mobilda position:fixed — shuning uchun margin-inline:auto ishlamaydi.
     Tugmalar guruhini o'zi o'ngga surilsin. */
  .hdr__in{ gap:12px; }
  .hdr__cta{ margin-left:auto; gap:8px; }
  .hdr__cta .btn--ghost span{ display:none; }
  .hdr__cta .btn--ghost{ width:40px; height:40px; padding:0; border-radius:12px; }
  .hdr__cta .btn--ghost .ic{ width:18px; height:18px; }
  .burger{ border-radius:12px; }
  .logo__txt{ font-size:13px; letter-spacing:.12em; }
  .logo__img{ height:28px; max-width:160px; }

  .pains{ grid-template-columns:repeat(2,1fr); }
  .vids{ grid-template-columns:repeat(2,1fr); }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .bento{ grid-template-columns:repeat(2,1fr); }
  .bcard--wide{ grid-column:span 2; }
  .ftr__in{ grid-template-columns:1fr 1fr; }
  .ftr__brand{ grid-column:1/-1; }
}

@media (max-width:640px){
  body{ font-size:15px; }
  .hdr__cta .btn--gold{ display:none; }
  .mbar{ display:flex; }
  .ftr{ padding-bottom:76px; }

  .hero__in{ padding-bottom:34px; }
  .hero__btns .btn{ flex:1 1 100%; }
  .founder{ aspect-ratio:4/4.2; }

  .stats{ grid-template-columns:1fr; }
  .pains{ grid-template-columns:1fr; }

  /* Video kartochkalar mobilda gorizontal — scroll qisqaradi */
  .vids{ grid-template-columns:1fr; gap:12px; }
  .vid{
    display:grid; grid-template-columns:130px 1fr; grid-template-rows:auto auto;
    column-gap:13px; align-content:center;
  }
  .vid__thumb{ grid-column:1; grid-row:1 / span 2; align-self:center; aspect-ratio:16/11; }
  .vid__play{ width:38px; height:38px; }
  .vid__play .ic{ width:15px; height:15px; }
  .vid h3{ grid-column:2; grid-row:1; align-self:end; margin:0 0 4px; font-size:14px; }
  .vid p{
    grid-column:2; grid-row:2; align-self:start; font-size:12.5px;
    display:-webkit-box; -webkit-line-clamp:3; line-clamp:3;
    -webkit-box-orient:vertical; overflow:hidden;
  }
  .bento{ grid-template-columns:1fr; }
  .bcard--wide{ grid-column:span 1; }
  .case__nums{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .side{ gap:8px; }
  .chip{ padding:11px 12px; gap:10px; }
  .chip__ic{ width:34px; height:34px; border-radius:10px; }
  .chip__t b{ font-size:13px; }
  .chip__t span{ display:none; }        /* mobilda faqat nom */
  .oval__in{ padding:12px 20px; font-size:14px; }
  .oval__spark{ display:none; }
  .ticks--row{ display:grid; grid-template-columns:1fr; gap:9px; justify-items:start; }
  .ticks--row li{ padding:0; border-left:0; font-size:13px; }
  .ticks{ flex-direction:column; align-items:flex-start; }

  /* Kviz */
  .quiz{ padding:22px 18px 24px; }
  .opt{ padding:13px 14px; gap:11px; }
  .opt__k{ width:27px; height:27px; border-radius:8px; }
  .opt__l{ font-size:14px; }
  .quiz__nav{ gap:9px; }
  .qbtn{ font-size:14.5px; padding:14px 16px; }
  .qbtn--back{ width:86px; }
  .quiz.is-first .qbtn--back{ margin-right:-9px; }
  .quiz__prog{ gap:18px; }
  .quiz__top{ gap:10px; }
  .q__n{ font-size:11px; letter-spacing:.14em; gap:7px; }
  .tel{ gap:12px; }
  .ftr__in{ grid-template-columns:1fr; gap:24px; }
  .lg{ min-width:132px; height:64px; font-size:13px; }
}