:root{--navy:#0b1d3a;--navy2:#13294f;--gold:#d4a62a;--cream:#f4ead5;--purple:#9146ff;--orange:#e8772e;--red:#c8442b;--grass:#5a9e3a;--dirt:#7a5230}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--cream);font:17px/1.65 "Roboto Slab",Georgia,serif}
a{color:var(--gold)}img{max-width:100%;display:block}
.px{font-family:"Press Start 2P",monospace;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase}
h1,h2,h3{font-family:"Black Ops One",Impact,sans-serif;font-weight:400;letter-spacing:.04em;line-height:1.15;color:#fff}
.stripes{height:12px;background:linear-gradient(var(--gold) 0 25%,var(--orange) 25% 50%,var(--red) 50% 75%,var(--purple) 75%)}
header{position:sticky;top:0;z-index:9;background:rgba(11,29,58,.96);border-bottom:3px solid var(--gold)}
.nav{max-width:1100px;margin:auto;display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:#fff;font-family:"Black Ops One";font-size:1.4rem}
.brand img{width:36px;height:36px;border:2px solid var(--gold);image-rendering:pixelated}
.nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem;margin:0 0 0 auto;padding:0}
.nav ul a{display:block;padding:.5rem .6rem;color:var(--cream);text-decoration:none;border:2px solid transparent}
.nav ul a:hover,.nav ul a[aria-current]{border-color:var(--gold);color:var(--gold)}
.menu-btn{display:none;margin-left:auto;background:none;border:2px solid var(--gold);color:var(--gold);padding:.5rem .7rem;cursor:pointer}
@media(max-width:820px){.menu-btn{display:block}.nav ul{display:none;width:100%;flex-direction:column}.nav ul.open{display:flex}}
.hero{position:relative;min-height:62vh;display:grid;place-items:end start;background:linear-gradient(180deg,rgba(11,29,58,.15),rgba(11,29,58,.95)),url(/img/vf201-hero.jpg) center/cover}
.hero::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.12) 0 1px,transparent 1px 3px);pointer-events:none}
.hero .in{position:relative;z-index:1;max-width:1100px;width:100%;margin:auto;padding:3rem 1rem}
.hero h1{font-size:clamp(2.6rem,8vw,5.5rem);margin:.3rem 0;text-shadow:4px 4px 0 var(--purple),8px 8px 0 rgba(0,0,0,.4)}
.hero p{max-width:620px;font-size:1.1rem}
.rec{color:var(--red)}.rec::before{content:"● "}
.wrap{max-width:1100px;margin:auto;padding:3.5rem 1rem}
.kicker{color:var(--gold);display:flex;align-items:center;gap:.8rem}
.kicker::after{content:"";flex:1;height:0;border-top:3px dotted var(--gold);opacity:.6}
.rope{height:14px;background:radial-gradient(circle at 7px 7px,var(--gold) 4px,transparent 5px) 0 0/14px 14px;opacity:.5;margin:0}
.ribbon{display:inline-flex;border:2px solid #000;box-shadow:2px 2px 0 #000}.ribbon i{width:18px;height:10px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.card{background:var(--navy2);border:3px solid #000;box-shadow:6px 6px 0 #000;outline:2px solid var(--gold);outline-offset:-8px;overflow:hidden}
.card img{aspect-ratio:4/3;object-fit:cover;width:100%;border-bottom:3px solid #000}
.card .b{padding:1.2rem 1.4rem 1.6rem}.card h3{margin:.4rem 0}
.block{display:inline-block;width:14px;height:14px;background:linear-gradient(var(--grass) 0 40%,var(--dirt) 40%);box-shadow:inset -2px -2px 0 rgba(0,0,0,.3);vertical-align:middle;margin-right:.4rem}
.btn{display:inline-block;padding:.85rem 1.2rem;background:var(--gold);color:var(--navy);text-decoration:none;border:3px solid #000;box-shadow:4px 4px 0 #000;font-family:"Press Start 2P";font-size:.65rem}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 #000}.btn.tw{background:var(--purple);color:#fff}
.socials{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}
.socials a{padding:.55rem .8rem;border:2px solid var(--gold);text-decoration:none}
.panel{background:var(--cream);color:var(--navy);border:3px solid #000;box-shadow:8px 8px 0 var(--gold);padding:2rem}
.panel h1,.panel h2,.panel h3{color:var(--navy)}.panel a{color:#5b2bc0}
table{width:100%;border-collapse:collapse}td,th{padding:.6rem;border-bottom:2px dashed rgba(11,29,58,.25);text-align:left;vertical-align:top}
code{font-family:"Press Start 2P",monospace;font-size:.62rem;background:var(--navy);color:var(--gold);padding:.25rem .4rem;display:inline-block;margin:.12rem}
.placeholder{border:2px dashed var(--orange);padding:1rem;color:var(--orange);background:rgba(232,119,46,.08)}
.cassette{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}@media(max-width:820px){.cassette{grid-template-columns:1fr}}
.hours td{border-color:rgba(244,234,213,.2)}
footer{border-top:3px solid var(--gold);background:#071328;text-align:center;padding:2rem 1rem}
.doc p{margin:0 0 1rem}.doc ul{padding-left:1.2rem}.imgnote{font-style:italic;opacity:.7;border-left:4px solid var(--gold);padding-left:.7rem}
.dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.2rem}.dl .card img{aspect-ratio:auto;object-fit:contain;background:#000}
body{overflow-x:hidden}h1{overflow-wrap:anywhere}@media(max-width:480px){.hero h1{font-size:2.3rem}}
