/* GavelRecall shared base — design tokens, reset, nav, breadcrumb, ad-strip,
   footer/disclaimer, and scroll-reveal helpers that were duplicated (with
   small drift) across all four Phase 1 pages. Page-specific <style> blocks
   layer on top of this via normal cascade (linked before each page's own
   <style>), overriding only what genuinely differs per page. */

:root{
  --mahogany:#2C1810;
  --mahogany-light:#4A2A1A;
  --navy:#0A1628;
  --offwhite:#f8f9fa;
  --white:#ffffff;
  --gold:#B8860B;
  --gold-bright:#D4A017;
  --crimson:#7B1D1D;
  --crimson-dark:#450A0A;
  --forest:#1A3D2B;
  --ink:#1a1410;
  --ink-soft:#5c5048;
  --line:#e3ddd3;
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  font-family:'Georgia','Iowan Old Style',serif;
  background:var(--offwhite);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}

.display{font-family:'Playfair Display', Georgia, serif;}
h1,h2,h3{font-family:'Playfair Display', Georgia, serif;font-weight:700;}
.utility{font-family:'Courier New', monospace;}

/* Scroll-reveal (driven by each page's own IntersectionObserver script) */
.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.6s ease, transform 0.6s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}

/* Shared by every answer-reveal / unlock-reveal panel across pages/games */
@keyframes fadein{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

/* Nav shell — homepage layers extra texture/countdown/hover-underline on top */
nav{
  background:var(--mahogany);
  color:var(--offwhite);
  padding:16px 5%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:3px solid var(--gold);
  position:sticky;
  top:0;
  z-index:100;
}
.logo{display:flex;align-items:center;gap:10px;font-size:1.4rem;}
.logo svg{width:26px;height:26px;}
.nav-links{display:flex;gap:30px;font-size:0.92rem;}
.nav-links a{color:var(--offwhite);text-decoration:none;opacity:0.85;}
.nav-links a:hover{opacity:1;}
.nav-cta{background:var(--gold);color:var(--mahogany);padding:9px 18px;border-radius:2px;font-weight:700;font-size:0.88rem;border:none;cursor:pointer;font-family:Georgia,serif;}

@media (max-width:720px){
  .nav-links{display:none;}
}

/* Breadcrumb — category and case-profile pages */
.breadcrumb{padding:16px 5%;background:var(--white);border-bottom:1px solid var(--line);font-family:'Courier New',monospace;font-size:0.75rem;letter-spacing:0.5px;color:var(--ink-soft);}
.breadcrumb a{color:var(--ink-soft);text-decoration:none;}
.breadcrumb a:hover{color:var(--crimson);}
.breadcrumb .sep{margin:0 8px;color:#c7bfb2;}
.breadcrumb .current{color:var(--crimson);}

/* Ad strip — shared shell; per-page padding/ad-slot sizing may still override */
.ad-strip{background:var(--offwhite);padding:20px 5%;text-align:center;border-bottom:1px solid var(--line);border-top:1px solid var(--line);}
.ad-slot{margin:0 auto;border:1px dashed #c7bfb2;font-family:'Courier New',monospace;letter-spacing:1.5px;color:#9a8f80;text-transform:uppercase;background:var(--white);}

/* Footer + disclaimer — category/case-profile simple centered variant.
   Homepage's larger footer-grid layout stays fully page-local. */
footer{background:var(--mahogany);color:#c9beb0;padding:44px 5% 24px;text-align:center;}
footer .logo{color:var(--offwhite);justify-content:center;margin-bottom:12px;}
.disclaimer{max-width:900px;margin:0 auto;font-size:0.8rem;line-height:1.6;color:#8a7c6c;}