/* Tilda-ready: тёмная тема, неоновые градиенты, пузыри в hero — шрифты через Google Fonts в HTML */

:root{
  --bg-deep:#06060a;
  --bg-mid:#0c0e14;
  --bg-card:rgba(255,255,255,.04);
  --accent-cyan:#22d3ee;
  --accent-violet:#a78bfa;
  --accent-fuchsia:#e879f9;
  --accent-blue:#3b82f6;
  --text:#f4f4f8;
  --muted:rgba(255,255,255,.68);

  --border:rgba(255,255,255,.1);
  --shadow:0 24px 80px rgba(0,0,0,.55);
  --shadow-glow:0 0 80px rgba(167,139,250,.18);

  --radius-lg:28px;
  --radius-md:18px;

  --font-display:"Unbounded",system-ui,sans-serif;
  --font-heading:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-body:"Mulish",system-ui,sans-serif;

  --cta-font-size:18px;
  --header-h:94px;
}

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

html,body{ min-height:100%; }

body{
  margin:0;
  padding-top:var(--header-h);
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg-deep);
  background-image:
    radial-gradient(ellipse 900px 500px at 20% -10%, rgba(99,102,241,.12), transparent),
    radial-gradient(ellipse 800px 400px at 95% 30%, rgba(236,72,153,.08), transparent),
    radial-gradient(ellipse 700px 500px at 50% 100%, rgba(34,211,238,.06), transparent);
}

body:not(.is-loaded){
  overflow:hidden;
}

/* скелетон при первой загрузке (два оттенка серого) */
.page-loader{
  --sk-grey-a:#2c2c34;
  --sk-grey-b:#3e3e48;
  position:fixed;
  inset:0;
  z-index:200000;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:calc(var(--header-h) + 12px) 18px 24px;
  background:#0b0b0f;
  transition:opacity .45s ease, visibility .45s ease;
}
body.is-loaded .page-loader{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.page-loader-inner{
  width:min(1200px, 100%);
  display:flex;
  flex-direction:column;
  gap:28px;
}

.sk-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  min-height:42px;
}
.sk-logo{
  width:min(168px, 38vw);
  height:35px;
  border-radius:12px;
}
.sk-nav{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  flex:1;
  justify-content:center;
}
.sk-pill{
  width:72px;
  height:27px;
  border-radius:999px;
}
.sk-social{
  display:flex;
  gap:10px;
}
.sk-icon{
  width:30px;
  height:30px;
  border-radius:12px;
}

.sk-hero{
  display:grid;
  grid-template-columns:1fr min(200px, 28vw);
  gap:20px;
  align-items:start;
  min-height:min(42vh, 360px);
}
@media (max-width:700px){
  .sk-hero{ grid-template-columns:1fr; }
  .sk-hero-side{ display:none; }
}
.sk-hero-main{
  display:flex;
  flex-direction:column;
  gap:14px;
  align-items:flex-start;
}
.sk-line{
  display:block;
  border-radius:10px;
  max-width:100%;
}
.sk-line--xl{ width:min(92%, 520px); height:clamp(36px, 8vw, 56px); border-radius:14px; }
.sk-line--lg{ width:min(70%, 400px); height:clamp(28px, 6vw, 44px); border-radius:12px; }
.sk-line--md{ width:min(55%, 320px); height:18px; }
.sk-line--sm{ width:min(48%, 280px); height:14px; }
.sk-line--wide{ width:100%; height:12px; border-radius:6px; }

.sk-block{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  border-radius:16px;
  max-height:200px;
}

.sk-row{
  display:flex;
  gap:14px;
  overflow:hidden;
  padding-bottom:8px;
}
.sk-card{
  flex:0 0 min(300px, 78vw);
  height:140px;
  border-radius:18px;
}

.sk-footer{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-top:8px;
}

.sk-bone{
  animation:sk-breathe 1.15s ease-in-out infinite;
}
.sk-bone--a{
  background:var(--sk-grey-a);
}
.sk-bone--b{
  background:var(--sk-grey-b);
  animation-delay:.18s;
}

@keyframes sk-breathe{
  0%,100%{ opacity:1; filter:brightness(1); }
  50%{ opacity:.72; filter:brightness(1.08); }
}

@media (prefers-reduced-motion:reduce){
  .sk-bone{ animation:none; }
  .page-loader{ transition:none; }
  body:not(.is-loaded){ overflow:auto; }
}

a{ color:inherit; text-decoration:none; }
a:visited{ color:inherit; }

/* Шапка и футер: нейтральный белый текст ссылок и иконок (перебивает глобальные стили / Tilda) */
.site-header .nav-pills a,
.site-header .nav-pills a:link,
.site-header .nav-pills a:visited,
.site-header .nav-pills a:hover,
.site-header .nav-pills a:active{
  color:#f4f4f8 !important;
}
.site-header a.social.social-icon,
.site-header a.social.social-icon:link,
.site-header a.social.social-icon:visited,
.site-header a.social.social-icon:hover,
.site-header a.social.social-icon:active{
  color:#ffffff !important;
}
.site-header .social-svg path{
  fill:#ffffff !important;
}
.site-footer .footer-nav a,
.site-footer .footer-nav a:link,
.site-footer .footer-nav a:visited,
.site-footer .footer-nav a:hover,
.site-footer .footer-nav a:active{
  color:rgba(244,244,248,.9) !important;
}
.site-footer a.social.social-icon,
.site-footer a.social.social-icon:link,
.site-footer a.social.social-icon:visited,
.site-footer a.social.social-icon:hover,
.site-footer a.social.social-icon:active{
  color:#ffffff !important;
}
.site-footer .social-svg path{
  fill:#ffffff !important;
}
img{ max-width:100%; display:block; }

.container{
  width:min(1120px, 100%);
  margin:0 auto;
  padding:0 22px;
}
.container-wide{ width:min(1320px, 100%); }
.container-text{ width:min(920px, 100%); }
.container-narrow{ width:min(720px, 100%); }

/* ——— scroll progress ——— */
.scroll-progress{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:3px;
  z-index:10001;
  background:rgba(0,0,0,.35);
  pointer-events:none;
}
.scroll-progress-bar{
  height:100%;
  width:0%;
  background:linear-gradient(90deg, var(--accent-cyan), var(--accent-violet), var(--accent-fuchsia));
  box-shadow:0 0 20px rgba(34,211,238,.4);
  transition:width .12s ease-out;
}
.scroll-progress-label{
  position:fixed;
  top:calc(var(--header-h) + 8px);
  right:16px;
  z-index:10000;
  padding:6px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  color:rgba(226,232,240,.95);
  background:rgba(8,8,12,.65);
  border:1px solid var(--border);
  backdrop-filter:blur(10px);
  pointer-events:none;
  font-family:var(--font-body);
}

.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.skip-link:focus{
  left:16px;
  top:calc(var(--header-h) + 8px);
  width:auto;
  height:auto;
  z-index:10002;
  padding:10px 14px;
  border-radius:12px;
  background:var(--bg-mid);
  border:1px solid var(--border);
  color:var(--text);
}

/* ——— header ——— */
.site-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:9999;
  min-height:var(--header-h);
  height:auto;
  padding:8px 0;
  display:flex;
  align-items:center;
  background:rgba(6,6,10,.72);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
}
.site-header .container,
.site-header .container-wide{ width:100%; max-width:100%; }
.site-header .nav{ padding:0; }

.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.nav-minimal{
  flex-wrap:wrap;
  row-gap:10px;
}

.brand{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
}
.brand-compact .brand-title span{ display:none; }

.brand-badge{
  width:40px;
  height:40px;
  border-radius:14px;
  background:linear-gradient(135deg, var(--accent-cyan), var(--accent-violet) 55%, var(--accent-fuchsia));
  box-shadow:0 12px 36px rgba(167,139,250,.35);
  border:1px solid rgba(255,255,255,.2);
  flex-shrink:0;
}

.brand-title{
  display:flex;
  flex-direction:column;
  line-height:1.1;
}
.brand-title strong{
  font-family:var(--font-heading);
  font-size:15px;
  font-weight:800;
  letter-spacing:-.02em;
}

.nav-pills{
  display:flex;
  align-items:stretch;
  gap:clamp(8px, 1.4vw, 16px);
  flex-wrap:wrap;
  justify-content:center;
  flex:1;
  min-width:0;
}
.nav-pills a{
  flex:1 1 auto;
  min-width:min(120px, 28vw);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:clamp(11px, 1.3vw, 15px) clamp(16px, 2.4vw, 28px);
  border-radius:999px;
  font-size:clamp(13px, 1.05vw, 16px);
  font-weight:700;
  color:#f4f4f8;
  border:1px solid transparent;
  background:rgba(255,255,255,.06);
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.nav-pills a:visited{ color:#f4f4f8; }
.nav-pills a:hover{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.14);
  transform:translateY(-1px);
}

.social-row-header{
  flex-shrink:0;
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.social-row-header .social{
  width:clamp(34px, 4.2vw, 48px);
  height:clamp(34px, 4.2vw, 48px);
  border-radius:14px;
  flex-shrink:0;
}
.social-row-header .social-svg{
  width:clamp(18px, 2.2vw, 24px);
  height:clamp(18px, 2.2vw, 24px);
}
.social-row-header .social:hover{
  transform:translateY(-2px);
}

.brand-logo-only{
  display:flex;
  align-items:center;
  min-height:35px;
}
.brand-logo-img{
  display:block;
  height:35px;
  width:auto;
  max-width:min(200px, 42vw);
  object-fit:contain;
  flex-shrink:0;
}
img.brand-logo-img{
  border-radius:10px;
}

.social{
  width:34px;
  height:34px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  display:grid;
  place-items:center;
  transition:transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.social:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.1);
  box-shadow:0 12px 32px rgba(0,0,0,.35);
}

.social-icon{ color:#ffffff; }
a.social.social-icon,
a.social.social-icon:visited{
  color:#ffffff;
}
.social-svg{
  width:22px;
  height:22px;
  display:block;
}
.social-svg path,
.social-svg circle,
.social-svg rect[fill="currentColor"]{
  fill:currentColor;
}
.social-max-brand .social-svg{
  width:clamp(20px, 2.4vw, 26px);
  height:clamp(20px, 2.4vw, 26px);
}

/* ——— hero fullscreen + bubbles ——— */
.hero-full{
  position:relative;
  margin-top:calc(-1 * var(--header-h));
  padding-top:calc(var(--header-h) + clamp(32px, 6vw, 72px));
  padding-bottom:clamp(28px, 5vw, 48px);
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  isolation:isolate;
}

.hero-full-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 100% 80% at 50% 100%, rgba(34,211,238,.07), transparent 55%),
    radial-gradient(ellipse 70% 50% at 0% 40%, rgba(167,139,250,.1), transparent 50%),
    radial-gradient(ellipse 60% 45% at 100% 20%, rgba(236,72,153,.08), transparent 50%),
    linear-gradient(180deg, rgba(5,5,8,.9) 0%, rgba(10,11,18,.82) 45%, rgba(8,9,16,.92) 100%),
    url("https://optim.tildacdn.com/tild6338-3635-4837-b337-303239356232/-/format/webp/hero.png.webp") center / cover no-repeat;
  z-index:0;
}

.bubble-field{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}

.bubble{
  position:absolute;
  border-radius:50%;
  background:
    radial-gradient(circle at 32% 28%, rgba(255,255,255,.5), transparent 45%),
    linear-gradient(145deg, rgba(34,211,238,.55), rgba(59,130,246,.45), rgba(167,139,250,.5));
  box-shadow:
    inset 0 -20px 50px rgba(0,0,0,.15),
    inset 0 0 40px rgba(255,255,255,.08),
    0 0 60px rgba(99,102,241,.2);
  opacity:.88;
  filter:blur(0.5px);
  animation:bubble-drift var(--dur, 22s) ease-in-out infinite;
  animation-delay:var(--delay, 0s);
}

@keyframes bubble-drift{
  0%,100%{ transform:translate(0,0) scale(1); }
  25%{ transform:translate(var(--mx1,12px), var(--my1,-18px)) scale(1.04); }
  50%{ transform:translate(var(--mx2,-16px), var(--my2,10px)) scale(.97); }
  75%{ transform:translate(var(--mx3,8px), var(--my3,14px)) scale(1.02); }
}

/* фоновые пузыри — позиции и размеры */
.b1{ width:min(42vw, 380px); height:min(42vw, 380px); left:-8%; top:8%; --dur:26s; --delay:-2s; --mx1:18px; --my1:-24px; --mx2:-22px; --my2:16px; --mx3:10px; --my3:20px; }
.b2{ width:180px; height:180px; left:62%; top:4%; --dur:19s; --delay:-1s; opacity:.65; }
.b3{ width:120px; height:120px; left:48%; top:22%; --dur:16s; --delay:-3s; }
.b4{ width:min(28vw, 260px); height:min(28vw, 260px); right:-5%; top:38%; --dur:24s; }
.b5{ width:90px; height:90px; left:8%; top:52%; --dur:14s; }
.b6{ width:220px; height:220px; left:25%; bottom:-5%; --dur:28s; opacity:.55; }
.b7{ width:140px; height:140px; right:18%; bottom:18%; --dur:20s; }
.b8{ width:70px; height:70px; left:72%; top:48%; --dur:12s; }
.b9{ width:min(22vw, 200px); height:min(22vw, 200px); left:40%; bottom:12%; --dur:21s; }
.b10{ width:100px; height:100px; right:35%; top:28%; --dur:17s; opacity:.7; }
.b11{ width:160px; height:160px; left:-3%; bottom:25%; --dur:23s; }
.b12{ width:55px; height:55px; right:8%; top:55%; --dur:11s; }
.b13{ width:min(35vw, 300px); height:min(35vw, 300px); left:calc(50% - min(17.5vw, 150px)); top:55%; --dur:30s; opacity:.4; }
.b14{ width:85px; height:85px; left:15%; top:30%; --dur:15s; }
.b15{ width:130px; height:130px; right:42%; bottom:8%; --dur:18s; }
.b16{ width:200px; height:200px; left:78%; top:12%; --dur:25s; opacity:.5; }
.b17{ width:95px; height:95px; left:35%; top:8%; --dur:13s; }
.b18{ width:min(18vw, 160px); height:min(18vw, 160px); right:25%; bottom:35%; --dur:19s; }

/* передний слой пузырей — перекрывает часть текста */
.bubble-field-front{
  z-index:15;
}
.bubble-field-front .bubble{
  mix-blend-mode:normal;
  opacity:.92;
  filter:blur(0px);
  box-shadow:
    inset 0 0 50px rgba(255,255,255,.12),
    0 0 80px rgba(34,211,238,.15);
}

.bf1{ width:min(38vw, 340px); height:min(38vw, 340px); left:18%; top:22%; --dur:20s; }
.bf2{ width:min(30vw, 280px); height:min(30vw, 280px); right:10%; top:18%; --dur:24s; --delay:-4s; }
.bf3{ width:200px; height:200px; left:calc(50% - 100px); top:35%; --dur:18s; opacity:.85; }
.bf4{ width:140px; height:140px; left:5%; top:38%; --dur:16s; }
.bf5{ width:min(25vw, 220px); height:min(25vw, 220px); right:20%; bottom:28%; --dur:22s; }
.bf6{ width:110px; height:110px; left:55%; bottom:22%; --dur:14s; }
.bf7{ width:180px; height:180px; left:28%; top:48%; --dur:21s; opacity:.75; }
.bf8{ width:90px; height:90px; right:6%; top:42%; --dur:13s; }

/* типографика hero */
.hero-typography{
  position:relative;
  z-index:5;
  width:100%;
  max-width:min(1320px, 100%);
  margin:0 auto;
  padding:clamp(8px, 2vh, 28px) clamp(16px, 4vw, 40px) clamp(72px, 12vh, 120px);
  min-height:clamp(480px, 86vh, 820px);
  pointer-events:none;
}

.hero-typography a{ pointer-events:auto; }

.hero-mega{
  margin:0;
  padding:0;
  position:absolute;
  left:50%;
  top:42%;
  transform:translate(-50%, -50%);
  width:min(96vw, 1100px);
  text-align:center;
  line-height:.88;
  z-index:8;
  pointer-events:none;
}

.hero-line{
  display:block;
  font-family:var(--font-display);
  font-weight:900;
  letter-spacing:-0.04em;
  text-transform:lowercase;
  color:rgba(255,255,255,.96);
  text-shadow:0 4px 80px rgba(0,0,0,.45), 0 0 60px rgba(167,139,250,.15);
}

.hero-line-1{
  font-size:clamp(42px, 11vw, 132px);
  background:linear-gradient(120deg, #fff 0%, rgba(224,231,255,.95) 40%, var(--accent-cyan) 85%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}

.hero-line-2{
  font-size:clamp(32px, 8.5vw, 96px);
  margin-top:.06em;
  color:rgba(255,255,255,.72);
}

.hero-fragment{
  position:absolute;
  font-family:var(--font-body);
  font-size:clamp(12px, 1.45vw, 15px);
  font-weight:600;
  line-height:1.45;
  max-width:min(220px, 40vw);
  color:rgba(244,244,248,.58);
  z-index:5;
  text-shadow:0 2px 18px rgba(0,0,0,.6);
  pointer-events:none;
}

/* Четыре угла «кольца» вокруг центрального заголовка — без наслоений друг на друга */
.hero-frag-a{
  top:clamp(16px, 5vh, 52px);
  left:clamp(8px, 3vw, 48px);
  right:auto;
  bottom:auto;
  transform:rotate(-2.2deg);
  max-width:min(200px, 42vw);
  text-align:left;
}
.hero-frag-b{
  top:clamp(16px, 5vh, 52px);
  right:clamp(8px, 3vw, 48px);
  left:auto;
  bottom:auto;
  transform:rotate(1.6deg);
  max-width:min(220px, 42vw);
  text-align:right;
}
.hero-frag-c{
  bottom:clamp(96px, 17vh, 168px);
  left:clamp(8px, 3vw, 52px);
  top:auto;
  right:auto;
  transform:rotate(-1deg);
  max-width:min(210px, 40vw);
  text-align:left;
}
.hero-frag-d{
  bottom:clamp(96px, 17vh, 168px);
  right:clamp(8px, 3vw, 52px);
  left:auto;
  top:auto;
  transform:rotate(2.1deg);
  max-width:min(230px, 42vw);
  text-align:right;
}

@media (max-width:640px){
  .hero-typography{ min-height:clamp(440px, 78vh, 680px); }
  .hero-frag-a{ max-width:min(180px, 46vw); }
  .hero-frag-b{
    top:clamp(72px, 13vh, 108px);
    right:clamp(6px, 2.5vw, 24px);
    text-align:left;
  }
  .hero-frag-c{ bottom:clamp(120px, 22vh, 200px); }
  .hero-frag-d{
    bottom:clamp(72px, 14vh, 120px);
    text-align:left;
  }
}

.hero-full-bottom{
  position:relative;
  z-index:25;
  padding:0 clamp(16px, 4vw, 40px) 8px;
  pointer-events:none;
}
.hero-full-bottom *{ pointer-events:auto; }

.hero-full-bottom a.cta-glass,
.hero-full-bottom a.cta-glass:link,
.hero-full-bottom a.cta-glass:visited,
.hero-full-bottom a.cta-glass:hover,
.hero-full-bottom a.cta-glass:active{
  color:#ffffff !important;
}

.hero-cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  justify-content:center;
  align-items:center;
}

.cta{
  font-size:var(--cta-font-size);
  padding:15px 26px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  font-family:var(--font-body);
  font-weight:700;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  user-select:none;
}

.cta-telegram{
  background:linear-gradient(135deg, #5eead4 0%, #22d3ee 28%, #0ea5e9 55%, #2563eb 100%);
  color:#ffffff !important;
  font-weight:800;
  font-size:clamp(17px, 1.2vw, 20px);
  padding:16px 30px;
  border:2px solid rgba(255,255,255,.45);
  box-shadow:
    0 0 0 1px rgba(34,211,238,.6),
    0 12px 40px rgba(14,165,233,.45),
    0 24px 64px rgba(37,99,235,.4);
  text-shadow:0 1px 3px rgba(0,0,0,.45);
  letter-spacing:.02em;
}
.cta-telegram:visited{ color:#ffffff !important; }
.cta-telegram:hover{
  transform:translateY(-3px) scale(1.02);
  filter:brightness(1.08) saturate(1.08);
  box-shadow:
    0 0 0 2px rgba(255,255,255,.35),
    0 16px 48px rgba(34,211,238,.55),
    0 28px 72px rgba(37,99,235,.45);
}
.cta-telegram:active{
  transform:translateY(-1px) scale(1.01);
}

.cta-glass{
  background:rgba(255,255,255,.06);
  color:#ffffff !important;
  backdrop-filter:blur(12px);
  border-color:rgba(255,255,255,.2);
}
.cta-glass:link,
.cta-glass:visited,
.cta-glass:hover,
.cta-glass:active{
  color:#ffffff !important;
}
/* Вторичная кнопка (напр. «Цены» в блоге) — без лососевого :visited */
.cta.secondary,
.cta.secondary:link,
.cta.secondary:visited,
.cta.secondary:hover,
.cta.secondary:active{
  background:rgba(255,255,255,.08);
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(10px);
}
.cta.secondary:hover{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.28);
}
.cta-glass:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.12);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}

.cta:active{ transform:translateY(0) scale(.98); }

.cta-telegram-lg{
  font-size:clamp(18px, 1.35vw, 22px) !important;
  padding:18px 34px !important;
}

.cta:focus-visible{
  outline:2px solid var(--accent-cyan);
  outline-offset:3px;
}

/* мостик hero → о компании */
.hero-about-bridge{
  height:clamp(48px, 8vh, 100px);
  background:linear-gradient(180deg, transparent, rgba(12,14,20,.85));
  margin-top:-1px;
}

/* секции */
.section{
  padding:clamp(48px, 8vw, 120px) 0;
}
.section-spacious{
  padding:clamp(64px, 10vw, 140px) 0;
}

.section-tint{
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.section-about-flow{
  padding-top:clamp(32px, 6vw, 72px);
  background:linear-gradient(180deg, rgba(12,14,20,.95) 0%, var(--bg-deep) 100%);
}

.section-intro{
  margin-bottom:clamp(28px, 5vw, 48px);
}
.section-h2{
  margin:0 0 12px;
  font-family:var(--font-heading);
  font-size:clamp(26px, 4vw, 42px);
  font-weight:800;
  letter-spacing:-.03em;
}
.section-lead{
  margin:0;
  font-size:clamp(15px, 1.8vw, 18px);
  line-height:1.6;
  color:var(--muted);
  max-width:62ch;
}

.about-columns{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:clamp(18px, 3vw, 28px);
}
@media (max-width:800px){
  .about-columns{ grid-template-columns:1fr; }
}

.about-card{
  padding:clamp(22px, 4vw, 32px);
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  background:linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  box-shadow:var(--shadow-glow);
}
.about-two-col{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:clamp(24px, 4vw, 40px);
  align-items:start;
}
.about-two-col .about-col{
  display:flex;
  flex-direction:column;
  gap:clamp(14px, 2.5vw, 20px);
}
.about-two-col p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
  font-size:clamp(15px, 1.6vw, 17px);
}
.about-two-col h3{
  margin:0 0 10px;
  font-family:var(--font-heading);
  font-size:clamp(18px, 2.2vw, 22px);
  font-weight:800;
  color:rgba(255,255,255,.95);
}
.about-two-col ul{
  margin:0;
  padding-left:1.2em;
  color:var(--muted);
  line-height:1.65;
  font-size:15px;
}
.about-two-col li{ margin:8px 0; }

@media (max-width:720px){
  .about-two-col{ grid-template-columns:1fr; }
}

.about-card h3{
  margin:0 0 10px;
  font-family:var(--font-heading);
  font-size:clamp(17px, 2vw, 20px);
  font-weight:800;
}
.about-card p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
  font-size:15px;
}

/* горизонтальные карусели */
.h-scroll-shell{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:stretch;
}
@media (max-width:520px){
  .h-scroll-shell{ grid-template-columns:1fr; }
  .h-scroll-btn{ display:none; }
}

.h-scroll-btn{
  width:48px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  color:var(--text);
  font-size:28px;
  line-height:1;
  cursor:pointer;
  transition:background .2s ease, transform .2s ease;
  align-self:center;
}
.h-scroll-btn:hover{
  background:rgba(255,255,255,.12);
  transform:scale(1.04);
}

.h-scroll{
  display:flex;
  gap:clamp(16px, 2.5vw, 22px);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:8px 4px 20px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(167,139,250,.4) transparent;
}
.h-scroll::-webkit-scrollbar{ height:6px; }
.h-scroll::-webkit-scrollbar-thumb{
  background:rgba(167,139,250,.35);
  border-radius:999px;
}

.h-scroll-card{
  flex:0 0 min(340px, 82vw);
  scroll-snap-align:start;
}

.price-card{
  padding:clamp(22px, 3vw, 28px);
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  background:linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  min-height:100%;
}
.price-card-featured{
  border-color:rgba(167,139,250,.45);
  box-shadow:0 0 0 1px rgba(167,139,250,.12), var(--shadow-glow);
}
.price-badge{
  display:inline-flex;
  padding:6px 12px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:linear-gradient(135deg, rgba(34,211,238,.2), rgba(167,139,250,.25));
  border:1px solid rgba(255,255,255,.12);
  margin-bottom:12px;
}
.price-card h3{
  margin:0 0 8px;
  font-family:var(--font-heading);
  font-size:20px;
  font-weight:800;
}
.price-sum{
  margin:0 0 8px;
  font-family:var(--font-heading);
  font-size:clamp(26px, 4vw, 32px);
  font-weight:900;
  letter-spacing:-.03em;
}
.price-period{ font-size:15px; font-weight:600; opacity:.85; }
.price-note{ margin:0 0 12px; color:var(--muted); line-height:1.5; font-size:14px; }
.price-thesis{
  margin:0 0 14px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:13px;
  line-height:1.55;
  color:rgba(244,244,248,.58);
}
.price-list{
  margin:0;
  padding-left:1.15em;
  color:var(--muted);
  line-height:1.55;
  font-size:14px;
}
.price-list li{ margin:6px 0; }

.journey-card{
  padding:clamp(24px, 3vw, 32px);
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}
.journey-card .journey-num{
  display:inline-grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:16px;
  font-family:var(--font-heading);
  font-weight:900;
  font-size:20px;
  margin-bottom:14px;
  background:linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
  border:1px solid rgba(255,255,255,.2);
}
.journey-card h3{
  margin:0 0 10px;
  font-family:var(--font-heading);
  font-size:18px;
  font-weight:800;
}
.journey-card p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
  font-size:15px;
}

.what-card{
  padding:clamp(22px, 3vw, 28px);
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  background:linear-gradient(135deg, rgba(167,139,250,.08), rgba(34,211,238,.05));
  display:flex;
  gap:14px;
  align-items:flex-start;
  min-height:100%;
}
.what-marker{
  flex-shrink:0;
  width:10px;
  height:10px;
  margin-top:7px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
  box-shadow:0 0 14px rgba(34,211,238,.35);
}
.what-card p{
  margin:0;
  font-size:15px;
  line-height:1.55;
  color:rgba(255,255,255,.88);
}

.section-cta-center{
  display:flex;
  justify-content:center;
  margin-top:clamp(24px, 4vw, 40px);
}

/* FAQ */
.faq{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.faq-item{
  border-radius:var(--radius-md);
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  overflow:hidden;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.faq-item.is-open{
  border-color:rgba(167,139,250,.35);
  box-shadow:0 12px 40px rgba(0,0,0,.25);
}

.faq-q{
  width:100%;
  text-align:left;
  border:0;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  padding:18px 20px;
  font-size:16px;
  font-family:var(--font-body);
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.faq-toggle{
  flex-shrink:0;
  width:32px;
  height:32px;
  border-radius:10px;
  display:grid;
  place-items:center;
  font-size:22px;
  font-weight:400;
  line-height:1;
  color:var(--accent-cyan);
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  transition:transform .35s cubic-bezier(.34,1.56,.64,1), background .25s ease;
}
.faq-item.is-open .faq-toggle{
  transform:rotate(45deg);
  background:rgba(167,139,250,.15);
}

.faq-a{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .45s cubic-bezier(.4,0,.2,1);
}
.faq-item.is-open .faq-a{
  grid-template-rows:1fr;
}
.faq-a-inner{
  overflow:hidden;
  padding:0 20px;
  color:var(--muted);
  line-height:1.65;
  font-size:15px;
  border-top:1px solid transparent;
}
.faq-item.is-open .faq-a-inner{
  padding-bottom:20px;
  padding-top:4px;
  border-top-color:rgba(255,255,255,.06);
}

/* telegram block */
.section-telegram{
  padding-bottom:clamp(64px, 10vw, 120px);
}
.telegram-panel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  flex-wrap:wrap;
  padding:clamp(24px, 4vw, 36px);
  border-radius:var(--radius-lg);
  border:1px solid rgba(167,139,250,.25);
  background:linear-gradient(135deg, rgba(34,211,238,.1), rgba(167,139,250,.12), rgba(236,72,153,.08));
  box-shadow:var(--shadow);
}
.telegram-title{
  margin:0 0 10px;
  font-family:var(--font-heading);
  font-size:clamp(22px, 3.2vw, 32px);
  font-weight:800;
}
.telegram-text{
  margin:0;
  max-width:58ch;
  color:var(--muted);
  line-height:1.6;
}
.telegram-actions{
  flex-shrink:0;
  margin-top:clamp(12px, 2vw, 18px);
}
@media (min-width:720px){
  .telegram-actions{ margin-top:0; }
}

/* footer */
.site-footer{
  padding:clamp(40px, 6vw, 72px) 0 clamp(48px, 8vw, 88px);
  color:var(--muted);
  font-size:14px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.1fr 1fr 1fr .85fr;
  gap:clamp(22px, 4vw, 36px);
  border-top:1px solid var(--border);
  padding-top:clamp(28px, 4vw, 40px);
}
@media (max-width:900px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:520px){
  .footer-grid{ grid-template-columns:1fr; }
}
.footer-brand{
  font-family:var(--font-heading);
  font-weight:800;
  font-size:17px;
  color:var(--text);
  margin-bottom:8px;
}
.footer-tagline{
  margin:0 0 14px;
  line-height:1.5;
  max-width:40ch;
}
.footer-copy{ margin:0; font-size:13px; }
.footer-legal{
  margin:0;
  font-size:12px;
  line-height:1.55;
  color:rgba(232,234,239,.58);
  max-width:42ch;
}
.footer-legal strong{
  color:rgba(232,234,239,.78);
  font-weight:700;
}
.footer-heading{
  font-size:12px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.75);
  margin-bottom:12px;
}
.footer-nav{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.footer-nav a{
  color:rgba(244,244,248,.88);
  transition:color .2s ease, transform .2s ease;
}
.footer-nav a:visited{ color:rgba(244,244,248,.88); }
.footer-nav a:hover{
  color:#ffffff;
  transform:translateX(3px);
}
.footer-social{ display:flex; flex-wrap:wrap; gap:10px; }
.footer-social-btn{ width:48px; height:48px; }

/* ——— blog & legacy (blog.html, формы) ——— */
.blog-hero{ padding:clamp(24px, 4vw, 40px) 0 12px; }
.blog-hero .hero-left > p{
  margin-bottom:clamp(18px, 3.5vw, 26px);
}
.blog-hero .cta-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin-top:clamp(10px, 2.5vw, 18px);
  padding-top:clamp(6px, 1.5vw, 12px);
  clear:both;
}
.blog-hero .cta-row .cta{
  flex:0 1 auto;
  max-width:100%;
}
@media (max-width:640px){
  .blog-hero .cta-row{
    flex-direction:column;
    align-items:stretch;
  }
  .blog-hero .cta-row .cta{
    width:100%;
    justify-content:center;
    text-align:center;
  }
}
.sidebar a.text-link,
.sidebar a.text-link:link,
.sidebar a.text-link:visited,
.sidebar a.text-link:hover,
.sidebar a.text-link:active{
  color:#ffffff !important;
}
.blog-hero h1{
  font-family:var(--font-heading);
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1.08;
  font-size:clamp(26px, 4vw, 40px);
}
.blog-grid{
  display:grid;
  grid-template-columns:1fr 360px;
  gap:18px;
  align-items:start;
}
@media (max-width:980px){ .blog-grid{ grid-template-columns:1fr; } }

.sidebar{ padding:20px; }
.sidebar .pill{
  display:inline-flex;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  font-size:14px;
  font-weight:600;
}

.posts{ display:grid; gap:16px; }

.post{
  padding:20px;
  border-radius:var(--radius-md);
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  display:grid;
  grid-template-columns:170px 1fr;
  gap:16px;
}
@media (max-width:720px){ .post{ grid-template-columns:1fr; } }

.post-thumb{
  border-radius:16px;
  border:1px solid var(--border);
  height:130px;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}
.post-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.post-thumb svg{
  width:100%;
  height:100%;
  display:block;
}

.post h3{
  margin:6px 0 10px;
  font-family:var(--font-heading);
  font-size:18px;
  font-weight:800;
}
.post p{
  margin:0 0 14px;
  color:var(--muted);
  line-height:1.55;
}

.post-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.text-link{
  padding:10px 14px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  font-size:15px;
  font-weight:600;
  color:#f4f4f8;
  transition:transform .18s ease, background .18s ease;
}
.text-link:visited{ color:#f4f4f8; }
.text-link:link,
.text-link:active{
  color:#f4f4f8;
}
.text-link:hover{
  color:#ffffff;
  transform:translateY(-2px);
  background:rgba(255,255,255,.1);
}
.post-actions a.text-link,
.post-actions a.text-link:visited,
.post-actions a.text-link:hover{
  color:#ffffff !important;
}

.hero-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
}
@media (max-width:980px){ .hero-grid{ grid-template-columns:1fr; } }

.panel{
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  overflow:hidden;
}

.hero-left{ padding:28px; position:relative; }
.hero-right{ padding:18px; display:flex; flex-direction:column; gap:12px; }

.hero-image{
  border-radius:18px;
  border:1px solid var(--border);
  min-height:240px;
  position:relative;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}
.hero-image img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.glow{
  position:absolute;
  inset:auto -100px -120px -120px;
  height:260px;
  background:radial-gradient(circle at 30% 30%, rgba(167,139,250,.4), transparent 60%);
  filter:blur(16px);
  pointer-events:none;
}

.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  font-size:14px;
}
.kdot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
}

.mini-cards{ display:grid; gap:12px; }
.mini{
  padding:14px;
  border-radius:18px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}
.mini span{ display:block; margin-top:6px; color:var(--muted); font-size:14px; }

.grid-2{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}
@media (max-width:980px){ .grid-2{ grid-template-columns:1fr; } }

.grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
@media (max-width:980px){ .grid-3{ grid-template-columns:1fr; } }

.card{
  padding:20px;
  border-radius:var(--radius-md);
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}

.form{ display:grid; gap:10px; }
.field{ display:grid; gap:6px; }
.field label{ font-size:14px; color:rgba(255,255,255,.85); }
.input, textarea{
  width:100%;
  padding:14px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(0,0,0,.25);
  color:var(--text);
  font-family:var(--font-body);
  font-size:15px;
  outline:none;
}
.input:focus, textarea:focus{
  border-color:rgba(167,139,250,.45);
  box-shadow:0 0 0 3px rgba(167,139,250,.15);
}
textarea{ resize:vertical; min-height:120px; }

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  border:0;
}

.footer{ padding:32px 0 48px; }
.footer-bar{
  border-top:1px solid var(--border);
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}

.avatar-split{
  display:grid;
  grid-template-columns:1fr min(420px, 46vw);
  gap:clamp(24px, 5vw, 48px);
  align-items:center;
  margin-top:clamp(20px, 4vw, 36px);
}
@media (max-width:900px){
  .avatar-split{ grid-template-columns:1fr; }
  .avatar-photo{ order:-1; max-width:min(520px, 100%); margin:0 auto; }
}
.avatar-photo{
  margin:0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  background:rgba(0,0,0,.2);
}
.avatar-photo img{
  display:block;
  width:100%;
  height:auto;
}
.avatar-copy .avatar-kicker{
  font-family:var(--font-heading);
  font-weight:800;
  font-size:clamp(18px, 2.4vw, 24px);
  line-height:1.25;
  margin:0 0 14px;
  color:rgba(255,255,255,.94);
}
.avatar-copy p{
  margin:0 0 14px;
  color:var(--muted);
  line-height:1.65;
  font-size:15px;
}
.avatar-copy p:last-child{ margin-bottom:0; }

@media (max-width:640px){
  /* Высота шапки ~−35% к прежним ~96px → ~62px + отступы */
  :root{ --header-h: 62px; }
  .site-header{ padding:5px 0; }
  .site-header .container{
    padding-left:max(12px, env(safe-area-inset-left, 0px));
    padding-right:max(12px, env(safe-area-inset-right, 0px));
  }
  .hero-fragment{ font-size:12px; max-width:min(300px, 90vw); }

  .site-header .nav.nav-minimal{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .nav-minimal{
    flex-wrap:nowrap;
    align-items:center;
    gap:6px;
    row-gap:0;
  }
  .brand-logo-only{
    min-height:0;
    flex:0 0 auto;
    flex-shrink:0;
    max-width:min(72px, 19vw);
  }
  .brand-logo-img{
    height:24px;
    max-width:min(72px, 19vw);
    width:auto;
  }

  .nav-pills{
    order:0;
    flex:1 1 0;
    min-width:0;
    width:auto;
    max-width:none;
    flex-wrap:nowrap;
    justify-content:flex-start;
    gap:5px;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    padding:2px 2px 2px 0;
    margin-right:2px;
  }
  .nav-pills::-webkit-scrollbar{ display:none; height:0; }

  .nav-pills a{
    flex:0 0 auto;
    min-width:unset;
    padding:5px 8px;
    font-size:10px;
    font-weight:700;
    border-radius:999px;
    white-space:nowrap;
  }

  .social-row-header{
    flex:0 0 auto;
    flex-shrink:0;
    gap:4px;
    margin-left:0;
  }
  .social-row-header .social{
    width:28px;
    height:28px;
    border-radius:10px;
  }
  .social-row-header .social-svg{
    width:14px;
    height:14px;
  }
  .social-max-brand .social-svg{
    width:15px;
    height:15px;
  }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .scroll-progress-bar{ transition:none; }
  .bubble{ animation:none; }
  .faq-a{ transition:none; }
}