/* =========================================================
   THE STRONGHOLD — stronghold card shop, Plainville CT
   Design system + interactive site styles
   Brand: black + Stronghold green (#6CBE45) + white
   ========================================================= */

/* ---------- Design tokens ---------- */
:root {
  --bg:        #0B0B0C;
  --bg-2:      #101012;
  --panel:     #16171A;
  --panel-2:   #1D1F23;
  --line:      #2A2D33;
  --white:     #FFFFFF;
  --muted:     #A6ADB4;
  --muted-2:   #71787F;

  --green:      #6CBE45;
  --green-2:    #86D64F;
  --green-deep: #4E9A31;
  --green-glow: rgba(108, 190, 69, 0.35);

  --maxw: 1200px;
  --gutter: clamp(20px, 5vw, 64px);
  --radius: 14px;
  --radius-lg: 22px;

  --ff-display: "Anton", "Arial Narrow", "Helvetica Neue", Impact, sans-serif;
  --ff-head:    "Oswald", "Arial Narrow", system-ui, sans-serif;
  --ff-body:    "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --shadow: 0 20px 60px -20px rgba(0,0,0,0.8);
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--ff-body);
  background: var(--bg);
  color: var(--white);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
ul { list-style: none; padding: 0; }
:focus-visible { outline: 2px solid var(--green-2); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--green); color: #06210b; }

/* ---------- Layout helpers ---------- */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(72px, 12vw, 140px); position: relative; }
.eyebrow {
  font-family: var(--ff-head);
  text-transform: uppercase;
  letter-spacing: 0.32em;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--green);
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--green); }
.h-sec {
  font-family: var(--ff-display);
  font-weight: 400;
  line-height: 0.94;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  font-size: clamp(2.4rem, 7vw, 4.6rem);
  margin-block: 0.35em 0.4em;
}
.h-sec .g { color: var(--green); }
.lead { color: var(--muted); font-size: clamp(1rem, 1.4vw, 1.18rem); max-width: 62ch; }

/* ---------- Buttons ---------- */
.btn {
  --pad-y: 15px; --pad-x: 26px;
  display: inline-flex; align-items: center; gap: 10px;
  padding: var(--pad-y) var(--pad-x);
  font-family: var(--ff-head);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.9rem;
  border-radius: 999px;
  transition: transform .3s var(--ease), background .3s var(--ease), color .3s var(--ease), box-shadow .3s var(--ease);
  will-change: transform;
}
.btn svg { width: 18px; height: 18px; }
.btn--primary { background: var(--green); color: #06210b; box-shadow: 0 10px 30px -10px var(--green-glow); }
.btn--primary:hover { background: var(--green-2); transform: translateY(-3px); box-shadow: 0 18px 40px -12px var(--green-glow); }
.btn--ghost { border: 1.5px solid var(--line); color: var(--white); }
.btn--ghost:hover { border-color: var(--green); color: var(--green); transform: translateY(-3px); }
.btn--block { width: 100%; justify-content: center; }

/* ---------- Custom cursor glow ---------- */
.cursor-glow {
  position: fixed; top: 0; left: 0; width: 320px; height: 320px;
  margin: -160px 0 0 -160px; border-radius: 50%;
  background: radial-gradient(circle, var(--green-glow) 0%, transparent 62%);
  pointer-events: none; z-index: 1; opacity: 0; transition: opacity .5s ease;
  mix-blend-mode: screen; filter: blur(6px);
}
body.cursor-active .cursor-glow { opacity: 0.55; }

/* ---------- Nav ---------- */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 60;
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px var(--gutter);
  transition: background .4s var(--ease), padding .4s var(--ease), border-color .4s var(--ease);
  border-bottom: 1px solid transparent;
}
.nav.scrolled {
  background: rgba(11,11,12,0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom-color: var(--line);
  padding-block: 12px;
}
.brand { display: flex; align-items: center; gap: 12px; }
.brand svg, .brand img { width: 34px; height: auto; }
.brand-name {
  font-family: var(--ff-display); text-transform: uppercase;
  font-size: 1.18rem; letter-spacing: 0.04em; line-height: 1;
}
.brand-name b { color: var(--green); font-weight: 400; }
.brand-tag { font-family: var(--ff-head); font-size: .58rem; letter-spacing: .28em; color: var(--muted-2); text-transform: uppercase; }

.nav-links { display: flex; align-items: center; gap: 34px; }
.nav-links a {
  font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .14em;
  font-size: .82rem; font-weight: 500; color: var(--muted);
  position: relative; padding: 4px 0; transition: color .25s ease;
}
.nav-links a::after {
  content: ""; position: absolute; left: 0; bottom: -2px; height: 2px; width: 0;
  background: var(--green); transition: width .3s var(--ease);
}
.nav-links a:hover { color: var(--white); }
.nav-links a:hover::after { width: 100%; }
.nav-cta { display: flex; align-items: center; gap: 16px; }

.nav-menu { display: none; }
.nav-toggle { display: none; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 10px; align-items: center; justify-content: center; }
.nav-toggle span { display: block; width: 20px; height: 2px; background: var(--white); position: relative; transition: .3s var(--ease); }
.nav-toggle span::before, .nav-toggle span::after { content: ""; position: absolute; left: 0; width: 20px; height: 2px; background: var(--white); transition: .3s var(--ease); }
.nav-toggle span::before { top: -6px; } .nav-toggle span::after { top: 6px; }
body.menu-open .nav-toggle span { background: transparent; }
body.menu-open .nav-toggle span::before { top: 0; transform: rotate(45deg); }
body.menu-open .nav-toggle span::after { top: 0; transform: rotate(-45deg); }

/* ---------- Hero ---------- */
.hero {
  position: relative; min-height: 100svh; display: flex; align-items: center;
  padding-top: 120px; overflow: hidden;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(108,190,69,0.16), transparent 55%),
    radial-gradient(80% 60% at 85% 110%, rgba(108,190,69,0.10), transparent 60%),
    var(--bg);
}
.hero-grid {
  position: absolute; inset: 0; z-index: 0; opacity: .5;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(circle at 50% 40%, #000 0%, transparent 72%);
  -webkit-mask-image: radial-gradient(circle at 50% 40%, #000 0%, transparent 72%);
}
.hero-cards { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.float-card {
  position: absolute; width: clamp(64px, 8vw, 118px); aspect-ratio: 5/7; border-radius: 10px;
  background: linear-gradient(150deg, var(--panel-2), var(--panel));
  border: 1px solid var(--line); box-shadow: var(--shadow);
  display: grid; place-items: center; opacity: .6;
  will-change: transform;
}
.float-card::after {
  content: ""; width: 46%; height: 46%; border-radius: 6px;
  background: radial-gradient(circle at 40% 35%, var(--green-glow), transparent 70%);
  border: 1px solid rgba(108,190,69,.25);
}
.float-card i { position: absolute; inset: 8px; border-radius: 6px; border: 1px solid rgba(255,255,255,.05); }

.hero-inner { position: relative; z-index: 2; text-align: center; width: 100%; }
.hero-badge {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid var(--line); border-radius: 999px; padding: 8px 18px;
  font-family: var(--ff-head); font-size: .74rem; letter-spacing: .22em; text-transform: uppercase; color: var(--muted);
  background: rgba(255,255,255,.02);
}
.hero-badge .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 var(--green-glow); animation: pulse 2.4s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 var(--green-glow);} 70%{ box-shadow: 0 0 0 10px transparent;} 100%{ box-shadow:0 0 0 0 transparent;} }

.wordmark {
  font-family: var(--ff-display); font-weight: 400; text-transform: uppercase;
  line-height: 0.86; letter-spacing: 0.005em; margin: 22px 0 6px;
}
.wordmark .the { display: block; font-size: clamp(1rem, 3vw, 1.9rem); letter-spacing: .5em; color: var(--green); margin-bottom: .3em; padding-left: .5em; }
.wordmark .name { display: block; font-size: clamp(3.4rem, 15vw, 11rem); color: var(--white); }
.wordmark .name .o { color: var(--green); display: inline-block; }

.hero-tag {
  font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .2em;
  font-size: clamp(.72rem, 1.7vw, 1rem); color: var(--muted); margin-top: 6px;
  display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;
}
.hero-tag .sep { color: var(--green); }

.bst { display: inline-flex; align-items: stretch; margin-top: 30px; }
.bst-inner {
  display: flex; align-items: center; gap: clamp(12px, 3vw, 30px);
  padding: 14px clamp(24px, 5vw, 54px);
  border: 2px solid var(--green); position: relative;
  clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 50%, calc(100% - 18px) 100%, 18px 100%, 0 50%);
}
.bst-inner span {
  font-family: var(--ff-display); text-transform: uppercase; color: var(--green);
  font-size: clamp(1.1rem, 3.4vw, 2rem); letter-spacing: .04em;
}
.bst-inner .d { color: var(--white); font-size: .8em; align-self: center; }

.hero-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-top: 38px; }

.scroll-cue {
  position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); z-index: 3;
  font-family: var(--ff-head); font-size: .68rem; letter-spacing: .3em; text-transform: uppercase; color: var(--muted-2);
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.scroll-cue .bar { width: 1px; height: 42px; background: linear-gradient(var(--green), transparent); animation: cue 2s infinite; }
@keyframes cue { 0%,100%{opacity:.3; transform: scaleY(.6);} 50%{opacity:1; transform: scaleY(1);} }

/* ---------- Marquee ---------- */
.marquee { border-block: 1px solid var(--line); background: var(--bg-2); padding: 20px 0; overflow: hidden; }
.marquee-track { display: flex; gap: 56px; width: max-content; animation: scrollx 32s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-track span {
  font-family: var(--ff-display); text-transform: uppercase; font-size: clamp(1.1rem, 2.4vw, 1.7rem);
  letter-spacing: .04em; color: var(--muted-2); display: inline-flex; align-items: center; gap: 56px; white-space: nowrap;
}
.marquee-track span::after { content: "◆"; color: var(--green); font-size: .6em; }
@keyframes scrollx { to { transform: translateX(-50%); } }

/* ---------- Reveal animation ----------
   Content is visible by default; only hidden (to animate in) when JS is
   present — so the page is never blank if scripts don't run. */
.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.js [data-reveal].in { opacity: 1; transform: none; }
.js [data-reveal-delay="1"] { transition-delay: .08s; }
.js [data-reveal-delay="2"] { transition-delay: .16s; }
.js [data-reveal-delay="3"] { transition-delay: .24s; }
.js [data-reveal-delay="4"] { transition-delay: .32s; }

/* ---------- Pillars (Buy/Sell/Trade/Play) ---------- */
.pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 52px; }
.pillar {
  position: relative; padding: 30px 26px 34px; border-radius: var(--radius-lg);
  background: linear-gradient(180deg, var(--panel), var(--bg-2));
  border: 1px solid var(--line); overflow: hidden;
  transition: transform .45s var(--ease), border-color .45s var(--ease);
  transform-style: preserve-3d;
}
.pillar::before {
  content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity .45s var(--ease);
  background: radial-gradient(120% 80% at 50% 0%, rgba(108,190,69,.16), transparent 60%);
}
.pillar:hover { border-color: rgba(108,190,69,.5); transform: translateY(-6px); }
.pillar:hover::before { opacity: 1; }
.pillar .num { font-family: var(--ff-display); color: var(--green); font-size: 1rem; letter-spacing: .2em; opacity: .8; }
.pillar .ico { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; margin: 14px 0 18px; background: rgba(108,190,69,.1); border: 1px solid rgba(108,190,69,.28); color: var(--green); }
.pillar .ico svg { width: 26px; height: 26px; }
.pillar h3 { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.7rem; letter-spacing: .02em; margin-bottom: 8px; }
.pillar p { color: var(--muted); font-size: .96rem; }

/* ---------- Games grid ---------- */
.games { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 52px; }
.game {
  position: relative; padding: 26px 22px; min-height: 160px; border-radius: var(--radius);
  background: var(--panel); border: 1px solid var(--line);
  display: flex; flex-direction: column; justify-content: space-between;
  overflow: hidden; transition: transform .4s var(--ease), border-color .4s var(--ease), background .4s var(--ease);
}
.game .glow { position: absolute; width: 240px; height: 240px; border-radius: 50%; filter: blur(50px); opacity: 0; transition: opacity .45s ease; top: -60px; right: -60px; }
.game:hover { transform: translateY(-5px); border-color: rgba(255,255,255,.22); background: var(--panel-2); }
.game:hover .glow { opacity: .5; }
.game .tag { font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .18em; font-size: .66rem; color: var(--muted-2); }
.game h4 { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.5rem; line-height: 1; letter-spacing: .01em; position: relative; }
.game p { color: var(--muted); font-size: .86rem; position: relative; }
.game .chip-suit { position: absolute; right: 18px; bottom: 16px; font-size: 1.6rem; opacity: .16; transition: opacity .4s ease, transform .4s ease; }
.game:hover .chip-suit { opacity: .4; transform: translateY(-4px) rotate(-8deg); }

/* ---------- Interactive pull-a-card ---------- */
.deal-wrap { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(30px, 6vw, 80px); align-items: center; margin-top: 40px; }
.deal-stage { display: grid; place-items: center; min-height: 420px; position: relative; perspective: 1400px; }
.deal-stage::after {
  content: ""; position: absolute; width: 300px; height: 300px; border-radius: 50%;
  background: radial-gradient(circle, var(--green-glow), transparent 62%); filter: blur(30px); z-index: 0;
}
.tcard {
  position: relative; width: clamp(210px, 26vw, 270px); aspect-ratio: 5/7;
  transform-style: preserve-3d; transition: transform .8s var(--ease); z-index: 1; cursor: pointer;
}
.tcard.flipped { transform: rotateY(180deg); }
.tcard .face {
  position: absolute; inset: 0; border-radius: 16px; backface-visibility: hidden; -webkit-backface-visibility: hidden;
  overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow);
}
.tcard .back {
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(108,190,69,.22), transparent 55%),
    linear-gradient(160deg, var(--panel-2), var(--bg));
  display: grid; place-items: center; gap: 10px; text-align: center; padding: 20px;
}
.tcard .back svg { width: 64px; }
.tcard .back .hint { font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .24em; font-size: .64rem; color: var(--muted); }
.tcard .back .pat { position: absolute; inset: 12px; border-radius: 10px; border: 1px solid rgba(108,190,69,.25); }
.tcard .front {
  transform: rotateY(180deg);
  background: linear-gradient(160deg, var(--panel), var(--bg-2));
  padding: 18px; display: flex; flex-direction: column; gap: 8px;
}
.tcard .front .rarity { font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .2em; font-size: .62rem; color: var(--green); }
.tcard .front .art { flex: 1; border-radius: 10px; margin: 4px 0; display: grid; place-items: center; font-size: 3.4rem; border: 1px solid var(--line); }
.tcard .front .name { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.4rem; line-height: 1; }
.tcard .front .type { color: var(--muted); font-size: .8rem; }
.deal-copy .btn { margin-top: 22px; }
.deal-copy .pulled { margin-top: 16px; font-family: var(--ff-head); letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; color: var(--muted-2); min-height: 1.2em; }

/* ---------- Shop online / live inventory ---------- */
.shop { background: var(--bg-2); border-block: 1px solid var(--line); }
.shop-card {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(30px, 5vw, 64px); align-items: center;
  padding: clamp(30px, 5vw, 60px); border-radius: var(--radius-lg);
  background:
    radial-gradient(90% 120% at 100% 0%, rgba(108,190,69,.14), transparent 55%),
    linear-gradient(160deg, var(--panel), var(--bg));
  border: 1px solid var(--line);
}
.shop-copy .eyebrow { margin-bottom: 4px; }
.shop-copy .h-sec { margin-top: .25em; }
.shop-actions { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.shop-feats { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 24px; }
.shop-feats li { display: inline-flex; align-items: center; gap: 8px; font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .1em; font-size: .72rem; color: var(--muted); }
.shop-feats svg { width: 16px; height: 16px; color: var(--green); }
.shop-note { margin-top: 18px; color: var(--muted-2); font-size: .82rem; }

.shop-visual { position: relative; min-height: 300px; display: grid; place-items: center; }
.tcg-badge {
  position: absolute; top: 8px; right: 8px; z-index: 3; text-align: right;
  display: flex; flex-direction: column; padding: 10px 16px; border-radius: 12px;
  background: rgba(11,11,12,.6); border: 1px solid var(--line); backdrop-filter: blur(6px);
}
.tcg-badge-top { font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .18em; font-size: .55rem; color: var(--muted-2); }
.tcg-badge-name { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.25rem; color: var(--white); letter-spacing: .01em; }
.fan { position: relative; width: 100%; height: 300px; }
.fan-card {
  position: absolute; left: 50%; top: 50%; width: clamp(96px, 12vw, 132px); aspect-ratio: 5/7;
  border-radius: 12px; background: linear-gradient(150deg, var(--panel-2), var(--panel));
  border: 1px solid var(--line); box-shadow: var(--shadow);
  transform-origin: bottom center; transition: transform .5s var(--ease);
}
.fan-card i { position: absolute; inset: 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,.05); background: radial-gradient(circle at 42% 34%, var(--green-glow), transparent 68%); opacity: .5; }
.fan-card.c1 { transform: translate(-50%, -46%) rotate(-24deg); }
.fan-card.c2 { transform: translate(-50%, -50%) rotate(-12deg); }
.fan-card.c3 { transform: translate(-50%, -53%) rotate(0deg); z-index: 2; }
.fan-card.c4 { transform: translate(-50%, -50%) rotate(12deg); }
.fan-card.c5 { transform: translate(-50%, -46%) rotate(24deg); }
.shop-card:hover .fan-card.c1 { transform: translate(-50%, -47%) rotate(-30deg); }
.shop-card:hover .fan-card.c2 { transform: translate(-50%, -52%) rotate(-15deg); }
.shop-card:hover .fan-card.c3 { transform: translate(-50%, -56%) rotate(0deg); }
.shop-card:hover .fan-card.c4 { transform: translate(-50%, -52%) rotate(15deg); }
.shop-card:hover .fan-card.c5 { transform: translate(-50%, -47%) rotate(30deg); }

/* ---------- Events ---------- */
.events { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin-top: 48px; }
.event {
  padding: 26px 24px; border-radius: var(--radius); background: var(--panel);
  border: 1px solid var(--line); border-left: 3px solid var(--green);
  transition: transform .4s var(--ease), background .4s var(--ease);
}
.event:hover { transform: translateY(-4px); background: var(--panel-2); }
.event .day { font-family: var(--ff-display); text-transform: uppercase; color: var(--green); font-size: 1.05rem; letter-spacing: .12em; }
.event h4 { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.5rem; margin: 8px 0 4px; }
.event .time { color: var(--muted); font-size: .9rem; display: flex; align-items: center; gap: 8px; }
.event .time svg { width: 15px; height: 15px; color: var(--green); }
.events-note { margin-top: 22px; color: var(--muted-2); font-size: .86rem; }

/* ---------- Visit / info ---------- */
.visit { background: var(--bg-2); border-block: 1px solid var(--line); }
.visit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 64px); align-items: stretch; }
.hours-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(26px, 4vw, 40px); }
.hours-card h3 { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.6rem; margin-bottom: 18px; letter-spacing: .02em; }
.hours-list li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: .98rem; }
.hours-list li:last-child { border-bottom: 0; }
.hours-list .d { color: var(--muted); font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .08em; }
.hours-list .t { color: var(--white); font-weight: 500; }
.hours-list li.today { position: relative; }
.hours-list li.today .d { color: var(--green); }
.hours-list li.today::before { content: "TODAY"; position: absolute; left: -6px; top: 50%; transform: translate(-100%,-50%); font-family: var(--ff-head); font-size: .5rem; letter-spacing: .1em; color: var(--green); display: none; }

.contact-block { display: flex; flex-direction: column; gap: 14px; }
.contact-row { display: flex; align-items: center; gap: 16px; padding: 18px 20px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); transition: border-color .3s ease, transform .3s ease; }
.contact-row:hover { border-color: rgba(108,190,69,.45); transform: translateX(4px); }
.contact-row .ci { width: 44px; height: 44px; border-radius: 12px; flex: none; display: grid; place-items: center; background: rgba(108,190,69,.1); color: var(--green); border: 1px solid rgba(108,190,69,.25); }
.contact-row .ci svg { width: 20px; height: 20px; }
.contact-row .cl { font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .16em; font-size: .66rem; color: var(--muted-2); }
.contact-row .cv { font-size: 1.05rem; font-weight: 500; }
.map-embed { margin-top: 10px; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); }
.map-embed iframe { width: 100%; height: 240px; border: 0; filter: grayscale(0.4) contrast(1.05) brightness(.9); }

/* ---------- CTA band ---------- */
.cta-band { text-align: center; background:
  radial-gradient(80% 120% at 50% 0%, rgba(108,190,69,.14), transparent 60%), var(--bg); }
.cta-band h2 { font-family: var(--ff-display); text-transform: uppercase; font-size: clamp(2.2rem, 7vw, 5rem); line-height: .94; }
.cta-band h2 .g { color: var(--green); }
.cta-band .lead { margin: 18px auto 34px; }
.cta-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ---------- Footer ---------- */
.footer { border-top: 1px solid var(--line); background: var(--bg-2); padding-block: 56px 30px; }
.footer-top { display: flex; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.footer .brand svg { width: 44px; }
.footer-brand p { color: var(--muted); margin-top: 14px; max-width: 34ch; font-size: .92rem; }
.footer-cols { display: flex; gap: clamp(30px, 6vw, 72px); flex-wrap: wrap; }
.footer-col h5 { font-family: var(--ff-head); text-transform: uppercase; letter-spacing: .18em; font-size: .72rem; color: var(--muted-2); margin-bottom: 14px; }
.footer-col a, .footer-col li { display: block; color: var(--muted); padding: 5px 0; font-size: .94rem; transition: color .25s ease; }
.footer-col a:hover { color: var(--green); }
.footer-bottom { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: center; color: var(--muted-2); font-size: .82rem; }
.footer-bottom .site { font-family: var(--ff-display); text-transform: uppercase; letter-spacing: .04em; color: var(--white); font-size: 1rem; }
.footer-bottom .site .g { color: var(--green); }

/* ---------- Mobile ---------- */
@media (max-width: 960px) {
  .pillars { grid-template-columns: repeat(2, 1fr); }
  .games { grid-template-columns: repeat(2, 1fr); }
  .deal-wrap { grid-template-columns: 1fr; }
  .visit-grid { grid-template-columns: 1fr; }
  .shop-card { grid-template-columns: 1fr; }
  .shop-visual { min-height: 240px; order: -1; }
}
@media (max-width: 720px) {
  .nav-links, .nav-cta .btn { display: none; }
  .nav-toggle { display: flex; }
  .nav-menu {
    display: flex; position: fixed; inset: 0; z-index: 55; background: rgba(11,11,12,.97); backdrop-filter: blur(14px);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    opacity: 0; pointer-events: none; transition: opacity .35s var(--ease);
  }
  body.menu-open .nav-menu { opacity: 1; pointer-events: auto; }
  .nav-menu a { font-family: var(--ff-display); text-transform: uppercase; font-size: 2rem; color: var(--white); padding: 10px; }
  .nav-menu a::after { display: none; }
  .nav-menu .btn { display: inline-flex; margin-top: 18px; }
  .pillars, .games { grid-template-columns: 1fr; }
  .footer-top { flex-direction: column; }
  .wordmark .name { font-size: clamp(3rem, 19vw, 6rem); }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
  .float-card, .cursor-glow { display: none; }
}
/* Arcade / community lounge direction — overrides the original layout without changing content or behavior. */
:root{--bg:#11142b;--bg-2:#171a38;--panel:#20244a;--panel-2:#292d5a;--line:#3b3f70;--white:#f7f4ff;--muted:#b7b8d0;--muted-2:#7f82a8;--green:#f39a4a;--green-2:#ffbd68;--green-deep:#b85e36;--green-glow:rgba(243,154,74,.38);--ff-display:"Bowlby One SC",Impact,sans-serif;--ff-head:"Space Grotesk",Arial,sans-serif;--ff-body:"Space Grotesk",Arial,sans-serif;--radius:18px;--radius-lg:28px;--shadow:0 22px 55px -20px rgba(0,0,0,.75)}
body{background:var(--bg);color:var(--white)}::selection{background:var(--green-deep);color:#fff}.btn{border-radius:12px;letter-spacing:.08em}.btn--primary{color:#21142f;background:var(--green);box-shadow:0 10px 28px -10px var(--green-glow)}.btn--primary:hover{background:var(--green-2)}.btn--ghost{border-color:var(--line);background:transparent}.btn--ghost:hover{border-color:var(--green);color:#fff;background:rgba(108,190,69,.12)}
.nav{padding-block:20px;border-bottom-color:transparent}.nav.scrolled{background:rgba(17,20,43,.88);border-bottom-color:var(--line)}.brand-name{font-family:var(--ff-display);font-size:1rem;letter-spacing:.045em}.brand-name b{color:var(--green)}.brand-tag{font-family:var(--ff-head);color:var(--muted-2)}.nav-links a{font-family:var(--ff-head);color:var(--muted);letter-spacing:.09em}.nav-links a::after{background:var(--green)}.nav-links a:hover{color:#fff}.nav-toggle{border-color:var(--line)}
.hero{background:radial-gradient(65% 70% at 18% 22%,rgba(108,190,69,.28),transparent 68%),radial-gradient(55% 70% at 86% 75%,rgba(243,154,74,.16),transparent 65%),var(--bg)}.hero-grid{opacity:.38;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px)}.hero::after{content:"PLAY • TRADE • REPEAT";position:absolute;right:-30px;top:48%;font-family:var(--ff-display);font-size:clamp(1.5rem,3vw,2.5rem);letter-spacing:.12em;color:rgba(255,255,255,.06);transform:rotate(90deg)}.float-card{border-color:#466347;background:linear-gradient(150deg,#1d3923,#111b14);box-shadow:var(--shadow)}.float-card::after{background:radial-gradient(circle at 40% 35%,rgba(243,154,74,.4),transparent 70%);border-color:rgba(243,154,74,.55)}.hero-badge{border-color:var(--line);background:rgba(255,255,255,.035);font-family:var(--ff-head);color:var(--muted)}.hero-badge .dot{background:var(--green);box-shadow:0 0 14px var(--green)}.wordmark .the{color:var(--green);font-family:var(--ff-head)}.wordmark .name{font-family:var(--ff-display);letter-spacing:.035em;text-shadow:0 8px 0 rgba(108,190,69,.18)}.wordmark .name .o{color:var(--green)}.hero-tag{font-family:var(--ff-head);color:var(--muted)}.hero-tag .sep{color:var(--green)}.bst-inner{border:2px solid var(--green);clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,16px 100%,0 50%);background:rgba(108,190,69,.08)}.bst-inner span{font-family:var(--ff-display);color:var(--green)}.bst-inner .d{color:var(--green)}.scroll-cue{color:var(--muted-2)}.scroll-cue .bar{background:linear-gradient(var(--green),transparent)}
.marquee{background:#16251a;border-block-color:#4a4389}.marquee-track span{font-family:var(--ff-display);color:#e2ddff}.marquee-track span::after{color:var(--green)}
.eyebrow{font-family:var(--ff-head);color:var(--green)}.eyebrow::before{background:var(--green)}.h-sec{font-family:var(--ff-display);letter-spacing:.02em}.h-sec .g{color:var(--green)}.lead{color:var(--muted)}
.pillar{background:linear-gradient(180deg,var(--panel),var(--bg-2));border-color:var(--line)}.pillar::before{background:radial-gradient(120% 80% at 50% 0%,rgba(108,190,69,.22),transparent 60%)}.pillar:hover{border-color:var(--green-deep)}.pillar .num{color:var(--green)}.pillar .ico{background:rgba(108,190,69,.16);border-color:rgba(154,119,255,.55);color:var(--green-2)}.pillar h3{font-family:var(--ff-display)}.pillar p{color:var(--muted)}
.game{background:var(--panel);border-color:var(--line);border-radius:var(--radius-lg)}.game:hover{border-color:var(--green-deep);background:var(--panel-2);box-shadow:0 12px 28px rgba(0,0,0,.2)}.game .tag{font-family:var(--ff-head);color:var(--green)}.game h4{font-family:var(--ff-display)}.game p{color:var(--muted)}.game .chip-suit{filter:none}.game .glow{opacity:.18!important}
.shop{background:var(--bg-2)}.shop-card{background:linear-gradient(135deg,#18271b,#16251a);border:1px solid #355438;border-radius:var(--radius-lg);padding:clamp(28px,5vw,65px)}.tcg-badge{background:var(--green);color:#20152a;box-shadow:0 14px 35px rgba(243,154,74,.25)}.fan-card{border-color:#171a38;background:linear-gradient(145deg,#233b27,#142018)}.fan-card.c3{background:var(--green-deep)}.shop-feats{color:var(--muted)}.shop-note{color:var(--muted-2)}
.event{background:var(--panel);border-color:var(--line);border-radius:var(--radius)}.event:hover{background:var(--panel-2);border-color:var(--green-deep)}.event .day{color:var(--green)}.event h4{font-family:var(--ff-display)}.event .time{color:var(--muted)}.events-note{color:var(--muted)}
.visit{background:#0d1025}.visit .eyebrow{color:var(--green)}.visit .eyebrow::before{background:var(--green)}.visit .lead{color:var(--muted)}.hours-card{border-color:var(--line)}.hours-list li{border-color:var(--line)}.hours-list .d{color:var(--muted)}.hours-list .t{color:#fff}.hours-list li.today .d{color:var(--green)}.contact-row{background:var(--panel);border-color:var(--line);border-radius:var(--radius)}.contact-row:hover{border-color:var(--green-deep)}.contact-row .ci{background:rgba(108,190,69,.15);border-color:rgba(154,119,255,.5);color:var(--green-2)}.contact-row .cl{color:var(--muted-2)}.map-embed{border-color:var(--line);border-radius:var(--radius)}.map-embed iframe{filter:grayscale(.65) hue-rotate(180deg) brightness(.75)}
.cta-band{background:radial-gradient(70% 100% at 50% 0%,rgba(108,190,69,.24),transparent 65%),var(--bg)}.cta-band h2{font-family:var(--ff-display)}.cta-band h2 .g{color:var(--green)}.footer{background:#0d1025;border-top-color:var(--line)}.footer .brand-name{font-family:var(--ff-display)}.footer-brand p,.footer-col a,.footer-col li,.footer-bottom{color:var(--muted)}.footer-col h5{color:var(--green)}.footer-col a:hover{color:var(--green-2)}.footer-bottom{border-color:var(--line)}.footer-bottom .site{font-family:var(--ff-display);color:#fff}.footer-bottom .site .g{color:var(--green)}
@media(max-width:720px){.nav-menu{background:rgba(17,20,43,.98)}.nav-menu a{font-family:var(--ff-display);color:#fff}.nav-menu .btn{font-family:var(--ff-head)}.hero::after{display:none}.shop-card{padding:28px 20px}.pillars,.games{gap:12px}.pillar{border:1px solid var(--line);border-radius:var(--radius)}.event{border:1px solid var(--line);margin-bottom:10px}}
/* Stronghold layout direction: black + green brand, asymmetric community-shop architecture. */
:root{--bg:#090a0b;--bg-2:#101214;--panel:#16191b;--panel-2:#1d2220;--line:#2b3430;--white:#f4f7f2;--muted:#9ba69e;--muted-2:#68736c;--green:#6cbe45;--green-2:#8bd65c;--green-deep:#3f8e2f;--green-glow:rgba(108,190,69,.32);--ff-display:"Anton","Arial Narrow",Impact,sans-serif;--ff-head:"Oswald","Arial Narrow",sans-serif;--ff-body:"Inter",system-ui,sans-serif;--gutter:clamp(20px,5vw,76px)}
body{background:var(--bg);color:var(--white)}
/* rail-like nav instead of Hard Hittin's centered horizontal header */
.nav{left:0;right:auto;bottom:0;top:0;width:clamp(220px,18vw,280px);padding:34px 26px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:44px;background:#0d0f10;border-right:1px solid var(--line)}.nav.scrolled{padding:34px 26px;background:#0d0f10;border-right-color:var(--line)}.nav .brand{align-items:flex-start;flex-direction:column;gap:14px}.nav .brand img{width:42px}.brand-name{font-size:1.32rem}.nav .brand-tag{padding:0;border:0;font-size:.6rem}.nav-links{display:flex;flex-direction:column;align-items:flex-start;gap:20px}.nav-links a{font-size:.74rem;letter-spacing:.13em}.nav-cta{margin-top:auto}.nav-cta .btn{white-space:nowrap}.nav-toggle{display:none}
main,.footer{margin-left:clamp(220px,18vw,280px)}.wrap{max-width:1320px;padding-inline:clamp(30px,6vw,100px)}.section{padding-block:clamp(82px,10vw,150px)}
/* hero becomes a two-column landing panel with left-aligned copy */
.hero{min-height:100svh;padding-top:100px;align-items:center;background:radial-gradient(circle at 75% 44%,rgba(108,190,69,.16),transparent 27%),linear-gradient(115deg,#090a0b 0 57%,#111716 57%)}.hero-inner{text-align:left;max-width:1320px}.hero::after{content:"THE COMMUNITY SHOP";position:absolute;right:-5px;bottom:90px;color:rgba(108,190,69,.13);font-family:var(--ff-display);font-size:clamp(1.4rem,4vw,3.5rem);letter-spacing:.14em;transform:rotate(-90deg);transform-origin:right bottom}.hero-grid{left:56%;right:0;opacity:.36;background-size:42px 42px;mask-image:linear-gradient(90deg,transparent,#000 30%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%,transparent)}.hero-cards .float-card:nth-child(1){left:68%!important;top:24%!important}.hero-cards .float-card:nth-child(2){left:82%!important;top:62%!important}.hero-cards .float-card:nth-child(3){left:61%!important;top:67%!important}.hero-cards .float-card:nth-child(4){left:88%!important;top:22%!important}.hero-cards .float-card:nth-child(5){left:74%!important;top:44%!important}.hero-badge{border-radius:5px;padding:8px 13px}.wordmark{margin-top:26px}.wordmark .name{font-size:clamp(4.5rem,11vw,10rem)}.hero-tag{justify-content:flex-start}.bst{margin-top:26px}.hero-actions{justify-content:flex-start}.scroll-cue{left:auto;right:40px;transform:none;bottom:30px}
.marquee{margin-left:0}.marquee-track{animation-duration:45s}
/* split text rhythm and offset content blocks */
.section>.wrap> .h-sec,.section>.wrap> .lead,.section>.wrap> .eyebrow{margin-left:8%}.h-sec{max-width:760px}.lead{max-width:64ch}.counter{background:var(--bg-2);border-block:1px solid var(--line)}.counter .pillars{margin-left:8%;max-width:920px}.pillars{grid-template-columns:repeat(2,1fr);gap:14px}.pillar{min-height:210px;padding:25px 24px;border-radius:10px}.pillar:nth-child(2){transform:translateY(30px)}.pillar:nth-child(2):hover{transform:translateY(24px)}.pillar:nth-child(3){transform:translateY(-12px)}.pillar:nth-child(3):hover{transform:translateY(-18px)}.pillar:nth-child(4){transform:translateY(18px)}.pillar:nth-child(4):hover{transform:translateY(12px)}.pillar .ico{border-radius:8px}.counter-note{margin-left:8%}
/* catalog is a broad 3-column shelf, not the same 4-up card grid */
.games,.carry{grid-template-columns:repeat(3,1fr);gap:12px;margin-left:8%;max-width:1050px}.game,.cat{border-radius:8px;min-height:190px}.game:nth-child(2),.cat:nth-child(2){transform:translateY(20px)}.game:nth-child(5),.cat:nth-child(5){transform:translateY(-14px)}
.shop-card{border-radius:10px;grid-template-columns:.9fr 1.1fr;padding:clamp(28px,5vw,65px);background:linear-gradient(120deg,var(--panel),#1a2b1b);border:1px solid #355438}.shop-copy{order:2}.shop-visual{order:1}.shop-visual::before{border-radius:18px;transform:rotate(12deg);background:var(--green)}.tcg-badge{border-radius:10px;background:var(--green);color:#0b160a}.fan-card{border-radius:8px}
/* the schedule reads like a community board */
.events{grid-template-columns:repeat(2,1fr);gap:12px;border:0;margin-left:8%;max-width:950px}.event{border:1px solid var(--line);border-radius:10px;background:var(--panel);min-height:170px}.event:nth-child(2){transform:translateY(28px)}.event:nth-child(3){transform:translateY(-12px)}
.visit-grid{margin-left:8%;grid-template-columns:.85fr 1.15fr}.hours-card{border-top:2px solid var(--green)}.contact-row{border-radius:8px}.cta-band{text-align:left;background:linear-gradient(90deg,#121914,#090a0b)}.cta-band .wrap{padding-left:16%}.cta-band .lead{margin-left:0}.cta-actions{justify-content:flex-start}.footer{background:#070808}.footer-top{padding-inline:0}
@media(max-width:960px){.nav{position:fixed;inset:0 0 auto;width:auto;height:76px;bottom:auto;right:0;padding:14px 24px;flex-direction:row;align-items:center;gap:0;border-right:0;border-bottom:1px solid var(--line)}.nav.scrolled{padding:14px 24px}.nav .brand{flex-direction:row;align-items:center;gap:10px}.nav .brand img{width:32px}.nav-links,.nav-cta{display:none}.nav-toggle{display:flex;margin-left:auto}.nav-menu{display:flex;position:fixed;inset:76px 0 0;z-index:55;background:rgba(9,10,11,.98);flex-direction:column;align-items:center;justify-content:center;gap:9px;opacity:0;pointer-events:none;transition:opacity .25s}.nav-menu a{font-family:var(--ff-display);text-transform:uppercase;font-size:1.7rem;padding:8px}.nav-menu .btn{display:inline-flex;margin-top:16px;font-family:var(--ff-head)}body.menu-open .nav-menu{opacity:1;pointer-events:auto}main,.footer{margin-left:0}.hero{padding-top:140px}.hero::after{display:none}.hero-grid{left:0}.section>.wrap> .h-sec,.section>.wrap> .lead,.section>.wrap> .eyebrow,.counter .pillars,.counter-note,.games,.carry,.events,.visit-grid{margin-left:0}.shop-copy{order:1}.shop-visual{order:0}.cta-band .wrap{padding-left:var(--gutter)}}
@media(max-width:720px){.hero{background:radial-gradient(circle at 80% 30%,rgba(108,190,69,.18),transparent 34%),var(--bg)}.hero-inner{text-align:left}.wordmark .name{font-size:clamp(4rem,18vw,7rem)}.hero-tag{font-size:.68rem}.pillars,.games,.carry,.events{grid-template-columns:1fr}.pillar:nth-child(n),.game:nth-child(n),.cat:nth-child(n),.event:nth-child(n){transform:none}.game,.cat{min-height:170px}.events{gap:10px}.event{min-height:140px}.shop-card{padding:23px 18px}.shop-visual{min-height:250px}.fan{transform:scale(.8)}.footer-top{flex-direction:column}}
/* FINAL STRONGHOLD DIRECTION: black + green only. Structural, not cosmetic. */
:root{--bg:#080a09!important;--bg-2:#0e1210!important;--panel:#151b17!important;--panel-2:#1d2820!important;--line:#344238!important;--white:#f2f7f0!important;--muted:#a2afa4!important;--muted-2:#718075!important;--green:#6cbe45!important;--green-2:#94dc68!important;--green-deep:#3f8e2f!important;--green-glow:rgba(108,190,69,.28)!important}
body{background:var(--bg)!important;color:var(--white)!important}.cursor-glow,.hero-grid,.hero-cards{display:none!important}
/* top utility bar; no side rail, no centered hero */
.nav,.nav.scrolled{position:fixed!important;inset:0 0 auto!important;width:100%!important;height:70px!important;padding:0 clamp(20px,5vw,64px)!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:20px!important;background:rgba(8,10,9,.95)!important;border-bottom:1px solid var(--line)!important}.nav .brand{flex-direction:row!important;align-items:center!important;gap:10px!important}.nav .brand img{width:28px!important}.brand-name{font-size:1.05rem!important}.brand-tag{font-size:.56rem!important;color:var(--muted-2)!important}.nav .brand-tag{padding-left:11px!important;border-left:1px solid var(--line)!important}.nav-links{margin-left:auto!important;display:flex!important;flex-direction:row!important;gap:25px!important}.nav-links a{font-size:.68rem!important;letter-spacing:.1em!important}.nav-links a::after{background:var(--green)!important}.nav-cta{display:flex!important;margin:0!important}.nav-cta .btn{padding:10px 15px!important;font-size:.65rem!important}.nav-toggle{display:none!important}
main,.footer{margin-left:0!important}.wrap{max-width:1280px!important}.section{padding-block:clamp(74px,9vw,125px)!important}
/* split hero: content + dashboard panel */
.hero{min-height:100svh!important;padding-top:120px!important;display:block!important;background:var(--bg)!important}.hero-inner{max-width:1280px!important;width:auto!important;margin-inline:auto!important;text-align:left!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(300px,.65fr)!important;column-gap:clamp(40px,9vw,150px)!important;align-items:center!important;min-height:calc(100svh - 120px)!important}.hero-badge{grid-column:1!important;justify-self:start!important;border:0!important;border-left:3px solid var(--green)!important;border-radius:0!important;padding:3px 0 3px 14px!important;background:none!important}.wordmark{grid-column:1!important;margin:20px 0 10px!important}.wordmark .top,.wordmark .the{font-size:clamp(.9rem,2vw,1.3rem)!important;letter-spacing:.28em!important;color:var(--green)!important}.wordmark .name{font-size:clamp(4rem,11vw,9.5rem)!important;letter-spacing:.02em!important}.wordmark .name .o{color:var(--green)!important}.hero-tag{grid-column:1!important;justify-content:flex-start!important}.bst{grid-column:1!important;margin-top:24px!important}.bst-inner{border:0!important;border-left:3px solid var(--green)!important;clip-path:none!important;background:var(--panel)!important;padding:14px 24px!important}.bst-inner span{color:var(--white)!important}.bst-inner .d{color:var(--green)!important}.hero-actions{grid-column:1!important;justify-content:flex-start!important;margin-top:25px!important}.hero::before{content:""!important;display:block!important;position:absolute!important;right:7%!important;top:24%!important;width:31vw!important;height:31vw!important;max-width:430px!important;max-height:430px!important;border:1px solid var(--green)!important;border-radius:50%!important;opacity:.25!important}.hero::after{content:"OPEN TABLES / FRESH INVENTORY / WEEKLY EVENTS"!important;position:absolute!important;right:clamp(25px,6vw,90px)!important;bottom:80px!important;color:var(--green)!important;opacity:.65!important;font-family:var(--ff-head)!important;font-size:.62rem!important;letter-spacing:.2em!important;writing-mode:vertical-rl!important;transform:none!important}
.marquee{background:var(--green)!important;border:0!important;color:#071006!important;padding:13px 0!important}.marquee-track span{color:#071006!important;font-family:var(--ff-head)!important;font-size:.8rem!important;letter-spacing:.15em!important}.marquee-track span::after{color:#071006!important}
/* sections become editorial two-column blocks with rules, not repeated hero cards */
.section>.wrap>.eyebrow,.section>.wrap>.h-sec,.section>.wrap>.lead{margin-left:0!important}.h-sec{max-width:720px!important}.h-sec .g{color:var(--green)!important}.lead{color:var(--muted)!important}.counter{border-block:1px solid var(--line)!important;background:var(--bg-2)!important}.pillars{grid-template-columns:repeat(3,1fr)!important;gap:0!important;margin:50px 0 0!important;border-top:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}.pillar{border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;background:transparent!important;min-height:260px!important;padding:28px 30px!important}.pillar:last-child{border-right:0!important}.pillar:nth-child(n){transform:none!important}.pillar:hover{background:var(--panel)!important}.pillar .ico{border-radius:50%!important;background:transparent!important;border-color:var(--green)!important;color:var(--green)!important}.pillar .num{color:var(--green)!important}.counter-note{margin-left:0!important}
/* catalog bento */.games,.carry{margin-left:0!important;max-width:none!important;grid-template-columns:1.35fr .9fr .9fr!important;grid-auto-rows:minmax(145px,auto)!important;gap:12px!important}.game,.cat{min-height:0!important;border-radius:4px!important;background:var(--panel)!important;border:1px solid var(--line)!important}.game:first-child,.cat:first-child{grid-row:span 2!important;min-height:305px!important}.game:nth-child(n),.cat:nth-child(n){transform:none!important}.game:hover,.cat:hover{background:var(--panel-2)!important;border-color:var(--green)!important}.game .tag,.cat .tag{color:var(--green)!important}.game .glow,.cat .glow{opacity:.12!important}.game h4,.cat h4{font-size:1.6rem!important}.game .chip-suit,.cat .chip-suit{filter:grayscale(1)!important}
/* shop as a compact command panel */.shop{background:var(--bg)!important}.shop-card{grid-template-columns:1fr .8fr!important;border-radius:4px!important;border:1px solid var(--green)!important;background:var(--panel)!important;padding:clamp(25px,5vw,58px)!important}.shop-copy{order:1!important}.shop-visual{order:2!important}.tcg-badge{border-radius:4px!important;background:var(--green)!important;color:#0a1209!important}.fan-card{border-radius:3px!important;background:var(--panel-2)!important}.fan-card.c3{background:var(--green)!important}
/* event wall */.events{grid-template-columns:repeat(4,1fr)!important;gap:0!important;border-top:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important;margin:50px 0 0!important;max-width:none!important}.event{border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;background:transparent!important;min-height:190px!important}.event:last-child{border-right:0!important}.event:nth-child(n){transform:none!important}.event:hover{background:var(--panel)!important}.event .day{color:var(--green)!important}
.visit{background:#0a0e0b!important}.visit-grid{margin-left:0!important;grid-template-columns:.7fr 1.3fr!important}.hours-card{border-color:var(--green)!important}.contact-row{border-radius:4px!important;background:var(--panel)!important}.contact-row:hover{border-color:var(--green)!important}.contact-row .ci{border-color:var(--green)!important;background:transparent!important;color:var(--green)!important}.cta-band{text-align:left!important;background:var(--green)!important;color:#071006!important}.cta-band h2,.cta-band .lead{color:#071006!important}.cta-band h2 .g{color:#071006!important;text-decoration:underline!important}.cta-band .wrap{padding-left:var(--gutter)!important}.cta-actions{justify-content:flex-start!important}.cta-band .btn--primary{background:#071006!important;color:var(--green)!important;border-color:#071006!important}.cta-band .btn--ghost{border-color:#071006!important;color:#071006!important}.footer{background:#050706!important}
@media(max-width:960px){.hero-inner{grid-template-columns:1fr!important}.hero::before{right:8%;top:20%;width:40vw;height:40vw}.hero::after{display:none}.shop-card{grid-template-columns:1fr!important}.shop-visual{order:0!important}.events{grid-template-columns:repeat(2,1fr)!important}.event:nth-child(2){border-right:0!important}.event:nth-child(-n+2){border-bottom:1px solid var(--line)!important}.event:nth-child(4){border-right:0!important}.pillars{grid-template-columns:1fr 1fr!important}.pillar:nth-child(2){border-right:0!important}.pillar:nth-child(-n+2){border-bottom:1px solid var(--line)!important}}
@media(max-width:720px){.nav,.nav.scrolled{height:68px!important;padding-inline:18px!important}.nav-links,.nav-cta{display:none!important}.nav-toggle{display:flex!important;margin-left:auto!important}.nav-menu{background:rgba(8,10,9,.99)!important}.nav-menu a{font-family:var(--ff-display)!important}.hero{padding-top:105px!important}.hero-inner{min-height:calc(100svh - 105px)!important}.hero::before{right:-12%;top:45%;width:65vw;height:65vw}.wordmark .name{font-size:clamp(3.3rem,18vw,6.4rem)!important}.hero-actions{flex-direction:column;align-items:flex-start}.pillars,.games,.carry,.events{grid-template-columns:1fr!important}.pillar{border-right:0!important;border-bottom:1px solid var(--line)!important;min-height:0!important}.pillar:last-child{border-bottom:0!important}.game:first-child,.cat:first-child{grid-row:auto!important;min-height:185px!important}.event{border-right:0!important;border-bottom:1px solid var(--line)!important}.event:last-child{border-bottom:0!important}.shop-card{padding:22px 18px!important}}
/* Mobile correction: the visit section must become one readable column. */
@media (max-width: 720px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  main,.footer,.wrap{max-width:100%;min-width:0}
  .visit-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:28px!important;margin:0!important}
  .hours-card,.contact-block,.contact-row,.map-embed{width:100%;min-width:0;max-width:100%}
  .hours-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px;font-size:.88rem}
  .hours-list .d,.hours-list .t{min-width:0}
  .hours-list .t{text-align:right;white-space:normal}
  .contact-row{padding:15px 14px!important}
  .contact-row .cv{overflow-wrap:anywhere}
  .map-embed iframe{height:210px}
}
/* Wordmark lockup: never wrap, and replace the green O with the house mark. */
.wordmark .name{white-space:nowrap!important;display:block!important;font-size:clamp(3.2rem,10.5vw,9.5rem)!important;letter-spacing:0!important}
.wordmark .name .o{display:inline-flex!important;align-items:center!important;justify-content:center!important;vertical-align:middle!important;width:.7em!important;height:.82em!important;margin-inline:.015em!important;color:transparent!important;overflow:hidden!important}
.wordmark .name .o img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;mix-blend-mode:screen!important}
.footer .brand-name{white-space:nowrap!important}.footer .brand-o{display:inline-flex!important;vertical-align:middle!important;width:1em!important;height:1em!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;color:transparent!important}.footer .brand-o img{width:100%!important;height:100%!important;object-fit:cover!important;mix-blend-mode:screen!important}
@media(max-width:720px){.wordmark .name{font-size:clamp(2.25rem,11.8vw,4.4rem)!important;letter-spacing:-.02em!important}.wordmark .name .o{width:.72em!important;height:.84em!important}.footer .brand-name{font-size:.95rem!important}}