/* ============================================================
   Хор Домашний — публичная витрина, тема «Афиша-журнал»
   Новые, самостоятельные классы для секций витрины.
   Не переопределяет .card/.grid/.pos/.gallery/.page-title/.noimg —
   они общие с кабинетом (layouts/public.blade.php) и не трогаются.
   ============================================================ */

.sans{font-family:'Inter',sans-serif;}

/* ---------- Frozen masthead ---------- */
.masthead{
  position:sticky;top:0;z-index:100;
  background:var(--bg);
  border-bottom:1px solid var(--rule);
}
.masthead .bar-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px;padding-bottom:10px;}
.masthead .bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-bottom:14px;}
.masthead .brand{display:flex;align-items:center;gap:14px;}
.masthead .brand:hover{text-decoration:none;}
.masthead .brand-logo{width:32px;height:auto;flex:none;}
.masthead .brand-text{display:flex;flex-direction:row;align-items:baseline;gap:12px;}
.masthead .brand-text .logo{font-size:21px;font-weight:700;letter-spacing:.01em;font-family:'Playfair Display',serif;color:var(--dark);white-space:nowrap;}
.masthead .brand-text .eyebrow{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);font-family:'Cormorant Garamond',serif;font-weight:600;padding-left:12px;border-left:1px solid var(--rule);white-space:nowrap;}
.masthead nav.primary{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.masthead nav.primary a{font-family:'Cormorant Garamond',serif;font-size:15px;letter-spacing:.03em;text-transform:uppercase;font-weight:600;color:var(--dark);position:relative;padding-bottom:3px;border-bottom:1px solid transparent;}
.masthead nav.primary a:hover{border-color:var(--accent-deep);color:var(--dark);text-decoration:none;}
.masthead nav.primary a.active{color:var(--accent-deep);border-color:var(--accent-deep);}
.masthead .cabinet-link{display:flex;align-items:center;gap:6px;font-family:'Cormorant Garamond',serif;font-size:15px;letter-spacing:.03em;text-transform:uppercase;font-weight:600;color:var(--dark);position:relative;padding-bottom:3px;border-bottom:1px solid transparent;}
.masthead .cabinet-link:hover{border-color:var(--accent-deep);color:var(--dark);text-decoration:none;}
.masthead .cabinet-link svg{width:16px;height:16px;flex:none;}
.masthead nav.secondary{display:flex;align-items:center;gap:14px;font-family:'Inter',sans-serif;font-size:13px;}
.masthead nav.secondary a{color:var(--text);}
.masthead nav.secondary a:hover{color:var(--accent-deep);text-decoration:none;}
.masthead .lang-switch a{font-family:'Inter',sans-serif;font-size:12px;}
.nav-cta{display:inline-block;padding:9px 20px;background:var(--dark);color:var(--bg);font-family:'Cormorant Garamond',serif;font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:14px;border-radius:2px;transition:background .2s;}
.nav-cta:hover{background:var(--accent-deep);color:var(--bg);text-decoration:none;}

/* ---------- Mobile menu (hamburger + dropdown), only under 900px ---------- */
.menu-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:32px;height:32px;flex:none;background:none;border:none;cursor:pointer;padding:0;}
.menu-toggle span{display:block;width:22px;height:2px;background:var(--dark);transition:transform .2s ease,opacity .2s ease;}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle.open span:nth-child(2){opacity:0;}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-nav{display:none;flex-direction:column;padding:8px 32px 18px;border-top:1px solid var(--rule);background:var(--bg);}
.mobile-nav.open{display:flex;}
.mobile-nav a{padding:13px 0;font-family:'Cormorant Garamond',serif;font-size:17px;font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:var(--dark);border-bottom:1px solid var(--rule);}
.mobile-nav a:hover{color:var(--accent-deep);text-decoration:none;}
.mobile-nav a.active{color:var(--accent-deep);}
.mobile-nav-lang{display:flex;gap:16px;padding-top:14px;font-family:'Inter',sans-serif;font-size:13px;}

/* ---------- Page hero (interior pages) ---------- */
.page-hero{padding:0px 0 20px;border-bottom:1px solid var(--rule);}
.page-hero.page-hero--tight{padding:0px 0 20px;}
.page-hero .crumb{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:12px;font-family:'Cormorant Garamond',serif;}
.page-hero h1.hero-title{font-family:'Playfair Display',serif;font-size:clamp(32px,5vw,52px);font-weight:700;line-height:1.08;max-width:820px;color:var(--dark);border-bottom:none;padding-bottom:0;margin-bottom:0;}
.page-hero p.lead{margin-top:14px;font-size:18px;color:var(--text);}
/* Пока бронирование приостановлено — пояснение под заголовком (см. booking-suspended-notice) */
.booking-notice{margin:24px 0 0;padding:16px 20px;background:rgba(201,180,123,.14);border-left:3px solid var(--accent-deep);border-radius:2px;color:var(--dark);}
.booking-notice strong{display:block;font-family:'Playfair Display',serif;font-size:20px;font-weight:700;}
.booking-notice p{margin:6px 0 0;font-size:17px;}
.section .booking-notice{margin:0 0 24px;}
.page-hero .hero-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.page-hero .hero-row .all-link{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;font-family:'Cormorant Garamond',serif;white-space:nowrap;}
.page-hero .hero-row + p.lead{margin-top:20px;padding-top:20px;border-top:1px solid var(--rule);}

/* ---------- Stat row (home: реальные цифры театра) ---------- */
.stat-row{display:flex;gap:40px;flex-wrap:wrap;}
.stat-row .stat .n{font-family:'Playfair Display',serif;font-size:38px;font-weight:700;color:var(--accent-deep);line-height:1;}
.stat-row .stat .l{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:6px;}

/* ---------- Section pattern ---------- */
.section{padding:48px 0;}
.section--flush{padding:0;}
.section-head{display:flex;align-items:baseline;justify-content:space-between;border-bottom:2px solid var(--dark);padding-bottom:12px;margin-bottom:30px;gap:16px;flex-wrap:wrap;}
.section-head h2{font-family:'Playfair Display',serif;font-size:27px;font-weight:600;color:var(--dark);}
.section-head .all-link{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;font-family:'Cormorant Garamond',serif;}
.page-subtitle{display:block;font-family:'Cormorant Garamond',serif;font-size:16px;font-weight:500;color:var(--text);margin-top:6px;}
.page-subtitle-link{display:inline-flex;align-items:center;margin-left:8px;color:var(--accent-deep);vertical-align:middle;}
.page-subtitle-link:hover{color:var(--dark);}
.page-subtitle-link svg{width:15px;height:15px;}
hr{border:none;border-top:1px solid var(--rule);margin:24px 0;}
.season-divider{font-family:'Playfair Display',serif;font-style:italic;font-size:21px;color:var(--accent-deep);margin:34px 0 6px;}
/* «Показать весь состав сезона →» на главной — сокращённая копия блока с /afisha,
   остальное скрыто за нативным <details>, без JS. */
.season-cast-more{margin-top:20px;}
.season-cast-more summary{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;font-family:'Cormorant Garamond',serif;cursor:pointer;list-style:none;}
.season-cast-more summary::-webkit-details-marker{display:none;}
.season-cast-more summary:hover{color:var(--dark);}
.season-cast-more .label-open{display:none;}
.season-cast-more[open] .label-closed{display:none;}
.season-cast-more[open] .label-open{display:inline;}

/* ---------- Afisha: показы сгруппированы по спектаклю ---------- */
.afisha-group{margin-bottom:40px;}
.afisha-group:last-child{margin-bottom:0;}
.afisha-group-head{border-bottom:1px solid var(--dark);padding-bottom:10px;margin-bottom:4px;}
.afisha-group-head h2{font-family:'Playfair Display',serif;font-size:24px;font-weight:600;}
.afisha-group-head h2 a{color:var(--dark);}
.afisha-group-head h2 a:hover{color:var(--accent-deep);}
.season-divider:first-child{margin-top:0;}

/* ---------- Playbill card (production tile) ---------- */
.bill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 32px;}
.bill-card{display:block;color:inherit;}
.bill-card:hover{text-decoration:none;}
.bill-card .frame{aspect-ratio:3/4;border-radius:2px;overflow:hidden;background:linear-gradient(160deg,#3a3a3a,var(--dark));position:relative;}
.bill-card .frame img{width:100%;height:100%;object-fit:cover;display:block;}
.bill-card .frame .placeholder{position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(201,180,123,.08) 0 2px,transparent 2px 22px);}
.bill-card h3{margin:14px 0 0;font-family:'Playfair Display',serif;font-size:21px;font-weight:600;color:var(--dark);}
.bill-card .composer{font-size:14px;color:var(--text);font-style:italic;margin-top:1px;font-family:'Cormorant Garamond',serif;}
.bill-card .tag{display:inline-block;margin-top:8px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);border:1px solid var(--rule);padding:3px 9px;border-radius:20px;font-family:'Inter',sans-serif;}

/* ---------- Row list ---------- */
.row-list{border-top:1px solid var(--rule);}
.row-list .row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid var(--rule);color:inherit;}
.row-list a.row:hover{text-decoration:none;background:rgba(201,180,123,.06);}
.row-list .row h3{font-family:'Playfair Display',serif;font-size:18px;font-weight:600;color:var(--dark);margin:0;}
.row-list .row .sub{font-size:14px;color:var(--text);font-style:italic;margin-top:2px;font-family:'Cormorant Garamond',serif;}
/* Строки вида «заголовок | текст справа» без date-badge (роли артиста, состав без
   двойного каста, список помощников) — оба элемента текстовые и могут переноситься.
   Без flex-basis/min-width браузер считает ширину каждого по своему контенту
   (shrink-to-fit) и на узких экранах эти прикидки расходятся с тем, что реально
   переносится — колонки наезжают друг на друга. min-width:0 отдаёт каждому ровно
   его половину ряда, text-align:right держит перенесённый текст у правого края.
   Селектор через прямой child — не задевает строки с date-badge (там .sub вложен
   на уровень глубже, в общий блок с h3, и не участвует в этом flex-ряду). */
.row-list .row > h3{flex:1 1 auto;min-width:0;}
.row-list .row > .sub{flex:0 1 auto;min-width:0;text-align:right;}
.row-list .row .tag{display:inline-block;margin-top:5px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);border:1px solid var(--rule);padding:2px 8px;border-radius:20px;font-family:'Inter',sans-serif;}
.row-list .row h3 .tag,.row-list .row .sub + .tag{margin-top:0;margin-left:10px;vertical-align:middle;}
.row-list .row .go{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--accent-deep);white-space:nowrap;font-family:'Inter',sans-serif;}
.row-list .row .go.sold-out{color:var(--muted);}
.go-icon{display:none;align-items:center;}
.go-icon svg{display:block;}
.row-list .row.is-sold-out{opacity:.6;}
.show-cast{padding:6px 0 28px;border-bottom:1px solid var(--rule);}
.show-cast-head{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:16px;}
.show-cast .person-card h3{font-size:15px;margin-top:8px;}

/* ---------- Date badge (afisha rows) ---------- */
.row-line{display:flex;gap:18px;align-items:center;}
.date-badge{width:58px;height:58px;flex:none;background:var(--dark);color:var(--bg);border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.date-badge .d{font-family:'Playfair Display',serif;font-size:20px;font-weight:700;line-height:1;}
.date-badge .m{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-top:2px;}

/* ---------- People grid (artists/helpers cards) ---------- */
.people-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}
.people-grid--5{grid-template-columns:repeat(5,1fr);gap:20px;}
.person-card{display:block;color:inherit;}
.person-card:hover{text-decoration:none;}
.person-card .frame{aspect-ratio:3/4;border-radius:2px;overflow:hidden;background:linear-gradient(160deg,#3a3a3a,var(--dark));position:relative;}
.person-card .frame img{width:100%;height:100%;object-fit:cover;display:block;}
.people-grid--mono .person-card .frame img{filter:grayscale(100%);transition:filter .35s ease;}
.people-grid--mono .person-card:hover .frame img{filter:grayscale(0%);}
.person-card .frame .placeholder{position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(201,180,123,.08) 0 2px,transparent 2px 22px);}
.person-card h3{margin-top:12px;font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:600;color:var(--dark);}
.person-card .role{font-size:13px;color:var(--text);font-style:italic;margin-top:2px;}
.person-year{font-family:'Playfair Display',serif;font-size:24px;font-weight:600;color:var(--dark);margin:40px 0 18px;}
.person-year:first-of-type{margin-top:0;}

/* ---------- Buttons ---------- */
.btn{display:inline-block;padding:12px 26px;font-family:'Cormorant Garamond',serif;font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:14px;border-radius:2px;}
.btn:hover{text-decoration:none;}
.btn-solid{background:var(--dark);color:var(--bg);}
.btn-solid:hover{background:var(--accent-deep);color:var(--bg);}
.btn-ghost{border:1px solid var(--dark);color:var(--dark);}
.btn-ghost:hover{border-color:var(--accent-deep);color:var(--accent-deep);}

/* ---------- Facts list (person bio fields) ---------- */
.facts{margin-top:22px;border-top:1px solid var(--rule);}
.facts .f{display:flex;flex-wrap:wrap;gap:6px 18px;padding:11px 0;border-bottom:1px solid var(--rule);font-size:15px;}
.facts .f dt{font-family:'Cormorant Garamond',serif;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text);width:170px;flex:none;font-weight:600;}
.facts .f dd{margin:0;color:var(--dark);}

/* ---------- Production hero ---------- */
.prod-hero{padding:40px 0 48px;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:300px 1fr;gap:44px;}
/* Профиль артиста переиспользует .prod-hero, но не как грид-колонки — фото плавает
   слева (float), а имя/факты/био вокруг него обычным потоком: пока текста мало, он
   идёт справа от фото; как только контента больше высоты фото — «обтекание»
   заканчивается, и текст ниже фото сам растягивается на всю ширину (обычное
   поведение float у блочных элементов, без явной точки переключения в CSS). */
.prod-hero.prod-hero--person{display:block;overflow:hidden;}
.prod-hero.prod-hero--person .frame{float:left;width:260px;margin:0 44px 20px 0;}
.prod-hero.prod-hero--person .info{display:block;}
.prod-hero.prod-hero--person .info .bio{margin-top:22px;line-height:1.6;}
.prod-hero .frame{aspect-ratio:3/4;border-radius:2px;overflow:hidden;background:linear-gradient(160deg,#3a3a3a,var(--dark));position:relative;}
.prod-hero .frame img{width:100%;height:100%;object-fit:cover;display:block;}
/* Фото персоны обёрнуто в .gallery (для лайтбокса) — без явной высоты этой обёртки
   height:100% на <img> не от чего считать, и cover не срабатывает (картинка обрезается
   снизу оверфлоу вместо кропа). Задаём обёртке высоту рамки явно. */
.prod-hero .frame .gallery{height:100%;margin:0;}
.prod-hero .frame .placeholder{position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(201,180,123,.08) 0 2px,transparent 2px 22px);}
/* Горизонтальная афиша-листовка с текстом: показываем целиком, без обрезки под 3:4 */
.frame.frame--flyer,.bill-card .frame.frame--flyer,.prod-hero .frame.frame--flyer,.summary-card .frame.frame--flyer{background:#2a1552;}
.frame.frame--flyer img,.bill-card .frame.frame--flyer img,.prod-hero .frame.frame--flyer img,.summary-card .frame.frame--flyer img{object-fit:contain;}
.prod-hero.prod-hero--flyer{grid-template-columns:minmax(300px,560px) 1fr;}
.prod-hero--flyer .frame{aspect-ratio:auto;}
.prod-hero--flyer .frame img{height:auto;}
.prod-hero--flyer .frame a{display:block;}
.prod-hero .info{display:flex;flex-direction:column;justify-content:center;}
.prod-hero .crumb{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:12px;font-family:'Cormorant Garamond',serif;}
.prod-hero h1,.prod-hero h2{font-family:'Playfair Display',serif;font-size:clamp(30px,4.4vw,48px);font-weight:700;line-height:1.08;color:var(--dark);border:none;padding:0;margin:0;}
.prod-hero .composer{font-size:17px;font-style:italic;color:var(--text);margin-top:8px;font-family:'Cormorant Garamond',serif;}
.prod-hero .excerpt{font-size:16px;line-height:1.6;color:var(--text);margin:16px 0 0;max-width:52ch;}
.prod-hero .actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap;}
.prod-hero .info .tag{display:inline-block;margin-left:10px;vertical-align:middle;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);border:1px solid var(--rule);padding:2px 8px;border-radius:20px;font-family:'Inter',sans-serif;}

/* Prev/next production nav */
.prodnav{padding:16px 0;border-bottom:1px solid var(--rule);}
.prodnav .row{display:flex;justify-content:space-between;align-items:baseline;font-family:'Cormorant Garamond',serif;font-size:14px;letter-spacing:.03em;text-transform:uppercase;font-weight:600;}
.prodnav a{color:var(--accent-deep);}
.prodnav .mid a{color:var(--dark);}

/* Программка (playbill scan) — фикс ширины колонки поверх .gallery (grid auto-fill) */
.program-frame.gallery{grid-template-columns:minmax(0, 440px);}
.program-frame img{border-radius:2px;}

/* Multi-cast heading (single-cast fallback, no А/Б split) */
.cast-name{font-family:'Playfair Display',serif;font-style:italic;color:var(--accent-deep);margin:30px 0 6px;font-size:20px;}
.cast-name:first-of-type{margin-top:0;}

/* Cast table: Роль | Состав А | Состав Б, «Основной» — merged across both actor columns */
.cast-table-wrap{overflow-x:auto;}
.cast-table{width:100%;border-collapse:collapse;font-size:17px;}
.cast-table th{text-align:left;font-size:17px;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:14px 16px 14px 0;border-bottom:1px solid var(--rule);white-space:nowrap;}
.cast-table th:last-child,.cast-table td:last-child{padding-right:0;}
.cast-table td{padding:14px 16px 14px 0;border-bottom:1px solid var(--rule);vertical-align:top;}
.cast-table td.role{font-family:'Playfair Display',serif;font-weight:600;color:var(--dark);}
.cast-table td a{color:var(--accent-deep);}
.cast-table tr:last-child td{border-bottom:none;}
@media(max-width:640px){
  .cast-table{font-size:15px;}
  .cast-table th,.cast-table td{padding-right:10px;}
}

/* ---------- Video section ---------- */
.video-covered{display:grid;grid-template-columns:repeat(2, 1fr);gap:18px;}
.video-covered figure{margin:0;}
.video-covered figure a{display:block;}
.video-covered .thumb-img{width:100%;height:auto;border-radius:2px;display:block;}
.video-covered figcaption,.video-embed .cap{margin-top:8px;font-size:14px;font-style:italic;color:var(--text);text-align:center;font-family:'Cormorant Garamond',serif;}
.video-plain-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:18px;margin-top:14px;}
.video-plain-grid:first-child{margin-top:0;}
.video-embed{margin:0;}
.video-embed iframe{width:100%;aspect-ratio:16/9;border-radius:2px;border:none;display:block;}

/* ---------- Booking summary card ---------- */
.book-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:44px;align-items:start;}
.summary-card{background:var(--dark);color:var(--bg);border-radius:4px;padding:0;overflow:hidden;position:sticky;top:96px;}

/* Дата и время — главное, на что смотрит зритель, поэтому крупнее всего на странице */
.ticket-date{text-align:center;padding:30px 24px;background:linear-gradient(160deg,#3a3a3a,var(--dark));}
.ticket-date .dow{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;}
.ticket-date .dom{font-family:'Playfair Display',serif;font-size:44px;font-weight:700;line-height:1;color:var(--bg);}
.ticket-date .year{font-family:'Cormorant Garamond',serif;font-size:17px;color:#cfc7b5;margin-top:4px;}
.ticket-date .time{display:inline-block;margin-top:16px;font-family:'Playfair Display',serif;font-size:26px;font-weight:700;color:var(--dark);background:var(--accent);padding:8px 24px;border-radius:30px;}

.summary-body{padding:26px;}
.summary-media{display:flex;gap:16px;align-items:flex-start;}
.summary-card .frame{width:90px;aspect-ratio:3/4;flex:none;border-radius:2px;overflow:hidden;background:linear-gradient(160deg,#4a4a4a,#242424);}
.summary-card .frame img{width:100%;height:100%;object-fit:cover;display:block;}
.summary-card .k{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:6px;font-family:'Inter',sans-serif;}
.summary-card h2{font-family:'Playfair Display',serif;font-size:21px;font-weight:600;color:var(--bg);border:none;padding:0;margin:0;line-height:1.2;}
.summary-card .tag{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);border:1px solid rgba(201,180,123,.4);padding:3px 10px;border-radius:20px;font-family:'Inter',sans-serif;}
.summary-card .meta{margin-top:18px;padding-top:18px;border-top:1px solid #4a4a4a;font-size:15px;color:#cfc7b5;}
.summary-card .meta div{margin-bottom:6px;}

/* ---------- Форма бронирования ---------- */
.book-form{width:100%;}
button.btn{border:none;cursor:pointer;font:inherit;font-family:'Cormorant Garamond',serif;}
.field{margin-bottom:22px;}
.field label{display:block;font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:8px;}
.field input{display:block;width:100%;border:none;border-bottom:1px solid var(--rule);border-radius:0;background:transparent;padding:9px 2px;font-family:'Cormorant Garamond',serif;font-size:19px;color:var(--dark);transition:border-color .2s;}
.field input:focus{outline:none;border-bottom-color:var(--accent-deep);}
.field input::placeholder{color:var(--text);opacity:.45;}
.field--seats input{width:100px;}
.field select{display:block;width:100%;border:none;border-bottom:1px solid var(--rule);border-radius:0;background:transparent;padding:9px 2px;font-family:'Cormorant Garamond',serif;font-size:19px;color:var(--dark);transition:border-color .2s;}
.field select:focus{outline:none;border-bottom-color:var(--accent-deep);}
.field select:invalid{color:var(--text);opacity:.7;}
.field textarea{display:block;width:100%;border:1px solid var(--rule);border-radius:2px;background:transparent;padding:10px 12px;font-family:'Cormorant Garamond',serif;font-size:18px;line-height:1.5;color:var(--dark);transition:border-color .2s;resize:vertical;}
.field textarea:focus{outline:none;border-color:var(--accent-deep);}
.field textarea::placeholder{color:var(--text);opacity:.45;}
.field .field-error{display:block;margin-top:6px;font-family:'Inter',sans-serif;font-size:12.5px;color:#a83a3a;}
.field input.is-invalid,.field select.is-invalid{border-bottom-color:#a83a3a;}
.field textarea.is-invalid{border-color:#a83a3a;}
.form-error{font-family:'Inter',sans-serif;font-size:13.5px;color:#a83a3a;background:#fbeeee;border:1px solid #e6c6c6;padding:10px 14px;border-radius:2px;margin-bottom:20px;}

/* ---------- Форма бронирования: поля в один ряд (мест / кто пригласил) ---------- */
.field-row{display:flex;gap:24px;flex-wrap:wrap;}
.field-row .field{margin-bottom:22px;}
.field-row .field--seats{flex:0 0 150px;}
.field-row .field--invited{flex:1;min-width:200px;}

/* ---------- Модалка валидации формы (вместо нативных браузерных подсказок) ---------- */
.validation-modal-overlay{position:fixed;inset:0;background:rgba(43,43,43,.6);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;}
.validation-modal{position:relative;background:#fff;border-radius:4px;padding:32px;max-width:420px;width:100%;box-shadow:0 16px 50px rgba(0,0,0,.28);}
.validation-modal h3{margin:0 0 14px;}
.validation-modal ul{margin:0;padding-left:20px;color:#a83a3a;font-family:'Inter',sans-serif;font-size:14.5px;line-height:1.8;}
.validation-modal .modal-close{position:absolute;top:10px;right:14px;background:none;border:none;font-size:24px;line-height:1;color:var(--muted);cursor:pointer;padding:4px;}
.validation-modal .modal-close:hover{color:var(--dark);}

/* ---------- Заявка отправлена (успех бронирования) ---------- */
.request-sent{border:1px solid var(--rule);border-radius:4px;padding:30px;background:#fff;}
.request-sent .mark{width:44px;height:44px;border-radius:50%;border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;margin-bottom:18px;font-size:18px;color:var(--accent-deep);}
.request-sent h3{margin:0 0 10px;}
.request-sent p{margin:0 0 14px;font-size:17px;line-height:1.5;}
.request-sent .cancel-link{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}

/* ---------- State page (booking cancelled) ---------- */
.state-block{padding:80px 0;text-align:center;}
.state-block .mark{width:52px;height:52px;border-radius:50%;border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;margin:0 auto 22px;font-size:20px;color:var(--accent-deep);}
.state-block h1{font-family:'Playfair Display',serif;font-size:clamp(28px,4vw,40px);font-weight:700;border:none;padding:0;color:var(--dark);}
.state-block p{max-width:500px;margin:16px auto 0;font-size:18px;color:var(--text);}
.state-block .actions{margin-top:28px;}

/* ---------- Editorial article (SitePage) ---------- */
.article-lead{font-size:19px;color:var(--text);}
.article-lead::first-letter{font-family:'Playfair Display',serif;font-size:58px;line-height:.7;float:left;padding:6px 8px 0 0;font-weight:600;color:var(--accent-deep);}

/* ---------- Gallery caption → linked production ---------- */
.gallery-item{margin:0;}
.gallery-caption{margin-top:6px;font-size:12.5px;text-align:center;line-height:1.3;}
.gallery-caption a{color:var(--accent-deep);font-weight:600;}
.gallery-caption a:hover{text-decoration:underline;}

/* ---------- Gallery — single scrollable row (home page) ---------- */
.gallery.gallery--scroll{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:14px;margin:0;padding-bottom:12px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
.gallery.gallery--scroll img{flex:0 0 220px;width:220px;scroll-snap-align:start;}
.gallery.gallery--scroll::-webkit-scrollbar{height:8px;}
.gallery.gallery--scroll::-webkit-scrollbar-thumb{background:var(--rule);border-radius:8px;}
.gallery.gallery--scroll::-webkit-scrollbar-track{background:transparent;}
@media(max-width:560px){
  .gallery.gallery--scroll img{flex-basis:160px;width:160px;}
}

/* ---------- Alphabet quick-jump ---------- */
.alpha-jump{display:flex;flex-wrap:wrap;gap:4px;padding-bottom:28px;margin-bottom:28px;border-bottom:1px solid var(--rule);}
.alpha-jump a{width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;border-radius:50%;color:var(--text);font-family:'Inter',sans-serif;}
.alpha-jump a:hover{background:var(--accent);color:var(--dark);text-decoration:none;}

/* ---------- Footer ---------- */
footer.site{background:var(--dark);color:var(--bg);padding:40px 0 24px;margin-top:16px;}
footer.site .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;}
footer.site .col h5{font-family:'Playfair Display',serif;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:12px;}
footer.site .col a,footer.site .col p{display:block;font-size:15px;color:#cfc7b5;margin-bottom:7px;}
footer.site .col a:hover{color:var(--accent);}
footer.site .social{display:flex;gap:14px;margin-top:12px;}
footer.site .social a{display:inline-flex;color:#cfc7b5;transition:color .2s;}
footer.site .social a:hover{color:var(--accent);}
footer.site .social svg{width:20px;height:20px;fill:currentColor;}
footer.site .bottom{text-align:center;margin-top:30px;padding-top:18px;border-top:1px solid #3a3a3a;font-size:12.5px;color:#8a8377;letter-spacing:.04em;}

/* ---------- Способы поддержки (/podderzhat) ---------- */
.donate-methods{display:flex;flex-wrap:wrap;gap:14px;}
.donate-chip{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--rule);border-radius:30px;padding:10px 18px;color:var(--dark);background:#fff;}
.donate-chip svg{width:22px;height:22px;flex:none;}
.donate-chip .name{font-family:'Inter',sans-serif;font-size:13.5px;letter-spacing:.03em;white-space:nowrap;}
a.donate-chip.is-link:hover{border-color:var(--accent-deep);color:var(--accent-deep);text-decoration:none;}
.donate-chip.is-muted{color:var(--muted);border-style:dashed;background:transparent;opacity:.75;}

/* ---------- Actor photo tooltip (cast table hover) ---------- */
.actor-tooltip{position:fixed;z-index:200;display:none;pointer-events:none;width:150px;aspect-ratio:3/4;border-radius:3px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.25);border:1px solid var(--rule);background:var(--bg);}
.actor-tooltip.open{display:block;}
.actor-tooltip img{width:100%;height:100%;object-fit:cover;display:block;opacity:1;}
.actor-tooltip.loading img{opacity:0;}

/* ---------- Cast list tooltip (hover over "Состав А/Б" tag) ---------- */
.cast-tooltip{position:fixed;z-index:200;display:none;pointer-events:none;max-width:280px;background:var(--dark);color:var(--bg);border-radius:4px;padding:14px 16px;box-shadow:0 10px 30px rgba(0,0,0,.25);}
.cast-tooltip.open{display:block;}
.cast-tooltip .cast-tooltip-title{font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;}
.cast-tooltip dl{margin:0;}
.cast-tooltip dl > div{display:flex;justify-content:space-between;gap:14px;font-size:13px;padding:5px 0;border-bottom:1px solid #4a4a4a;}
.cast-tooltip dl > div:last-child{border-bottom:none;}
.cast-tooltip dt{color:#cfc7b5;white-space:nowrap;flex:none;}
/* flex:1 + min-width:0 — иначе при переносе длинного списка актёров на несколько строк
   flex отдаёт dd ширину по content (shrink-to-fit), которая шире реальных строк текста,
   и text-align:right визуально «съезжает» влево вместо прижатия к правому краю тултипа. */
.cast-tooltip dd{margin:0;font-weight:600;color:var(--bg);text-align:right;flex:1;min-width:0;}
.cast-tag{cursor:help;}
/* Тег «Премьера» — залитый, чтобы явно отличаться от тега состава (с обводкой).
   Цвет текста задаём отдельно для каждого контекста — иначе более специфичное
   правило вида «.bill-card .tag{color:...}» побеждает и текст сливается с фоном. */
.tag.premiere-tag{background:var(--accent-deep);border-color:var(--accent-deep);font-weight:700;}
.tag.premiere-tag::before{content:'★ ';}
.bill-card .tag.premiere-tag,
.row-list .row .tag.premiere-tag,
.prod-hero .info .tag.premiere-tag,
.summary-card .tag.premiere-tag{color:var(--bg);}
/* Тег «Премьера» — первым в строке, без общего для .tag левого отступа (иначе на узких
   экранах, когда он переносится на свою строку, получается странный отступ слева). */
.row-list .row h3 .tag.premiere-tag,
.row-list .row .sub + .tag.premiere-tag,
.prod-hero .info .tag.premiere-tag{margin-left:0;}
/* Отступ перед тегом «Премьера» ставим на предшествующем тексте даты/времени,
   а не на самом теге — иначе при переносе тега на новую строку тот же отступ
   давал бы странный «хвост» слева (см. правило выше). */
.time-label:has(+ .tag.premiere-tag),
.row-list .row .sub:has(+ .tag.premiere-tag){margin-right:8px;}
.cast-table td a.actor-link,.row-list a.actor-link{border-bottom:1px dotted var(--accent-deep);}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .bill-grid{grid-template-columns:repeat(2,1fr);}
  .people-grid{grid-template-columns:repeat(2,1fr);}
  .prod-hero,.prod-hero.prod-hero--flyer{grid-template-columns:1fr;}
  .prod-hero.prod-hero--person .frame{float:none;width:auto;margin:0 0 20px;}
  .book-grid{grid-template-columns:1fr;}
  .summary-card{position:static;}
  .masthead nav.primary{display:none;}
  .masthead nav.secondary{display:none;}
  .masthead .cabinet-link{display:none;}
  .masthead .brand-text .eyebrow{display:none;}
  .masthead .bar{display:none;}
  .masthead .bar-top{padding-bottom:14px;}
  .menu-toggle{display:flex;}
  .mobile-nav .nav-cta{display:block;text-align:center;margin:4px 0 14px;padding:12px 20px;border-bottom:none;color:var(--bg);}
  .mobile-nav .nav-cta:hover{color:var(--bg);}
}
@media(max-width:560px){
  .bill-grid{grid-template-columns:1fr;}
  .people-grid{grid-template-columns:1fr;}
  .video-covered{grid-template-columns:1fr;}
  .video-plain-grid{grid-template-columns:1fr;}
  /* Выбор фото по личной ссылке — одна крупная карточка в ряд, чтобы было однозначно
     видно, какое именно фото выбирает кнопка под ним. */
  .gallery.gallery--portrait-picker{grid-template-columns:1fr;}
  /* Заголовок + оба тега на узких экранах переносятся в несколько строк — по центру
     дата-бейдж «плавает» посередине этого столбца текста и выглядит криво; прижимаем
     его к верхней строке. */
  .row-line{align-items:flex-start;}
  /* «Забронировать →» не переносится (.go{white-space:nowrap}) и на узких экранах
     вместе со «Свободно мест: X из Y ·» не помещается — оставляем только иконку. */
  .go-label{display:none;}
  .go-icon{display:inline-flex;}
  /* «Предыдущая/следующая постановка» не помещается рядом с «К спектаклям» на узких
     экранах и переносится на несколько строк — оставляем только стрелки. */
  .prodnav-label{display:none;}
}