:root {
  --black: #030303;
  --black-70: rgb(3 3 3 / .7);
  --black-50: rgb(3 3 3 / .5);
  --black-30: rgb(3 3 3 / .3);
  --black-10: rgb(3 3 3 / .1);
  --white: #FCFCFC;
  --white-70: rgb(252 252 252 / .7);
  --white-50: rgb(252 252 252 / .5);
  --white-30: rgb(252 252 252 / .3);
  --white-10: rgb(252 252 252 / .1);
  --green: #BAFD00;
  --green-hover: #A8E600;
  --blue: #1F3BEB;
  --surface-cool: #F2F3F7;
  --surface-glass: rgb(137 137 137 / .1);

  --page: 1920px;
  --field: 70px;
  --gap: 20px;

  --ease: cubic-bezier(.2, .7, .2, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --t-fast: 250ms;
  --t-theme: 350ms;

  --font: "Inter Tight", system-ui, -apple-system, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
html.lenis, html.lenis body { height: auto; }
html.lenis, .lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

body {
  margin: 0;
  background: var(--black);
  color: var(--white);
  font-family: var(--font);
  font-size: 20px;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

h1, h2, h3, p, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
p, li { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }

.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
[hidden] { display: none !important; }

.icon {
  flex: none;
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}

.h2 {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0;
}
.h4 {
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.glass {
  background: var(--surface-glass);
  -webkit-backdrop-filter: blur(12.5px);
  backdrop-filter: blur(12.5px);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 60px;
  padding: 0 30px;
  border-radius: 10px;
  font-size: 18px;
  line-height: 1.1;
  font-weight: 500;
  white-space: nowrap;
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.btn--secondary {
  background: var(--white);
  color: var(--black);
}
.btn--primary {
  background: var(--green);
  color: var(--black);
}
.btn--primary:hover { background: var(--green-hover); }
.btn--secondary:hover { background: var(--green); }
.btn--tertiary {
  border: 1px solid var(--white-30);
  color: var(--white);
}
.btn--tertiary:hover {
  border-color: var(--white);
  background: var(--white);
  color: var(--black);
}
.btn:active { transform: translateY(1px); }

.site-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;
  padding: 20px 0;
  color: var(--white);
  transition: background-color 300ms var(--ease-soft), color 300ms var(--ease-soft);
}
.site-header.is-pinned {
  position: fixed;
  transform: translateY(-100%);
  transition: transform 300ms var(--ease-soft), background-color 300ms var(--ease-soft), color 300ms var(--ease-soft);
  background: rgb(3 3 3 / .7);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.site-header.is-pinned.is-shown { transform: none; }
.site-header.is-pinned[data-theme="light"] {
  background: rgb(252 252 252 / .82);
  color: var(--black);
}
.site-header[data-theme="light"] .icon-btn { border-color: var(--black-30); color: var(--black); }
.site-header[data-theme="light"] .icon-btn:hover { background: var(--black); border-color: var(--black); color: var(--white); }
.site-header[data-theme="light"] .btn--tertiary { border-color: var(--black-30); color: var(--black); }
.site-header[data-theme="light"] .btn--tertiary:hover { background: var(--black); border-color: var(--black); color: var(--white); }
@media (prefers-reduced-motion: reduce) {
  .site-header.is-pinned { transition-duration: 1ms; }
}
.site-header__inner {
  max-width: var(--page);
  height: 60px;
  margin: 0 auto;
  padding: 0 var(--field);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.logo {
  display: inline-flex;
  align-items: center;
  gap: 15px;
}
.logo__mark { display: block; flex: none; }
.logo__text {
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.site-header__contacts {
  display: flex;
  align-items: center;
  gap: 50px;
}
.socials {
  display: flex;
  gap: 15px;
}
.btn, .icon-btn { position: relative; z-index: 1; }
.icon-btn {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  border: 1.2px solid var(--white-30);
  color: var(--white);
  transition: border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.icon-btn:hover {
  border-color: var(--white);
  background: var(--white);
  color: var(--black);
}
.icon-btn__svg { fill: currentColor; display: block; }
.icon-btn__svg--max { width: 30px; height: 30px; }
.icon-btn__svg--tg  { width: 27.6px; height: 25px; }
.icon-btn__svg--vk  { width: 32px; height: 18.26px; }

.hero {
  position: relative;
  height: 1080px;
  overflow: hidden;
  background:
    url("assets/hero-glow-right.webp") right 0 top 534px / 1640px 546px no-repeat,
    url("assets/hero-glow-left.webp") left 0 top 0 / 913px 1080px no-repeat,
    var(--black);
}
.hero__inner {
  position: relative;
  max-width: var(--page);
  height: 100%;
  margin: 0 auto;
}

.hero__content {
  position: absolute;
  left: var(--field);
  top: 150px;
  width: 1030px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}
.hero__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  border-radius: 100px;
  background: var(--surface-glass);
  -webkit-backdrop-filter: blur(12.5px);
  backdrop-filter: blur(12.5px);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 500;
}
.pill__dot {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
}

.hero__title {
  width: 1030px;
  font-size: 90px;
  line-height: .95;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-wrap: initial;
}
.accent { color: var(--green); }

.hero__lead {
  width: 880px;
  font-size: 25px;
  line-height: 1.5;
  color: var(--white-70);
  text-wrap: initial;
}

.hero__actions {
  display: flex;
  gap: 20px;
}

.trust {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.trust__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--white-70);
}
.trust__item .icon { color: var(--white-50); }

.hero__visual {
  position: absolute;
  left: calc(50% + 10px);
  top: 130px;
  width: 880px;
  height: 780px;
}
.hero__orb {
  position: absolute;
  left: 195px;
  top: 13px;
  width: 628px;
}

.chip {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 48px;
  padding: 0 20px 0 16px;
  border-radius: 100px;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 500;
  white-space: nowrap;
}
.chip--a { left: 200px; top: 60px; }
.chip--b { left: 635px; top: 230px; }
.chip--c { left: 625px; top: 560px; }
.icon--green { color: var(--green); }

.subs {
  position: absolute;
  z-index: 2;
  left: 130px;
  top: 470px;
  width: max-content;
  padding: 20px 25px;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.subs__label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--white-50);
}
.subs__text {
  position: relative;
  font-size: 20px;
  line-height: 1.4;
  color: var(--white);
}
.subs__text.is-typing .subs__ghost { visibility: hidden; }
.subs__live { display: none; }
.subs__ghost { white-space: nowrap; }
.subs__text.is-typing .subs__live {
  display: block;
  white-space: nowrap;
  position: absolute;
  inset: 0;
  transition: opacity 400ms var(--ease);
}
.subs__text.is-fading .subs__live { opacity: 0; }
.subs__live .ch.is-off { visibility: hidden; }
.subs__caret {
  position: absolute;
  width: 0;
  height: 1em;
  margin-top: .2em;
}
.subs__caret::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 0;
  width: 2px;
  height: 1.05em;
  border-radius: 1px;
  background: var(--green);
  animation: caret-blink 1s steps(1, end) infinite;
}
.subs__text.is-printing .subs__caret::after { animation: none; }
@keyframes caret-blink { 50% { opacity: 0; } }

.plate {
  position: relative;
  z-index: 1;
  margin-top: -30px;
  padding: 100px 0;
  border-radius: 40px;
  background: var(--white);
  color: var(--black);
  display: flex;
  flex-direction: column;
  gap: 100px;
}
.plate > * {
  width: 100%;
  max-width: var(--page);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--field);
  padding-right: var(--field);
}

.about {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  align-items: start;
}
.about__text {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.about__lead {
  max-width: 631px;
  font-size: 20px;
  line-height: 1.4;
  color: var(--black-70);
}

.settings {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.setting {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 128px;
  padding: 20px 30px 20px 20px;
  border-radius: 20px;
  background: var(--surface-cool);
}
.setting__tile {
  flex: none;
  display: grid;
  place-items: center;
  width: 80px;
  height: 80px;
  border-radius: 16px;
  color: var(--white);
}
.setting__tile--blue    { background: linear-gradient(180deg, #030303 0%, #0B1A8A 50%, #2543F2 100%); }
.setting__tile--emerald { background: linear-gradient(180deg, #030303 0%, #064A38 50%, #12C08A 100%); }
.setting__tile--coral   { background: linear-gradient(180deg, #030303 0%, #6A2316 50%, #F0624A 100%); }
.setting__text {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.setting__desc {
  font-size: 16px;
  line-height: 1.5;
  color: var(--black-70);
  text-wrap: initial;
}

.divider {
  height: 1px;
  margin-top: 0;
  margin-bottom: 0;
  border: 0;
  padding: 0;
  background: var(--black-10);
  background-clip: content-box;
  width: 100%;
}
.plate > .divider {
  padding-left: 0;
  padding-right: 0;
  width: calc(100% - 2 * var(--field));
  max-width: calc(var(--page) - 2 * var(--field));
}

.difference {
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.difference__title { max-width: 880px; }

.cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap);
}
.card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  height: 420px;
  padding: 30px;
  border-radius: 25px;
  background: var(--surface-cool);
}
.card__tile {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  background: var(--black-10);
  color: var(--black);
}
.card__text {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.card .muted { color: var(--black-50); }
.card__desc {
  font-size: 16px;
  line-height: 1.5;
  color: var(--black-70);
}

.card--accent {
  background: var(--black) url("assets/card-accent.jpg") center / cover no-repeat;
  color: var(--white);
}
.card--accent .card__tile {
  background: var(--white-10);
  color: var(--white);
}
.card--accent .card__desc { color: var(--white-70); }

.manifest-scroll { position: relative; }
.manifest {
  --mp: 1;
  position: sticky;
  top: 0;
  height: 100vh;
  min-height: 640px;
  overflow: hidden;
  background: var(--black);
}
.is-static .manifest { position: relative; }
.manifest__glow {
  position: absolute;
  inset: 0;
  background: url("assets/manifest-bg.jpg") center top / cover no-repeat;
  opacity: calc(.06 + .94 * var(--mp));
}
.manifest__inner {
  position: relative;
  max-width: var(--page);
  height: 100%;
  margin: 0 auto;
  padding: 0 370px 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 60px;
}
.manifest__orb {
  position: relative;
  flex: none;
  width: 160px;
  height: 160px;
}
.manifest__orb-box {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 216px;
  margin: -108px 0 0 -108px;
}
.manifest__title {
  width: 100%;
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0;
  text-align: center;
  text-wrap: balance;
}
.manifest__title .w {
  --w: 1;
  --from: rgb(252 252 252 / .3);
  --to: var(--white);
  color: color-mix(in srgb, var(--to) calc(var(--w) * 100%), var(--from));
}
.manifest__title .w.is-start { --from: var(--white); }
.manifest__title .w.is-key { --to: var(--green); }

.features-scroll { position: relative; }
.features {
  position: sticky;
  top: var(--ft-top, 0px);
  background: var(--black);
}
.features__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.features__content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  align-items: start;
}
.features__list {
  border-bottom: 1px solid var(--white-10);
}
.frow { border-top: 1px solid var(--white-10); }
.frow__head {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 20px;
  width: 100%;
  padding: 24px 44px 0 0;
  border: 0;
  background: none;
  font: inherit;
  text-align: left;
  color: var(--white-10);
  cursor: pointer;
  transition: color 400ms var(--ease-soft);
}
.frow__head:hover { color: var(--white-30); }
.frow.is-active .frow__head { color: var(--white); cursor: default; }
.frow__icon {
  display: grid;
  place-items: center;
  height: 48px;
}
.frow__title {
  font-size: 40px;
  line-height: 1.2;
  font-weight: 600;
}
.frow__body {
  display: grid;
  grid-template-rows: 0fr;
  padding: 0 44px 24px 44px;
  transition: grid-template-rows 400ms var(--ease-soft);
}
.frow.is-active .frow__body { grid-template-rows: 1fr; }
.frow__clip { overflow: hidden; min-height: 0; }
.frow__desc {
  padding-top: 15px;
  font-size: 20px;
  line-height: 1.4;
  color: var(--white-70);
  opacity: 0;
  transition: opacity 300ms var(--ease);
}
.frow.is-active .frow__desc { opacity: 1; transition-delay: 80ms; }
.frow__img { display: none; }

.features__stage {
  position: relative;
  aspect-ratio: 880 / 682;
  border-radius: 15px;
  overflow: hidden;
  background: var(--black);
}
.features__pic {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 400ms var(--ease-soft);
}
.features__pic.is-shown { opacity: 1; }

.features-scroll.is-static { height: auto !important; }
.is-static .features { position: static; }
.is-static .features__content { grid-template-columns: 1fr; }
.is-static .features__stage { display: none; }
.is-static .frow__head { color: var(--white); cursor: default; }
.is-static .frow__body { grid-template-rows: 1fr; }
.is-static .frow__desc { opacity: 1; }
.is-static .frow__img {
  display: block;
  width: 100%;
  max-width: 880px;
  height: auto;
  margin-top: 20px;
  border-radius: 15px;
}

.dialog { position: relative; background: var(--black); }
.dialog__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
}
.player {
  position: relative;
  height: 880px;
  border-radius: 15px;
  overflow: hidden;
  background: var(--white-10) url("assets/video-poster.jpg") center / cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
}
.player__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 3;
}
.player__title {
  position: absolute;
  left: 50px;
  top: 50px;
  z-index: 1;
}
.player__center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
}
.player__play {
  display: grid;
  place-items: center;
  width: 80px;
  height: 80px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--white);
  color: var(--black);
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.player__play:hover { background: var(--green); transform: scale(1.06); }
.player__play-icon { width: 24px; height: 24px; fill: currentColor; }
.player__caption {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 480px;
  text-align: center;
}
.player__text {
  font-size: 16px;
  line-height: 1.5;
  color: var(--white-70);
}
.player__note {
  position: absolute;
  left: 50px;
  bottom: 50px;
  z-index: 1;
  width: 620px;
  padding: 25px;
  border-radius: 15px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.player__situation {
  font-size: 20px;
  line-height: 1.4;
  color: var(--white-70);
}
.player__situation-label { color: var(--white); }
.player__disclaimer {
  display: flex;
  gap: 15px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--white-70);
}

.audience {
  position: relative;
  z-index: 1;
  margin-top: -30px;
  border-radius: 40px;
  background: var(--white);
  color: var(--black);
}
.audience__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  align-items: start;
}
.audience__head {
  position: sticky;
  top: 100px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}
.audience__lead {
  font-size: 20px;
  line-height: 1.4;
  color: var(--black-70);
}
.audience__head .btn { margin-top: 20px; }
.btn--dark {
  background: var(--black);
  color: var(--white);
}
.btn--dark:hover { background: var(--green); color: var(--black); }

.audience__cards {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}
.seg {
  display: flex;
  gap: 40px;
  height: 420px;
  padding: 40px;
  border-radius: 25px;
  background: var(--surface-cool);
}
.seg__img {
  flex: none;
  width: 300px;
  height: 300px;
  border-radius: 20px;
  object-fit: cover;
}
.seg__text {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}
.seg__q { display: flex; flex-direction: column; gap: 5px; }
.seg__label, .seg__quote, .seg__answer {
  font-size: 20px;
  line-height: 1.4;
}
.seg__label { color: var(--black-50); }
.seg__quote { color: var(--black); }
.seg__answer { color: var(--black-70); }

@media (max-width: 1199px) {
  .audience__inner { grid-template-columns: 1fr; }
  .audience__head { position: static; }
}

.keys { background: var(--black); }
.keys__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
}
.keys__pic {
  position: relative;
  height: 800px;
  border-radius: 20px;
  overflow: hidden;
}
.keys__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.keys__orb {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 238px;
  margin: -119px 0 0 -119px;
}

.section-head {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 880px;
}
.section-head__lead {
  font-size: 20px;
  line-height: 1.4;
  color: var(--white-70);
}
[data-theme="light"] .section-head__lead { color: var(--black-70); }

.connect { background: var(--black); }
.connect__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.connect__content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
}
.steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
}
.step {
  display: flex;
  flex-direction: column;
  gap: 20px;
  height: 268px;
  padding: 30px;
  border-radius: 15px;
  background: #131317;
}
.step__num {
  font-size: 40px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--green);
}
.step__text { font-size: 20px; line-height: 1.4; color: var(--white); }

.editor { display: flex; flex-direction: column; gap: 20px; }
.code {
  display: flex;
  flex-direction: column;
  height: 512px;
  border-radius: 15px;
  background: #131317;
}
.code__bar {
  display: flex;
  align-items: center;
  gap: 20px;
  height: 61px;
  padding: 0 30px;
  border-bottom: 1px solid var(--white-10);
}
.code__dots { display: flex; gap: 8px; }
.code__dots i { width: 12px; height: 12px; border-radius: 50%; background: var(--white-30); }
.code__file { font-size: 14px; line-height: 1.5; color: var(--white-50); }
.code__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  padding: 30px;
}
.code__line {
  font-size: 25px;
  line-height: 1.5;
  color: var(--white-50);
  overflow-wrap: anywhere;
}
.code__line .c-w { color: var(--white); }
.code__line .c-g { color: var(--green); }
.code__note { font-size: 14px; line-height: 1.5; color: var(--white-50); }
.editor__mark {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--white-70);
}

.leads {
  position: relative;
  z-index: 1;
  margin-top: -30px;
  border-radius: 40px;
  background: var(--white);
  color: var(--black);
}
.leads__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  align-items: start;
}
.leads__text { display: flex; flex-direction: column; gap: 40px; }
.lines { border-bottom: 1px solid var(--black-10); }
.lines li {
  padding: 14px 0;
  border-top: 1px solid var(--black-10);
  font-size: 20px;
  line-height: 1.4;
  color: var(--black-70);
}

.crm { display: flex; flex-direction: column; gap: 20px; }
.crm__tabs { display: flex; gap: 5px; }
.crm__tab {
  height: 50px;
  padding: 5px 20px;
  border: 0;
  border-radius: 100px;
  background: var(--surface-cool);
  color: var(--black);
  font: inherit;
  font-size: 20px;
  line-height: 1.4;
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease-soft), color var(--t-fast) var(--ease-soft);
}
.crm__tab:hover { background: #E4E6EC; }
.crm__tab.is-active { background: var(--black); color: var(--white); cursor: default; }

.crm__stack { display: grid; height: 458px; }
.crm__card {
  grid-area: 1 / 1;
  height: 458px;
  border-radius: 25px;
  background: var(--surface-cool);
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 350ms var(--ease-soft), transform 0s linear 350ms, visibility 0s linear 350ms;
}
.crm__card.is-shown {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity 350ms var(--ease-soft), transform 350ms var(--ease-soft), visibility 0s;
}
.crm__tab { flex: none; font-weight: 400; }
.muted70 { color: var(--black-70); }
.muted50 { color: var(--black-50); }

.pill-s {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 100px;
  font-size: 14px;
  line-height: 1.5;
  white-space: nowrap;
}
.pill-s--dark { background: var(--black); color: var(--white); }
.pill-s--white { background: var(--white); color: var(--black-50); }
.pill-s--tag { background: var(--black-10); color: var(--black-70); }

.tg__head { display: flex; align-items: center; gap: 15px; height: 90px; padding: 20px 30px; border-bottom: 1px solid var(--black-10); }
.tg__avatar { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: var(--black); color: var(--white); }
.tg__chat { display: flex; flex-direction: column; gap: 2px; }
.tg__name { font-size: 16px; line-height: 1.2; font-weight: 500; }
.tg__sub { font-size: 14px; line-height: 1.5; color: var(--black-50); }
.tg__feed { padding: 25px 30px; }
.tg__msg {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 620px;
  max-width: 100%;
  padding: 20px 25px 15px;
  border-radius: 15px;
  background: var(--white);
  font-size: 16px;
  line-height: 1.5;
}
.tg__title { font-weight: 500; line-height: 1.2; }
.tg__indent { padding-left: 20px; }
.tg__time { font-size: 12px; line-height: 1.4; color: var(--black-50); text-align: right; }

.b24__head { display: flex; align-items: center; justify-content: space-between; height: 67px; padding: 18px 30px; border-bottom: 1px solid var(--black-10); }
.b24__src { font-size: 16px; line-height: 1.2; font-weight: 500; }
.b24__body { display: flex; flex-direction: column; gap: 15px; padding: 20px 30px; }
.b24__title { display: flex; align-items: center; gap: 20px; }
.b24__title .h4 { flex: 1; min-width: 0; }
.b24__stages { display: flex; gap: 4px; }
.b24__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 20px;
  row-gap: 10px;
  margin: 0;
  padding: 15px 20px;
  border-radius: 15px;
  background: var(--white);
}
.b24__fields div { display: flex; flex-direction: column; gap: 2px; }
.b24__fields dt { font-size: 14px; line-height: 1.5; color: var(--black-50); }
.b24__fields dd { margin: 0; font-size: 16px; line-height: 1.5; }
.b24__table { padding: 12px 20px; border-radius: 15px; background: var(--white); }
.b24__row { display: grid; grid-template-columns: 1fr 80px 120px; gap: 20px; padding: 6px 0; font-size: 16px; line-height: 1.5; }
.b24__row span:not(:first-child) { text-align: right; }
.b24__row--head { font-size: 14px; color: var(--black-50); border-bottom: 1px solid var(--black-10); }
.b24__comment { font-size: 16px; line-height: 1.5; }

.amo { display: flex; flex-direction: column; gap: 15px; padding: 25px 30px; }
.amo__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.amo__name { display: flex; flex-direction: column; gap: 5px; }
.amo__src { font-size: 14px; line-height: 1.5; color: var(--black-50); }
.amo__budget { font-size: 40px; line-height: 1.2; font-weight: 600; white-space: nowrap; }
.amo__tags { display: flex; align-items: center; gap: 8px; }
.amo__line { height: 1px; margin: 0; border: 0; background: var(--black-10); }
.amo__contact { display: flex; align-items: center; gap: 15px; }
.amo__avatar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--black); color: var(--white); font-size: 16px; line-height: 1.2; font-weight: 500; }
.amo__who { display: flex; flex-direction: column; gap: 2px; }
.amo__person { font-size: 16px; line-height: 1.2; font-weight: 500; }
.amo__phone { font-size: 14px; line-height: 1.5; color: var(--black-70); }
.amo__note { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border-radius: 15px; background: var(--white); font-size: 16px; line-height: 1.5; }
.amo__note-label { font-size: 14px; color: var(--black-50); }

.code__line { position: relative; }
.code__line .ch.is-off { visibility: hidden; }
.code__line.is-typing .ch { transition: opacity 400ms var(--ease-soft); }
.code__line.is-fading .ch { opacity: 0; }
.type-caret {
  position: absolute;
  width: 0;
  height: 1em;
  margin-top: .25em;
}
.type-caret::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 0;
  width: 2px;
  height: 1.05em;
  border-radius: 1px;
  background: var(--green);
  animation: caret-blink 1s steps(1, end) infinite;
}
.code__line.is-printing .type-caret::after { animation: none; }
.code__line.is-fading .type-caret { opacity: 0; }

.privacy { background: var(--black); }
.privacy__inner {
  position: relative;
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
}
.privacy__shield {
  position: absolute;
  left: 1059px;
  top: 81px;
  width: 772px;
  height: 707px;
  object-fit: cover;
}
.privacy__content {
  position: relative;
  width: 880px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.privacy__list { display: flex; flex-direction: column; gap: 40px; }
.pitem { display: flex; gap: 20px; }
.pitem__num {
  flex: none;
  width: 40px;
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--white-30);
}
.pitem__text { display: flex; flex-direction: column; gap: 10px; }
.pitem__text p { font-size: 20px; line-height: 1.4; color: var(--white-70); }
@media (max-width: 1919px) {
  .privacy__shield { left: auto; right: 19px; }
}

.pricing {
  position: relative;
  z-index: 1;
  margin-top: -30px;
  border-radius: 40px;
  background: var(--white);
  color: var(--black);
}
.pricing__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 80px var(--field) 100px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.pricing__head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
  align-items: start;
}
.pricing__hints {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 5px;
}
.hint {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 48px;
  padding: 0 20px 0 16px;
  border-radius: 100px;
  background: var(--surface-cool);
  font-size: 16px;
  line-height: 1.5;
  color: var(--black-70);
  white-space: nowrap;
}

.plans {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gap);
}
.plan {
  --plus: rgb(3 3 3 / .3);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 20px;
  height: 731px;
  padding: 30px;
  border-radius: 25px;
  background: var(--surface-cool);
  color: var(--black);
  transition: background-color 300ms var(--ease-soft), color 300ms var(--ease-soft);
}
.plan__min, .plan__per, .plan__cond, .plan__panel-title, .plan__list li { transition: color 300ms var(--ease-soft); }
.plan__panel { transition: background-color 300ms var(--ease-soft); }
.plan__btn { transition: background-color 250ms var(--ease-soft), color 0s linear 125ms; }
.plan__terms { display: flex; flex-direction: column; gap: 20px; min-height: 204px; }
.plan { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 20px; height: auto; }
.plan__terms { display: contents; }
.plan__panel { align-self: start; }
.plan__name { display: flex; flex-direction: column; gap: 5px; }
.plan__min { font-size: 20px; line-height: 1.4; color: var(--black-50); }
.plan__price { display: flex; flex-direction: column; gap: 5px; }
.plan__sum { display: flex; align-items: baseline; gap: 10px; }
.plan__value { font-size: 40px; line-height: 1.2; font-weight: 600; white-space: nowrap; }
.plan__per { font-size: 16px; line-height: 1.5; color: var(--black-50); }
.plan__cond { font-size: 14px; line-height: 1.5; color: var(--black-50); }
.plan__btn { width: 100%; }
.plan__panel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 15px;
  border-radius: 15px;
  background: var(--white);
}
.plan__panel-title { font-size: 16px; line-height: 19px; font-weight: 500; color: var(--black-50); }
.plan__list { display: flex; flex-direction: column; gap: 8px; }
.plan__list li {
  position: relative;
  padding-left: 22px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--black-70);
}
.plan__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  width: 12px;
  height: 12px;
  background-color: var(--plus);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 2v8M2 6h8' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 2v8M2 6h8' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
  transition: background-color 300ms var(--ease-soft);
}
@media (hover: hover) and (pointer: fine) {
  .plan:not(.is-hover) .plan__btn:hover { background: var(--black); color: var(--white); }
  .plan.is-hover { --plus: rgb(252 252 252 / .3); background: var(--black); color: var(--white); }
  .plan.is-hover .plan__min,
  .plan.is-hover .plan__per,
  .plan.is-hover .plan__cond,
  .plan.is-hover .plan__panel-title { color: var(--white-50); }
  .plan.is-hover .plan__panel { background: var(--white-10); }
  .plan.is-hover .plan__list li { color: var(--white-70); }
  .plan.is-hover .plan__btn { background: var(--green); color: var(--black); }
  .plan.is-hover .plan__btn:hover { background: var(--green-hover); }
}
.plan__badge {
  position: absolute;
  top: 30px;
  right: 37px;
  padding: 5px 12px;
  border-radius: 100px;
  background: var(--green);
  color: var(--black);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 500;
}

.notes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
  padding-top: 60px;
}
.note {
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 310px;
  padding: 30px;
  border-radius: 25px;
  background: var(--surface-cool);
}
.note p { font-size: 20px; line-height: 1.4; color: var(--black-70); }
.note--dark {
  justify-content: space-between;
  gap: 30px;
  background: var(--black);
  color: var(--white);
}
.note--dark p { color: var(--white-70); }
.note__text { display: flex; flex-direction: column; gap: 10px; }
.note--dark .btn { align-self: flex-start; }

.banner { background: var(--black); }
.banner__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
}
.banner__img {
  display: block;
  width: 100%;
  height: 800px;
  border-radius: 20px;
  object-fit: cover;
}

.faq { background: var(--black); }
.faq__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap);
}
.faq__side {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 60px;
}
.faq__head { display: flex; flex-direction: column; align-items: flex-start; gap: 40px; }
.faq__sub { font-size: 20px; line-height: 1.4; color: var(--white-50); }
.faq__contacts { display: flex; flex-direction: column; gap: 20px; }
.faq__label { font-size: 14px; line-height: 1.5; color: var(--white-30); }
.faq__links { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.faq__phone {
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
  transition: color var(--t-fast) var(--ease);
}
.faq__mail { font-size: 20px; line-height: 1.4; color: var(--white-70); transition: color var(--t-fast) var(--ease); }
.faq__phone:hover, .faq__mail:hover { color: var(--green); }

.acc { border-bottom: 1px solid var(--white-10); align-self: start; }
.acc__item { border-top: 1px solid var(--white-10); }
.acc__h { margin: 0; }
.acc__q {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  padding: 20px 0;
  border: 0;
  background: none;
  color: var(--white);
  font: inherit;
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-align: left;
  cursor: pointer;
}
.acc__q span { flex: 1; min-width: 0; }
.acc__chev {
  color: var(--white-50);
  transition: transform 400ms var(--ease-soft), color 300ms var(--ease-soft);
}
.acc__q:hover .acc__chev { color: var(--white); }
.acc__item.is-open .acc__chev { transform: rotate(180deg); color: var(--green); }
.acc__a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 400ms var(--ease-soft), margin-top 400ms var(--ease-soft);
}
.acc__item.is-open .acc__a { grid-template-rows: 1fr; margin-top: -5px; }
.acc__clip { overflow: hidden; min-height: 0; }
.acc__a p {
  padding: 0 44px 20px 0;
  font-size: 16px;
  line-height: 1.5;
  color: var(--white-70);
  opacity: 0;
  transition: opacity 300ms var(--ease-soft);
}
.acc__item.is-open .acc__a p { opacity: 1; transition-delay: 80ms; }

.contact { background: var(--black); }
.contact__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 100px var(--field);
}
.lead-box {
  display: flex;
  gap: 40px;
  min-height: 664px;
  padding: 40px;
  border-radius: 20px;
  background: var(--black) url("assets/form-bg.jpg") center / 100% 100% no-repeat;
}
.lead-box__text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
}
.lead-box__head { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.lead-box__head .pill { padding: 10px 20px; }
.lead-box__lead { max-width: 630px; font-size: 20px; line-height: 1.4; color: var(--white-70); }
.lead-box__direct { display: flex; flex-direction: column; gap: 20px; }
.lead-box__direct-title { font-size: 20px; line-height: 1.4; color: var(--white-70); }
.lead-box__contacts { display: flex; flex-direction: column; align-items: flex-start; gap: 30px; }
.lead-box__phone {
  font-size: 25px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: -0.01em;
  transition: color var(--t-fast) var(--ease);
}
.lead-box__phone:hover { color: var(--green); }

.lf {
  flex: none;
  width: 840px;
  max-width: 100%;
  padding: 60px;
  border-radius: 20px;
  background: var(--surface-glass);
  -webkit-backdrop-filter: blur(25px);
  backdrop-filter: blur(25px);
}
.lf__body { display: flex; flex-direction: column; gap: 30px; }
.lf__title {
  font-size: 40px;
  line-height: 1.2;
  font-weight: 600;
}
.lf__fields { display: flex; flex-direction: column; gap: 13px; }
.lf__input {
  display: block;
  width: 100%;
  height: 60px;
  padding: 0 40px;
  border: 0;
  border-radius: 12px;
  background: var(--white-10);
  -webkit-backdrop-filter: blur(12.5px);
  backdrop-filter: blur(12.5px);
  color: var(--white);
  font: inherit;
  font-size: 20px;
  line-height: 1.4;
  text-align: center;
  transition: background-color var(--t-fast) var(--ease);
}
.lf__input::placeholder { color: var(--white-50); opacity: 1; }
.lf__input:hover { background: rgb(252 252 252 / .14); }
.lf__input:focus { outline: none; background: rgb(252 252 252 / .18); }
.lf__input:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.lf.was-checked .lf__input:invalid,
.mf.was-checked .lf__input:invalid { background: rgb(240 98 74 / .28); }
.lf__submit {
  height: 60px;
  border: 0;
  border-radius: 12px;
  background: var(--green);
  color: var(--black);
  font: inherit;
  font-size: 20px;
  line-height: 1.4;
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease);
}
.lf__submit:hover { background: var(--green-hover); }
.lf__submit:disabled { cursor: progress; opacity: .7; }
.lf__error { font-size: 14px; line-height: 1.5; color: #FF9A86; text-align: center; }
.lf__error a { color: var(--white); white-space: nowrap; }
.lf__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.consent { display: flex; align-items: flex-start; gap: 11px; cursor: pointer; }
.consent__box { position: absolute; opacity: 0; width: 1px; height: 1px; }
.consent__mark {
  flex: none;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  background: var(--white-30);
  transition: background-color var(--t-fast) var(--ease);
}
.consent__mark svg { width: 14px; height: 14px; fill: none; stroke: var(--black); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transition: opacity var(--t-fast) var(--ease); }
.consent__box:checked + .consent__mark { background: var(--green); }
.consent__box:checked + .consent__mark svg { opacity: 1; }
.consent__box:focus-visible + .consent__mark { outline: 2px solid var(--green); outline-offset: 2px; }
.was-checked .consent__box:invalid + .consent__mark { background: rgb(240 98 74 / .6); }
.consent__text { font-size: 14px; line-height: 1.5; color: var(--white-50); }
.consent__text a { color: var(--white); transition: color var(--t-fast) var(--ease); }
.consent__text a:hover { color: var(--green); }

.lf__done { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; min-height: 100%; text-align: center; }
.lf__done[hidden] { display: none; }
.lf__done-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--green); color: var(--black); }
.lf__done-icon .icon { width: 32px; height: 32px; stroke-width: 2; }
.lf__done-title { font-size: 40px; line-height: 1.2; font-weight: 600; }
.lf__done-text { max-width: 480px; font-size: 20px; line-height: 1.4; color: var(--white-70); }
.lf.is-sent { display: flex; align-items: center; justify-content: center; }

.select { position: relative; z-index: 2; }
.select__btn { position: relative; cursor: pointer; }
.select__value { display: block; }
.select__chev {
  position: absolute;
  right: 40px;
  top: 50%;
  margin-top: -12px;
  color: var(--white);
  transition: transform 300ms var(--ease-soft);
}
.select.is-open .select__chev { transform: rotate(180deg); }
.select__list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  max-height: 300px;
  overflow-y: auto;
  margin: 0;
  padding: 8px;
  border-radius: 12px;
  background: var(--white);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity 200ms var(--ease-soft), transform 200ms var(--ease-soft), visibility 0s linear 200ms;
}
.select.is-open .select__list {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity 200ms var(--ease-soft), transform 200ms var(--ease-soft), visibility 0s;
}
.select__opt {
  display: flex;
  align-items: center;
  height: 44px;
  padding: 0 32px;
  border-radius: 8px;
  font-size: 20px;
  line-height: 1.4;
  color: var(--black-70);
  cursor: pointer;
  transition: background-color 150ms var(--ease), color 150ms var(--ease);
}
.select__opt:hover, .select__opt.is-active { background: rgb(3 3 3 / .05); color: var(--black); }
.select__opt.is-selected { background: var(--surface-cool); color: var(--black); }

.footer {
  background: var(--black) url("assets/card-accent.jpg") center bottom / 100% 979px no-repeat;
}
.footer__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 50px var(--field);
  display: flex;
  flex-direction: column;
  gap: 60px;
}
.footer__top { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.footer__brand { display: flex; flex-direction: column; gap: 10px; }
.footer__logo {
  font-size: 123.75px;
  line-height: 118px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.footer__desc { font-size: 25px; line-height: 1.5; color: var(--white-70); }
.footer__actions { display: flex; align-items: center; gap: 30px; }
.footer__line { height: 1px; margin: 0; border: 0; background: var(--white-10); }
.footer__cols { display: grid; grid-template-columns: 880px 430px 430px; gap: var(--gap); }
.footer__contacts { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer__phone { font-size: 40px; line-height: 1.2; font-weight: 600; transition: color var(--t-fast) var(--ease); }
.footer__link-big { font-size: 25px; line-height: 1.5; color: var(--white-70); transition: color var(--t-fast) var(--ease); }
.footer__col { display: flex; flex-direction: column; gap: 30px; }
.footer__col-title { font-size: 20px; line-height: 1.4; color: var(--white-30); }
.footer__list { display: flex; flex-direction: column; gap: 20px; }
.footer__list a { font-size: 20px; line-height: 1.4; transition: color var(--t-fast) var(--ease); }
.footer__phone:hover, .footer__link-big:hover, .footer__list a:hover, .footer__up:hover, .footer__weblink:hover, .footer__legal a:hover { color: var(--green); }
.footer__bottom { display: flex; align-items: center; justify-content: space-between; gap: 40px; font-size: 20px; line-height: 1.4; }
.footer__legal { display: flex; gap: 60px; color: var(--white-30); }
.footer__legal a { transition: color var(--t-fast) var(--ease); }
.footer__weblink { color: var(--white); }
.footer__up { display: inline-flex; align-items: center; gap: 10px; transition: color var(--t-fast) var(--ease); }

.modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 20px;
  opacity: 0;
  transition: opacity 300ms var(--ease-soft);
}
.modal[hidden] { display: none; }
.modal.is-open { opacity: 1; }
.modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgb(3 3 3 / .7);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.modal__card {
  position: relative;
  width: 640px;
  max-width: 100%;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 50px 40px 40px;
  border-radius: 20px;
  background: var(--black) url("assets/card-accent.jpg") center / cover no-repeat;
  transform: scale(.96);
  transition: transform 300ms var(--ease-soft);
}
.modal.is-open .modal__card { transform: none; }
.modal__close {
  position: absolute;
  top: 20px;
  right: 20px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: none;
  color: var(--white-70);
  cursor: pointer;
  transition: color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.modal__close:hover { color: var(--white); background: var(--white-10); }
.mf .lf__body { gap: 13px; }
.mf__head { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 17px; text-align: center; }
.mf__title { font-size: 40px; line-height: 1.2; font-weight: 600; }
.mf__sub { font-size: 20px; line-height: 1.4; color: var(--white-70); }
.mf__seg { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.mf__tab {
  height: 50px;
  border: 0;
  border-radius: 12px;
  background: var(--surface-glass);
  -webkit-backdrop-filter: blur(12.5px);
  backdrop-filter: blur(12.5px);
  color: var(--white);
  font: inherit;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 500;
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.mf__tab:hover { background: rgb(137 137 137 / .2); }
.mf__tab.is-active { background: var(--white); color: var(--black); }
.mf__tariff {
  align-self: center;
  padding: 5px 14px;
  border-radius: 100px;
  background: var(--surface-glass);
  font-size: 14px;
  line-height: 1.5;
  color: var(--white-70);
}
.mf__tariff span { color: var(--white); }
.mf .lf__done { min-height: 380px; }
html.modal-open { overflow: hidden; }

.dock-shade {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 0;
  height: 235px;
  pointer-events: none;
  background: linear-gradient(180deg, rgb(3 3 3 / 0) 5.5%, rgb(3 3 3 / .53) 100%);
}

.dock {
  position: fixed;
  left: 50%;
  bottom: 90px;
  z-index: 50;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 5px;
}
.dock__nav {
  display: flex;
  align-items: center;
  gap: 40px;
  height: 60px;
  padding: 8px 40px;
  border-radius: 12px;
  background: rgb(40 40 44 / .55);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: background-color var(--t-theme) var(--ease);
}
.dock__link {
  display: block;
  font-size: 18px;
  line-height: 1.1;
  font-weight: 500;
  color: var(--white);
  white-space: nowrap;
  transition: color var(--t-theme) var(--ease);
}
.dock__link:hover { color: var(--white-50); transition-duration: var(--t-fast); }
.dock__cta {
  display: flex;
  align-items: center;
  height: 60px;
  padding: 8px 30px;
  border-radius: 12px;
  background: var(--green);
  color: var(--black);
  font-size: 18px;
  line-height: 1.1;
  font-weight: 500;
  white-space: nowrap;
  transition: background-color var(--t-fast) var(--ease);
}
.dock__cta:hover { background: var(--green-hover); }
.dock__cta:active { transform: translateY(1px); }

.dock[data-theme="light"] .dock__nav { background: rgb(236 237 241 / .85); }
.dock[data-theme="light"] .dock__link { color: var(--black); }
.dock[data-theme="light"] .dock__link:hover { color: var(--black-50); }
.dock[data-theme="light"] :focus-visible { outline-color: var(--black); }

.to-top {
  position: fixed;
  right: max(var(--field), calc((100% - var(--page)) / 2 + var(--field)));
  bottom: var(--dock-b, 90px);
  z-index: 50;
  display: grid;
  place-items: center;
  width: var(--dock-h, 60px);
  height: var(--dock-h, 60px);
  border-radius: 12px;
  background: rgb(40 40 44 / .55);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: var(--white);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity 250ms var(--ease), transform 250ms var(--ease), background-color var(--t-fast) var(--ease);
}
.to-top.is-shown { opacity: 1; pointer-events: auto; transform: none; }
.to-top .icon { stroke: var(--white); }
.to-top[data-theme="light"] { background: rgb(236 237 241 / .85); color: var(--black); }
.to-top[data-theme="light"] .icon { stroke: var(--black); }
.to-top[data-theme="light"]:focus-visible { outline-color: var(--black); }
@media (hover: hover) {
  .to-top:hover { background: var(--white); color: var(--black); }
  .to-top:hover .icon { stroke: var(--black); }
  .to-top[data-theme="light"]:hover { background: var(--black); color: var(--white); }
  .to-top[data-theme="light"]:hover .icon { stroke: var(--white); }
}

.cookies {
  position: fixed;
  right: max(var(--field), calc((100% - var(--page)) / 2 + var(--field)));
  bottom: calc(var(--dock-b, 90px) + var(--dock-h, 60px) + 16px);
  z-index: 55;
  display: flex;
  align-items: center;
  gap: 20px;
  width: min(520px, calc(100% - 2 * var(--field)));
  padding: 20px 20px 20px 24px;
  border-radius: 16px;
  background: rgb(19 19 23 / .92);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 12px 40px rgb(3 3 3 / .3);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 300ms var(--ease), transform 300ms var(--ease);
}
.cookies.is-shown { opacity: 1; transform: none; }
.cookies__text { font-size: 15px; line-height: 1.5; color: var(--white-70); }
.cookies__text a { color: var(--white); text-decoration: underline; text-underline-offset: 2px; transition: color var(--t-fast) var(--ease); }
.cookies__text a:hover { color: var(--green); }
.cookies__btn {
  flex: none;
  height: 44px;
  padding: 0 22px;
  border: 0;
  border-radius: 10px;
  background: var(--green);
  color: var(--black);
  font: inherit;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color var(--t-fast) var(--ease);
}
.cookies__btn:hover { background: var(--green-hover); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; }
}

@media (max-width: 1919px) {
  :root {
    --field: clamp(40px, 3.646vw, 70px);
    --sec: clamp(72px, 5.208vw, 100px);
    --h1: clamp(48px, min(4.6875vw, 8.3vh), 90px);
    --h2: clamp(40px, 3.125vw, 60px);
    --h3: clamp(30px, 2.083vw, 40px);
    --h4: clamp(21px, 1.302vw, 25px);
    --body-big: clamp(20px, 1.302vw, 25px);
    --body: 20px;
    --label: 18px;
    --btn-h: 60px;
    --icon-btn: 60px;
    --dock-b: clamp(24px, 8.333vh, 90px);
    --dock-h: 60px;
    --hero-pt: clamp(110px, 13.9vh, 150px);
    --hero-pb: calc(var(--dock-b) + var(--dock-h) + 30px);
  }

  body { font-size: var(--body); }
  .h2 { font-size: var(--h2); }
  .h4, .logo__text, .acc__q, .faq__phone, .lead-box__phone, .pitem__num { font-size: var(--h4); }
  .step__num, .plan__value, .lf__title, .lf__done-title, .mf__title, .amo__budget, .footer__phone { font-size: var(--h3); }
  .code__line, .footer__desc, .footer__link-big { font-size: var(--body-big); }
  .about__lead, .player__situation, .audience__lead, .seg__label, .seg__quote, .seg__answer,
  .section-head__lead, .step__text, .lines li, .crm__tab, .pitem__text p, .plan__min, .note p,
  .faq__sub, .faq__mail, .lead-box__lead, .lead-box__direct-title, .lf__input, .lf__submit,
  .select__opt, .lf__done-text, .mf__sub, .footer__col-title, .footer__list a, .footer__bottom { font-size: var(--body); }
  .btn { height: var(--btn-h); font-size: var(--label); }
  .icon-btn { width: var(--icon-btn); height: var(--icon-btn); }

  .hero {
    display: grid;
    height: auto;
    min-height: 100vh;
    background-position: right 0 bottom 0, left 0 top 0;
    background-size: 85.417vw 28.438vw, 47.552vw 56.25vw;
  }
  .hero__inner {
    width: 100%;
    height: auto;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    align-items: center;
    gap: var(--gap);
    padding: var(--hero-pt) var(--field) var(--hero-pb);
  }
  .hero__content { position: static; width: auto; gap: 32px; }
  .hero__title { width: auto; font-size: var(--h1); }
  .hero__lead { width: auto; font-size: clamp(16px, min(1.302vw, 2.3vh), 25px); }
  .hero__actions { flex-wrap: wrap; gap: 16px 20px; }

  .hero__visual {
    position: relative;
    left: auto;
    top: auto;
    justify-self: end;
    width: min(100%, max(360px, calc((100vh - var(--hero-pt) - var(--hero-pb)) * 880 / 780)));
    height: auto;
    aspect-ratio: 880 / 780;
    container-type: inline-size;
  }
  .hero__orb { left: 22.159%; top: 1.667%; width: 71.364%; }
  .chip {
    height: max(34px, 5.455cqw);
    padding: 0 max(12px, 2.273cqw) 0 max(10px, 1.818cqw);
    gap: max(6px, 1.136cqw);
    font-size: clamp(12px, 1.818cqw, 16px);
  }
  .chip .icon { width: clamp(18px, 2.727cqw, 24px); height: clamp(18px, 2.727cqw, 24px); }
  .chip--a { left: 22.727%; top: 7.692%; }
  .chip--b { left: auto; right: 1.477%; top: 29.487%; }
  .chip--c { left: auto; right: 5.909%; top: 71.795%; }
  .subs {
    left: 14.773%;
    top: 60.256%;
    padding: max(10px, 2.273cqw) max(12px, 2.841cqw);
    gap: max(6px, 1.136cqw);
    border-radius: clamp(8px, 1.364cqw, 12px);
  }
  .subs__label { gap: max(6px, .909cqw); font-size: clamp(11px, 1.591cqw, 14px); }
  .subs__text { font-size: clamp(13px, 2.273cqw, 20px); }

  .plate { padding: var(--sec) 0; gap: var(--sec); }
  .card { height: auto; min-height: clamp(340px, 21.875vw, 420px); }

  .manifest__inner {
    padding: 0 clamp(64px, 19.271vw, 370px) calc(var(--dock-b) + var(--dock-h));
    gap: clamp(28px, 5.556vh, 60px);
  }
  .manifest__orb { width: clamp(104px, 14.815vh, 160px); height: clamp(104px, 14.815vh, 160px); }
  .manifest__orb-box { width: 135%; margin: 0; transform: translate(-50%, -50%); }
  .manifest__title { font-size: clamp(32px, min(3.125vw, 5.556vh), 60px); }

  .features {
    --ft-pad: clamp(40px, 7vh, 100px);
    --ft-pad-b: max(var(--ft-pad), calc(var(--dock-b) + var(--dock-h) + 12px));
    --ft-h2: clamp(36px, min(3.125vw, 5.556vh), 60px);
    --ft-gap: clamp(24px, 4.63vh, 50px);
    --ft-title: clamp(22px, min(2.083vw, 3.5vh), 40px);
    --ft-row: clamp(10px, 2vh, 24px);
  }
  .features__inner { padding: var(--ft-pad) var(--field) var(--ft-pad-b); gap: var(--ft-gap); }
  .features .h2 { font-size: var(--ft-h2); }
  .frow__head { padding-top: var(--ft-row); }
  .frow__icon { height: calc(var(--ft-title) * 1.2); }
  .frow__title { font-size: var(--ft-title); }
  .frow__body { padding-bottom: var(--ft-row); }
  .frow__desc { padding-top: 10px; font-size: clamp(16px, min(1.042vw, 1.852vh), 20px); }
  .features__stage {
    justify-self: end;
    width: min(100%, calc((100vh - var(--ft-pad) - var(--ft-pad-b) - var(--ft-h2) - var(--ft-gap)) * 880 / 682));
  }

  .dialog__inner { padding: var(--sec) var(--field); }
  .player {
    display: grid;
    grid-template-rows: 1fr auto 1fr;
    justify-items: center;
    gap: 24px;
    height: auto;
    aspect-ratio: 1780 / 880;
    padding: clamp(24px, 2.604vw, 50px);
  }
  .player__title { position: static; justify-self: start; align-self: start; }
  .player__note { position: static; justify-self: start; align-self: end; width: min(620px, 100%); }

  .audience__inner { padding: var(--sec) var(--field); }
  .seg {
    height: auto;
    min-height: clamp(340px, 21.875vw, 420px);
    gap: clamp(24px, 2.083vw, 40px);
    padding: clamp(28px, 2.083vw, 40px);
  }
  .seg__img { width: clamp(180px, 15.625vw, 300px); height: clamp(180px, 15.625vw, 300px); }

  .keys__inner, .banner__inner { padding: var(--sec) var(--field); }
  .keys__pic { height: auto; aspect-ratio: 1780 / 800; }
  .keys__orb { width: 13.371%; margin: 0; transform: translate(-50%, -50%); }
  .banner__img { height: auto; aspect-ratio: 1780 / 800; }

  .connect__inner { padding: var(--sec) var(--field); gap: clamp(32px, 2.604vw, 50px); }
  .step { height: auto; min-height: clamp(200px, 13.958vw, 268px); }
  .code { flex: 1; height: auto; min-height: 280px; }

  .leads__inner { padding: var(--sec) var(--field); }
  .crm__stack, .crm__card { height: auto; }

  .privacy__inner { padding: var(--sec) var(--field); }
  .privacy__content { width: calc(50% - var(--gap) / 2); }
  .privacy__shield { top: 50%; width: min(772px, 43%); height: auto; transform: translateY(-50%); }

  .pricing__inner { padding: clamp(60px, 4.167vw, 80px) var(--field) var(--sec); }
  .pricing__hints { flex-wrap: wrap; }
  .plan { height: auto; padding: clamp(22px, 1.563vw, 30px); }
  .plan__sum { flex-wrap: wrap; row-gap: 0; }
  .plan__badge { top: clamp(22px, 1.563vw, 30px); right: clamp(22px, 1.927vw, 37px); }
  .notes { padding-top: clamp(40px, 3.125vw, 60px); }
  .note { height: auto; min-height: clamp(240px, 16.146vw, 310px); }

  .faq__inner, .contact__inner { padding: var(--sec) var(--field); }
  .lead-box { min-height: 0; gap: clamp(24px, 2.083vw, 40px); padding: clamp(24px, 2.083vw, 40px); }
  .lead-box__text { min-width: 340px; }
  .lf { flex: 0 1 840px; width: auto; min-width: 0; padding: clamp(32px, 3.125vw, 60px); }

  .footer__logo { font-size: clamp(64px, 6.445vw, 123.75px); line-height: .954; }
  .footer__cols { grid-template-columns: 880fr 430fr 430fr; }

  .dock { bottom: var(--dock-b); }
  .dock__nav, .dock__cta { height: var(--dock-h); }
  .dock__link, .dock__cta { font-size: var(--label); }
}

@media (min-width: 1200px) and (max-width: 1919px) and (max-height: 860px) {
  .hero .trust { display: none; }
}

@media (max-width: 1439px) {
  :root {
    --body: 18px;
    --label: 16px;
    --btn-h: 52px;
    --icon-btn: 52px;
    --dock-h: 52px;
  }
  .btn { padding: 0 24px; }
  .setting__desc br, .frow__desc br { display: none; }
  .site-header__contacts { gap: 24px; }
  .socials { gap: 10px; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card { min-height: 280px; }
  .lf__input, .lf__submit { height: 56px; }
  .footer__legal { gap: 32px; }
  .dock__nav { gap: 28px; padding: 0 28px; }
  .dock__cta { padding: 0 24px; }
}

@media (max-width: 1199px) {
  :root {
    --h1: clamp(40px, 6.25vw, 64px);
    --h2: 40px;
    --h3: 30px;
    --h4: 21px;
    --body-big: 20px;
  }

  .hero { min-height: 0; background-size: 1640px 546px, 913px 1080px; }
  .hero__inner { grid-template-columns: minmax(0, 1fr); gap: 56px; padding: 140px var(--field) 72px; }
  .hero__lead { font-size: var(--body-big); }
  .hero__visual { justify-self: center; width: min(100%, 680px); }

  .manifest { height: auto; min-height: 0; }
  .manifest__inner { padding: clamp(80px, 11vw, 128px) var(--field); gap: 40px; }
  .manifest__orb { width: 128px; height: 128px; }
  .manifest__title { font-size: clamp(26px, 4.2vw, 44px); }

  .features {
    --ft-pad: var(--sec);
    --ft-pad-b: var(--sec);
    --ft-h2: var(--h2);
    --ft-gap: 40px;
    --ft-title: 28px;
    --ft-row: 20px;
  }
  .frow__desc { font-size: var(--body); }

  .audience__head { gap: 16px; }
  .seg__img { width: 220px; height: 220px; }
  .connect__content { grid-template-columns: minmax(0, 1fr); }
  .code { min-height: 260px; }
  .leads__inner { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .plans { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1023px) {
  :root {
    --field: 32px;
    --sec: 72px;
    --h2: 36px;
    --h3: 28px;
    --h4: 20px;
    --icon-btn: 48px;
    --dock-b: 20px;
  }
  .hero__visual { width: min(100%, 600px); }

  .about { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .about__lead { max-width: none; }
  .difference { gap: 40px; }

  .player { aspect-ratio: auto; min-height: 520px; }

  .privacy__shield {
    position: static;
    display: block;
    width: min(440px, 70%);
    height: auto;
    margin: -16px auto 8px;
    transform: none;
  }
  .privacy__content { width: 100%; }

  .pricing__head { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pricing__hints { justify-content: flex-start; padding-top: 0; }
  .notes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .note--dark { grid-column: 1 / -1; min-height: 0; }

  .faq__inner { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .faq__side { display: contents; }
  .faq__head { order: 1; }
  .acc { order: 2; }
  .faq__contacts { order: 3; }

  .lead-box { flex-direction: column; }
  .lead-box__text { min-width: 0; }
  .lf { flex: none; width: 100%; }

  .footer__top { flex-direction: column; align-items: flex-start; gap: 32px; }
  .footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .footer__contacts { grid-column: 1 / -1; }
  .footer__bottom { flex-direction: column; align-items: flex-start; gap: 24px; }
  .footer__legal { flex-wrap: wrap; gap: 12px 32px; }

  .dock__nav { gap: 24px; padding: 0 24px; }
  .dock__cta { padding: 0 20px; }
}

@media (max-width: 767px) {
  :root {
    --field: 16px;
    --gap: 12px;
    --sec: 64px;
    --h1: clamp(30px, 9.5vw, 52px);
    --h2: clamp(28px, 7.6vw, 34px);
    --h3: 26px;
    --h4: 19px;
    --body: 16px;
    --body-big: 17px;
    --label: 16px;
    --btn-h: 52px;
    --icon-btn: 44px;
    --dock-b: 12px;
  }
  .btn { padding: 0 20px; }
  .pill { gap: 8px; padding: 8px 14px; font-size: 13px; }

  .site-header { padding: 12px 0; }
  .site-header__inner { height: 48px; }
  .site-header .btn { display: none; }
  .logo { gap: 10px; }
  .logo__mark { width: 36px; height: 36px; }
  .socials { gap: 8px; }
  .icon-btn { border-radius: 10px; }
  .icon-btn__svg--max { width: 24px; height: 24px; }
  .icon-btn__svg--tg { width: 22px; height: 20px; }
  .icon-btn__svg--vk { width: 26px; height: 15px; }

  .hero__inner { gap: 40px; padding: 96px var(--field) 48px; }
  .hero__content { gap: 24px; }
  .hero__text { gap: 16px; }
  .hero__actions { flex-direction: column; align-self: stretch; gap: 12px; }
  .hero__actions .btn { width: 100%; }
  .trust__item { align-items: flex-start; font-size: 15px; }
  .hero__visual { width: min(100%, 440px); aspect-ratio: 25 / 27; }
  .hero__orb { left: 14%; top: 0; width: 72%; }
  .chip--a { left: 0; top: 3%; }
  .chip--b { right: 0; top: 52%; }
  .chip--c { right: 0; top: auto; bottom: 0; }
  .subs { left: 0; top: auto; bottom: 12%; }

  .plate, .audience, .leads, .pricing { margin-top: -24px; border-radius: 24px; }
  .about { gap: 32px; }
  .about__text { gap: 16px; }
  .setting { align-items: flex-start; gap: 16px; min-height: 0; padding: 16px; border-radius: 16px; }
  .setting__tile { width: 56px; height: 56px; border-radius: 14px; }
  .setting__text { gap: 6px; }
  .difference { gap: 32px; }
  .cards { grid-template-columns: minmax(0, 1fr); }
  .card { min-height: 0; gap: 28px; padding: 24px; border-radius: 20px; }
  .card__text { gap: 10px; }

  .manifest__inner { gap: 28px; padding: 72px var(--field); }
  .manifest__orb { width: 96px; height: 96px; }
  .manifest__title { font-size: clamp(24px, 6.8vw, 30px); }

  .features { --ft-gap: 28px; --ft-title: 21px; --ft-row: 16px; }
  .frow__head { gap: 14px; padding-right: 0; }
  .frow__body { padding-left: 0; padding-right: 0; }
  .is-static .frow__img { margin-top: 16px; border-radius: 12px; }

  .player { min-height: 480px; gap: 20px; padding: 20px; }
  .player__play { width: 64px; height: 64px; }
  .player__center { gap: 20px; }
  .player__caption { width: auto; }
  .player__text { font-size: 15px; }
  .player__note { gap: 12px; padding: 16px; }
  .player__disclaimer { gap: 10px; font-size: 14px; }
  .player__disclaimer .icon { width: 20px; height: 20px; }

  .audience__head .btn { margin-top: 8px; align-self: stretch; }
  .audience__cards { gap: 12px; }
  .seg { flex-direction: column; min-height: 0; gap: 20px; padding: 20px; border-radius: 20px; }
  .seg__img { width: 100%; height: auto; aspect-ratio: 16 / 10; border-radius: 14px; }
  .seg__text { gap: 14px; }

  .keys__pic { aspect-ratio: 4 / 3; border-radius: 16px; }
  .keys__orb { width: 22.31%; }
  .banner__img { aspect-ratio: 4 / 3; border-radius: 16px; }

  .connect__inner { gap: 32px; }
  .steps { grid-template-columns: minmax(0, 1fr); }
  .step { min-height: 0; gap: 12px; padding: 24px; }
  .code { min-height: 0; }
  .code__bar { height: 52px; padding: 0 20px; }
  .code__body { padding: 20px; }
  .code__line { font-size: 15px; }
  .editor__mark { align-items: flex-start; }

  .leads__inner { gap: 32px; }
  .leads__text { gap: 28px; }
  .lines li { padding: 12px 0; }
  .crm__tabs { overflow-x: auto; scrollbar-width: none; }
  .crm__tab { height: 44px; padding: 0 16px; font-size: 15px; }
  .crm__card { border-radius: 20px; }
  .tg__head { height: auto; padding: 14px 16px; }
  .tg__feed { padding: 16px; }
  .tg__msg { padding: 14px 16px 12px; font-size: 14px; }
  .b24__head { height: auto; padding: 14px 16px; }
  .b24__body { padding: 16px; }
  .b24__title { flex-direction: column; align-items: flex-start; gap: 10px; }
  .b24__stages { flex-wrap: wrap; }
  .b24__fields { grid-template-columns: minmax(0, 1fr); padding: 12px 16px; }
  .b24__table { padding: 10px 16px; }
  .b24__row { grid-template-columns: minmax(0, 1fr) 56px 84px; gap: 10px; font-size: 14px; }
  .b24__comment { font-size: 14px; }
  .amo { padding: 20px 16px; }
  .amo__head { flex-direction: column; align-items: flex-start; gap: 8px; }
  .amo__tags { flex-wrap: wrap; }
  .amo__note { padding: 14px 16px; font-size: 14px; }

  .privacy__shield { width: min(320px, 80%); }
  .privacy__content { gap: 32px; }
  .privacy__list { gap: 28px; }
  .pitem { gap: 12px; }
  .pitem__num { width: 32px; }

  .pricing__inner { gap: 28px; }
  .pricing__hints { flex-direction: column; align-items: flex-start; gap: 8px; }
  .hint { height: auto; min-height: 44px; padding: 10px 16px 10px 14px; white-space: normal; }
  .plans { grid-template-columns: minmax(0, 1fr); }
  .plan { padding: 24px; border-radius: 20px; }
  .plan__terms { min-height: 0; }
  .plan__badge { top: 24px; right: 24px; }
  .notes { grid-template-columns: minmax(0, 1fr); padding-top: 28px; }
  .note { min-height: 0; padding: 24px; border-radius: 20px; }
  .note--dark .btn { align-self: stretch; }

  .faq__head { gap: 24px; }
  .acc__q { gap: 12px; padding: 16px 0; font-size: 18px; }
  .acc__a p { padding: 0 0 16px; }

  .lead-box { gap: 24px; padding: 16px; border-radius: 16px; background-size: cover; }
  .lead-box__text { gap: 32px; padding: 8px 4px 0; }
  .lead-box__head { gap: 16px; }
  .lead-box__contacts { gap: 20px; }
  .lf { padding: 24px 16px; border-radius: 16px; }
  .lf__body { gap: 20px; }
  .lf__title { font-size: 24px; }
  .lf__fields { gap: 10px; }
  .lf__input { height: 52px; padding: 0 16px; }
  .lf__submit { height: 52px; font-size: 17px; }
  .select__chev { right: 16px; }
  .select__opt { height: 44px; padding: 0 16px; font-size: 16px; }
  .consent__text { font-size: 13px; }
  .lf__done-title { font-size: 28px; }

  .footer { background-size: cover; }
  .footer__inner { gap: 40px; padding: 48px var(--field) calc(48px + var(--dock-b) + var(--dock-h)); }
  .footer__logo { font-size: 56px; }
  .footer__desc { font-size: 18px; }
  .footer__actions { flex-wrap: wrap; gap: 16px; }
  .footer__link-big { font-size: 18px; }
  .footer__col { gap: 16px; }
  .footer__col-title { font-size: 15px; }
  .footer__list { gap: 12px; }
  .footer__list a { font-size: 16px; }
  .footer__bottom { font-size: 15px; }
  .footer__legal { flex-direction: column; gap: 8px; }

  .modal { grid-template-columns: minmax(0, 1fr); padding: 12px; }
  .modal__card { max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); padding: 48px 16px 20px; }
  .modal__close { top: 10px; right: 10px; }
  .mf__head { margin-bottom: 8px; }
  .mf__title { font-size: 26px; }
  .mf__seg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mf__tab { height: 44px; }

  .dock-shade { height: 120px; }
  .dock { left: var(--field); right: var(--field); bottom: calc(var(--dock-b) + env(safe-area-inset-bottom, 0px)); transform: none; }
  .dock__nav { display: none; }
  .dock__cta { flex: 1; justify-content: center; }
  .to-top { width: 44px; height: 44px; bottom: calc(var(--dock-b) + var(--dock-h) + 12px + env(safe-area-inset-bottom, 0px)); }
  .cookies {
    left: var(--field);
    right: var(--field);
    bottom: calc(var(--dock-b) + var(--dock-h) + 12px + 44px + 12px + env(safe-area-inset-bottom, 0px));
    width: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 16px;
  }
  .cookies__text { font-size: 14px; }
  .cookies__btn { width: 100%; }
}

@media (max-width: 389px) {
  :root {
    --h2: 26px;
    --h3: 24px;
    --icon-btn: 40px;
  }
  .pill { font-size: 12px; }
  .crm__tab { padding: 0 12px; font-size: 14px; }
  .footer__logo { font-size: 48px; }
}