:root { --ink:#11110f; --paper:#eeece5; --lime:#d8f254; --line:rgba(17,17,15,.24); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.noise { pointer-events:none; position:fixed; inset:0; z-index:4; opacity:.055; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
.site-header { height:80px; display:flex; align-items:center; justify-content:space-between; padding:0 4.2vw; border-bottom:1px solid var(--line); position:relative; z-index:5; }
.brand { display:flex; align-items:center; gap:10px; font-size:20px; font-weight:800; letter-spacing:-.8px; }.brand img { width:28px; height:28px; }.dot { color:#e54922; }
.nav { display:flex; align-items:center; gap:28px; font:500 11px/1 'DM Mono',monospace; text-transform:uppercase; }.nav a { transition:opacity .2s; }.nav a:hover { opacity:.5; }.nav i,.project a i { font-style:normal; color:#e54922; }
.menu-button { display:none; border:0; background:none; font:500 11px 'DM Mono',monospace; text-transform:uppercase; padding:6px 0; }
.hero { min-height:calc(100vh - 80px); padding:42px 4.2vw 35px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; }
.eyebrow { margin:0; font:500 10px/1.35 'DM Mono',monospace; letter-spacing:.02em; text-transform:uppercase; }.eyebrow span { color:#e54922; margin-left:7px; }
.hero-grid { display:grid; grid-template-columns:1.25fr .75fr; align-items:center; }
.hero-title { margin:42px 0 22px; font-size:clamp(4.2rem,9.5vw,10.2rem); line-height:.84; letter-spacing:-.085em; font-weight:700; }.hero-title em,.contact h2 em,.about-copy em { font-family:'Playfair Display',serif; font-weight:500; letter-spacing:-.09em; }
.hero-orbit { justify-self:center; position:relative; width:min(27vw,360px); aspect-ratio:1; display:grid; place-items:center; }.hero-orbit img { width:72%; mix-blend-mode:multiply; }.orbit-ring { position:absolute; width:100%; height:100%; border:1px solid var(--ink); border-radius:50%; animation:spin 20s linear infinite; }.orbit-ring:after,.orbit-ring:before { content:""; position:absolute; background:var(--ink); }.orbit-ring:after { width:1px; height:112%; left:50%; top:-6%; }.orbit-ring:before { height:1px; width:112%; top:50%; left:-6%; }.hero-orbit p { position:absolute; right:-4%; bottom:5%; font:500 8px/1.35 'DM Mono',monospace; text-transform:uppercase; }
.hero-bottom { display:flex; justify-content:space-between; align-items:end; gap:24px; }.hero-bottom p { max-width:330px; margin:0; font-size:14px; line-height:1.55; letter-spacing:-.03em; }.round-link { width:53px; height:53px; border:1px solid var(--ink); border-radius:50%; display:grid; place-items:center; font-size:22px; transition:.25s; }.round-link:hover { background:var(--ink); color:var(--paper); transform:rotate(-45deg); }
.section-pad { padding:120px 4.2vw; }.section-heading { display:grid; grid-template-columns:1fr 1fr; margin-bottom:55px; }.section-intro { max-width:300px; margin:0; font-size:19px; line-height:1.3; letter-spacing:-.05em; }
.project-list { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; }.project { min-height:550px; padding:22px; display:flex; flex-direction:column; position:relative; overflow:hidden; }.project-dark { background:#191a18; color:#f1f0eb; }.project-lime { background:var(--lime); }.project-paper { border:1px solid var(--ink); }.project-number,.project-meta,.project a { font:500 10px 'DM Mono',monospace; text-transform:uppercase; }.project-art { flex:1; min-height:250px; position:relative; display:grid; place-items:center; }.project h2 { position:relative; z-index:1; margin:5px 0 19px; font-size:clamp(2.3rem,3.7vw,4.3rem); line-height:.85; letter-spacing:-.095em; }.project a { position:relative; z-index:1; display:flex; justify-content:space-between; border-top:1px solid currentColor; padding-top:12px; }.project-meta { display:flex; justify-content:space-between; }
.art-lines span { position:absolute; display:block; height:2px; background:var(--lime); transform:rotate(-28deg); }.art-lines span:nth-child(1) { width:130%; }.art-lines span:nth-child(2) { width:95%; transform:rotate(-28deg) translate(-5px,68px); }.art-lines span:nth-child(3) { width:68%; transform:rotate(-28deg) translate(-45px,126px); }.art-word { font-size:clamp(3rem,5.8vw,6.2rem); letter-spacing:-.12em; font-weight:800; transform:rotate(-13deg); }.art-word span { color:#e54922; margin-left:4px; }.art-mark img { width:75%; max-width:270px; mix-blend-mode:multiply; }
.about { background:#11110f; color:#f3f1e9; }.about-copy { display:grid; grid-template-columns:1.3fr .7fr; gap:40px; margin-top:90px; }.about-copy > p { max-width:760px; margin:0; font-size:clamp(2.1rem,4.2vw,5rem); line-height:.98; letter-spacing:-.075em; }.about-copy em { color:var(--lime); }.about-aside { border-top:1px solid rgba(255,255,255,.38); padding-top:13px; font:11px/1.65 'DM Mono',monospace; text-transform:uppercase; }.about-aside span { color:var(--lime); }.about-aside p { margin:27px 0 0; }
.contact { padding:115px 4.2vw 28px; min-height:600px; background:var(--lime); display:flex; flex-direction:column; }.contact h2 { margin:42px 0 50px; font-size:clamp(4rem,9vw,9.6rem); line-height:.78; letter-spacing:-.085em; }.contact-link { display:flex; align-items:center; justify-content:space-between; padding-bottom:12px; border-bottom:2px solid var(--ink); font-size:clamp(1.5rem,3.4vw,4rem); letter-spacing:-.07em; font-weight:600; }.contact-link span { font-family:Arial,sans-serif; }.contact footer { margin-top:auto; padding-top:85px; display:flex; justify-content:space-between; font:500 10px 'DM Mono',monospace; text-transform:uppercase; }.contact footer a { text-decoration:underline; text-underline-offset:3px; }
.appear { animation:rise .8s both; }.hero .appear:nth-child(2) { animation-delay:.12s; }.hero .appear:nth-child(3) { animation-delay:.25s; }
@keyframes spin { to { transform:rotate(360deg); } } @keyframes rise { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:none; } }
@media (max-width:700px) { .site-header { height:65px; padding:0 20px; }.nav { display:none; position:absolute; background:var(--paper); top:64px; left:0; right:0; padding:22px 20px; flex-direction:column; align-items:flex-start; border-bottom:1px solid var(--line); }.nav.open { display:flex; }.menu-button { display:block; }.hero { min-height:calc(100svh - 65px); padding:30px 20px 25px; }.hero-grid { display:block; }.hero-title { margin-top:50px; font-size:clamp(4.1rem,19vw,6.5rem); }.hero-orbit { width:190px; margin:30px 5% 0 auto; }.hero-bottom p { font-size:13px; max-width:260px; }.section-pad { padding:75px 20px; }.section-heading,.about-copy { grid-template-columns:1fr; gap:25px; }.section-heading { margin-bottom:35px; }.project-list { grid-template-columns:1fr; }.project { min-height:440px; }.project h2 { font-size:3.6rem; }.about-copy { margin-top:55px; }.contact { padding:75px 20px 20px; min-height:520px; }.contact h2 { font-size:clamp(4.2rem,18vw,6.2rem); }.contact footer { padding-top:70px; gap:15px; flex-wrap:wrap; }.contact footer span:nth-child(2) { display:none; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.appear,.orbit-ring { animation:none; } }