/* =====================================================================
   SMASH DUDE — main stylesheet (image-free; CSS/SVG brand art)
   Gritty skeuomorphic game-HUD. Cinematic textured hero + clean body.
   ===================================================================== */
:root{
  --sd-ink-950:#0C0907; --sd-ink-900:#14100C; --sd-ink-800:#1E1812; --sd-ink-700:#2A221A;
  --sd-wood-900:#2E1B0C; --sd-wood-800:#4A2C13; --sd-wood-700:#6B4220; --sd-wood-500:#A8712F;
  --sd-gold-600:#E0A91E; --sd-gold-500:#F5C842; --sd-gold-400:#FFD964; --sd-gold-300:#FFE899;
  --sd-brick-600:#993B27; --sd-brick-500:#BC4E33;
  --sd-steel-900:#23262B; --sd-steel-800:#34383F; --sd-steel-500:#8A8F96; --sd-steel-200:#E1E5EA;
  --sd-blue-600:#1E6FD0; --sd-blue-500:#2B8FE8; --sd-blue-400:#54A8F2;
  --sd-neon-blue:#18C8FF; --sd-neon-pink:#FF2D9B; --sd-neon-green:#8CFF2A; --sd-neon-purple:#A23BFF;
  --sd-flame:#FF6A00; --sd-paper:#fff;
  --tex-steel: repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, rgba(0,0,0,.05) 1px 2px), linear-gradient(180deg,#8d939b 0%,#6c7178 52%,#5b6066 100%);
  --tex-graphite: repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0 1px, rgba(0,0,0,.04) 1px 2px), linear-gradient(180deg,#34373d 0%,#25282d 100%);
  --tex-wood: linear-gradient(180deg,#55351a 0%,#3c2613 60%,#2a1a0d 100%);
  --tex-blue: linear-gradient(180deg,#3a97e0 0%,#2173c4 55%,#195ea6 100%);
  --tex-gold: linear-gradient(180deg,#e6c255 0%,#cda236 55%,#b3892a 100%);
  --edge-metal: inset 0 0 0 1px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.14);
  --edge-inset: inset 0 2px 5px rgba(0,0,0,.55), inset 0 -1px 0 rgba(255,255,255,.05);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.45), 0 2px 5px rgba(0,0,0,.28);
  --shadow-md: 0 3px 8px rgba(0,0,0,.45), 0 1px 2px rgba(0,0,0,.35);
  --shadow-lg: 0 14px 30px rgba(0,0,0,.55), 0 4px 10px rgba(0,0,0,.4);
  --text-stroke-dark:-1.5px -1.5px 0 rgba(0,0,0,.85),1.5px -1.5px 0 rgba(0,0,0,.85),-1.5px 1.5px 0 rgba(0,0,0,.85),1.5px 1.5px 0 rgba(0,0,0,.85),0 3px 0 rgba(0,0,0,.5);
}

body{ background:var(--sd-ink-900); color:var(--sd-steel-200); }
a{ text-decoration:none; }
img{ max-width:100%; height:auto; display:block; }
.sd-impact{ font-family:'Bangers','Lilita One',cursive; letter-spacing:.04em; text-shadow:var(--text-stroke-dark); }
.sd-label{ font-family:'Nunito',sans-serif; font-weight:800; text-transform:uppercase; letter-spacing:.08em; font-size:.7rem; color:var(--sd-steel-500); }
.wp-block-list.is-style-none{ list-style:none; padding-left:0; margin:0; display:flex; flex-direction:column; gap:8px; }

/* ---- CSS BRICK WALL ---- */
.sd-brick{background:linear-gradient(180deg,#1a130d 0%,#0c0907 100%)}

/* ====================================================================
   HEADER / NAV
   ==================================================================== */
.sd-header{ background:var(--tex-wood); box-shadow:var(--edge-metal), 0 4px 14px rgba(0,0,0,.5); position:sticky; top:0; z-index:50; }
.sd-header .wp-block-site-title a{ color:var(--sd-gold-400); font-family:'Lilita One',sans-serif; font-size:1.4rem; letter-spacing:.01em; text-shadow:0 2px 0 rgba(0,0,0,.5); }
.sd-header .wp-block-navigation a{ color:#f3e9da; font-family:'Lilita One',sans-serif; letter-spacing:.02em; }
.sd-header .wp-block-navigation a:hover{ color:var(--sd-gold-400); }
.sd-logo{ display:inline-flex; align-items:center; gap:10px; }
.sd-logo .sd-dude-mark{ width:40px; height:40px; }
.sd-logo .sd-wordmark{ font-family:'Lilita One',sans-serif; color:var(--sd-gold-400); font-size:1.4rem; letter-spacing:.01em; text-shadow:0 2px 0 rgba(0,0,0,.5); }

/* ---- SVG DUDE MARK (wooden face) ---- */
.sd-dude-mark, .sd-dude{ display:block; }

/* ====================================================================
   BUTTONS
   ==================================================================== */
.sd-btn, .wp-block-button__link{ font-family:'Lilita One',sans-serif; letter-spacing:.01em; border-radius:12px; box-shadow:var(--shadow-md), var(--edge-metal); transition:transform 80ms ease, filter 80ms ease; }
.sd-btn:active, .wp-block-button__link:active{ transform:translateY(1px); filter:brightness(.94); box-shadow:var(--shadow-sm), var(--edge-inset); }
.wp-block-button.is-style-action .wp-block-button__link{ background:var(--tex-blue); color:#fff; }
.wp-block-button.is-style-gold .wp-block-button__link{ background:var(--tex-gold); color:#2a1a0d; }
.wp-block-button.is-style-ghost .wp-block-button__link{ background:transparent; box-shadow:inset 0 0 0 2px rgba(255,255,255,.25); color:#fff; }

/* store badges */
.sd-stores{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.sd-store{ display:flex; align-items:center; gap:12px; cursor:default; background:linear-gradient(180deg,#1c1c1f 0%, #050505 100%); border-radius:13px; padding:10px 18px; min-width:188px; box-shadow:var(--shadow-md), inset 0 0 0 1px rgba(255,255,255,.12); color:#fff; position:relative; }
.sd-store svg{ width:28px; height:28px; flex:0 0 auto; fill:#fff; }
.sd-store .sd-store-top{ font-size:.62rem; letter-spacing:.04em; text-transform:uppercase; opacity:.85; font-weight:700; }
.sd-store .sd-store-big{ font-family:'Lilita One',sans-serif; font-size:1.18rem; line-height:1; }
.sd-store .sd-soon{ position:absolute; top:-9px; right:-9px; background:var(--tex-gold); color:#2a1a0d; font-family:'Lilita One',sans-serif; font-size:.6rem; padding:3px 8px; border-radius:999px; box-shadow:var(--shadow-sm); transform:rotate(6deg); }

/* ====================================================================
   ARENA SCENE / PHONE MOCKUP  (CSS-built game screenshot)
   ==================================================================== */
.sd-phone{ width:300px; max-width:80vw; margin:0 auto; border-radius:36px; padding:10px; background:linear-gradient(180deg,#2a2d33,#15171a); box-shadow:var(--shadow-lg), inset 0 0 0 2px rgba(255,255,255,.06); }
.sd-arena{ position:relative; aspect-ratio:9/19; border-radius:28px; overflow:hidden; box-shadow:var(--edge-inset); }
.sd-arena .sd-wall{ position:absolute; inset:0; }
.sd-arena .sd-beam{ position:absolute; left:0; right:0; height:8%; background:var(--tex-wood); box-shadow:0 3px 8px rgba(0,0,0,.5); }
.sd-arena .sd-beam.top{ top:0; } .sd-arena .sd-floor{ position:absolute; bottom:0; left:0; right:0; height:10%; background:var(--tex-wood); box-shadow:0 -3px 8px rgba(0,0,0,.5); }
.sd-arena .sd-hud{ position:absolute; top:9%; left:6%; right:6%; height:7%; background:rgba(0,0,0,.35); border-radius:10px; box-shadow:var(--edge-metal); display:flex; align-items:center; gap:8px; padding:0 8px; }
.sd-arena .sd-hud .sd-plus{ margin-left:auto; width:26px; height:26px; border-radius:8px; background:var(--tex-blue); box-shadow:var(--shadow-sm),var(--edge-metal); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Lilita One',sans-serif; }
.sd-arena .sd-coin{ font-family:'Bangers',cursive; color:var(--sd-gold-400); font-size:.8rem; text-shadow:var(--text-stroke-dark); }
.sd-arena .sd-chain{ position:absolute; top:18%; width:4px; height:34%; background:repeating-linear-gradient(180deg,#cdd2d8 0 6px, #6b7178 6px 12px); box-shadow:0 0 4px rgba(0,0,0,.6); }
.sd-arena .sd-chain.l{ left:24%; transform:rotate(10deg); } .sd-arena .sd-chain.r{ right:24%; transform:rotate(-10deg); }
.sd-arena .sd-dude-wrap{ position:absolute; top:30%; left:50%; transform:translateX(-50%); width:46%; }
.sd-arena .sd-fx{ position:absolute; font-family:'Bangers',cursive; text-shadow:var(--text-stroke-dark); }
.sd-arena .sd-fx.splat1{ top:40%; left:10%; color:var(--sd-neon-green); font-size:1.6rem; transform:rotate(-14deg); }
.sd-arena .sd-fx.splat2{ top:55%; right:8%; color:var(--sd-neon-pink); font-size:1.9rem; transform:rotate(12deg); }
.sd-arena .sd-bolt{ position:absolute; top:46%; left:46%; width:3px; height:30%; background:linear-gradient(180deg,#fff,var(--sd-neon-blue)); box-shadow:0 0 12px var(--sd-neon-blue),0 0 26px var(--sd-neon-blue); transform:rotate(8deg); border-radius:2px; }

/* ====================================================================
   HERO
   ==================================================================== */
.sd-hero{ position:relative; overflow:hidden; padding:clamp(3rem,7vw,6rem) 1.25rem clamp(3.5rem,7vw,6rem); }
.sd-hero .sd-hero-bg{ position:absolute; inset:0; }
.sd-hero .sd-hero-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,6,4,.62) 0%, rgba(8,6,4,.8) 65%, var(--sd-ink-900) 100%); box-shadow: inset 0 -120px 120px -60px var(--sd-ink-900), inset 0 60px 90px -40px rgba(0,0,0,.7); }
.sd-hero-inner{ position:relative; z-index:2; max-width:1140px; margin:0 auto; display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; }
.sd-eyebrow{ display:inline-block; font-family:'Lilita One',sans-serif; color:#2a1a0d; background:var(--tex-gold); padding:6px 14px; border-radius:999px; box-shadow:var(--shadow-sm); letter-spacing:.02em; margin-bottom:18px; font-size:.85rem; }
.sd-hero h1{ font-family:'Bangers','Lilita One',cursive; font-size:clamp(3.2rem,9vw,6.4rem); line-height:.9; letter-spacing:.02em; color:#fff; text-shadow:var(--text-stroke-dark); margin:0 0 .35em; }
.sd-hero h1 .sd-pop{ color:var(--sd-neon-green); } .sd-hero h1 .sd-pop-pink{ color:var(--sd-neon-pink); }
.sd-hero-sub{ font-size:clamp(1.05rem,2.2vw,1.32rem); color:#f2ede6; max-width:36ch; margin:0 0 26px; line-height:1.5; font-weight:600; }
.sd-hero-cta{ display:flex; flex-direction:column; gap:18px; }
.sd-proof{ display:flex; align-items:center; gap:10px; margin-top:6px; font-weight:800; color:#fff; flex-wrap:wrap; }
.sd-proof b{ font-family:'Bangers',cursive; color:var(--sd-gold-400); font-size:1.6rem; letter-spacing:.03em; text-shadow:var(--text-stroke-dark); }

/* ====================================================================
   SECTIONS / BANDS
   ==================================================================== */
.sd-section{ padding:clamp(3rem,6vw,5rem) 1.25rem; }
.sd-band-wood{ background:var(--tex-wood); box-shadow:var(--edge-metal); }
.sd-band-ink{ background:var(--sd-ink-900); }
.sd-band-deep{ background:var(--sd-ink-950); }
.sd-band-brick{ position:relative; }
.sd-band-brick::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,16,12,.84), rgba(20,16,12,.92)); z-index:0; }
.sd-band-brick > *{ position:relative; z-index:1; }
.sd-section-head{ text-align:center; max-width:680px; margin:0 auto clamp(2rem,4vw,3rem); }
.sd-section-head h2{ font-size:clamp(2rem,5vw,3.2rem); margin:0 0 .35em; }
.sd-section-head .sd-kicker, .sd-kicker{ display:inline-block; color:var(--sd-gold-400); font-family:'Bangers',cursive; letter-spacing:.05em; font-size:1.2rem; margin-bottom:.4em; text-shadow:var(--text-stroke-dark); }
.sd-section-head p{ color:var(--sd-steel-200); font-size:1.1rem; opacity:.92; }

/* ====================================================================
   CARDS / FEATURES / STATS
   ==================================================================== */
.sd-grid{ display:grid; gap:22px; } .sd-grid-3{ grid-template-columns:repeat(3,1fr); } .sd-grid-2{ grid-template-columns:repeat(2,1fr); }
.sd-card{ background:var(--tex-graphite); border-radius:16px; padding:26px; box-shadow:var(--shadow-md), var(--edge-metal); color:var(--sd-steel-200); }
.sd-card h3{ font-size:1.5rem; margin:0 0 .4em; color:#fff; }
.sd-card p{ margin:0; opacity:.92; line-height:1.55; }
.sd-card .sd-ico{ width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:var(--tex-steel); box-shadow:var(--shadow-sm), var(--edge-metal); margin-bottom:16px; color:#fff; }
.sd-card .sd-ico svg{ width:30px; height:30px; }
.sd-card--gold .sd-ico{ background:var(--tex-gold); color:#2a1a0d; } .sd-card--blue .sd-ico{ background:var(--tex-blue); }
.sd-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; text-align:center; }
.sd-stat{ background:var(--tex-graphite); border-radius:16px; padding:24px 14px; box-shadow:var(--shadow-md), var(--edge-metal); }
.sd-stat .sd-num{ font-family:'Bangers',cursive; font-size:2.6rem; color:var(--sd-gold-400); text-shadow:var(--text-stroke-dark); line-height:1; }
.sd-stat .sd-cap{ color:var(--sd-steel-200); font-weight:700; margin-top:6px; font-size:.95rem; }

/* return / it's-back band */
.sd-back{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; max-width:1140px; margin:0 auto; }
.sd-back h2 .sd-impact{ color:var(--sd-neon-pink); display:block; font-size:1.25em; }

/* ====================================================================
   FAQ
   ==================================================================== */
.sd-faq{ max-width:820px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
.sd-faq details{ background:var(--tex-graphite); border-radius:14px; box-shadow:var(--shadow-sm), var(--edge-metal); overflow:hidden; }
.sd-faq summary{ cursor:pointer; list-style:none; padding:20px 24px; font-family:'Lilita One',sans-serif; font-size:1.2rem; color:#fff; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.sd-faq summary::-webkit-details-marker{ display:none; }
.sd-faq summary::after{ content:"+"; font-family:'Lilita One',sans-serif; color:var(--sd-gold-400); font-size:1.6rem; transition:transform .2s ease; }
.sd-faq details[open] summary::after{ transform:rotate(45deg); }
.sd-faq .sd-faq-body{ padding:0 24px 22px; color:var(--sd-steel-200); line-height:1.6; }

/* ====================================================================
   CTA strip
   ==================================================================== */
.sd-cta{ text-align:center; position:relative; border-radius:22px; padding:clamp(2.5rem,5vw,4rem) 1.5rem; box-shadow:var(--shadow-lg), var(--edge-metal); max-width:1100px; margin:0 auto; overflow:hidden; }
.sd-cta .sd-cta-bg{ position:absolute; inset:0; } .sd-cta .sd-cta-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,16,12,.6), rgba(12,9,7,.86)); }
.sd-cta > *{ position:relative; z-index:1; }
.sd-cta h2{ font-family:'Bangers',cursive; font-size:clamp(2.4rem,6vw,4rem); color:#fff; text-shadow:var(--text-stroke-dark); margin:0 0 .3em; }
.sd-cta .sd-stores{ justify-content:center; margin-top:24px; }

/* ====================================================================
   POSTS / PROSE
   ==================================================================== */
.sd-post-card{ background:var(--tex-graphite); border-radius:16px; overflow:hidden; box-shadow:var(--shadow-md), var(--edge-metal); }
.sd-post-card .sd-post-body{ padding:22px 24px; }
.sd-prose h2{ font-size:2rem; margin-top:1.6em; } .sd-prose p, .sd-prose li{ font-size:1.08rem; line-height:1.7; color:#e9e4dc; } .sd-prose a{ color:var(--sd-gold-400); text-decoration:underline; }

/* ====================================================================
   FOOTER
   ==================================================================== */
.sd-footer{ background:var(--tex-wood); box-shadow:var(--edge-metal), 0 -4px 14px rgba(0,0,0,.4); color:#e8dccb; }
.sd-footer a{ color:#e8dccb; } .sd-footer a:hover{ color:var(--sd-gold-400); }
.sd-footer .wp-block-site-title a{ color:var(--sd-gold-400); font-family:'Lilita One',sans-serif; }
.sd-footnote{ color:#b9a78f; font-size:.82rem; }

/* ====================================================================
   RESPONSIVE
   ==================================================================== */
@media (max-width:900px){
  .sd-hero-inner{ grid-template-columns:1fr; text-align:center; }
  .sd-hero-sub{ margin-left:auto; margin-right:auto; }
  .sd-hero-cta{ align-items:center; } .sd-stores{ justify-content:center; } .sd-proof{ justify-content:center; }
  .sd-hero-art{ order:-1; }
  .sd-grid-3, .sd-grid-2{ grid-template-columns:1fr; }
  .sd-back{ grid-template-columns:1fr; text-align:center; }
  .sd-stats{ grid-template-columns:repeat(2,1fr); }
}
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

/* real-media */
.sd-arena img{width:100%;height:100%;object-fit:cover;display:block}
img.sd-dude-mark{border-radius:24%;box-shadow:var(--shadow-sm)}

/* store-badge-gap */
.sd-store > span{display:flex;flex-direction:column;gap:3px;line-height:1}
.sd-store .sd-store-big{line-height:1}

/* button-hover */
.sd-store{cursor:pointer;transition:transform 120ms ease, filter 120ms ease, box-shadow 120ms ease}
.sd-store:hover{transform:translateY(-2px);filter:brightness(1.12);box-shadow:var(--shadow-lg), inset 0 0 0 1px rgba(255,255,255,.2)}
.sd-store:active{transform:translateY(0);filter:brightness(.96)}
.wp-block-button__link:hover,.sd-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}

/* footer-heading */
.sd-footer h4{margin:0 0 14px}

/* section-h1 */
.sd-section-head h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.05;margin:0 0 .35em}