@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-ext-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-400-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-ext-400-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-ext-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-500-italic.woff2) format('woff2');font-weight:500;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Newsreader';src:url(../fonts/newsreader-latin-ext-500-italic.woff2) format('woff2');font-weight:500;font-style:italic;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';src:url(../fonts/hanken-grotesk-latin-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hanken Grotesk';src:url(../fonts/hanken-grotesk-latin-ext-400-normal.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';src:url(../fonts/hanken-grotesk-latin-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hanken Grotesk';src:url(../fonts/hanken-grotesk-latin-ext-500-normal.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';src:url(../fonts/hanken-grotesk-latin-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Hanken Grotesk';src:url(../fonts/hanken-grotesk-latin-ext-600-normal.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
 --paper:#F3F5F3;--paper-2:#E8EDEB;--ink:#10262C;--muted:#5A6A6E;--line:#D3DCDA;
 --sea:#1D6A70;--sea-soft:#DDE9E7;
 --serif:'Newsreader',Georgia,'Times New Roman',serif;
 --sans:'Hanken Grotesk',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
 --measure:62ch;--gut:clamp(20px,5vw,64px);--ease:cubic-bezier(.22,.61,.36,1);
 color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
 --paper:#0D1B1F;--paper-2:#132529;--ink:#E6EDEC;--muted:#9AAEB0;--line:#223A3F;--sea:#79C4C1;--sea-soft:#16302F;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#0D1B1F;--paper-2:#132529;--ink:#E6EDEC;--muted:#9AAEB0;--line:#223A3F;--sea:#79C4C1;--sea-soft:#16302F;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.65 var(--sans);font-feature-settings:"ss01";-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding-inline:var(--gut)}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:var(--ink);color:var(--paper);padding:8px 12px;z-index:9}
:focus-visible{outline:2px solid var(--sea);outline-offset:3px;border-radius:2px}

/* header */
header.site{padding-block:28px}
header.site .wrap{display:flex;justify-content:space-between;align-items:baseline;gap:24px;flex-wrap:wrap}
.brand{font:500 20px/1 var(--serif);text-decoration:none;letter-spacing:-.01em}
nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
nav a,.u{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .35s var(--ease);padding-bottom:2px}
nav a:hover,.u:hover,nav a[aria-current]{background-size:100% 1px}
nav a{font-size:16px;color:var(--muted)}nav a:hover,nav a[aria-current]{color:var(--ink)}

/* type */
.label{font:500 13px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;text-wrap:balance;margin:0}
h1{font-size:clamp(40px,6.2vw,76px);line-height:1.04}
h2{font-size:clamp(30px,3.6vw,44px);line-height:1.1}
h3{font-size:24px;line-height:1.25}
em{font-style:italic;color:var(--sea)}
p{margin:0;max-width:var(--measure)}
.lede{font-size:clamp(19px,1.7vw,22px);line-height:1.55}
.muted{color:var(--muted)}
.small{font-size:15px}

/* wave signature */
.wave{display:block;width:clamp(150px,20vw,230px);height:auto;color:var(--sea);margin-top:22px}
.wave path{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:420;stroke-dashoffset:0;animation:draw 1.8s .25s var(--ease) both}
@keyframes draw{from{stroke-dashoffset:420}to{stroke-dashoffset:0}}

/* intro */
.intro{padding-block:clamp(56px,10vw,128px) clamp(48px,7vw,96px);display:grid;gap:28px}
.intro .lede{max-width:40ch}
.rise{animation:rise .9s var(--ease) both}.rise.d1{animation-delay:.1s}.rise.d2{animation-delay:.2s}.rise.d3{animation-delay:.3s}
@keyframes rise{from{opacity:.001;transform:translateY(14px)}to{opacity:1;transform:none}}

section{padding-block:clamp(48px,7vw,88px);border-top:1px solid var(--line)}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:32px;flex-wrap:wrap}

/* work list */
.works{list-style:none;margin:0;padding:0}
.works li{border-bottom:1px solid var(--line)}
.works li:first-child{border-top:1px solid var(--line)}
.works a{display:grid;grid-template-columns:110px 1fr auto;gap:8px 32px;align-items:baseline;padding:26px 0;text-decoration:none;position:relative}
.works .yr{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums}
.works .ti{font:400 clamp(22px,2.4vw,30px)/1.2 var(--serif);transition:transform .45s var(--ease),color .3s}
.works .cl{display:block;font:500 13px/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.works .rs{font-size:15px;color:var(--muted);text-align:right;white-space:nowrap}
.works .ar{display:inline-block;transition:transform .45s var(--ease)}
.works a:hover .ti{transform:translateX(8px);color:var(--sea)}
.works a:hover .ar{transform:translateX(4px)}
.peek{position:fixed;left:0;top:0;width:300px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.92);transition:opacity .25s,transform .35s var(--ease);z-index:5;box-shadow:0 18px 40px rgba(10,30,35,.18);background:var(--paper-2)}
.peek.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.peek img{width:100%;height:100%;object-fit:cover}
@media (hover:none),(max-width:760px){.peek{display:none}}
@media (max-width:760px){.works a{grid-template-columns:1fr}.works .rs{text-align:left;white-space:normal}}

/* two col text */
.two{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px)}
.two .body{display:grid;gap:18px}
@media (max-width:820px){.two{grid-template-columns:1fr}}
.inline-list{display:flex;flex-wrap:wrap;gap:6px 0;list-style:none;padding:0;margin:0;color:var(--muted)}
.inline-list li:not(:last-child)::after{content:"·";margin-inline:12px;color:var(--line)}

/* about */
.cv{list-style:none;margin:0;padding:0}
.cv li{display:grid;grid-template-columns:130px 1fr;gap:4px 28px;padding:18px 0;border-bottom:1px solid var(--line)}
.cv .y{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums;padding-top:3px}
.cv b{font-weight:500;display:block}
.cv span{color:var(--muted);font-size:16px}
@media (max-width:600px){.cv li{grid-template-columns:1fr}}
.portrait{width:clamp(140px,18vw,200px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--paper-2)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.trio figure{margin:0;display:grid;gap:12px}
.trio .ph{aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:var(--paper-2)}
.trio img{width:100%;height:100%;object-fit:cover}
.trio figcaption{font-size:16px;color:var(--muted)}.trio figcaption b{color:var(--ink);font-weight:500;display:block}
@media (max-width:760px){.trio{grid-template-columns:1fr}}

/* case */
.back{font-size:15px;color:var(--muted)}
.case-head{padding-block:clamp(40px,7vw,88px) clamp(32px,5vw,56px);display:grid;gap:22px}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 40px;margin:12px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.facts dt{font:500 12px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.facts dd{margin:0;font-size:16px;line-height:1.5}
@media (max-width:760px){.facts{grid-template-columns:1fr}}
.figure{border-radius:12px;overflow:hidden;background:var(--paper-2);aspect-ratio:16/10;margin-bottom:clamp(40px,6vw,72px)}
.figure img{width:100%;height:100%;object-fit:cover}
.evo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:32px}
.evo figure{margin:0}.evo .ph{aspect-ratio:3/4;border-radius:8px;overflow:hidden;background:var(--paper-2)}
.evo img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.evo figcaption{font-size:15px;color:var(--muted);margin-top:10px}.evo figcaption b{color:var(--ink);font-weight:500}
@media (max-width:760px){.evo{grid-template-columns:repeat(2,minmax(0,1fr))}}
.nums{list-style:none;margin:0;padding:0;display:grid;gap:0}
.nums li{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:24px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line)}
.nums b{font:400 clamp(30px,3.4vw,42px)/1 var(--serif);color:var(--sea);font-variant-numeric:lining-nums}
.nums span{color:var(--muted)}
.award{font-family:var(--serif);font-style:italic;font-size:21px}
.next{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:baseline}
.next a{font:400 clamp(26px,3vw,36px)/1.2 var(--serif);text-decoration:none}

/* footer */
footer{padding-block:clamp(64px,9vw,120px) 40px;border-top:1px solid var(--line)}
footer h2{font-size:clamp(40px,6vw,72px)}
footer .mail{font:400 clamp(20px,2.4vw,28px)/1.3 var(--serif);text-decoration:none;color:var(--sea)}
footer .row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:56px;font-size:15px;color:var(--muted)}
footer .links{display:flex;gap:24px}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media print{.peek,nav{display:none}}
h1 em{white-space:nowrap}
.talk{text-decoration:none;color:var(--ink);background:linear-gradient(var(--sea),var(--sea)) 0 100%/0 2px no-repeat;transition:background-size .45s var(--ease),color .3s}
.talk:hover{color:var(--sea);background-size:100% 2px}
.talk .ar{display:inline-block;transition:transform .45s var(--ease)}
.talk:hover .ar{transform:translateX(10px)}

.quad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.quad figure{margin:0;display:grid;gap:12px;align-content:start}
.quad .ph{aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:var(--paper-2)}
.quad img{width:100%;height:100%;object-fit:cover}
.quad figcaption{font-size:15px;line-height:1.5;color:var(--muted)}.quad figcaption b{color:var(--ink);font-weight:500;display:block;font-size:16px}
@media (max-width:900px){.quad{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.quad{grid-template-columns:1fr}}
.tline{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;position:relative}
.tline::before{content:"";position:absolute;left:0;right:0;top:11px;height:1px;background:var(--line)}
.tline li{position:relative;display:grid;gap:12px;align-content:start}
.tline .yr{position:relative;display:inline-flex;align-items:center;gap:10px;font:500 15px/22px var(--sans);font-variant-numeric:tabular-nums;background:var(--paper);padding-right:10px;width:max-content}
.tline .yr::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--sea)}
.tline .ph{aspect-ratio:3/4;border-radius:8px;overflow:hidden;background:var(--paper-2)}
.tline img{width:100%;height:100%;object-fit:cover}
.tline p{font-size:15px;color:var(--muted);line-height:1.45}
@media (max-width:760px){.tline{grid-template-columns:repeat(2,minmax(0,1fr))}.tline::before{display:none}}
.steps{list-style:none;counter-reset:s;margin:10px 0 0;padding:0;display:grid}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;column-gap:8px;padding:14px 0;border-top:1px solid var(--line)}
.steps li::before{content:counter(s,decimal-leading-zero);grid-row:span 2;font:400 15px/1.6 var(--sans);color:var(--sea);font-variant-numeric:tabular-nums}
.steps b{font-weight:500}.steps span{color:var(--muted);font-size:16px}
