@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;1,800&family=Inter:wght@400;500;600;700&display=swap');

:root{--black:#090909;--paper:#f8f4eb;--gold:#c1ff72;--gold-bright:#d5ff9f;--muted:#a5a5a0;--line:rgba(255,255,255,.16)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:#fff;font-family:Inter,Arial,sans-serif}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.skip-link{position:absolute;left:-999px;top:1rem;background:#fff;color:#000;padding:.75rem;z-index:20}
.skip-link:focus{left:1rem}

.site-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem clamp(1.25rem,5vw,5.5rem);border-bottom:1px solid var(--line)}
.brand{font:800 1.1rem 'Barlow Condensed',sans-serif;letter-spacing:.02em;text-transform:uppercase}
.site-header nav{display:flex;gap:1.6rem;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.site-header nav a:hover{color:var(--gold-bright)}

.hero{padding:clamp(4rem,10vw,7rem) clamp(1.25rem,5vw,5.5rem);background:radial-gradient(circle at 15% 30%,rgba(193,255,114,.12),transparent 40%),linear-gradient(116deg,#151515 0%,#080808 58%)}
.eyebrow,.section-tag{font-size:.68rem;font-weight:800;letter-spacing:.25em;color:var(--gold-bright);text-transform:uppercase}
.eyebrow span{display:inline-block;width:22px;height:2px;background:var(--gold);vertical-align:middle;margin-right:.5rem}
.hero h1{font:800 clamp(2.8rem,7vw,5rem)/1 'Barlow Condensed',sans-serif;text-transform:uppercase;margin:1.5rem 0 1rem;letter-spacing:-.02em}
.hero-statement{font-size:clamp(1.1rem,2vw,1.5rem);line-height:1.5;max-width:640px;color:#c9c9c4;margin:0}
.hero-statement em{color:var(--gold);font-style:normal}

section:not(.hero){padding:5rem clamp(1.25rem,5vw,5.5rem);border-top:1px solid var(--line)}
section h2{font:800 clamp(2rem,4vw,3rem)/1.05 'Barlow Condensed',sans-serif;text-transform:uppercase;margin:.7rem 0 1.5rem;letter-spacing:-.01em}
.what-we-do p,.who-we-are p{max-width:680px;line-height:1.75;color:#c9c9c4;font-size:1rem}
.what-we-do p+p{margin-top:1rem}

.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.brand-card{display:flex;flex-direction:column;gap:.5rem;padding:1.8rem;background:#141414;border:1px solid #2a2a2a;transition:border-color .15s}
.brand-card:hover{border-color:var(--gold)}
.brand-card h3{font:700 1.6rem/1 'Barlow Condensed',sans-serif;text-transform:uppercase;margin:0}
.brand-tag{font-size:.65rem;font-weight:800;letter-spacing:.14em;color:var(--gold-bright);text-transform:uppercase;margin:0}
.brand-card p:not(.brand-tag){font-size:.9rem;line-height:1.6;color:#c9c9c4;margin:0}
.text-link{font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid #777;padding-bottom:.2rem;align-self:flex-start;margin-top:.4rem}
.brand-card .text-link:hover{border-color:var(--gold-bright);color:var(--gold-bright)}
.brand-socials{display:flex;gap:1rem;margin-top:.6rem}
.brand-socials a{font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-bright);border-bottom:1px solid currentColor;padding-bottom:.1rem}
.brand-socials a:hover{color:var(--gold)}

footer{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:2.5rem clamp(1.25rem,5vw,5.5rem);border-top:1px solid var(--line);flex-wrap:wrap}
.footer-brand{display:flex;align-items:baseline;gap:1rem}
.footer-brand p{font:700 .8rem 'Barlow Condensed',sans-serif;letter-spacing:.08em;text-transform:uppercase;margin:0}
footer .text-link{border-bottom:1px solid #555}
footer .text-link:hover{color:var(--gold-bright);border-color:var(--gold-bright)}
.copyright{color:#666;font-size:.7rem;margin:0}

@media(max-width:900px){.brand-grid{grid-template-columns:1fr}}
@media(max-width:640px){.site-header{flex-direction:column;align-items:flex-start;gap:.8rem}.site-header nav{flex-wrap:wrap;gap:1rem}section{padding:3.5rem 1.25rem}.hero{padding:3.5rem 1.25rem}footer{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
