/* =========================================================
   NIKA BALLET STUDIO. SCHEDULE page layout only.
   Colour + type come from nika.css tokens. No palette here.
   ========================================================= */

/* ---------- PAGE HEADER (editorial photo banner) ---------- */
.sched-head{position:relative;min-height:72vh;display:flex;align-items:flex-end;overflow:hidden;
  padding-top:120px}
.sched-head .ph{position:absolute;inset:0;z-index:0}
.sched-head .ph img{height:100%}
.sched-head__scrim{position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(8,11,16,.82)0%,rgba(8,11,16,.3)55%,rgba(8,11,16,.5)100%)}
.sched-head__in{position:relative;z-index:3;color:#fff;max-width:660px;
  padding-bottom:clamp(48px,8vh,100px)}
.sched-head .eyebrow{color:var(--accent-2)}
.sched-head h1{font-family:var(--serif);font-weight:500;line-height:1.02;
  font-size:clamp(2.6rem,6.4vw,5rem);margin:16px 0 20px}
.sched-head p{font-size:clamp(15px,1.2vw,17.5px);line-height:1.8;color:rgba(255,255,255,.88);
  max-width:48ch;margin-bottom:30px}

/* ---------- STUDIO HOURS BAND ---------- */
.hours-band{position:relative;background:var(--paper-2);padding:var(--sp) 0;overflow:hidden}
.hours__grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(32px,6vw,90px);align-items:center}
.hours__intro .h-sub{margin:16px 0 18px}
.hours__list{border-top:1px solid var(--line)}
.hrow{display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  padding:22px 4px;border-bottom:1px solid var(--line-soft)}
.hrow .hday{font-family:var(--serif);font-weight:500;font-size:clamp(1.3rem,2.1vw,1.85rem);
  color:var(--ink);line-height:1.1}
.hrow .htime{font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent);white-space:nowrap}
.hrow--closed .htime{color:var(--muted)}

/* ---------- WEEKLY CLASS GRID, filterable by age and day ----------
   Built from the same devices as the hours band above it: hairline rows,
   a gold time, a Playfair class name. The filters read as the index of a
   printed programme rather than as app pills, which is why they are square,
   letterspaced, and hairline-bordered like .btn-ghost. */
.grid-band{background:var(--paper-3);padding:var(--sp) 0}
.grid-head{max-width:56ch}
.grid-head .h-sub{margin:16px 0 18px}
.grid-season{font-family:var(--sans);font-weight:600;font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted);margin-top:14px}

.filters{display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,56px);margin:clamp(34px,4vw,48px) 0 0;
  padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.filter{border:0;padding:0;margin:0;min-width:0}
.filter legend{font-family:var(--sans);font-weight:600;font-size:9.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--accent-text);margin-bottom:12px;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink);background:transparent;border:1px solid var(--line);
  border-radius:0;padding:11px 16px;cursor:pointer;transition:.28s ease;white-space:nowrap}
.chip:hover{border-color:var(--accent);color:var(--accent-text)}
.chip[aria-pressed="true"]{background:var(--dark);border-color:var(--dark);color:var(--dark-fg)}

.grid-count{font-family:var(--sans);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);margin:26px 0 4px}

.day-group{margin-top:30px}
.day-group__name{font-family:var(--sans);font-weight:600;font-size:10px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--accent-text);padding-bottom:12px;
  border-bottom:1px solid var(--line);display:block}
.crow{display:grid;grid-template-columns:150px 1fr auto;gap:clamp(14px,2.4vw,32px);
  align-items:baseline;padding:20px 4px;border-bottom:1px solid var(--line-soft)}
.crow__time{font-family:var(--sans);font-weight:600;font-size:12.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--accent-text);white-space:nowrap}
.crow__name{font-family:var(--serif);font-weight:500;font-size:clamp(1.2rem,1.9vw,1.6rem);
  line-height:1.15;color:var(--ink)}
.crow__who{display:block;font-family:var(--sans);font-size:12px;letter-spacing:.02em;
  color:var(--muted);margin-top:5px}
.crow__age{font-family:var(--sans);font-weight:600;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--body);white-space:nowrap}
.grid-empty{margin-top:30px;padding:22px 0;border-top:1px solid var(--line);
  font-family:var(--serif);font-style:italic;font-size:1.12rem;color:var(--muted)}
.grid-empty a{color:var(--ink);border-bottom:1px solid var(--line)}

@media(max-width:620px){
  .crow{grid-template-columns:1fr auto;gap:8px 16px}
  .crow__time{grid-column:1/-1;order:-1}
}

/* ---------- CURRENT SCHEDULE (honest path) ---------- */
.current{background:var(--paper);padding:var(--sp) 0}
.current__grid{display:grid;grid-template-columns:.92fr 1.08fr;
  gap:clamp(32px,6vw,84px);align-items:center}
.current__photo{aspect-ratio:4/5;box-shadow:0 40px 90px -40px rgba(15,25,38,.45)}
.current__text .h-sec{margin:14px 0 22px}
.current__text .lead{max-width:48ch}
.current__actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px}
.current__note{font-family:var(--serif);font-style:italic;font-size:1.15rem;
  color:var(--muted);margin-top:24px}

/* ---------- VISIT / NAP (full-bleed photo) ---------- */
.visit{position:relative;min-height:80vh;display:flex;align-items:flex-end;overflow:hidden}
.visit .ph{position:absolute;inset:0;z-index:0}
.visit .ph img{height:100%}
.visit__scrim{position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(8,10,16,.85)0%,rgba(8,10,16,.28)60%,rgba(8,10,16,.44)100%)}
.visit__in{position:relative;z-index:3;color:#fff;max-width:720px;
  padding-bottom:clamp(50px,9vh,110px)}
.visit .eyebrow{color:var(--accent-2)}
.visit h2{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4.4vw,3.6rem);
  line-height:1.06;margin:16px 0 32px}
.visit__nap{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);
  margin-bottom:36px;padding-top:28px;border-top:1px solid rgba(255,255,255,.2)}
.nap__label{font-family:var(--sans);font-weight:600;font-size:9.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--accent-2);display:block;margin-bottom:12px}
.visit__nap p{font-size:15px;line-height:1.75;color:rgba(255,255,255,.9)}
.visit__nap a{color:#fff;border-bottom:1px solid rgba(255,255,255,.35);transition:.3s}
.visit__nap a:hover{border-color:var(--accent-2);color:var(--accent-2)}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1000px){
  .seasons__grid{grid-template-columns:1fr;gap:0}
  .season:last-child{border-bottom:1px solid var(--line)}
  .hours__grid{grid-template-columns:1fr;gap:36px}
  .current__grid{grid-template-columns:1fr;gap:40px}
  .current__photo{max-width:520px}
}
@media(max-width:720px){
  .sched-head{min-height:66vh}
  .visit__nap{grid-template-columns:1fr;gap:24px}
  .current__actions .btn{width:100%;justify-content:center}
}

/* Programme deep link from /programs (Dasha, 2026-08-04). The band names what
   the grid was narrowed to and offers the way back to everything, because a
   visitor who lands here from a programme card has a filter applied that they
   did not set themselves. */
.grid-prog{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin:0 0 26px}
.grid-prog__name{font-family:var(--serif);font-size:clamp(1.25rem,2vw,1.6rem);color:var(--ink)}
.grid-prog__all{font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--accent-text);border-bottom:1px solid currentColor;padding-bottom:2px}
.grid-prog__all:hover{color:var(--ink)}