/* About: a company introduction grounded in the existing founder archive. */
.studio-page[data-page="about"] {--jsa-gold:#e5cc85;--jsa-muted:#c5c1cf;--jsa-line:#e5cc8530;background:#090a18;}
.jsa-wrap {width:min(1240px,calc(100% - 96px));margin-inline:auto;}
.studio-page[data-page="about"] main em {font-style:normal;color:var(--jsa-gold);}
.jsa-kicker {display:flex;align-items:center;gap:12px;color:var(--jsa-gold);font-size:11px;line-height:1.6;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin:0 0 24px;}
.jsa-kicker>span {width:6px;height:6px;border-radius:50%;background:#edc136;box-shadow:0 0 14px #edc13655;}
.jsa-hero {display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(60px,7vw,100px);align-items:center;padding-block:76px 88px;}
.jsa-hero h1 {font-size:clamp(58px,6.1vw,86px);line-height:1.04;letter-spacing:-.055em;max-width:700px;}
.jsa-lede {font-size:20px;line-height:1.7;color:#e4e0d7;max-width:530px;margin:29px 0 0;}
.jsa-hero-detail {font-size:16px;line-height:1.85;color:var(--jsa-muted);max-width:480px;margin:17px 0 0;}
.jsa-link {display:inline-flex;align-items:center;gap:12px;min-height:44px;line-height:1.65;font-size:13px;}
.jsa-hero-copy>.jsa-link {margin-top:24px;}
.jsa-portrait {margin:0;width:100%;max-width:380px;justify-self:end;}
.jsa-portrait-frame {aspect-ratio:3/4;border:1px solid #e5cc8540;border-radius:130px 28px 28px 28px;overflow:hidden;background:#171722;box-shadow:0 25px 70px #0004;}
.jsa-portrait picture,.jsa-portrait img {display:block;width:100%;height:100%;}
.jsa-portrait img {object-fit:cover;object-position:center;filter:none;}
.jsa-portrait figcaption {display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:11px;line-height:1.7;color:var(--jsa-muted);padding:19px 2px 0;}
.jsa-portrait figcaption>span:first-child {color:#eee7d8;}
.jsa-approach {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:90px;border-top:1px solid var(--jsa-line);padding-block:78px 86px;}
.jsa-wrap h2 {font-size:clamp(38px,3.9vw,54px);line-height:1.1;letter-spacing:-.045em;}
.jsa-approach header>p:last-child {font-size:16px;line-height:1.85;color:var(--jsa-muted);max-width:355px;margin:26px 0 0;}
.jsa-principles {list-style:none;margin:0;padding:0;}
.jsa-principles li {display:grid;grid-template-columns:40px minmax(0,1fr);gap:26px;padding:29px 0;border-top:1px solid var(--jsa-line);}
.jsa-principles li:first-child {padding-top:0;border-top:0;}
.jsa-principles li:last-child {padding-bottom:0;}
.jsa-number {padding-top:9px;font-size:11px;letter-spacing:.1em;color:var(--jsa-gold);}
.jsa-principles h3 {font:400 32px/1.2 Georgia,serif;letter-spacing:-.03em;margin:0;}
.jsa-principles p {font-size:15px;line-height:1.85;color:var(--jsa-muted);margin:14px 0 0;max-width:460px;}
.jsa-origin {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:100px;border-top:1px solid var(--jsa-line);padding-block:86px;align-items:center;}
.jsa-origin-copy>p:not(.jsa-kicker) {max-width:490px;font-size:16px;line-height:1.9;color:var(--jsa-muted);margin:24px 0 0;}
.jsa-origin-copy>p:not(.jsa-kicker)+p {margin-top:15px;}
.jsa-origin-links {display:flex;flex-wrap:wrap;gap:4px 26px;margin-top:22px;}
.jsa-secondary {color:var(--jsa-muted);font-size:12px;}
.jsa-document {margin:0;max-width:450px;justify-self:end;}
.jsa-document>a {display:block;text-decoration:none;border:1px solid #e5cc8540;border-radius:22px;overflow:hidden;background:#141522;box-shadow:0 25px 70px #0003;}
.jsa-document-frame {padding:25px;background:#e9e4d9;}
.jsa-document img {display:block;width:100%;height:auto;aspect-ratio:960/896;object-fit:contain;filter:none;color:#262630;font:14px/1.6 "Segoe UI",Arial,sans-serif;}
.jsa-document-action {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 22px;min-height:54px;font-size:12px;color:var(--jsa-gold);}
.jsa-document figcaption {font-size:11px;line-height:1.8;color:var(--jsa-muted);margin-top:16px;}
.jsa-focus {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:80px;align-items:center;padding:48px 54px;border:1px solid #16c5674d;border-radius:30px;background:radial-gradient(ellipse at 0% 0%,#16c56712,transparent 60%),linear-gradient(125deg,#121a23,#0c101e);box-shadow:inset 0 1px 0 #ffffff08;}
.jsa-focus .jsa-kicker {color:#5cdda0;}
.jsa-focus .jsa-kicker>span {background:#16c567;box-shadow:0 0 14px #16c56744;}
.jsa-focus h2 {font-size:clamp(42px,4.5vw,62px);}
.jsa-focus-heading>p:last-child {font:400 27px/1.35 Georgia,serif;color:#b4cdbe;letter-spacing:-.025em;margin:22px 0 0;}
.jsa-focus-copy>p {font-size:15px;line-height:1.85;color:var(--jsa-muted);margin:0 0 18px;}
.jsa-focus-copy>p:first-child {font-size:18px;color:#ecece4;line-height:1.7;}
.jsa-focus-copy>.jsa-link {display:flex;width:fit-content;}
.jsa-focus-copy>.jsa-link:not(.jsa-secondary) {color:#69dda5;}
.jsa-close {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:100px;align-items:center;padding-block:100px 105px;}
.jsa-close-action {max-width:365px;}
.jsa-close-action>p {font-size:13px;line-height:1.8;color:var(--jsa-muted);margin:22px 0 0;}
.jsa-close-action>p+p {font-size:12px;margin-top:13px;}
.jsa-close-action>.jsa-link {font-size:12px;margin-top:16px;}
.jsa-wrap :is(a,summary):focus-visible {outline:2px solid var(--jsa-gold);outline-offset:5px;border-radius:5px;}
.jsa-approach:focus {outline:none;}
.jsa-approach:focus-visible {outline:1px solid var(--jsa-gold);outline-offset:8px;}
@media(max-width:1100px) {
  .jsa-wrap {width:calc(100% - 64px);}
  .jsa-hero {grid-template-columns:minmax(0,1fr) 300px;gap:48px;padding-block:62px 70px;}
  .jsa-hero h1 {font-size:clamp(52px,6.5vw,68px);}
  .jsa-lede {font-size:18px;}
  .jsa-portrait-frame {border-top-left-radius:100px;}
  .jsa-approach,.jsa-origin {gap:55px;padding-block:66px;}
  .jsa-focus {padding:38px 36px;gap:45px;}
  .jsa-close {gap:55px;padding-block:80px;}
}
@media(max-width:850px) {
  .jsa-hero {grid-template-columns:minmax(0,1fr) 260px;gap:36px;}
  .jsa-hero h1 {font-size:clamp(48px,6.5vw,58px);}
  .jsa-portrait figcaption {gap:3px;flex-direction:column;}
  .jsa-hero-detail {font-size:15px;}
  .jsa-approach,.jsa-origin {gap:40px;grid-template-columns:1fr 1fr;}
  .jsa-principles li {grid-template-columns:25px 1fr;gap:15px;}
  .jsa-principles h3 {font-size:27px;}
  .jsa-wrap h2 {font-size:39px;}
  .jsa-document-frame {padding:18px;}
  .jsa-focus {gap:30px;}
  .jsa-focus h2 {font-size:45px;}
  .jsa-focus-heading>p:last-child {font-size:24px;}
  .jsa-close {grid-template-columns:1fr 1fr;gap:40px;}
}
@media(max-width:700px) {
  .jsa-wrap {width:calc(100% - 48px);}
  .jsa-hero {grid-template-columns:1fr;gap:38px;padding-block:45px 54px;}
  .jsa-hero h1 {font-size:clamp(43px,10.6vw,66px);line-height:1.05;max-width:580px;}
  .jsa-kicker {font-size:10px;margin-bottom:21px;}
  .jsa-lede {font-size:18px;margin-top:25px;}
  .jsa-hero-detail {font-size:15px;margin-top:15px;}
  .jsa-hero-copy>.jsa-link {margin-top:17px;}
  .jsa-portrait {max-width:360px;justify-self:center;}
  .jsa-portrait-frame {border-radius:90px 24px 24px 24px;}
  .jsa-portrait figcaption {flex-direction:row;gap:4px 16px;padding-top:16px;}
  .jsa-approach,.jsa-origin {grid-template-columns:1fr;gap:33px;padding-block:54px;}
  .jsa-wrap h2 {font-size:clamp(34px,8.9vw,48px);}
  .jsa-approach header>p:last-child {font-size:15px;max-width:480px;margin-top:22px;}
  .jsa-principles li {grid-template-columns:26px minmax(0,1fr);gap:17px;padding-block:26px;}
  .jsa-principles li:first-child {padding-top:25px;border-top:1px solid var(--jsa-line);}
  .jsa-principles h3 {font-size:29px;}
  .jsa-principles p {font-size:14px;margin-top:11px;}
  .jsa-origin-copy>p:not(.jsa-kicker) {font-size:15px;margin-top:22px;}
  .jsa-origin-links {gap:2px 22px;margin-top:17px;}
  .jsa-document {justify-self:start;width:100%;max-width:420px;}
  .jsa-document-action {padding:15px 18px;}
  .jsa-focus {grid-template-columns:1fr;padding:30px 26px;gap:26px;border-radius:24px;}
  .jsa-focus h2 {font-size:clamp(38px,10.5vw,44px);}
  .jsa-focus-heading>p:last-child {font-size:25px;margin-top:15px;}
  .jsa-focus-copy>p {font-size:14px;}
  .jsa-focus-copy>p:first-child {font-size:16px;}
  .jsa-close {grid-template-columns:1fr;gap:28px;padding-block:60px 75px;}
  .jsa-close-action {max-width:440px;}
  .jsa-close-action>.button {min-height:48px;}
}
@media(forced-colors:active) {
  .jsa-portrait-frame,.jsa-document>a,.jsa-document-frame,.jsa-focus {background:Canvas;border:1px solid CanvasText;box-shadow:none;}
  .jsa-approach,.jsa-origin,.jsa-principles li {border-color:CanvasText;}
  .jsa-document-action {color:LinkText;}
}