@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#151515; --muted:#6c6b68; --paper:#f4f1eb; --white:#fff; --red:#f04454; --red-dark:#d93344; --line:#dad5cc; --max:1180px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
 a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline:3px solid var(--red); outline-offset:4px; }
.section-wrap { width:min(var(--max),calc(100% - 72px)); margin:auto; }
.site-header { height:86px; padding:0 max(36px,calc((100vw - var(--max)) / 2)); display:flex; align-items:center; gap:54px; background:var(--paper); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:10px; line-height:1; white-space:nowrap; }
.brand-mark { width:44px; height:44px; display:block; }
.brand-mark.small { width:32px; height:32px; }
.brand-mark img { width:100%; height:100%; display:block; }
.brand strong,.brand b { display:block; letter-spacing:.08em; }
.brand strong { font-size:11px; margin-bottom:3px; }
.brand b { font-size:17px; }
.main-nav { display:flex; gap:31px; margin-left:auto; color:#595855; font-size:12px; font-weight:700; }
.main-nav a:hover,.text-link:hover { color:var(--red-dark); }
.header-contact { display:inline-flex; align-items:center; gap:18px; padding:14px 17px; color:var(--white); background:var(--ink); font-size:11px; font-weight:800; box-shadow:4px 4px 0 var(--red); }.header-contact:hover { color:var(--white); background:#2b2b2b; }.header-contact span { font-size:17px; }
.hero { min-height:470px; display:flex; align-items:center; padding-top:64px; padding-bottom:74px; }
.eyebrow { color:var(--red-dark); font:500 10px 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.1em; }
.eyebrow span { display:inline-block; width:20px; height:2px; margin:0 10px 3px 0; background:var(--red); }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-weight:800; letter-spacing:-.055em; line-height:1.01; }
h1 { max-width:570px; margin:22px 0 25px; font-size:clamp(45px,6vw,76px); }
h1 em,h2 em { color:var(--red); font-style:normal; }
.hero-intro { max-width:480px; color:var(--muted); font-size:15px; line-height:1.75; }
.hero-actions { display:flex; align-items:center; gap:27px; margin:32px 0 30px; }
.button { display:inline-flex; align-items:center; gap:24px; padding:17px 20px; font-size:12px; font-weight:800; }
.button-primary { color:var(--white); background:var(--red); box-shadow:5px 5px 0 var(--ink); }
.button-primary:hover { background:var(--red-dark); transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink); }
.button:disabled { cursor:wait; opacity:.7; transform:none; }
.button span { font-size:20px; line-height:10px; }
.text-link { font-size:11px; font-weight:800; }
.text-link span { display:block; margin-top:5px; color:var(--muted); font:400 10px 'DM Mono',monospace; }
.hero-note { color:var(--muted); font:10px 'DM Mono',monospace; }
.pulse { display:inline-block; width:7px; height:7px; margin-right:8px; border-radius:50%; background:#40bb6c; }
.proof-strip { background:var(--red); color:var(--white); }.proof-grid { display:grid; grid-template-columns:repeat(4,1fr); padding:24px 0; }.proof-grid div { padding:0 23px; border-left:1px solid rgba(255,255,255,.35); }.proof-grid div:first-child { padding-left:0; border:0; }.proof-grid strong,.proof-grid span { display:block; }.proof-grid strong { font-size:12px; }.proof-grid span { margin-top:7px; font:10px 'DM Mono',monospace; opacity:.75; }
.services { padding-top:108px; padding-bottom:124px; }.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:43px; }.section-heading h2,.approach h2,.contact h2 { margin:18px 0 0; font-size:47px; }.section-heading > p { max-width:340px; margin-bottom:5px; color:var(--muted); font-size:13px; line-height:1.7; }.service-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }.service-card { position:relative; min-height:278px; padding:24px 21px 23px; border-right:1px solid var(--line); }.service-card:first-child { border-left:1px solid var(--line); }.service-card:hover { background:var(--white); }.service-featured { color:var(--white); background:var(--ink); }.service-featured:hover { background:#242424; }.service-number { position:absolute; top:24px; right:21px; color:var(--red); font:10px 'DM Mono',monospace; }.service-icon { display:block; color:var(--red); font-size:29px; margin:22px 0 27px; }.service-card h3 { font-size:19px; line-height:1.13; letter-spacing:-.04em; }.service-card p { color:var(--muted); font-size:11px; line-height:1.65; }.service-featured p { color:#aaa; }.service-card a { position:absolute; bottom:23px; font-size:10px; font-weight:800; }.service-card a span { color:var(--red); margin-left:9px; font-size:17px; }
.projects { padding-bottom:125px; }.project-heading { margin-bottom:42px; }.project-series-list { display:grid; gap:58px; }.project-series { padding-top:28px; border-top:1px solid var(--line); }.project-series-header { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:22px; }.project-series-header h3 { margin:10px 0 0; font-size:25px; letter-spacing:-.04em; }.project-series-header > p { max-width:360px; margin:0 0 2px; color:var(--muted); font-size:12px; line-height:1.7; }.project-series-label { margin:0; color:var(--red-dark); font:500 10px 'DM Mono',monospace; letter-spacing:.1em; text-transform:uppercase; }.project-series-photos { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.project-series-photos-four { grid-template-columns:repeat(4,1fr); }.project-series-photos-two { grid-template-columns:repeat(2,1fr); max-width:780px; }.project-step { min-width:0; margin:0; background:var(--white); }.project-step img { display:block; width:100%; aspect-ratio:4 / 3; object-fit:cover; }.project-step figcaption { padding:14px 16px 16px; }.project-step figcaption strong,.project-step figcaption span { display:block; }.project-step figcaption strong { color:var(--red-dark); font-size:12px; }.project-step figcaption span { margin-top:6px; color:var(--muted); font:10px 'DM Mono',monospace; line-height:1.5; text-transform:uppercase; }
.approach { max-width:760px; padding-bottom:125px; }.approach-copy > p:not(.eyebrow) { max-width:620px; margin:25px 0 35px; color:var(--muted); font-size:14px; line-height:1.8; }.principles { border-top:1px solid var(--line); }.principles div { display:flex; gap:27px; padding:16px 0; border-bottom:1px solid var(--line); font-size:11px; }.principles b { color:var(--red); font:11px 'DM Mono',monospace; }.principles strong { display:inline-block; width:90px; }
.contact { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; padding:77px 0 93px; border-top:1px solid var(--line); }.contact-intro { max-width:390px; margin-top:27px; color:var(--muted); font-size:13px; line-height:1.8; }.contact-details { display:grid; gap:9px; margin-top:27px; font:11px 'DM Mono',monospace; }.contact-details a { color:var(--red-dark); font-weight:500; }.contact-details span { color:var(--muted); }.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:18px 20px; padding:24px; background:var(--white); border-top:2px solid var(--red); box-shadow:8px 8px 0 var(--ink); }.form-heading,.form-status,.form-field-wide,.privacy-note,.contact-form > button { grid-column:1 / -1; }.form-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; padding-bottom:13px; border-bottom:1px solid var(--line); }.form-heading strong { font-size:16px; }.form-heading span { color:var(--muted); font:10px 'DM Mono',monospace; }.form-field { display:grid; gap:8px; }.form-field-name { grid-column:1; }.form-field-email { grid-column:2; }.form-field-phone { grid-column:1; }.form-field label { color:var(--ink); font:11px 'DM Mono',monospace; text-transform:uppercase; }.form-field label b { color:var(--red); }.form-field label span { text-transform:none; color:var(--muted); }.contact-form input,.contact-form textarea { width:100%; min-height:52px; padding:13px 14px; color:var(--ink); background:var(--paper); border:2px solid #c8c1b7; border-radius:2px; outline:0; font:14px Manrope,Arial,sans-serif; resize:vertical; }.contact-form textarea { min-height:150px; }.contact-form input::placeholder,.contact-form textarea::placeholder { color:#77736d; }.contact-form input:focus,.contact-form textarea:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(240,68,84,.18); }.form-field small { color:var(--ink); font-size:12px; line-height:1.55; }.privacy-note { max-width:500px; margin:0; color:var(--muted); font-size:11px; line-height:1.55; }.privacy-note a { color:var(--red-dark); text-decoration:underline; }.form-status { display:none; padding:12px 14px; font-size:12px; line-height:1.5; }.form-status.is-success,.form-status.is-error { display:block; }.form-status.is-success { color:#145b35; background:#e5f4ea; border-left:4px solid #40bb6c; }.form-status.is-error { color:#8c1e2c; background:#fde8eb; border-left:4px solid var(--red); }.form-field-honeypot { display:none !important; }.legal-page,.error-page { max-width:760px; padding-top:100px; padding-bottom:120px; }.legal-page p,.error-page p { max-width:620px; color:var(--muted); font-size:14px; line-height:1.8; }.legal-page a:not(.button),.error-page a:not(.button) { color:var(--red-dark); text-decoration:underline; }
.site-footer { color:#aaa; background:var(--ink); }.footer-inner { display:flex; align-items:center; gap:36px; min-height:92px; font:10px 'DM Mono',monospace; }.footer-inner > span:nth-last-child(2) { margin-left:auto; }.footer-inner .brand { color:var(--white); }.footer-inner .brand b { font-size:11px; }
@media (max-width:850px) { .site-header { gap:20px; padding:14px 24px; flex-wrap:wrap; height:auto; }.main-nav { display:flex; order:3; flex-basis:100%; justify-content:space-between; gap:12px; margin-left:0; padding-top:10px; border-top:1px solid var(--line); font-size:11px; }.section-wrap { width:min(var(--max),calc(100% - 40px)); }.hero { padding-top:60px; }.proof-grid { grid-template-columns:repeat(2,1fr); gap:20px; }.proof-grid div:nth-child(3) { padding-left:0; border:0; }.services { padding-top:78px; padding-bottom:85px; }.section-heading { display:block; }.section-heading > p { margin-top:24px; }.service-grid { grid-template-columns:repeat(2,1fr); }.service-card { border-bottom:1px solid var(--line); }.projects { padding-bottom:85px; }.project-series-header { display:block; }.project-series-header > p { margin-top:18px; }.project-series-photos-four,.project-series-photos-two { grid-template-columns:repeat(2,1fr); max-width:none; }.approach { padding-bottom:85px; }.contact { gap:45px; padding-bottom:70px; } }
@media (max-width:560px) { .site-header { padding:12px 18px; }.brand-mark { width:35px; height:35px; }.brand b { font-size:14px; }.header-contact { margin-left:auto; padding:12px 13px; font-size:10px; }.hero { padding-top:48px; }.hero-actions { align-items:flex-start; flex-direction:column; gap:18px; }.section-heading h2,.approach h2,.contact h2 { font-size:38px; }.service-grid,.contact,.contact-form { grid-template-columns:1fr; }.service-card { min-height:245px; border-left:1px solid var(--line); }.proof-grid { grid-template-columns:1fr 1fr; }.proof-grid div { padding-left:12px; }.project-series-photos,.project-series-photos-four,.project-series-photos-two { grid-template-columns:1fr; max-width:none; gap:14px; }.form-heading { display:block; }.form-heading span { display:block; margin-top:8px; }.form-field-name,.form-field-email,.form-field-phone,.form-field-wide,.privacy-note,.contact-form > button { grid-column:1; }.footer-inner { flex-wrap:wrap; gap:15px; padding:20px 0; }.footer-inner > span:nth-last-child(2) { margin-left:0; }.footer-inner > span:last-child { width:100%; } }