/* Вариант A — студийный: широкий гротеск, крем и почти чёрный, много воздуха, крупные маркеры, бегущая строка. */
:root { --paper: #F5F5F0; --ink: #0F0F0F; --muted: #6d6d66; --line: #d9d9d0; --accent: #FF4A1C; --on-accent: #0F0F0F;
  --font-head: "Unbounded", "Arial Black", Arial, sans-serif; --font-text: "Onest", Arial, Helvetica, sans-serif;
  --shade: linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.18) 35%, rgba(0,0,0,.30) 70%, rgba(0,0,0,.62) 100%);
  --sheet-bg: #0F0F0F; --sheet-ink: #F5F5F0; --sheet-line: #2a2a28; --radius: 14px;
  --card-bg: #F5F5F0; --card-ink: #0F0F0F; --input-bg: #fff; --input-line: #cfcfc6; }

.top__brand { font-weight: 700; font-size: 17px; letter-spacing: -.02em; }
.top__nav a, .top__cta, .hero__scroll, .sound, .block__label, .foot__up, .hero__kicker {
  font-family: var(--font-head); font-weight: 500; font-size: 11px; letter-spacing: .02em; text-transform: uppercase; }
.top__nav a { opacity: .85; } .top__nav a:hover { opacity: 1; }
.top__drop-btn { font-family: var(--font-head); font-weight: 500; font-size: 11px; letter-spacing: .02em; text-transform: uppercase; opacity: .85; }
.top__drop:hover .top__drop-btn, .top__drop:focus-within .top__drop-btn { opacity: 1; }
.top__drop-list a { opacity: 1; } .top__drop-list a:hover, .top__drop-list a[aria-current="page"] { color: var(--accent); }
.top__cta { padding: 12px 18px; border: 1px solid rgba(255,255,255,.7); }
.top__cta:hover { background: #fff; color: var(--ink); }
.top--solid { background: var(--paper); color: var(--ink); }
.top--solid .top__cta { border-color: var(--ink); } .top--solid .top__cta:hover { background: var(--ink); color: var(--paper); }

/* заголовок слева по центру высоты, подпись справа */
.hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 340px); grid-template-rows: 1fr auto 1fr; column-gap: 48px; align-items: center; }
.hero__kicker { grid-column: 1; grid-row: 1; align-self: end; margin-bottom: 18px; opacity: .85; }
.hero__kicker::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 10px; background: var(--accent); border-radius: 50%; }
/* марка = 6.76 кегля в ширину: 8.6vw влезает в колонку заголовка от ~900px, ниже блок «АМС72 / АВТО» встаёт над словом */
.hero__title { grid-column: 1; grid-row: 2; font-weight: 700; font-size: clamp(48px, 8.6vw, 176px); line-height: .9; letter-spacing: -.045em; }
.brandmark__rows { letter-spacing: -.03em; }
.hero__lead { grid-column: 2; grid-row: 2; width: 100%; max-width: 320px; justify-self: end; font-size: 18px; text-shadow: 0 1px 18px rgba(0,0,0,.55); line-height: 1.45; text-align: right; }
.hero__actions { grid-column: 1 / -1; grid-row: 3; align-self: end; display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.hero__scroll { opacity: .8; } .hero__scroll::before { content: "\2193"; margin-right: 8px; }
.sound { opacity: .9; } .sound:hover, .sound[aria-pressed="true"] { opacity: 1; }

.button { height: 52px; padding: 0 26px; font-family: var(--font-head); font-weight: 500; font-size: 11px; letter-spacing: .02em; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
.button--solid { background: #fff; color: var(--ink); } .button--solid:hover { background: var(--accent); }
.button--line { color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.7); } .button--line:hover { background: #fff; color: var(--ink); }
.login__card .button--solid { background: var(--ink); color: var(--paper); } .login__card .button--solid:hover { background: var(--accent); color: var(--ink); }

.ticker { background: var(--ink); color: var(--paper); padding: 22px 0; }
.ticker__track span { font-weight: 600; font-size: clamp(22px, 3vw, 40px); letter-spacing: -.03em; padding: 0 28px; display: inline-flex; align-items: center; }
.ticker__track span::after { content: ""; width: .42em; height: .42em; margin-left: 56px; border-radius: 50%; background: var(--accent); }

.block { border-top: 1px solid var(--line); }
.block__body { display: grid; grid-template-columns: minmax(140px, 1fr) 3fr; column-gap: 48px; row-gap: clamp(40px, 6vw, 88px); }
.block__label { grid-column: 1; color: var(--ink); padding-top: 12px; }
.block__label::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 10px; background: var(--accent); border-radius: 50%; }
.block__title { grid-column: 2; font-weight: 600; font-size: clamp(28px, 4.3vw, 64px); line-height: .98; letter-spacing: -.04em; max-width: 18ch; }
.block__body > :not(.block__label):not(.block__title) { grid-column: 2; }

/* лента отзывов: белые карточки на креме, на тёмной секции — тёмные */
.card { width: 330px; margin-right: 12px; padding: 14px 16px 16px; background: #fff; border: 1px solid var(--line); }
.card__who { font-family: var(--font-head); font-weight: 500; font-size: 10px; letter-spacing: .02em; text-transform: uppercase; color: var(--muted); }
.card__text { margin-top: 10px; font-size: 14px; line-height: 1.4; color: #3c3c38; }
.strip__note { font-family: var(--font-head); font-weight: 500; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.block--edges .card { background: #1a1a18; border-color: #2c2c29; }
.block--edges .card__who { color: #8f8f86; }
.block--edges .card__text { color: #d4d4cb; }
.block--edges .strip__note { color: #8f8f86; }

.theses { grid-template-columns: repeat(3, 1fr); gap: 40px; counter-reset: t; }
.theses--four { grid-template-columns: repeat(4, 1fr); gap: 32px; }
.thesis { counter-increment: t; padding-top: 22px; border-top: 2px solid var(--ink); }
.thesis::before { content: "0" counter(t); font-family: var(--font-head); font-size: 11px; font-weight: 500; color: var(--muted); }
.thesis h3 { margin: 28px 0 14px; font-weight: 600; font-size: 20px; line-height: 1.05; letter-spacing: -.03em; }
.thesis p, .cell__text, .edge__text { color: #3c3c38; }

.grid { grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.cell { padding: 28px 28px 40px 0; border-bottom: 1px solid var(--line); display: grid; gap: 14px; align-content: start; }
.cell__num { font-family: var(--font-head); font-size: 11px; font-weight: 500; color: var(--muted); }
.cell__name { font-weight: 600; font-size: 19px; line-height: 1.08; letter-spacing: -.03em; }
.cell__text { font-size: 16px; }

.block--edges { background: var(--ink); color: var(--paper); border-top: 0; }
.block--edges .block__label { color: var(--paper); }
.edge { display: grid; grid-template-columns: clamp(64px, 9vw, 132px) 1fr; gap: 24px; align-items: start; padding: 32px 0; border-top: 1px solid #2c2c29; }
.edge__mark { font-family: var(--font-head); font-weight: 700; font-size: clamp(48px, 7vw, 104px); line-height: .85; letter-spacing: -.05em; color: var(--accent); }
.edge__name { font-weight: 600; font-size: clamp(19px, 2.2vw, 30px); line-height: 1.05; letter-spacing: -.035em; max-width: 24ch; }
.edge__text { margin-top: 12px; color: #b9b9b0; max-width: 58ch; }

.demos { grid-template-columns: repeat(2, 1fr); gap: 24px; }
.demo { background: #fff; padding: 32px; display: grid; gap: 28px; }
.demo__name { font-weight: 700; font-size: clamp(28px, 3.4vw, 48px); letter-spacing: -.045em; line-height: 1; }
.demo__creds dt { font-family: var(--font-head); font-size: 10px; font-weight: 500; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.link-arrow { font-family: var(--font-head); font-weight: 500; font-size: 11px; text-transform: uppercase; padding-bottom: 4px; border-bottom: 1px solid var(--ink); }
.link-arrow:hover { color: #c93309; border-color: #c93309; }
.demo__note { color: var(--muted); font-size: 15px; }

.foot { background: var(--ink); color: var(--paper); }
.foot__brand { font-weight: 700; font-size: clamp(56px, 13vw, 260px); line-height: .85; letter-spacing: -.05em; overflow-wrap: anywhere; }
.foot__text { color: #b9b9b0; font-size: 15px; }

.login__title { font-weight: 700; font-size: clamp(44px, 8vw, 132px); line-height: .9; letter-spacing: -.045em; margin-top: 16px; }
.login__head { font-weight: 600; font-size: 20px; letter-spacing: -.03em; }
.login__field span { font-family: var(--font-head); font-size: 10px; font-weight: 500; text-transform: uppercase; color: var(--muted); }

@media (max-width: 1279px) { .hero__inner { grid-template-columns: minmax(0, 1fr) minmax(240px, 260px); } .theses--four { grid-template-columns: repeat(2, 1fr); gap: 40px; } }
@media (max-width: 1023px) { .theses, .grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) {
  .hero__inner { grid-template-columns: 1fr; grid-template-rows: 1fr auto auto auto; padding-bottom: 84px; }
  .hero__title { font-size: clamp(40px, 15.5vw, 96px); }
  .hero__lead { grid-column: 1; grid-row: 3; text-align: left; justify-self: start; margin-top: 20px; font-size: 16px; width: 100%; max-width: 360px; }
  .hero__actions { grid-row: 4; justify-content: flex-start; margin-top: 28px; }
  .button { flex: 1 1 auto; }
  .block__body { grid-template-columns: 1fr; }
  .block__label, .block__title, .block__body > :not(.block__label):not(.block__title) { grid-column: 1; }
  .card { width: 260px; padding: 12px 14px 14px; }
  .card__text { font-size: 13px; }
  .theses, .grid, .demos { grid-template-columns: 1fr; }
  .cell { padding-right: 0; }
  .demo { padding: 24px 20px; }
  .login__side { display: none; }
}

/* Скругления (владелец 03.11): кнопки — капсулой, окна, карточки и поля ввода — мягким углом */
.button, .top__cta, .tab { border-radius: 999px; }
.card, .demo, .login__card, .calc__result, .tariff, .bnext a, .stage, .bay a, .act textarea { border-radius: 18px; }
.login__field input { border-radius: var(--radius); }
