@import url("./tokens.css");

@font-face{font-family:Golos;src:url("./assets/fonts/golos-text.ttf") format("truetype");font-display:swap}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--studio-ink);color:var(--studio-white);font-family:Golos,Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.about-shell{width:min(calc(100% - 64px),var(--studio-max));margin-inline:auto}
.about-header{position:fixed;z-index:20;top:18px;right:24px;left:24px;display:flex;align-items:center;justify-content:space-between;gap:24px;pointer-events:none}
.about-header>*{pointer-events:auto}
.about-wordmark{display:flex;align-items:center;gap:12px;padding:11px 16px;border:1px solid rgb(255 255 255 / .2);border-radius:999px;background:rgb(8 9 12 / .76);backdrop-filter:blur(16px);font-weight:650}
.about-wordmark img{width:20px;height:28px;object-fit:cover;object-position:left}
.about-wordmark span{display:flex;flex-direction:column;font-size:13px;line-height:1}
.about-wordmark small{margin-top:4px;font-size:7px;font-weight:400;letter-spacing:.2em}
.about-nav{display:flex;align-items:center;gap:8px;padding:7px;border:1px solid rgb(255 255 255 / .16);border-radius:999px;background:rgb(8 9 12 / .76);backdrop-filter:blur(16px)}
.about-nav a{padding:11px 17px;border-radius:999px;font-size:13px;transition:background var(--duration-base) var(--ease-swift)}
.about-nav a:hover,.about-nav a:focus-visible{background:rgb(255 255 255 / .12)}
.about-nav .about-contact{background:var(--studio-blue);color:var(--studio-white)}
.about-nav a:focus-visible,.member-card:focus-within{outline:3px solid var(--club-acid);outline-offset:3px}

.about-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:150px 0 70px;overflow:hidden;background:radial-gradient(circle at 77% 38%,color-mix(in srgb,var(--studio-blue) 56%,transparent),transparent 33%),var(--studio-ink)}
.about-hero::before,.about-hero::after{content:'';position:absolute;border:1px solid rgb(255 255 255 / .12);border-radius:50%;pointer-events:none}
.about-hero::before{width:min(67vw,920px);height:min(67vw,920px);right:-9%;top:-28%}
.about-hero::after{width:min(42vw,590px);height:min(42vw,590px);right:3%;top:-9%}
.about-hero-copy{position:relative;z-index:2}
.about-kicker{margin:0 0 30px;color:var(--club-muted-light);font-size:11px;font-weight:650;letter-spacing:.14em}
.about-hero h1{max-width:1150px;margin:0;font-size:clamp(76px,11.7vw,178px);font-weight:630;line-height:.82;letter-spacing:-.078em}
.about-hero h1 span{color:var(--studio-blue)}
.about-hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:48px;margin-top:54px}
.about-hero-bottom p{max-width:500px;margin:0;color:var(--club-muted-light);font-size:clamp(17px,1.55vw,23px);line-height:1.45}
.about-face-line{display:flex;padding-right:18px}
.about-face-line img{width:clamp(58px,7vw,96px);height:auto;aspect-ratio:1;margin-right:-18px;border:3px solid var(--studio-ink);border-radius:50%;background:var(--studio-paper);object-fit:cover}
.about-face-line img:nth-child(3){object-position:50% 22%}.about-face-line img:nth-child(4){object-position:50% 30%}

.about-manifesto{padding:var(--studio-section) 0;background:var(--studio-white);color:var(--studio-ink)}
.manifesto-grid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:var(--space-12);align-items:start}
.manifesto-grid h2{position:sticky;top:120px;margin:0;font-size:clamp(50px,6.7vw,100px);line-height:.9;letter-spacing:-.065em}
.manifesto-grid h2 span{color:var(--studio-blue)}
.manifesto-points{border-top:1px solid var(--studio-line)}
.manifesto-point{display:grid;grid-template-columns:48px 1fr;gap:var(--space-6);padding:34px 0;border-bottom:1px solid var(--studio-line)}
.manifesto-point span{color:var(--studio-muted);font-size:11px}
.manifesto-point h3{margin:0 0 14px;font-size:clamp(26px,3.2vw,48px);line-height:1;letter-spacing:-.05em}
.manifesto-point p{max-width:590px;margin:0;color:var(--studio-muted);font-size:16px;line-height:1.55}

.team-roster{padding:var(--studio-section) 0;background:var(--studio-ink)}
.roster-head{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:var(--space-12)}
.roster-head h2{margin:0;font-size:var(--studio-heading);line-height:.88;letter-spacing:-.07em}
.roster-head h2 span{color:var(--studio-blue)}
.roster-head p{max-width:390px;margin:0;color:var(--club-muted-light);font-size:17px;line-height:1.45}
.member-list{border-top:1px solid var(--club-line-light)}
.member-card{display:grid;grid-template-columns:54px minmax(220px,.7fr) minmax(240px,.55fr) minmax(300px,1fr);gap:var(--space-6);align-items:center;min-height:270px;padding:28px 0;border-bottom:1px solid var(--club-line-light)}
.member-index{align-self:start;padding-top:8px;color:var(--club-muted-light);font-size:11px;font-weight:650}
.member-card h3{margin:0;font-size:clamp(35px,4.2vw,64px);font-weight:590;line-height:.92;letter-spacing:-.06em}
.member-photo{width:100%;max-width:250px;aspect-ratio:4/4.5;margin:0;overflow:hidden;border-radius:var(--radius-club-control);background:var(--studio-paper)}
.member-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.88)}
.member-card:nth-child(1) .member-photo img{object-position:center}.member-card:nth-child(3) .member-photo img{object-position:50% 22%}.member-card:nth-child(4) .member-photo img{object-position:50% 30%}
.member-copy{align-self:center}.member-role{margin:0 0 20px;color:var(--studio-blue);font-size:12px;font-weight:650;letter-spacing:.06em}.member-copy p:last-child{max-width:500px;margin:0;color:var(--club-muted-light);font-size:15px;line-height:1.55}

.about-cta{padding:var(--studio-section) 0;background:var(--studio-blue);color:var(--studio-white)}
.about-cta-inner{display:flex;align-items:end;justify-content:space-between;gap:40px}
.about-cta h2{max-width:900px;margin:0;font-size:clamp(64px,9vw,136px);line-height:.84;letter-spacing:-.072em}
.about-cta a{flex:none;padding:18px 26px;border-radius:999px;background:var(--studio-white);color:var(--studio-ink);font-weight:650}
.about-footer{display:flex;justify-content:space-between;gap:24px;padding:28px 0;color:var(--club-muted-light);font-size:12px}

@media(max-width:900px){
 html{scroll-behavior:auto}
 .about-shell{width:min(calc(100% - 36px),var(--studio-max))}
 .about-header{top:12px;right:14px;left:14px}.about-nav a:not(.about-contact){display:none}.about-nav .about-contact{padding:10px 14px}
 .about-hero{padding:130px 0 45px}.about-hero h1{font-size:clamp(45px,14vw,70px)}.about-hero-bottom{display:block;margin-top:36px}.about-face-line{margin-top:34px;padding-left:14px}
 .manifesto-grid{grid-template-columns:1fr}.manifesto-grid h2{position:relative;top:auto;margin-bottom:30px}.manifesto-point{grid-template-columns:34px 1fr;gap:14px}
 .roster-head{display:block}.roster-head p{margin-top:25px}.member-card{grid-template-columns:30px minmax(0,1fr);gap:18px;min-height:0;padding:25px 0}.member-index{grid-row:1}.member-card h3{grid-column:2}.member-photo{grid-column:2;max-width:none;aspect-ratio:4/4.3}.member-copy{grid-column:2}
 .about-cta-inner{display:block}.about-cta a{display:inline-block;margin-top:38px}.about-footer{font-size:10px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.about-nav a{transition:none}}