/* OnPointe public website styles: navigation, hero, editorial sections,
   class finder, schedule, programs, tuition, gallery, enrollment, footer. */

/* ---------- Type scale ---------- */
.display { font-family: var(--serif); font-weight: 500; letter-spacing: -.025em; line-height: .9; font-variation-settings: "opsz" 96; }
.h1 { font: 500 clamp(44px, 6.4vw, 104px)/.96 var(--serif); letter-spacing: -.022em; font-variation-settings: "opsz" 96; }
.h2 { font: 500 clamp(36px, 4.6vw, 72px)/1 var(--serif); letter-spacing: -.02em; font-variation-settings: "opsz" 72; }
.h3 { font: 500 clamp(26px, 2.4vw, 36px)/1.1 var(--serif); letter-spacing: -.012em; }
.h4 { font: 600 19px/1.3 var(--sans); }
.lede { font-size: clamp(18px, 1.45vw, 21px); line-height: 1.55; color: var(--ink-2); max-width: 36em; }
.small { font-size: 14px; color: var(--muted); }
.kicker { font: 500 14px/1.3 var(--sans); color: var(--ink-2); letter-spacing: .01em; display: flex; align-items: center; gap: 12px; margin: 0 0 22px; }
.kicker::before { content: ""; width: 34px; height: 1px; background: currentColor; opacity: .6; }
.on-dark .kicker, .dark .kicker { color: var(--muted-on-dark); }
.it { font-style: italic; }
.dark { background: var(--midnight); color: var(--ivory); }
.dark .lede { color: #D8CCC5; }
.dark .small { color: var(--muted-on-dark); }
.dark .link { color: #FF9A86; }
.section { padding: clamp(84px, 11vw, 168px) 0; position: relative; }
.section.tight { padding: clamp(64px, 8vw, 112px) 0; }

/* ---------- Site navigation ---------- */
.site-nav { position: sticky; top: var(--bar-h); z-index: 120; transition: background .35s var(--ease), box-shadow .35s var(--ease), transform .35s var(--ease); }
.site-nav .wrap { display: flex; align-items: center; gap: 28px; height: 84px; transition: height .35s var(--ease); }
.site-nav .logo { flex: 0 0 auto; display: block; }
.site-nav .logo img { height: 52px; width: auto; transition: height .35s var(--ease); }
.nav-links { display: flex; align-items: center; gap: clamp(16px, 2vw, 32px); margin-left: auto; list-style: none; }
.nav-links a { text-decoration: none; font-size: 15px; font-weight: 500; position: relative; padding: 6px 0; }
.nav-links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--neon); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after { transform: scaleX(1); }
.nav-cta { margin-left: 8px; }
.nav-toggle { display: none; margin-left: auto; width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--line-strong); background: transparent; cursor: pointer; align-items: center; justify-content: center; flex-direction: column; gap: 6px; }
.nav-toggle span { width: 18px; height: 1.5px; background: currentColor; transition: transform .3s var(--ease); }
.site-nav.is-light { background: rgba(251, 247, 242, .92); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2); box-shadow: 0 1px 0 var(--line); }
.site-nav.is-condensed .wrap { height: 68px; }
.site-nav.is-condensed .logo img { height: 42px; }
.site-nav.over-dark { color: var(--ivory); }
.site-nav.over-dark .nav-toggle { border-color: rgba(251, 247, 242, .4); }
.site-nav.over-dark .btn.ghost { color: var(--ivory); border-color: rgba(251, 247, 242, .45); }
.site-nav.over-dark .nav-cta { --b: var(--ivory); --f: var(--ink); }
.site-nav.over-dark .nav-cta:hover { background: #fff; border-color: #fff; }
.has-hero .site-nav { position: fixed; left: 0; right: 0; }
@media (max-width: 1080px) {
  .nav-links, .nav-cta { display: none; }
  .nav-toggle { display: inline-flex; }
  .site-nav .wrap { height: 72px; }
  .site-nav .logo img { height: 44px; }
}
/* Full-screen menu */
.menu-sheet { position: fixed; inset: var(--bar-h) 0 0 0; z-index: 140; background: var(--midnight); color: var(--ivory); display: flex; flex-direction: column; padding: 18px var(--gutter) 32px; opacity: 0; visibility: hidden; transition: opacity .35s var(--ease), visibility 0s .35s; overflow-y: auto; }
.menu-sheet.is-open { opacity: 1; visibility: visible; transition: opacity .35s var(--ease); }
.menu-top { display: flex; align-items: center; justify-content: space-between; height: 56px; }
.menu-top img { height: 40px; width: auto; }
.menu-close { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(251, 247, 242, .35); background: transparent; color: inherit; font-size: 22px; cursor: pointer; }
.menu-sheet ul { list-style: none; margin: 28px 0 auto; }
.menu-sheet li a { display: block; font: 500 clamp(34px, 9vw, 56px)/1.15 var(--serif); text-decoration: none; padding: 6px 0; letter-spacing: -.015em; transform: translateY(16px); opacity: 0; transition: transform .6s var(--ease), opacity .6s var(--ease); }
.menu-sheet.is-open li a { transform: none; opacity: 1; }
.menu-sheet.is-open li:nth-child(2) a { transition-delay: .04s; } .menu-sheet.is-open li:nth-child(3) a { transition-delay: .08s; } .menu-sheet.is-open li:nth-child(4) a { transition-delay: .12s; } .menu-sheet.is-open li:nth-child(5) a { transition-delay: .16s; } .menu-sheet.is-open li:nth-child(6) a { transition-delay: .2s; } .menu-sheet.is-open li:nth-child(7) a { transition-delay: .24s; }
.menu-foot { display: grid; gap: 14px; margin-top: 32px; font-size: 15px; color: var(--muted-on-dark); }
.menu-foot a { color: var(--ivory); }
.menu-foot .btn { width: 100%; }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: calc(100vh - var(--bar-h)); min-height: calc(100svh - var(--bar-h)); background: var(--midnight); color: var(--ivory); overflow: hidden; display: flex; isolation: isolate; }
.hero-media { position: absolute; top: 0; right: 0; height: 82%; width: min(64vw, 1200px); z-index: 0; }
.hero-media picture, .hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-media img { object-fit: cover; object-position: 50% 50%; -webkit-mask-image: linear-gradient(90deg, transparent 4%, rgba(0,0,0,.4) 20%, #000 40%); mask-image: linear-gradient(90deg, transparent 4%, rgba(0,0,0,.4) 20%, #000 40%); }
.hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, var(--midnight) 0%, rgba(15, 11, 10, 0) 30%), linear-gradient(180deg, rgba(15, 11, 10, .55) 0%, rgba(15, 11, 10, 0) 22%); pointer-events: none; }
.hero-trace { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 2; }
.hero-trace path { fill: none; stroke: url(#heroNeon); stroke-width: 3; stroke-linecap: round; }
.hero-trace .trace-dot { fill: #FFF3EE; }
@media (max-width: 900px) { .hero-trace path { stroke-width: 5; } }
.hero-inner { position: relative; z-index: 3; width: min(100% - 2 * var(--gutter), var(--maxw)); margin: 0 auto; display: flex; flex-direction: column; justify-content: flex-end; padding: 150px 0 clamp(40px, 6vh, 72px); }
.hero-title { font: 500 clamp(66px, 10.4vw, 184px)/.86 var(--serif); letter-spacing: -.035em; margin: 0; font-variation-settings: "opsz" 96; }
.hero-title .ln { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.hero-title .ln > span { display: inline-block; }
.hero-title .ln:nth-child(2) { padding-left: clamp(40px, 8.5vw, 150px); }
.hero-foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; margin-top: clamp(28px, 4vh, 44px); }
.hero-tag { font: italic 400 clamp(20px, 1.8vw, 28px)/1.3 var(--serif); margin: 0 0 8px; color: #F6E9E1; }
.hero-tag sup { font-size: .45em; vertical-align: super; font-style: normal; }
.hero-sub { font-size: 15.5px; color: var(--muted-on-dark); margin: 0; max-width: 30em; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-scroll { display: none; position: absolute; right: var(--gutter); bottom: 28px; z-index: 3; writing-mode: vertical-rl; font-size: 12.5px; letter-spacing: .08em; color: var(--muted-on-dark); display: flex; align-items: center; gap: 12px; text-decoration: none; }
.hero-scroll::after { content: ""; width: 1px; height: 54px; background: linear-gradient(180deg, rgba(251,247,242,.6), transparent); }
/* Hero entrance (JS adds .is-playing then .is-done; without JS everything is visible) */
.js-hero .hero-trace path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.js-hero .hero-trace .trace-dot { opacity: 0; }
.js-hero .hero-media img { clip-path: inset(0 100% 0 0); }
.js-hero .hero-title .ln > span { transform: translateY(105%); }
.js-hero .hero-foot, .js-hero .hero-scroll { opacity: 0; transform: translateY(14px); }
.js-hero.has-hero .site-nav { opacity: 0; }
.hero.is-playing .hero-trace path { animation: draw 2.1s var(--ease-in-out) .15s forwards, ignite 1.2s linear 2.2s 1; }
.hero.is-playing .hero-media img { animation: unveil 2.2s var(--ease-in-out) .55s forwards; }
.hero.is-playing .hero-title .ln > span { animation: rise 1.3s var(--ease) forwards; }
.hero.is-playing .hero-title .ln:nth-child(1) > span { animation-delay: 1s; }
.hero.is-playing .hero-title .ln:nth-child(2) > span { animation-delay: 1.14s; }
.hero.is-playing .hero-foot { animation: fadeup 1s var(--ease) 1.85s forwards; }
.hero.is-playing .hero-scroll { animation: fadeup 1s var(--ease) 2.3s forwards; }
.js-hero.has-hero.hero-ready .site-nav { opacity: 1; transition: opacity 1s var(--ease) .1s; }
.hero.is-done .hero-trace path { stroke-dashoffset: 0; }
.hero.is-done .hero-media img { clip-path: none; }
.hero.is-done .hero-title .ln > span, .hero.is-done .hero-foot, .hero.is-done .hero-scroll { transform: none; opacity: 1; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes ignite { 0% { opacity: 1; } 8% { opacity: .35; } 14% { opacity: 1; } 22% { opacity: .55; } 28%, 100% { opacity: 1; } }
@keyframes unveil { to { clip-path: inset(0 0 0 0); } }
@keyframes rise { to { transform: none; } }
@keyframes fadeup { to { opacity: 1; transform: none; } }
@media (max-width: 900px) {
  .hero { flex-direction: column; min-height: auto; }
  .hero-media { position: relative; width: 100%; aspect-ratio: 1040 / 856; height: auto; margin-top: 72px; }
  .hero-media img { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.5) 14%, #000 32%), linear-gradient(0deg, transparent 0%, #000 34%); -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.5) 14%, #000 32%), linear-gradient(0deg, transparent 0%, #000 34%); mask-composite: intersect; }
  .hero-inner { padding: 0 0 48px; margin-top: -26vw; }
  .hero-title { font-size: clamp(58px, 17.5vw, 120px); }
  .hero-title .ln:nth-child(2) { padding-left: 9vw; }
  .hero-foot { grid-template-columns: 1fr; }
  .hero-actions .btn { flex: 1 1 auto; }
  .hero-scroll { display: none; }
}

/* ---------- Intro ---------- */
.intro-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0 clamp(16px, 2vw, 32px); }
.intro-aside { grid-column: 1 / span 3; padding-top: 14px; }
.intro-aside p { font-size: 15px; color: var(--muted); margin: 0 0 6px; }
.intro-main { grid-column: 4 / span 9; }
.intro-quote { font: 400 clamp(30px, 3.5vw, 56px)/1.14 var(--serif); letter-spacing: -.015em; margin: 0; font-variation-settings: "opsz" 60; }
.intro-quote em { font-style: italic; }
.apart { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 56px); margin-top: clamp(56px, 7vw, 96px); }
.apart h3 { font: italic 400 25px/1.2 var(--serif); margin-bottom: 12px; }
.apart p { color: var(--ink-2); font-size: 16px; margin: 0; }
.apart div { padding-top: 22px; border-top: 1px solid var(--line-strong); }
@media (max-width: 900px) { .intro-aside, .intro-main { grid-column: 1 / -1; } .intro-aside { padding: 0 0 22px; } .apart { grid-template-columns: 1fr; } }

/* ---------- Art of movement ---------- */
.movement { background: var(--midnight); color: var(--ivory); }
.mv-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 26em); gap: 32px; align-items: end; margin-bottom: clamp(48px, 6vw, 88px); }
.mv-head .lede { color: #D8CCC5; }
.mv-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 96px); align-items: start; }
.mv-list { list-style: none; counter-reset: none; }
.mv-item { border-top: 1px solid var(--line-dark); }
.mv-item:last-child { border-bottom: 1px solid var(--line-dark); }
.mv-btn { width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: clamp(10px, 1.1vw, 16px) 0; background: none; border: 0; color: #A39089; cursor: pointer; text-align: left; font: 500 clamp(38px, 5.2vw, 84px)/1 var(--serif); letter-spacing: -.025em; transition: color .45s var(--ease), padding .45s var(--ease); font-variation-settings: "opsz" 96; }
.mv-btn small { font: 400 14px/1 var(--sans); letter-spacing: .01em; color: var(--muted-on-dark); opacity: 0; transition: opacity .4s; white-space: nowrap; }
.mv-btn:hover { color: #D8CCC5; }
.mv-btn[aria-pressed="true"] { color: var(--ivory); padding-left: clamp(12px, 1.6vw, 28px); }
.mv-btn[aria-pressed="true"] small, .mv-btn:hover small { opacity: 1; }
.mv-stage { position: sticky; top: calc(var(--bar-h) + 96px); }
.mv-frame { position: relative; aspect-ratio: 4 / 5; border-radius: 4px; overflow: hidden; background: var(--stage); }
.mv-frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .9s var(--ease), transform 1.6s var(--ease); }
.mv-frame img.is-on { opacity: 1; transform: none; }
.mv-glyph { position: absolute; inset: 0; display: grid; place-items: center; transition: opacity .6s; }
.mv-glyph svg { width: 78%; height: 78%; overflow: visible; }
.mv-glyph .g { fill: none; stroke: url(#glyphNeon); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.mv-glyph.drawing .g { animation: draw 1.6s var(--ease-in-out) forwards; stroke-dashoffset: 1; }
.mv-glyph.drawing .g:nth-child(2) { animation-delay: .25s; } .mv-glyph.drawing .g:nth-child(3) { animation-delay: .45s; }
.mv-glyph .dotf { fill: #FFB3A5; stroke: none; }
.mv-frame.has-photo .mv-glyph { opacity: .0; }
.mv-frame .mv-cap { position: absolute; left: 18px; bottom: 16px; right: 18px; font-size: 12.5px; color: rgba(251, 247, 242, .8); z-index: 2; display: flex; justify-content: space-between; gap: 12px; }
.mv-frame::after { content: ""; position: absolute; inset: auto 0 0 0; height: 30%; background: linear-gradient(0deg, rgba(15,11,10,.7), transparent); pointer-events: none; }
.mv-text { margin-top: 26px; min-height: 220px; }
.mv-text p { color: #D8CCC5; font-size: 16.5px; }
.mv-text .mv-meta { display: flex; gap: 10px 22px; flex-wrap: wrap; align-items: center; margin-top: 18px; font-size: 14.5px; color: var(--muted-on-dark); }
.mv-panel-m { display: none; }
@media (max-width: 900px) {
  .mv-head { grid-template-columns: 1fr; }
  .mv-grid { grid-template-columns: 1fr; }
  .mv-stage { display: none; }
  .mv-btn { font-size: clamp(36px, 10vw, 56px); }
  .mv-btn small { display: none; }
  .mv-panel-m { display: block; overflow: hidden; height: 0; transition: height .5s var(--ease); }
  .mv-panel-m .inner { padding: 4px 0 26px; }
  .mv-panel-m .mv-frame { aspect-ratio: 16 / 11; margin-bottom: 18px; }
  .mv-panel-m p { color: #D8CCC5; font-size: 16px; }
}

/* ---------- Find your rhythm ---------- */
.rhythm { background: var(--blush); }
.rhythm-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
.who { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 30px 0 0; }
.who button { text-align: left; padding: 18px 18px 16px; border-radius: 10px; border: 1px solid rgba(27, 20, 18, .2); background: rgba(251, 247, 242, .55); cursor: pointer; transition: background .25s, border-color .25s, transform .25s var(--ease); }
.who button b { display: block; font: 500 26px/1.1 var(--serif); letter-spacing: -.01em; }
.who button span { font-size: 13.5px; color: var(--muted); }
.who button:hover { border-color: var(--ink); }
.who button[aria-pressed="true"] { background: var(--midnight); color: var(--ivory); border-color: var(--midnight); }
.who button[aria-pressed="true"] span { color: var(--muted-on-dark); }
.exp { display: flex; gap: 8px; margin-top: 16px; flex-wrap: wrap; }
.exp[hidden] { display: none; }
.chip { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--line-strong); background: transparent; cursor: pointer; font-size: 14.5px; font-weight: 500; white-space: nowrap; transition: background .2s, color .2s, border-color .2s; }
.chip:hover { border-color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--ink); color: var(--ivory); border-color: var(--ink); }
.rhythm-panel { background: var(--ivory); border-radius: 14px; padding: clamp(22px, 2.6vw, 38px); box-shadow: 0 30px 80px -40px rgba(120, 40, 30, .45); min-height: 420px; }
.rp-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.rp-head h3 { font: 500 28px/1.15 var(--serif); }
.rp-list { list-style: none; }
.rp-row { display: grid; grid-template-columns: 4.2em minmax(0, 1fr) auto; gap: 16px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line); }
.rp-row .d { font-weight: 600; font-size: 14px; color: var(--rose); }
.rp-row .n { font: 500 21px/1.25 var(--serif); }
.rp-row .n small { display: block; font: 400 13.5px/1.4 var(--sans); color: var(--muted); margin-top: 3px; }
.rp-row .tm { font-size: 14px; color: var(--ink-2); white-space: nowrap; text-align: right; }
.rp-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 20px; flex-wrap: wrap; }
.rp-note { font-size: 13px; color: var(--muted); max-width: 32em; margin: 0; }
@media (max-width: 900px) { .rhythm-grid { grid-template-columns: 1fr; } .rhythm-panel { min-height: 0; } .rp-row { grid-template-columns: 3.4em minmax(0, 1fr); } .rp-row .tm { grid-column: 2; text-align: left; } }

/* ---------- Experience ---------- */
.exp-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
.xp-a { grid-column: 1 / span 7; grid-row: 1 / span 2; }
.xp-b { grid-column: 9 / span 4; align-self: end; }
.xp-c { grid-column: 8 / span 4; margin-top: clamp(16px, 3vw, 48px); }
.exp-grid figure { margin: 0; position: relative; overflow: hidden; border-radius: 3px; background: var(--champagne); }
.exp-grid figure img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 3 / 2; transition: transform 1.4s var(--ease); }
.xp-a img { aspect-ratio: 4 / 4.2; object-position: 52% 50%; }
.xp-b img { aspect-ratio: 4 / 5; object-position: 46% 50%; }
.exp-grid figure:hover img { transform: scale(1.035); }
.exp-grid figcaption { font-size: 13px; color: var(--muted); padding-top: 10px; background: var(--ivory); }
.xp-copy { grid-column: 1 / span 6; margin-top: clamp(40px, 5vw, 80px); }
.xp-facts { grid-column: 8 / span 5; margin-top: clamp(40px, 5vw, 80px); list-style: none; }
.xp-facts li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 16px 0; border-top: 1px solid var(--line); }
.xp-facts li b { font: 500 22px/1.2 var(--serif); }
.xp-facts li span { font-size: 15px; color: var(--muted); }
@media (max-width: 900px) { .xp-a, .xp-b, .xp-c, .xp-copy, .xp-facts { grid-column: 1 / -1; grid-row: auto; } .xp-b { width: 72%; margin-left: auto; } .xp-c { width: 82%; margin-top: 0; } }

/* ---------- Owner ---------- */
.owner { background: var(--ivory-2); }
.owner-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 112px); align-items: center; }
.owner-photo { position: relative; margin: 0; }
.owner-photo img { width: 100%; aspect-ratio: 4 / 5.2; object-fit: cover; object-position: 50% 22%; border-radius: 3px; }
.owner-photo figcaption { font-size: 13px; color: var(--muted); margin-top: 10px; }
.owner-hi { font: 500 clamp(48px, 6vw, 96px)/.95 var(--serif); letter-spacing: -.03em; margin-bottom: 30px; }
.owner-quote { font: italic 400 clamp(22px, 2vw, 30px)/1.35 var(--serif); margin: 0 0 26px; padding-left: 24px; border-left: 2px solid; border-image: var(--neon) 1; }
.owner-body p { color: var(--ink-2); max-width: 38em; }
.values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; list-style: none; margin-top: 30px; }
.values li { padding: 14px 0; border-top: 1px solid var(--line); }
.values b { display: block; font-weight: 600; font-size: 15px; }
.values span { font-size: 14.5px; color: var(--muted); }
.faculty-note { margin-top: 30px; font-size: 15px; color: var(--ink-2); }
@media (max-width: 900px) { .owner-grid { grid-template-columns: 1fr; } .owner-photo { width: 86%; } .values { grid-template-columns: 1fr; } }

/* ---------- Beyond the studio (poster wall) ---------- */
.beyond { background: var(--midnight); color: var(--ivory); }
.poster-wall { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: minmax(150px, auto); gap: clamp(12px, 1.4vw, 20px); margin-top: clamp(40px, 5vw, 72px); }
.poster { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 22px; padding: clamp(22px, 2.4vw, 36px); border-radius: 6px; text-decoration: none; overflow: hidden; transition: transform .6s var(--ease); isolation: isolate; }
.poster:hover { transform: translateY(-4px); }
.poster h3 { font: 500 clamp(30px, 3vw, 48px)/1 var(--serif); letter-spacing: -.02em; }
.poster p { margin: 0; font-size: 15px; line-height: 1.5; max-width: 30em; }
.poster .go { font-size: 14px; font-weight: 500; display: inline-flex; gap: 8px; align-items: center; }
.poster .go::after { content: ""; width: 26px; height: 1px; background: currentColor; transition: width .4s var(--ease); }
.poster:hover .go::after { width: 44px; }
.p-team { grid-column: 1 / span 7; grid-row: span 2; background: var(--stage); border: 1px solid var(--line-dark); color: var(--ivory); min-height: 460px; }
.p-team h3 { font-size: clamp(44px, 5.4vw, 92px); line-height: .92; }
.p-team .ring { position: absolute; right: -12%; top: -18%; width: 70%; aspect-ratio: 1; z-index: -1; opacity: .9; }
.p-team .ring circle { fill: none; stroke: url(#ringNeon); stroke-width: .5; }
.p-team .facts { display: flex; gap: 10px 26px; flex-wrap: wrap; font-size: 14px; color: var(--muted-on-dark); }
.p-camp { grid-column: 8 / span 5; background: var(--blush); color: var(--ink); }
.p-camp h3 { font-size: clamp(36px, 3.6vw, 58px); }
.p-party { grid-column: 8 / span 5; background: var(--champagne); color: var(--ink); }
.p-rent { grid-column: 1 / span 4; background: var(--ivory); color: var(--ink); }
.p-gym { grid-column: 5 / span 4; background: #2A1E1B; color: var(--ivory); }
.p-priv { grid-column: 9 / span 4; background: var(--neon-fill); color: #fff; }
.p-priv h3, .p-priv p { color: #fff; }
.p-gym p, .p-team p { color: #D8CCC5; }
@media (max-width: 1000px) { .p-team, .p-camp, .p-party, .p-rent, .p-gym, .p-priv { grid-column: span 6; grid-row: auto; } .p-team { grid-column: 1 / -1; min-height: 380px; } }
@media (max-width: 640px) { .poster-wall > * { grid-column: 1 / -1 !important; } }

/* ---------- Begin ---------- */
.begin-title { font: 500 clamp(56px, 9vw, 152px)/.9 var(--serif); letter-spacing: -.035em; margin-bottom: clamp(40px, 5vw, 72px); font-variation-settings: "opsz" 96; }
.begin-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 96px); align-items: end; }
.steps { list-style: none; counter-reset: s; display: grid; gap: 0; }
.steps li { counter-increment: s; display: grid; grid-template-columns: 3.2em minmax(0, 1fr); gap: 12px; padding: 20px 0; border-top: 1px solid var(--line-strong); }
.steps li::before { content: counter(s); font: italic 400 30px/1 var(--serif); color: var(--rose); }
.steps b { display: block; font: 500 23px/1.2 var(--serif); margin-bottom: 4px; }
.steps span { color: var(--muted); font-size: 15.5px; }
.begin-cta { display: grid; gap: 14px; }
.begin-cta .btn { width: 100%; }
.begin-cta p { font-size: 14px; color: var(--muted); margin: 0; }
@media (max-width: 900px) { .begin-grid { grid-template-columns: 1fr; } }

/* ---------- Page header (inner pages) ---------- */
.page-head { padding: clamp(56px, 8vw, 120px) 0 clamp(40px, 5vw, 72px); }
.page-head.dark { padding-top: clamp(40px, 6vw, 96px); }
.page-head .h1 { max-width: 12em; }
.page-head .lede { margin-top: 26px; }
.crumbs { font-size: 14px; color: var(--muted); margin-bottom: 26px; display: flex; gap: 8px; flex-wrap: wrap; }
.crumbs a { color: inherit; }
.dark .crumbs { color: var(--muted-on-dark); }
.season-badge { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 999px; background: var(--ivory); border: 1px solid var(--line); font-size: 14px; font-weight: 500; }
.season-badge::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #3FA36B; box-shadow: 0 0 0 4px rgba(63, 163, 107, .18); }

/* ---------- Class finder ---------- */
.finder { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: clamp(24px, 3.5vw, 56px); align-items: start; }
.f-controls { position: sticky; top: calc(var(--bar-h) + 92px); display: grid; gap: 26px; }
.f-group h3 { font: 600 14px/1.3 var(--sans); margin-bottom: 12px; color: var(--ink); }
.f-group .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.f-ages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.f-ages button { text-align: left; padding: 12px 14px; border-radius: 8px; border: 1px solid var(--line-strong); background: transparent; cursor: pointer; }
.f-ages button b { display: block; font: 500 19px/1.2 var(--serif); }
.f-ages button span { font-size: 12.5px; color: var(--muted); }
.f-ages button[aria-pressed="true"] { background: var(--ink); color: var(--ivory); border-color: var(--ink); }
.f-ages button[aria-pressed="true"] span { color: var(--muted-on-dark); }
.f-clear { justify-self: start; background: none; border: 0; padding: 0; min-height: 40px; color: var(--rose); text-decoration: underline; text-underline-offset: .2em; cursor: pointer; font-size: 14px; }
.f-results-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; padding-bottom: 18px; border-bottom: 1px solid var(--ink); }
.f-results-head h3 { font: 500 30px/1.1 var(--serif); }
.f-note { font-size: 13.5px; color: var(--muted); margin: 14px 0 6px; padding: 12px 14px; background: var(--ivory-2); border-radius: 8px; }
.res { list-style: none; }
.res-item { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: 8px 28px; padding: 26px 0; border-bottom: 1px solid var(--line); align-items: start; }
.res-when b { display: block; font: 500 22px/1.1 var(--serif); }
.res-when span { font-size: 14px; color: var(--muted); display: block; margin-top: 4px; }
.res-main h4 { font: 500 26px/1.15 var(--serif); letter-spacing: -.01em; }
.res-main .meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 8px 0 10px; font-size: 14px; color: var(--ink-2); }
.res-main .meta span { display: inline-flex; align-items: center; gap: 6px; }
.res-main p { font-size: 15px; color: var(--muted); margin: 0; max-width: 46em; }
.res-main .why { font-size: 13.5px; color: var(--rose); margin-top: 8px; }
.res-act { display: grid; gap: 8px; justify-items: end; }
.res-empty { padding: 48px 0; }
.res-empty h4 { font: 500 26px/1.2 var(--serif); margin-bottom: 8px; }
@media (max-width: 980px) { .finder { grid-template-columns: 1fr; } .f-controls { position: static; } .res-item { grid-template-columns: 1fr; } .res-act { justify-items: start; grid-auto-flow: column; justify-content: start; } }

/* ---------- Schedule ---------- */
.sched-tools { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.sched-tools .chips { display: flex; gap: 8px; flex-wrap: wrap; }
.sched-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--muted); }
.sched-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.week { position: relative; display: grid; grid-template-columns: 64px repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--ink); }
.week-h { position: sticky; top: calc(var(--bar-h) + 68px); z-index: 5; background: var(--ivory); padding: 14px 8px 12px; border-bottom: 1px solid var(--line); font: 500 20px/1 var(--serif); }
.week-h small { display: flex; justify-content: space-between; font: 500 11.5px/1 var(--sans); color: var(--muted); margin-top: 8px; }
.week-col { position: relative; border-left: 1px solid var(--line); }
.week-times { position: relative; }
.week-times span { position: absolute; left: 0; right: 8px; font-size: 12px; color: var(--muted); transform: translateY(-50%); text-align: right; }
.week-grid-lines { position: absolute; inset: 0; pointer-events: none; }
.week-grid-lines i { position: absolute; left: 0; right: 0; border-top: 1px dashed rgba(27, 20, 18, .08); }
.slot { position: absolute; z-index: 1; border-radius: 5px; padding: 6px 8px; overflow: hidden; text-align: left; border: 0; cursor: pointer; font-size: 12.5px; line-height: 1.25; background: #fff; box-shadow: inset 3px 0 0 var(--c, var(--ink)), 0 1px 2px rgba(27, 20, 18, .08); transition: transform .2s var(--ease), box-shadow .2s, opacity .3s; display: flex; flex-direction: column; gap: 2px; }
.slot b { font-weight: 600; font-size: 12.5px; }
.slot span { color: var(--muted); font-size: 11.5px; }
.slot:hover { transform: translateY(-1px); z-index: 9 !important; box-shadow: inset 3px 0 0 var(--c, var(--ink)), 0 8px 20px rgba(27, 20, 18, .14); z-index: 3; }
.slot.is-dim { opacity: .18; }
.slot.tbd { background: repeating-linear-gradient(135deg, #fff 0 6px, #F7F0EA 6px 12px); }
.slot[style*="z-index:2"] { box-shadow: inset 3px 0 0 var(--c, var(--ink)), -6px 0 14px -6px rgba(27,20,18,.35); }
.slot.demo { box-shadow: inset 3px 0 0 var(--c), 0 0 0 1.5px var(--coral); }
.slot[data-p="littles"] { --c: #E58AA6; } .slot[data-p="youth"] { --c: #E9542F; } .slot[data-p="homeschool"] { --c: #C08B3A; } .slot[data-p="adult"] { --c: #6A4C93; } .slot[data-p="team"] { --c: #1B1412; } .slot[data-p="open"] { --c: #3E8E7E; }
.day-view { display: none; }
@media (max-width: 960px) {
  .week { display: none; }
  .day-view { display: block; }
  .day-tabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 6px; position: sticky; top: calc(var(--bar-h) + 72px); background: var(--ivory); z-index: 5; scrollbar-width: none; }
  .day-tabs::-webkit-scrollbar { display: none; }
  .day-tabs button { flex: 0 0 auto; min-width: 64px; min-height: 52px; border-radius: 10px; border: 1px solid var(--line-strong); background: transparent; cursor: pointer; font: 500 16px/1.1 var(--serif); }
  .day-tabs button small { display: block; font: 500 11px/1.2 var(--sans); color: var(--muted); }
  .day-tabs button[aria-pressed="true"] { background: var(--ink); color: var(--ivory); border-color: var(--ink); }
  .day-tabs button[aria-pressed="true"] small { color: var(--muted-on-dark); }
  .day-list { list-style: none; margin-top: 14px; }
  .day-list li { border-bottom: 1px solid var(--line); }
  .day-list button { width: 100%; display: grid; grid-template-columns: 5.6em minmax(0, 1fr); gap: 14px; padding: 16px 4px; background: none; border: 0; text-align: left; cursor: pointer; }
  .day-list .t { font-size: 14px; font-weight: 600; }
  .day-list .t small { display: block; font-weight: 400; color: var(--muted); }
  .day-list .n { font: 500 20px/1.2 var(--serif); padding-left: 12px; border-left: 3px solid var(--c, var(--ink)); }
  .day-list .n small { display: block; font: 400 13px/1.4 var(--sans); color: var(--muted); margin-top: 4px; }
}
.class-detail .cd-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; margin: 4px 0 20px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.class-detail .cd-meta div span { display: block; font-size: 12.5px; color: var(--muted); }
.class-detail .cd-meta div b { font-weight: 500; }
.class-detail .cd-note { font-size: 13.5px; background: var(--warn-soft); color: var(--warn); padding: 10px 12px; border-radius: 8px; margin-bottom: 16px; }
.class-detail h3 { font: 600 14px/1.3 var(--sans); margin: 16px 0 8px; }
.class-detail ul { padding-left: 18px; color: var(--ink-2); font-size: 15px; }

/* ---------- Tuition ---------- */
.price-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 96px); align-items: start; }
.ladder { list-style: none; }
.ladder li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); position: relative; }
.ladder li .bar { position: absolute; left: 0; bottom: -1px; height: 2px; background: var(--neon); width: 0; transition: width 1.2s var(--ease); }
.ladder.is-visible li .bar { width: var(--w); }
.ladder .k { font: 500 24px/1.2 var(--serif); }
.ladder .k small { display: block; font: 400 13.5px/1.4 var(--sans); color: var(--muted); margin-top: 2px; }
.ladder .v { font: 500 32px/1 var(--serif); }
.ladder .v small { font: 400 14px var(--sans); color: var(--muted); }
.est { position: sticky; top: calc(var(--bar-h) + 92px); background: var(--midnight); color: var(--ivory); border-radius: 14px; padding: clamp(22px, 2.6vw, 36px); }
.est h3 { font: 500 30px/1.1 var(--serif); margin-bottom: 6px; }
.est .small { color: var(--muted-on-dark); }
.est-dancers { list-style: none; display: grid; gap: 12px; margin: 22px 0 16px; }
.est-d { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 12px 14px; border: 1px solid var(--line-dark); border-radius: 10px; }
.est-d label { font-size: 14px; }
.est-d select { background: var(--stage-2); color: var(--ivory); border: 1px solid var(--line-dark); border-radius: 8px; min-height: 40px; padding: 0 10px; }
.est-d .amt { font: 500 20px/1 var(--serif); min-width: 4.4em; text-align: right; }
.est-d .rm { background: none; border: 0; color: var(--muted-on-dark); cursor: pointer; font-size: 20px; width: 32px; height: 32px; border-radius: 50%; }
.est-d .rm:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.est-lines { list-style: none; border-top: 1px solid var(--line-dark); padding-top: 14px; display: grid; gap: 8px; font-size: 14.5px; color: #D8CCC5; }
.est-lines li { display: flex; justify-content: space-between; gap: 12px; }
.est-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line-dark); }
.est-total b { font: 500 46px/1 var(--serif); }
.est-add { background: none; border: 1px dashed var(--line-dark); color: var(--ivory); border-radius: 10px; min-height: 46px; width: 100%; cursor: pointer; }
.est-add:hover { border-color: var(--ivory); }
.fee-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 48px); }
.fee-cols h3 { font: 500 26px/1.15 var(--serif); margin-bottom: 14px; }
.fee-cols ul { list-style: none; }
.fee-cols li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); font-size: 15.5px; }
.fee-cols li b { font-weight: 600; white-space: nowrap; }
.policy { border-top: 1px solid var(--ink); }
.policy details { border-bottom: 1px solid var(--line); }
.policy summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 0; font: 500 clamp(22px, 2vw, 28px)/1.2 var(--serif); }
.policy summary::-webkit-details-marker { display: none; }
.policy summary::after { content: "+"; font: 300 30px/1 var(--sans); transition: transform .3s var(--ease); }
.policy details[open] summary::after { transform: rotate(45deg); }
.policy ul { padding: 0 0 22px 20px; color: var(--ink-2); max-width: 52em; }
.policy li { margin-bottom: 6px; }
@media (max-width: 960px) { .price-grid { grid-template-columns: 1fr; } .est { position: static; } .fee-cols { grid-template-columns: 1fr; } }

/* ---------- Programs ---------- */
.prog { padding: clamp(72px, 9vw, 140px) 0; border-top: 1px solid var(--line); }
.prog-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 96px); align-items: start; }
.prog-grid.flip { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.prog-grid.flip > :first-child { order: 2; }
.prog h2 { font: 500 clamp(44px, 5.6vw, 92px)/.95 var(--serif); letter-spacing: -.03em; }
.prog .lede { margin-top: 22px; }
.prog-list { list-style: none; margin-top: 22px; }
.prog-list li { padding: 12px 0 12px 26px; border-top: 1px solid var(--line); position: relative; }
.prog-list li::before { content: ""; position: absolute; left: 0; top: 1.2em; width: 12px; height: 1px; background: var(--rose); }
.prog-art { border-radius: 6px; overflow: hidden; position: relative; }
.prog-art img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.prog-card { background: var(--ivory-2); border-radius: 10px; padding: clamp(22px, 2.4vw, 34px); }
.prog-card h3 { font: 500 24px/1.2 var(--serif); margin-bottom: 12px; }
.prog-card dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px 22px; margin: 0; font-size: 15px; }
.prog-card dt { color: var(--muted); }
.prog-card dd { margin: 0; }
.prog.dark-band { background: var(--midnight); color: var(--ivory); border: 0; }
.prog.dark-band .prog-list li { border-color: var(--line-dark); }
.prog.dark-band .prog-card { background: var(--stage); }
.prog.dark-band .prog-card dt { color: var(--muted-on-dark); }
.prog-index { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.party-builder { display: grid; gap: 10px; }
.party-builder label { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; background: #fff; }
.party-builder input { margin-top: 4px; accent-color: var(--pink); width: 18px; height: 18px; }
@media (max-width: 900px) { .prog-grid, .prog-grid.flip { grid-template-columns: 1fr; } .prog-grid.flip > :first-child { order: 0; } }

/* ---------- Gallery ---------- */
.gal { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(12px, 1.4vw, 20px); }
.gal button { position: relative; padding: 0; border: 0; background: var(--champagne); cursor: zoom-in; overflow: hidden; border-radius: 3px; display: block; }
.gal img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.gal button:hover img { transform: scale(1.04); }
.gal .g1 { grid-column: 1 / span 8; grid-row: span 2; aspect-ratio: 16 / 10.5; }
.gal .g2 { grid-column: 9 / span 4; aspect-ratio: 4 / 3; }
.gal .g3 { grid-column: 9 / span 4; aspect-ratio: 4 / 3; }
.gal .g4 { grid-column: 1 / span 5; aspect-ratio: 4 / 5; }
.gal .g5 { grid-column: 6 / span 7; aspect-ratio: 16 / 11.4; align-self: end; }
.gal-cap { display: block; font-size: 13px; color: var(--muted); margin-top: 8px; }
@media (max-width: 760px) { .gal > * { grid-column: 1 / -1 !important; grid-row: auto !important; } }
.lb { position: fixed; inset: 0; z-index: 520; background: rgba(10, 7, 6, .96); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; opacity: 0; transition: opacity .3s; color: var(--ivory); }
.lb.is-in { opacity: 1; }
.lb-top { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; font-size: 14px; color: var(--muted-on-dark); }
.lb-stage { position: relative; display: grid; place-items: center; padding: 0 70px; touch-action: pan-y; }
.lb-stage img, .lb-stage video { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 2px; transition: opacity .35s, transform .35s var(--ease); }
.lb-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(251, 247, 242, .3); background: rgba(15, 11, 10, .5); color: #fff; font-size: 22px; cursor: pointer; }
.lb-btn:hover { border-color: #fff; }
.lb-prev { left: 12px; } .lb-next { right: 12px; }
.lb-close { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(251, 247, 242, .3); background: transparent; color: #fff; font-size: 20px; cursor: pointer; }
.lb-cap { padding: 14px 18px 22px; text-align: center; font-size: 14.5px; color: #D8CCC5; }
@media (max-width: 700px) { .lb-stage { padding: 0 8px; } .lb-btn { top: auto; bottom: -64px; transform: none; } .lb-cap { padding-bottom: 80px; } }

/* ---------- Enrollment ---------- */
.enroll-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: clamp(24px, 4vw, 72px); align-items: start; }
.e-steps { list-style: none; position: sticky; top: calc(var(--bar-h) + 92px); counter-reset: e; }
.e-steps li { counter-increment: e; }
.e-steps button { width: 100%; display: grid; grid-template-columns: 2.4em minmax(0, 1fr); gap: 10px; align-items: baseline; text-align: left; padding: 14px 0; border: 0; border-top: 1px solid var(--line); background: none; cursor: pointer; color: var(--muted); }
.e-steps button::before { content: counter(e); font: italic 400 22px/1 var(--serif); }
.e-steps button b { font-weight: 500; font-size: 16px; }
.e-steps button small { display: block; font-size: 13px; color: var(--muted); }
.e-steps button[aria-current="step"] { color: var(--ink); }
.e-steps button[aria-current="step"]::before { color: var(--rose); }
.e-steps button.done { color: var(--ink-2); }
.e-steps button:disabled { cursor: default; opacity: .6; }
.e-stage { min-height: 480px; }
.e-panel h2 { font: 500 clamp(34px, 3.6vw, 54px)/1.02 var(--serif); letter-spacing: -.02em; margin-bottom: 10px; }
.e-panel .lede { margin-bottom: 28px; }
.e-opts { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.e-opt { text-align: left; padding: 20px; border-radius: 10px; border: 1px solid var(--line-strong); background: #fff; cursor: pointer; display: grid; gap: 6px; transition: border-color .2s, box-shadow .2s; }
.e-opt b { font: 500 22px/1.15 var(--serif); }
.e-opt span { font-size: 14px; color: var(--muted); }
.e-opt:hover { border-color: var(--ink); }
.e-opt[aria-pressed="true"] { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--ivory-2); }
.e-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 32px; padding-top: 22px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.e-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.e-form .full { grid-column: 1 / -1; }
.e-summary { background: var(--ivory-2); border-radius: 12px; padding: 22px; display: grid; gap: 10px; font-size: 15px; }
.e-summary div { display: flex; justify-content: space-between; gap: 16px; }
.e-summary span { color: var(--muted); }
.e-done { text-align: left; }
.e-done .h2 { margin-bottom: 18px; }
@media (max-width: 900px) { .enroll-grid { grid-template-columns: 1fr; } .e-steps { position: static; display: flex; overflow-x: auto; gap: 6px; } .e-steps li { flex: 0 0 auto; } .e-steps button { border: 1px solid var(--line); border-radius: 999px; padding: 8px 14px; grid-template-columns: auto auto; } .e-steps button small { display: none; } .e-form { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.foot { background: var(--midnight); color: #D8CCC5; padding: clamp(72px, 8vw, 120px) 0 36px; }
.foot-top { display: grid; grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 2.4fr)); gap: 40px; padding-bottom: 56px; border-bottom: 1px solid var(--line-dark); }
.foot-brand img { height: 64px; width: auto; margin-bottom: 22px; }
.foot-brand p { font: italic 400 22px/1.35 var(--serif); color: var(--ivory); max-width: 16em; }
.foot .fh { font: 600 13.5px/1.3 var(--sans); color: var(--ivory); margin-bottom: 14px; letter-spacing: .01em; }
.foot ul { list-style: none; display: grid; gap: 8px; font-size: 15px; }
.foot a { text-decoration: none; }
.foot a:hover { color: #fff; text-decoration: underline; text-underline-offset: .2em; }
.foot .hours { display: grid; grid-template-columns: auto auto; gap: 4px 14px; font-size: 14px; margin-bottom: 16px; }
.foot .hours span:nth-child(odd) { color: var(--muted-on-dark); }
.foot-base { display: flex; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; padding-top: 28px; font-size: 13px; color: var(--muted-on-dark); }
.foot-base .concept { max-width: 56em; }
.foot-big { font: 500 clamp(64px, 14vw, 240px)/.8 var(--serif); letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1px rgba(251, 247, 242, .22); margin: 48px 0 0; white-space: nowrap; overflow: hidden; user-select: none; }
@media (max-width: 960px) { .foot-top { grid-template-columns: 1fr 1fr; } .foot-brand { grid-column: 1 / -1; } }
@media (max-width: 560px) { .foot-top { grid-template-columns: 1fr; } }

/* Concept ribbon shown once at the top of the site pages */
.concept-ribbon { background: var(--ivory-2); border-bottom: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.concept-ribbon .wrap { display: flex; gap: 12px; align-items: center; justify-content: space-between; min-height: 38px; padding: 6px 0; flex-wrap: wrap; }
.concept-ribbon a { color: var(--rose); }
.prog.dark-band .lede, .prog.dark-band p { color: #D8CCC5; }
.prog.dark-band .kicker { color: var(--muted-on-dark); }
.prog.dark-band .prog-card p.small, .prog.dark-band .small { color: var(--muted-on-dark); }
#ladder { min-height: 440px; }
#finderResults { min-height: 60vh; }

/* ---------- Readability pass ---------- */
/* Bodoni Moda's hairlines get faint below display sizes: give small serif text more weight. */
.h3, .h4, .rp-row .n, .res-main h4, .res-when b, .f-ages button b, .who button b, .week-h, .e-opt b, .est-d .amt, .ladder .k, .xp-facts li b,
.steps b, .apart h3, .prog-card h3, .fee-cols h3, .policy summary, .day-tabs button, .day-list .n, .e-panel h2, .rp-head h3, .f-results-head h3, .est h3 { font-weight: 600; }
.intro-quote, .owner-quote, .hero-tag { font-weight: 450; }
.rhythm .who button span, .rhythm .rp-note { color: #4E423D; }
.rhythm .kicker { color: var(--ink-2); }
.hero-sub { color: #E2D6CF; }
.hero-title { text-shadow: 0 2px 28px rgba(15, 11, 10, .35); }
.mv-frame .mv-cap { color: #fff; text-shadow: 0 1px 8px rgba(0, 0, 0, .6); }
.exp-grid figcaption, .owner-photo figcaption, .gal-cap { color: var(--ink-2); }
.small { color: var(--muted); }
.dark .small, .on-dark .small { color: var(--muted-on-dark); }
@media (max-width: 900px) {
  .hero-media::after { background: linear-gradient(0deg, var(--midnight) 0%, rgba(15, 11, 10, .72) 26%, rgba(15, 11, 10, 0) 58%), linear-gradient(180deg, rgba(15, 11, 10, .55) 0%, rgba(15, 11, 10, 0) 22%); }
  .hero-title { text-shadow: 0 2px 22px rgba(15, 11, 10, .7); }
}
.rhythm .who button[aria-pressed="true"] span { color: var(--muted-on-dark); }

/* ---------- Continuous journey: the line of light ---------- */
.has-hero #main { position: relative; }
.thread { position: absolute; top: 0; left: 0; width: 100%; pointer-events: none; z-index: 6; overflow: visible; }
.thread-line { fill: none; stroke: url(#threadGrad); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.thread-glow { fill: none; stroke: url(#threadGrad); stroke-width: 11; stroke-linecap: round; opacity: .16; }
.thread-dot { fill: #FFF6F1; stroke: #FF4D5E; stroke-width: 3; transition: opacity .3s; }
@media (max-width: 900px) { .thread-line { stroke-width: 1.8; } .thread-glow { stroke-width: 7; } }

/* ---------- Pinned styles scene (desktop) ---------- */
.mv-pinned .mv-scroll { height: calc(100vh + 8 * 30vh); }
.mv-pinned .mv-sticky { position: sticky; top: calc(var(--bar-h) + 80px); }
.mv-pinned .mv-btn { font-size: clamp(34px, 4.1vw, 62px); padding: 7px 0; }
.mv-pinned .mv-stage { position: static; }
.mv-pinned .mv-frame { aspect-ratio: auto; height: min(46vh, 500px); }
.mv-pinned .mv-text { min-height: 0; margin-top: 18px; }
.mv-pinned .mv-text p { font-size: 15.5px; margin-bottom: .6em; }
.mv-pinned .mv-text .small { display: none; }
.mv-pinned .mv-list { position: relative; padding-left: 26px; }
.mv-pinned .mv-list::before, .mv-pinned .mv-list::after { content: ""; position: absolute; left: 0; top: 0; width: 2px; border-radius: 2px; }
.mv-pinned .mv-list::before { bottom: 0; background: var(--line-dark); }
.mv-pinned .mv-list::after { height: calc(var(--mvp, 0) * 100%); background: linear-gradient(180deg, #FF6A35, #F0287A); box-shadow: 0 0 12px rgba(255, 70, 90, .7); }
.mv-hint { display: none; }
.mv-pinned .mv-hint { display: block; font-size: 13.5px; color: var(--muted-on-dark); margin-top: 14px; }

/* ---------- Scroll-linked image reveals ---------- */
[data-scene] { --sp: 1; }
.xp-a img, .xp-b img, .xp-c img { clip-path: inset(calc((1 - var(--sp)) * 14%) calc((1 - var(--sp)) * 10%) calc((1 - var(--sp)) * 14%) calc((1 - var(--sp)) * 10%) round 3px); transform: scale(calc(1.12 - var(--sp) * .12)); }
.owner-photo img { transform: translateY(calc((1 - var(--sp)) * 40px)); }
@media (prefers-reduced-motion: reduce) { [data-scene] { --sp: 1 !important; } }

/* ---------- Programs page: one composition per program ---------- */
.pg-head h2, .pg-team-title, .pg-camp h2, .pg-home h2, .pg-rent h2 { font: 600 clamp(40px, 5vw, 80px)/.96 var(--serif); letter-spacing: -.028em; }
.pg-head.split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px; align-items: end; }
.pg-team { background: var(--midnight); color: var(--ivory); padding: clamp(80px, 10vw, 150px) 0; }
.pg-team .kicker { color: var(--muted-on-dark); }
.pg-team-title { font-size: clamp(48px, 7.6vw, 128px); max-width: 11em; margin-bottom: clamp(40px, 5vw, 72px); }
.pg-team-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
.pg-nights { display: grid; gap: 18px; }
.pg-night { border-top: 1px solid var(--line-dark); padding-top: 18px; display: grid; gap: 4px; }
.pg-night .d { font-size: 15px; color: #FF9A86; font-weight: 500; }
.pg-night b { font: 600 clamp(64px, 8vw, 132px)/.9 var(--serif); letter-spacing: -.04em; color: var(--ivory); }
.pg-night span:last-child { color: var(--muted-on-dark); font-size: 15px; }
.pg-team .lede { color: #E2D6CF; }
.pg-rules { list-style: none; margin: 22px 0 28px; display: grid; gap: 0; }
.pg-rules li { padding: 12px 0 12px 24px; border-top: 1px solid var(--line-dark); position: relative; color: #E2D6CF; font-size: 15.5px; }
.pg-rules li::before { content: ""; position: absolute; left: 0; top: 1.25em; width: 12px; height: 2px; background: #FF6A35; }
.pg-bill { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 28px; }
.pg-bill div { border: 1px solid var(--line-dark); border-radius: 8px; padding: 14px; display: grid; gap: 2px; }
.pg-bill span { font-size: 13.5px; color: var(--muted-on-dark); }
.pg-bill b { font: 600 34px/1.05 var(--serif); }
.pg-bill small { font-size: 12.5px; color: var(--muted-on-dark); }
.pg-littles { padding: clamp(80px, 10vw, 150px) 0; background: var(--ivory); }
.pg-littles .pg-head { max-width: 900px; margin-bottom: 44px; }
.pg-ruler { display: grid; grid-template-columns: repeat(5, 1fr); border-bottom: 2px solid var(--ink); margin-left: 32%; }
.pg-ruler span { font: 600 clamp(28px, 3vw, 44px)/1 var(--serif); padding: 0 0 10px 6px; border-left: 1px solid var(--line-strong); }
.pg-ages { list-style: none; }
.pg-age { display: grid; grid-template-columns: 32% minmax(0, 1fr); align-items: start; padding: 22px 0; border-bottom: 1px solid var(--line); position: relative; }
.pg-age .band { grid-column: 2; grid-row: 1; height: 10px; margin-top: 8px; margin-left: var(--from); width: calc(var(--to) - var(--from)); border-radius: 10px; background: var(--neon-fill); }
.pg-age > div { grid-column: 1; grid-row: 1; padding-right: 28px; }
.pg-age b { display: block; font: 600 26px/1.15 var(--serif); }
.pg-age .ages { display: block; font-size: 14px; color: var(--rose); font-weight: 500; margin: 2px 0 8px; }
.pg-age p { font-size: 15px; color: var(--ink-2); margin: 0 0 8px; }
.pg-age .when { font-size: 13.5px; color: var(--muted); }
.pg-camp { background: var(--blush); padding: clamp(80px, 10vw, 150px) 0; }
.pg-camp-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 110px); align-items: center; }
.pg-camp .lede { margin: 22px 0; color: var(--ink-2); }
.pg-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; }
.pg-tags span { padding: 8px 14px; border-radius: 999px; background: rgba(251, 247, 242, .7); font-size: 14px; font-weight: 500; }
.pg-camp-card { background: var(--midnight); color: var(--ivory); border-radius: 14px; padding: clamp(26px, 3vw, 44px); transform: rotate(-1.4deg); box-shadow: 0 40px 80px -40px rgba(80, 20, 20, .6); }
.pg-camp-season { font: 600 clamp(52px, 6.4vw, 104px)/.88 var(--serif); letter-spacing: -.035em; margin: 0 0 28px; background: linear-gradient(90deg, #FF7A45, #FF4F86); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pg-camp-times { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 20px; }
.pg-camp-times div { border-top: 1px solid var(--line-dark); padding-top: 12px; }
.pg-camp-times b { display: block; font: 600 26px/1.1 var(--serif); }
.pg-camp-times span { font-size: 13.5px; color: var(--muted-on-dark); }
.pg-camp-card .small { color: var(--muted-on-dark); margin: 0; }
.pg-evening { background: #1E1615; color: var(--ivory); padding: clamp(80px, 10vw, 150px) 0; }
.pg-evening .kicker, .pg-evening .small { color: var(--muted-on-dark); }
.pg-evening .lede { color: #E2D6CF; }
.pg-evening .pg-head { margin-bottom: 40px; }
.pg-week { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--line-dark); }
.pg-day { padding: 18px 14px 18px 0; border-right: 1px solid var(--line-dark); min-height: 180px; }
.pg-day:last-child { border-right: 0; }
.pg-day + .pg-day { padding-left: 14px; }
.pg-day h3 { font: 600 30px/1 var(--serif); margin-bottom: 14px; }
.pg-day p { margin: 0 0 12px; display: grid; }
.pg-day b { font-weight: 500; font-size: 15px; }
.pg-day span { font-size: 13.5px; color: var(--muted-on-dark); }
.pg-day .none { font-size: 13.5px; color: #8E807A; }
.pg-home { padding: clamp(70px, 8vw, 120px) 0; background: var(--ivory-2); }
.pg-home-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 110px); align-items: center; }
.pg-home .lede { margin: 18px 0; }
.pg-blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pg-block { background: #fff; border-radius: 12px; padding: 22px; border: 1px solid var(--line); display: grid; gap: 6px; }
.pg-block span:first-child { font-weight: 600; color: var(--rose); }
.pg-block b { font: 600 26px/1.15 var(--serif); }
.pg-block span:last-child { font-size: 14px; color: var(--muted); }
.pg-privates { padding: clamp(80px, 10vw, 150px) 0; background: var(--ivory); }
.pg-privates .pg-head { margin-bottom: 44px; }
.pg-menu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
.pg-menu div { padding: 26px 24px 26px 0; display: grid; gap: 4px; }
.pg-menu div + div { border-left: 1px solid var(--line-strong); padding-left: 24px; }
.pg-menu b { font: 600 clamp(64px, 8vw, 128px)/.9 var(--serif); letter-spacing: -.04em; }
.pg-menu span { font-size: 18px; font-weight: 500; }
.pg-menu small { font-size: 14px; color: var(--muted); }
.pg-rent { position: relative; min-height: min(90vh, 820px); display: flex; align-items: flex-end; overflow: hidden; color: var(--ivory); }
.pg-rent img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.pg-rent::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15, 11, 10, .88) 0%, rgba(15, 11, 10, .2) 55%, rgba(15, 11, 10, 0) 100%); }
.pg-rent .wrap { position: relative; z-index: 1; padding: 0 0 clamp(40px, 6vw, 80px); }
.pg-rent-card { max-width: 640px; }
.pg-rent-card .kicker { color: #F1E5DE; }
.pg-rent-card p { color: #F1E5DE; font-size: 17px; margin: 18px 0 24px; }
.pg-rent-card .btn { --b: var(--ivory); --f: var(--ink); }
@media (max-width: 900px) {
  .pg-head.split, .pg-team-grid, .pg-camp-grid, .pg-home-grid { grid-template-columns: 1fr; }
  .pg-week { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-day { border-right: 0; border-bottom: 1px solid var(--line-dark); min-height: 0; padding-left: 0 !important; }
  .pg-menu { grid-template-columns: 1fr; }
  .pg-menu div + div { border-left: 0; border-top: 1px solid var(--line-strong); padding-left: 0; }
  .pg-ruler { margin-left: 0; }
  .pg-age { grid-template-columns: 1fr; }
  .pg-age .band { grid-row: 1; margin-bottom: 12px; }
  .pg-age > div { grid-row: 2; padding: 0; }
  .pg-bill { grid-template-columns: 1fr 1fr 1fr; }
  .pg-camp-card { transform: none; }
  .pg-blocks { grid-template-columns: 1fr; }
}
@media (max-width: 480px) { .pg-bill { grid-template-columns: 1fr; } .pg-camp-times { grid-template-columns: 1fr 1fr 1fr; } .pg-camp-times b { font-size: 21px; } }
.pg-rent::after { background: linear-gradient(90deg, rgba(15, 11, 10, .9) 0%, rgba(15, 11, 10, .66) 42%, rgba(15, 11, 10, 0) 78%), linear-gradient(0deg, rgba(15, 11, 10, .8) 0%, rgba(15, 11, 10, 0) 60%); }
@media (max-width: 900px) { .pg-rent::after { background: linear-gradient(0deg, rgba(15, 11, 10, .94) 0%, rgba(15, 11, 10, .8) 55%, rgba(15, 11, 10, .25) 100%); } }
@media (max-width: 900px) { .pg-age .band { grid-column: 1; width: calc((var(--to) - var(--from)) * 1); } }