/* /consult — запись на бесплатную консультацию. Стиль «Олимпологии» (olimp-v2.css), здесь только своё: префикс cs- */

/* первый экран: текст + компьютер; календарь — отдельным блоком #book. Сверху полоса страницы .ov-lh из olimp-v2 */
.cs-hero{padding:18px 0 36px;background:linear-gradient(180deg,var(--paper) 0%,var(--bg) 100%)}
.cs-hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.cs-hero-text{display:flex;flex-direction:column;min-width:0}
.cs .cs-h1 b{display:block}  /* в первом экране выделение — своей строкой; в h2 — в строку, если помещается */
.cs-sub{margin:10px 0 0;font-size:15.5px;line-height:1.45;font-weight:600;color:var(--muted)}
.cs-tags{margin-top:16px}
.cs-for{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:4px;font-size:13.5px;font-weight:600;color:var(--muted);line-height:1.4}
.cs-for li{position:relative;padding-left:14px}
.cs-for li::before{content:'';position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--primary)}
.cs-cta{display:flex;margin-top:20px}
/* на телефоне кнопка сразу под тегами, чтобы была видна без прокрутки; «для кого» и тренеры — под ней */
@media (max-width:999px){.cs-cta{order:1}.cs-for,.cs-who{order:2}}
.cs-cta .ov-btn{flex:1}
/* визуал: компьютер с тильдовской /consult на фирменном круге (как основатель на «Олимпологии») */
.cs-hero-visual{position:relative;height:190px;display:flex;justify-content:center;align-items:flex-end}
.cs-glow{position:absolute;left:50%;bottom:-6%;width:200px;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:var(--primary);opacity:.9}
html.dark .cs-glow{opacity:.75}
.cs-hero-visual img{position:relative;height:100%;width:auto;max-width:100%;object-fit:contain}
/* кто проводит — лица тренеров, ссылка на блок с людьми */
.cs-who{display:flex;align-items:center;gap:12px;margin-top:20px;padding:10px 14px 10px 10px;border-radius:18px;background:var(--primary-soft);color:var(--fg);text-decoration:none;font-size:13.5px;font-weight:700;line-height:1.35;transition:transform .15s}
.cs-who:hover{transform:translateY(-1px)}
.cs-faces{display:flex;flex:none}
.cs-faces img{width:34px;height:34px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px var(--bg)}
.cs-faces img+img{margin-left:-9px}

/* блок записи: заголовок слева, карточка виджета на всю ширину (виджет Learn станет двухколоночным: предметы слева, время справа) */
.cs-book{margin-top:16px}
/* календарь Learn: виджет прозрачный, фон и рамка — наши */
.cs-book{min-width:0;padding:10px 6px 4px;border-radius:24px;background:var(--card);border:1px solid var(--card-line);box-shadow:var(--shadow-soft)}
.cs-book iframe{display:block;width:100%;height:620px;border:0;background:transparent;color-scheme:light}  /* у документа виджета схема light: совпадает — фон за рамкой прозрачный, иначе браузер заливает его белым */

/* разделы ниже — своей высоты, не «блок = экран» */
.cs .cs-sec{min-height:0}

/* что вы получите */
.cs-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:16px}
.cs-card{position:relative;overflow:hidden;padding:18px 92px 18px 18px;border-radius:20px;background:var(--card);border:1px solid var(--card-line)}
.cs-card h3{margin:0;font-size:17px;line-height:1.2;font-weight:800;text-wrap:balance}
.cs-card p{margin:8px 0 0;font-size:14.5px;line-height:1.45;color:var(--muted)}
.cs-card-ic{position:absolute;right:-14px;bottom:-14px;width:96px;height:96px;object-fit:contain;opacity:.9;pointer-events:none}
html.dark .cs-card-ic{opacity:.75}

/* поддержка: Telegram и MAX; отступ от последнего вопроса — как между вопросами и чуть больше */
.cs .ov-faq-sup{margin-top:14px}
/* телефон: под плашкой поддержки место для закреплённой кнопки, чтобы она не перекрывала Telegram/MAX */
@media (max-width:999px){.cs .ov-faq{padding-bottom:96px}}
.cs-sup .ov-sup-bs{grid-template-columns:repeat(2,minmax(0,1fr))}

/* закреплённая кнопка записи */
.cs-sticky .ov-btn small{font-weight:700}

@media (min-width:1000px){
  .cs-hero{padding:0;min-height:calc(100svh - 60px);display:flex;flex-direction:column;justify-content:center}
  .cs-hero>.wrap{width:100%}
  .cs-hero-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:center}
  .cs .cs-h1{font-size:48px;text-wrap:balance}
  .cs-sub{margin-top:16px;font-size:19px;max-width:640px}
  .cs-tags{margin-top:28px}
  .cs-for{margin-top:22px;font-size:15.5px;gap:6px}
  .cs-cta{margin-top:34px}
  .cs-cta .ov-btn{flex:none}
  .cs-hero-visual{order:0;height:auto;aspect-ratio:1100/980}
  .cs-glow{width:78%;bottom:4%}
  .cs-hero-visual img{height:auto;width:100%}
  .cs-who{margin-top:26px;width:max-content;max-width:560px;font-size:15px;padding:12px 18px 12px 12px}
  .cs-faces img{width:40px;height:40px}
  .cs-faces img+img{margin-left:-10px}
  .cs-booking .ov-h2{max-width:none}
  .cs-book{margin-top:30px}
  .cs-book{padding:16px 14px 8px;border-radius:28px}
  .cs .cs-sec{padding:72px 0}
  .cs-cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:30px}
  .cs-card{padding:22px 22px 110px;min-height:280px}
  .cs-card h3{font-size:19px}
  .cs-card p{font-size:15.5px}
  .cs-card-ic{width:120px;height:120px;right:-16px;bottom:-18px}
  .cs-sup .ov-sup-bs{grid-template-columns:repeat(2,auto)}
  .cs .ov-faq-list{min-height:380px}  /* ответы короткие — окно ответа ниже, чем в «Олимпологии» */
  .cs .ov-faq-sup{margin:0}
  .cs .ov-faq-a{bottom:calc(var(--cs-sup-h,90px) + 20px)}  /* между ответом и «Остались вопросы?» — 20px при любой высоте плашки (высоту ставит consult.js) */
}
@media (min-width:1000px) and (max-width:1199px){
  .cs .cs-h1{font-size:40px}
  .cs-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cs-card{min-height:0;padding-bottom:22px;padding-right:120px}
}

/* эксперты: предмет — чипом сверху, под именем — вуз и факультет */
#team .cs-tm-subj{display:inline-flex;margin-bottom:6px;padding:4px 10px;border-radius:99px;background:var(--primary-soft);color:var(--accent-small);font-size:12.5px;font-weight:800;line-height:1.25}
#team .ov-tm-r{color:var(--muted);font-weight:700}
