/* Tierinii / one-page editorial layout. The approved hero photography and colors remain. */
html {scroll-padding-top:110px}
#music, #story, #lessons, #contact, #watch, #recognition,
#lesson-inquiry, #booking, #press, #lesson-formats {scroll-margin-top:110px}

/* Restore breathing room between the letters in the HERO only. */
.wordmark--hero {letter-spacing:-.055em; transform:translateX(-.018em);}

/* Page chapters read as part of one editorial narrative, not four stitched websites. */
.story-head {background:#fffaf2;padding-block:clamp(95px,9vw,155px) clamp(65px,7vw,108px)}
.story-head h2 {font-size:clamp(58px,6.4vw,108px);line-height:1.04;letter-spacing:-.061em;margin:0 0 27px;color:var(--ink)}
.story-head__lead {max-width:560px}
.story-head__photo {max-width:490px}
.story-head__photo img{display:block;width:100%;object-position:center 32%}
.story-body {padding-block:clamp(65px,7vw,100px)}
.story-prose p {margin-bottom:1.25em}
.story-prose p:last-child {margin-bottom:0}
.story-interlude {padding-block:clamp(72px,8vw,120px)}
.story-interlude h2 {margin-bottom:27px}
.story-close {padding-block:clamp(60px,6vw,90px);border-bottom:1px solid var(--rule)}
.story-close__layout {gap:clamp(35px,6vw,90px)}
.story-close__next {margin-top:28px}

.lessons-head {border-top:0;background:#fff9f1}
.lessons-head__layout {padding-block:clamp(85px,8vw,124px) clamp(80px,8vw,120px)}
.lessons-head h2 {font-size:clamp(55px,5.6vw,87px);line-height:1.07;letter-spacing:-.058em;margin:0 0 27px}
.lessons-head__photo {height:min(540px,44vw);overflow:hidden}
.lessons-head__photo img {height:100%;width:100%;object-fit:cover;object-position:49% 45%}
.lessons-formats,.lessons-focus,.lessons-faq {padding-block:clamp(62px,7vw,95px)}
.lessons-formats {border-top:1px solid var(--rule)}
.lessons-faq {border-top:1px solid var(--rule)}
.inquiry-section {padding-block:clamp(77px,8vw,109px)}

/* Contact is the clear ending of the page, not yet another full-screen hero. */
.contact-head {background:#fff9f1;padding-block:clamp(92px,9vw,140px) 48px}
.contact-head__layout{grid-template-columns:minmax(0,1fr);gap:0}
.contact-head h2 {font-size:clamp(65px,7.8vw,115px);letter-spacing:-.066em;line-height:1.04;margin:0 0 25px}
.contact-head__layout>div>p:not(.section-number){max-width:660px}
.contact-people {padding-block:38px clamp(60px,7vw,94px);background:#fff9f1}
.contact-people>.container>.section-number{margin-bottom:18px}
.press-section{padding-block:clamp(70px,7vw,110px)}
.press-disclosure summary{font-size:15px;min-height:55px}

/* Sticky menu active section is based on scroll, not an active "page". */
.desktop-nav a[aria-current="location"]::after {content:"";position:absolute;left:0;right:0;height:2px;background:var(--red);bottom:-15px}
.mobile-menu a[aria-current="location"] {color:var(--red)}
.desktop-nav a {position:relative}

@media(max-width:1024px) {
 .story-head__layout {gap:clamp(25px,4vw,65px)}
 .lessons-head__layout {gap:clamp(25px,5vw,65px)}
 .story-head h2{font-size:clamp(54px,7vw,79px)}
 .lessons-head h2{font-size:clamp(48px,6vw,72px)}
}
@media(max-width:800px) {
 html{scroll-padding-top:84px}
 #music,#story,#lessons,#contact,#watch,#recognition,#lesson-inquiry,#booking,#press,#lesson-formats{scroll-margin-top:84px}
 .wordmark--hero {letter-spacing:-.058em; transform:translateX(-.025em)}
 .story-head{padding-block:70px 65px}
 .story-head__layout{grid-template-columns:1fr;gap:37px}
 .story-head h2{font-size:clamp(56px,10.2vw,78px)}
 .story-head__photo{justify-self:end;width:min(77%,490px)}
 .story-head__photo img{max-height:520px}
 .story-body,.story-interlude,.story-close{padding-block:69px}
 .lessons-head__layout {grid-template-columns:1fr;padding-block:72px 75px;gap:40px}
 .lessons-head h2{font-size:clamp(48px,9vw,72px)}
 .lessons-head__photo{height:auto;aspect-ratio:1.55/1;width:min(100%,620px);margin:0;justify-self:end}
 .lessons-head__photo img{height:100%;object-position:50% 39%}
 .contact-head{padding-block:77px 32px}
 .contact-head h2{font-size:clamp(65px,12vw,94px)}
 .contact-people{padding-block:28px 68px}
 .story-close__layout{grid-template-columns:1fr;gap:18px}
}
@media(max-width:560px) {
 html{scroll-padding-top:80px}
 #music,#story,#lessons,#contact,#watch,#recognition,#lesson-inquiry,#booking,#press,#lesson-formats{scroll-margin-top:80px}
 /* The wider tracking takes up room; trim the font size only on small phones. */
 .wordmark--hero {font-size:clamp(64px,16.1vw,89px);letter-spacing:-.05em;transform:translateX(-.016em)}
 .story-head{padding-block:70px 54px}
 .story-head h2{font-size:clamp(53px,11.5vw,66px);margin-bottom:20px}
 .story-head__photo{width:86%;margin-top:0}
 .story-head__lead{font-size:20px}
 .story-body{padding-block:62px}
 .story-prose p{margin-bottom:1.15em}
 .story-interlude{padding-block:65px}
 .story-close{padding-block:60px}
 .story-close__next{gap:20px}
 .lessons-head__layout{padding-block:65px 61px;gap:37px}
 .lessons-head h2{font-size:clamp(42px,10.6vw,55px)}
 .lessons-head__photo{width:100%;aspect-ratio:1.23/1}
 .lessons-formats,.lessons-focus,.lessons-faq{padding-block:62px}
 .contact-head{padding-block:70px 26px}
 .contact-head h2{font-size:clamp(62px,17vw,79px)}
 .contact-people{padding-block:29px 64px}
 .press-section{padding-block:65px}
}
@media(max-width:360px){.wordmark--hero{font-size:61px;letter-spacing:-.05em}}
/* A single scroll offset for anchored navigation; the root scroll-padding handles the sticky header. */
#music,#story,#lessons,#contact,#watch,#recognition,
#lesson-inquiry,#booking,#press,#lesson-formats {scroll-margin-top:0}
/* Native sans-serif stack keeps the clean proportions without bundling font binaries. */
body{font-family:system-ui,-apple-system,'Segoe UI',Arial,sans-serif}
/* Narrow-phone QA: prevent intrinsic photo/text width expanding the Story grid. */
@media (max-width:560px) {
  .story-head__layout {grid-template-columns:minmax(0,1fr)}
  .story-head__layout > * {min-width:0}
}
