:root { --ink:#121212; --paper:#f2efe4; --acid:#d8ff32; --orange:#ff4d1f; }
* { 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; }

.site-nav { height:82px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 clamp(20px,5vw,72px); border-bottom:2px solid var(--ink); position:relative; z-index:10; }
.wordmark { width:max-content; font:900 29px/1 'Arial Black',Impact,sans-serif; letter-spacing:-3px; transform:rotate(-3deg); }
.wordmark span { color:var(--orange); }
.nav-note,.nav-link,.eyebrow,.poster-kicker,.manifesto-label { font-size:11px; font-weight:800; letter-spacing:.14em; }
.nav-link { justify-self:end; display:flex; align-items:center; gap:7px; }
.nav-link svg { width:16px; }

.hero { min-height:calc(100svh - 82px); padding:clamp(56px,8vw,110px) clamp(20px,5vw,72px) 64px; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); align-items:center; gap:clamp(40px,8vw,120px); position:relative; overflow:hidden; }
.hero::before { content:''; position:absolute; inset:0; pointer-events:none; opacity:.18; background-image:radial-gradient(var(--ink) .65px,transparent .65px); background-size:7px 7px; mask-image:linear-gradient(90deg,transparent 42%,#000 100%); }
.hero-copy,.hero-poster { position:relative; z-index:1; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 20px; }
.eyebrow span { width:28px; height:4px; background:var(--orange); }
.hero h1,.section-heading h2,.manifesto h2 { margin:0; font-family:'Arial Black',Impact,sans-serif; font-weight:950; letter-spacing:-.085em; line-height:.76; }
.hero h1 { font-size:clamp(76px,13.4vw,194px); }
.title-lansi { display:block; color:var(--orange); transform:translateX(clamp(8px,3vw,42px)); }
.title-lansi i { color:var(--ink); font-style:normal; font-size:.32em; vertical-align:top; margin-left:8px; }
.hero-description { max-width:540px; margin:38px 0 0; font-size:clamp(18px,2vw,25px); line-height:1.35; font-weight:700; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:34px; flex-wrap:wrap; }
.button { min-height:54px; display:inline-flex; align-items:center; justify-content:center; gap:18px; padding:0 22px; border:2px solid var(--ink); font-size:12px; font-weight:900; letter-spacing:.12em; transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translate(-4px,-4px); box-shadow:6px 6px 0 var(--ink); }
.button:focus-visible,.nav-link:focus-visible,.text-link:focus-visible,footer a:focus-visible { outline:3px solid var(--orange); outline-offset:5px; }
.button svg { width:18px; }
.button-primary { background:var(--acid); }
.text-link { font-size:12px; font-weight:900; letter-spacing:.1em; border-bottom:2px solid; padding-bottom:5px; }
.text-link span { color:var(--orange); }

.hero-poster { width:min(100%,430px); aspect-ratio:.78; justify-self:center; padding:28px; background:var(--acid); border:3px solid var(--ink); box-shadow:15px 15px 0 var(--ink); transform:rotate(3deg); display:flex; flex-direction:column; }
.hero-poster::before,.hero-poster::after { content:''; position:absolute; width:72px; height:22px; background:rgba(242,239,228,.75); border:1px solid rgba(18,18,18,.15); top:-10px; }
.hero-poster::before { left:36px; transform:rotate(-7deg); }
.hero-poster::after { right:30px; transform:rotate(8deg); }
.poster-face { margin:30px auto 24px; width:72%; aspect-ratio:1; border:5px solid var(--ink); border-radius:50%; position:relative; background:var(--paper); }
.eye { position:absolute; width:17%; height:8%; background:var(--ink); top:34%; transform:rotate(-8deg); }
.eye-left { left:22%; }
.eye-right { right:22%; transform:rotate(8deg); }
.mouth { position:absolute; bottom:24%; left:50%; transform:translateX(-50%) rotate(-4deg); font:900 clamp(16px,2.3vw,30px)/1 'Arial Black',Impact,sans-serif; letter-spacing:-.04em; }
.poster-line { margin:0; font:950 clamp(32px,4vw,60px)/.88 'Arial Black',Impact,sans-serif; letter-spacing:-.07em; }
.poster-line-alt { color:var(--orange); }
.poster-stamp { position:absolute; right:-25px; bottom:68px; width:82px; height:82px; border-radius:50%; background:var(--orange); color:var(--paper); border:3px solid var(--ink); display:grid; place-content:center; text-align:center; font:900 12px/1.05 'Arial Black',Impact,sans-serif; transform:rotate(12deg); }
.side-note { position:absolute; right:13px; bottom:26px; writing-mode:vertical-rl; font-size:9px; font-weight:800; letter-spacing:.17em; }

.ticker { overflow:hidden; background:var(--ink); color:var(--paper); padding:18px 0; transform:rotate(-1.2deg) scale(1.02); }
.ticker div { display:flex; width:max-content; align-items:center; gap:28px; font:900 clamp(18px,2.5vw,34px)/1 'Arial Black',Impact,sans-serif; letter-spacing:-.03em; animation:ticker 20s linear infinite; }
.ticker i { color:var(--acid); font-style:normal; }
@keyframes ticker { to { transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .ticker div { animation:none; } }

.codes { padding:clamp(110px,15vw,200px) clamp(20px,5vw,72px); display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(60px,10vw,160px); }
.section-heading h2 { font-size:clamp(58px,8vw,116px); line-height:.83; }
.code-list { border-top:2px solid var(--ink); }
.code-card { padding:28px 0 34px; display:grid; grid-template-columns:92px 1fr; column-gap:28px; border-bottom:2px solid var(--ink); }
.code-top { grid-row:span 2; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; }
.code-top svg { width:27px; height:27px; color:var(--orange); stroke-width:2.5; }
.code-symbol { color:var(--orange); font:900 28px/1 'Arial Black',Impact,sans-serif; }
.code-number { font:900 13px/1 'Arial Black',Impact,sans-serif; }
.code-card h3 { margin:0 0 10px; font:900 clamp(25px,3vw,38px)/1 'Arial Black',Impact,sans-serif; letter-spacing:-.055em; }
.code-card p { margin:0; max-width:480px; font-size:16px; line-height:1.5; color:#4b4942; }

.manifesto { background:var(--orange); color:var(--ink); padding:clamp(70px,10vw,140px) clamp(20px,7vw,100px) 60px; }
.manifesto-label { margin:0 0 50px; }
.manifesto h2 { font-size:clamp(58px,12vw,180px); line-height:.79; }
.manifesto h2 span { -webkit-text-stroke:2px var(--ink); color:transparent; }
.manifesto h2 em { color:var(--acid); font-style:normal; }
.manifesto-footer { margin-top:70px; display:flex; justify-content:space-between; align-items:end; border-top:2px solid var(--ink); padding-top:25px; }
.manifesto-footer p { margin:0; font-size:16px; line-height:1.4; font-weight:700; }
.button-light { background:var(--paper); }

footer { min-height:120px; padding:30px clamp(20px,5vw,72px); background:var(--ink); color:var(--paper); display:flex; justify-content:space-between; align-items:center; gap:30px; }
footer p,footer>a:last-child { font-size:10px; font-weight:800; letter-spacing:.12em; }
.footer-mark { font-size:34px; }

@media (max-width:850px) {
  .nav-note { display:none; }
  .site-nav { grid-template-columns:1fr 1fr; }
  .hero { grid-template-columns:1fr; padding-top:65px; }
  .hero-poster { width:min(88%,420px); margin:20px auto 30px; }
  .hero::before { mask-image:none; }
  .codes { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .site-nav { height:70px; }
  .nav-link { font-size:10px; }
  .hero { min-height:auto; padding-bottom:90px; }
  .hero h1 { font-size:clamp(68px,25vw,112px); }
  .hero-description { margin-top:28px; }
  .hero-poster { box-shadow:9px 9px 0 var(--ink); padding:22px; }
  .side-note { display:none; }
  .code-card { grid-template-columns:58px 1fr; column-gap:14px; }
  .manifesto-footer { align-items:stretch; flex-direction:column; gap:28px; }
  .manifesto-footer .button { width:100%; }
  footer { flex-wrap:wrap; }
  footer p { order:3; flex-basis:100%; }
}
