:root { --paper:#f5f0e7; --paper-deep:#ede5d9; --ink:#12213a; --cobalt:#2654cf; --line:rgba(18,33,58,.22); --serif:"Source Serif 4", Georgia, serif; --sans:"DM Sans", Arial, sans-serif; --mono:"DM Mono", monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.5 var(--sans); }
a { color:inherit; text-decoration:none; }
.skip-link { position:absolute; transform:translateY(-120%); padding:8px 12px; background:var(--ink); color:var(--paper); z-index:5; }.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:2; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:20px 5vw; background:rgba(245,240,231,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.wordmark { font:500 19px var(--mono); letter-spacing:-.1em; }.wordmark span { color:var(--cobalt); }.site-header nav { display:flex; gap:22px; font-size:14px; }.site-header nav a:hover, .contact-link:hover { color:var(--cobalt); }.contact-link { justify-self:end; font-size:14px; }.contact-link span { color:var(--cobalt); }
.hero, .statement, .research-feature, .projects, .writing, .contact { padding:clamp(72px,10vw,150px) 5vw; }.hero { min-height:calc(100vh - 70px); display:flex; flex-direction:column; justify-content:space-between; }.eyebrow, .section-label, .feature-meta, .publication p, .project-number { font:500 11px/1.2 var(--mono); letter-spacing:.08em; text-transform:uppercase; }.hero h1 { max-width:1000px; margin:38px 0; font:600 clamp(58px,9.5vw,150px)/.88 var(--serif); letter-spacing:-.065em; }.hero h1 em { color:var(--cobalt); font-weight:500; }.hero-bottom { display:flex; align-items:end; justify-content:space-between; gap:32px; }.hero-bottom p { max-width:445px; margin:0; font:500 clamp(19px,2vw,27px)/1.23 var(--serif); }.round-link { flex:none; display:grid; place-items:center; width:60px; height:60px; border:1px solid var(--ink); border-radius:50%; font-size:27px; transition:.25s; }.round-link:hover { background:var(--cobalt); color:white; border-color:var(--cobalt); }
.statement { display:grid; grid-template-columns:25% 1fr; gap:25px; background:var(--ink); color:var(--paper); }.statement h2, .projects h2, .writing h2, .contact h2 { margin:0 0 28px; font:600 clamp(46px,6.1vw,94px)/.91 var(--serif); letter-spacing:-.055em; }.large-copy { max-width:710px; margin:0; font:400 clamp(23px,2.8vw,39px)/1.15 var(--serif); }.chips, .methods { display:flex; flex-wrap:wrap; gap:9px; }.chips { margin-top:48px; }.chips span { padding:7px 10px; border:1px solid rgba(245,240,231,.45); border-radius:99px; font-size:13px; }
.research-feature { background:var(--paper-deep); }.feature-head { display:flex; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:17px; }.feature-meta { margin:0; opacity:.7; }.feature-grid { display:grid; grid-template-columns:minmax(40%, .75fr) minmax(50%, 1.25fr); gap:clamp(40px,8vw,120px); padding:clamp(45px,8vw,110px) 0; }.edition-mark { position:relative; min-height:230px; overflow:hidden; }.feature-copy h2 { max-width:700px; margin:10px 0 25px; font:600 clamp(39px,5.2vw,74px)/.94 var(--serif); letter-spacing:-.055em; }.feature-copy > p:not(.eyebrow) { max-width:670px; font-size:18px; }.cobalt { color:var(--cobalt); }.button { display:inline-flex; gap:22px; align-items:center; margin-top:22px; padding:12px 17px; color:white; background:var(--cobalt); font-size:14px; font-weight:600; transition:.2s; }.button:hover { transform:translateY(-3px); box-shadow:4px 4px 0 var(--ink); }.methods { border-top:1px solid var(--line); padding-top:17px; font:11px var(--mono); text-transform:uppercase; letter-spacing:.06em; }.methods span:not(:last-child)::after { content:" /"; opacity:.5; margin-left:12px; }
.projects { background:var(--paper); }.projects-heading { display:grid; grid-template-columns:25% 1fr; margin-bottom:65px; }.projects-heading h2 { margin:0; }.project-list { border-top:1px solid var(--line); }.project-list article { display:grid; grid-template-columns:25% 1fr auto; gap:20px; padding:30px 0; border-bottom:1px solid var(--line); }.project-list h3 { margin:0 0 6px; font:600 27px/1.1 var(--serif); }.project-list p:not(.project-number) { max-width:550px; margin:0; }.project-list article > a, .quiet-mark { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--line); border-radius:50%; font-size:17px; }.project-list article > a:hover { color:white; background:var(--cobalt); border-color:var(--cobalt); }
.writing { background:var(--ink); color:var(--paper); }.writing-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin:40px 0 60px; }.writing-heading h2 { margin:0; }.writing-heading p { max-width:300px; margin:0 0 8px; }.publication-grid { display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid rgba(245,240,231,.35); }.publication { display:block; padding:28px; border-bottom:1px solid rgba(245,240,231,.35); }.main-pub { min-height:330px; background:var(--cobalt); color:white; }.publication h3 { margin:35px 0; font:500 clamp(25px,2.4vw,38px)/1.05 var(--serif); }.publication span { font-size:14px; }.publication b { margin-left:8px; }.publication-list { border-left:1px solid rgba(245,240,231,.35); }.publication-list .publication, .publication-list a { display:block; padding:22px 28px; border-bottom:1px solid rgba(245,240,231,.35); }.publication-list article, .publication-list > :first-child { padding:22px 28px; border-bottom:1px solid rgba(245,240,231,.35); }.publication-list h3 { margin:11px 0 17px; font-size:22px; }.publication-list a:hover { background:rgba(245,240,231,.08); }
.contact { min-height:70vh; display:flex; flex-direction:column; background:var(--paper-deep); }.contact h2 { margin-top:42px; }.email { align-self:flex-start; margin-top:auto; padding-bottom:5px; border-bottom:2px solid var(--cobalt); color:var(--cobalt); font:500 clamp(22px,3vw,43px) var(--serif); }.social-links { display:flex; flex-wrap:wrap; gap:9px; margin-top:25px; }.social-links a { display:inline-flex; align-items:center; gap:8px; padding:8px 11px; border:1px solid var(--line); border-radius:99px; font-size:13px; transition:.2s; }.social-links a:hover { color:var(--paper); background:var(--ink); border-color:var(--ink); }.social-links svg { width:17px; height:17px; }.footer-note { margin:38px 0 0; font:11px var(--mono); text-transform:uppercase; letter-spacing:.08em; } footer { padding:22px 5vw; color:var(--paper); background:var(--ink); font:11px var(--mono); }
@media (max-width:700px) { .site-header { grid-template-columns:1fr auto; }.site-header nav { display:none; }.hero { min-height:720px; }.hero-bottom, .writing-heading { align-items:start; flex-direction:column; }.statement, .projects-heading { grid-template-columns:1fr; }.statement { gap:36px; }.feature-grid, .publication-grid { grid-template-columns:1fr; }.edition-mark { min-height:230px;}.publication-list { border-left:0; border-top:1px solid rgba(245,240,231,.35); }.project-list article { grid-template-columns:45px 1fr auto; }.project-list h3 { font-size:22px; }.methods { gap:10px; }.methods span::after { display:none; } }