/* Approved moodboard system: warm paper, olive, editorial type, natural photos. */
:root {
  --mood-ivory: #f1eee5;
  --mood-sand: #e5dfd2;
  --mood-espresso: #39372d;
  --mood-olive: #737966;
  --mood-muted: #5f6155;
  --mood-rule: #c7c5b7;
  --mood-display: 'Cormorant Garamond', Georgia, serif;
  --mood-body: 'DM Sans', Arial, sans-serif;
  --mood-gutter: clamp(24px, 4.4vw, 76px);
  --mood-section-space: clamp(64px, 7.5vw, 112px);
  --mood-photo-treatment: saturate(.78) contrast(.96);
  --mood-forest: #444b3e;
  --mood-sage: #d7d8cb;
  --mood-on-dark: #f1eee5;
  --mood-dark-muted: #d0d1c3;
}
.site-header {
  height: 88px;
  padding-inline: var(--mood-gutter);
  background: var(--mood-ivory);
  color: var(--mood-espresso);
  border-bottom: 1px solid var(--mood-rule);
}
.wordmark {
  font-family: var(--mood-display);
  font-weight: 500;
  font-size: 25px;
  line-height: .85;
  letter-spacing: -.045em;
}
.site-nav {gap: clamp(18px, 2.4vw, 35px)}
.site-nav a, .nav-dropdown summary {
  font-family: var(--mood-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.nav-submenu {
  background: var(--mood-ivory);
  border-color: var(--mood-rule);
  box-shadow: 0 12px 24px #39372d12;
}
.menu-toggle {color: var(--mood-espresso);border-color: var(--mood-rule);font: 11px var(--mood-body);letter-spacing: .12em;padding:12px 14px}
section.hero, section.story {scroll-margin-top:12px}
.hero {
  position: relative;
  display: grid;
  grid-template-columns: .94fr 1.06fr;
  gap: clamp(30px, 4.5vw, 76px);
  min-height: 0;
  padding: 48px var(--mood-gutter) 58px;
  background: var(--mood-ivory);
  color: var(--mood-espresso);
}
.hero-copy {
  min-height: 0;
  padding: 12px 0 0;
  background: none;
  justify-content: flex-start;
}
.hero-kicker {
  color: var(--mood-muted);
  font: 10px var(--mood-body);
  letter-spacing: .2em;
}
.hero-title {
  font-family: var(--mood-display);
  font-size: clamp(90px, 10.5vw, 158px);
  font-weight: 400;
  line-height: .78;
  letter-spacing: -.055em;
  text-transform: none;
  margin: 43px 0 35px;
}
.hero-title span:last-child {font-style: italic;color: var(--mood-olive);padding-right:.12em}
.hero-photo {
  min-height: 540px;
  background: var(--mood-sand) url('assets/hero-tezza-3820.jpg') center/cover no-repeat;
  filter: var(--mood-photo-treatment);
}
.hero-photo::before {display:none}
.hero-caption {
  position: static;
  display: block;
  margin-top: auto;
  padding-top: 10px;
}
.hero-caption p {font: 14px/1.7 var(--mood-body);max-width: 320px;color: var(--mood-muted)}
.hero-caption .label {
  display: flex;
  align-items: center;
  gap: 16px;
  font: 9px var(--mood-body);
  letter-spacing: .16em;
  margin-top: 30px;
}
.hero-caption .label::before {content:'';width:38px;height:1px;background:var(--mood-olive)}
.story {
  background: var(--mood-ivory);
  color: var(--mood-espresso);
  padding: var(--mood-section-space) var(--mood-gutter);
}
.story-intro {grid-template-columns: minmax(0,1fr) minmax(250px,310px);gap:60px;align-items:end;margin-bottom:54px}
.story h2 {
  font: 400 clamp(52px, 5.7vw, 88px)/.92 var(--mood-display);
  text-transform: none;
  letter-spacing: -.035em;
}
.story-summary {max-width:310px;font:13px/1.8 var(--mood-body);color:var(--mood-muted)}
.story-summary .label {color:var(--mood-muted);font:10px var(--mood-body);letter-spacing:.18em;margin-bottom:16px}
.story-gallery {grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;border:0}
.story-card {border:0;border-top:1px solid var(--mood-rule)}
.story-card-head {min-height:56px;padding:10px 0;font:9px var(--mood-body);letter-spacing:.12em;color:var(--mood-muted)}
.story-card-head span:first-child {font:italic 21px var(--mood-display);letter-spacing:0;color:var(--mood-muted)}
.story-card img {width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;filter:var(--mood-photo-treatment)}
.story-card-foot {display:block;min-height:0;padding:19px 0 0}
.story-card-foot h3 {font:400 clamp(28px,2.7vw,42px)/1 var(--mood-display);letter-spacing:-.025em;text-transform:capitalize}
.story-card-foot span {display:block;margin-top:12px;font:9px var(--mood-body);letter-spacing:.13em;color:var(--mood-muted)}
@media(min-width:1600px) {
  .hero {padding-block:64px 80px}
  .hero-photo {min-height:660px}
}
@media(max-width:1050px) {
  .site-header {gap:20px;padding-inline:28px}
  .site-nav {gap:18px}
  .hero-title {font-size:clamp(85px,11.5vw,120px)}
  .hero-photo {min-height:500px}
  .story-gallery {gap:16px}
}
@media(max-width:780px) {
  section.hero, section.story {scroll-margin-top:0}
  .site-header {height:68px;padding-inline:24px}
  .wordmark {font-size:23px}
  .site-nav {top:68px;background:var(--mood-ivory);border-color:var(--mood-rule)}
  .site-nav a,.nav-dropdown summary {border-color:var(--mood-rule);padding-block:16px}
  .hero {display:grid;grid-template-columns:1fr;gap:30px;padding:38px 24px 36px}
  .hero-copy {padding:0;min-height:0}
  .hero-title {font-size:clamp(90px,20vw,136px);margin:32px 0 25px;line-height:.82}
  .hero-caption {padding-top:0;margin-top:0}
  .hero-caption p {max-width:370px;font-size:13px;line-height:1.65}
  .hero-caption .label {margin-top:24px;font-size:9px}
  .hero-photo {min-height:0;aspect-ratio:4/3;background-position:center 45%}
  .story-intro {grid-template-columns:1fr;gap:28px;margin-bottom:36px}
  .story h2 {font-size:clamp(48px,10.4vw,76px)}
  .story-summary {max-width:430px}
  .story-gallery {grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 18px}
  .story-card-head {min-height:45px;font-size:8px}
  .story-card img {height:auto;aspect-ratio:3/4}
  .story-card-foot {padding-top:14px;min-height:0}
  .story-card-foot h3 {font-size:30px}
  .story-card-foot span {font-size:8px;margin-top:10px}
}
@media(max-width:360px) {
  .story-gallery {gap:26px 12px}
  .story-card-foot h3 {font-size:26px}
  .hero-title {font-size:86px}
}

/* Shared type and surfaces for the full homepage. */
body {background:var(--mood-ivory);color:var(--mood-espresso);font-family:var(--mood-body)}
.display {font-family:var(--mood-display);font-weight:400;text-transform:none;letter-spacing:-.035em}
.label {font-family:var(--mood-body);font-size:10px;font-weight:500;letter-spacing:.15em}
.tag {font:10px var(--mood-body);letter-spacing:.13em;padding:9px 13px}
:focus-visible {outline-color:var(--mood-olive)}
section[id], #next-event, #past-events, .site-footer {scroll-margin-top:12px}
.contact-image, .event-feature>img, .crew-visual>img, .crew-profile-head>img, .fashion-image, .forum-topic>img {filter:var(--mood-photo-treatment)}

/* Newsletter: the same quiet layout on a deeper olive surface. */
.contact {grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(36px,6vw,90px);padding:var(--mood-section-space) var(--mood-gutter);min-height:0;background:var(--mood-forest);color:var(--mood-on-dark)}
.contact-image {min-height:440px;background-position:center}
.contact-content {min-width:0;min-height:0;padding:20px 0}
.contact h2 {font-size:clamp(52px,5.4vw,82px);line-height:.94;margin:30px 0 25px}
.contact-content>p:not(.label) {font-size:14px;line-height:1.8;color:var(--mood-dark-muted);margin-bottom:32px}
.contact-note {color:var(--mood-dark-muted);font-size:9px;letter-spacing:.15em;margin-top:25px}
#mlb2-46202367 .ml-form-horizontalRow {border-color:#b8bdab;gap:12px}
#mlb2-46202367 input[type=email] {font-size:13px;color:var(--mood-on-dark)}
#mlb2-46202367 input[type=email]::placeholder {color:var(--mood-dark-muted)}
#mlb2-46202367 input[type=email]:focus-visible {outline-color:var(--mood-on-dark)}
#mlb2-46202367 .ml-button-horizontal button {font:10px var(--mood-body);letter-spacing:.12em;color:var(--mood-espresso);background:var(--mood-ivory);padding:0 20px;min-height:50px}
#mlb2-46202367 .ml-button-horizontal button:hover {background:var(--mood-sand)}
#mlb2-46202367 .ml-form-successBody {color:var(--mood-on-dark)}
#mlb2-46202367 .ml-form-successBody h4 {font:400 36px var(--mood-display);text-transform:none}

/* Sessions and their archive retain their existing controls. */
.events {padding:var(--mood-section-space) var(--mood-gutter);background:var(--mood-sand);color:var(--mood-espresso)}
.section-topline {margin-bottom:38px}
.section-topline .line {background:var(--mood-rule)}
.events-intro {grid-template-columns:minmax(0,1fr) minmax(240px,340px);gap:45px;margin-bottom:45px}
.events h2 {font-size:clamp(64px,6.5vw,98px);line-height:.9}
.events-intro p {font-size:14px;line-height:1.8;color:var(--mood-muted)}
.event-feature {grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);min-height:400px;border:0}
.event-feature>img {min-height:400px;object-position:center 57%}
.event-feature-copy {padding:clamp(30px,4vw,60px);gap:32px;background:var(--mood-sage)}
.event-feature-copy h3 {font-size:clamp(46px,4.5vw,70px);line-height:.97}
.past-events {margin-top:56px}
.past-events-head {margin-bottom:22px}
.past-events-head .label {font-size:14px;letter-spacing:.12em}
.past-events-head .label:last-child {font-size:10px;color:var(--mood-muted)}
.video-grid {gap:14px;border:0;background:transparent}
.video-card {background:transparent;border:0}
.video-play {background:var(--mood-forest)}
.past-events-toggle {border-color:#a6aa9b;color:var(--mood-espresso);margin-top:14px;font:inherit;font-size:.75rem;letter-spacing:.12em}
.past-events-toggle:hover,.past-events-toggle:focus-visible {background:#d8d3c5}

/* People: group portrait and Nghi's individual profile stay distinct. */
.crew {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,90px);padding:var(--mood-section-space) var(--mood-gutter);background:var(--mood-sand)}
.crew-visual {align-self:start;min-height:0;aspect-ratio:3/4;background:var(--mood-sage)}
.crew-visual img {object-position:center 65%}
.crew-visual-label {left:24px;bottom:25px;font-size:9px;letter-spacing:.12em}
.crew-copy {min-width:0;padding:0;justify-content:flex-start}
.crew h2 {font-size:clamp(62px,6vw,90px);line-height:.95;margin:24px 0}
.crew-intro {font-size:14px;line-height:1.8;color:var(--mood-muted);margin-bottom:32px}
.crew-profile {border-color:#b3b4a6;width:100%}
.crew-profile-head {gap:24px;margin-bottom:22px}
.crew-profile h3 {font:400 50px/1 var(--mood-display);text-transform:none;margin-bottom:12px}
.crew-role {color:var(--mood-muted);font-size:9px;line-height:1.7;font-weight:500;letter-spacing:.12em;max-width:180px}
.crew-profile p {font-size:13px;line-height:1.9;color:var(--mood-muted)}

/* Shop: retain the existing typographic panel, as a quiet brand print. */
.shop {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,6vw,90px);padding:var(--mood-section-space) var(--mood-gutter);min-height:0;background:var(--mood-forest);color:var(--mood-on-dark)}
.shop-copy {padding:10px 0;min-height:0}
.shop h2 {font-size:clamp(64px,6.5vw,96px);line-height:.9;margin:28px 0}
.shop-copy p:not(.label) {font-size:14px;line-height:1.8;color:var(--mood-dark-muted)}
.shop-image {position:relative;min-height:480px;order:initial;background:var(--mood-sage);padding:45px;color:var(--mood-espresso)}
.shop-image::before {content:'';position:absolute;inset:25px;border:1px solid #a5ab98;pointer-events:none}
.shop-image span {font:400 clamp(54px,5.7vw,88px)/.88 var(--mood-display);letter-spacing:-.055em;transform:none;color:var(--mood-forest);text-transform:none}

/* Style and community use the same photographic finish and type rhythm. */
.fashion {grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(36px,6vw,90px);padding:var(--mood-section-space) var(--mood-gutter);min-height:0;background:var(--mood-ivory)}
.fashion-copy {min-width:0;min-height:0;padding:20px 0}
.fashion-copy>.label,.fashion-copy .tag {color:var(--mood-muted)}
.fashion h2 {font-size:clamp(60px,6.3vw,94px);line-height:.92;margin:30px 0}
.fashion-copy p {font-size:14px;line-height:1.8;color:var(--mood-muted)}
.fashion-image {min-height:550px;order:initial}
.fashion-image .label {left:24px;bottom:25px;font-size:9px;letter-spacing:.12em}
.forum {background:var(--mood-sand);color:var(--mood-espresso);padding:var(--mood-section-space) var(--mood-gutter)}
.forum-intro {grid-template-columns:minmax(0,1fr) minmax(240px,330px);gap:50px;margin:28px 0 48px}
.forum h2 {font-size:clamp(60px,6.3vw,94px);line-height:.94}
.forum-intro p {font-size:14px;line-height:1.8;color:var(--mood-muted)}
.forum-topics {border:0;gap:22px}
.forum-topic {min-height:0;border:0;border-top:1px solid #b3b4a6;padding-top:18px}
.forum-topic img {height:auto;aspect-ratio:4/3}
.forum-topic-content {padding:20px 0 0;display:block}
.forum-topic-number {display:block;font:9px var(--mood-body);letter-spacing:.14em;color:var(--mood-muted)}
.forum-topic h3 {font:400 clamp(28px,2.65vw,40px)/1.02 var(--mood-display);letter-spacing:-.025em;margin:20px 0 16px;min-height:2.05em}
.forum-topic p {font-size:12px;line-height:1.8;color:var(--mood-muted)}
.site-footer {grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.85fr);padding:64px var(--mood-gutter) 28px;background:var(--mood-forest);color:var(--mood-on-dark);gap:45px}
.footer-brand {font:400 39px/.85 var(--mood-display);letter-spacing:-.035em}
.footer-contact {font-size:12px;gap:11px}
.footer-contact h2 {font-size:9px;letter-spacing:.16em;font-weight:500}
.footer-nav {font-size:11px;line-height:1.6;gap:14px 22px}
.footer-bottom {border-color:#727965;color:var(--mood-dark-muted);font-size:10px;line-height:1.7;padding-top:24px}

@media(max-width:1050px) {
  .forum-topics {grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 24px}
  .forum-topic h3 {font-size:36px;min-height:0}
  .site-footer {grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
  .footer-nav {grid-column:1/-1;justify-content:flex-start}
  .crew-profile-head img {width:105px;height:135px}
}
@media(max-width:780px) {
  section[id], #next-event, #past-events, .site-footer {scroll-margin-top:0}
  .contact,.crew,.shop,.fashion {grid-template-columns:minmax(0,1fr);gap:36px;padding:64px 24px}
  .contact-content,.crew-copy,.shop-copy,.fashion-copy {padding:0;min-height:0}
  .contact-image {min-height:0;aspect-ratio:4/3}
  .contact h2,.crew h2 {font-size:clamp(52px,10vw,76px)}
  .events,.forum {padding:64px 24px}
  .section-topline {gap:16px;margin-bottom:30px}
  .section-topline .label {font-size:8px;line-height:1.6}
  .section-topline .line {min-width:15px}
  .events-intro,.forum-intro {grid-template-columns:1fr;gap:24px}
  .events h2,.shop h2,.fashion h2,.forum h2 {font-size:clamp(56px,12vw,82px)}
  .event-feature {grid-template-columns:1fr}
  .event-feature>img {min-height:0;max-height:none;height:auto;aspect-ratio:4/3}
  .event-feature-copy {min-height:0;padding:30px;gap:28px}
  .event-feature-copy h3 {font-size:54px}
  .past-events-head {gap:12px}
  .past-events-head .label {font-size:14px}
  .past-events-head .label:last-child {font-size:8px}
  .crew-visual {min-height:0;aspect-ratio:3/4}
  .crew-profile-head img {width:124px;height:150px}
  .shop-image {min-height:0;aspect-ratio:1/1;order:initial}
  .shop-image span {font-size:clamp(56px,12vw,86px)}
  .fashion-image {min-height:0;aspect-ratio:4/5;order:initial}
  .forum-intro {margin-bottom:36px}
  .forum-topics {gap:32px 18px}
  .forum-topic h3 {font-size:29px}
  .site-footer {padding:52px 24px 24px;gap:32px}
}
@media(max-width:520px) {
  .contact h2 {font-size:52px}
  #mlb2-46202367 .ml-form-horizontalRow {display:block;border:0}
  #mlb2-46202367 input[type=email] {border-color:#b8bdab}
  #mlb2-46202367 .ml-button-horizontal button {width:100%}
  .forum-topics {grid-template-columns:1fr;gap:36px}
  .forum-topic img {height:auto;aspect-ratio:4/3}
  .forum-topic h3 {font-size:36px;min-height:0;margin:16px 0 12px}
  .forum-topic p {font-size:13px}
  .site-footer {display:block}
  .footer-contact {margin-top:32px}
  .footer-nav {margin:32px 0}
  .footer-bottom {display:block}
  .footer-bottom span {display:block;margin-top:10px}
}

/* Crew profiles. */
.crew-profile + .crew-profile {margin-top:36px}
.crew-profile-head img.rex-portrait {object-position:center;object-fit:cover}
.fashion-image {background-position:center 65%}

/* Foldable crew biographies. */
summary.crew-profile-head {list-style:none;cursor:pointer;margin-bottom:0;position:relative;padding-right:28px}
summary.crew-profile-head::-webkit-details-marker {display:none}
summary.crew-profile-head::after {content:'+';position:absolute;right:0;top:12px;font:24px var(--mood-body);color:var(--mood-muted)}
.crew-profile[open]>summary::after {content:'\2212'}
summary.crew-profile-head:hover h3 {color:var(--mood-olive)}
.crew-profile-bio {margin-top:24px}
.crew-profile-head img.vi-portrait {object-position:43% center}

/* Compact portraits alongside each crew name, on every screen size. */
.crew-profile-head img {width:56px;height:56px;object-fit:cover}
summary.crew-profile-head {align-items:center}

/* Bring Jacob closer within the existing portrait size. */
.jacob-thumbnail {display:block;width:56px;height:56px;flex:none;overflow:hidden}
.crew-profile-head .jacob-thumbnail img {display:block;transform:scale(1.75);transform-origin:48% 24%}

/* Balanced crew photo and compact, consistent profile rows. */
.crew {align-items:start}
.crew-visual {width:100%;max-width:460px;justify-self:center;aspect-ratio:auto;min-height:0}
.crew-visual img {position:static;width:100%;height:auto;object-fit:contain}
.crew-profile {max-width:none;padding-top:18px}
.crew-profile + .crew-profile {margin-top:18px}
summary.crew-profile-head {display:grid;grid-template-columns:minmax(0,1fr) 56px;gap:20px;padding-right:32px;min-height:64px;align-items:center}
.crew-profile h3 {font-size:42px;margin:0 0 6px}
.crew-role {margin-bottom:0;max-width:none;font-size:9px}
summary.crew-profile-head::after {top:50%;transform:translateY(-50%);font-size:21px}
.crew-profile-bio {margin-top:18px;padding-right:16px}
.crew-profile-head img,.jacob-thumbnail {border-radius:2px}
.crew-profile-head .jacob-thumbnail img {filter:var(--mood-photo-treatment)}
@media(max-width:780px) {
  .crew {gap:32px}
  .crew-visual {max-width:420px}
  .crew-profile h3 {font-size:38px}
  summary.crew-profile-head {gap:16px;padding-right:28px}
  .crew-profile-bio {padding-right:0}
}
/* Shared rounded corners for photography and video previews. */
:root {--mood-photo-radius:0px;--mood-portrait-radius:50%}
main img,.hero-photo,.contact-image,.crew-visual,.fashion-image,.video-frame {border-radius:var(--mood-photo-radius)}
.hero-photo,.contact-image,.crew-visual,.fashion-image,.video-frame {overflow:hidden}
.crew-profile-head img,.jacob-thumbnail {border-radius:var(--mood-portrait-radius)}
/* Our story: documentary photo paired with readable narrative. */
.story-intro {align-items:center;margin-bottom:40px}
.story-summary .label {margin-bottom:0}
.story-narrative {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start;margin-bottom:64px}
.story-photo {display:block;width:100%;height:auto;filter:var(--mood-photo-treatment)}
.story-prose {max-width:580px;color:var(--mood-muted);font:14px/1.9 var(--mood-body)}
.story-prose p {margin:0 0 20px}
.story-prose p:first-child {font:400 30px/1.25 var(--mood-display);color:var(--mood-espresso);margin-bottom:24px}
.story-prose p:last-child {margin-bottom:0}
@media(max-width:780px) {
  .story-narrative {grid-template-columns:1fr;gap:28px;margin-bottom:44px}
  .story-prose {max-width:none}
  .story-intro {gap:20px;margin-bottom:28px}
}
/* Portraits appear only when a crew biography is expanded. */
summary.crew-profile-head {grid-template-columns:minmax(0,1fr)}
.crew-bio-portrait {margin-bottom:20px}
.crew-bio-portrait img {display:block;width:56px;height:56px;object-fit:cover;object-position:center top;border-radius:var(--mood-portrait-radius);filter:var(--mood-photo-treatment)}
.crew-bio-portrait img.vi-portrait {object-position:43% center}
.crew-bio-portrait img.rex-portrait {object-position:center}
.crew-bio-portrait .jacob-thumbnail img {transform:scale(1.75);transform-origin:48% 24%}
/* Crew portraits anchor each foldable row; the group photo follows its natural proportions. */
.crew {grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center}
.crew-visual {max-width:520px;align-self:center}
summary.crew-profile-head {grid-template-columns:64px minmax(0,1fr);gap:20px;min-height:76px}
summary.crew-profile-head>div {grid-column:2;grid-row:1}
summary.crew-profile-head>img,summary.crew-profile-head>.jacob-thumbnail {grid-column:1;grid-row:1;width:64px;height:64px}
.crew-profile-head img {width:64px;height:64px}
.crew-profile-head .jacob-thumbnail img {width:64px;height:64px}
.crew-profile h3 {font-size:40px}
.crew-profile {padding-top:16px}
.crew-profile + .crew-profile {margin-top:16px}
.crew-profile-bio {padding-left:84px}
@media(max-width:780px) {
  .crew {grid-template-columns:minmax(0,1fr);gap:36px}
  .crew-visual {max-width:420px}
  .crew-profile-bio {padding-left:0}
  .crew-profile h3 {font-size:38px}
}
/* Crew editorial layout: names on the left, group photography on the right. */
.crew {grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.crew-copy {grid-column:1;grid-row:1}
.crew-visual {grid-column:2;grid-row:1;justify-self:end}
@media(max-width:780px) {
  .crew {grid-template-columns:minmax(0,1fr)}
  .crew-copy {grid-column:1;grid-row:2}
  .crew-visual {grid-column:1;grid-row:1;justify-self:center}
}
/* Keep the crew title above the group photograph on mobile. */
.crew {row-gap:0}
.crew-heading {grid-column:1;grid-row:1}
.crew-copy {grid-column:1;grid-row:2}
.crew-visual {grid-column:2;grid-row:1 / span 2}
@media(max-width:780px) {
  .crew {row-gap:28px}
  .crew-heading {grid-column:1;grid-row:1}
  .crew-heading h2 {margin-bottom:0}
  .crew-visual {grid-column:1;grid-row:2}
  .crew-copy {grid-column:1;grid-row:3}
}
/* Three photographs share the story's editorial rhythm. */
.story-photography {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:22px;align-items:start}
.story-photography .story-photo-lead {grid-column:1 / -1;aspect-ratio:16/9;object-fit:cover}
.story-photography .story-photo-session {margin-top:36px;aspect-ratio:4/5;object-fit:cover;object-position:60% center}
.story-photography .story-photo-light {aspect-ratio:3/5;object-fit:cover}
.story-prose {font-size:14px;line-height:1.85}
@media(max-width:780px) {
  .story-photography {gap:16px}
  .story-photography .story-photo-session {margin-top:24px}
  .story-narrative {gap:36px}
}
/* Alternating photo and prose rows follow the site's quiet editorial spacing. */
.story-rows {display:grid;gap:clamp(48px,7vw,96px);margin-bottom:72px}
.story-row {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.story-row .story-photo {width:100%;height:auto;object-fit:cover}
.story-row:nth-child(2) .story-photo {grid-column:2;grid-row:1}
.story-row:nth-child(2) .story-prose {grid-column:1;grid-row:1}
.story-row .story-prose p:first-child {font:14px/1.85 var(--mood-body);color:var(--mood-muted);margin-bottom:20px}
.story-row:first-child .story-prose p:first-child {font:400 30px/1.25 var(--mood-display);color:var(--mood-espresso);margin-bottom:24px}
.story-row:last-child .story-photo {max-height:520px;object-fit:contain}
@media(max-width:780px) {
  .story-rows {gap:48px;margin-bottom:48px}
  .story-row {grid-template-columns:minmax(0,1fr);gap:28px}
  .story-row:nth-child(2) .story-photo,.story-row:nth-child(2) .story-prose {grid-column:auto;grid-row:auto}
  .story-row:last-child .story-photo {max-height:460px}
}
/* Subtle corner rounding for the three Our Story photographs. */
.story-row .story-photo {border-radius:4px}

/* Fit the portrait photo's box to its image so every corner is visible. */
.story-row:last-child .story-photo {width:100%;max-width:390px;height:auto;max-height:none;justify-self:center;object-fit:cover;border-radius:4px}
@media(max-width:780px) {
  .story-row:last-child .story-photo {max-width:345px;max-height:none}
}
/* The final story photo fills its column; Rex's complete artwork stays visible. */
.story-row:last-child .story-photo {max-width:none;width:100%;height:auto}
summary.crew-profile-head>.rex-thumbnail {display:block;grid-column:1;grid-row:1;width:64px;height:64px;overflow:hidden;border-radius:4px;flex:none}
.crew-profile-head .rex-thumbnail img {display:block;width:64px;height:64px;object-fit:cover;object-position:center;transform:scale(2.2);transform-origin:53% 25%;border-radius:4px}

/* Four story moments alternate between daylight, community, and night. */
.story-row:nth-child(even) .story-photo {grid-column:2;grid-row:1}
.story-row:nth-child(even) .story-prose {grid-column:1;grid-row:1}
.story-row .story-photo {aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.story-row:first-child .story-photo {aspect-ratio:16/9}
.story-row:nth-child(3) .story-photo {object-position:center 40%}
.story-row:last-child .story-prose p {font:400 clamp(24px,2.5vw,34px)/1.45 var(--mood-display);color:var(--mood-espresso);margin:0}
@media(max-width:780px) {
  .story-row:nth-child(even) .story-photo,.story-row:nth-child(even) .story-prose {grid-column:auto;grid-row:auto}
}
/* Every Our Story photo shares the opening image's wide dimensions. */
.story-rows .story-row .story-photo {width:100%;max-width:none;aspect-ratio:16/9;height:auto;object-fit:cover}
/* Confirmed event details paired with the complete promotional artwork. */
#next-event {grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;background:var(--mood-sage)}
#next-event>img {display:block;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:auto;object-fit:contain;filter:none}
#next-event .event-feature-copy {gap:24px;min-height:0;justify-content:flex-start}
#next-event h3 {font-size:clamp(42px,4.5vw,66px)}
#next-event p {font:14px/1.8 var(--mood-body);color:var(--mood-espresso);margin:0}
#next-event .event-date {font-size:13px}
#next-event .event-description {display:grid;gap:16px}
#next-event .event-feature-bottom {display:grid;gap:12px}
#next-event .event-entry {font:500 13px var(--mood-body);color:var(--mood-espresso)}
@media(max-width:780px) {
  #next-event {grid-template-columns:minmax(0,1fr)}
  #next-event .event-feature-copy {padding:30px 24px}
}
/* Subtle rounded corners on the Kodama flyer. */
#next-event>img {border-radius:4px}

#next-event .event-entry a {color:inherit;text-decoration:underline;text-underline-offset:4px}
#next-event .event-entry a:hover {color:var(--mood-olive)}

#next-event .event-address {font-size:13px}

/* Inset the flyer so its sage backdrop remains visible. */
#next-event>img {width:calc(100% - 40px);margin:20px;align-self:center;justify-self:center}
@media(max-width:780px) {
  #next-event>img {width:calc(100% - 32px);margin:16px}
}
#next-event>img {border-radius:4px}

/* Story photography moves from the dance floor to community and shared places. */
.story-row:nth-child(3) .story-photo {object-position:center}
.story-row:last-child .story-photo {object-position:center 40%}
/* Consistent reading rhythm throughout Our Story. */
.story-intro {margin-bottom:40px}
.story-rows {gap:clamp(40px,5vw,64px);margin-bottom:56px}
.story-row {column-gap:clamp(28px,4vw,56px)}
.story-row .story-prose {max-width:52ch;font:14px/1.75 var(--mood-body)}
.story-row .story-prose p,.story-row .story-prose p:first-child {font:14px/1.75 var(--mood-body);margin:0 0 16px}
.story-row:first-child .story-prose p:first-child {font:400 30px/1.25 var(--mood-display);margin-bottom:20px}
.story-row:last-child .story-prose p {font:400 clamp(24px,2.5vw,34px)/1.4 var(--mood-display);margin:0}
.story-row .story-prose p:last-child {margin-bottom:0}
@media(max-width:780px) {
  .story-intro {margin-bottom:28px}
  .story-rows {gap:40px;margin-bottom:44px}
  .story-row {row-gap:22px}
  .story-row .story-prose {max-width:none}
}
/* An inviting opening with clear paths into the next party and our story. */
.hero-caption {margin-top:12px;max-width:420px}
.hero-caption p {margin:0 0 14px;font:14px/1.75 var(--mood-body);color:var(--mood-muted)}
.hero-caption .hero-promise {margin:22px 0 26px;color:var(--mood-espresso)}
.hero-promise strong {font-weight:600}
.hero-actions {display:flex;flex-wrap:wrap;gap:12px}
.hero-action {display:inline-flex;align-items:center;justify-content:space-between;gap:28px;padding:16px 22px;border:1px solid var(--mood-forest);font:500 10px/1 var(--mood-body);letter-spacing:.12em;text-decoration:none;transition:background .2s,color .2s}
.hero-action-primary {background:var(--mood-forest);color:var(--mood-ivory)}
.hero-action-secondary {background:transparent;color:var(--mood-forest)}
.hero-action:hover {background:var(--mood-olive);border-color:var(--mood-olive);color:var(--mood-ivory)}
.hero-action:focus-visible {outline:2px solid var(--mood-olive);outline-offset:4px}
@media(max-width:780px) {
  .hero-caption {margin-top:4px;max-width:430px}
  .hero-actions {gap:10px}
  .hero-action {padding:15px 18px;gap:22px}
}
/* Event announcement: balanced artwork, compact facts, and a clear invitation. */
#next-event {grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,4vw,56px);padding:clamp(24px,3vw,44px);align-items:center}
#next-event>img {width:100%;margin:0;max-width:450px;justify-self:center;align-self:center;border-radius:4px}
#next-event .event-feature-copy {padding:0;gap:20px;background:transparent;max-width:540px}
#next-event h3 {font-size:clamp(40px,4vw,62px);line-height:1.04;max-width:none;margin:0}
#next-event .event-date {font-size:13px;line-height:1.65;margin-top:4px}
#next-event .event-address {font-size:12px;line-height:1.65;padding:0 0 22px;border-bottom:1px solid #b3b9a8}
#next-event .event-description {gap:14px}
#next-event .event-description p {font-size:13px;line-height:1.75}
#next-event .event-feature-bottom {gap:16px;margin-top:4px}
#next-event .event-entry {display:flex;align-items:center;flex-wrap:wrap;gap:16px}
#next-event .event-entry a {display:inline-flex;align-items:center;gap:24px;padding:15px 20px;background:var(--mood-forest);color:var(--mood-ivory);text-decoration:none;font:500 12px/1.3 var(--mood-body)}
#next-event .event-entry a:hover {background:var(--mood-olive);color:var(--mood-ivory)}
#next-event .event-entry a:focus-visible {outline:2px solid var(--mood-forest);outline-offset:4px}
#next-event .event-age {font:700 14px/1.2 var(--mood-body);letter-spacing:.02em;color:var(--mood-espresso)}
#next-event .event-feature-bottom>p {font-size:12px;color:var(--mood-muted)}
@media(max-width:780px) {
  #next-event {grid-template-columns:minmax(0,1fr);padding:24px;gap:30px}
  #next-event>img {width:100%;margin:0;max-width:420px}
  #next-event .event-feature-copy {padding:0;max-width:none;gap:18px}
  #next-event h3 {font-size:44px}
}
/* Discreet status labels beneath upcoming navigation items. */
#site-nav .nav-coming-soon {position:relative}
#site-nav .nav-coming-soon small {display:block;position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%);white-space:nowrap;font:400 7px/1 var(--mood-body);letter-spacing:.03em;text-transform:none;color:var(--mood-muted)}
@media(max-width:780px) {
  #site-nav .nav-coming-soon small {position:static;transform:none;margin-top:4px}
}
/* Show the full wide hero photo without enlarging a narrow crop. */
.hero-photo {min-height:0;aspect-ratio:16/9;align-self:center;background-size:contain;background-position:center;background-repeat:no-repeat}
@media(max-width:780px) {
  .hero-photo {min-height:0;aspect-ratio:16/9;background-position:center}
}
/* Fit the new landing photograph to its natural proportions. */
.hero-photo {aspect-ratio:16/9;background-size:cover;background-position:center 65%}

/* Restore the original tall opening photograph dimensions. */
.hero-photo {min-height:540px;aspect-ratio:auto;align-self:stretch;background-size:cover;background-position:center}
@media(min-width:1600px) {
  .hero-photo {min-height:660px}
}
@media(max-width:1050px) {
  .hero-photo {min-height:500px}
}
@media(max-width:780px) {
  .hero-photo {min-height:0;aspect-ratio:4/3;background-position:center 45%}
}
/* Event copy leads on desktop; the flyer remains first in the mobile reading order. */
#next-event {grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
#next-event>img {grid-column:2;grid-row:1}
#next-event .event-feature-copy {grid-column:1;grid-row:1;gap:18px}
#next-event h3 {font-size:clamp(40px,4vw,58px);line-height:1.08;letter-spacing:-.025em}
#next-event .event-address {padding-bottom:18px}
#next-event .event-description {gap:12px}
#next-event .event-description p {max-width:48ch;line-height:1.8}
#next-event .event-feature-bottom {margin-top:8px}
@media(max-width:780px) {
  #next-event {grid-template-columns:minmax(0,1fr)}
  #next-event>img {grid-column:1;grid-row:1}
  #next-event .event-feature-copy {grid-column:1;grid-row:2}
  #next-event h3 {font-size:42px}
}
/* Subtle rounding on the opening navigation buttons. */
.hero-action {border-radius:4px}

/* Shared subtle corners for signup, RSVP, and the video disclosure. */
#mlb2-46202367 .ml-form-horizontalRow {border-bottom:0}
#mlb2-46202367 input[type=email] {border:1px solid #b8bdab;border-radius:4px;padding-inline:12px}
#mlb2-46202367 .ml-button-horizontal button,#next-event .event-entry a,.past-events-toggle {border-radius:4px}
#next-event .event-entry a {border-radius:2px}

/* Small rounded corners on thumbnails and active video players. */
.past-events .video-frame {border-radius:2px;overflow:hidden}

/* Shift the landing crop toward the person on the right. */
.hero-photo {background-position:65% center}
@media(max-width:780px) {.hero-photo {background-position:65% 45%}}

/* Bring event copy and artwork closer on desktop. */
@media(min-width:781px) {
  #next-event {column-gap:clamp(28px,3vw,42px)}
  #next-event .event-feature-copy {justify-self:end}
  #next-event>img {justify-self:start}
}
/* Center the copy block with generous sage space around it. */
@media(min-width:781px) {
  #next-event {padding:clamp(32px,4vw,56px);column-gap:clamp(32px,4vw,56px)}
  #next-event .event-feature-copy {justify-self:center;width:100%;max-width:460px;padding:12px 20px;box-sizing:border-box}
  #next-event>img {justify-self:center}
}
/* Give the flyer more presence beside the event heading. */
@media(min-width:781px) {
  #next-event {grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(28px,3vw,42px)}
  #next-event>img {max-width:500px;width:100%}
}
/* A quiet paper texture and warm olive wash behind the story. */
#story {
  background-color:var(--mood-ivory);
  background-image:
    radial-gradient(ellipse at 2% 18%,rgba(115,121,102,.10),transparent 42%),
    radial-gradient(ellipse at 98% 70%,rgba(192,172,135,.12),transparent 45%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.035' filter='url(%23grain)'/%3E%3C/svg%3E");
  background-size:auto,auto,180px 180px;
}
.shop-newsletter-link {color:inherit;text-decoration:underline;text-underline-offset:4px}
.shop-newsletter-link:hover {color:var(--mood-olive)}

/* Event archive: a saved flyer on sage paper, with an editorial caption. */
#next-event.next-announcement {display:flex;flex-direction:column;align-items:flex-start;gap:20px;min-height:0;padding:36px clamp(24px,4vw,56px);background:var(--mood-sage)}
#next-event.next-announcement h3 {margin:0;font-size:clamp(34px,4vw,52px);line-height:1.05}
.archive-link {display:inline-flex;gap:20px;align-items:center;color:inherit;font-size:12px;text-decoration:underline;text-underline-offset:5px}
.event-archive {display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(30px,6vw,90px);align-items:center;padding:clamp(24px,4vw,52px);margin-bottom:32px;background:var(--mood-sage);color:var(--mood-espresso)}
.archive-art {position:relative;max-width:330px;width:100%;justify-self:center;padding-top:30px}
.archive-stamp {position:absolute;top:0;left:0;font-size:9px;letter-spacing:.13em}
.archive-art img {display:block;width:100%;height:auto;border-radius:4px;box-shadow:0 10px 24px #39372d20;transform:rotate(-2deg)}
.archive-copy {max-width:470px}
.archive-copy h3 {font-size:clamp(36px,4.5vw,64px);line-height:1.02;letter-spacing:-.025em;margin:18px 0 24px}
.archive-copy h3 em {font-weight:inherit}
.archive-copy p {font-size:14px;line-height:1.8;margin:0 0 16px;max-width:43ch}
.archive-note {border-top:1px solid #a6aa9b;margin-top:28px;padding-top:20px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center}
.archive-note .label {font-size:9px}
@media(max-width:780px) {
  .event-archive {grid-template-columns:1fr;gap:34px;padding:28px 24px}
  .archive-art {max-width:280px}
  .archive-copy {max-width:none}
  .archive-copy h3 {font-size:42px}
}

/* A quiet disclosure keeps the event flyer beside its video collection. */
.kodama-details {margin-top:18px;border-top:1px solid var(--mood-rule)}
.kodama-details>summary {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;cursor:pointer;list-style:none;font-size:10px;letter-spacing:.12em;color:var(--mood-espresso)}
.kodama-details>summary::-webkit-details-marker {display:none}
.kodama-details>summary span {font:400 20px/1 var(--mood-body);transition:transform .2s}
.kodama-details[open]>summary span {transform:rotate(45deg)}
.kodama-details>summary:hover {color:var(--mood-olive)}
.kodama-details>summary:focus-visible {outline:2px solid var(--mood-olive);outline-offset:3px}
.kodama-details .event-archive {margin:4px 0 0}

/* Selected playback takes the full row; thumbnails keep their original order. */
#past-videos .video-card.video-selected {display:flex;grid-column:1/-1;order:-1;scroll-margin-top:100px}
#past-videos .video-selected .video-frame {width:100%;aspect-ratio:16/9;height:auto}
.kodama-details + .past-events-toggle {margin-top:18px}

/* Latest session, its flyer, then the earlier sessions. */
#latest-video .video-selected {grid-column:1/-1;scroll-margin-top:100px}
#latest-video .video-selected .video-frame {width:100%;aspect-ratio:16/9;height:auto}
.video-close {align-self:flex-end;margin:0 0 8px;padding:5px 9px;border:1px solid var(--mood-rule);border-radius:3px;background:transparent;color:var(--mood-espresso);font:400 10px/1.4 var(--mood-body);cursor:pointer;letter-spacing:.04em}
.video-close:hover {background:var(--mood-sage)}
.kodama-details + #past-videos {margin-top:24px}

/* Keep all idle thumbnails together; lift only the selected player above the flyer. */
#active-video-stage:empty {display:none}
#active-video-stage:not(:empty) {margin-bottom:20px}
#active-video-stage .video-selected {scroll-margin-top:100px}
#active-video-stage .video-frame {width:100%;height:auto;aspect-ratio:16/9}
#kodama-details[hidden] + #past-videos {margin-top:0}

/* Match the round crew portraits and retain the artwork name as a caption. */
summary.crew-profile-head>.rex-profile-art {display:block;grid-column:1;grid-row:1;width:64px;flex:none;text-align:center}
.rex-profile-art .rex-thumbnail {display:block;width:64px;height:64px;overflow:hidden;border-radius:50%}
.crew-profile-head .rex-thumbnail img {transform:scale(3);transform-origin:53% 28%;border-radius:0}
.rex-art-caption {display:block;margin-top:6px;font:400 8px/1.35 var(--mood-body);letter-spacing:.02em;color:var(--mood-muted)}

summary.crew-profile-head>.rex-profile-art {width:64px;height:64px;overflow:visible;align-self:center}
.crew-profile-head .rex-profile-art img.rex-sticker {display:block;width:64px;max-width:100%;height:64px;margin:0;object-fit:contain;border-radius:0;transform:none;filter:none}
