/* =============================================================
   Разбор-практикум — свои стили поверх копий style/course/pages.css
   (копии из «Женского счастья» не правим, всё новое — здесь)
   ============================================================= */

/* Плашка темы на первом экране — тема меняется от встречи к встрече */
.hero__theme{
  display:inline-flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin:0 0 22px; padding:10px 20px 10px 14px;
  background:var(--white); border:1px solid var(--sage-tint);
  border-radius:999px; box-shadow:var(--shadow-s);
  font-family:var(--font-display); font-size:15.5px; font-weight:600; color:var(--ink);
}
.hero__theme-label{
  background:var(--green); color:#fff;
  font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:6px 12px; border-radius:999px;
}
.hero--rz .hero__title-mark{ font-size:clamp(30px,3.8vw,50px); line-height:1.12; }

/* Иллюстрации (сгенерированы под страницу 24.10, исходники PNG — в «исходники/») */
.rz-illus{ margin:0; border-radius:var(--r-l); overflow:hidden; box-shadow:var(--shadow-m); }
.rz-illus img{ width:100%; height:auto; }
.rz-illus--wide{ max-width:1000px; margin:40px auto 0; }

/* «Новый формат»: текст слева, рисунок справа */
.rz-format{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:56px; align-items:center; }
.rz-format__figure{ box-shadow:0 24px 60px rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.12); }

/* «Практика»: в общем стиле картинка обрезается по высоте — держим в кадре лист с узлом */
.tool__figure--rz img{ height:440px; object-position:center 62%; }

/* Блок «Новый формат»: две привычные альтернативы */
.cause__faces--alt li b{ color:#F0E3D3; }

/* Карточка «Выходить в эфир не нужно» в шагах */
.day__callout--soft{ background:var(--ochre-tint); }

/* Тарифы */
.tariff--full .tariff__head{ background:var(--mist); }
.tariff__price-num small{ font-size:.5em; font-weight:700; margin-left:2px; }
/* Лесенка цен под ценой: прошедшие ступени зачёркнуты, текущая выделена (заполняет razbor.js) */
.tariff__ladder{ display:flex; flex-wrap:wrap; gap:4px 14px; margin:10px 0 0; font-size:13.5px; color:var(--muted); }
.tariff__ladder .is-past{ text-decoration:line-through; text-decoration-color:rgba(169,124,79,.75); opacity:.7; }
.tariff__ladder .is-now{ color:var(--ochre); font-weight:700; }
#rz-deadline{ max-width:860px; }

/* Клубная цена под основной — выделена, чтобы продвигать Клуб */
.tariff__club{
  display:inline-flex; align-items:center; gap:9px;
  margin:16px 0 0; padding:9px 16px 9px 12px;
  background:var(--green); color:#fff;
  border-radius:999px; box-shadow:0 8px 20px rgba(83,110,105,.25);
  font-family:var(--font-display); font-size:15px; font-weight:500; line-height:1.3;
}
.tariff__club svg{ flex:none; color:#F0E3D3; fill:#F0E3D3; }
.tariff__club b{ font-weight:800; }
.tariff__lead{ margin:0 34px 14px; font-size:15.5px; font-weight:600; color:var(--ink); }
.tariff__actions{ padding:0 34px 34px; }
.tariff__under{ margin:2px 0 0; font-size:13.5px; text-align:center; color:var(--muted); }
.anchor-note{
  max-width:760px; margin:0 auto 40px; text-align:center;
  font-family:var(--font-display); font-size:clamp(18px,1.7vw,22px); font-weight:600; line-height:1.4; color:var(--ink);
}
.anchor-note b{ color:var(--ochre); }
.club-note{
  max-width:760px; margin:30px auto 0; padding:18px 24px;
  background:var(--white); border:1px dashed var(--sage);
  border-radius:var(--r-m); text-align:center; font-size:16px;
}
.club-note a{ color:var(--green); font-weight:600; }

@media (max-width: 1100px){
  .tool__figure--rz img{ height:100%; }
}
@media (max-width: 900px){
  .rz-format{ grid-template-columns:1fr; gap:36px; }
  .rz-format__figure{ max-width:440px; }
}
@media (max-width: 640px){
  .tool__figure--rz img{ height:320px; }
  .rz-illus--wide{ margin-top:28px; border-radius:var(--r-m); }
  /* флаг «Всего 6 мест» на узком экране наезжал на дату — ставим его над шапкой */
  .tariff__flag{ position:static; align-self:flex-start; margin:22px 0 0 24px; }
  .tariff--full .tariff__head{ padding-top:18px; }
  .tariff__club{ font-size:14px; padding:8px 14px 8px 10px; }
}
@media (max-width: 760px){
  .hero__theme{ gap:8px; padding:7px 14px 7px 8px; font-size:14px; border-radius:16px; }
  .hero__theme-label{ font-size:10.5px; padding:5px 10px; letter-spacing:.1em; }
  .tariff__lead{ margin:0 24px 12px; }
  .tariff__actions{ padding:0 24px 26px; }
}

/* «по практике Сатори-Графики» в подзаголовке — выделено фоном: метод назван, но упор на разбор */
.hero__mark{
  background:var(--ochre-tint); color:inherit;
  padding:1px 7px; border-radius:6px; white-space:nowrap;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
}