/* ================================================================
   GamblingCons — Design Refresh v2  (2026-05)
   Visual identity: warm dark • Syne/Outfit • orange accent #F46A2B
   METHOD: CSS variable override + font swap. Pure CSS, zero HTML edits.
   Preserves all SEO: title, meta, canonical, hreflang, ld+json, GTM.
   ================================================================ */

/* ── New fonts ─────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=Outfit:wght@300;400;500;600;700&display=swap');

/* ── Design token override ─────────────────────────────────────── */
:root {
  --navy:     #0C0B09;
  --navy2:    #131210;
  --navy3:    #1C1917;
  --surface:  #1E1C19;
  --surface2: #272420;
  --gold:     #F46A2B;
  --gold2:    #FF8A55;
  --gold3:    rgba(244, 106, 43, 0.12);
  --border:   rgba(240, 234, 224, 0.07);
  --border2:  rgba(244, 106, 43, 0.22);
  --ivory:    #F2EDE6;
  --text:     #E4DDD4;
  --muted:    #9B9087;
  --muted2:   #8A7F74;
  --accent:   #F46A2B;
}

/* ── Body: warm black background + Outfit font ───────────────────── */
body {
  background-color: #0C0B09 !important;
  color: #E4DDD4 !important;
  font-family: 'Outfit', system-ui, -apple-system, sans-serif !important;
}

/* ── Headings: Syne geometric (replaces Fraunces serif) ──────────── */
h1, h2, h3, h4, h5, h6,
.hero-title, .section-title, .page-title,
.post-title, .card-title, .service-title {
  font-family: 'Syne', system-ui, sans-serif !important;
  letter-spacing: -0.025em;
}

/* ── Sections and main wrappers ──────────────────────────────────── */
section, .section, main, header, footer,
.page-content, .site-content, .wrapper {
  background-color: #0C0B09 !important;
}

/* Keep alternate section darker for visual rhythm */
.section-alt, .alt-bg, section:nth-child(even) {
  background-color: #131210 !important;
}

/* ── Card warm surfaces (replaces cold dark blue) ────────────────── */
.card, .service-card, .market-card, .blog-card,
.pricing-card, .pricing-tier, .feature-card,
.process-step, .process-card, .faq-item,
.testimonial, .testimonial-card, .team-card,
.icon-box, .service-box, .stat-box {
  background-color: #1E1C19 !important;
  border-left: 3px solid #F46A2B !important;
  border-top: 1px solid rgba(240,234,224,0.07) !important;
  border-right: 1px solid rgba(240,234,224,0.07) !important;
  border-bottom: 1px solid rgba(240,234,224,0.07) !important;
  border-radius: 8px !important;
}

/* ── Hero H1 emphasis → orange (overrides inline style) ─────────── */
#hero h1 em,
section#hero h1 em,
.hero-title em {
  color: #FF8A55 !important;
  font-style: italic;
}

/* ── Nav: warm dark background ────────────────────────────────────── */
nav#mainNav,
nav[id="mainNav"] {
  background: rgba(12, 11, 9, 0.95) !important;
}
nav#mainNav.nav-scrolled {
  background: rgba(12, 11, 9, 0.98) !important;
  border-bottom: 1px solid rgba(244, 106, 43, 0.15) !important;
}

/* ── Buttons: squared radius instead of full pill ─────────────────── */
.btn, .cta-btn, .hero-cta, .cta-button, .btn-primary,
.booking-form-btn, .booking-submit,
button[class*="btn"], a[class*="cta"] {
  border-radius: 6px !important;
}

/* ── Footer ──────────────────────────────────────────────────────── */
footer, .site-footer, .footer {
  background-color: #0A0908 !important;
  border-top: 1px solid rgba(240,234,224,0.07) !important;
}

/* ── Scrollbar warm ──────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #0C0B09; }
::-webkit-scrollbar-thumb { background: #272420; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #F46A2B; }

/* ── Text selection ──────────────────────────────────────────────── */
::selection { background: rgba(244,106,43,0.2); color: #F2EDE6; }
