@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600&family=Instrument+Serif:ital@0;1&display=swap");

:root { --ink:#e8ece9; --muted:#9aa19e; --line:rgba(232,236,233,.14); --paper:#0b0e14; --panel:#121722; --accent:#c8ff5b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",Arial,sans-serif; }
main, footer { max-width:1440px; margin:auto; padding-left:clamp(1.5rem,6vw,6rem); padding-right:clamp(1.5rem,6vw,6rem); }
.nav { height:92px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }
.brand { color:var(--ink); text-decoration:none; display:flex; align-items:center; gap:.65rem; font-size:.98rem; font-weight:600; letter-spacing:-.02em; }
.brand-mark { display:grid; place-items:center; width:28px; height:28px; border:1px solid var(--accent); border-radius:50%; color:var(--accent); font-family:"Instrument Serif",Georgia,serif; font-size:1.3rem; font-style:italic; }
.brand-muted { color:var(--muted); font-weight:400; }
.nav-link { color:var(--muted); font-family:"DM Mono",monospace; font-size:.7rem; letter-spacing:.04em; text-decoration:none; text-transform:uppercase; }
.nav-link:hover { color:var(--accent); }
.hero { min-height:630px; padding:clamp(6rem,13vw,11rem) 0 5rem; position:relative; overflow:hidden; }
.eyebrow { align-items:center; color:var(--muted); display:flex; font-family:"DM Mono",monospace; font-size:.68rem; gap:.55rem; letter-spacing:.08em; margin:0 0 1.65rem; text-transform:uppercase; }
.eyebrow span { background:var(--accent); border-radius:50%; display:inline-block; height:6px; width:6px; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(4.3rem,9.7vw,9.7rem); font-weight:500; letter-spacing:-.08em; line-height:.82; margin:0; position:relative; z-index:1; }
h1 em { color:var(--accent); font-family:"Instrument Serif",Georgia,serif; font-weight:400; letter-spacing:-.06em; }
.hero-copy { color:var(--muted); font-size:clamp(1rem,1.5vw,1.18rem); line-height:1.55; margin:3rem 0 2.2rem; max-width:430px; position:relative; z-index:1; }
.button { border:1px solid var(--accent); color:var(--accent); display:inline-flex; font-family:"DM Mono",monospace; font-size:.72rem; gap:1.6rem; letter-spacing:.04em; padding:.95rem 1.1rem; position:relative; text-decoration:none; text-transform:uppercase; transition:background .2s,color .2s; z-index:1; }
.button:hover { background:var(--accent); color:var(--paper); }
.signal-grid { display:grid; gap:14px; grid-template-columns:repeat(4,1fr); opacity:.55; position:absolute; right:4%; top:22%; transform:rotate(12deg); width:min(38vw,510px); }
.signal-grid i { aspect-ratio:1; border:1px solid rgba(200,255,91,.22); border-radius:50%; }
.signal-grid i:nth-child(3n) { background:rgba(200,255,91,.12); }
.signal-grid i:nth-child(5n) { border-color:var(--accent); }
.focus { border-top:1px solid var(--line); padding:clamp(5rem,9vw,9rem) 0; }
.section-intro { display:flex; justify-content:space-between; align-items:flex-start; }
h2 { font-size:clamp(2.75rem,5.4vw,5.4rem); font-weight:500; letter-spacing:-.065em; line-height:.91; margin:0 0 4rem; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.card { border-right:1px solid var(--line); min-height:295px; padding:1.5rem 2rem 1.5rem 0; }
.card + .card { padding-left:2rem; }
.card:last-child { border-right:0; }
.card-number,.tag { color:var(--accent); font-family:"DM Mono",monospace; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; }
.card h3 { font-size:1.45rem; font-weight:500; letter-spacing:-.04em; margin:3rem 0 .8rem; }
.card p:not(.card-number) { color:var(--muted); font-size:.92rem; line-height:1.55; max-width:285px; }
.tag { border:1px solid rgba(200,255,91,.33); display:inline-block; margin-top:1rem; padding:.45rem .55rem; }
.principle { border-top:1px solid var(--line); padding:clamp(5rem,10vw,10rem) 0; }
blockquote { font-family:"Instrument Serif",Georgia,serif; font-size:clamp(2.8rem,6vw,6.5rem); letter-spacing:-.06em; line-height:.92; margin:0; max-width:1000px; }
footer { align-items:center; border-top:1px solid var(--line); display:flex; justify-content:space-between; min-height:112px; }
footer p { color:var(--muted); font-family:"DM Mono",monospace; font-size:.68rem; margin:0; }
@media (max-width:700px) { .nav{height:76px}.hero{min-height:590px}.signal-grid{right:-20%;top:42%;width:80vw}.section-intro{display:block}.cards{grid-template-columns:1fr}.card,.card+.card{border-bottom:1px solid var(--line);border-right:0;min-height:auto;padding:1.5rem 0 2rem}.card h3{margin-top:2rem}footer{align-items:flex-start;flex-direction:column;gap:1.5rem;padding-bottom:2rem;padding-top:2rem} }