/* Лендинг 719-навигатор.рф — перенос макета «Navigator 719 Landing v2» (Claude Design, дизайн-система
   TPPDesignSystem). Размеры, цвета и радиусы взяты из макета и его компонентов дословно; мобильная
   адаптация — своя (в макете её нет). Шрифт Inter Tight — локально (OFL 1.1, см. fonts/README.md). */

@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/inter-tight-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/inter-tight-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/inter-tight-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/inter-tight-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --font: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --text: #3C3F42;
  --text-85: rgba(60, 63, 66, .85);
  --text-80: rgba(60, 63, 66, .8);
  --text-60: rgba(60, 63, 66, .6);
  --line: rgba(60, 63, 66, .2);
  --line-soft: rgba(60, 63, 66, .1);
  --gray: #F7F8FA;
  --white: #FFFFFF;
  --blue: #213882;
  --blue-07: rgba(33, 56, 130, .07);
  --ring: inset 0 0 0 1px rgba(33, 56, 130, .1);
  --red: #D83332;
  --grad: linear-gradient(241.028deg, #233986 3.32%, #03050C 96.77%);
  --grad-invers: linear-gradient(241.028deg, #03050C 15.19%, #233986 90.51%);
  --grad-tab: linear-gradient(243.379deg, #233986 3.47%, #03050C 96.94%);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }  /* иначе display:flex у .form и .sent перебивает атрибут */
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); font-family: var(--font); color: var(--text);
  -webkit-font-smoothing: antialiased; }
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--text); }
button { font-family: inherit; }
input::placeholder { color: rgba(60, 63, 66, .4); }
.wrap { max-width: 1366px; margin: 0 auto; padding: 0 20px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- шапка ---- */
.hdr { position: sticky; top: 0; z-index: 20; margin: 0 -20px; padding: 12px 20px;
  background: rgba(255, 255, 255, .88); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  transition: box-shadow .2s; }
.hdr.scrolled { box-shadow: 0 1px 0 rgba(33, 56, 130, .1); }
.hdr-in { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 20px; }
.brand { display: flex; align-items: center; gap: 14px; flex: none; color: var(--text); font: 600 16px/1.2 var(--font); }
.brand:hover { color: var(--text); }
.brand svg { display: block; width: 36px; height: 36px; color: var(--blue); flex: none; }
.nav { display: flex; gap: 32px; flex-wrap: wrap; justify-content: center; }
.nav a { color: var(--text); font: 500 16px/1.2 var(--font); }
.nav a:hover { color: var(--blue); }

/* ---- кнопки (компонент Button дизайн-системы: радиус 8, отступ 25 / 15, шрифт 600) ---- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 8px;
  cursor: pointer; padding: 25px; font: 600 20px/1.1 var(--font); white-space: nowrap; color: var(--text);
  background: var(--white); transition: background .2s, color .15s; }
.btn:hover { color: var(--blue); }
.btn svg { width: 20px; height: 20px; flex: none; }
.btn-sm { padding: 15px; font-size: 16px; }
.btn-sm svg { width: 16px; height: 16px; }
.btn-primary { color: #fff; background: var(--grad); }
.btn-primary:hover { color: #fff; background: var(--grad-invers); }
.btn-secondary { background: var(--gray); }
.btn-block { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }

/* ---- первый экран ---- */
.hero { position: relative; margin-top: 8px; background: var(--gray); border-radius: 16px; overflow: hidden; }
.hero-in { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: clamp(24px, 3vw, 40px); align-items: center; padding: 100px clamp(24px, 4vw, 40px) 140px; }
.hero-copy { min-width: 0; display: flex; flex-direction: column; }
.hero h1 { margin: 0; font: 600 clamp(44px, 6vw, 80px)/1 var(--font); letter-spacing: -.02em; }
.hero-lead { margin: 32px 0 0; max-width: 480px; font: 400 20px/1.35 var(--font); color: var(--text-80); }
.hero-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 40px; }

/* ⚠ Высота карточки НЕ фиксированная (14.10.2026): при `height: 440px` на окне 820–1100 px текст не
   влезал, флекс сжимал пузырь вопроса (его `min-height` снимает защиту от сжатия ниже содержимого) —
   вопрос наезжал на подпись, подвал обрезался. Место держат невидимые копии ВСЕХ примеров в той же
   ячейке сетки (`.demo-sizer`, их строит app.js из DEMO): карточка по самому длинному и не прыгает. */
.demo { min-width: 0; width: 100%; max-width: 600px; justify-self: end; min-height: 440px; background: var(--white);
  border-radius: 16px; box-shadow: var(--ring); padding: 28px; display: flex; flex-direction: column; gap: 18px;
  overflow: hidden; }
.demo-stage { display: grid; }
.demo-stage > * { grid-area: 1 / 1; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.demo-sizer { visibility: hidden; }
.demo-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.demo-title { font: 600 14px/1.2 var(--font); }
.dots { display: flex; gap: 6px; }
.dots span { width: 6px; height: 4px; border-radius: 2px; background: var(--line); transition: width .3s, background .3s; }
.dots span.on { width: 20px; background: var(--blue); }
.bubble { align-self: flex-end; max-width: 400px; min-height: 22px; background: var(--gray);
  border-radius: 12px 12px 4px 12px; padding: 14px 16px; font: 400 16px/1.4 var(--font); transition: opacity .25s; }
.caret { display: inline-block; width: 2px; height: 18px; margin-left: 2px; vertical-align: -3px; background: var(--blue); }
.demo-label { font: 500 12px/1.2 var(--font); color: var(--text-60); transition: opacity .25s; }
.demo-a { margin: 0; font: 400 16px/1.45 var(--font); color: var(--text-85); transition: opacity .45s, transform .45s; }
.refs { display: flex; gap: 8px; flex-wrap: wrap; transition: opacity .45s .15s, transform .45s .15s; }
.ref { background: var(--blue-07); color: var(--blue); border-radius: 4px; padding: 6px 8px; font: 500 14px/1.2 var(--font); }
.fade { opacity: 0; transform: translateY(8px); }
.gone { opacity: 0; }
.demo-foot { margin-top: auto; border-top: 1px solid var(--line-soft); padding-top: 14px;
  font: 400 12px/1.35 var(--font); color: var(--text-60); }

/* ---- секции ---- */
.sec { padding: 160px 20px 0; display: flex; flex-direction: column; gap: 48px; scroll-margin-top: 88px; }
.sec h2 { margin: 0; font: 500 54px/1.15 var(--font); }
.sec-head { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.sub { font: 400 20px/1.35 var(--font); color: var(--text-80); max-width: 640px; }

.cards3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.fcard { background: var(--gray); border-radius: 16px; padding: 40px; display: flex; flex-direction: column; gap: 40px; min-height: 260px; }
.fcard-t { font: 500 40px/1.2 var(--font); }
.fcard-d { margin-top: auto; font: 400 20px/1.35 var(--font); color: var(--text-80); }

/* ---- тарифы ---- */
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.plan { background: var(--white); border-radius: 16px; box-shadow: var(--ring); padding: 32px; display: flex;
  flex-direction: column; gap: 24px; min-height: 460px; }
.plan.featured { box-shadow: inset 0 0 0 1px var(--blue); }
.plan.org { background: var(--gray); box-shadow: none; }
.plan-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 28px; }
.plan-name { font: 600 24px/1.25 var(--font); }
.badge { background: var(--blue-07); color: var(--blue); border-radius: 4px; padding: 6px 8px; font: 500 12px/1.2 var(--font); }
.plan-desc { font: 400 16px/1.4 var(--font); color: var(--text-80); }
.plan-price { margin-top: auto; display: flex; flex-direction: column; gap: 6px; }
.price { font: 500 40px/1.2 var(--font); }
.price-note { font: 400 14px/1.4 var(--font); color: var(--text-60); }
.org-list { display: flex; flex-direction: column; gap: 12px; font: 400 16px/1.4 var(--font); color: var(--text-85); }
.org-list div { display: flex; gap: 10px; align-items: center; }
.org-list svg { width: 16px; height: 16px; flex: none; color: var(--blue); }
.plan.org .btn { margin-top: auto; }
.fine { font: 400 12px/1.3 var(--font); color: var(--text-60); max-width: 960px; }
/* витрина по образцу Нейроюриста (09.10.2026): вкладки, проба за 1 ₽, опция, период и число пользователей */
.pricing-head h2 { font-size: clamp(32px, 4vw, 48px); }
.plans[hidden], .fine[hidden] { display: none; }
.plan.promo { position: relative; }
.plans .price { font-size: 26px; }
.price-old { font: 500 18px/1.2 var(--font); color: var(--text-60); text-decoration: line-through; }
.addon { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border-radius: 10px; background: var(--gray);
  cursor: pointer; font: 400 14px/1.35 var(--font); color: var(--text-80); }
.plan.org .addon { background: var(--white); }
.addon input { margin: 2px 0 0; width: 16px; height: 16px; accent-color: var(--blue); flex: none; }
.addon .incl-check { width: 16px; height: 16px; margin-top: 2px; border-radius: 4px; flex: none; display: inline-flex;
  align-items: center; justify-content: center; background: var(--blue); color: #fff; }
.addon.incl { cursor: default; }
.addon b { display: block; font-weight: 500; color: var(--text); }
.addon small { display: block; margin-top: 2px; font-size: 12px; color: var(--text-60); }
.btn-2l { flex-direction: column; gap: 3px; line-height: 1.1; }
.btn-2l small { font: 500 12px/1.2 var(--font); opacity: .85; }
/* цены из презентации (14.10.2026): сумма не рвётся переносом (разряды — обычный пробел); у корпоративных
   число держит `.sum`, а «₽/год» при 500 пользователях за год может уйти строкой ниже — не за край карточки */
.plan:not(.promo):not([data-corp]) .price, .sum, .price-old, .price-sub, .org-price { white-space: nowrap; }
.price-sub { font: 400 13px/1.3 var(--font); color: var(--text-60); }
.org-price { font: 500 22px/1.2 var(--font); color: var(--text); }
.org-steps { display: block; margin: 0; padding-left: 22px; }
.org-steps li + li { margin-top: 12px; }
.org-steps li::marker { color: var(--blue); font-weight: 600; }
.plans-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 380px)); justify-content: center; }
.btn-dark { color: #fff; background: var(--text); }
.btn-dark:hover { color: #fff; background: #03050C; }
.org-actions { margin-top: auto; display: flex; flex-direction: column; gap: 10px; }
.plan.org .org-actions .btn { margin-top: 0; }
.plan-ctl { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.mini-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 8px; background: var(--gray); }
.mini-seg label { position: relative; cursor: pointer; }
.mini-seg input { position: absolute; opacity: 0; pointer-events: none; }
.mini-seg span { display: block; padding: 7px 11px; border-radius: 6px; font: 600 14px/1.1 var(--font); color: var(--text-60); }
.mini-seg input:checked + span { background: var(--white); color: var(--text); box-shadow: var(--ring); }
.mini-seg input:focus-visible + span { outline: 2px solid var(--blue); outline-offset: 1px; }
.seats { display: inline-flex; align-items: center; gap: 4px; }
.seats input { width: 54px; height: 32px; text-align: center; border: 1px solid var(--line); border-radius: 6px;
  font: 500 15px/1 var(--font); color: var(--text); -moz-appearance: textfield; }
.seats input::-webkit-outer-spin-button, .seats input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.seat-btn { width: 32px; height: 32px; border: 0; border-radius: 6px; background: var(--gray); color: var(--text);
  font: 600 18px/1 var(--font); cursor: pointer; }
.seat-btn:hover { color: var(--blue); }
.seats-l { font: 400 13px/1.2 var(--font); color: var(--text-60); }
#pricing .fine { margin: 0 auto; display: flex; flex-direction: column; gap: 4px; text-align: center; }
#pricing .fine p { margin: 0; }
.tariff-opts { margin-top: 10px; font: 500 14px/1.35 var(--font); color: var(--blue); }

/* ---- кому и зачем ---- */
.seg { display: flex; gap: 4px; background: var(--gray); border-radius: 8px; padding: 4px; flex-wrap: wrap; justify-content: center; }
.seg button { border: 0; cursor: pointer; padding: 14px 22px; border-radius: 6px; background: transparent;
  color: var(--text-60); font: 600 16px/1.1 var(--font); transition: color .15s; }
.seg button:hover { color: var(--text); }
.seg button[aria-selected="true"] { background: var(--grad-tab); color: #fff; }
.aud { background: var(--gray); border-radius: 16px; padding: 40px; display: flex; flex-wrap: wrap; gap: 40px; align-items: stretch; }
.aud-left { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; }
.aud-intro { display: flex; flex-direction: column; gap: 12px; }
.aud-title { font: 500 40px/1.2 var(--font); }
.aud-lead { font: 400 16px/1.4 var(--font); color: var(--text-80); max-width: 460px; }
.acts { display: flex; flex-direction: column; margin-top: 32px; }
.act { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; padding: 20px 0; box-shadow: inset 0 1px 0 var(--line); }
.act-n { font: 500 16px/1.4 var(--font); color: var(--blue); }
.act-t { font: 500 20px/1.35 var(--font); }
.aud-nav { display: flex; align-items: center; gap: 12px; }
.ibtn { border: 0; cursor: pointer; width: 48px; height: 48px; border-radius: 8px; background: var(--white);
  display: flex; align-items: center; justify-content: center; color: var(--text); flex: none; }
.ibtn svg { width: 20px; height: 20px; }
.ibtn.dark { background: var(--grad-tab); color: #fff; }
.ibtn.gray { background: var(--gray); }
.counter { font: 500 16px/1.2 var(--font); color: var(--text-60); padding-left: 8px; }
.chat { flex: 1 1 520px; min-width: 0; max-width: 620px; background: var(--white); border-radius: 16px; box-shadow: var(--ring);
  overflow: hidden; display: flex; flex-direction: column; }
.chat-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 24px;
  box-shadow: inset 0 -1px 0 var(--line-soft); }
.chat-ed { font: 400 12px/1.2 var(--font); color: var(--text-60); }
.chat-body { padding: 28px 24px; display: flex; flex-direction: column; gap: 18px; flex: 1; }
.chat .bubble { max-width: 420px; }
.chat-a { margin: 0; font: 400 16px/1.45 var(--font); color: var(--text-85); }
.chip { background: var(--grad-tab); color: #fff; border-radius: 4px; padding: 2px 6px; font-weight: 500; white-space: nowrap; }
.quote { background: var(--gray); border-radius: 12px; padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; }
.quote-h { font: 600 12px/1.3 var(--font); color: var(--text-60); letter-spacing: .02em; }
.quote-t { font: 400 14px/1.5 var(--font); color: var(--text-80); }
.chat-note { margin-top: auto; font: 400 12px/1.35 var(--font); color: var(--text-60); }

/* ---- заявка ---- */
.formbox { background: var(--gray); border-radius: 16px; padding: 40px; max-width: 989px; width: 100%; margin: 0 auto; }
.form { display: flex; flex-direction: column; gap: 32px; }
.fl { font: 500 16px/1.3 var(--font); color: var(--text-80); }
.tariff { display: flex; flex-direction: column; gap: 12px; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chips button { border: 0; cursor: pointer; padding: 10px 14px; border-radius: 4px; background: var(--white);
  color: var(--text-80); font: 500 16px/1.2 var(--font); }
.chips button:hover { color: var(--text); }
.chips button[aria-pressed="true"] { background: var(--blue); color: #fff; }
.fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px 20px; }
.field { display: flex; flex-direction: column; gap: 12px; }
.field input { width: 100%; height: 61px; border: 0; border-radius: 4px; background: var(--white); padding: 0 20px;
  font: 500 16px/1.3 var(--font); color: var(--text); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow .15s; }
.field input:focus { outline: none; box-shadow: inset 0 0 0 1px var(--text); }
.field-wide { grid-column: 1 / -1; }
.field textarea { width: 100%; min-height: 96px; border: 0; border-radius: 4px; background: var(--white); padding: 16px 20px;
  font: 400 18px/1.35 var(--font); color: var(--text); resize: vertical; }
.field textarea:focus { outline: none; box-shadow: inset 0 0 0 1px var(--text); }
.lead-dialog { width: calc(100% - 32px); max-width: 1040px; max-height: calc(100vh - 32px); border: 0; border-radius: 16px;
  padding: 28px; background: var(--white); color: var(--text); }
.lead-dialog::backdrop { background: rgba(3, 5, 12, .45); }
.lead-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lead-dialog-head h2 { margin: 0; font: 500 32px/1.2 var(--font); }
.lead-dialog-sub { margin: 8px 0 20px; font: 400 16px/1.4 var(--font); color: var(--text-80); }
.lead-dialog .formbox { padding: 24px; }
.field.err input { box-shadow: inset 0 0 0 1px var(--red); }
.ferr { font: 400 12px/1.3 var(--font); color: var(--red); }
.ferr:empty { display: none; }
.form-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.consent-wrap { display: flex; flex-direction: column; gap: 6px; }
.consent { position: relative; display: flex; gap: 12px; align-items: flex-start; cursor: pointer; max-width: 520px; }
.consent input { position: absolute; opacity: 0; width: 20px; height: 20px; margin: 0; }
.box { flex: none; width: 20px; height: 20px; border-radius: 2px; background: var(--white);
  box-shadow: inset 0 0 0 1px rgba(60, 63, 66, .8); display: flex; align-items: center; justify-content: center;
  color: #fff; margin-top: 1px; }
.box svg { display: none; width: 12px; height: 10px; }
.consent input:checked + .box { background: var(--blue); box-shadow: none; }
.consent input:checked + .box svg { display: block; }
.consent input:focus-visible + .box { outline: 2px solid var(--blue); outline-offset: 2px; }
.consent.err .box { box-shadow: inset 0 0 0 1px var(--red); }
.consent-t { font: 400 14px/1.4 var(--font); color: var(--text-80); }
.consent-wrap .ferr { padding-left: 32px; }
.form-err { font: 400 14px/1.4 var(--font); color: var(--red); }
.form-err:empty { display: none; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.sent { display: flex; flex-direction: column; gap: 16px; padding: 16px 0; }
.sent-t { font: 500 30px/1.22 var(--font); }
.sent-d { font: 400 16px/1.4 var(--font); color: var(--text-80); }
.linkbtn { border: 0; background: none; padding: 8px 0 0; cursor: pointer; align-self: flex-start;
  font: 500 16px/1.2 var(--font); color: var(--blue); }

/* ---- вопросы ---- */
.sec-faq { align-items: center; }
.faq { width: 100%; max-width: 989px; display: flex; flex-direction: column; }
.qa { box-shadow: inset 0 -1px 0 var(--line); }
.qa-q { border: 0; background: none; cursor: pointer; width: 100%; display: flex; justify-content: space-between;
  align-items: center; gap: 24px; padding: 24px 0; text-align: left; font: 500 20px/1.3 var(--font); color: var(--text); }
.qa-q svg { flex: none; width: 20px; height: 20px; color: var(--text-60); transition: transform .2s; }
.qa-q[aria-expanded="true"] svg { transform: rotate(180deg); }
.qa-a { padding: 0 64px 24px 0; font: 400 16px/1.5 var(--font); color: var(--text-80); max-width: 760px; text-wrap: pretty; }
.qa-a[hidden] { display: none; }

/* ---- подвал ---- */
.foot { padding: 120px 20px; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.disclaimer { max-width: 720px; font: 400 14px/1.45 var(--font); color: var(--text-60); margin: 0; }
.foot-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; font: 400 12px/1.3 var(--font); color: var(--text-60); }
.foot-links a { color: var(--text-60); }
.foot-links a:hover { color: var(--text); }

/* ---- планшет ---- */
@media (max-width: 1100px) {
  .sec { padding-top: 120px; }
  .sec h2 { font-size: 42px; }
  .fcard-t, .aud-title, .price { font-size: 32px; }
  .nav { gap: 20px; }
}

/* ---- телефон (в макете не было — своя адаптация) ---- */
@media (max-width: 760px) {
  .hdr-in { padding: 0; gap: 12px; }
  .nav { display: none; }
  .brand { gap: 10px; font-size: 15px; }
  .brand svg { width: 30px; height: 30px; }
  .hero-in { padding: 48px 20px 40px; }
  .hero-lead { font-size: 17px; margin-top: 20px; }
  .hero-cta { margin-top: 28px; }
  .demo { justify-self: stretch; max-width: none; height: auto; min-height: 400px; padding: 20px; }
  .sec { padding: 80px 0 0; gap: 28px; }
  .sec h2 { font-size: 30px; }
  .sub { font-size: 17px; }
  .fcard { padding: 28px; gap: 20px; min-height: 0; }
  .fcard-t { font-size: 28px; }
  .fcard-d { font-size: 17px; }
  .plan { min-height: 0; padding: 24px; }
  .price { font-size: 30px; }
  .seg { width: 100%; }
  .seg { flex-wrap: nowrap; }
  .seg button { flex: 1 1 0; min-width: 0; padding: 12px 6px; font-size: 14px; }
  .aud { padding: 24px; gap: 28px; }
  .aud-left, .chat { flex-basis: 100%; max-width: none; }
  .aud-title { font-size: 28px; }
  .act { grid-template-columns: 36px minmax(0, 1fr); gap: 12px; padding: 16px 0; }
  .act-t { font-size: 17px; }
  .chat-top { padding: 14px 16px; }
  .chat-body { padding: 20px 16px; }
  .formbox { padding: 24px 20px; }
  .fields { grid-template-columns: 1fr; }
  .form-foot .btn { width: 100%; }
  .btn { padding: 20px; font-size: 17px; }
  .btn-sm { padding: 12px; font-size: 15px; }
  .qa-q { font-size: 17px; padding: 20px 0; }
  .qa-a { padding-right: 0; }
  .foot { padding: 72px 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}