@import "tailwindcss";

:root { --ink:#070707; --paper:#f7f3ea; --red:#e31616; --gold:#ffc800; --line:#302a26; }
* { 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; }
.announcement { padding:10px 5vw; color:#fff; background:#b90808; font-size:12px; font-weight:800; letter-spacing:.11em; text-align:right; text-transform:uppercase; }
.announcement span { color:var(--gold); margin:0 10px; }
.topbar { min-height:104px; display:flex; align-items:center; gap:24px; padding:14px 5vw; border-bottom:2px solid #b90808; background:#050505; }
.brand { width:170px; flex:none; display:block; line-height:0; }
.brand img { display:block; width:100%; height:76px; object-fit:contain; object-position:left center; }
.tagline { margin:0; padding-left:20px; border-left:1px solid #4a1515; color:#e8e4dc; font-style:italic; font-size:17px; font-weight:900; line-height:1; letter-spacing:-.8px; transform:skew(-8deg); }.tagline b { color:var(--red); }
nav { display:flex; gap:18px; margin-left:auto; font-size:13px; font-weight:900; text-transform:uppercase; } nav a:hover,.shop-link:hover { color:var(--gold); }
.shop-link { padding:12px 16px; border:1px solid var(--red); color:#fff; font-size:12px; font-weight:900; text-transform:uppercase; white-space:nowrap; }.shop-link i { color:var(--red); font-style:normal; font-size:16px; }
.hero { min-height:600px; display:grid; grid-template-columns:1.1fr .9fr; overflow:hidden; border-bottom:2px solid var(--red); background:radial-gradient(circle at 78% 38%, #3d0606 0, #150606 24%, transparent 46%), repeating-linear-gradient(-33deg, transparent 0 48px, rgba(225,20,20,.08) 49px 51px, transparent 52px 108px), #090909; }
.hero-copy { position:relative; z-index:1; padding:116px 7vw 85px; }.eyebrow,.section-kicker { margin:0 0 12px; color:var(--red); font-size:13px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }.hero h1 { margin:0; font-family:"Arial Black", Impact, sans-serif; font-size:clamp(54px,7vw,112px); line-height:.78; letter-spacing:-.075em; }.hero h1 span,.hero h1 em { display:block; }.hero h1 span { color:#f4f0e8; }.hero h1 em { padding-left:.05em; color:var(--red); font-style:normal; text-shadow:4px 4px 0 #6c0606; }.hero-text { max-width:520px; margin:28px 0; color:#d7d0c8; font-size:18px; line-height:1.45; }.actions { display:flex; flex-wrap:wrap; gap:12px; }.button { display:inline-block; padding:16px 22px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }.primary { background:var(--red); border:2px solid var(--red); color:#fff; }.primary:hover { background:#fff; color:#111; }.secondary { border:2px solid #fff; }.secondary:hover { border-color:var(--gold); color:var(--gold); }
.shop-everything { padding:20px 28px; box-shadow:6px 6px 0 #720606; font-size:15px; }.shop-everything i { color:var(--gold); font-size:20px; font-style:normal; }.simple-shop { margin:20px 0 0; color:#aea39a; font-size:13px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.championship { display:grid; place-items:center; padding:30px; }.quality-stamp { position:relative; width:min(465px,98%); aspect-ratio:1; overflow:hidden; border:3px solid var(--gold); border-radius:50%; background:#150303; box-shadow:0 0 0 10px #120807,0 0 0 13px var(--red),0 0 0 17px #251507,0 0 70px #bf0b0b; transform:rotate(5deg); }.quality-stamp::after { content:""; position:absolute; inset:11px; border:2px solid rgba(255,200,0,.7); border-radius:50%; pointer-events:none; }.quality-stamp img { width:100%; height:100%; object-fit:cover; clip-path:circle(46% at 50% 50%); transform:rotate(-5deg) scale(1.06); }
.promises { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; border-top:2px solid var(--red); border-bottom:2px solid var(--red); background:var(--red); }.promises article { position:relative; isolation:isolate; min-height:190px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; padding:28px; background:linear-gradient(145deg,#1c0606,#090909 64%); }.promises article::before { content:""; position:absolute; z-index:-1; width:155px; height:155px; top:-72px; right:-72px; border:18px solid rgba(227,22,22,.42); transform:rotate(45deg); }.promises article::after { position:absolute; z-index:-1; right:-6px; bottom:-22px; color:rgba(255,255,255,.055); font-family:"Arial Black",Impact,sans-serif; font-size:126px; line-height:1; letter-spacing:-.12em; }.promises article:nth-child(1)::after { content:"W"; }.promises article:nth-child(2) { background:linear-gradient(145deg,#291608,#090909 64%); }.promises article:nth-child(2)::before { border-color:rgba(255,200,0,.38); }.promises article:nth-child(2)::after { content:"12"; color:rgba(255,200,0,.08); }.promises article:nth-child(3) { background:linear-gradient(145deg,#310707,#090909 64%); }.promises article:nth-child(3)::after { content:"CC"; }.promises article:nth-child(4) { background:linear-gradient(145deg,#4a0909,#090909 67%); }.promises article:nth-child(4)::after { content:"7"; color:rgba(255,200,0,.09); }.promises b,.promises span { position:relative; display:block; }.promises b { color:#fff; font-family:"Arial Black",Impact,sans-serif; font-size:clamp(19px,1.75vw,28px); line-height:.85; letter-spacing:-.07em; text-shadow:3px 3px 0 #750707; }.promises span { max-width:190px; margin-top:14px; color:#d9cec3; font-size:14px; font-weight:700; line-height:1.35; }.promises article:nth-child(2) b,.promises article:nth-child(4) b { color:var(--gold); text-shadow:3px 3px 0 #6d3500; }
.lex-drop { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:56px; overflow:hidden; padding:86px 7vw; border-top:2px solid var(--gold); border-bottom:2px solid var(--red); background:radial-gradient(circle at 77% 65%,#4c0808 0,transparent 32%),#090909; }.lex-copy h2 { margin:0; color:#fff; font-family:"Arial Black",Impact,sans-serif; font-size:clamp(42px,5vw,78px); line-height:.82; letter-spacing:-.08em; }.lex-copy h2 em { color:var(--gold); font-style:normal; text-shadow:4px 4px #7d0a0a; }.lex-copy>p:not(.section-kicker) { max-width:420px; margin:24px 0 30px; color:#d8cec4; font-size:18px; line-height:1.45; }.lex-panel { position:relative; min-height:470px; overflow:hidden; border:3px solid var(--gold); clip-path:polygon(0 7%,6% 0,91% 4%,100% 16%,95% 100%,8% 96%,0 84%); background:radial-gradient(circle at 50% 105%,#9d0b0b 0 5%,#f6ad0f 6% 10%,#320505 11% 24%,#070707 25%); box-shadow:10px 10px 0 var(--red); }.lex-panel::before { content:""; position:absolute; z-index:7; inset:13px; border:2px solid rgba(255,255,255,.7); clip-path:polygon(0 7%,6% 0,91% 4%,100% 16%,95% 100%,8% 96%,0 84%); pointer-events:none; }.impact-doors { position:absolute; z-index:2; inset:0; display:grid; grid-template-columns:1fr 1fr; pointer-events:none; }.impact-doors span { border:1px solid rgba(255,200,0,.55); background:repeating-linear-gradient(-35deg,#120304 0 18px,#370606 19px 22px); animation:doors-open 6s cubic-bezier(.16,.9,.22,1) infinite; }.impact-doors span:last-child { animation-name:doors-open-right; }.lex-panel img { position:absolute; z-index:3; top:50%; left:50%; width:min(92%,590px); height:auto; transform:translate(-50%,-50%); filter:drop-shadow(8px 11px 0 #080000) drop-shadow(0 0 17px rgba(255,196,0,.6)); animation:lex-flight 6s cubic-bezier(.19,.8,.18,1) infinite; }.dust-cloud { position:absolute; z-index:5; inset:auto 8% -18% 8%; height:58%; pointer-events:none; animation:dust-rise 6s cubic-bezier(.15,.8,.25,1) infinite; }.dust-cloud i { position:absolute; bottom:0; width:clamp(74px,13vw,150px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 36% 28%,#6d6a63 0 8%,#3c3a36 28%,#151515 66%,rgba(4,4,4,0) 71%); filter:blur(3px); }.dust-cloud i:nth-child(1){left:4%;}.dust-cloud i:nth-child(2){left:20%;bottom:12%;transform:scale(1.18)}.dust-cloud i:nth-child(3){left:39%;bottom:1%;transform:scale(1.44)}.dust-cloud i:nth-child(4){right:19%;bottom:14%;transform:scale(1.05)}.dust-cloud i:nth-child(5){right:4%;bottom:0;transform:scale(1.3)}.impact-word { position:absolute; z-index:6; right:6%; bottom:7%; color:#fff; font-family:"Arial Black",Impact,sans-serif; font-size:clamp(40px,6vw,90px); font-style:italic; letter-spacing:-.1em; text-shadow:4px 4px 0 var(--red),8px 8px 0 #050505; animation:impact-pop 6s ease-in-out infinite; }.lex-drop .button i { color:var(--gold); font-size:20px; font-style:normal; }@keyframes lex-flight { 0%,7% { transform:translate(-50%,-178%) rotate(-8deg) scale(.6); opacity:0; } 13% { opacity:1; } 44% { transform:translate(-50%,-48%) rotate(1deg) scale(1); opacity:1; } 54% { transform:translate(-50%,145%) rotate(11deg) scale(.67); opacity:1; } 58%,100% { transform:translate(-50%,175%) rotate(15deg) scale(.5); opacity:0; } }@keyframes doors-open { 0%,56% { transform:translateX(0); } 65%,86% { transform:translateX(-108%); } 96%,100% { transform:translateX(0); } }@keyframes doors-open-right { 0%,56% { transform:translateX(0); } 65%,86% { transform:translateX(108%); } 96%,100% { transform:translateX(0); } }@keyframes dust-rise { 0%,56% { transform:translateY(38%) scale(.3); opacity:0; } 64% { transform:translateY(0) scale(1); opacity:1; } 82% { transform:translateY(-35%) scale(1.3); opacity:.7; } 96%,100% { transform:translateY(-58%) scale(1.5); opacity:0; } }@keyframes impact-pop { 0%,57% { transform:scale(.18) rotate(-22deg); opacity:0; } 65%,82% { transform:scale(1.08) rotate(-10deg); opacity:1; } 92%,100% { transform:scale(.7) rotate(-10deg); opacity:0; } }
.section { padding:88px 6vw; }.section h2,.custom h2,.crew h2 { margin:0; font-family:"Arial Black", Impact, sans-serif; font-size:clamp(38px,5vw,72px); line-height:.9; letter-spacing:-.06em; }.shop-now { text-align:center; border-top:2px solid var(--red); background:radial-gradient(circle at center, #3f0909 0, #110606 42%, #070707 74%); }.shop-now > p:not(.section-kicker) { max-width:570px; margin:22px auto 32px; color:#e0d6cd; font-size:18px; line-height:1.45; }
.listings { background:#0d0d0d; border-top:1px solid var(--line); }.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; }.section-heading>a { color:var(--gold); font-size:14px; font-weight:900; text-transform:uppercase; }.product-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:14px; margin-top:36px; }.product { min-width:0; }.product-art { height:190px; display:grid; place-items:center; overflow:hidden; border:1px solid #333; background:linear-gradient(145deg,#302b2b,#080808 58%); }.product:nth-child(2n) .product-art { background:linear-gradient(145deg,#55100d,#080808 65%); }.product-art span { color:var(--gold); font-family:"Arial Black",Impact,sans-serif; font-size:44px; transform:rotate(-7deg); text-shadow:3px 3px 0 #8a0b0b; }.product h3 { margin:14px 0 4px; font-size:15px; }.product p { margin:0; color:#9f958b; font-size:12px; }.product:hover h3 { color:var(--gold); }
.ebay-picks { border-top:1px solid var(--line); background:#0d0d0d; }.ebay-pick-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:36px; }.ebay-pick { min-height:250px; display:flex; flex-direction:column; justify-content:flex-end; padding:30px; border:1px solid #5a1111; background:linear-gradient(135deg,#4a0707,#150707 55%,#070707); transition:transform .2s ease, border-color .2s ease; }.ebay-pick:hover { border-color:var(--gold); transform:translateY(-4px); }.ebay-pick span,.ebay-pick i { color:var(--gold); font-size:12px; font-style:normal; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }.ebay-pick b { margin:10px 0; color:#fff; font-family:"Arial Black",Impact,sans-serif; font-size:clamp(34px,4vw,54px); line-height:.9; letter-spacing:-.07em; }.ebay-pick p { max-width:360px; margin:0 0 24px; color:#d6cdc4; font-size:16px; line-height:1.4; }
.collector-reach { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:50px; border-top:2px solid var(--red); background:#070707; }.collector-reach > div > p:not(.section-kicker) { max-width:540px; color:#d6cdc4; font-size:18px; line-height:1.5; }.map-panel { min-height:290px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:30px; border:1px solid #612020; text-align:center; background:radial-gradient(ellipse at center,rgba(195,19,19,.3),transparent 58%),repeating-radial-gradient(circle at 35% 45%,transparent 0 8px,rgba(255,200,0,.14) 9px 10px,transparent 11px 24px),#100909; }.map-panel span,.map-panel small { color:var(--gold); font-size:11px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }.map-panel strong { margin:15px 0; color:#fff; font-family:"Arial Black",Impact,sans-serif; font-size:clamp(38px,5vw,70px); line-height:.82; letter-spacing:-.08em; text-shadow:4px 4px #7b0808; }
.custom { padding:100px 8vw; border-top:2px solid var(--red); background:linear-gradient(120deg,#580b0b,#120202 53%,#070707); }.custom h2 em { color:var(--gold); font-style:normal; }.custom>p:not(.section-kicker) { max-width:630px; color:#e0d6cd; font-size:18px; line-height:1.5; }
.crew { display:flex; align-items:center; justify-content:space-between; gap:50px; padding:70px 7vw; background:var(--gold); color:#100d09; }.crew .section-kicker { color:#a50a0a; }.crew h2 { font-size:clamp(36px,4vw,58px); }.crew p:not(.section-kicker) { font-size:16px; }.crew form { display:flex; min-width:min(470px,100%); }.crew input { width:100%; padding:16px; border:2px solid #16110b; background:#fff8e7; font:inherit; }.crew button { padding:0 20px; border:2px solid #16110b; background:#17120d; color:#fff; font-weight:900; text-transform:uppercase; white-space:nowrap; cursor:pointer; }.crew button:hover { background:var(--red); }
footer { padding:50px 7vw; background:#070707; }.footer-brand { color:var(--gold); font-family:"Arial Black",Impact,sans-serif; font-size:31px; letter-spacing:-.07em; }.footer-brand+p { color:#b8aca2; font-weight:700; }.footer-brand~div { display:flex; flex-wrap:wrap; gap:22px; margin:30px 0; color:#fff; font-size:13px; font-weight:900; text-transform:uppercase; }.footer-brand~div a:hover { color:var(--gold); } footer small { color:#776e65; }.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
@media(max-width:900px){.topbar{flex-wrap:wrap}.tagline{display:none}nav{order:3;width:100%;margin:0;justify-content:space-between}.hero{grid-template-columns:1fr}.championship{display:none}.promises{grid-template-columns:repeat(2,1fr)}.lex-drop{grid-template-columns:1fr;gap:36px}.product-grid{grid-template-columns:repeat(3,1fr)}.collector-reach{grid-template-columns:1fr}.crew{display:block}.crew form{margin-top:28px}.announcement{text-align:center}}
@media(max-width:560px){.announcement{font-size:10px}.topbar{gap:12px;padding:13px 5vw}.brand{width:126px}.brand img{height:58px}.shop-link{margin-left:auto;padding:10px;font-size:10px}nav{font-size:11px;gap:8px}.hero-copy{padding:80px 6vw}.hero h1{font-size:57px}.promises{grid-template-columns:1fr}.promises article{min-height:154px;padding:25px 22px}.promises b{font-size:25px}.section,.custom{padding:64px 6vw}.section-heading{align-items:start;flex-direction:column}.product-grid,.ebay-pick-grid{grid-template-columns:1fr}.product-art{height:145px}.ebay-pick{min-height:210px;padding:24px}.collector-reach{gap:32px}.map-panel{min-height:230px}.crew{padding:60px 6vw}.crew form{display:block}.crew input,.crew button{width:100%;height:52px}.crew button{margin-top:8px}.shop-everything{width:100%;padding:18px 15px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.impact-doors{display:none}.lex-panel img,.impact-word,.dust-cloud{animation:none}.lex-panel img{transform:translate(-50%,-50%)}.impact-word{opacity:1}.dust-cloud{display:none}}
.sound-hint{display:block;margin-top:16px;color:#b7aa9e;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.lex-panel img,.impact-doors span,.dust-cloud,.impact-word{animation-play-state:paused}body.sound-ready .lex-panel img,body.sound-ready .impact-doors span,body.sound-ready .dust-cloud,body.sound-ready .impact-word{animation-play-state:running}