/* ============================================================
   СЕКЦИИ — hero, полоса цифр, аудитории, требования, залы,
   шаги, вопросы, контакты, футер.
   ============================================================ */

/* ---------- Заголовок секции: H2 + лид рядом ---------- */
.section-head{
  display:grid;gap:clamp(32px,4vw,64px);margin-top:44px;
  grid-template-columns:1fr;align-items:start;
}
@media (min-width:768px){ .section-head{grid-template-columns:repeat(2,1fr)} }
.section-head .lead{margin:0}
.accent-em{font-style:italic;color:var(--accent)}
.section--dark .accent-em,.section--brand .accent-em{color:var(--lilac-300)}

/* заголовок секции без парного лида (пара «06/08 Как начать», «07/08 Вопросы») —
   тот же отступ от rail, что несёт .section-head в остальных секциях */
.rail + h2{margin-top:44px}

/* компенсация: секция сразу продолжает предыдущий блок без своего верхнего
   воздуха (полоса цифр перед «Ученикам», текст перед лентой залов) */
#students,#halls{padding-top:24px}

#about .grid{margin-top:72px}
#requirements .grid{margin-top:64px}
#start .grid{margin-top:56px}
#start .card{padding:40px 36px 44px}
#start .card h3{margin-top:18px;font-size:25px;line-height:1.2}
#teachers .actions{margin-top:48px}

.halls-caption{margin-top:16px;font-size:13px;color:var(--ink-3)}
.halls-note{margin-top:28px;font-size:16px;line-height:1.6;color:var(--ink-2);max-width:60ch}
.contacts-grid .lead{margin-top:24px}

/* ---------- 1. Hero — фулл-блид кадр ---------- */
.hero{
  position:relative;overflow:hidden;background:var(--plum-900);
  min-height:min(90vh,840px);display:flex;flex-direction:column;justify-content:flex-end;
}
.hero__frame{position:absolute;inset:0}
.hero__frame img{
  width:100%;height:100%;object-fit:cover;object-position:60% 45%;
  filter:saturate(.55) contrast(1.06) brightness(.92);
}
.hero__veil{position:absolute;inset:0}
.hero__veil--1{background:linear-gradient(103deg,rgba(46,20,44,.94) 0%,rgba(52,24,49,.8) 38%,rgba(52,24,49,.34) 72%,rgba(74,36,80,.42) 100%)}
.hero__veil--2{background:linear-gradient(180deg,rgba(46,20,44,.5) 0%,rgba(46,20,44,0) 30%,rgba(30,12,28,.62) 100%)}
.hero__in{
  position:relative;width:100%;
  padding:clamp(120px,16vw,180px) clamp(20px,4vw,32px) clamp(40px,5vw,56px);
}
.hero__badge{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  font:12px/1 var(--font-body);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(245,239,243,.62);
}
.hero__badge b{color:var(--lilac-300);font-weight:600;letter-spacing:.02em}
.hero__badge i{width:28px;height:1px;background:rgba(245,239,243,.35)}
.hero h1{
  margin-top:clamp(20px,2.4vw,30px);color:#fff;
  text-shadow:0 2px 40px rgba(30,12,28,.35);
}
.hero h1 .nowrap{white-space:nowrap}
.hero h1 em{font-style:italic;color:var(--lilac-200)}
.hero__row{
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:clamp(28px,4vw,72px);
  margin-top:clamp(32px,4vw,52px);
}
.hero__lead-col{flex:1 1 420px;max-width:620px}
.hero__lead-col p{
  font-size:var(--fs-lead);line-height:1.6;color:rgba(245,239,243,.88);max-width:46ch;
}
.hero__row .actions{margin-top:28px}
.hero__mos{margin-top:16px;font-size:14px;color:rgba(245,239,243,.6)}
.hero__aside{
  flex:0 1 300px;border-left:1px solid rgba(245,239,243,.28);
  padding:4px 0 4px 24px;
}
.hero__aside p:first-child{
  font-family:var(--font-display);font-style:italic;
  font-size:clamp(17px,1.7vw,22px);line-height:1.35;color:var(--on-dark);
}
.hero__aside p:last-child{
  margin-top:14px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(245,239,243,.55);
}

/* ---------- 1b. Полоса цифр ---------- */
.stats{
  display:grid;grid-template-columns:1fr;
  border-bottom:1px solid rgba(36,31,43,.1);
}
.stats li{padding:32px 0;border-top:1px solid rgba(36,31,43,.1)}
.stats li:first-child{border-top:0}
.stats b{
  display:block;font:400 clamp(40px,5vw,64px)/1 var(--font-display);
  color:var(--accent);letter-spacing:-.03em;font-variant-numeric:tabular-nums;
}
.stats span{display:block;margin-top:12px;font-size:15px;color:var(--ink-2)}
@media (min-width:640px){
  .stats{grid-template-columns:repeat(3,1fr)}
  .stats li{
    padding:44px 32px;border-top:0;border-right:1px solid rgba(36,31,43,.1);
  }
  .stats li:first-child{padding-left:0}
  .stats li:last-child{padding-right:0;border-right:0}
}

/* ---------- 3. Ученикам: нумерованный список + sticky-фото ---------- */
.split-students{
  display:grid;gap:clamp(36px,5vw,72px);align-items:start;
  grid-template-columns:1fr;margin-top:44px;
}
@media (min-width:1024px){ .split-students{grid-template-columns:1.1fr 1fr} }
.numlist{margin-top:44px;border-top:1px solid var(--hairline-2)}
.numlist li{
  display:grid;grid-template-columns:auto 1fr;gap:24px;
  padding:26px 0;border-bottom:1px solid var(--hairline-2);
}
.numlist__num{
  padding-top:4px;font:14px/1 var(--font-display);color:var(--num);
  font-variant-numeric:tabular-nums;
}
.numlist h3{font-size:20px;line-height:1.3}
.numlist p{margin-top:8px;font-size:15px;line-height:1.6;color:var(--ink-2)}
.split-students .actions{margin-top:36px}

.sticky-photo{
  border-radius:var(--radius-card);overflow:hidden;background:#EDE7E0;
}
@media (min-width:1024px){ .sticky-photo{position:sticky;top:104px} }
.sticky-photo img{
  display:block;width:100%;height:clamp(360px,46vw,620px);
  object-fit:cover;filter:saturate(.82) contrast(1.04);
}

/* ---------- 4. Инструкторам: список-сетка + цитата ---------- */
.flist{
  display:grid;grid-template-columns:1fr;gap:0;
  margin-top:64px;border-top:1px solid var(--hairline-dark);
}
@media (min-width:640px){ .flist{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1024px){ .flist{grid-template-columns:repeat(3,1fr)} }
.flist li{padding:26px 0;border-bottom:1px solid var(--hairline-dark)}
@media (min-width:640px){ .flist li{padding-inline:0 clamp(24px,4vw,64px)} }
.flist h3{font-size:20px;line-height:1.3;color:#fff}
.flist p{margin-top:8px;font-size:15px;line-height:1.6;color:rgba(245,239,243,.62)}
.flist__quote{display:flex;align-items:center}
.flist__quote p{
  font-family:var(--font-display);font-style:italic;
  font-size:19px;line-height:1.45;color:var(--lilac-300);margin-top:0;
}

/* ---------- 6. Наши залы: лента + каталог ---------- */
/* Лента идёт во всю ширину окна, не ограничена контейнером 1200 —
   поэтому её не оборачивают в .container, только боковой паддинг совпадает с ним. */
.halls-strip{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,1fr);
  gap:12px;margin-top:56px;
  padding:0 clamp(20px,4vw,32px) 12px;
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
}
.halls-strip::-webkit-scrollbar{display:none}
.halls-strip li{scroll-snap-align:center}
.halls-strip .frame{background:#EDE7E0}
.halls-strip img{height:300px;object-fit:cover;filter:saturate(.8) contrast(1.04)}
@media (min-width:1024px){
  .halls-strip{grid-auto-columns:minmax(300px,1fr)}
}

.catalog{margin-top:56px;border-top:1px solid var(--hairline-3)}
.catalog li{
  display:flex;flex-wrap:wrap;gap:10px 24px;align-items:baseline;
  padding:22px 0;border-bottom:1px solid rgba(36,31,43,.1);
  transition:background 200ms ease;
}
.catalog li:hover{background:var(--surface-warm)}
.catalog__num{
  flex:0 0 72px;font:14px/1 var(--font-display);color:var(--accent);
  font-variant-numeric:tabular-nums;
}
.catalog__name{flex:1 1 210px;font-size:17px}
.catalog__place{flex:1 1 200px;font-size:15px;color:var(--ink-2)}
.catalog__addr{flex:1 1 180px;font-size:15px;color:var(--ink-3)}

/* ---------- 7. Как начать ---------- */
.steps{margin-top:32px}
.steps li{
  display:grid;grid-template-columns:auto 1fr;gap:20px;
  padding:20px 0;border-top:1px solid rgba(36,31,43,.1);
}
.steps__num{padding-top:3px;font:14px/1 var(--font-display);color:var(--accent);font-variant-numeric:tabular-nums}
.steps__title{font-size:17px;font-weight:500}
.steps p{margin-top:6px;font-size:15px;line-height:1.6;color:var(--ink-2)}

/* ---------- 8. Вопросы: обёртка аккордеона ---------- */
.faq{margin-top:48px;max-width:960px;border-top:1px solid var(--hairline-2)}

/* ---------- 9. Контакты ---------- */
.contacts-grid{
  display:grid;gap:clamp(36px,5vw,72px);align-items:start;
  grid-template-columns:1fr;margin-top:48px;
}
@media (min-width:1024px){ .contacts-grid{grid-template-columns:1.1fr 1fr} }
.contacts-links{display:flex;flex-wrap:wrap;gap:28px;margin-top:32px;font-size:15px}
.contacts-links a{border-bottom:1px solid rgba(214,182,223,.4)}
.contacts-links span{color:rgba(245,239,243,.55)}
.contacts-card{
  border:1px solid rgba(245,239,243,.2);border-radius:var(--radius-card);
  padding:36px 32px 40px;background:rgba(255,255,255,.03);
}
.contacts-card h3{font-size:24px;line-height:1.25;color:#fff}
.contacts-card p{margin-top:16px;font-size:15px;line-height:1.7;color:rgba(245,239,243,.72)}

/* ---------- Футер ---------- */
.footer{
  background:var(--plum-900);color:rgba(245,239,243,.6);
  padding:44px 0 56px;border-top:1px solid var(--hairline-dark-2);
}
.footer__in{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px;
}
.footer__brand{display:flex;align-items:center;gap:20px}
.footer__logo{
  width:80px;height:80px;object-fit:contain;
  background:var(--bg);border-radius:50%;padding:9px;
}
.footer__legal{font-size:14px;line-height:1.7}
.footer__legal .copyright{color:rgba(245,239,243,.42)}
.footer__links{display:flex;gap:24px;font-size:14px}
.footer__links a{color:var(--lilac-300)}
.footer__links a:hover{color:#fff}
