.about-page{--about-progress:0}
.about-page em{color:var(--orange);font-style:normal}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.about-opening{position:relative;border-bottom:1px solid var(--rule)}
.about-stage{position:relative;min-height:860px;height:100svh;overflow:hidden;isolation:isolate}
.about-stage::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 58%,rgba(120,135,154,.075),transparent 52%);pointer-events:none}
.about-heading{position:absolute;inset:110px 20px auto;text-align:center;z-index:1;pointer-events:none}
.about-heading .eyebrow{font-size:11px;letter-spacing:.16em;color:var(--muted);margin:0 0 22px}
.about-heading h1{font-size:clamp(76px,10vw,156px);font-weight:500;line-height:.88;letter-spacing:-.065em;margin:0}
.about-heading h1 em{color:var(--white)}
.about-model{position:absolute;left:50%;top:40%;transform:translate(-50%,-12%);width:min(64vw,800px);height:53%;margin:0;z-index:2;pointer-events:none}
.about-model-canvas,.about-model-canvas canvas{width:100%;height:100%;display:block}
.about-model-canvas{opacity:0;transition:opacity .85s ease}
.about-model.is-ready .about-model-canvas{opacity:1}
.about-model-status{position:absolute;top:60%;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.06em;color:var(--muted)}
.about-model.is-ready .about-model-status{display:none}
.about-current{position:absolute;bottom:14%;left:20px;right:20px;display:flex;gap:10px;align-items:center;justify-content:center;z-index:3;font-size:14px}
.about-current p{margin:0;color:var(--muted)}
.about-current strong{font-weight:500;color:var(--white)}
.about-live-dot{height:6px;width:6px;background:var(--orange);border-radius:50%}
.about-stage-bottom{position:absolute;bottom:28px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:center;gap:20px;z-index:4}
.about-motion{min-width:126px;cursor:pointer}
.about-motion[hidden]{display:none}
.about-shell{max-width:1440px;margin:0 auto;padding:100px var(--pad)}
.about-introduction{scroll-margin-top:64px}
.about-section-index{font-family:"SFMono-Regular",Consolas,monospace;font-size:15px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--orange);margin:0}
.about-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:38px}
.about-intro-grid h2{font-size:clamp(40px,4.7vw,68px);font-weight:500;line-height:1.04;letter-spacing:-.055em;margin:0}
.about-intro-copy p{font-size:18px;line-height:1.65;color:var(--muted);margin:0 0 24px;max-width:56ch}
.about-actions{display:flex;align-items:center;gap:26px;margin-top:34px;flex-wrap:wrap}
.about-actions .pill{background:var(--white);border-color:var(--white);color:var(--ink);padding:14px 22px}
.about-actions .pill:hover{background:var(--orange);border-color:var(--orange)}
.about-text-link{display:inline-block;font-size:13px;padding:9px 0;border-bottom:1px solid var(--rule);transition:border-color .2s}
.about-text-link:hover{border-color:var(--orange)}
.about-section-head{display:grid;grid-template-columns:1fr 2fr;gap:12px 50px;align-items:baseline;margin:0 0 50px}
.about-section-head h2{font-size:clamp(30px,3.4vw,48px);line-height:1.12;letter-spacing:-.045em;font-weight:500;margin:0}
.about-section-note{grid-column:2;font-size:11px;color:var(--muted)}
.about-experience,.about-education,.about-practice{border-top:1px solid var(--rule)}
.about-job{display:grid;grid-template-columns:1fr 2fr;gap:50px;border-top:1px solid var(--rule);padding:45px 0}
.about-job:last-child{padding-bottom:0}
.about-date{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 18px}
.about-job h3{font-size:clamp(27px,2.4vw,36px);font-weight:500;line-height:1.13;letter-spacing:-.045em;margin:0 0 12px}
.about-role{font-size:14px;line-height:1.5;margin:0 0 22px;color:var(--muted)}
.about-job-body p{font-size:16px;line-height:1.65;color:var(--muted);margin:0;max-width:70ch}
.about-job-body .about-job-lead{font-size:23px;line-height:1.4;letter-spacing:-.025em;color:var(--white);margin:0 0 26px}
.about-responsibilities{display:grid;grid-template-columns:1fr 1fr;gap:30px 36px}
.about-responsibilities h4{font-size:14px;font-weight:500;margin:0 0 10px}
.about-responsibilities p{font-size:14px}
.about-education-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.about-education-card{background:var(--paper-2);border:1px solid var(--rule);border-radius:var(--radius);padding:36px;display:flex;flex-direction:column;min-height:265px}
.about-education-card h3{font-size:clamp(24px,2.65vw,36px);font-weight:500;line-height:1.13;letter-spacing:-.04em;margin:6px 0 28px}
.about-education-card>p:last-child{font-size:15px;color:var(--muted);margin:auto 0 0}
.about-practice-grid{display:grid;grid-template-columns:1.3fr 1fr .8fr;gap:48px}
.about-practice-grid h3{font:11px "SFMono-Regular",Consolas,monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:0 0 25px}
.about-practice-grid ul{list-style:none;padding:0;margin:0 0 22px}
.about-practice-grid li{font-size:clamp(17px,1.8vw,24px);letter-spacing:-.02em;padding:10px 0;border-bottom:1px solid var(--rule)}
.about-practice-grid li span{display:block;font-size:12px;letter-spacing:0;color:var(--muted);margin-top:3px}
.about-opening.is-animated{height:155svh}
.about-opening.is-animated .about-stage{position:sticky;top:0;min-height:640px;height:100svh}
.is-animated .about-heading{transform:translateY(calc(var(--about-progress) * -200px));opacity:calc(1 - var(--about-progress) * 1.8)}
.is-animated .about-current{transform:translateY(calc(var(--about-progress) * -35px))}
.is-animated .about-model{top:calc(40% + var(--about-progress) * 5%)}
@media(min-width:1600px){.about-heading{top:120px}.about-model{height:56%;top:36%}}
@media(max-width:860px){
  .about-stage{height:92svh;min-height:660px}
  .about-opening.is-animated{height:125svh}
  .about-opening.is-animated .about-stage{height:92svh;min-height:590px}
  .about-heading{top:110px}
  .about-heading h1{font-size:clamp(70px,15vw,126px)}
  .about-model{width:calc(100% - 40px);height:46%;top:42%}
  .about-current{font-size:12px;bottom:16%}
  .about-stage-bottom{bottom:24px}
  .about-stage-bottom .scroll-cue{font-size:10px}
  .about-motion{font-size:10px;padding:8px 12px;min-width:115px}
  .about-shell{padding-top:65px;padding-bottom:65px}
  .about-intro-grid{grid-template-columns:1fr;gap:32px;margin-top:28px}
  .about-intro-grid h2{font-size:clamp(38px,8vw,56px)}
  .about-intro-copy p{font-size:16px}
  .about-section-head{grid-template-columns:1fr;gap:20px;margin-bottom:35px}
  .about-section-note{grid-column:1}
  .about-job{grid-template-columns:1fr;gap:25px;padding:32px 0}
  .about-role{margin-bottom:8px}
  .about-job-body .about-job-lead{font-size:21px}
  .about-job-heading .about-date{margin-bottom:12px}
  .about-job-heading br{display:none}
  .about-practice-grid{grid-template-columns:1fr 1fr;gap:30px}
  .about-practice-grid>div:first-child{grid-column:1/-1}
  .about-education-grid{grid-template-columns:1fr}
  .about-education-card{padding:28px;min-height:235px}
}
@media(max-width:480px){.about-responsibilities{grid-template-columns:1fr;gap:24px}.about-practice-grid{grid-template-columns:1fr}.about-heading h1{font-size:22vw}.about-current{bottom:18%}.about-model{top:43%;height:42%}}
@media(prefers-reduced-motion:reduce){.about-model-canvas{transition:none}.about-opening.is-animated{height:auto}.about-opening.is-animated .about-stage{position:relative}.about-heading,.about-current{transform:none!important;opacity:1!important}}

/* A continuous sculpture route, with a reading lane on either side. */
.about-current{font-size:clamp(20px,2.15vw,32px);line-height:1.3;bottom:12%}
.about-current p{max-width:30ch;text-align:center}
.about-current strong{display:block;font-weight:500}
.about-live-dot{width:8px;height:8px;flex-shrink:0}
.about-model-following{position:fixed;transform:translate(-50%,-50%);margin:0;z-index:12;pointer-events:none}
.about-opening.is-animated{height:125svh}
.about-opening.is-animated .about-stage{position:relative;min-height:640px;height:100svh}
.is-animated .about-heading{transform:none;opacity:1}
.is-animated .about-current{transform:none}
.has-about-sculpture .about-intro-grid,.has-about-sculpture .about-job,.has-about-sculpture .about-section-head,.has-about-sculpture .about-education-grid,.has-about-sculpture .about-practice-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(64px,7vw,100px)}
.has-about-sculpture .about-responsibilities{grid-template-columns:1fr}
.about-part{translate:var(--part-shift,0px) 0;will-change:translate}
.has-about-sculpture .about-education-card{padding:28px}
@media(max-width:860px){
  .about-current{font-size:clamp(20px,4.6vw,27px);bottom:22%;left:24px;right:24px}
  .about-heading{top:115px}
  .about-heading .eyebrow{font-size:10px;letter-spacing:.11em}
  .about-opening.is-animated{height:112svh}
  .about-opening.is-animated .about-stage{height:100svh;min-height:640px}
  .has-about-sculpture .about-shell{padding-left:28px;padding-right:112px}
  .has-about-sculpture .about-intro-grid,.has-about-sculpture .about-job,.has-about-sculpture .about-section-head,.has-about-sculpture .about-education-grid,.has-about-sculpture .about-practice-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .has-about-sculpture .about-intro-grid h2{font-size:clamp(30px,7.7vw,54px)}
  .has-about-sculpture .about-education-card{padding:18px}
  .has-about-sculpture .about-education-card h3{font-size:24px}
  .has-about-sculpture .about-intro-copy p{font-size:16px}
  .has-about-sculpture .about-actions{gap:16px}
  .about-stage-bottom{bottom:94px}
}
@media(prefers-reduced-motion:reduce){.about-part{translate:none!important;will-change:auto}}

/* Keep the sculpture layer stable; text separates when it passes each block. */
.about-model-following{will-change:transform;backface-visibility:hidden}
.about-page .about-section-head,.about-page .about-intro-grid{scroll-margin-top:90px}

/* A transformed body changes the containing block of the fixed sculpture. */
body[data-page="about"]:not(.is-leaving){animation:none}