body.about-page{height:auto;min-height:100svh;width:100%;overflow:visible;overscroll-behavior-y:none;background:#090909;color:#f3efe9}
.about-layout{min-height:100svh;overflow-anchor:none}
.about-stage{position:fixed;inset:0;height:100svh;overflow:hidden;isolation:isolate;background:#090909}
#about-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.about-reading-shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 17% 36%,#090909e8 0%,#090909aa 18%,transparent 48%),linear-gradient(90deg,#09090966,transparent 65%),radial-gradient(ellipse at center,transparent 55%,#0006)}
.about-biography{position:absolute;inset:0;z-index:2;pointer-events:none}
.bio-scene{position:absolute;left:7%;top:24svh;width:31%;max-width:450px;opacity:0;transition:opacity .2s ease;pointer-events:none}
.bio-scene.is-active{opacity:1;pointer-events:auto}
.bio-still{display:none}
.bio-copy{text-shadow:0 1px 5px #000a}
.bio-copy h1{margin:0;font-size:clamp(48px,5.4vw,78px);font-weight:500;line-height:.95;letter-spacing:-.065em}
.bio-copy h2{font-size:23px;line-height:1.1;font-weight:500;letter-spacing:-.035em;margin:0 0 25px}
.bio-copy p{font-size:clamp(16px,1.4vw,20px);line-height:1.5;letter-spacing:-.02em;margin:0;text-wrap:pretty}
.bio-copy p+p{margin-top:20px;color:#f3efe9}
.bio-copy .about-pronunciation{font-size:11px;letter-spacing:.025em;margin:15px 0 30px;color:#a9a39b}
.about-contact{position:absolute;inset:0;z-index:5;opacity:0;pointer-events:none;color:#f2eee8;overflow:hidden;background:linear-gradient(180deg,#09090999,transparent 35%,#09090988)}
.contact-top{position:absolute;left:7%;right:7%;top:17svh}
.contact-top h2{font-size:11px;line-height:1.4;font-weight:400;letter-spacing:.015em;margin:0 0 15px;color:#b8b1a7}
.contact-email{display:inline-block;font-size:clamp(24px,3vw,44px);font-weight:400;letter-spacing:-.045em;line-height:1.15;border-bottom:1px solid #ffffff66;padding-bottom:5px}
.contact-email:hover{border-bottom-color:#fff}
.contact-mark{position:absolute;left:5%;right:5%;top:36svh;display:flex;justify-content:center;align-items:center;font-family:Arial,Helvetica,sans-serif;font-size:min(34vw,48svh);line-height:.78;font-weight:900;letter-spacing:-.075em;perspective:900px;user-select:none}
.contact-mark span{display:block;color:transparent;background-size:cover;background-position:50% 42%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:.5px #ffffff33;filter:brightness(1.15) drop-shadow(0 10px 15px #0007);will-change:transform}
.contact-mark span:last-child{padding-right:.04em}
.contact-copyright{position:absolute;right:7%;top:10svh;font-size:10px;line-height:1.4;color:#aaa298}
.contact-bottom{position:absolute;left:7%;right:7%;bottom:30px;display:flex;align-items:flex-end;justify-content:space-between;gap:28px;text-align:right}
.site-credit{display:inline-block;font-size:11px;line-height:1.45;color:#aaa298}
.site-credit span{border-bottom:1px solid #aaa29855}
.site-credit:hover{color:#f2eee8}
.about-contact a:focus-visible{outline:2px solid #f3efe9;outline-offset:5px}
@media(max-width:760px){
 .about-reading-shade{background:linear-gradient(180deg,transparent 13%,#09090911 29%,#090909d9 46%,#090909fa 67%,#090909 100%)}
 .bio-scene{left:7%;top:38svh;width:86%;max-width:none}
 .bio-copy{text-shadow:0 1px 5px #000a}
.bio-copy h1{font-size:clamp(34px,10vw,46px)}
 .bio-copy h2{font-size:20px;margin-bottom:17px}
 .bio-copy p{font-size:clamp(14px,2.1svh,17px);line-height:1.43;letter-spacing:-.015em}
 .bio-copy p+p{margin-top:14px}
 .bio-copy .about-pronunciation{font-size:10px;margin:10px 0 20px}
 .contact-top{top:18svh}
 .contact-email{font-size:clamp(18px,4.9vw,23px)}
 .contact-mark{top:36svh;display:grid;grid-template-columns:repeat(2,1fr);font-size:min(56vw,25svh);line-height:.8;letter-spacing:-.07em;text-align:center}
 .contact-copyright{top:10svh;font-size:10px}
 .contact-bottom{bottom:78px}
 .site-credit{font-size:10px;max-width:240px;text-align:right}
}
.about-static .about-layout{height:auto!important}
.about-static .about-stage{position:relative;height:auto;overflow:visible}
.about-static #about-canvas,.about-static .about-reading-shade{display:none}
.about-static .about-biography{position:relative;padding:95px 24px 75px;opacity:1!important}
.about-static .bio-scene{position:relative;left:auto;top:auto;width:100%;max-width:760px;opacity:1;margin:0 auto 75px;transition:none;pointer-events:auto}
.about-static .bio-still{display:block;margin:0 0 30px}
.about-static .bio-still img{display:block;width:100%;max-height:70svh;object-fit:contain}
.about-static .bio-copy{max-width:640px;margin:auto}
.about-static .about-contact{position:relative;height:100svh;min-height:540px;opacity:1!important;pointer-events:auto;background:#0b0b0b}
.about-static .contact-mark span{transform:none!important;will-change:auto}

.reveal-word{display:inline-block;opacity:var(--ink,.2)}
.about-static .reveal-word{opacity:1!important}

.partner-badge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:44px;flex:none;opacity:.88;transition:opacity .2s ease}
.partner-badge img{display:block;width:108px;height:auto}
.partner-badge:hover,.partner-badge:focus-visible{opacity:1}
@media(max-width:760px){.contact-bottom{gap:20px}.partner-badge img{width:92px;height:auto}.contact-bottom .site-credit{max-width:155px}}
@media(prefers-reduced-motion:reduce){.partner-badge{transition:none}}

.partner-badge span{font-size:8.5px;font-weight:400;letter-spacing:.01em;color:#c2bdb4;white-space:nowrap}
@media(max-width:760px) and (max-height:650px){.contact-mark{top:34svh;font-size:min(53vw,21svh)}}
/* Keep the mobile photographic monogram as one tightly set block. */
@media(max-width:760px){
 .contact-mark{left:50%;right:auto;transform:translateX(-50%);grid-template-columns:repeat(2,.66em);column-gap:0;row-gap:.01em;line-height:.78;letter-spacing:-.06em}
 .contact-mark span:last-child{padding-right:0}
}

/* Keep biography copy above the menu on a shared lower baseline on mobile. */
@media(max-width:760px){.about-page:not(.about-static) .bio-scene{top:auto;bottom:max(96px,14svh)}.about-reading-shade{background:linear-gradient(180deg,transparent 18%,#09090911 35%,#090909b8 52%,#090909ee 70%,#090909 100%)}}
