:root { --ink:#090909; --paper:#e9e7e1; --muted:#a8a7a2; --line:rgba(233,231,225,.17); --acid:#ddff48; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--paper); background:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
.skip-link { position:fixed; top:-4rem; left:1rem; padding:.75rem 1rem; z-index:20; background:var(--acid); color:#111; }.skip-link:focus { top:1rem; }
.site-header { align-items:center; display:flex; justify-content:space-between; padding:1.4rem clamp(1.25rem,4vw,4.5rem); position:absolute; top:0; width:100%; z-index:5; }
.wordmark { font-family:Consolas,"Courier New",monospace; font-size:.77rem; font-weight:500; letter-spacing:.17em; }.wordmark span { color:#aaa; }
nav { display:flex; gap:2rem; font-family:Consolas,"Courier New",monospace; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; } nav a:hover,.site-footer a:hover { color:var(--acid); }
.menu-toggle { display:none; }
.hero { min-height:100svh; overflow:hidden; position:relative; display:flex; align-items:flex-end; padding:clamp(7rem,15vh,11rem) clamp(1.25rem,7vw,8rem) clamp(3rem,8vw,6rem); isolation:isolate; }
.hero::after { content:""; inset:0; position:absolute; background:linear-gradient(90deg,rgba(0,0,0,.7),rgba(0,0,0,.04) 70%),linear-gradient(0deg,rgba(0,0,0,.94),transparent 50%); z-index:-1; }
.hero-logo { inset:0; width:100%; height:100%; object-fit:cover; position:absolute; z-index:-2; }
.hero-content { max-width:47rem; }.eyebrow { color:var(--acid); font-family:Consolas,"Courier New",monospace; font-size:.7rem; letter-spacing:.13em; line-height:1.4; margin:0 0 1.2rem; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; } h1,h2,h3 { font-weight:500; letter-spacing:-.055em; } h1 { font-size:clamp(3.35rem,8vw,8rem); line-height:.89; margin-bottom:2rem; } h2 { font-size:clamp(3.1rem,6vw,6.6rem); line-height:.88; margin-bottom:0; } h3 { font-size:clamp(2.4rem,4vw,4.8rem); line-height:.88; margin:0 0 1.6rem; }
.button { display:inline-flex; gap:1rem; align-items:center; font-family:Consolas,"Courier New",monospace; font-size:.7rem; letter-spacing:.1em; padding:1rem 1.2rem; text-transform:uppercase; }.button-primary { background:var(--acid); color:#101010; }.button-primary:hover { background:#f4ffd0; }
.section { padding:clamp(5rem,11vw,10rem) clamp(1.25rem,7vw,8rem); }.section-heading { border-bottom:1px solid var(--line); display:flex; justify-content:space-between; padding-bottom:1.5rem; margin-bottom:1px; }.section-heading .eyebrow { margin:0; }
.game-grid { border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; }.game-card { min-height:31rem; padding:2rem; display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; background:#151515; }.game-card + .game-card { border-left:1px solid var(--line); }.game-card::before { content:""; inset:0; position:absolute; background:radial-gradient(circle at 85% 15%,var(--glow),transparent 42%); opacity:.6; }.trenchworms { --glow:#572514; }.within { --glow:#203e3c; }.game-card > * { position:relative; }.game-number { color:var(--muted); font-family:Consolas,"Courier New",monospace; font-size:.7rem; }.game-copy { color:#c5c3bc; font-size:1.05rem; line-height:1.5; max-width:25rem; }.card-actions { display:flex; flex-wrap:wrap; gap:1.3rem; }.text-link { border-bottom:1px solid var(--acid); font-family:Consolas,"Courier New",monospace; font-size:.7rem; letter-spacing:.07em; padding-bottom:.45rem; text-transform:uppercase; }.text-link:hover { color:var(--acid); }
.about-section { background:#d8d6d0; color:#101010; }.about-section .eyebrow { color:#444; }.about-layout { display:grid; grid-template-columns:1.15fr .85fr; gap:3rem; align-items:start; }.about-copy { font-size:clamp(1.15rem,1.7vw,1.65rem); line-height:1.35; padding-top:.45rem; }.about-copy p:last-child { color:#555; }
.contact-section { background:linear-gradient(135deg,#121212,#24241a); min-height:65vh; display:flex; flex-direction:column; justify-content:center; }.contact-section h2 { margin-bottom:2.5rem; }.contact-email { border-bottom:2px solid var(--acid); color:var(--acid); display:inline-flex; justify-content:space-between; font-family:Consolas,"Courier New",monospace; font-size:clamp(1rem,2.5vw,2.1rem); max-width:48rem; padding-bottom:.75rem; }.contact-email:hover { color:#fff; }
.site-footer { color:#94938e; display:flex; justify-content:space-between; font-family:Consolas,"Courier New",monospace; font-size:.68rem; letter-spacing:.08em; padding:1.4rem clamp(1.25rem,7vw,8rem); text-transform:uppercase; }
@media (max-width:680px) { .site-header { padding:1.2rem; }.wordmark { font-size:.64rem; }.menu-toggle { display:block; padding:.55rem .7rem; background:transparent; border:1px solid #858585; color:#fff; font:inherit; font-family:Consolas,"Courier New",monospace; font-size:.65rem; letter-spacing:.09em; text-transform:uppercase; } nav { display:none; position:absolute; right:1.2rem; top:4.4rem; flex-direction:column; gap:1rem; padding:1rem; background:#151515; border:1px solid #444; } nav.is-open { display:flex; }.hero { padding-left:1.25rem; padding-right:1.25rem; }.hero-logo { object-position:60% center; }.game-grid,.about-layout { grid-template-columns:1fr; }.game-card { min-height:25rem; }.game-card + .game-card { border-left:0; border-top:1px solid var(--line); }.section { padding-left:1.25rem; padding-right:1.25rem; }.site-footer { padding:1.3rem 1.25rem; gap:1rem; }.about-copy { padding-top:0; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }