:root{
  --ink:#1b1030; --wall:#ece6f3; --line:#2a1b3d; --paper:#fbf7ee; --manila:#e9d29c;
  --pink:#ff3d9a; --violet:#7a2bd9; --orange:#ff8a3d; --gold:#ffc65c;
  --red:#ff2a3d; --blue:#2b6bff; --tape:#ffd400; --night:#150a24;
  --display:'Anton',Impact,sans-serif; --type:'Special Elite','Courier New',monospace;
  --body:'Inter',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;overflow-x:hidden}
body{min-width:1180px;background:var(--wall);color:var(--ink);font:400 17px/1.55 var(--body);overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:1240px;margin:0 auto;position:relative}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:800 15px/1 var(--body);
  text-transform:uppercase;letter-spacing:.06em;padding:14px 22px;border:3px solid var(--ink);border-radius:999px;
  cursor:pointer;transition:transform .15s,box-shadow .15s;box-shadow:4px 4px 0 var(--ink);background:#fff;color:var(--ink)}
.btn:hover{transform:translate(-2px,-2px) rotate(-1.5deg);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn--pink{background:var(--pink);color:#fff}
.btn--big{font-size:18px;padding:18px 30px}
.btn--ghost{background:transparent;color:#fff;border-color:#fff;box-shadow:4px 4px 0 var(--pink)}
.btn--copy{background:var(--gold);padding:10px 18px;box-shadow:3px 3px 0 var(--ink)}
.btn.is-done{background:#3ee08a}

/* nav */
.nav{position:fixed;inset:0 0 auto;z-index:50;height:64px;display:flex;align-items:center;gap:28px;padding:0 32px;
  background:rgba(21,10,36,.86);backdrop-filter:blur(10px);color:#fff;border-bottom:3px solid var(--pink)}
.nav__brand{font:400 26px/1 var(--display);letter-spacing:.02em;text-transform:uppercase}
.heat{display:flex;align-items:center;gap:10px}
.heat__label{font:700 11px/1 var(--mono);text-transform:uppercase;letter-spacing:.14em;opacity:.7}
.heat__stars{display:flex;gap:3px}
.heat__stars svg{width:22px;height:22px;transition:transform .3s}
.heat__stars svg path{fill:transparent;stroke:#fff;stroke-width:2.2;transition:fill .3s}
.heat__stars svg.on path{fill:#fff}
.heat__stars svg.on{animation:starpop .45s}
.heat.max .heat__stars svg.on path{animation:blink .5s steps(1) infinite}
@keyframes starpop{50%{transform:scale(1.5) rotate(20deg)}}
@keyframes blink{50%{fill:var(--red);stroke:var(--red)}}
.nav__links{margin-left:auto;display:flex;align-items:center;gap:24px;font:600 15px/1 var(--body)}
.nav__links a:not(.btn):hover{color:var(--pink)}
.nav__links .btn{padding:10px 18px;font-size:13px;box-shadow:3px 3px 0 #000}

/* hero */
.hero{padding-top:64px;background:var(--night);position:relative}
.hero__frame{position:relative;overflow:hidden}
.hero__banner{width:100%;height:auto;transition:transform .4s ease-out;transform-origin:center}
.siren{position:absolute;top:-30%;width:45%;height:160%;z-index:2;pointer-events:none;mix-blend-mode:screen;opacity:0;filter:blur(40px)}
.siren--red{left:-15%;background:radial-gradient(closest-side,rgba(255,42,61,.55),transparent);animation:siren 1.2s infinite}
.siren--blue{right:-15%;background:radial-gradient(closest-side,rgba(43,107,255,.6),transparent);animation:siren 1.2s .6s infinite}
@keyframes siren{0%,40%{opacity:.9}50%,100%{opacity:0}}

.placard{position:relative;z-index:5;width:1240px;margin:-72px auto 0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  gap:36px;align-items:center;padding:26px 34px;background:#0e0718;color:#fff;border:4px solid #fff;border-radius:6px;
  box-shadow:10px 10px 0 var(--pink),0 30px 60px rgba(0,0,0,.45);transform:rotate(-.6deg)}
.placard__case{font:700 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.placard h1{font:400 64px/1 var(--display);text-transform:uppercase;letter-spacing:.01em;margin:8px 0 6px;white-space:nowrap}
.placard__tick{display:inline-block;font:700 20px/1 var(--mono);background:var(--pink);padding:6px 12px;border-radius:4px;transform:rotate(-3deg);animation:wiggle 2.4s ease-in-out infinite}
@keyframes wiggle{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
.label{display:block;font:700 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-bottom:10px}
.cabox{display:flex;align-items:center;gap:14px;background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:12px;padding:8px 8px 8px 18px}
.cabox code{flex:1;min-width:0;font:700 17px/1.35 var(--mono);word-break:break-all}
.placard__ca .cabox{border-color:#fff}
.placard__cta{display:flex;flex-direction:column;gap:14px}
.drop .ch{display:inline-block;opacity:0;transform:translateY(-60px) rotate(-12deg);animation:drop .55s cubic-bezier(.3,1.6,.5,1) forwards}
@keyframes drop{to{opacity:1;transform:none}}

/* police tape */
.tape{margin:56px -40px 0;background:var(--tape);border-block:4px solid var(--ink);transform:rotate(-1.6deg);overflow:hidden;position:relative;z-index:4}
.tape__track{display:flex;white-space:nowrap;width:max-content;animation:tape 26s linear infinite;font:400 30px/1 var(--display);text-transform:uppercase;padding:12px 0;color:var(--ink)}
.tape__track span{padding:0 22px}
.tape__track span.s{color:var(--pink)}
@keyframes tape{to{transform:translateX(-50%)}}

/* booking */
.booking{position:relative;padding:110px 0 120px;
  background:repeating-linear-gradient(to bottom,transparent 0 58px,rgba(42,27,61,.55) 58px 60px),var(--wall)}
.ruler{position:absolute;left:0;top:0;bottom:0;width:86px;background:rgba(255,255,255,.65);border-right:3px solid var(--line)}
.ruler span{position:absolute;left:12px;font:700 15px/1 var(--mono);color:var(--line);transform:translateY(-50%)}
.booking__head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:56px}
.mega{font:400 110px/.92 var(--display);text-transform:uppercase;letter-spacing:-.005em}
.mega em{font-style:normal;color:var(--pink);-webkit-text-stroke:0}
.mega--light{color:#fff}
.note{max-width:420px;font-size:19px;background:var(--paper);padding:18px 22px;border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);transform:rotate(1deg)}
.note--light{background:transparent;color:#fff;border:0;box-shadow:none;padding:0;transform:none;opacity:.9}
.mugs{display:grid;grid-template-columns:1fr 1fr;gap:56px;padding:0 40px}
.mug{position:relative;background:#fff;padding:16px 16px 0;border:3px solid var(--ink);box-shadow:12px 12px 0 var(--ink);transform:rotate(-1.4deg);transition:transform .3s}
.mug--tilt{transform:rotate(1.6deg) translateY(30px)}
.mug:hover{transform:rotate(0) scale(1.02)}
.mug img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}
.mug__plate{position:absolute;left:50%;bottom:36px;transform:translateX(-50%) rotate(-1deg);background:#0e0718;color:#fff;
  padding:12px 26px 10px;border:3px solid #fff;text-align:center;min-width:62%;box-shadow:0 10px 24px rgba(0,0,0,.4)}
.mug__plate b{display:block;font:400 44px/1 var(--display);letter-spacing:.06em}
.mug__plate span{display:block;font:700 22px/1.2 var(--mono);color:var(--pink)}
.mug__plate i{display:block;font:500 12px/1.4 var(--mono);font-style:normal;letter-spacing:.14em;opacity:.75}
.mug::after{content:"";display:block;height:16px}
.flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.mug.shot .flash{animation:flash .7s ease-out}
@keyframes flash{0%{opacity:0}8%{opacity:1}100%{opacity:0}}

/* rap sheet */
.rap{padding:120px 0;background:linear-gradient(135deg,#3a1460,#7a2bd9 55%,#ff3d9a);position:relative;overflow:hidden}
.rap::before{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.12) 1.5px,transparent 2px) 0 0/22px 22px}
.rap__grid{display:grid;grid-template-columns:minmax(0,1fr) 560px;gap:70px;align-items:center}
.sheet{position:relative;background:var(--paper);padding:40px 46px;border:3px solid var(--ink);box-shadow:14px 14px 0 var(--ink);transform:rotate(-1deg);font-family:var(--type)}
.sheet__top{display:flex;justify-content:space-between;font-size:14px;letter-spacing:.1em;border-bottom:2px dashed var(--ink);padding-bottom:12px}
.sheet__title{font:400 88px/1 var(--display);text-transform:uppercase;margin:22px 0 18px;color:var(--ink)}
.charges{list-style:none}
.charges li{display:flex;gap:20px;align-items:baseline;padding:13px 0;border-bottom:1px solid rgba(27,16,48,.18);font-size:24px;line-height:1.25}
.charges b{font:400 30px/1 var(--display);color:var(--pink)}
.sheet__foot{margin-top:22px;font-size:20px}
.sheet__foot b{background:var(--tape);padding:0 6px}
.exhibit{position:relative;background:#fff;padding:18px 18px 64px;border:3px solid var(--ink);box-shadow:14px 14px 0 rgba(0,0,0,.45);transform:rotate(2.4deg)}
.exhibit img{width:100%;height:auto}
.exhibit figcaption{position:absolute;left:18px;right:18px;bottom:18px;font:400 22px/1 var(--type);text-align:left}
.clip{position:absolute;top:-26px;left:42%;width:46px;height:78px;border:6px solid #9aa0ad;border-radius:24px;z-index:3;transform:rotate(-8deg)}
.stamp{position:absolute;right:-46px;bottom:-26px;z-index:4;font:400 54px/1 var(--display);color:var(--red);background:rgba(251,247,238,.94);border:6px solid var(--red);padding:6px 18px 2px;
  border-radius:8px;transform:rotate(-12deg) scale(3);opacity:0;letter-spacing:.05em;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.exhibit.in .stamp{animation:stamp .45s cubic-bezier(.2,1.6,.4,1) .3s forwards}
@keyframes stamp{to{opacity:1;transform:rotate(-12deg) scale(1)}}

/* officer */
.officer{background:var(--night);color:#fff;padding:110px 0}
.officer__grid{display:grid;grid-template-columns:440px minmax(0,1fr);gap:80px;align-items:center}
.officer__pic{position:relative;border:4px solid #fff;box-shadow:12px 12px 0 var(--blue);transform:rotate(-2deg)}
.officer__pic img{width:100%;aspect-ratio:4/5;object-fit:cover}
.officer__pic figcaption{position:absolute;left:0;right:0;bottom:0;background:rgba(14,7,24,.85);font:700 13px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;padding:14px 18px}
.kicker{display:inline-block;font:700 13px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.quote{font:400 96px/.98 var(--display);text-transform:uppercase;margin-bottom:28px}
.quote em{font-style:normal;color:var(--pink)}

/* pursuit — full-bleed scene at its natural 2.4:1 aspect, copy over the clear left 40% */
.pursuit{position:relative;color:#fff;overflow:hidden;background:#0f0620}
.scene{display:block;width:100%;height:auto}
.pursuit::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,6,32,.82),rgba(15,6,32,.35) 38%,transparent 55%)}
.pursuit__copy{position:absolute;z-index:2;top:50%;left:max(60px,calc(50vw - 620px));translate:0 -50%;max-width:520px}
.pursuit__copy.rv{translate:0 calc(-50% + 40px)} .pursuit__copy.rv.in{translate:0 -50%}

/* how to buy */
.surrender{padding:120px 0;background:repeating-linear-gradient(to bottom,transparent 0 58px,rgba(42,27,61,.18) 58px 60px),var(--wall)}
.surrender .mega{margin-bottom:56px}
.bags{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.bag{position:relative;background:rgba(255,255,255,.75);border:3px solid var(--ink);border-top:22px solid var(--red);border-radius:6px;padding:26px 24px 30px;box-shadow:8px 8px 0 var(--ink);transition:transform .2s}
.bag:nth-child(even){transform:rotate(1.5deg)} .bag:nth-child(odd){transform:rotate(-1.2deg)}
.bag:hover{transform:translateY(-8px) rotate(0)}
.bag__no{font:700 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.bag h3{font:400 34px/1.05 var(--display);text-transform:uppercase;margin:12px 0 10px}
.bag p{font-size:16px}

/* finale — full-bleed sunrise scene, copy over the clear left 45% */
.finale{position:relative;color:#fff;overflow:hidden;background:#2a0d4d}
.finale::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(21,10,36,.7),rgba(21,10,36,.25) 40%,transparent 55%)}
.finale__copy{position:absolute;z-index:2;top:50%;left:max(60px,calc(50vw - 620px));translate:0 -50%;width:600px}
.finale__copy.rv{translate:0 calc(-50% + 40px)} .finale__copy.rv.in{translate:0 -50%}
.stars-big{display:block;font-size:40px;letter-spacing:6px;color:#fff;text-shadow:3px 3px 0 var(--ink);margin-bottom:10px;animation:starshake 1.6s infinite}
@keyframes starshake{0%,100%{transform:none}10%{transform:translateX(-3px)}20%{transform:translateX(3px)}30%{transform:none}}
.finale .mega{font-size:100px;margin-bottom:26px;text-shadow:5px 5px 0 var(--ink)}
.finale .mega em{color:var(--gold)}
.cabox--dark{max-width:600px;border-color:#fff;box-shadow:8px 8px 0 var(--ink)}
.finale__cta{display:flex;gap:18px;margin-top:22px}

.foot{display:flex;justify-content:space-between;gap:30px;padding:26px 40px;background:#0e0718;color:rgba(255,255,255,.7);font:500 13px/1.5 var(--mono)}
.foot span:first-child{color:#fff}

/* reveal */
.rv{opacity:0;translate:0 40px;transition:opacity .7s,translate .7s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;translate:0 0}

/* confetti stars */
.boom{position:fixed;pointer-events:none;z-index:99;font-size:22px;line-height:1;will-change:transform,opacity}
.toast{position:fixed;z-index:100;pointer-events:none;font:400 30px/1 var(--display);color:#fff;background:var(--pink);border:3px solid var(--ink);
  padding:8px 16px;transform:translate(-50%,-50%) rotate(-6deg);box-shadow:4px 4px 0 var(--ink);animation:toast .9s forwards}
@keyframes toast{0%{opacity:0;scale:.3}20%{opacity:1;scale:1.15}35%{scale:1}100%{opacity:0;translate:0 -50px}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv,.drop .ch{opacity:1!important;translate:0 0!important}
  .drop .ch{transform:none!important}
  .exhibit .stamp{opacity:1;transform:rotate(-12deg)}
}
.pursuit .mega{margin-bottom:18px}
/* visitor counter chip (hidden until visit-counter.js fills the number) */
.foot{align-items:center}
.visits{display:none;align-items:center;gap:10px;flex:none;background:var(--tape);color:var(--ink);border:2px solid #fff;border-radius:999px;padding:6px 14px;font:700 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.visits:has(#website_visits_aaron:not([hidden])){display:flex}
.foot .visits span{color:var(--ink)}
#website_visits_aaron{font:400 18px/1 var(--display);letter-spacing:.04em;color:var(--pink)!important}