/* Shared navigation and bounded layouts for phones through ultrawide displays. */
html{scroll-padding-top:88px;-webkit-text-size-adjust:100%}
img{max-width:100%}
/* Animate the reveal, not dimensions when the viewport changes. */
.reveal{transition:opacity .75s,transform .75s}
.site-nav{position:fixed;inset:0 0 auto;width:100%;height:76px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 max(3vw,calc((100% - 1600px)/2));z-index:50;background:var(--cream);border-bottom:1px solid var(--line)}
.site-nav .nav-mid{display:flex;gap:24px;font-size:.82rem}
.site-nav .nav-mid a{padding:8px 0}
.site-nav .nav-mid a[aria-current="page"]{text-decoration:underline;text-underline-offset:6px}
.nav-actions{justify-self:end;display:flex;align-items:center;gap:10px}
.site-nav .nav-cta{white-space:nowrap}
.nav-toggle{display:none;width:42px;height:42px;border:1px solid var(--ink);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;place-items:center;padding:0}
.nav-toggle span,.nav-toggle span:before,.nav-toggle span:after{display:block;width:16px;height:2px;background:currentColor;position:relative}
.nav-toggle span:before,.nav-toggle span:after{content:"";position:absolute;left:0}
.nav-toggle span:before{top:-5px}.nav-toggle span:after{top:5px}
.site-nav.open .nav-toggle span{background:transparent}
.site-nav.open .nav-toggle span:before{transform:translateY(5px) rotate(45deg)}
.site-nav.open .nav-toggle span:after{transform:translateY(-5px) rotate(-45deg)}
:focus-visible{outline:3px solid var(--coral);outline-offset:4px}
.site-nav .cta-short{display:none}
@media(max-width:1060px){
 .site-nav{grid-template-columns:1fr auto!important;height:68px;padding:0 16px}
 .nav-toggle{display:grid}
 .site-nav .nav-mid{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;padding:8px 16px 18px;background:var(--cream);border-bottom:2px solid var(--ink);box-shadow:0 18px 30px #183d341f;font-size:1.25rem;font-weight:700;visibility:hidden;opacity:0;transform:translateY(-8px)}
 .site-nav .nav-mid a{padding:14px 0;border-bottom:1px solid var(--line)}
 .site-nav.open .nav-mid{visibility:visible;opacity:1;transform:none}
}
@media(max-width:600px){.site-nav{height:64px;padding:0 12px}.site-nav .brand img{width:40px;height:40px}.site-nav .nav-cta{font-size:.79rem;padding:9px 12px}}
@media(max-width:380px){.site-nav .cta-long{display:none}.site-nav .cta-short{display:inline}.site-nav .brand small{display:none}}

/* Backgrounds stay full width; text and diagrams stop stretching with the monitor. */
@media(min-width:1600px){
 .page-home :is(.hero,.argument,.brain-section,.method,.final,.tools-head,.story),
 .page-tutors :is(.hero,.standard,.profiles,.matching,.final),
 .page-about :is(.hero,.chapter,.mother,.equation,.final,.realize-head),
 .page-stories :is(.hero,.featured,.collection,.signals,.final){padding-left:max(3vw,calc((100% - 1600px)/2));padding-right:max(3vw,calc((100% - 1600px)/2))}
 .page-home .tool{padding-left:max(3vw,calc((100% - 1600px)/2));padding-right:max(3vw,calc((100% - 1600px)/2))}
 .page-about .split{padding-inline:max(0px,calc((100% - 1600px)/2));background:var(--paper)}
 .hero{min-height:980px}
 .final{min-height:720px;gap:70px}
 .page-home .argument{min-height:800px}
 .page-home .story{min-height:850px}
 .page-about .mother{min-height:650px}
 .page-about .split article{min-height:650px}
 main> :is(.argument,.brain-section,.method,.final,.chapter,.mother,.equation,.standard,.profiles,.matching,.featured,.collection,.signals){padding-top:112px;padding-bottom:112px}
 .page-home .method{min-height:0}
 .page-home .workstation{margin-top:80px}
 .page-tutors .profile-list{margin-top:80px}
 .page-about .split article{padding:80px 64px}
}
.hero,.standard-head,.profiles-head,.method-head,.brain-head,.brain-layout,.chapter-grid{column-gap:clamp(32px,5vw,80px)}
.hero>*,.story>*,.chapter-grid>*,.brain-layout>*,.profile>*,.final-bottom>*{min-width:0}
.page-home .orbit{width:min(100%,680px);height:auto;max-height:none;aspect-ratio:1;justify-self:center;overflow:visible}
.page-home .orbit-core{left:50%;top:50%;translate:-50% -50%}
.page-home .orbit-core b{font-size:clamp(1.25rem,2vw,2rem)}
.page-home .orbit:before{inset:4%;border-radius:50%}
.page-home .orbit:after{width:76%;height:76%;left:12%;top:12%}
.page-home .story-copy{padding:clamp(48px,6vw,96px) clamp(24px,5vw,72px)}
.page-home .story-copy h2{font-size:clamp(3rem,5vw,5.8rem)}
.page-home .portrait{padding:64px 32px 76px}
.page-home .portrait-frame{width:min(82%,420px);height:auto;aspect-ratio:.72;max-height:none}
.page-home .portrait-frame:after{max-width:calc(100% - 28px)}
.page-home .workstation{max-height:900px}
.page-about .hero-photo{width:min(100%,640px);justify-self:center}
.page-tutors .profile-content{padding:clamp(44px,6vh,72px) clamp(24px,4vw,72px)}
.page-tutors .hero h1{font-size:clamp(4rem,7.4vw,8.5rem)}

/* Keep both orbit diagrams proportional; the tutor ring becomes a grid when tight. */
@media(min-width:1440px){
 .page-tutors .hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .page-tutors .team-orbit{width:min(100%,680px);aspect-ratio:1;height:auto;max-height:none}
 .page-tutors .shared-center{left:50%;top:50%;translate:-50% -50%;width:30%}
 .page-tutors .shared-center b{font-size:clamp(1.4rem,2.2vw,2.2rem)}
 .page-tutors .team-orbit .expert-chip{width:23%;font-size:.78rem;min-height:0}
 .page-tutors .team-orbit .expert-chip:nth-of-type(1){--x:0%;--y:-41%}
 .page-tutors .team-orbit .expert-chip:nth-of-type(2){--x:33%;--y:-26%}
 .page-tutors .team-orbit .expert-chip:nth-of-type(3){--x:41%;--y:11%}
 .page-tutors .team-orbit .expert-chip:nth-of-type(4){--x:19%;--y:42%}
 .page-tutors .team-orbit .expert-chip:nth-of-type(5){--x:-19%;--y:42%}
 .page-tutors .team-orbit .expert-chip:nth-of-type(6){--x:-41%;--y:11%}
 .page-tutors .team-orbit .expert-chip:nth-of-type(7){--x:-33%;--y:-26%}
 .page-tutors .team-orbit:before{inset:3%;border-radius:50%}
}
@media(min-width:761px) and (max-width:1439px){
 .page-tutors .hero{grid-template-columns:1fr;min-height:auto;gap:40px}
 .page-tutors .hero-copy{max-width:950px}
 .page-tutors .team-orbit{width:100%;max-width:1000px;aspect-ratio:auto;height:auto;max-height:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:8px 12px 16px}
 .page-tutors .team-orbit:before,.page-tutors .team-orbit:after,.page-tutors .shared-center{display:none}
 .page-tutors .team-orbit .expert-chip{position:relative;inset:auto;translate:none;width:auto;aspect-ratio:auto;min-height:200px;padding:16px;--r:0deg}
 .page-tutors .chip-photo{width:min(55%,120px)}
 .page-tutors .expert-chip span{font-size:.85rem}
 .page-tutors .expert-chip small{font-size:.65rem}
}
@media(min-width:601px) and (max-width:1100px){
 .page-home .hero{grid-template-columns:1fr;min-height:auto;gap:40px;padding-top:110px}
 .page-home .hero-copy{max-width:850px}
 .page-home .orbit{width:min(100%,620px)}
 .page-home .orbit-core{width:30%}
 .page-home .orbiter{width:29%}
 .page-home .orbit-core b{font-size:clamp(1.3rem,3vw,2rem)}
 .page-home .brain-layout{grid-template-columns:minmax(0,1fr)}
 .page-home .brain-stage{width:100%;max-width:680px;justify-self:center}
 .page-home .brain-detail{min-height:0}
}
@media(max-width:820px){
 .page-home .story{grid-template-columns:minmax(0,1fr)}
 .page-about .hero h1{font-size:clamp(4rem,12vw,7rem)}
 .page-about .hero-photo{height:600px}
}
@media(max-width:600px){
 .page-home .orbit{aspect-ratio:auto;height:500px;width:100%;margin:0}
 .page-home .orbit-core{width:34%;top:48%}
 .page-home .orbit-core b{font-size:1.12rem}
 .page-home .orbit:before{inset:8% 4%;border-radius:48%}
 .page-home .orbit:after{width:78%;height:70%;left:11%;top:15%}
 .page-home .story-copy{padding:60px 16px}
 .page-home .story-copy h2{font-size:clamp(2.8rem,12vw,3.45rem)}
 .page-about .hero-photo{height:430px}
 .page-about :is(.prose h2,.realize-head h2){font-size:clamp(2.6rem,12.8vw,4rem)}
 .page-about .mother h2{font-size:clamp(3.5rem,17vw,5.8rem)}
 .page-about .split h3{font-size:clamp(2.6rem,12vw,3.5rem)}
 .page-about .equation p{font-size:clamp(2.6rem,11vw,3.35rem)}
 .page-about .final h2{font-size:clamp(3rem,14vw,5rem)}
 .page-stories :is(.featured h2,.collection h2,.signals h2){font-size:clamp(2.8rem,14vw,4.2rem)}
 .page-stories .story-frame{max-width:calc(100% - 9px)}
 .page-stories .final h2{font-size:clamp(3rem,14vw,4.5rem)}
}
@media(max-height:600px) and (min-width:601px){
 .hero{min-height:auto}
 .page-home .method{min-height:auto}
 .page-home .workstation{position:relative;top:auto;height:720px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none}}