/* =====================================================================
   PERRY VISUALS — GAME-DAY UI · COMPLETE FINAL
   Brand: #191919 · #FFFFFF · #CBA85A · #C8101E · #484C50
   ===================================================================== */
:root{
  --bg:#191919; --bg-deep:#121314; --panel:#24262a;
  --ink:#ffffff; --ink-dim:#a6abb0;
  --paper:#ffffff; --paper-2:#eff0f1; --paper-ink:#191919; --paper-dim:#484c50;
  --red:#c8101e; --red-bright:#e01324;
  --gold:#cba85a; --gold-bright:#dcb96f;
  --line:rgba(255,255,255,.16); --hard-dark:#0d0d0e;
  --font-display:"Bungee","Arial Black",sans-serif;
  --font-body:"Space Grotesk","Segoe UI",sans-serif;
  --font-mono:"Space Mono","Courier New",monospace;
  --gutter:clamp(1.25rem,4vw,3rem);
  --sect:clamp(4.5rem,9vw,7.5rem);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top:96px; background:#191919; }
body{
  background-color:#191919;
  background-image:radial-gradient(rgba(203,168,90,.07) 1px,transparent 1.4px);
  background-size:26px 26px;
  color:var(--ink); font-family:var(--font-body); font-size:1.02rem; line-height:1.6;
  overflow-x:clip; -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul{ list-style:none; } figure{ margin:0; }
::selection{ background:var(--gold); color:var(--paper-ink); }
:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; border-radius:4px; }
::-webkit-scrollbar{ width:12px; }
::-webkit-scrollbar-track{ background:var(--bg-deep); }
::-webkit-scrollbar-thumb{ background:#3a3b3d; border-radius:99px; border:3px solid var(--bg-deep); }
::-webkit-scrollbar-thumb:hover{ background:var(--red); }
.skip-link{ position:fixed; top:-100px; left:16px; z-index:200; background:var(--gold); color:var(--paper-ink); padding:.7em 1.2em; border-radius:10px; font-weight:700; transition:top .2s; }
.skip-link:focus{ top:16px; }

main > section{ padding:var(--sect) var(--gutter); position:relative; }
.shell{ max-width:1180px; margin-inline:auto; position:relative; }

/* ---------- type ---------- */
.display{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; line-height:.95; letter-spacing:.01em; }
.display em{ font-style:normal; color:var(--gold); text-shadow:.06em .06em 0 var(--red); display:inline-block; transform:rotate(-1.5deg); }
.tag{ display:inline-flex; align-items:center; gap:.6em; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-dim); }
.tag::before{ content:"✦"; color:var(--red-bright); font-size:.9em; }
.chip{ display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; padding:.45em 1em; border:2px solid var(--line); border-radius:999px; white-space:nowrap; }
.chip-volt{ background:var(--gold); border-color:var(--paper-ink); color:var(--paper-ink); font-weight:700; }

/* ---------- buttons ---------- */
.button{ display:inline-flex; align-items:center; gap:.6em; font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:.95rem; padding:1em 1.5em; border:3px solid var(--paper-ink); border-radius:16px; text-decoration:none; transition:transform .16s ease, box-shadow .16s ease, background .16s ease; }
.button-red{ background:var(--red); color:#fff; box-shadow:6px 6px 0 var(--hard-dark); }
.button-red:hover{ transform:translate(-2px,-2px); box-shadow:9px 9px 0 var(--hard-dark); background:var(--red-bright); }
.button-red:active{ transform:translate(4px,4px); box-shadow:1px 1px 0 var(--hard-dark); }
.button-outline{ background:transparent; color:var(--ink); border-color:var(--line); }
.button-outline:hover{ border-color:var(--gold); color:var(--gold); transform:translateY(-2px); }
.button-dark{ background:var(--paper-ink); color:var(--paper); box-shadow:6px 6px 0 var(--red); }
.button-dark:hover{ transform:translate(-2px,-2px); box-shadow:9px 9px 0 var(--red); }
.chip-btn{ display:inline-flex; align-items:center; gap:.5em; background:var(--red); color:#fff; border:2.5px solid var(--paper-ink); border-radius:12px; padding:.65em 1.1em; font-weight:700; font-size:.82rem; letter-spacing:.05em; text-transform:uppercase; text-decoration:none; box-shadow:4px 4px 0 var(--paper-ink); transition:transform .15s, box-shadow .15s; }
.chip-btn:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--paper-ink); }
.chip-btn:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 var(--paper-ink); }
.big-link{ display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-display); font-size:clamp(1.05rem,2.6vw,1.6rem); text-transform:uppercase; background:var(--red); color:#fff; text-decoration:none; padding:.9em 1.3em; border:3px solid var(--paper-ink); border-radius:20px; box-shadow:10px 10px 0 var(--gold); transition:transform .18s, box-shadow .18s; }
.big-link:hover{ transform:translate(-3px,-3px) rotate(-1deg); box-shadow:14px 14px 0 var(--gold); }
.big-link:active{ transform:translate(5px,5px); box-shadow:2px 2px 0 var(--gold); }
.link-arrow{ display:inline-flex; gap:.5em; font-weight:700; text-decoration:none; border-bottom:3px solid var(--red); padding-bottom:.15em; transition:.15s; justify-self:start; }
.link-arrow:hover{ color:var(--gold); border-color:var(--gold); }
.link-ghost{ font-family:var(--font-mono); font-size:.8rem; letter-spacing:.12em; text-decoration:none; color:var(--ink-dim); border-bottom:2px dashed var(--line); padding-bottom:.3em; }
.link-ghost:hover{ color:var(--gold); border-color:var(--gold); }

/* ---------- scroll progress ---------- */
.scroll-progress{ position:fixed; top:0; left:0; right:0; height:4px; z-index:100; background:linear-gradient(90deg,var(--red),var(--gold)); transform-origin:left; transform:scaleX(0); }

/* ---------- marquees ---------- */
.marquee{ overflow:hidden; background:var(--paper); color:var(--paper-ink); border-top:3px solid var(--paper-ink); border-bottom:3px solid var(--paper-ink); }
.marquee--bleed{ margin-inline:calc(var(--gutter) * -1); }
.marquee-track{ display:flex; width:max-content; animation:marq 26s linear infinite; will-change:transform; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee-group{ display:flex; align-items:center; }
.marquee-group span{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(.85rem,1.6vw,1.05rem); padding:.7em 1em; white-space:nowrap; }
.marquee-group i{ font-style:normal; color:var(--red); }
@keyframes marq{ to{ transform:translateX(-50%); } }
.tilt-strip{ transform:rotate(-1.2deg) scale(1.03); box-shadow:0 6px 0 rgba(0,0,0,.35); }
.marquee-big{ background:transparent; border:0; }
.marquee-big span{ font-size:clamp(2.1rem,6vw,4.3rem); padding:.3em .4em; }
.marquee-outline span{ color:transparent; -webkit-text-stroke:2.5px var(--red); }
.marquee-outline i{ color:var(--gold); }
@supports not (-webkit-text-stroke:1px black){ .marquee-outline span{ color:var(--red); } }

/* ---------- header / nav ---------- */
.site-header{ position:sticky; top:0; z-index:80; background:rgba(25,25,25,.96); border-bottom:2px solid var(--line); }
.header-inner{ max-width:1280px; margin-inline:auto; padding:.9rem var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand img{ height:46px; width:auto; }
.site-nav{ display:flex; align-items:center; gap:.35rem; z-index:1; }
.site-nav a{ display:inline-flex; align-items:center; gap:.45em; text-decoration:none; font-weight:600; font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; padding:.55em .9em; border-radius:999px; border:2px solid transparent; transition:.15s; }
.site-nav a span{ font-family:var(--font-mono); font-size:.68em; color:var(--red-bright); }
.site-nav a:hover{ border-color:var(--line); background:rgba(255,255,255,.05); }
.site-nav .nav-cta{ background:var(--red); color:#fff; border-color:var(--paper-ink); box-shadow:3px 3px 0 var(--hard-dark); }
.site-nav .nav-cta span{ color:var(--gold); }
.site-nav .nav-cta:hover{ transform:translate(-1px,-1px); box-shadow:5px 5px 0 var(--hard-dark); background:var(--red-bright); }
.menu-toggle{ display:none; }

/* ---------- hero ---------- */
.hero{ padding-top:clamp(2.5rem,6vw,4.5rem); padding-bottom:clamp(2.5rem,5vw,4rem); }
.hero-top{ display:flex; flex-wrap:wrap; gap:.6rem; justify-content:space-between; margin-bottom:clamp(2.5rem,5vw,4rem); }
.hero-stage{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; padding-bottom:clamp(3rem,6vw,4.5rem); }
.kicker{ margin-bottom:1.4rem; }
.hero h1{ font-size:clamp(2.7rem,7.2vw,6rem); margin-bottom:1.6rem; }
.hero-meta{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:2rem; }
.hero-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; }
.hero-art{ position:relative; padding:2.5rem 1.5rem 3.5rem; }
.art-frame{ position:relative; background:var(--paper); border:3px solid var(--paper-ink); border-radius:22px; padding:14px 14px 20px; box-shadow:16px 16px 0 rgba(0,0,0,.45); transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotate(2.5deg); transition:transform .18s ease-out; max-width:460px; margin-left:auto; }
.art-frame img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:12px; border:2px solid rgba(25,25,25,.15); }
.art-frame::before,.art-frame::after{ content:""; position:absolute; top:-14px; width:104px; height:30px; background:rgba(255,255,255,.55); border:1px solid rgba(25,25,25,.14); box-shadow:0 2px 5px rgba(0,0,0,.18); }
.art-frame::before{ left:14%; transform:rotate(-7deg); }
.art-frame::after{ right:12%; transform:rotate(6deg); }
img.badge-spin{ position:absolute; top:-42px; right:-28px; width:120px; height:120px; max-width:none; aspect-ratio:1/1; object-fit:contain; border-radius:50%; animation:wobble 4s ease-in-out infinite; filter:drop-shadow(5px 7px 0 rgba(0,0,0,.5)); touch-action:manipulation; }
img.badge-spin:hover{ animation-play-state:paused; }
@keyframes wobble{ 0%,100%{ transform:rotate(-6deg); } 50%{ transform:rotate(5deg) translateY(-3px); } }
img.badge-spin.badge-wild{ animation:badgeWild 1.6s cubic-bezier(.3,.7,.4,1) forwards; }
@keyframes badgeWild{
  0%{ transform:rotate(0) scale(1); }
  15%{ transform:rotate(200deg) scale(1.35); }
  45%{ transform:rotate(560deg) scale(1.12); }
  75%{ transform:rotate(920deg) scale(1.28); }
  100%{ transform:rotate(1080deg) scale(1); }
}
.art-small{ position:absolute; left:0; bottom:0; width:min(200px,46%); background:var(--paper); border:3px solid var(--paper-ink); border-radius:16px; padding:10px 10px 14px; transform:rotate(-7deg); box-shadow:10px 10px 0 var(--red); z-index:2; }
.art-small img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:8px; }
.spark{ position:absolute; font-size:1.6rem; color:var(--gold); animation:floaty 5s ease-in-out infinite; text-shadow:2px 2px 0 rgba(0,0,0,.4); }
.s1{ top:6%; left:2%; }
.s2{ bottom:16%; right:4%; font-size:1.1rem; animation-delay:1.6s; color:var(--red-bright); }
@keyframes floaty{ 50%{ transform:translateY(-12px) rotate(12deg); } }

/* ---------- statement ---------- */
.statement{ background:var(--red); color:var(--paper); border-top:3px solid var(--paper-ink); border-bottom:3px solid var(--paper-ink); background-image:radial-gradient(rgba(25,25,25,.18) 1.5px,transparent 1.9px); background-size:22px 22px; }
.statement .tag{ color:rgba(255,255,255,.8); }
.statement .tag::before{ color:var(--gold); }
.statement-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,4rem); margin-top:1.6rem; align-items:end; }
.statement-big{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2.1rem,5.6vw,4.4rem); line-height:.98; }
.statement-big em{ font-style:normal; color:var(--gold); text-shadow:.05em .05em 0 var(--paper-ink); display:inline-block; transform:rotate(-2deg); }
.statement-copy{ display:grid; gap:1rem; font-size:1.1rem; max-width:44ch; justify-items:start; }
.statement-copy .link-arrow{ color:var(--paper); border-color:var(--paper-ink); }
.statement-copy .link-arrow:hover{ background:var(--gold); color:var(--paper-ink); border-color:var(--paper-ink); }

/* ---------- work / trading cards ---------- */
.work-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.5rem; margin-bottom:clamp(2.2rem,4vw,3.2rem); }
.work-head h2{ font-size:clamp(2.4rem,6vw,4.6rem); margin-top:.9rem; }
.head-note{ font-family:var(--font-mono); font-size:.75rem; color:var(--ink-dim); margin-top:.8rem; letter-spacing:.08em; }
.filters{ display:flex; flex-wrap:wrap; gap:.55rem; }
.filter{ font-family:var(--font-mono); font-size:.74rem; letter-spacing:.12em; padding:.65em 1.25em; border:2px solid var(--line); border-radius:999px; transition:.15s; }
.filter:hover{ border-color:var(--gold); color:var(--gold); }
.filter.active{ background:var(--gold); border-color:var(--paper-ink); color:var(--paper-ink); font-weight:700; box-shadow:4px 4px 0 var(--hard-dark); }
.gallery{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(1rem,2vw,1.5rem); }
.gallery figure{ transform:rotate(var(--tilt,0deg)); transition:transform .35s cubic-bezier(.2,.7,.25,1); }
.gallery figure:hover{ --tilt:0deg; }
.g1{ grid-column:span 5; --tilt:1.4deg; }
.g2{ grid-column:span 4; }
.g3{ grid-column:span 3; --tilt:-2deg; }
.g4{ grid-column:span 4; --tilt:-1.4deg; }
.g5{ grid-column:span 5; }
.g6{ grid-column:span 3; --tilt:1.8deg; }
.g7{ grid-column:4 / span 6; }
.gallery .is-hidden{ display:none; }
.pop{ animation:cardpop .45s cubic-bezier(.2,.7,.3,1.4); }
@keyframes cardpop{ 0%{ transform:scale(.92) rotate(var(--tilt,0deg)); } 100%{ transform:rotate(var(--tilt,0deg)); } }
.portfolio-open{ position:relative; display:block; width:100%; text-align:left; background:var(--paper); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:20px; padding:12px 12px 14px; cursor:zoom-in; box-shadow:10px 10px 0 rgba(0,0,0,.5); transition:transform .25s cubic-bezier(.2,.7,.25,1), box-shadow .25s; overflow:hidden; }
.portfolio-open:hover{ transform:translateY(-8px); box-shadow:12px 14px 0 var(--red); }
.portfolio-open::after{ content:""; position:absolute; top:-10%; bottom:-10%; left:0; width:45%; background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent); transform:translateX(-160%) skewX(-18deg); pointer-events:none; }
.portfolio-open:hover::after{ transition:transform .7s ease; transform:translateX(320%) skewX(-18deg); }
.pcard-top{ display:flex; justify-content:space-between; align-items:center; padding:2px 4px 10px; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.12em; }
.pcard-top b{ color:var(--paper-dim); }
.cat{ font-style:normal; font-weight:700; padding:.3em .8em; border-radius:999px; border:2px solid var(--paper-ink); font-size:.66rem; }
.cat-player{ background:var(--red); color:#fff; }
.cat-team{ background:var(--gold); color:var(--paper-ink); }
.portfolio-open img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:12px; border:2px solid rgba(25,25,25,.14); }
.holo{ display:block; height:9px; margin-top:12px; border-radius:99px; background:linear-gradient(90deg,var(--red),var(--gold),#ffffff,var(--gold),var(--red)); background-size:220% 100%; animation:holo 5s linear infinite; opacity:.9; }
@keyframes holo{ to{ background-position:-220% 0; } }

/* ---------- modal ---------- */
.portfolio-modal{ position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:clamp(1rem,4vw,2.5rem); }
.portfolio-modal[hidden]{ display:none; }
.portfolio-modal-backdrop{ position:absolute; inset:0; background:rgba(12,12,13,.82); backdrop-filter:blur(5px); }
.portfolio-modal-dialog{ position:relative; background:var(--paper); border:3px solid var(--paper-ink); border-radius:22px; padding:14px; max-width:min(880px,94vw); box-shadow:14px 14px 0 var(--red); animation:modalin .3s cubic-bezier(.2,.7,.3,1.3); }
@keyframes modalin{ from{ transform:scale(.9) rotate(-2deg); opacity:0; } }
.portfolio-modal-dialog img{ max-width:100%; max-height:76vh; object-fit:contain; border-radius:12px; }
.portfolio-modal-close{ position:absolute; top:-18px; right:-18px; width:48px; height:48px; border-radius:50%; background:var(--red); color:#fff; border:3px solid var(--paper-ink); font-size:1.5rem; line-height:1; box-shadow:4px 4px 0 var(--hard-dark); transition:transform .2s; z-index:2; }
.portfolio-modal-close:hover{ transform:rotate(90deg) scale(1.05); }
.portfolio-modal-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%; background:var(--paper-ink); color:var(--gold); border:3px solid var(--paper-ink); font-size:1.4rem; box-shadow:4px 4px 0 rgba(0,0,0,.4); transition:transform .15s, background .15s; z-index:2; }
.portfolio-modal-arrow:hover{ background:var(--red); color:#fff; transform:translateY(-50%) scale(1.06); }
.portfolio-modal-arrow.prev{ left:-70px; }
.portfolio-modal-arrow.next{ right:-70px; }
body.modal-open{ overflow:hidden; }

/* ---------- services / tickets ---------- */
.services-head{ max-width:760px; margin-bottom:clamp(2.2rem,4vw,3.4rem); }
.services-head h2{ font-size:clamp(2.2rem,5.6vw,4.2rem); margin:.9rem 0 1rem; }
.lede{ color:var(--ink-dim); font-size:1.08rem; max-width:56ch; }
.service-list{ display:grid; gap:1.4rem; }
.ticket{ position:relative; display:grid; grid-template-columns:1fr minmax(210px,240px); background:var(--paper); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:22px; overflow:hidden; box-shadow:10px 10px 0 rgba(0,0,0,.5); transition:transform .2s, box-shadow .2s, border-color .2s, background-color .2s; }
.ticket:hover{ transform:translate(-3px,-3px); box-shadow:14px 14px 0 var(--red); }
.ticket-main{ padding:clamp(1.4rem,3vw,2rem); display:grid; gap:.7rem; align-content:start; }
.num{ justify-self:start; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; border:2px solid var(--paper-ink); border-radius:999px; padding:.35em .9em; background:var(--paper-2); }
.ticket h3{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:clamp(1.15rem,2.4vw,1.55rem); line-height:1.05; }
.ticket-sub{ display:block; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--red); font-weight:700; margin-top:-.2rem; }
.ticket-main p{ color:var(--paper-dim); max-width:52ch; }
.feature-list{ display:grid; gap:.45rem; margin-top:.6rem; }
.feature-list li{ position:relative; padding-left:1.5em; font-size:.95rem; line-height:1.5; color:var(--paper-dim); }
.feature-list li::before{ content:"✓"; position:absolute; left:0; color:var(--red); font-weight:700; }
.ticket-stub{ position:relative; border-left:3px dashed rgba(25,25,25,.4); background:var(--paper-2); padding:1.6rem 1.4rem; display:grid; gap:.55rem; align-content:center; justify-items:center; text-align:center; }
.ticket-stub::before,.ticket-stub::after{ content:""; position:absolute; left:-15px; width:26px; height:26px; border-radius:50%; background:var(--bg); border:3px solid var(--paper-ink); }
.ticket-stub::before{ top:-16px; }
.ticket-stub::after{ bottom:-16px; }
.price{ font-family:var(--font-display); font-size:clamp(1.9rem,3.4vw,2.5rem); line-height:1; }
.ticket-stub small{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.1em; color:var(--paper-dim); }
.ticket:nth-of-type(2) .ticket-stub{ background:var(--gold); }
.ticket:nth-of-type(2) .chip-btn{ background:var(--paper-ink); color:var(--gold); box-shadow:4px 4px 0 rgba(25,25,25,.35); }
.ticket:nth-of-type(4) .ticket-stub{ background:var(--red); }
.ticket:nth-of-type(4) .price,.ticket:nth-of-type(4) small{ color:#fff; }
.ticket:nth-of-type(4) .chip-btn{ background:var(--paper-ink); color:var(--paper); }
.ticket-soon{ background:var(--paper); border:3px dashed rgba(25,25,25,.4); box-shadow:10px 10px 0 rgba(0,0,0,.5); }
.ticket-soon:hover{ transform:translate(-3px,-3px); box-shadow:14px 14px 0 var(--red); }
.ticket-soon .ticket-main p{ color:var(--paper-dim); }
.ticket-soon .num{ border-color:var(--paper-ink); background:var(--paper-2); color:var(--paper-dim); }
.stamp{ display:inline-block; font-family:var(--font-display); font-size:.95rem; text-transform:uppercase; color:var(--red-bright); border:3px solid var(--red-bright); border-radius:10px; padding:.45em .8em; transform:rotate(-9deg); }
.pricing-note{ margin-top:1.8rem; font-family:var(--font-mono); font-size:.76rem; line-height:1.8; letter-spacing:.03em; color:var(--ink-dim); border-left:3px solid var(--gold); padding-left:1.1rem; max-width:70ch; }
.services-cta{ margin-top:2.4rem; text-align:center; }

/* ---------- ticket rip ---------- */
.ticket.ripping{ overflow:visible; z-index:20; pointer-events:none; background-color:transparent; border-color:transparent; box-shadow:none; }
.ticket.ripping .ticket-stub{ border-radius:16px; animation:ripStub .75s cubic-bezier(.35,.6,.4,1) forwards; }
.ticket.ripping .ticket-stub .chip-btn{ pointer-events:none; }
.ticket.ripping .ticket-main{
  background:var(--paper); border:3px solid var(--paper-ink); border-right:0; border-radius:19px 0 0 19px;
  clip-path:polygon(0 0,100% 0,97% 6%,100% 12%,96% 18%,100% 25%,97% 31%,100% 38%,96% 44%,100% 50%,97% 56%,100% 62%,96% 69%,100% 75%,97% 81%,100% 88%,96% 94%,100% 100%,0 100%);
  animation:ripMain .75s ease forwards;
}
@keyframes ripStub{
  0%{ transform:translate(0,0) rotate(0); opacity:1; }
  18%{ transform:translate(6px,-7px) rotate(3deg); opacity:1; }
  100%{ transform:translate(55%,130%) rotate(24deg); opacity:0; }
}
@keyframes ripMain{
  0%{ transform:translate(0,0) rotate(0); }
  20%{ transform:translate(-7px,3px) rotate(-1.4deg); }
  50%{ transform:translate(3px,-2px) rotate(.7deg); }
  100%{ transform:translate(-4px,1px) rotate(-.6deg); }
}
.rip-confetti{ position:fixed; z-index:200; pointer-events:none; border-radius:2px; animation:confettiFly .9s cubic-bezier(.2,.6,.4,1) forwards; }
@keyframes confettiFly{
  0%{ transform:translate(0,0) rotate(0) scale(1); opacity:1; }
  100%{ transform:translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(.6); opacity:0; }
}

/* ---------- process ---------- */
.process-head{ margin-bottom:clamp(2.2rem,4vw,3.2rem); max-width:760px; }
.process-head h2{ font-size:clamp(2.2rem,5.6vw,4.2rem); margin:.9rem 0 1rem; }
.steps{ display:grid; grid-template-columns:repeat(5,1fr); gap:1.1rem; }
.step{ position:relative; background:var(--panel); border:2px solid var(--line); border-radius:20px; padding:1.5rem 1.2rem; display:grid; gap:.7rem; align-content:start; transition:transform .2s, border-color .2s; }
.step:hover{ transform:translateY(-6px) rotate(-.5deg); border-color:var(--red); }
.step-num{ width:52px; height:52px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-family:var(--font-display); font-size:1rem; border:2.5px solid var(--hard-dark); box-shadow:3px 3px 0 var(--hard-dark); }
.step:nth-child(even) .step-num{ background:var(--gold); color:var(--paper-ink); }
.step h3{ font-family:var(--font-display); font-weight:400; font-size:1.02rem; text-transform:uppercase; }
.step p{ font-size:.92rem; color:var(--ink-dim); }
.step:not(:last-child)::after{ content:"→"; position:absolute; top:2.2rem; right:-1.05rem; color:var(--red-bright); font-size:1.15rem; font-weight:700; }

/* ---------- about ---------- */
.about{ background:var(--paper); color:var(--paper-ink); border-top:3px solid var(--paper-ink); border-bottom:3px solid var(--paper-ink); background-image:radial-gradient(rgba(72,76,80,.14) 1.2px,transparent 1.6px); background-size:22px 22px; }
.about-inner{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(2.5rem,6vw,5rem); align-items:center; }
.polaroid{ position:relative; background:#fff; border:3px solid var(--paper-ink); border-radius:14px; padding:12px 12px 46px; transform:rotate(-2.5deg); box-shadow:12px 12px 0 var(--gold); max-width:400px; margin-inline:auto; transition:transform .2s ease-out; }
.polaroid:hover{ transform:rotate(0deg) scale(1.01); }
.polaroid img{ width:100%; border-radius:8px; border:2px solid rgba(25,25,25,.12); }
.polaroid figcaption{ position:absolute; left:0; right:0; bottom:12px; text-align:center; font-family:var(--font-mono); font-size:.68rem; letter-spacing:.16em; color:var(--paper-dim); text-transform:uppercase; }
.about-copy .tag{ color:var(--paper-dim); }
.about-copy .tag::before{ color:var(--red); }
.about-copy h2{ font-size:clamp(2rem,4.6vw,3.6rem); margin:1rem 0 1.4rem; }
.about-copy .display em{ color:var(--red); text-shadow:.06em .06em 0 rgba(203,168,90,.35); }
.about-copy p{ max-width:56ch; margin-bottom:1rem; color:#3f4144; }
.about-close{ font-weight:700; }
.about-copy .button{ margin-top:.8rem; }

/* ---------- instagram band ---------- */
.ig-band{ border-top:3px solid var(--paper-ink); background:var(--panel); }
.ig-inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.5rem; }
.ig-inner h2{ font-size:clamp(1.6rem,3.6vw,2.6rem); margin-top:.8rem; }

/* ---------- final CTA ---------- */
.final-cta{ text-align:center; overflow:hidden; }
.final-cta .tag{ display:inline-flex; }
.final-cta h2{ font-size:clamp(2.6rem,7vw,5.4rem); margin:1.2rem auto 2.2rem; max-width:900px; }

/* ---------- footer ---------- */
footer{ background:var(--bg-deep); border-top:3px solid var(--line); padding:clamp(3rem,6vw,4.5rem) var(--gutter) 2rem; }
.footer-main{ max-width:1180px; margin:0 auto 2.2rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.2rem; }
.footer-main img{ height:52px; width:auto; }
.footer-tag{ font-family:var(--font-display); text-transform:uppercase; color:var(--gold); font-size:clamp(.95rem,2vw,1.2rem); text-shadow:2px 2px 0 var(--red); }
.footer-links{ max-width:1180px; margin:0 auto 2rem; display:flex; flex-wrap:wrap; gap:.55rem; }
.footer-links a{ font-size:.82rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; text-decoration:none; padding:.5em 1.05em; border:2px solid var(--line); border-radius:999px; transition:.15s; }
.footer-links a:hover{ background:var(--red); border-color:var(--paper-ink); color:#fff; transform:translateY(-2px); }
.footer-base{ max-width:1180px; margin:0 auto; padding-top:1.4rem; border-top:2px dashed var(--line); display:flex; flex-wrap:wrap; justify-content:space-between; gap:.8rem; }
.footer-base small,.footer-base .made{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; color:var(--ink-dim); text-transform:uppercase; }
.footer-base .made i{ font-style:normal; color:var(--gold); }

/* ---------- subpage hero ---------- */
.page-hero{ padding-top:clamp(3.5rem,8vw,6rem); padding-bottom:clamp(2.5rem,5vw,3.5rem); }
.page-hero h1{ font-size:clamp(3rem,9vw,6.5rem); margin:1rem 0 1.2rem; }
.page-hero p{ color:var(--ink-dim); max-width:60ch; font-size:1.08rem; }
.page-hero .marquee--bleed{ margin-top:clamp(2rem,4vw,3rem); }

/* ---------- booking ---------- */
.booking-layout{ display:grid; grid-template-columns:1.55fr .95fr; gap:clamp(1.5rem,3vw,2.5rem); align-items:start; }
.form-intro{ margin-bottom:2rem; max-width:640px; }
.form-intro h2{ font-size:clamp(1.7rem,3.6vw,2.6rem); margin:.8rem 0 .9rem; }
.checklist{ margin-top:1.6rem; background:var(--gold); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:20px; padding:1.7rem; box-shadow:10px 10px 0 var(--red); display:grid; gap:.7rem; }
.checklist strong{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:1.05rem; }
.checklist li{ position:relative; padding-left:1.6em; font-weight:500; }
.checklist li::before{ content:"✓"; position:absolute; left:0; font-weight:700; }
.setmore-booking-wrap{ margin-top:1.6rem; background:var(--paper); border:3px solid var(--paper-ink); border-radius:22px; overflow:hidden; box-shadow:12px 12px 0 rgba(0,0,0,.5); }
.setmore-topline{ display:flex; align-items:center; gap:1rem; background:var(--paper-ink); color:var(--paper); font-family:var(--font-mono); font-size:.68rem; letter-spacing:.14em; padding:.8rem 1.2rem; text-transform:uppercase; }
.win-dots{ color:var(--red-bright); letter-spacing:.3em; }
.topline-label{ margin-left:auto; color:var(--gold); }
.setmore-booking-wrap iframe{ display:block; width:100%; height:780px; border:0; background:#fff; }
.terms-box{ margin-top:2rem; background:var(--panel); border:2px solid var(--line); border-radius:20px; padding:1.8rem; }
.terms-box strong{ display:inline-flex; align-items:center; gap:.6em; font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:1rem; background:var(--red); color:#fff; border:2.5px solid var(--hard-dark); padding:.4em .9em; border-radius:12px; box-shadow:4px 4px 0 var(--hard-dark); margin-bottom:1.2rem; }
.terms-box li{ position:relative; padding-left:1.6em; margin-bottom:.6rem; color:var(--ink-dim); font-size:.95rem; }
.terms-box li::before{ content:"✦"; position:absolute; left:0; color:var(--gold); }
.terms-box .link-arrow{ margin-top:1rem; }
.faq{ margin-top:2rem; display:grid; gap:.7rem; }
.faq details{ background:var(--panel); border:2px solid var(--line); border-radius:16px; padding:1.1rem 1.3rem; transition:border-color .15s; }
.faq details[open]{ border-color:var(--gold); }
.faq summary{ cursor:pointer; font-weight:700; display:flex; justify-content:space-between; align-items:center; gap:1rem; list-style:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-family:var(--font-display); color:var(--gold); font-size:1.25rem; }
.faq details[open] summary::after{ content:"–"; }
.faq details p{ margin-top:.8rem; color:var(--ink-dim); font-size:.95rem; }
.form-note{ margin-top:1.2rem; font-family:var(--font-mono); font-size:.74rem; line-height:1.7; letter-spacing:.04em; color:var(--ink-dim); border-left:3px solid var(--red); padding-left:1rem; max-width:60ch; }
.booking-contact{ position:sticky; top:100px; background:var(--red); color:var(--paper); border:3px solid var(--paper-ink); border-radius:24px; padding:clamp(1.6rem,3vw,2.2rem); box-shadow:12px 12px 0 var(--gold); display:grid; gap:1rem; justify-items:start; }
.booking-contact .tag{ color:rgba(255,255,255,.8); }
.booking-contact .tag::before{ color:var(--gold); }
.booking-contact h2{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:clamp(1.4rem,2.6vw,1.9rem); line-height:1.05; }
.booking-contact h2 span{ color:var(--gold); }
.booking-contact > p{ font-size:.95rem; max-width:30ch; color:rgba(255,255,255,.88); }
.booking-contact > a{ display:inline-flex; background:var(--paper); color:var(--paper-ink); border:2.5px solid var(--paper-ink); border-radius:12px; padding:.7em 1.1em; font-weight:700; font-size:.88rem; text-decoration:none; box-shadow:3px 3px 0 var(--paper-ink); transition:.15s; width:fit-content; }
.booking-contact > a:hover{ background:var(--gold); transform:translate(-2px,-2px); box-shadow:5px 5px 0 var(--paper-ink); }
.payment-details{ width:100%; background:var(--paper-ink); border-radius:16px; padding:1.2rem 1.3rem; display:grid; gap:.4rem; }
.payment-details strong{ font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.14em; font-size:.68rem; color:var(--gold); }
.payment-details p{ font-size:.92rem; line-height:1.7; }

/* ---------- merch ---------- */
.merch-collection-head{ align-items:center; }
.merch-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:1.4rem; }
.merch-card{ position:relative; background:var(--paper); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:22px; overflow:hidden; box-shadow:10px 10px 0 rgba(0,0,0,.5); transition:transform .22s, box-shadow .22s; display:flex; flex-direction:column; }
.merch-card:hover{ transform:translateY(-8px) rotate(-.6deg); box-shadow:12px 14px 0 var(--red); }
.merch-number{ position:absolute; top:14px; left:14px; z-index:2; font-family:var(--font-mono); font-size:.7rem; letter-spacing:.12em; background:var(--paper-ink); color:var(--gold); padding:.4em .8em; border-radius:999px; }
.merch-card-art{ background:var(--paper-2); background-image:radial-gradient(rgba(72,76,80,.14) 1.2px,transparent 1.6px); background-size:18px 18px; border-bottom:3px solid var(--paper-ink); padding:1.4rem; display:grid; place-items:center; }
.merch-card-art img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:12px; }
.merch-card-body{ padding:1.3rem 1.3rem 1.5rem; display:grid; gap:.5rem; justify-items:start; align-content:start; flex:1; }
.merch-card-body h3{ font-size:1.08rem; font-weight:700; line-height:1.25; }
.merch-card-body p{ color:var(--paper-dim); font-size:.9rem; }
.merch-card-body .chip-btn{ margin-top:.5rem; }
.merch-state{ display:inline-block; font-family:var(--font-display); font-size:.7rem; text-transform:uppercase; color:var(--red); border:2.5px solid var(--red); border-radius:8px; padding:.4em .7em; transform:rotate(-5deg); margin-top:.4rem; }
.sold-out .merch-card-art img{ filter:grayscale(.55) opacity(.9); }
.merch-launch{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.merch-brand-panel{ position:relative; background:var(--bg-deep); border:3px dashed var(--line); border-radius:26px; padding:clamp(2.5rem,6vw,4.5rem) 2rem; display:grid; place-items:center; gap:1.4rem; box-shadow:inset 0 0 0 8px rgba(255,255,255,.04); }
.merch-brand-panel img{ max-height:170px; width:auto; }
.merch-brand-panel img.badge-spin{ position:static; width:130px; height:130px; filter:none; }
.merch-status{ background:var(--gold); color:var(--paper-ink); font-family:var(--font-mono); font-size:.7rem; letter-spacing:.16em; padding:.5em 1.1em; border-radius:999px; border:2px solid var(--paper-ink); font-weight:700; }
.merch-copy h2{ font-size:clamp(2rem,4.6vw,3.4rem); margin:.9rem 0 1rem; }
.merch-copy p{ color:var(--ink-dim); max-width:52ch; margin-bottom:1.6rem; }
.merch-actions{ display:flex; flex-wrap:wrap; gap:.8rem; }

/* ---------- policies ---------- */
.policy-content .shell{ max-width:1100px; }
.policy-intro h2{ font-size:clamp(2rem,4.6vw,3.4rem); margin:.9rem 0 1rem; }
.policy-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:1.3rem; margin-top:2.2rem; }
.policy-grid article{ background:var(--panel); border:2px solid var(--line); border-radius:20px; padding:1.7rem; display:grid; gap:.7rem; align-content:start; transition:transform .2s, border-color .2s; }
.policy-grid article:hover{ transform:translateY(-6px); border-color:var(--gold); }
.policy-grid article > span{ width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--gold); color:var(--paper-ink); font-family:var(--font-display); font-size:.85rem; border:2.5px solid var(--hard-dark); box-shadow:3px 3px 0 var(--hard-dark); }
.policy-grid h3{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:1.05rem; }
.policy-grid p{ color:var(--ink-dim); font-size:.95rem; }
.policy-final{ margin-top:2.2rem; background:var(--gold); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:22px; padding:1.8rem; box-shadow:10px 10px 0 var(--red); display:grid; gap:.8rem; }
.policy-final span{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; }
.policy-final p{ font-weight:500; max-width:75ch; }

/* ---------- 404 ---------- */
.error-page{ min-height:calc(100svh - 60px); display:grid; place-content:center; justify-items:center; text-align:center; gap:1.2rem; padding:4rem 1.5rem; position:relative; }
.error-logo{ height:58px; width:auto; margin-bottom:.6rem; }
.fumble{ font-family:var(--font-display); font-size:clamp(.9rem,2.4vw,1.2rem); background:var(--gold); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:12px; padding:.4em .8em; transform:rotate(-7deg); box-shadow:5px 5px 0 var(--hard-dark); animation:wiggle 3s ease-in-out infinite; }
@keyframes wiggle{ 0%,100%{ transform:rotate(-7deg); } 50%{ transform:rotate(4deg) translateY(-4px); } }
.error-code{ font-family:var(--font-display); font-size:clamp(5.5rem,22vw,12rem); line-height:.9; color:var(--paper); text-shadow:.05em .05em 0 var(--red), .1em .1em 0 rgba(0,0,0,.4); }
.error-page h1{ font-family:var(--font-display); font-weight:400; font-size:clamp(1.5rem,4.5vw,2.4rem); text-transform:uppercase; line-height:1.05; }
.error-page h1 span{ color:var(--red-bright); }
.error-page p{ color:var(--ink-dim); }

/* ---------- reveal + fail-safe ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.25,1); animation:forceReveal .6s ease 1.4s forwards; }
.reveal.revealed{ opacity:1; transform:none; }
@keyframes forceReveal{ to{ opacity:1; transform:none; } }

/* ---------- stamp slam ---------- */
.stamp,.merch-state{ opacity:0; animation:stampFallback .4s ease 1.8s forwards; }
@keyframes stampFallback{ to{ opacity:1; } }
.stamp.stamped,.merch-state.stamped{ opacity:1; animation:stampSlam .45s cubic-bezier(.2,1.4,.4,1) forwards; }
@keyframes stampSlam{
  0%{ opacity:0; transform:rotate(-9deg) scale(2.6); }
  60%{ opacity:1; transform:rotate(-12deg) scale(.9); }
  100%{ opacity:1; transform:rotate(-9deg) scale(1); }
}

/* ---------- buzzer beater ---------- */
.bz-confetti{ position:fixed; top:-5vh; z-index:200; pointer-events:none; border-radius:2px; animation:bzFall var(--dur,2.2s) linear forwards; }
@keyframes bzFall{ to{ transform:translate(var(--sway,0px),108vh) rotate(var(--rot,360deg)); } }
.bz-shout{ position:fixed; inset:0; z-index:210; display:grid; place-items:center; pointer-events:none; font-family:var(--font-display); font-size:clamp(2.2rem,9vw,6rem); color:var(--gold); text-shadow:.05em .05em 0 var(--red), .11em .11em 0 rgba(0,0,0,.55); animation:bzShout 1.5s cubic-bezier(.2,1.2,.3,1) forwards; }
@keyframes bzShout{
  0%{ opacity:0; transform:scale(3) rotate(-7deg); }
  16%{ opacity:1; transform:scale(1) rotate(-3deg); }
  78%{ opacity:1; transform:scale(1.02) rotate(-2deg); }
  100%{ opacity:0; transform:scale(1.04) rotate(-2deg) translateY(-24px); }
}

/* ---------- jumbotron scramble ---------- */
.jz-char{ display:inline-block; text-align:center; }

/* ---------- mobile book bar ---------- */
.mobile-book{ display:none; }

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .steps{ grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); }
  .step:not(:last-child)::after{ display:none; }
  .booking-layout{ grid-template-columns:1fr; }
  .booking-contact{ position:static; }
}
@media (max-width:960px){
  .menu-toggle{ display:inline-grid; grid-template-columns:auto auto; grid-template-rows:repeat(3,auto); column-gap:.6em; align-items:center; position:relative; z-index:2; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; background:var(--gold); color:var(--paper-ink); border:2.5px solid var(--paper-ink); border-radius:12px; padding:.65em .9em; box-shadow:4px 4px 0 var(--hard-dark); }
  .menu-toggle span{ display:block; width:18px; height:2.5px; background:var(--paper-ink); border-radius:2px; transition:transform .25s, opacity .2s; }
  .menu-toggle b{ grid-row:1 / span 3; }
  body.nav-open .menu-toggle span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  body.nav-open .menu-toggle span:nth-child(2){ opacity:0; }
  body.nav-open .menu-toggle span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }
  .brand{ position:relative; z-index:2; }

  .site-nav{
    position:fixed; top:0; left:0; right:0; bottom:0; height:100vh; height:100dvh;
    z-index:90; background:#121314; display:flex; flex-direction:column; justify-content:center;
    gap:.25rem; padding:5.5rem 1.5rem 3rem; transform:translateY(-102%); visibility:hidden;
    transition:transform .4s cubic-bezier(.2,.7,.25,1), visibility 0s .4s;
    border-bottom:4px solid var(--red); overflow-y:auto;
  }
  body.nav-open .site-nav{ transform:none; visibility:visible; transition:transform .4s cubic-bezier(.2,.7,.25,1), visibility 0s; }
  body.nav-open{ overflow:hidden; }
  .site-nav a{ display:flex; justify-content:space-between; align-items:center; width:100%; font-family:var(--font-display); font-size:clamp(1.5rem,6.5vw,2.3rem); text-transform:uppercase; color:var(--ink); text-decoration:none; border:0; border-bottom:2px solid var(--line); border-radius:0; background:none; padding:.45em 0; }
  .site-nav a span{ font-family:var(--font-mono); font-size:.4em; color:var(--red-bright); }
  .site-nav .nav-cta{ margin-top:1.2rem; justify-content:center; border-radius:16px; border:3px solid var(--paper-ink); background:var(--red); color:#fff; }

  .hero-stage{ grid-template-columns:1fr; }
  .hero-art{ padding:3rem .5rem 3.5rem; max-width:520px; width:100%; margin-inline:auto; }
  .art-frame{ margin-inline:auto; }
  .statement-grid,.about-inner,.merch-launch{ grid-template-columns:1fr; }
  .ticket{ grid-template-columns:1fr; }
  .ticket-stub{ border-left:0; border-top:3px dashed rgba(25,25,25,.4); display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; padding:1.3rem; }
  .ticket-stub::before{ left:10px; top:-15px; }
  .ticket-stub::after{ left:auto; right:10px; top:-15px; bottom:auto; }

  .ticket.ripping .ticket-main{
    border-right:3px solid var(--paper-ink); border-bottom:0; border-radius:19px 19px 0 0;
    clip-path:polygon(0 0,100% 0,100% 100%,94% 97%,88% 100%,81% 96%,75% 100%,69% 97%,62% 100%,56% 96%,50% 100%,44% 97%,38% 100%,31% 96%,25% 100%,19% 97%,12% 100%,6% 96%,0 100%);
  }
  @keyframes ripStub{
    0%{ transform:translate(0,0) rotate(0); opacity:1; }
    18%{ transform:translate(-5px,-7px) rotate(-3deg); opacity:1; }
    100%{ transform:translate(30%,140%) rotate(18deg); opacity:0; }
  }

  .mobile-book{ position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:70; display:flex; justify-content:center; align-items:center; gap:.6em; background:var(--red); color:#fff; text-decoration:none; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:1em; border:3px solid var(--paper-ink); border-radius:16px; box-shadow:6px 6px 0 var(--hard-dark); }
  body.nav-open .mobile-book, body.modal-open .mobile-book{ display:none; }
  body{ padding-bottom:5.5rem; }
}
@media (max-width:760px){
  .portfolio-modal-arrow.prev{ left:8px; }
  .portfolio-modal-arrow.next{ right:8px; }
  .portfolio-modal-arrow{ background:rgba(25,25,25,.8); }
}
@media (max-width:640px){
  .hide-sm{ display:none; }
  .hero-top{ justify-content:center; }
  .gallery{ grid-template-columns:1fr 1fr; gap:.9rem; }
  .g1,.g2,.g3,.g4,.g5,.g6,.g7{ grid-column:auto; }
  .work-head{ flex-direction:column; align-items:flex-start; }
  .setmore-booking-wrap iframe{ height:640px; }
  .merch-grid{ grid-template-columns:1fr 1fr; gap:.9rem; }
  .footer-main,.footer-base{ justify-content:center; text-align:center; }
  .policy-grid{ grid-template-columns:1fr; }
  img.badge-spin{ width:92px; height:92px; top:-24px; right:-12px; }
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .marquee-track{ animation:none; }
  .reveal{ opacity:1; transform:none; animation:none; }
  .stamp,.merch-state{ opacity:1; animation:none; }
}

/* ============================================
   CLIENT UPLOAD AREA
   ============================================ */
.upload-box{ margin-top:1.6rem; background:var(--paper); color:var(--paper-ink); border:3px solid var(--paper-ink); border-radius:22px; padding:1.7rem; box-shadow:10px 10px 0 rgba(0,0,0,.5); display:grid; gap:1rem; }
.upload-box strong{ font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:1.05rem; }
.upload-box > p{ color:var(--paper-dim); font-size:.95rem; }
.upload-drop{ position:relative; display:flex; align-items:center; gap:1rem; border:3px dashed rgba(25,25,25,.4); border-radius:16px; padding:1.2rem 1.3rem; cursor:pointer; background:var(--paper-2); transition:border-color .15s, background .15s; }
.upload-drop:hover,.upload-drop.dragging{ border-color:var(--red); background:#fff; }
.upload-drop input{ position:absolute; width:1px; height:1px; opacity:0; }
.upload-icon{ width:46px; height:46px; flex:0 0 46px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-size:1.2rem; border:2.5px solid var(--paper-ink); box-shadow:3px 3px 0 var(--hard-dark); }
.upload-text{ display:grid; gap:.15rem; }
.upload-text b{ font-size:.95rem; letter-spacing:.03em; }
.upload-text small{ font-family:var(--font-mono); font-size:.66rem; letter-spacing:.08em; color:var(--paper-dim); text-transform:uppercase; }
.upload-list{ display:grid; gap:.4rem; }
.upload-list li{ display:flex; justify-content:space-between; align-items:center; gap:.8rem; background:var(--paper-2); border:2px solid var(--line); border-radius:10px; padding:.5em .9em; font-family:var(--font-mono); font-size:.74rem; }
.upload-list li span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.upload-list li button{ width:26px; height:26px; border-radius:50%; background:var(--red); color:#fff; font-size:.9rem; line-height:1; flex:0 0 26px; }
.upload-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.upload-alt{ font-family:var(--font-mono); font-size:.74rem; color:var(--paper-dim); }
.upload-alt:hover{ color:var(--red); }
.upload-note{ font-family:var(--font-mono); font-size:.64rem; letter-spacing:.05em; color:var(--paper-dim); line-height:1.6; }

/* ============================================
   UPLOAD STATES + PROGRESS
   ============================================ */
.upload-list li{ display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:.7rem; }
.up-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--font-mono); font-size:.74rem; }
.up-bar{ display:block; grid-column:1 / -1; height:6px; border-radius:99px; background:rgba(25,25,25,.12); overflow:hidden; }
.up-bar b{ display:block; height:100%; width:0%; background:linear-gradient(90deg,var(--red),var(--gold)); transition:width .2s; }
.up-state{ font-family:var(--font-mono); font-size:.7rem; font-weight:700; color:var(--paper-dim); }
.upload-list li.done .up-state{ color:var(--red); }
.upload-list li.done{ opacity:.7; }
.upload-list li.failed .up-state{ color:var(--red); }
.upload-status{ display:flex; align-items:center; gap:.8rem; min-height:1em; font-size:.9rem; color:var(--paper-dim); }