/* ============================================================
   sayli.chat — общий стиль лендинга и документов.
   Перенесён 1:1 из дизайна «Sayli Landing» (инлайн-стили → классы).
   Адаптив, который в дизайне считался в JS по ширине окна,
   здесь сделан медиа-запросами: 1100 / 860 / 560 px.
   ============================================================ */

/* ---------- шрифты (self-hosted, без Google Fonts) ---------- */
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('../fonts/onest-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('../fonts/onest-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('../fonts/onest-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Inter — только для макетов экранов приложения */
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('../fonts/inter-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('../fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;
  src:url('../fonts/inter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- база ---------- */
:root{
  --plum:#1C0C22;
  --cream:#FFF3EA;
  --coral:#FF6B4A;
  --yellow:#FFD66B;
  --mint:#9FE5C4;
  --text2:#E3D0DA;
  --text3:#D5C1CC;
  --text4:#C9B3BF;
  --muted:#A8929F;
  --gutter:clamp(18px,4vw,40px);
  --orb-shadow:inset -18px -26px 50px rgba(20,4,24,.45),inset 14px 16px 30px rgba(255,255,255,.45),0 40px 80px rgba(8,2,12,.55);
  /* параллакс — выставляет site.js; без JS остаются нули */
  --px:0;--py:0;--sy:0;--mx:50vw;--my:30vh;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0;background:var(--plum)}
body{font-family:Onest,system-ui,sans-serif;color:var(--cream);min-height:100vh;overflow-x:clip}
a{color:#FF8A6E;text-decoration:none}
a:hover{color:#FFB29F}
::selection{background:rgba(255,107,74,.4);color:#fff}
img,svg{display:block}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:12px;background:var(--yellow);color:var(--plum);font:700 14px/1 Onest}
.skip:focus{top:12px;color:var(--plum)}
:focus-visible{outline:2px solid var(--yellow);outline-offset:3px;border-radius:6px}

@keyframes sFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes sOrb{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-28px,0)}}
@keyframes sShine{from{background-position:0% 50%}to{background-position:220% 50%}}

/* ---------- фон: градиент, «пузыри», свет за курсором ---------- */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 0%,#3B1A44 0%,#24102B 45%,#150819 100%)}
.bg__layer{position:absolute;inset:0}
.bg__layer--far{transform:translate3d(calc(var(--px) * -40px),calc(var(--sy) * -0.12px + var(--py) * -30px),0);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.bg__layer--near{transform:translate3d(calc(var(--px) * -90px),calc(var(--sy) * -0.35px + var(--py) * -70px),0);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.orb-at{position:absolute}
.orb-at--a{top:6vh;right:-4vw;transform:rotate(-10deg)}
.orb-at--b{bottom:-14vh;right:14vw;transform:rotate(12deg);filter:blur(1px);opacity:.8}
.orb-at--c{top:44%;right:2vw;transform:rotate(-14deg)}
.orb-at--d{top:74%;right:30%;transform:rotate(16deg)}
.orb{display:flex;align-items:center;justify-content:center;box-shadow:var(--orb-shadow)}
.orb--coral{width:clamp(260px,30vw,460px);aspect-ratio:1.35;gap:6%;
  border-radius:44% 44% 10% 44% / 52% 52% 14% 52%;
  background:radial-gradient(120% 120% at 28% 18%,#FFD9CB 0%,#FF6B4A 38%,#8E2238 100%);
  animation:sOrb 18s ease-in-out infinite}
.orb__dot{width:22%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff 0%,#FFE9E1 45%,rgba(0,0,0,.25) 100%);
  box-shadow:0 6px 12px rgba(20,4,24,.3)}
.orb--gold{width:clamp(220px,24vw,380px);aspect-ratio:1.2;opacity:.92;
  border-radius:46% 46% 46% 10% / 54% 54% 54% 14%;
  background:radial-gradient(120% 120% at 28% 18%,#FFF4CF 0%,#FFC94D 38%,#9A5A1E 100%);
  animation:sOrb 22s ease-in-out infinite 3s}
.orb__hi{font:800 clamp(56px,7vw,110px)/1 Onest;letter-spacing:-.05em;color:#7A3F12;
  text-shadow:0 2px 0 rgba(255,255,255,.4),0 -2px 6px rgba(80,30,5,.35)}
.orb--mint{width:clamp(110px,11vw,170px);aspect-ratio:1.15;opacity:.85;
  border-radius:46% 46% 10% 46% / 54% 54% 14% 54%;
  background:radial-gradient(120% 120% at 28% 18%,#EFFFF7 0%,#8FDDBB 38%,#1F5E57 100%);
  animation:sOrb 15s ease-in-out infinite 1s}
.orb--mint svg{width:42%;height:auto}
.orb--pink{width:clamp(80px,7vw,120px);aspect-ratio:1.1;opacity:.85;font-size:clamp(28px,2.6vw,44px);
  border-radius:46% 46% 46% 10% / 54% 54% 54% 14%;
  background:radial-gradient(120% 120% at 28% 18%,#FFF0FA 0%,#E3A6D0 38%,#6A2A5C 100%);
  animation:sOrb 12s ease-in-out infinite 2s}
.bg__spot{position:absolute;inset:0;background:radial-gradient(520px circle at var(--mx) var(--my),rgba(255,160,130,.16),transparent 60%)}
.bg__noise{position:absolute;inset:0;opacity:.13;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
.bg__vignette{position:absolute;inset:0;background:radial-gradient(140% 100% at 50% 40%,rgba(0,0,0,0) 55%,rgba(10,3,14,.65) 100%)}
/* на страницах документов фон спокойнее — текст длинный */
.is-doc .bg__layer{opacity:.4}

.page{position:relative;z-index:1}

/* ---------- навигация ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(28,12,34,.55);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav__in{max-width:1160px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:14px var(--gutter)}
.brand{display:flex;align-items:center;gap:12px;flex:1;min-width:0;color:var(--cream)}
.brand:hover{color:var(--cream)}
.brand__tile{width:36px;height:36px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 30% 25%,#FFB29F,#FF6B4A 55%,#C8374A);
  font:800 21px/1 Onest;color:var(--plum);padding-bottom:2px;box-shadow:0 6px 18px rgba(255,107,74,.4)}
.brand__name{font:800 21px/1 Onest;letter-spacing:-.03em}
.brand__name span,.foot__brand .foot__dot{color:var(--coral)}
.nav__links{display:flex;gap:28px;align-items:center;margin-right:8px}
.nav__links a{font:500 15px/1 Onest;color:var(--text2)}
.nav__links a:hover,.nav__links a[aria-current]{color:#FFB29F}
.pill{font:700 15px/1 Onest;color:var(--plum);background:var(--yellow);padding:12px 18px;border-radius:999px;white-space:nowrap;transition:background .18s}
.pill:hover{background:#FFE294;color:var(--plum)}

/* ---------- общие заголовки ---------- */
.wrap{max-width:1160px;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.h2{font:800 clamp(30px,4.6vw,52px)/1.06 Onest;letter-spacing:-.035em;margin:0 0 clamp(26px,4vw,44px);max-width:640px;text-wrap:balance}
.badge{margin:0;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:600 13px/1 Onest;color:var(--text2)}
.badge__dot{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 3px rgba(159,229,196,.2)}
.shine{background:linear-gradient(100deg,#FF7A57 0%,#FFD66B 30%,#FF7A57 55%,#E3A6D0 80%,#FF7A57 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sShine 7s linear infinite}

/* ---------- кнопки сторов ---------- */
.stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.store{display:flex;align-items:center;gap:12px;padding:12px 22px 12px 18px;border-radius:16px;text-align:left;transition:all .18s}
.store svg{flex:none}
.store__txt{display:flex;flex-direction:column;gap:3px}
.store__small{font:500 11px/1 Onest;opacity:.65}
.store__big{font:700 17px/1 Onest}
.store--light{background:var(--cream);color:var(--plum);box-shadow:0 12px 30px rgba(0,0,0,.3)}
.store--light:hover{background:#fff;color:var(--plum);transform:translateY(-2px)}
.store--glass{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--cream)}
.store--glass .store__small{opacity:.7}
.store--glass:hover{background:rgba(255,255,255,.14);color:#fff;transform:translateY(-2px)}
.store--lg{padding:14px 24px 14px 20px}

/* ---------- герой ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,64px);align-items:center;
  padding-top:clamp(40px,7vw,88px)}
.hero__h1{font:800 clamp(40px,6.6vw,78px)/1.02 Onest;letter-spacing:-.04em;margin:22px 0 20px;text-wrap:balance}
.hero__lede{font:400 clamp(17px,1.8vw,20px)/1.55 Onest;color:var(--text2);max-width:520px;margin:0;text-wrap:pretty}
.trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin:26px 0 0;padding:0;list-style:none}
.trust li{display:flex;align-items:center;gap:7px;font:500 14px/1 Onest;color:var(--text4)}
.hero__art{position:relative;display:flex;justify-content:center;padding-bottom:40px}
.tilt{position:relative;transform:perspective(1400px) rotateY(calc(var(--px) * 10deg)) rotateX(calc(var(--py) * -8deg));
  transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.bubble{position:absolute;display:none;
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.bubble--in{top:16%;left:-4%;padding:13px 17px;border-radius:20px 20px 20px 6px;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.2);box-shadow:0 16px 40px rgba(8,2,12,.4);font:500 15px/1.35 Onest;color:#fff;max-width:210px;
  animation:sFloat 7s ease-in-out infinite .6s}
.bubble--lock{bottom:20%;right:-4%;align-items:center;gap:10px;padding:13px 17px;border-radius:20px 20px 6px 20px;
  background:radial-gradient(circle at 30% 20%,#FFB29F,#FF6B4A 60%,#D94A3A);color:var(--plum);
  box-shadow:0 16px 40px rgba(255,107,74,.4);font:700 15px/1.2 Onest;animation:sFloat 8s ease-in-out infinite 1.4s}
@media (min-width:1100px){.bubble--in{display:block}.bubble--lock{display:flex}}

/* ---------- телефон с макетом экрана ---------- */
/* --s — масштаб; бокс резервирует место под уменьшенный телефон */
.phone-box{--s:.8;width:calc(414px * var(--s));height:calc(868px * var(--s))}
.phone{transform:scale(var(--s));transform-origin:top left;width:414px;padding:12px;border-radius:58px;
  background:linear-gradient(160deg,#4A2B50,#1A0B1F);box-shadow:0 50px 100px rgba(8,2,12,.6),inset 0 0 0 2px rgba(255,255,255,.12)}
.phone--shot{box-shadow:0 40px 80px rgba(8,2,12,.55),inset 0 0 0 2px rgba(255,255,255,.12)}
.screen{--bg:#FFFCF8;--bg2:#F6EFE6;--bg3:#EFE6DA;--surface:#FFFFFF;--sep:#EDE3D6;--text:#2A211C;--text2:#7A6D63;--text3:#A89A8E;
  --accent:#E8553A;--subtle:rgba(232,85,58,.13);--teal:#2BA89A;--danger:#E5484D;--success:#2FB56A;--verified:#E8553A;--warning:#F2A93B;
  --onAccent:#fff;--e1:0 1px 2px rgba(60,40,20,.08);--e2:0 6px 20px rgba(60,40,20,.12);--sheet:0 20px 50px rgba(60,40,20,.22);
  --pressed:rgba(60,40,20,.06);--capsule:rgba(255,252,248,.9);--capsuleSolid:#FFFFFF;--wallpaper:linear-gradient(180deg,#FBF1E6,#F6E8D8);
  position:relative;width:390px;height:844px;border-radius:46px;overflow:hidden;background:#FFFCF8;
  color:var(--text);font-family:Inter,system-ui,sans-serif;text-align:left;pointer-events:none;user-select:none}
.screen *{-webkit-font-smoothing:antialiased}
.screen svg{display:inline}
.screen__island{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:108px;height:31px;border-radius:999px;background:#000;z-index:20}
.screen__app{position:absolute;inset:0}
.tg-scroll,.tgfeed,.tgscroll{scrollbar-width:none;-ms-overflow-style:none}
.tg-scroll::-webkit-scrollbar,.tgfeed::-webkit-scrollbar,.tgscroll::-webkit-scrollbar{display:none}
@keyframes tgPulse{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes tgTyping{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-3px);opacity:1}}
@keyframes tgWave{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}
@keyframes tgCtxIn{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes tgShimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes tgspin{to{transform:rotate(360deg)}}
@keyframes tgring{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.9);opacity:0}}
@keyframes tgbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes tgwiggle{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(9deg)}}
@keyframes tgdot{0%,100%{opacity:.35}50%{opacity:1}}

/* ---------- возможности: плитки с глянцевыми «пузырями» ---------- */
@keyframes sBob{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-8px) rotate(var(--r,0deg))}}
@keyframes sPulse{0%{box-shadow:0 0 0 0 rgba(159,229,196,.55)}100%{box-shadow:0 0 0 10px rgba(159,229,196,0)}}
.features{padding-top:clamp(56px,8vw,104px)}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:60px 18px;padding:40px 0 48px}
.tile{--tint:rgba(255,255,255,.10);--edge:rgba(255,255,255,.12);
  position:relative;display:flex;flex-direction:column;padding:62px 24px 24px;border-radius:30px;
  background:linear-gradient(180deg,var(--tint) 0%,rgba(255,255,255,.02) 78%);border:1px solid var(--edge);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 24px 50px rgba(8,2,12,.28)}
/* шахматка: чётные плитки сдвинуты вниз, высота у всех одна */
.tile:nth-child(even){top:48px}
.tile::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(320px circle at var(--cx,-999px) var(--cy,-999px),rgba(255,255,255,.12),transparent 60%)}
.tile--coral{--tint:rgba(255,122,87,.17);--edge:rgba(255,122,87,.24)}
.tile--mint{--tint:rgba(159,229,196,.14);--edge:rgba(159,229,196,.22)}
.tile--gold{--tint:rgba(255,214,107,.14);--edge:rgba(255,214,107,.22)}
.tile--pink{--tint:rgba(227,166,208,.16);--edge:rgba(227,166,208,.24)}
/* пузырь-иконка — та же глянцевая форма, что у «пузырей» фона и в логотипе */
.tile__orb{position:absolute;top:-40px;left:20px;width:84px;aspect-ratio:1.12;display:flex;align-items:center;justify-content:center;
  box-shadow:inset -8px -12px 22px rgba(20,4,24,.42),inset 7px 8px 16px rgba(255,255,255,.45),0 16px 30px rgba(8,2,12,.45);
  animation:sBob 7s ease-in-out infinite}
.tile__orb svg{width:38px;height:38px}
.tile--coral .tile__orb{--r:-6deg;border-radius:46% 46% 46% 12% / 54% 54% 54% 16%;
  background:radial-gradient(120% 120% at 28% 18%,#FFD9CB 0%,#FF6B4A 42%,#8E2238 100%)}
.tile--mint .tile__orb{--r:5deg;border-radius:46% 46% 12% 46% / 54% 54% 16% 54%;animation-delay:-2s;
  background:radial-gradient(120% 120% at 28% 18%,#EFFFF7 0%,#8FDDBB 42%,#1F5E57 100%)}
.tile--gold .tile__orb{--r:-4deg;border-radius:46% 46% 46% 12% / 54% 54% 54% 16%;animation-delay:-4s;
  background:radial-gradient(120% 120% at 28% 18%,#FFF4CF 0%,#FFC94D 42%,#9A5A1E 100%)}
.tile--pink .tile__orb{--r:6deg;border-radius:46% 46% 12% 46% / 54% 54% 16% 54%;animation-delay:-1s;
  background:radial-gradient(120% 120% at 28% 18%,#FFF0FA 0%,#E3A6D0 42%,#6A2A5C 100%)}
.tile__t{font:700 21px/1.2 Onest;letter-spacing:-.02em;margin:0}
.tile__x{flex:1;font:400 15.5px/1.55 Onest;color:var(--text3);margin:10px 0 0;text-wrap:pretty}
/* нижняя «живая» плашка у каждой плитки */
.chip{display:flex;align-items:center;gap:12px;margin-top:22px;padding:12px 14px;border-radius:18px;
  background:rgba(10,3,14,.4);border:1px solid rgba(255,255,255,.08)}
.chip__main{flex:1;min-width:0}
.chip__t{display:block;font:600 14px/1.25 Onest;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip__x{display:block;font:400 12.5px/1.3 Onest;color:#B9A6B2;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip__ava{width:38px;height:38px;flex:none;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:19px;
  background:radial-gradient(circle at 30% 25%,#FFD2C2,#FF7A57 60%,#C8374A)}
.chip__badge{min-width:22px;height:22px;padding:0 7px;flex:none;border-radius:999px;background:var(--coral);color:var(--plum);
  font:700 12px/22px Onest;text-align:center}
.chip__ring{position:relative;width:42px;height:42px;flex:none}
.chip__ring svg{width:42px;height:42px;transform:rotate(-90deg)}
.chip__ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:700 11px/1 Onest;color:var(--mint)}
.chip__live{width:10px;height:10px;flex:none;border-radius:50%;background:var(--mint);margin:0 4px;animation:sPulse 1.6s ease-out infinite}
.chip__btn{width:32px;height:32px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1)}
.chip__btn--end{background:#E5484D}

/* ---------- экраны ---------- */
.screens{padding-top:clamp(64px,9vw,120px)}
.screens .h2{margin-bottom:12px}
.screens__lede{font:400 18px/1.55 Onest;color:var(--text3);margin:0 0 clamp(28px,4vw,48px);max-width:520px;text-wrap:pretty}
.shots{display:flex;gap:clamp(18px,3vw,40px);justify-content:center;overflow-x:auto;padding:0 var(--gutter) 40px;scroll-snap-type:x mandatory;scrollbar-width:none}
.shots::-webkit-scrollbar{display:none}
.shot{flex:none;display:flex;flex-direction:column;align-items:center;gap:22px;scroll-snap-align:center;margin:0}
.shot .phone-box{--s:.72}
.shot--mid{margin-top:48px}
.shot figcaption{text-align:center;max-width:260px}
.shot__t{font:700 18px/1.2 Onest}
.shot__x{font:400 14px/1.5 Onest;color:var(--text4);margin-top:6px}

/* ---------- загрузка ---------- */
.download{padding-top:clamp(56px,8vw,104px);padding-bottom:clamp(56px,8vw,104px)}
.glass{position:relative;overflow:hidden;border-radius:36px;
  background:linear-gradient(150deg,rgba(255,255,255,.12),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 40px 80px rgba(8,2,12,.4)}
.cta{padding:clamp(36px,6vw,72px) clamp(24px,5vw,64px);text-align:center}
.cta__glow{position:absolute;top:-120px;left:50%;margin-left:-160px;width:320px;height:320px;border-radius:50%;opacity:.55;filter:blur(8px);
  background:radial-gradient(circle at 34% 30%,#FFD2C2 0%,#FF7A57 26%,#C8374A 58%,rgba(28,12,34,0) 80%)}
.cta__in{position:relative}
.cta__h{font:800 clamp(32px,5vw,58px)/1.04 Onest;letter-spacing:-.04em;margin:0 auto 16px;max-width:680px;text-wrap:balance}
.cta__p{font:400 18px/1.55 Onest;color:var(--text2);margin:0 auto;max-width:460px;text-wrap:pretty}
.cta .stores{justify-content:center}

/* ---------- футер ---------- */
.foot{border-top:1px solid rgba(255,255,255,.08)}
.foot__in{max-width:1160px;margin:0 auto;padding:28px var(--gutter);display:flex;align-items:center;gap:14px 20px;flex-wrap:wrap}
.foot__brand{font:800 16px/1 Onest;flex:1;margin:0;white-space:nowrap}
.foot__year{font:500 13px/1 Onest;color:var(--muted);margin-left:8px}
.foot a{font:500 14px/1 Onest;color:var(--text4)}
.foot a:hover,.foot a[aria-current]{color:#FFB29F}

/* ---------- документы: privacy / terms / delete ---------- */
.doc{max-width:820px;margin:0 auto;padding:clamp(40px,7vw,80px) var(--gutter) clamp(56px,8vw,104px)}
.doc__h1{font:800 clamp(38px,5.6vw,64px)/1.04 Onest;letter-spacing:-.04em;margin:22px 0 14px;text-wrap:balance}
.doc__date{font:500 14px/1.4 Onest;color:var(--muted);margin:0}
.doc__lede{font:400 clamp(17px,1.8vw,19px)/1.6 Onest;color:var(--text2);margin:18px 0 0;max-width:640px;text-wrap:pretty}
.prose{margin-top:clamp(28px,4vw,44px)}
.prose section{padding:clamp(22px,3vw,30px) 0;border-top:1px solid rgba(255,255,255,.08)}
.prose h2{font:700 clamp(22px,2.4vw,26px)/1.2 Onest;letter-spacing:-.02em;margin:0 0 14px;scroll-margin-top:90px}
.prose h3{font:650 17px/1.35 Onest;color:var(--cream);margin:22px 0 8px}
.prose p,.prose li{font:400 16px/1.7 Onest;color:var(--text2);text-wrap:pretty}
.prose p{margin:0 0 12px}
.prose ul{margin:0 0 12px;padding-left:22px}
.prose li{margin:4px 0}
.prose li::marker{color:var(--coral)}
.prose strong{color:var(--cream);font-weight:600}
.toc{margin-top:clamp(24px,3vw,32px);padding:clamp(20px,3vw,26px);border-radius:24px}
.toc__t{font:700 13px/1 Onest;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.toc ol{margin:0;padding:0;list-style:none;columns:2 260px;column-gap:28px}
.toc li{break-inside:avoid;margin:0 0 9px}
.toc a{font:500 15px/1.35 Onest;color:var(--text2)}
.toc a:hover{color:#FFB29F}
.note{margin-top:clamp(28px,4vw,40px);padding:clamp(20px,3vw,28px);border-radius:24px;font:400 16px/1.6 Onest;color:var(--text2)}
.note p{margin:0}

/* удаление аккаунта */
.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:clamp(28px,4vw,44px) 0 0;padding:0;list-style:none}
.step{display:flex;gap:16px;align-items:flex-start;padding:clamp(20px,2.6vw,26px);border-radius:24px}
.step__n{width:40px;height:40px;flex:none;border-radius:13px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 30% 25%,#FFB29F,#FF6B4A 55%,#C8374A);color:var(--plum);font:800 18px/1 Onest;
  box-shadow:0 6px 18px rgba(255,107,74,.35)}
.step__t{font:500 16px/1.55 Onest;color:var(--cream);padding-top:8px}
.step__t b{font-weight:700;color:#FFB29F}
.step--alt .step__n{background:radial-gradient(circle at 30% 25%,#E6FFF4,#9FE5C4 50%,#3E8C80);color:#12302B;box-shadow:none}
.kept{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.kept__box{padding:clamp(22px,3vw,30px);border-radius:24px}
.kept__box h2{font:700 20px/1.25 Onest;letter-spacing:-.015em;margin:0 0 12px}
.kept__box ul{margin:0;padding-left:20px}
.kept__box li{font:400 15.5px/1.6 Onest;color:var(--text2);margin:6px 0}
.kept__box li::marker{color:var(--coral)}
.kept__box--mint li::marker{color:var(--mint)}
.warn{display:flex;gap:14px;align-items:flex-start;margin-top:14px;padding:clamp(18px,2.6vw,24px);border-radius:24px;
  background:linear-gradient(160deg,rgba(255,122,87,.18),rgba(255,122,87,.05));border:1px solid rgba(255,122,87,.28);
  font:500 16px/1.55 Onest;color:var(--cream)}
.warn svg{flex:none;margin-top:2px}
.mail{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:13px 20px;border-radius:16px;
  background:var(--cream);color:var(--plum);font:700 16px/1 Onest;box-shadow:0 12px 30px rgba(0,0,0,.3);transition:all .18s}
.mail:hover{background:#fff;color:var(--plum);transform:translateY(-2px)}

/* 404 */
.lost{min-height:62vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:64px var(--gutter)}
.lost .lost__n{font:800 clamp(96px,16vw,180px)/1 Onest;letter-spacing:-.06em;margin:0}
.lost p{font:400 18px/1.55 Onest;color:var(--text2);margin:10px 0 26px}

/* ---------- адаптив ---------- */
@media (max-width:1099px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shots{justify-content:flex-start}
  .shot .phone-box{--s:.62}
}
@media (max-width:859px){
  .hero{grid-template-columns:minmax(0,1fr);text-align:center}
  .hero__lede{margin:0 auto}
  .hero .stores,.trust{justify-content:center}
  .hero__art .phone-box{--s:.72}
  .steps,.kept{grid-template-columns:minmax(0,1fr)}
  .shot--mid{margin-top:0}
}
@media (max-width:559px){
  .nav__links{display:none}
  .tiles{grid-template-columns:minmax(0,1fr);row-gap:58px;padding-bottom:0}
  .tile:nth-child(even){top:0}
  .badge{background:rgba(28,12,34,.62)} /* на узком экране под бейджем «пузырь» фона */
  .shot .phone-box{--s:.6}
}
@media (max-width:370px){
  .hero__art .phone-box{--s:.62}
  .brand__name{font-size:19px}
}

/* ---------- меньше движения ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .bg__layer,.tilt{transform:none!important}
}