/* Дизайн-слой по макетам Ильи. Первый экран (.v1) не трогаем. */

:root{
  --page:#ffffff;
  --lav:#f4f3f7;
  --lav-soft:#eeeaf9;
  --card:#ffffff;
  --accent:#e93d8d;
  --accent-dark:#c9247a;
  --violet:#5e5391;
  --text:#2e2e35;
  --muted:#5f5d68;
  --line:#e2dcf4;
  --r-card:20px;
  --r-panel:28px;
  --wrap:1280px;
  --gap:clamp(56px,7vw,104px);
  --ui:'Nunito','Onest',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* Типографика: один шрифт со страницей первого экрана, лёгкие заголовки */
body{background:var(--page);color:var(--text);font:400 16px/1.55 var(--ui)}
main h2,main h3,main h4,
.footer p,.header,.modal{font-family:var(--ui)}
main h2{font-weight:600;font-size:clamp(30px,3.5vw,52px);line-height:1.1;letter-spacing:-.02em;color:var(--text);max-width:22ch}
main h2 em{font-style:normal;color:var(--accent)}
main h3{font-weight:500;letter-spacing:-.01em;color:var(--text)}
.lead,main p{color:var(--muted)}
.lead{font-size:clamp(16px,1.3vw,19px);line-height:1.55;max-width:62ch}
.small,.fine{font-size:14px;color:var(--muted)}

/* Секции и контейнер */
.container{max-width:var(--wrap);padding-inline:clamp(16px,4vw,64px)}
.section{padding:var(--gap) 0}

/* Шапка */
.header{box-shadow:0 1px 0 var(--line)}
.header-inner{gap:clamp(14px,1.7vw,30px);padding-top:18px;padding-bottom:18px}
.brand{width:128px}
.header-rating{align-items:baseline;gap:0 8px;padding:8px 14px;border-radius:14px;background:var(--lav-soft)}
.header-rating b{font-size:20px;color:var(--violet)}
.header-rating small{font-size:11.5px;color:var(--muted);margin-top:2px}
.header-nav{gap:clamp(12px,1.5vw,26px);font-size:15px;font-weight:400}
.header-nav a{opacity:1;color:var(--muted)}
.header-nav a:hover{color:var(--accent)}
.header-contact a{font-size:18px;font-weight:600;color:var(--text)}
.header-contact span{font-size:12px;color:var(--muted)}
.header .btn{min-height:46px;padding:12px 22px;font-size:15px}

/* Кнопки */
.btn, .tabs button{font-family:var(--ui)}
.btn{min-height:52px;padding:14px 28px;border-radius:999px;background:var(--accent);color:#fff;font-weight:600;font-size:16px;box-shadow:none;gap:10px}
.btn:hover{background:var(--accent-dark)}
.btn--lg{min-height:56px;padding:16px 32px;font-size:17px}
.btn::after{content:"→";font-size:17px;line-height:1}
.btn.outline{background:transparent;border:1.5px solid var(--line);color:var(--text)}
.btn.outline:hover{background:var(--lav-soft);border-color:var(--violet);color:var(--violet)}
.btn--ghost{background:none;color:var(--muted);min-height:auto;padding:12px 18px}
.btn--ghost::after{content:none}
.btn--ghost::before{content:"←";margin-right:2px}
.modal-close::after{content:none}

/* Карточки */
.card, .choice, .doc, .calc, .contract{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:none}
.card{padding:26px}
.card h3{font-size:19px;margin-bottom:10px}
.card p{font-size:15px}

/* Иконка-линия в фирменном розовом */
.ico{display:block;width:30px;height:30px;color:var(--accent);margin-bottom:16px}
.ico svg{width:100%;height:100%}

/* Рассрочка и калькулятор */
#finance .container{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:24px 48px;align-items:start}
#finance h2{grid-column:1}
#finance>.container>.lead{grid-column:1;margin:0}
.calc{padding:28px;box-shadow:0 18px 50px rgba(94,83,145,.08)}
.calc .btn{width:100%;margin-top:16px}

/* Варианты лечения */
.choice{padding:26px;position:relative}
.choice .n{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--lav-soft);color:var(--violet);font-size:14px;font-weight:600;letter-spacing:0;margin-bottom:16px}
.choice h3{font-size:19px;margin:0 0 10px}
.choice p{font-size:15px}
.opt{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 20px;min-height:56px}
.opt:hover{background:var(--lav);border-color:var(--violet)}
.opt input{border-color:#cfc7e4}
.opt input:checked{background:var(--accent);border-color:var(--accent)}
.opt:has(input:checked){border-color:var(--accent);background:#fff}
.flag{width:28px;height:28px;background:none;font-size:20px}

/* Баннер акции */
.promo{background:var(--lav);color:var(--text);margin:0 auto;max-width:calc(var(--wrap) - 2*clamp(16px,4vw,64px));border-radius:var(--r-panel)}

/* Комфорт и СтАР */
.sleep{background:var(--lav);border-radius:var(--r-panel)}

/* Эстетика и шкала оттенков */
.shade{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:20px;margin-top:28px}
.drop{border:1.5px dashed #cfc3ea;background:var(--lav);color:var(--violet)}
.drop:hover{background:var(--lav-soft)}
.drop span{color:var(--text)}
.drop small{color:var(--muted)}

/* Гарантии */
.steps{counter-reset:s;grid-template-columns:repeat(3,1fr);gap:16px}
.steps li{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:22px;border-bottom:1px solid var(--line)}
.steps li::before{position:static;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;font-size:14px;font-weight:600;margin-bottom:14px}
.steps b{font-weight:500;font-size:17px}
.contract{padding:26px}
.doc{padding:16px}
.doc h3{font-size:17px;font-weight:600}
.doc small{color:var(--muted);display:block;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:12px}

/* Маршрут */
.tabs{background:none;border:0;padding:0;gap:10px}
.tabs button{background:var(--card);border:1px solid var(--line);color:var(--muted);min-height:48px;font-weight:500}
.tabs button[aria-selected="true"]{background:var(--accent);color:#fff;border-color:var(--accent)}

/* Подвал */
.footer{background:var(--page);padding:48px 0 0;color:var(--muted)}
.footer .container{display:grid;grid-template-columns:auto 1fr;gap:12px 40px;align-items:start}
.footer p{margin:0;font-size:14px;line-height:1.5}
.footer .warn{grid-column:1/-1;margin-top:36px;padding:18px;background:var(--lav);border-radius:14px;text-align:center;
  letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:var(--muted)}

/* Модалка */
.modal-body{border-radius:var(--r-panel)}
.modal-body h3{font-weight:500}
.modal-list li::before{background-color:var(--lav-soft)}
.modal-form input[type=tel]{border-radius:14px;height:52px}

/* Иллюстрации из набора элементов */
.promo{position:relative;overflow:hidden}

.choice{position:relative;overflow:hidden;padding-top:26px}
.choice h3{max-width:78%}

.quiz-art{display:block;width:72%;max-width:300px;height:auto;margin:20px auto -12px;pointer-events:none}

/* Адаптив */
@media (max-width:1000px){
  #finance .container{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .choice h3{max-width:70%}
  .steps{grid-template-columns:1fr}
  .footer .container{grid-template-columns:1fr}
}
/* ссылки площадок в рейтинге шапки */
.header-rating small{text-decoration:none}
.header-rating small a{color:inherit;text-decoration:underline;text-decoration-color:var(--lavender,#b9a7ea);text-underline-offset:3px;transition:color .2s}
.header-rating small a:hover{color:var(--accent)}