@font-face{font-family:'JROH Archivo';src:url('../fonts/study/archivo.woff2?v=5545adc7') format('woff2');font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:'JROH Red Hat Mono';src:url('../fonts/study/redhatmono.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}

:root{
  --ink:#131719;
  --paper:#f6f7f5;
  --human:#ff5722;
  --tech:#3aa39f;
  --ai:#8b6bdb;
  --pad:5.5vw;
  --line:rgba(19,23,25,.18);
  --ease:cubic-bezier(.23,1,.32,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:94px}
body{margin:0;background:var(--ink);color:var(--paper);font:400 16px/1.65 'JROH Red Hat Mono',ui-monospace,'Courier New',monospace;-webkit-font-smoothing:antialiased;font-feature-settings:'liga' 1,'calt' 1;font-synthesis:none}
h1,h2,h3,.brand,.lead,.tech-manifesto{font-family:'JROH Archivo',Arial,sans-serif}
h1,h2,h3,p,figure,ol{margin:0}
a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:1px}
img{display:block;max-width:100%}
a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.skip-link{position:fixed;left:var(--pad);top:-80px;z-index:20;padding:12px 16px;background:var(--paper);color:var(--ink);transition:top 160ms var(--ease)}
.skip-link:focus{top:12px}

.site-header{position:fixed;inset:0 0 auto;z-index:10;min-height:88px;padding:18px var(--pad);display:flex;align-items:center;gap:34px;background:rgba(19,23,25,.96);color:var(--paper);transition:background 180ms var(--ease),color 180ms var(--ease)}
body.on-paper .site-header{background:rgba(246,247,245,.96);color:var(--ink)}
.brand{display:inline-flex;align-items:baseline;font-size:29px;font-weight:900;letter-spacing:-.05em;line-height:1;text-decoration:none}
.dot,.line-dot{display:inline-block;width:.2em;height:.2em;border-radius:50%;margin-left:.1em;vertical-align:0;background:var(--tech);position:relative;z-index:4}
.dot.human,.line-dot.human{background:var(--human)}
.line-dot.tech{background:var(--tech)}
.line-dot.ai{background:var(--ai)}
.brand .dot{margin-left:.06em}
.page-label{font-size:10px;letter-spacing:.12em;color:#a8b0b0}
.on-paper .page-label{color:#626969}
.about-nav{margin-left:auto;display:flex;gap:28px;font-size:13px}
.contact-link{display:inline-flex;align-items:center;gap:18px;padding:9px 19px;border:1px solid currentColor;border-radius:30px;font-size:13px;text-decoration:none}

main{position:relative;overflow:hidden}
.story-lines{position:absolute;inset:0 auto auto 0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.story-lines path{fill:none;stroke-width:1.15;vector-effect:non-scaling-stroke;opacity:.52;stroke-linecap:round;stroke-linejoin:round}
.story-lines [data-path=human]{stroke:var(--human)}
.story-lines [data-path=tech]{stroke:var(--tech)}
.story-lines [data-path=ai]{stroke:var(--ai);stroke-dasharray:5 9;opacity:.62}
.section{position:relative;z-index:1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));padding:clamp(96px,12vw,170px) var(--pad);min-height:86svh}
.section>*:not(.story-lines){position:relative;z-index:3;min-width:0}
.dark{background:var(--ink);color:var(--paper)}
.paper{background:var(--paper);color:var(--ink)}
.eyebrow{display:block;margin-bottom:26px;font-size:.6875rem;font-weight:500;line-height:1.6;letter-spacing:.1em;color:#aeb5b4}
.paper .eyebrow{color:#545c5b}

.hero{min-height:100svh;padding-top:clamp(150px,18vh,200px);padding-bottom:clamp(90px,11vh,130px);grid-template-rows:auto 1fr;column-gap:calc((100vw - 2 * var(--pad))/12);align-items:start}
.hero-name{grid-column:1/8;grid-row:1;z-index:4}
.hero-name h1{font-size:clamp(5rem,11.2vw,10.5rem);font-weight:900;line-height:.78;letter-spacing:-.065em;text-transform:uppercase}
.hero-name h1>span{display:block;width:max-content;max-width:100%}
.hero-photo{grid-column:8/13;grid-row:1/3;margin-top:8px;align-self:stretch;min-height:590px;overflow:hidden;background:#242a2c}
.hero-photo img{width:100%;height:100%;min-height:590px;object-fit:cover;object-position:49% center;filter:saturate(.72) contrast(1.02)}
.hero-photo:after{content:'';position:absolute;inset:0;border:1px solid rgba(246,247,245,.18);box-shadow:inset 0 0 0 10px rgba(19,23,25,.16);pointer-events:none}
.hero-photo .hero-tech-origin{position:absolute;left:18px;top:18px;width:16px;height:16px;margin:0;box-shadow:0 0 0 7px rgba(19,23,25,.36)}
.hero-photo figcaption{position:absolute;left:0;bottom:0;right:0;padding:16px 18px;background:rgba(19,23,25,.86);font-size:.6875rem;letter-spacing:.04em;color:#d0d5d4}
.hero-intro{grid-column:1/6;grid-row:2;align-self:end;padding-top:70px;max-width:540px}
.hero-intro .lead{font-size:clamp(1.7rem,2.2vw,2.5rem);font-weight:500;letter-spacing:-.025em;line-height:1.08;text-wrap:balance}
.hero-intro>p:not(.lead){margin-top:22px;color:#c4cac9;max-width:49ch}
.round-link{display:inline-flex;align-items:center;gap:16px;margin-top:32px;font-size:.8125rem;text-decoration:none}
.round-link>span{display:grid;place-items:center;width:42px;height:42px;border:1px solid #8c9493;border-radius:50%;transition:transform 180ms var(--ease)}
.hero-side{grid-column:6/8;grid-row:2;align-self:end;justify-self:end;text-align:right;font-size:.6875rem;line-height:1.6;letter-spacing:.1em;color:#aeb5b4}
.line-label{color:var(--paper)}

.chapter-copy{grid-column:1/7;max-width:760px}
.chapter-copy h2,.intersection-heading h2,.current-heading h2,.approach-heading h2{font-size:clamp(3rem,6.1vw,6.6rem);font-weight:900;line-height:.88;letter-spacing:-.048em;text-transform:uppercase;text-wrap:balance}
.chapter-copy .question{margin-top:38px;font-family:'JROH Archivo',Arial,sans-serif;font-size:clamp(1.5rem,2.3vw,2.25rem);line-height:1.15;letter-spacing:-.02em;max-width:23ch;text-wrap:balance}
.chapter-copy>p:not(.question){margin-top:24px;max-width:58ch;color:#4e5756}
.dark .chapter-copy>p:not(.question){color:#bfc6c5}
.origin{align-items:start}
.origin .margin-note{grid-column:10/13;align-self:end;padding:22px 0;border-top:1px solid var(--line)}
.note-index{font-size:.6875rem;letter-spacing:.1em;color:var(--human)}
.margin-note p{margin-top:14px;font-size:1.05rem;line-height:1.5;max-width:27ch}

.technology{min-height:100svh;align-items:center}
.technology .offset-right{grid-column:7/13}
.tech-manifesto{grid-column:1/6;grid-row:1;align-self:center;font-size:clamp(1.8rem,3.2vw,3.6rem);font-weight:900;line-height:1;letter-spacing:-.035em;text-transform:uppercase}
.tech-manifesto span{display:block;padding:22px 0;border-top:1px solid rgba(246,247,245,.16)}
.tech-manifesto span:last-child{border-bottom:1px solid rgba(246,247,245,.16)}
.tech-manifesto span:nth-child(2){transform:translateX(10%);color:var(--tech)}
.tech-manifesto span:nth-child(3){transform:translateX(20%)}

.intersection{min-height:110svh;align-items:start;row-gap:74px}
.intersection-heading{grid-column:1/9}
.intersection-heading h2{max-width:10ch}
.question-block{padding-top:24px;border-top:1px solid var(--line)}
.question-block .question-number{display:block;margin-bottom:28px;font-size:.6875rem;letter-spacing:.1em;color:#596160}
.question-block h3{font-size:clamp(1.8rem,3vw,3rem);font-weight:500;line-height:1.08;letter-spacing:-.03em;max-width:14ch;text-wrap:balance}
.question-block p{margin-top:20px;max-width:38ch;color:#505857}
.for-people{grid-column:1/6}
.with-people{grid-column:8/13;margin-top:120px}
.intersection-note{grid-column:3/9;margin-top:80px;font-family:'JROH Archivo',Arial,sans-serif;font-size:clamp(1.4rem,2.3vw,2.1rem);line-height:1.22;letter-spacing:-.02em;max-width:30ch;text-wrap:balance}
.intersection-note .line-dot{margin:0 .55em 0 0}
.intersection-tech{grid-column:10;align-self:end;justify-self:center;margin-top:140px}
.nowrap{white-space:nowrap}

.current{min-height:100svh;row-gap:80px}
.current-heading{grid-column:1/10}
.current-heading h2{max-width:11ch}
.practice-list{grid-column:1/13}
.practice-item{display:grid;grid-template-columns:1fr 4fr 4fr 2fr;gap:28px;align-items:baseline;padding:34px 0;border-top:1px solid rgba(246,247,245,.17)}
.practice-item:last-child{border-bottom:1px solid rgba(246,247,245,.17)}
.practice-index{font-size:.6875rem;letter-spacing:.1em;color:#9ca4a3}
.practice-item h3{font-size:clamp(2.7rem,5.5vw,6rem);font-weight:900;line-height:.86;letter-spacing:-.05em}
.practice-item p{max-width:39ch;color:#bbc2c1}
.practice-item a{justify-self:end;font-size:.8125rem}

.approach{min-height:100svh;row-gap:72px}
.approach-heading{grid-column:1/7}
.approach-heading p{margin-top:28px;font-family:'JROH Archivo',Arial,sans-serif;font-size:1.5rem;line-height:1.2;max-width:24ch}
.principles{grid-column:8/13;list-style:none;padding:0}
.principles li{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:23px 0;border-top:1px solid var(--line)}
.principles li:last-child{border-bottom:1px solid var(--line)}
.principles li>span{font-size:.6875rem;letter-spacing:.1em;color:#697170}
.principles h3{font-size:1.12rem;line-height:1.2;letter-spacing:-.015em}
.principles p{margin-top:8px;color:#505857;max-width:41ch}
.credentials{max-width:510px;margin-top:clamp(46px,6vw,78px);padding-top:22px;border-top:1px solid var(--line)}
.credentials .eyebrow{margin:0 0 16px;color:#697170}
.credentials ul{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.credentials li{display:grid;grid-template-columns:50px 1fr;gap:14px;align-items:baseline}
.credentials strong{font-size:.6875rem;letter-spacing:.08em;color:var(--human)}
.credentials li span{font-family:'JROH Archivo',Arial,sans-serif;font-size:1rem;line-height:1.25;letter-spacing:-.01em}

.closing{min-height:90svh;align-items:center;text-align:center}
.closing-copy{grid-column:1/13}
.closing-copy h2{font-family:'JROH Archivo',Arial,sans-serif;font-size:clamp(3rem,7.2vw,7.5rem);font-weight:900;line-height:.88;letter-spacing:-.05em;text-transform:uppercase}
.closing-copy h2>span{display:block;width:max-content;max-width:100%;margin:0 auto}
.closing-copy p:not(.socials){max-width:50ch;margin:28px auto 0;color:#bec5c4}
.email-link{display:inline-flex;align-items:center;gap:30px;margin-top:36px;padding:14px 25px;border:1px solid currentColor;border-radius:40px;text-decoration:none}
.socials{margin-top:44px;font-size:.8125rem;color:#aab2b1}
.motion-toggle{position:fixed;right:var(--pad);bottom:20px;z-index:11;padding:8px 12px;border:1px solid rgba(246,247,245,.32);border-radius:20px;background:var(--ink);color:var(--paper);font:400 .6875rem/1.5 'JROH Red Hat Mono',monospace;cursor:pointer}
body.on-paper .motion-toggle{background:var(--paper);color:var(--ink);border-color:rgba(19,23,25,.32)}

@media(hover:hover) and (pointer:fine){
  .contact-link:hover,.email-link:hover{background:var(--paper);color:var(--ink)}
  .on-paper .contact-link:hover{background:var(--ink);color:var(--paper)}
  .round-link:hover>span{transform:translateY(4px)}
  .practice-item a:hover,.about-nav a:hover,.socials a:hover{text-decoration-thickness:2px}
}

@media(max-width:1000px){
  :root{--pad:7vw}
  html{scroll-padding-top:78px}
  .site-header{min-height:72px;padding-block:14px;gap:18px}.brand{font-size:24px}.page-label{display:none}.about-nav{margin-left:auto}.contact-link{padding:8px 13px}
  .section{display:block;min-height:auto;padding-top:100px;padding-bottom:100px}
  .hero{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 28px;padding-top:130px}
  .hero-name{grid-column:1/3}.hero-name h1{font-size:clamp(5rem,17vw,8rem)}
  .hero-photo{grid-column:2;grid-row:2;margin:0;min-height:430px}.hero-photo img{min-height:430px}
  .hero-intro{grid-column:1;grid-row:2;align-self:end;padding:0}.hero-side{display:none}
  .chapter-copy,.technology .offset-right,.intersection-heading,.current-heading,.approach-heading{width:100%;max-width:760px}
  .chapter-copy h2,.intersection-heading h2,.current-heading h2,.approach-heading h2{font-size:clamp(3rem,10vw,5.4rem)}
  .origin .margin-note{width:44%;margin:80px 0 0 auto}
  .tech-manifesto{width:70%;margin:0 0 90px}.tech-manifesto span:nth-child(2),.tech-manifesto span:nth-child(3){transform:none}
  .technology .offset-right{margin-left:auto;width:82%}
  .intersection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:60px 36px}
  .intersection-heading{grid-column:1/3}.for-people{grid-column:1}.with-people{grid-column:2;margin-top:90px}.intersection-note{grid-column:1/3;width:72%;margin:90px auto 0}.intersection-tech{display:none}
  .current{display:block}.practice-list{margin-top:70px}
  .practice-item{grid-template-columns:45px 2fr 3fr;gap:20px}.practice-item a{grid-column:2/4;justify-self:start;margin-top:0}
  .approach{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:70px 40px}.approach-heading{grid-column:1}.principles{grid-column:2}
}

@media(max-width:700px){
  .site-header{gap:12px}.about-nav a:not(:first-child){display:none}.about-nav{font-size:.75rem}.contact-link span{display:none}
  .hero{display:block;min-height:auto}.hero-photo{margin-top:54px;min-height:420px}.hero-photo img{min-height:420px}.hero-intro{margin-top:52px}.hero-name h1{font-size:clamp(4.4rem,24vw,7rem)}
  .section{padding-top:84px;padding-bottom:84px}
  .chapter-copy h2,.intersection-heading h2,.current-heading h2,.approach-heading h2{font-size:clamp(2.45rem,13vw,4.4rem)}
  .chapter-copy .question{margin-top:30px}
  .origin .margin-note,.technology .offset-right,.tech-manifesto{width:100%;margin-left:0}
  .tech-manifesto{margin-bottom:70px;font-size:clamp(1.55rem,8vw,2.6rem)}
  .intersection{display:block}.question-block{margin-top:62px}.with-people{margin-top:100px}.intersection-note{width:100%;margin:100px 0 0}
  .current-heading h2{max-width:none}.practice-list{margin-top:60px}.practice-item{display:block;padding:30px 0}.practice-item h3{margin-top:12px;font-size:clamp(3rem,17vw,5rem)}.practice-item p{margin-top:20px}.practice-item a{display:inline-block;margin-top:20px}
  .approach{display:block}.principles{margin-top:60px}.credentials{margin-top:52px}
  .closing-copy h2>span{width:auto}.closing-copy h2>span+span{margin-top:12px}.socials{line-height:2}
  .motion-toggle{right:14px;bottom:12px}
}

html[data-reduced]{scroll-behavior:auto}
html[data-reduced] .round-link>span{transition:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.round-link>span{transition:none}}