:root { --ink:#10110f; --paper:#f2f0e9; --paper-deep:#e5e1d6; --acid:#d7ff38; --soft:#5d5f58; --line:rgba(16,17,15,.17); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
a:focus-visible { outline:3px solid var(--acid); outline-offset:4px; }
.skip-link { background:var(--acid); color:var(--ink); font-weight:800; left:16px; padding:12px 16px; position:fixed; top:-80px; z-index:20; }
.skip-link:focus { top:16px; }
.site-header { align-items:center; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; margin:0 auto; max-width:1440px; padding:22px 4vw; }
.brand { align-items:center; display:inline-flex; font-size:16px; font-weight:800; gap:12px; letter-spacing:-.04em; }
.brand strong { font-weight:400; }
.brand-mark { display:grid; grid-template-columns:1fr 1fr; height:34px; width:68px; }
.brand-mark span { align-items:center; background:var(--acid); border:1px solid var(--ink); display:flex; font-size:12px; font-weight:900; justify-content:center; }
.brand-mark span + span { background:var(--ink); color:var(--acid); }
nav { align-items:center; display:flex; font-size:13px; font-weight:700; gap:30px; }
nav a { transition:opacity .2s ease; }
nav a:hover { opacity:.55; }
.nav-cta { border:1px solid var(--ink); padding:11px 16px; }
.hero { display:grid; gap:7vw; grid-template-columns:1.08fr .92fr; margin:0 auto; max-width:1440px; min-height:700px; overflow:hidden; padding:90px 4vw 80px; }
.hero-copy { align-self:center; }
.eyebrow { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; font-weight:800; letter-spacing:.14em; margin:0 0 26px; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(62px,7.7vw,122px); font-weight:800; letter-spacing:-.075em; line-height:.82; margin-bottom:42px; }
h1 em { color:transparent; font-style:normal; -webkit-text-stroke:2px var(--ink); }
.hero-intro { font-size:clamp(18px,1.5vw,23px); line-height:1.5; max-width:650px; }
.hero-actions { align-items:center; display:flex; gap:28px; margin-top:40px; }
.button { align-items:center; display:inline-flex; font-size:13px; font-weight:800; gap:46px; padding:17px 20px; }
.button-primary { background:var(--ink); color:white; }
.button-primary span { color:var(--acid); font-size:18px; }
.text-link { border-bottom:1px solid var(--ink); font-size:13px; font-weight:800; padding-bottom:7px; }
.hero-board { align-self:center; aspect-ratio:1/1; background:var(--ink); color:white; display:grid; grid-template:repeat(4,1fr)/repeat(4,1fr); max-width:580px; position:relative; transform:rotate(2deg); }
.hero-board::before { background-image:linear-gradient(90deg,transparent 50%,rgba(255,255,255,.045) 50%),linear-gradient(transparent 50%,rgba(255,255,255,.045) 50%); background-size:50% 50%; content:""; inset:0; position:absolute; }
.board-square { display:flex; flex-direction:column; justify-content:space-between; padding:15%; position:relative; z-index:2; }
.board-square span { font-size:clamp(34px,4vw,68px); font-weight:900; letter-spacing:-.08em; }
.board-square small { font-family:ui-monospace,monospace; font-size:11px; font-weight:700; letter-spacing:.1em; }
.square-d4 { background:var(--acid); color:var(--ink); grid-area:3/2/4/3; }
.square-d5 { border:2px solid var(--acid); color:var(--acid); grid-area:2/2/3/3; }
.move-line { border-left:1px dashed var(--acid); grid-area:2/3/4/4; margin-left:50%; position:relative; z-index:2; }
.hero-board>p { align-self:end; font-family:ui-monospace,monospace; font-size:12px; font-weight:700; grid-area:4/3/5/5; letter-spacing:.08em; line-height:1.5; padding:18%; position:relative; text-transform:uppercase; z-index:2; }
.statement { background:var(--acid); padding:72px max(4vw,calc((100vw - 1325px)/2)); }
.statement p { font-size:clamp(30px,4vw,64px); font-weight:700; letter-spacing:-.045em; line-height:1.08; margin-bottom:0; max-width:1200px; }
.statement strong { background:var(--ink); color:var(--acid); padding:0 .12em; }
.section { margin:0 auto; max-width:1440px; padding:120px 4vw; }
.section-heading { display:grid; grid-template-columns:1fr 2fr; margin-bottom:70px; }
.section h2,.contact h2 { font-size:clamp(42px,5.2vw,82px); letter-spacing:-.06em; line-height:.95; margin-bottom:0; }
.service-grid { border-top:1px solid var(--ink); display:grid; grid-template-columns:repeat(4,1fr); }
.service-card { border-right:1px solid var(--line); min-height:310px; padding:28px 35px 35px 0; }
.service-card + .service-card { padding-left:35px; }
.service-card:last-child { border-right:0; }
.service-number { color:var(--soft); font-family:ui-monospace,monospace; font-size:12px; font-weight:800; }
.service-card h3 { align-items:flex-end; display:flex; font-size:28px; letter-spacing:-.04em; margin:42px 0 20px; min-height:68px; }
.service-card p { color:#34362f; font-size:16px; line-height:1.7; max-width:350px; }
.approach { background:var(--ink); color:white; display:grid; gap:10vw; grid-template-columns:1fr 1fr; max-width:none; padding-left:max(4vw,calc((100vw - 1325px)/2)); padding-right:max(4vw,calc((100vw - 1325px)/2)); }
.approach-copy h2 { color:var(--acid); margin-bottom:38px; }
.approach-copy>p:last-child { color:#dedfd7; font-size:18px; line-height:1.7; max-width:560px; }
.principle-list { list-style:none; margin:0; padding:0; }
.principle-list li { align-items:start; border-top:1px solid rgba(255,255,255,.22); display:grid; gap:24px; grid-template-columns:50px 1fr; padding:28px 0; }
.principle-list li:last-child { border-bottom:1px solid rgba(255,255,255,.22); }
.principle-list span { color:var(--acid); font-family:ui-monospace,monospace; font-size:12px; font-weight:800; padding-top:5px; }
.principle-list strong { display:block; font-size:clamp(19px,2vw,28px); }
.principle-list p { color:#dedfd7; font-size:16px; line-height:1.6; margin:10px 0 0; max-width:520px; }
.story { align-items:center; display:grid; gap:10vw; grid-template-columns:.85fr 1.15fr; }
.story-board { align-items:center; aspect-ratio:1; background:var(--ink); display:grid; gap:26px; grid-template-rows:1fr auto; padding:10%; }
.story-mini-board { aspect-ratio:1; background:conic-gradient(var(--paper-deep) 25%,#b9b5a8 0 50%,var(--paper-deep) 0 75%,#b9b5a8 0) 0 0/50% 50%; position:relative; }
.story-square { align-items:center; display:flex; font-size:clamp(24px,3vw,46px); font-weight:900; height:25%; justify-content:center; left:25%; position:absolute; width:25%; }
.story-d5 { background:var(--ink); border:3px solid var(--acid); color:var(--acid); top:25%; }
.story-d4 { background:var(--acid); color:var(--ink); top:50%; }
.story-move-caption { align-items:end; color:white; display:flex; justify-content:space-between; }
.story-move-caption span { color:#dedfd7; font-family:ui-monospace,monospace; font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.story-move-caption strong { color:var(--acid); font-size:clamp(28px,3.5vw,52px); letter-spacing:-.05em; }
.story-copy h2 { margin-bottom:36px; }
.story-copy>p:last-child { color:#34362f; font-size:19px; line-height:1.75; max-width:660px; }
.contact { background:var(--ink); color:white; padding:120px max(4vw,calc((100vw - 1325px)/2)); text-align:center; }
.contact .eyebrow { color:var(--acid); }
.contact h2 { margin-bottom:28px; }
.contact>p:not(.eyebrow) { color:#dedfd7; font-size:18px; line-height:1.6; margin:0 auto 34px; max-width:660px; }
.contact-button { background:var(--acid); color:var(--ink); justify-content:space-between; min-width:210px; }
.contact-button span { font-size:18px; }
.email-options { align-items:center; display:flex; flex-wrap:wrap; gap:12px 18px; justify-content:center; margin-top:24px; }
.contact-email { border-bottom:1px solid rgba(215,255,56,.55); color:var(--acid); font-size:16px; font-weight:700; padding-bottom:5px; }
.copy-email { background:transparent; border:1px solid rgba(255,255,255,.45); color:white; cursor:pointer; font:700 12px Arial,Helvetica,sans-serif; padding:9px 12px; }
.copy-email:hover { border-color:var(--acid); color:var(--acid); }
.copy-email:focus-visible { outline:3px solid var(--acid); outline-offset:4px; }
.copy-status { color:#dedfd7; flex-basis:100%; font-size:13px; min-height:1.2em; }
footer { align-items:center; display:grid; font-size:13px; gap:30px; grid-template-columns:1fr auto 1fr; margin:0 auto; max-width:1440px; padding:35px 4vw; }
footer p { margin:0; }
footer p:last-child { justify-self:end; }
footer a:not(.brand) { font-weight:400; width:max-content; }
footer a:not(.brand):hover { opacity:.55; }
.legal-header { align-items:center; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; margin:0 auto; max-width:1100px; padding:22px 4vw; }
.legal-back { border-bottom:1px solid var(--ink); font-size:13px; font-weight:800; padding-bottom:5px; }
.legal { margin:0 auto; max-width:1100px; padding:100px 4vw 120px; }
.legal h1 { font-size:clamp(54px,8vw,100px); margin-bottom:32px; }
.legal-intro { font-size:clamp(19px,2vw,24px); line-height:1.55; max-width:760px; }
.legal-updated { color:var(--soft); font-family:ui-monospace,monospace; font-size:12px; font-weight:700; letter-spacing:.08em; margin:40px 0 70px; text-transform:uppercase; }
.legal section { border-top:1px solid var(--line); display:grid; gap:30px; grid-template-columns:minmax(180px,.7fr) 1.3fr; padding:34px 0; }
.legal h2 { font-size:24px; letter-spacing:-.035em; line-height:1.1; }
.legal section div { color:#34362f; font-size:17px; line-height:1.7; }
.legal section p:last-child { margin-bottom:0; }
.legal a { border-bottom:1px solid currentColor; font-weight:700; }
.legal-site footer { max-width:1100px; }
@media(max-width:900px) { nav a:not(.nav-cta){display:none}.hero{gap:70px;grid-template-columns:1fr;padding-top:70px}.hero-board{justify-self:center;width:min(100%,580px)}.section-heading,.approach,.story{grid-template-columns:1fr}.section-heading{gap:20px}.service-grid{grid-template-columns:1fr}.service-card,.service-card+.service-card{border-bottom:1px solid var(--line);border-right:0;min-height:220px;padding:28px 0}.service-card h3{margin-top:32px;min-height:auto}.story-board{width:100%}footer{grid-template-columns:1fr;text-align:center}footer .brand,footer a:not(.brand){justify-self:center}footer p:last-child{justify-self:center}.legal section{gap:12px;grid-template-columns:1fr} }
@media(max-width:560px) { .site-header,.legal-header{padding:16px 20px}.brand-mark{height:30px;width:60px}.nav-cta{padding:10px 12px}.hero{min-height:auto;padding:62px 20px 65px}h1{font-size:57px}h1 em{-webkit-text-stroke-width:1.4px}.hero-actions{align-items:flex-start;flex-direction:column}.section{padding:85px 20px}.statement{padding:55px 20px}.approach,.contact{padding-left:20px;padding-right:20px}.story-board{padding:9%}.story-move-caption{align-items:flex-start;flex-direction:column;gap:8px}.legal{padding:75px 20px 90px}footer{padding:30px 20px} }
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto} }
