:root { --acid:#b8ff65; --ink:#0b0d0a; --paper:#f7f5ef; --line:rgba(11,13,10,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; color:var(--ink); background:var(--acid); font-family:"Space Grotesk",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.nav { height:84px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(22px,4vw,64px); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:13px; font-weight:700; font-size:20px; }
.brand img { width:42px; height:42px; border:1px solid var(--ink); border-radius:50%; object-fit:cover; }
.social { display:flex; align-items:center; gap:20px; font:500 12px "DM Mono",monospace; text-transform:uppercase; }
.social b { font-size:20px; }
main { padding:0 clamp(14px,2vw,32px); }
.hero { position:relative; width:min(1440px,100%); min-height:calc(100svh - 144px); margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; overflow:hidden; background:var(--paper); }
.ticker { position:absolute; z-index:5; inset:0 0 auto; height:34px; display:flex; width:max-content; overflow:hidden; color:var(--acid); background:var(--ink); font:500 12px/34px "DM Mono",monospace; letter-spacing:.14em; white-space:nowrap; }
.ticker span { min-width:max-content; padding-right:20px; animation:crawl 18s linear infinite; }
.copy { position:relative; z-index:2; min-height:690px; display:flex; flex-direction:column; justify-content:center; padding:86px clamp(32px,6vw,88px) 54px; }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 34px; font:500 11px "DM Mono",monospace; letter-spacing:.12em; text-transform:uppercase; }
.eyebrow span { width:8px; height:8px; border-radius:50%; background:var(--acid); box-shadow:0 0 0 5px rgba(156,255,0,.2); }
h1 { margin:0; font-size:clamp(58px,6.2vw,104px); line-height:.82; letter-spacing:-.08em; }
h1 em { color:var(--acid); font-style:normal; text-shadow:-2px -2px 0 var(--ink),2px -2px 0 var(--ink),-2px 2px 0 var(--ink),2px 2px 0 var(--ink); }
.intro { max-width:610px; margin:42px 0 36px; color:#55534f; font-size:17px; line-height:1.65; }
.intro strong { color:var(--ink); }
.actions { display:flex; align-items:center; gap:28px; }
button { width:min(230px,100%); height:66px; display:flex; align-items:center; justify-content:space-between; padding:0 12px 0 28px; border:1px solid var(--ink); border-radius:999px; color:var(--acid); background:var(--ink); cursor:pointer; font:500 12px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; transition:transform .2s,box-shadow .2s; }
button b { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:var(--ink); background:var(--acid); font-size:20px; }
button:hover { transform:translate(-3px,-3px); box-shadow:7px 7px 0 var(--acid); }
button:focus-visible { outline:3px solid var(--acid); outline-offset:4px; }
.actions p { margin:0; font:500 10px/1.7 "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.actions p span { color:#70b900; }
.visual { position:relative; min-height:690px; padding:72px 54px 46px 20px; background:var(--acid); }
.image-wrap { position:relative; height:75%; margin-left:8%; overflow:hidden; border:1px solid var(--ink); box-shadow:16px 16px 0 var(--ink); transform:rotate(1.5deg); }
.image-wrap>img { width:100%; height:100%; object-fit:cover; object-position:center 35%; filter:grayscale(1) contrast(1.08); mix-blend-mode:multiply; }
.image-wrap::after { content:""; position:absolute; inset:0; background:rgba(156,255,0,.26); mix-blend-mode:color; pointer-events:none; }
.image-tag { position:absolute; z-index:2; left:0; bottom:0; padding:10px 14px; color:var(--acid); background:var(--ink); font:500 9px "DM Mono",monospace; letter-spacing:.12em; }
.wordmark { position:absolute; z-index:3; left:-7%; bottom:8%; width:73%; border:1px solid var(--ink); box-shadow:8px 8px 0 var(--ink); transform:rotate(-4deg); }
.stamp { position:absolute; z-index:4; right:2%; top:16%; width:96px; height:96px; display:grid; place-content:center; text-align:center; border:2px solid var(--ink); border-radius:50%; background:var(--paper); font-size:16px; font-weight:700; line-height:.8; transform:rotate(10deg); }
.stamp small { font:500 7px/1.15 "DM Mono",monospace; letter-spacing:.1em; }
footer { min-height:60px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(22px,4vw,64px); font:500 10px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
@keyframes crawl { to { transform:translateX(-100%); } }
@media (max-width:820px) { .nav{height:70px}.social span{display:none}main{padding:0}.hero{grid-template-columns:1fr}.copy{min-height:620px;padding:88px 26px 48px}h1{font-size:clamp(54px,17vw,82px)}.intro{margin:34px 0 30px;font-size:15px}.visual{min-height:570px;padding:54px 30px 55px 16px}.image-wrap{height:470px} }
@media (max-width:500px) { .actions{align-items:flex-start;flex-direction:column}button{width:100%}footer{gap:16px;padding-block:18px}footer span:first-child{display:none} }
@media (prefers-reduced-motion:reduce) { *{scroll-behavior:auto!important}.ticker span{animation:none}button{transition:none} }