/* The hero's six promises share its reveal and the site's disclosure controller. */
/* Repacking after rotation must not let scroll anchoring rewind the intro. */
html:has(> body.material-page[data-site-page="home"][data-intro="playing"]),
body.material-page[data-site-page="home"][data-intro="playing"] { overflow-anchor:none; }
.material-page[data-site-page="home"] .studio-content {
  padding-top:calc(var(--header) + clamp(28px,3vw,56px));
  padding-bottom:clamp(48px,5vw,80px);
}
.material-page[data-site-page="home"] .studio-opening {
  grid-template-columns:minmax(0,1.6fr) minmax(0,.8fr);
  gap:clamp(36px,5vw,88px);
  align-items:center;
}
.material-page[data-site-page="home"] .hero-studio h1 {
  font-size:clamp(58px,5.8vw,112px);
  line-height:1.02;
  max-width:16ch;
}
.material-page[data-site-page="home"] .hero-kicker { margin-bottom:24px; }
.material-page[data-site-page="home"] .hero-studio .lead { max-width:33ch; margin-top:24px; }
.material-page[data-site-page="home"] .studio-image .hero-art {
  height:clamp(280px,29vw,480px);
}
.material-page[data-site-page="home"] .studio-image .hero-art img { object-position:50% 45%; }
.material-page[data-site-page="home"] .hero .button { margin-top:26px; }
.material-page[data-site-page="home"] .hero-principles-wrap { margin-top:clamp(36px,4vw,64px); }
/* Native grid remains usable without either interaction script. */
.material-page[data-site-page="home"] .hero-principles {
  --principle-tiles-ready:1;
  --principle-tile-columns:9;
  --principle-tile-gap:12px;
  --principle-tile-open-span:4;
  position:relative;
  display:grid;
  grid-template-columns:repeat(var(--principle-tile-columns),minmax(0,1fr));
  align-items:start;
  gap:var(--principle-tile-gap);
  margin:0;
  padding:0;
  isolation:isolate;
  overflow-anchor:none;
}
.material-page[data-site-page="home"] .hero-principle {
  --principle-span:1;
  grid-column:span var(--principle-span);
  position:relative;
  min-width:0;
  margin:0;
  background:#242424;
  color:#f2f2f2;
  border:1px solid #686868;
  border-radius:0;
  box-shadow:3px 4px 0 #080808;
  transition:border-color 180ms ease,box-shadow 180ms ease;
}
.material-page[data-site-page="home"] .hero-principle:is(:nth-child(2),:nth-child(3),:nth-child(5)) { --principle-span:2; }
.material-page[data-site-page="home"] .hero-principle[open] { grid-column:span var(--principle-tile-open-span); }
.material-page[data-site-page="home"] .hero-principles[data-principle-tiles-enhanced="true"] { display:block; }
.material-page[data-site-page="home"] .hero-principles[data-principle-tiles-enhanced="true"] > .hero-principle {
  position:absolute;
  transform-origin:top left;
}
.material-page[data-site-page="home"] .hero-principle > summary {
  position:relative;
  display:flex;
  align-items:flex-end;
  min-height:92px;
  padding:30px 14px 14px;
  list-style:none;
  cursor:pointer;
  font:600 clamp(18px,1.45vw,22px)/1.18 var(--sans);
  letter-spacing:-.025em;
}
.material-page[data-site-page="home"] .hero-principle:is(:nth-child(2),:nth-child(5)) > summary { min-height:112px; }
.material-page[data-site-page="home"] .hero-principle > summary > span:first-child { min-width:0; max-width:100%; }
.material-page[data-site-page="home"] .hero-principle[open] > summary { min-height:76px; padding-right:40px; }
.hero-principle > summary::-webkit-details-marker { display:none; }
.hero-principle-toggle { position:absolute; top:10px; right:12px; width:18px; text-align:center; color:#ff7b39; font:400 25px/1 var(--sans); }
.hero-principle-toggle::after { content:'+'; }
.hero-principle[open] .hero-principle-toggle::after { content:'−'; }
.material-page[data-site-page="home"] .hero-principle[open] { border-color:#ff7b39; }
.material-page[data-site-page="home"] .hero-principle-content { padding:4px 18px 22px; }
.material-page[data-site-page="home"] .hero-principle-content p {
  margin:0;
  max-width:45ch;
  color:#e0e0dd;
  font:400 var(--type-body)/1.5 var(--sans);
}
.material-page[data-site-page="home"] .hero-principle-content .text-link {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:44px;
  margin-top:16px;
  padding:8px 0;
  border-bottom:1px solid #777;
  color:#fff;
  font:600 var(--type-caption)/1.35 var(--sans);
}
.hero-principle .disclosure-trace { color:#ff7b39; }
.hero-principle .disclosure-trace-edge { box-shadow:0 0 7px #ff7b3940; }
.hero-principle .disclosure-trace-head { box-shadow:0 0 9px 2px #ff7b3970; }
.material-page[data-site-page="home"] .hero-principle:has(:focus-visible) { box-shadow:6px 6px 0 #ff7b39; }
@media(hover:hover) and (pointer:fine) {
  .material-page[data-site-page="home"] .hero-principle:hover { box-shadow:6px 6px 0 #ff7b39; }
}
/* Owner-confirmed current retention. No inferred cohort count or hiring average. */
.material-page[data-site-page="home"] .placement-proof {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:32px;
  padding:0 0 clamp(36px,5vw,72px);
  margin:0 0 clamp(36px,5vw,72px);
  border-bottom:1px solid #686868;
}
.material-page[data-site-page="home"] .placement-proof .label { margin-bottom:16px; }
.material-page[data-site-page="home"] .placement-proof h2 { font-size:clamp(40px,4.5vw,76px); max-width:12ch; line-height:1.05; }
.material-page[data-site-page="home"] .placement-stat { padding-left:clamp(24px,5vw,72px); border-left:3px solid #ff7b39; }
.material-page[data-site-page="home"] .placement-number { margin:0; font:700 clamp(82px,10vw,154px)/.95 var(--sans); letter-spacing:-.065em; }
.material-page[data-site-page="home"] .placement-number span { font-size:.52em; letter-spacing:-.04em; margin-left:.1em; }
.material-page[data-site-page="home"] .placement-caption { margin:18px 0 0; font-size:var(--type-body); }
.material-page[data-site-page="home"] .placement-asof { margin:8px 0 0; color:#cfcfcc; font-size:var(--type-caption); }
@media(max-width:1199px) {
  .material-page[data-site-page="home"] .hero-principles { --principle-tile-columns:6; --principle-tile-open-span:3; }
}
@media(max-width:1000px) {
  .material-page[data-site-page="home"] .studio-opening { grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr); gap:30px; }
  .material-page[data-site-page="home"] .hero-studio h1 { font-size:clamp(48px,6.5vw,66px); }
  .material-page[data-site-page="home"] .studio-image .hero-art { height:320px; }
}
@media(max-width:700px) {
  .material-page[data-site-page="home"] .studio-opening { grid-template-columns:1fr; gap:28px; }
  .material-page[data-site-page="home"] .hero-studio h1 { font-size:clamp(40px,10.8vw,64px); max-width:16ch; }
  .material-page[data-site-page="home"] .hero-kicker { margin-bottom:20px; }
  .material-page[data-site-page="home"] .studio-image .hero-art { height:160px; }
  .material-page[data-site-page="home"] .hero-principles-wrap { margin-top:28px; }
  .material-page[data-site-page="home"] .hero-principles { --principle-tile-columns:3; --principle-tile-gap:8px; --principle-tile-open-span:2; }
  .material-page[data-site-page="home"] .hero-principle > summary { padding:28px 12px 13px; font-size:18px; }
  .material-page[data-site-page="home"] .hero-principle-content { padding:4px 14px 18px; }
  .material-page[data-site-page="home"] .hero-principle-content p { font-size:20px; }
  .material-page[data-site-page="home"] .hero-principle-content .text-link { font-size:18px; }
  .material-page[data-site-page="home"] .placement-proof { grid-template-columns:1fr; gap:28px; }
  .material-page[data-site-page="home"] .placement-stat { padding-left:24px; }
}
@media(max-width:350px) {
  .material-page[data-site-page="home"] .hero-principles { --principle-tile-open-span:3; }
  .material-page[data-site-page="home"] .hero-principle > summary { padding-left:10px; padding-right:10px; font-size:17px; }
}
@media(prefers-reduced-motion:reduce) {
  .material-page[data-site-page="home"] .hero-principle { transition:none; }
}
