@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root { --night:#102b2f; --deep:#0b2024; --cream:#e8e2d2; --acid:#d6e958; --coral:#ef7659; --line:rgba(232,226,210,.27); --sans:'Space Grotesk',sans-serif; --display:'Bebas Neue',Impact,sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--night); color:var(--cream); font:14px/1.5 var(--sans); } a { color:inherit; text-decoration:none; }
.back-link { position:fixed; z-index:20; top:0; left:0; padding:8px 14px; background:var(--acid); color:var(--deep); font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.site-header { position:relative; z-index:5; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:30px; padding:28px 5vw 24px; border-bottom:1px solid var(--line); }.brand { display:flex; align-items:center; gap:13px; font-size:12px; line-height:.92; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }.brand-symbol { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--acid); color:var(--acid); font-size:11px; }.header-note { margin:0; font-size:10px; line-height:1.35; text-align:center; text-transform:uppercase; letter-spacing:.1em; color:rgba(232,226,210,.65); }.menu-toggle { justify-self:end; border:0; background:transparent; color:var(--cream); font:600 11px var(--sans); text-transform:uppercase; letter-spacing:.12em; cursor:pointer; }.menu-toggle span { display:inline-block; margin-left:8px; color:var(--acid); font-size:18px; line-height:0; }.site-nav { position:absolute; top:82px; right:5vw; display:none; flex-direction:column; gap:14px; min-width:170px; padding:18px; background:var(--acid); color:var(--deep); }.site-nav.is-open { display:flex; }.site-nav a { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; }
.hero-section { min-height:calc(100vh - 91px); padding:44px 5vw 25px; display:flex; flex-direction:column; }.hero-meta,.hero-footer { display:flex; justify-content:space-between; color:rgba(232,226,210,.62); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }.hero-grid { flex:1; display:grid; grid-template-columns:minmax(300px,.9fr) minmax(380px,1.1fr); align-items:center; gap:7vw; max-width:1380px; width:100%; margin:0 auto; }.kicker { margin:0 0 24px; color:var(--acid); font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }.hero-copy h1,.section-heading h2,.method-copy h2,.journal-header h2,.site-footer h2 { margin:0; font:normal clamp(96px,14vw,214px)/.72 var(--display); letter-spacing:.015em; text-transform:uppercase; }.hero-copy h1 i,.section-heading h2 i,.method-copy h2 i { color:var(--coral); font-style:normal; }.hero-copy h1 span,.site-footer h2 span { color:var(--acid); }.hero-intro { max-width:330px; margin:48px 0 28px; color:rgba(232,226,210,.78); font-size:14px; }.arrow-link { display:inline-flex; gap:22px; align-items:center; color:var(--acid); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.arrow-link span { font-size:22px; }
.hero-diagram { position:relative; min-height:500px; border-left:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; background:var(--deep); }.hero-diagram:before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 49.8%,rgba(232,226,210,.08) 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,rgba(232,226,210,.08) 50%,transparent 50.2%); background-size:84px 84px; }.diagram-ring { position:absolute; border:1px solid var(--coral); border-radius:50%; aspect-ratio:1; }.ring-a { width:74%; top:9%; left:13%; }.ring-b { width:48%; top:22%; left:26%; border-color:var(--acid); }.ring-c { width:22%; top:35%; left:39%; }.diagram-line { position:absolute; height:1px; width:84%; top:51%; left:8%; background:var(--acid); transform-origin:left center; }.line-a { transform:rotate(-28deg); }.line-b { width:80%; top:52%; left:9%; transform:rotate(35deg); background:var(--coral); }.diagram-node { position:absolute; top:49%; left:49%; width:12px; height:12px; background:var(--acid); }.diagram-label { position:absolute; z-index:2; color:rgba(232,226,210,.72); font-size:10px; line-height:1.3; letter-spacing:.08em; text-transform:uppercase; }.label-a { top:8%; left:7%; }.label-b { right:7%; bottom:8%; text-align:right; }.hero-footer { padding-top:20px; border-top:1px solid var(--line); }
section:not(.hero-section),.site-footer { padding:120px 10vw; border-top:1px solid var(--line); }.section-marker { margin-bottom:60px; color:var(--acid); font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:75px; }.section-heading h2 { font-size:clamp(72px,11vw,174px); max-width:740px; }.section-heading .kicker { margin-bottom:10px; }.project-list { border-top:1px solid var(--line); }.project-row { display:grid; grid-template-columns:7% 1.5fr 1fr 1fr 30px; gap:20px; align-items:center; min-height:92px; border-bottom:1px solid var(--line); transition:background .2s,color .2s; }.project-row:hover { padding-left:16px; background:var(--acid); color:var(--deep); }.project-number,.project-place,.project-type { color:rgba(232,226,210,.58); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }.project-row:hover .project-place,.project-row:hover .project-type { color:var(--deep); }.project-name { font-size:clamp(19px,2.5vw,34px); }.project-arrow { color:var(--coral); font-size:22px; }
.method-section { display:grid; grid-template-columns:1fr 1fr; gap:8vw; background:var(--coral); color:var(--deep); }.method-section .section-marker,.method-copy .kicker { color:var(--deep); }.method-section .section-marker { grid-column:1/-1; }.method-copy h2 { font-size:clamp(80px,12vw,175px); }.method-copy h2 i { color:var(--cream); }.method-copy>p:last-child { max-width:380px; margin:50px 0 0; font-size:16px; }.method-notes { align-self:end; border-top:1px solid rgba(11,32,36,.4); }.method-notes div { display:flex; justify-content:space-between; gap:20px; padding:22px 0; border-bottom:1px solid rgba(11,32,36,.4); font-size:17px; }.method-notes strong { font-size:11px; }.journal-section { background:var(--deep); }.journal-header { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:70px; }.journal-header h2 { font-size:clamp(70px,9vw,140px); color:var(--acid); }.journal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); }.journal-grid article { min-height:260px; padding:24px; display:flex; flex-direction:column; justify-content:space-between; background:var(--deep); }.journal-grid span { color:rgba(232,226,210,.58); font-size:10px; text-transform:uppercase; letter-spacing:.1em; }.journal-grid h3 { max-width:220px; margin:30px 0; font-size:24px; font-weight:500; line-height:1.08; }.journal-grid a { color:var(--coral); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.site-footer { display:grid; grid-template-columns:1.4fr 1fr auto; align-items:end; gap:40px; background:var(--acid); color:var(--deep); }.site-footer .kicker { color:var(--deep); }.site-footer h2 { font-size:clamp(80px,11vw,160px); }.footer-contact { padding-bottom:6px; }.footer-contact a { font-size:18px; text-decoration:underline; text-underline-offset:5px; }.footer-contact p { margin:34px 0 0; font-size:12px; line-height:1.6; }.footer-end { align-self:start; margin:0; font-size:11px; font-weight:700; text-align:right; text-transform:uppercase; }.footer-end span { font-weight:400; }
@media (max-width:800px) { .site-header { grid-template-columns:1fr auto; padding:24px 6vw 20px; }.header-note { display:none; }.site-nav { right:6vw; top:70px; }.hero-section { padding:32px 6vw 22px; min-height:0; }.hero-grid { display:block; }.hero-copy { padding:65px 0 70px; }.hero-copy h1 { font-size:clamp(90px,25vw,170px); }.hero-intro { margin-top:38px; }.hero-diagram { min-height:310px; }.hero-footer span:nth-child(2) { display:none; } section:not(.hero-section),.site-footer { padding:80px 6vw; }.section-heading,.journal-header { display:block; margin-bottom:50px; }.section-heading h2,.method-copy h2 { font-size:clamp(76px,22vw,150px); }.project-row { grid-template-columns:32px 1fr 28px; gap:8px; padding:17px 0; }.project-place,.project-type { grid-column:2; }.project-type { grid-row:3; }.project-arrow { grid-column:3; grid-row:1 / span 2; }.method-section { display:block; }.method-section .section-marker { margin-bottom:55px; }.method-notes { margin-top:65px; }.journal-grid { display:block; background:none; }.journal-grid article { min-height:190px; margin-bottom:1px; }.site-footer { display:block; }.footer-contact { margin-top:55px; }.footer-end { margin-top:55px; text-align:left; } }