/* ==========================================================================
   America's Bookies - shared stylesheet
   Palette: ink #10192B / paper #EFEDE3 / turf #2F6F4E / gold #C99A3B
   Type: Barlow Condensed (display) + Public Sans (body)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Public+Sans:wght@400;500;600;700&display=swap');

:root {
  --ink: #10192B;
  --ink-soft: #1B2740;
  --paper: #EFEDE3;
  --paper-raised: #F8F7F1;
  --turf: #2F6F4E;
  --turf-dark: #234F39;
  --gold: #C99A3B;
  --gold-bright: #E0B24E;
  --charcoal: #1C2024;
  --line: #D8D3C2;
  --line-dark: #2A3550;
  --red-flag: #A83A32;

  --display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --body: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--charcoal);
  font-family: var(--body);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: var(--turf-dark); text-decoration-color: rgba(47,111,78,0.35); }
a:hover { text-decoration-color: var(--turf-dark); }

h1, h2, h3, h4 {
  font-family: var(--display);
  font-weight: 700;
  line-height: 1.05;
  margin: 0 0 0.5em;
  color: var(--ink);
  letter-spacing: 0.2px;
}
h1 { font-weight: 800; }

p { max-width: 72ch; }
.wide p { max-width: none; }

.wrap {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 28px;
}

/* ---------- Skip link / focus ---------- */
.skip-link {
  position: absolute; left: -999px; top: auto;
  background: var(--gold); color: var(--ink); padding: 10px 16px;
  z-index: 200; font-weight: 700;
}
.skip-link:focus { left: 12px; top: 12px; }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid var(--gold-bright);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}

/* ---------- Header ---------- */
.site-header {
  background: var(--ink);
  color: #EDEBDD;
  border-bottom: 3px solid var(--gold);
  position: sticky;
  top: 0;
  z-index: 100;
}
.site-header .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 14px;
  padding-bottom: 14px;
  gap: 24px;
}
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand svg { height: 40px; width: auto; }
.brand-word {
  font-family: var(--display);
  font-weight: 800;
  font-size: 1.55rem;
  color: #F5F3EA;
  letter-spacing: 0.3px;
  line-height: 1;
}
.brand-word span { color: var(--gold-bright); }
.brand-tag {
  display: block;
  font-family: var(--body);
  font-size: 0.62rem;
  font-weight: 600;
  color: #9AA6C2;
  letter-spacing: 1.2px;
  margin-top: 2px;
}

nav.primary-nav { display: flex; align-items: center; }
nav.primary-nav ul {
  list-style: none; display: flex; gap: 26px; margin: 0; padding: 0;
}
nav.primary-nav a {
  color: #D9D6C7;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.97rem;
  border-bottom: 2px solid transparent;
  padding-bottom: 4px;
}
nav.primary-nav a:hover, nav.primary-nav a[aria-current="page"] {
  color: #fff;
  border-bottom-color: var(--gold);
}
.nav-toggle { display: none; }

.header-cta {
  background: var(--gold);
  color: var(--ink);
  font-weight: 700;
  padding: 9px 18px;
  border-radius: 3px;
  text-decoration: none;
  font-size: 0.92rem;
  white-space: nowrap;
}
.header-cta:hover { background: var(--gold-bright); }

@media (max-width: 900px) {
  nav.primary-nav ul { gap: 16px; }
  .brand-tag { display: none; }
}
@media (max-width: 760px) {
  nav.primary-nav { display: none; }
  .header-cta { padding: 8px 12px; font-size: 0.82rem; }
}

/* ---------- Hero ---------- */
.hero {
  background: linear-gradient(180deg, var(--ink) 0%, var(--ink-soft) 100%);
  color: #EDEBDD;
  padding: 56px 0 64px;
}
.hero .wrap {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: start;
}
.hero-eyebrow {
  color: var(--gold-bright);
  font-weight: 700;
  font-size: 0.92rem;
  margin-bottom: 14px;
}
.hero h1 {
  color: #F7F5EA;
  font-size: clamp(2.4rem, 4.4vw, 3.6rem);
  max-width: 14ch;
}
.hero-lede {
  color: #C7CBDB;
  font-size: 1.15rem;
  max-width: 46ch;
  margin: 18px 0 26px;
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.btn {
  display: inline-block;
  padding: 13px 22px;
  border-radius: 3px;
  font-weight: 700;
  text-decoration: none;
  font-size: 0.98rem;
}
.btn-gold { background: var(--gold); color: var(--ink); }
.btn-gold:hover { background: var(--gold-bright); }
.btn-outline { border: 1.5px solid #4A567A; color: #EDEBDD; }
.btn-outline:hover { border-color: var(--gold-bright); color: var(--gold-bright); }

.hero-panel {
  background: var(--paper-raised);
  border-radius: 6px;
  padding: 22px 22px 10px;
  color: var(--charcoal);
}
.hero-panel h2 {
  font-size: 1.15rem;
  margin-bottom: 4px;
}
.hero-panel .panel-sub {
  font-size: 0.85rem;
  color: #5B5646;
  margin-bottom: 14px;
}
.snap-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-top: 1px solid var(--line);
}
.snap-row:first-of-type { border-top: none; }
.snap-rank {
  font-family: var(--display);
  font-weight: 800;
  font-size: 1.3rem;
  color: var(--turf);
  width: 22px;
}
.snap-name { font-weight: 700; flex: 1; font-size: 0.95rem; }
.snap-rating {
  font-family: var(--display);
  font-weight: 700;
  color: var(--gold-bright);
  background: var(--ink);
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 0.85rem;
}

/* ---------- Sections ---------- */
section { padding: 58px 0; }
section.tight { padding: 40px 0; }
.section-head { max-width: 66ch; margin-bottom: 28px; }
.section-head h2 { font-size: clamp(1.7rem, 2.8vw, 2.3rem); }
.section-head p { color: #4A4638; font-size: 1.05rem; }

.alt-band { background: var(--paper-raised); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ink-band { background: var(--ink); color: #D9D6C7; }
.ink-band h2, .ink-band h3 { color: #F5F3EA; }
.ink-band a { color: var(--gold-bright); }

/* ---------- Comparison table ---------- */
.table-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; }
table.compare {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
  background: var(--paper-raised);
  font-size: 0.95rem;
}
table.compare th, table.compare td {
  padding: 13px 16px;
  text-align: left;
  border-bottom: 1px solid var(--line);
}
table.compare thead th {
  background: var(--ink);
  color: #EDEBDD;
  font-family: var(--display);
  font-weight: 700;
  font-size: 0.98rem;
  letter-spacing: 0.2px;
}
table.compare tbody tr:last-child td { border-bottom: none; }
table.compare tbody tr:hover { background: #F1EFE2; }
table.compare td.rank {
  font-family: var(--display);
  font-weight: 800;
  color: var(--turf);
  font-size: 1.15rem;
}
table.compare td.rating { font-weight: 700; color: var(--turf-dark); }
.mini-link { font-weight: 700; font-size: 0.88rem; }

/* ---------- Card grids ---------- */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
@media (max-width: 860px) {
  .grid-3, .grid-2 { grid-template-columns: 1fr; }
  .hero .wrap { grid-template-columns: 1fr; }
}

.card {
  background: var(--paper-raised);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 22px;
}
.card h3 { font-size: 1.2rem; margin-bottom: 8px; }
.card p { font-size: 0.96rem; color: #454133; }
.card .card-meta {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--turf-dark);
  margin-bottom: 8px;
}

.guide-list { border-top: 1px solid var(--line); }
.guide-row {
  display: flex;
  gap: 20px;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
  align-items: baseline;
}
.guide-row .g-num {
  font-family: var(--display);
  font-weight: 800;
  font-size: 1.5rem;
  color: var(--gold);
  width: 40px;
  flex-shrink: 0;
}
.guide-row h3 { font-size: 1.15rem; margin-bottom: 4px; }
.guide-row p { font-size: 0.94rem; color: #4A4638; margin: 0; }

/* ---------- FAQ ---------- */
.faq-item { border-bottom: 1px solid var(--line); padding: 16px 0; }
.faq-item summary {
  cursor: pointer;
  font-weight: 700;
  font-family: var(--display);
  font-size: 1.15rem;
  color: var(--ink);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; font-size: 1.4rem; color: var(--turf); }
.faq-item[open] summary::after { content: '-'; }
.faq-item p { margin-top: 10px; color: #454133; }

/* ---------- Rating stars ---------- */
.stars { color: var(--gold); font-size: 1.1rem; letter-spacing: 1px; }

/* ---------- Pull quote / callout ---------- */
.callout {
  border-left: 4px solid var(--turf);
  background: var(--paper-raised);
  padding: 18px 22px;
  margin: 28px 0;
  border-radius: 0 4px 4px 0;
}
.callout p { margin: 0; font-weight: 600; color: var(--ink); }

.warn {
  border-left: 4px solid var(--red-flag);
  background: #F7EFE9;
  padding: 16px 20px;
  border-radius: 0 4px 4px 0;
  font-size: 0.92rem;
}

/* ---------- Footer ---------- */
footer.site-footer {
  background: var(--ink);
  color: #A8ADC2;
  padding: 50px 0 24px;
  font-size: 0.9rem;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--line-dark);
}
.footer-grid h4 {
  color: #E7E4D5;
  font-size: 0.95rem;
  margin-bottom: 12px;
}
.footer-grid ul { list-style: none; margin: 0; padding: 0; }
.footer-grid li { margin-bottom: 8px; }
.footer-grid a { color: #A8ADC2; text-decoration: none; }
.footer-grid a:hover { color: var(--gold-bright); }
.footer-brand p { color: #8B90A6; font-size: 0.88rem; max-width: 40ch; }
.footer-bottom {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding-top: 20px;
  font-size: 0.8rem;
  color: #767B92;
}
.footer-legal {
  font-size: 0.78rem;
  color: #6E7389;
  line-height: 1.6;
  margin-top: 18px;
  max-width: 90ch;
}
.responsible-strip {
  background: var(--ink-soft);
  border-top: 1px solid var(--line-dark);
  padding: 14px 0;
  font-size: 0.82rem;
  color: #9AA0B8;
  text-align: center;
}
.responsible-strip strong { color: var(--gold-bright); }

@media (max-width: 760px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- Breadcrumb ---------- */
.crumbs { font-size: 0.85rem; color: #6E6A58; margin-bottom: 18px; }
.crumbs a { color: #6E6A58; }

/* ---------- TOC ---------- */
.toc {
  background: var(--paper-raised);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 18px 22px;
  margin: 24px 0 36px;
}
.toc h2 { font-size: 1rem; margin-bottom: 10px; }
.toc ol { margin: 0; padding-left: 20px; columns: 2; font-size: 0.92rem; }
@media (max-width: 700px) { .toc ol { columns: 1; } }

/* ---------- Review page header ---------- */
.review-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  background: var(--paper-raised);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 24px;
  margin-bottom: 8px;
}
.review-score {
  background: var(--ink);
  color: var(--gold-bright);
  font-family: var(--display);
  font-weight: 800;
  font-size: 2.2rem;
  padding: 14px 20px;
  border-radius: 6px;
  text-align: center;
  line-height: 1;
}
.review-score span { display: block; font-size: 0.6rem; color: #B9BEDA; font-weight: 600; margin-top: 4px; font-family: var(--body); letter-spacing: 1px; }
@media (max-width: 700px) { .review-head { grid-template-columns: 1fr; text-align: center; } }


/* ==========================================================================
   2026 visual refresh - premium editorial sportsbook design
   ========================================================================== */

:root {
  --ink: #0B1220;
  --ink-soft: #152238;
  --paper: #F4F1E8;
  --paper-raised: #FFFDF8;
  --turf: #237B57;
  --turf-dark: #185C42;
  --gold: #D3A13D;
  --gold-bright: #F0C35F;
  --charcoal: #20252D;
  --line: #DED8C8;
  --line-dark: #2C3952;
  --red-flag: #A23D34;
  --shadow-sm: 0 8px 24px rgba(11, 18, 32, 0.07);
  --shadow-md: 0 16px 42px rgba(11, 18, 32, 0.12);
  --shadow-lg: 0 28px 72px rgba(11, 18, 32, 0.18);
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
}

html { background: var(--ink); }
body {
  background:
    radial-gradient(circle at 12% 3%, rgba(211,161,61,.08), transparent 26rem),
    radial-gradient(circle at 92% 24%, rgba(35,123,87,.07), transparent 30rem),
    var(--paper);
  font-size: 17px;
  line-height: 1.72;
  letter-spacing: -0.003em;
}

::selection { background: rgba(211,161,61,.28); color: var(--ink); }

h1, h2, h3, h4 { text-wrap: balance; }
h1 { letter-spacing: -0.025em; }
h2 { letter-spacing: -0.012em; }
p, li { text-wrap: pretty; }

.wrap { padding-left: clamp(20px, 4vw, 34px); padding-right: clamp(20px, 4vw, 34px); }

/* Header becomes a polished, translucent navigation bar. */
.site-header {
  background: rgba(11,18,32,.94);
  border-bottom: 1px solid rgba(240,195,95,.5);
  box-shadow: 0 8px 30px rgba(5, 9, 17, .18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.site-header .wrap { min-height: 76px; padding-top: 12px; padding-bottom: 12px; }
.brand { gap: 13px; }
.brand svg {
  width: 43px; height: 43px;
  filter: drop-shadow(0 5px 12px rgba(0,0,0,.2));
}
.brand-word { font-size: 1.65rem; letter-spacing: -.2px; }
.brand-tag { color: #AAB4C9; letter-spacing: 1.35px; }
nav.primary-nav ul { gap: clamp(14px, 2.1vw, 28px); }
nav.primary-nav a {
  position: relative;
  padding: 9px 0 8px;
  border-bottom: 0;
  transition: color .18s ease;
}
nav.primary-nav a::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 2px;
  height: 2px;
  background: var(--gold-bright);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .18s ease;
}
nav.primary-nav a:hover::after,
nav.primary-nav a[aria-current="page"]::after { transform: scaleX(1); }

.header-cta, .btn {
  border-radius: 999px;
  box-shadow: 0 7px 18px rgba(0,0,0,.12);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.header-cta:hover, .btn:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,0,0,.17); }
.header-cta { padding: 10px 18px; }

/* Home hero */
.hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 20%, rgba(211,161,61,.19), transparent 25rem),
    radial-gradient(circle at 15% 80%, rgba(35,123,87,.20), transparent 30rem),
    linear-gradient(135deg, #0B1220 0%, #14223A 56%, #102B27 100%);
  padding: clamp(60px, 8vw, 100px) 0 clamp(68px, 9vw, 112px);
}
.hero::before {
  content: '';
  position: absolute;
  width: 520px; height: 520px;
  border: 1px solid rgba(240,195,95,.12);
  border-radius: 50%;
  right: -170px; top: -250px;
  box-shadow: 0 0 0 70px rgba(240,195,95,.035), 0 0 0 140px rgba(240,195,95,.018);
  pointer-events: none;
}
.hero .wrap { gap: clamp(38px, 6vw, 76px); align-items: center; }
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 18px;
  padding: 7px 12px;
  border: 1px solid rgba(240,195,95,.35);
  border-radius: 999px;
  background: rgba(240,195,95,.08);
  letter-spacing: .03em;
}
.hero-eyebrow::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--gold-bright); box-shadow: 0 0 0 4px rgba(240,195,95,.13); }
.hero h1 { font-size: clamp(2rem, 3.85vw, 3.4rem); line-height: .95; max-width: 12ch; }
.hero-lede { font-size: clamp(1.06rem, 1.6vw, 1.22rem); color: #D1D7E3; }
.hero-actions { margin-top: 30px; }
.btn { padding: 14px 23px; }
.btn-gold { background: linear-gradient(180deg, #E8B94F 0%, #C99532 100%); }
.btn-gold:hover { background: linear-gradient(180deg, #F3C965 0%, #D7A744 100%); }
.btn-outline { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.24); }

.hero-panel {
  position: relative;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: var(--radius-lg);
  padding: 28px 28px 16px;
  background: linear-gradient(180deg, rgba(255,253,248,.99), rgba(247,243,232,.98));
  box-shadow: var(--shadow-lg);
}
.hero-panel::before {
  content: 'MARKET SNAPSHOT';
  position: absolute;
  top: -13px; right: 24px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--turf-dark);
  color: #fff;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .1em;
}
.hero-panel h2 { font-size: 1.35rem; }
.snap-row { padding: 13px 0; }
.snap-rank { color: var(--gold); }
.snap-rating { border-radius: 999px; padding: 4px 9px; }

/* Page intros and editorial article rhythm */
main > section.tight:first-child {
  background:
    linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,0)),
    linear-gradient(90deg, rgba(35,123,87,.045), rgba(211,161,61,.045));
  border-bottom: 1px solid rgba(222,216,200,.8);
  padding-top: clamp(34px, 5vw, 54px);
  padding-bottom: clamp(34px, 5vw, 52px);
}
main > section.tight:first-child h1:not(.review-head h1) {
  font-size: clamp(2.35rem, 5vw, 4.1rem);
  max-width: 18ch;
  margin-bottom: 14px;
}
main > section.tight:first-child .wrap > p:not(.crumbs) { font-size: 1.08rem; color: #4D4A42; }
.crumbs { margin-bottom: 22px; color: #766F60; }
.crumbs a { text-decoration: none; border-bottom: 1px solid rgba(118,111,96,.3); }

section { padding-top: clamp(50px, 6vw, 74px); padding-bottom: clamp(50px, 6vw, 74px); }
section.tight { padding-top: clamp(34px, 4.5vw, 52px); padding-bottom: clamp(34px, 4.5vw, 52px); }
.section-head { margin-bottom: 34px; }
.section-head h2 { font-size: clamp(2rem, 3.4vw, 2.75rem); }
.section-head p { color: #555044; }
.alt-band { background: rgba(255,253,248,.72); }
.ink-band {
  background:
    radial-gradient(circle at 90% 20%, rgba(211,161,61,.12), transparent 25rem),
    linear-gradient(135deg, #0B1220, #152238);
}

/* Cards and guide rows */
.card {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
  padding: 26px;
  border-color: rgba(210,202,183,.9);
  background: rgba(255,253,248,.91);
  box-shadow: var(--shadow-sm);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(var(--gold), var(--turf));
  opacity: .85;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: #CFC5AF; }
.card h3 { font-size: 1.32rem; }
.card a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.card .card-meta { letter-spacing: .07em; }

.guide-list { border-top: 0; display: grid; gap: 12px; }
.guide-row {
  align-items: center;
  padding: 20px 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255,253,248,.78);
  box-shadow: 0 5px 18px rgba(11,18,32,.035);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.guide-row:hover { transform: translateX(3px); box-shadow: var(--shadow-sm); border-color: #CFC4AE; }
.guide-row .g-num {
  display: grid; place-items: center;
  width: 46px; height: 46px;
  border-radius: 50%;
  background: #F3E8CD;
  color: #9A6E18;
  font-size: 1.15rem;
}
.guide-row h3 { font-size: 1.22rem; }

/* Tables */
.table-scroll {
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  border-color: #D5CCB8;
  background: var(--paper-raised);
}
table.compare thead th { background: linear-gradient(180deg, #152238, #0B1220); padding-top: 15px; padding-bottom: 15px; }
table.compare th, table.compare td { padding: 15px 17px; }
table.compare tbody tr { transition: background .15s ease; }
table.compare tbody tr:nth-child(even) { background: rgba(244,241,232,.55); }
table.compare tbody tr:hover { background: #EFE6CF; }
table.compare td.rank { color: #9A6E18; }
.mini-link { text-underline-offset: 4px; text-decoration-thickness: 1px; }

/* Review cards */
.review-head {
  grid-template-columns: auto minmax(0, 1fr) auto;
  border-radius: var(--radius-lg);
  padding: clamp(24px, 4vw, 34px);
  border-color: #D7CEBA;
  background:
    radial-gradient(circle at 85% 10%, rgba(211,161,61,.13), transparent 16rem),
    linear-gradient(135deg, #FFFDF8, #F8F3E7);
  box-shadow: var(--shadow-md);
}
.review-score {
  min-width: 104px;
  padding: 18px 17px;
  border-radius: var(--radius-md);
  background: linear-gradient(145deg, #172640, #09101C);
  box-shadow: inset 0 0 0 1px rgba(240,195,95,.22), 0 10px 25px rgba(11,18,32,.16);
  font-size: 2.55rem;
}
.review-score span { margin-top: 7px; }
.review-head h1 { font-size: clamp(2rem, 4vw, 3.25rem); }
.stars { margin: 0; letter-spacing: 2px; text-shadow: 0 1px 0 rgba(0,0,0,.08); }

/* Long-form article readability */
.toc {
  border-radius: var(--radius-md);
  padding: 22px 25px;
  border-color: #D6CDB9;
  background: linear-gradient(180deg, #FFFDF8, #FAF7EE);
  box-shadow: var(--shadow-sm);
}
.toc h2 { letter-spacing: .04em; text-transform: uppercase; font-size: .86rem; color: #6C6049; }
.toc ol { line-height: 1.8; }
.toc a { text-underline-offset: 3px; }

section.tight .wrap > h2[id] {
  position: relative;
  margin-top: 2.8rem;
  margin-bottom: .95rem;
  padding-top: 1.35rem;
  border-top: 1px solid rgba(222,216,200,.9);
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  scroll-margin-top: 105px;
}
section.tight .wrap > h2[id]::before {
  content: '';
  position: absolute;
  left: 0; top: -2px;
  width: 54px; height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--gold), var(--turf));
}
section.tight .wrap > p { color: #353A40; }
section.tight .wrap > ul, section.tight .wrap > ol { max-width: 74ch; }
section.tight .wrap > ul li, section.tight .wrap > ol li { margin-bottom: .45em; }

.callout, .warn {
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  box-shadow: 0 7px 22px rgba(11,18,32,.05);
}
.callout { background: linear-gradient(90deg, rgba(35,123,87,.08), rgba(255,253,248,.96) 24%); padding: 20px 24px; }
.warn { background: linear-gradient(90deg, rgba(162,61,52,.09), #FCF7F1 24%); }

/* FAQs */
.faq-item {
  margin: 10px 0;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255,253,248,.82);
  overflow: hidden;
}
.faq-item summary { padding: 17px 20px; font-size: 1.2rem; }
.faq-item summary::after {
  display: grid; place-items: center;
  width: 28px; height: 28px;
  flex: 0 0 28px;
  border-radius: 50%;
  background: rgba(35,123,87,.10);
  font-family: var(--body);
  font-size: 1.1rem;
}
.faq-item[open] summary { background: rgba(35,123,87,.045); }
.faq-item[open] summary::after { content: '-'; }
.faq-item p { padding: 0 20px 19px; margin: 0; }

/* Footer */
footer.site-footer {
  position: relative;
  background:
    radial-gradient(circle at 12% 0%, rgba(35,123,87,.12), transparent 26rem),
    #0B1220;
  padding-top: 58px;
}
.footer-grid { gap: 40px; }
.footer-grid h4 { letter-spacing: .035em; text-transform: uppercase; font-size: .82rem; }
.footer-grid a { transition: color .16s ease; }
.footer-bottom { padding-top: 24px; }
.responsible-strip { background: #101B2E; padding: 16px 0; }

/* Better mobile layout - keep navigation visible instead of hiding it. */
@media (max-width: 760px) {
  .site-header { position: relative; }
  .site-header .wrap { flex-wrap: wrap; gap: 10px 14px; min-height: auto; }
  .brand { flex: 1 1 auto; min-width: 210px; }
  .brand-word { font-size: 1.42rem; }
  .brand svg { width: 38px; height: 38px; }
  .header-cta { order: 2; margin-left: auto; }
  nav.primary-nav {
    display: block;
    order: 3;
    flex: 1 0 100%;
    overflow-x: auto;
    margin: 4px -4px -2px;
    scrollbar-width: none;
  }
  nav.primary-nav::-webkit-scrollbar { display: none; }
  nav.primary-nav ul { gap: 6px; min-width: max-content; }
  nav.primary-nav a {
    display: block;
    padding: 8px 10px 10px;
    border-radius: 8px;
    font-size: .88rem;
  }
  nav.primary-nav a:hover, nav.primary-nav a[aria-current="page"] { background: rgba(255,255,255,.055); }
  .hero { padding-top: 54px; }
  .hero h1 { font-size: clamp(2rem, 9.1vw, 2.8rem); }
  .hero-panel { padding: 24px 20px 14px; }
  .review-head { grid-template-columns: 1fr; text-align: left; }
  .review-score { width: max-content; min-width: 92px; }
  .review-head .btn { width: 100%; text-align: center; }
  .footer-grid { grid-template-columns: 1fr; }
  .guide-row { align-items: flex-start; padding: 18px; }
  .guide-row .g-num { width: 40px; height: 40px; flex: 0 0 40px; }
  section.tight .wrap > h2[id] { scroll-margin-top: 22px; }
}

@media (max-width: 480px) {
  body { font-size: 16px; }
  .header-cta { font-size: .77rem; padding: 8px 11px; }
  .brand-tag { display: none; }
  .hero-actions .btn { width: 100%; text-align: center; }
  .review-head { padding: 22px 18px; }
  .card { padding: 22px; }
  table.compare th, table.compare td { padding: 12px 13px; }
}


.article-content > .wrap {
  max-width: 980px;
}
.article-content .toc { max-width: 940px; }
.article-content > .wrap > p,
.article-content > .wrap > ul,
.article-content > .wrap > ol { max-width: 76ch; }

/* ========================================================================== 
   Illustrated guide layout - How Sports Betting Works
   ========================================================================== */
.guide-hero {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr);
  gap: clamp(28px, 5vw, 58px);
  align-items: center;
  margin: 8px 0 32px;
}
.guide-hero-copy { min-width: 0; }
.article-kicker {
  display: inline-flex;
  margin: 0 0 14px !important;
  padding: 7px 11px;
  border-radius: 999px;
  background: rgba(35,123,87,.09);
  color: var(--turf-dark) !important;
  font-size: .76rem !important;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.article-content .guide-hero h1 {
  font-size: clamp(2.65rem, 5.4vw, 4.8rem) !important;
  line-height: .96;
  max-width: 12ch !important;
  margin-bottom: 18px !important;
}
.article-dek {
  max-width: 49ch !important;
  margin: 0 0 20px;
  color: #4B4A44 !important;
  font-size: clamp(1.05rem, 1.55vw, 1.18rem) !important;
}
.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: #696456;
  font-size: .8rem;
  font-weight: 650;
}
.article-meta span { display: inline-flex; align-items: center; gap: 8px; }
.article-meta span:not(:first-child)::before {
  content: '';
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--gold);
}
.guide-hero-media,
.editorial-figure {
  margin: 0;
}
.guide-hero-media {
  position: relative;
  padding: 8px;
  border-radius: 22px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(208,198,177,.9);
  box-shadow: 0 24px 62px rgba(11,18,32,.18);
}
.guide-hero-media picture,
.editorial-figure picture {
  display: block;
  overflow: hidden;
  border-radius: 15px;
  background: #DAD5C7;
}
.guide-hero-media img,
.editorial-figure img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.guide-hero-media figcaption,
.editorial-figure figcaption {
  margin: 9px 7px 2px;
  color: #6A6558;
  font-size: .76rem;
  line-height: 1.45;
}
.betting-flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  overflow: hidden;
  margin: 34px 0 28px;
  border: 1px solid #D7CFBC;
  border-radius: 15px;
  background: #D7CFBC;
  box-shadow: 0 10px 28px rgba(11,18,32,.055);
}
.betting-flow-step {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 3px 10px;
  align-content: start;
  padding: 17px 18px 18px;
  background: rgba(255,253,248,.98);
}
.flow-num {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 31px; height: 31px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--gold-bright);
  font-family: var(--display);
  font-weight: 800;
  font-size: .82rem;
}
.betting-flow-step strong {
  color: var(--ink);
  font-family: var(--display);
  font-size: 1rem;
  line-height: 1.1;
}
.betting-flow-step > span:last-child {
  color: #625E54;
  font-size: .78rem;
  line-height: 1.4;
}
.editorial-figure {
  width: min(100%, 900px);
  margin: 30px 0 38px;
  padding: 7px;
  border-radius: 18px;
  border: 1px solid #D8D0BD;
  background: rgba(255,253,248,.9);
  box-shadow: 0 14px 38px rgba(11,18,32,.09);
}
.editorial-figure picture { border-radius: 12px; }
.editorial-figure figcaption { margin: 9px 7px 3px; }
.mistake-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 22px 0 34px;
  padding: 0 !important;
  list-style: none;
}
.mistake-list li {
  position: relative;
  margin: 0 !important;
  padding: 18px 19px 18px 47px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,253,248,.86);
  box-shadow: 0 5px 18px rgba(11,18,32,.035);
}
.mistake-list li::before {
  content: '!';
  position: absolute;
  left: 17px; top: 18px;
  display: grid;
  place-items: center;
  width: 21px; height: 21px;
  border-radius: 50%;
  background: rgba(211,161,61,.18);
  color: #8B6218;
  font-weight: 900;
  font-size: .76rem;
}

@media (max-width: 900px) {
  .guide-hero { grid-template-columns: 1fr; }
  .guide-hero-media { max-width: 820px; }
  .betting-flow { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .article-content .guide-hero h1 { font-size: clamp(2.5rem, 13vw, 3.55rem) !important; }
  .article-meta { gap: 6px 12px; }
  .article-meta span:nth-child(3) { flex-basis: 100%; }
  .betting-flow { grid-template-columns: 1fr; }
  .betting-flow-step { padding: 14px 15px; }
  .mistake-list { grid-template-columns: 1fr; }
  .guide-hero-media,
  .editorial-figure { border-radius: 14px; padding: 5px; }
  .guide-hero-media picture,
  .editorial-figure picture { border-radius: 10px; }
  .guide-hero-media figcaption,
  .editorial-figure figcaption { font-size: .72rem; }
}


/* ========================================================================== 
   Insights hub + article templates
   ========================================================================== */
.hero-insights .hero-panel .snap-name { font-size: .94rem; }
.insights-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.insights-grid.compact { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.insight-card {
  display: flex;
  flex-direction: column;
  background: rgba(255,253,248,.95);
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.insight-card.compact { border-radius: 14px; }
.insight-card-media { display: block; }
.insight-card-media picture,
.insight-card-media img { display: block; width: 100%; }
.insight-card-media img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform .35s ease;
}
.insight-card:hover .insight-card-media img { transform: scale(1.02); }
.insight-card-body { padding: 22px 22px 24px; }
.insight-card-body h2,
.insight-card-body h3 { font-size: clamp(1.35rem, 2.1vw, 1.8rem); margin-bottom: 10px; }
.insight-card.compact .insight-card-body { padding: 18px; }
.insight-card.compact .insight-card-body h3 { font-size: 1.12rem; }
.insight-meta {
  display: flex; flex-wrap: wrap; gap: 10px 16px; font-size: .82rem; font-weight: 700; color: #6A6558; margin-top: 14px;
}
.insight-meta span { display:inline-flex; align-items:center; gap:8px; }
.insight-meta span + span::before {
  content:''; width:4px; height:4px; border-radius:50%; background: var(--gold); display:inline-block; margin-right:8px;
}
.insight-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
  margin: 8px 0 34px;
}
.insight-highlight {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,253,248,.92);
  padding: 20px 18px;
  box-shadow: var(--shadow-sm);
}
.insight-highlight h3 { font-size: 1.08rem; margin-bottom: 8px; }
.insight-highlight p { font-size: .92rem; color: #4A4638; margin: 0; }
.article-prose > p:first-of-type {
  font-size: 1.13rem;
  color: #433f33;
}
.article-prose h2 { margin-top: 1.9em; font-size: clamp(1.6rem, 2.8vw, 2.2rem); scroll-margin-top: 92px; }
.related-insights { margin-top: 50px; padding-top: 10px; }
@media (max-width: 900px) {
  .insights-grid,
  .insights-grid.compact,
  .insight-highlights { grid-template-columns: 1fr; }
}


/* Legal and transparency pages */
.legal-hero {
  padding: 54px 0 34px;
  background: linear-gradient(180deg, rgba(11,18,32,.035), rgba(11,18,32,0));
  border-bottom: 1px solid var(--line);
}
.legal-hero .wrap { max-width: 1040px; }
.legal-hero h1 { font-size: clamp(2.55rem, 5vw, 4.35rem); max-width: 16ch; margin-bottom: 10px; }
.legal-updated { margin: 0; color: #6A6558; font-size: .86rem; font-weight: 650; }
.legal-review-note {
  margin: 24px 0 0;
  padding: 15px 18px;
  border: 1px solid #DFC985;
  border-left: 4px solid var(--gold);
  border-radius: 10px;
  background: #FFF8E6;
  color: #51462B;
  font-size: .9rem;
  line-height: 1.55;
  max-width: 82ch;
}
.legal-layout {
  max-width: 1040px;
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: clamp(30px, 5vw, 66px);
  align-items: start;
}
.legal-toc {
  position: sticky;
  top: 108px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,253,248,.92);
  box-shadow: var(--shadow-sm);
}
.legal-toc > a {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 8px;
  padding: 8px 4px;
  border-top: 1px solid rgba(222,216,200,.7);
  text-decoration: none;
  font-size: .79rem;
  line-height: 1.35;
  color: #4A4638;
}
.legal-toc > a:first-of-type { border-top: 0; }
.legal-toc > a:hover { color: var(--turf-dark); }
.legal-toc > a span { color: var(--gold); font-family: var(--display); font-weight: 800; }
.legal-document { min-width: 0; }
.legal-section {
  padding: 0 0 30px;
  margin: 0 0 34px;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 104px;
}
.legal-section:last-child { border-bottom: 0; }
.legal-section h2 { font-size: clamp(1.45rem, 2.5vw, 2rem); margin-bottom: 18px; }
.legal-section h2 span { color: var(--gold); }
.legal-section p, .legal-section li { max-width: 76ch; font-size: .97rem; }
.legal-section p { margin: 0 0 16px; }
.legal-list, .legal-alpha { padding-left: 24px; margin: 0 0 18px; }
.legal-list li, .legal-alpha li { margin: 7px 0; }
.legal-alpha { list-style-type: lower-alpha; }
.legal-placeholder {
  display: inline;
  background: #FFF0C7;
  color: #74510F;
  border-radius: 4px;
  padding: 2px 5px;
  font-weight: 750;
}
.footer-legal-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  padding: 0 0 20px;
  margin-bottom: 2px;
  border-bottom: 1px solid var(--line-dark);
}
.footer-legal-nav a {
  color: #C0C5D4;
  text-decoration: none;
  font-size: .8rem;
  font-weight: 650;
}
.footer-legal-nav a:hover { color: var(--gold-bright); }
@media (max-width: 760px) {
  .legal-hero { padding-top: 36px; }
  .legal-layout { grid-template-columns: 1fr; gap: 26px; }
  .legal-toc { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
  .legal-toc .card-meta { grid-column: 1 / -1; }
  .footer-legal-nav { gap: 10px 14px; }
}
@media (max-width: 520px) {
  .legal-toc { grid-template-columns: 1fr; }
  .legal-review-note { padding: 14px; }
  .footer-legal-nav { display: grid; grid-template-columns: 1fr 1fr; }
}


/* ========================================================================== 
   Sports betting by sport - visual guide
   ========================================================================== */
.sports-guide-page { overflow: clip; }
.sports-reading-wrap { max-width: 1120px; }
.section-label { margin: 0 0 8px; font-size: .72rem !important; font-weight: 800; letter-spacing: .14em; color: var(--turf-dark) !important; }
.sports-guide-hero {
  position: relative;
  padding: clamp(42px, 6vw, 76px) 0;
  background:
    radial-gradient(circle at 7% 30%, rgba(211,161,61,.16), transparent 24rem),
    radial-gradient(circle at 88% 70%, rgba(35,123,87,.18), transparent 30rem),
    linear-gradient(135deg, #0B1220 0%, #122038 52%, #12362D 100%);
  color: #EDEBDD;
}
.sports-guide-hero::after { content:''; position:absolute; inset:auto 0 0; height:1px; background:linear-gradient(90deg,transparent,rgba(240,195,95,.6),transparent); }
.sports-hero-grid { display:grid; grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr); gap:clamp(34px,6vw,74px); align-items:center; }
.sports-guide-hero .crumbs, .sports-guide-hero .crumbs a { color:#B5BECE; }
.sports-guide-hero h1 { color:#FFF9E9; font-size:clamp(3rem,6vw,5.7rem); line-height:.9; max-width:8ch; margin:0 0 20px; }
.sports-hero-lede { color:#D4D9E3; font-size:clamp(1.03rem,1.5vw,1.18rem); max-width:52ch; }
.sports-hero-pills { display:flex; gap:9px; flex-wrap:wrap; margin-top:26px; }
.sports-hero-pills span { border:1px solid rgba(240,195,95,.32); background:rgba(255,255,255,.045); color:#F2E6C7; border-radius:999px; padding:7px 11px; font-size:.77rem; font-weight:700; }
.sports-hero-visual { margin:0; position:relative; }
.sports-hero-visual img { width:100%; border-radius:22px; box-shadow:0 28px 70px rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.14); aspect-ratio:16/9; object-fit:cover; }
.sports-hero-visual figcaption { color:#AEB8C8; font-size:.72rem; margin-top:9px; text-align:right; }
.sports-guide-intro { background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0)); }
.sports-intro-prose { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.sports-intro-prose p { margin:0; max-width:none; font-size:1.01rem; }
.sports-toc { margin-top:30px; }
.sport-jump { margin:24px 0 4px; padding:18px 20px; border:1px solid var(--line); border-radius:14px; background:rgba(255,253,248,.78); }
.sport-jump > span { display:block; margin-bottom:11px; color:#736953; font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.sport-jump div { display:flex; flex-wrap:wrap; gap:7px; }
.sport-jump a { display:inline-flex; padding:5px 9px; border:1px solid #D8CFBB; border-radius:999px; background:#FFFDF8; color:var(--ink); font-size:.73rem; font-weight:700; text-decoration:none; }
.sport-jump a:hover { border-color:var(--gold); background:#FFF7E4; }
.market-key-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.market-key-card { min-height:170px; padding:22px; border:1px solid #D9D0BC; border-radius:16px; background:rgba(255,253,248,.88); box-shadow:var(--shadow-sm); }
.market-key-icon,.sport-icon { display:grid; place-items:center; color:var(--gold); background:#101A2D; border-radius:12px; }
.market-key-icon { width:45px; height:45px; margin-bottom:15px; }
.sport-icon-svg { width:29px; height:29px; }
.market-key-card h3 { font-size:1.18rem; margin-bottom:6px; }
.market-key-card p { margin:0; font-size:.87rem; color:#534E41; }
.responsive-data-table { border:1px solid #D4CAB3; border-radius:16px; overflow:hidden; box-shadow:var(--shadow-sm); }
.sport-market-table { width:100%; border-collapse:collapse; background:#FFFDF8; font-size:.89rem; }
.sport-market-table th { padding:14px 16px; text-align:left; background:linear-gradient(180deg,#17263F,#0B1220); color:#F6F0DF; font-family:var(--display); font-size:.92rem; letter-spacing:.03em; }
.sport-market-table td { padding:12px 16px; border-top:1px solid var(--line); vertical-align:top; }
.sport-market-table tbody tr:nth-child(even) { background:#FAF6EC; }
.sport-market-table td:first-child { color:var(--ink); }
.sports-image-band { padding:0 0 clamp(42px,6vw,72px); }
.sports-image-band figure { margin:0; }
.sports-image-band img { width:100%; border-radius:20px; aspect-ratio:7/4; object-fit:cover; box-shadow:var(--shadow-md); }
.sports-image-band figcaption { color:#6D675A; font-size:.75rem; margin-top:10px; }
.sports-groups-wrap { padding:0 0 16px; }
.sport-group { padding:clamp(44px,6vw,70px) 0; }
.sport-group:nth-child(even) { background:rgba(255,253,248,.62); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.sport-group > .group-head, .sport-group > .sports-card-grid { width:min(1120px, calc(100% - 40px)); margin-left:auto; margin-right:auto; }
.group-head { margin-bottom:26px; }
.group-head > p { margin:0 0 7px; color:#89795A; font-size:.69rem; letter-spacing:.14em; font-weight:800; }
.group-head h2 { font-size:clamp(2rem,4vw,3rem); }
.sports-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.sport-detail-card { scroll-margin-top:100px; padding:23px; border:1px solid #D8CFBB; border-radius:17px; background:rgba(255,253,248,.94); box-shadow:0 8px 24px rgba(11,18,32,.05); }
.sport-card-head { display:flex; align-items:center; gap:14px; margin-bottom:11px; }
.sport-icon { flex:0 0 48px; width:48px; height:48px; }
.sport-kicker { margin:0 0 2px; color:var(--turf-dark); font-size:.68rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.sport-detail-card h3 { margin:0; font-size:1.45rem; }
.sport-tags { margin-bottom:14px; }
.sport-tags span { display:inline-block; padding:5px 8px; border-radius:7px; background:#F3E8CD; color:#775312; font-size:.68rem; font-weight:800; }
.sport-detail-card > p { max-width:none; font-size:.89rem; color:#49453B; line-height:1.66; }
.sport-detail-card > p:last-child { margin-bottom:0; }
.takeaway-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:30px; }
.takeaway { padding:20px; border:1px solid #D9D0BC; border-radius:14px; background:#FFFDF8; }
.takeaway > span { display:inline-grid; place-items:center; width:35px; height:35px; margin-bottom:11px; border-radius:50%; background:var(--ink); color:var(--gold-bright); font-family:var(--display); font-weight:800; }
.takeaway p { margin:0; font-size:.9rem; }
.sports-source-prose { padding-top:4px; }
.sports-source-prose p { max-width:82ch; }
.responsible-guide-note { margin-top:28px; padding:20px 22px; border-left:4px solid var(--turf); border-radius:0 12px 12px 0; background:#EAF2EC; font-size:.9rem; }
.responsible-guide-note p { margin:0; }
.guide-back { margin-top:30px; }
@media (max-width: 900px) {
  .sports-hero-grid { grid-template-columns:1fr; }
  .sports-guide-hero h1 { max-width:12ch; }
  .sports-hero-visual { max-width:760px; }
  .market-key-grid { grid-template-columns:repeat(2,1fr); }
  .sports-card-grid { grid-template-columns:1fr; }
  .takeaway-grid { grid-template-columns:1fr; }
}
@media (max-width: 700px) {
  .sports-guide-hero { padding-top:32px; }
  .sports-hero-lede { font-size:1rem; }
  .sports-hero-visual img { aspect-ratio:1/1; border-radius:16px; }
  .sports-intro-prose { grid-template-columns:1fr; gap:12px; }
  .market-key-grid { grid-template-columns:1fr; }
  .responsive-data-table { overflow:visible; border:0; box-shadow:none; background:transparent; }
  .sport-market-table, .sport-market-table tbody, .sport-market-table tr, .sport-market-table td { display:block; width:100%; }
  .sport-market-table thead { display:none; }
  .sport-market-table tr { margin-bottom:12px; border:1px solid #D8CFBB; border-radius:13px; overflow:hidden; background:#FFFDF8 !important; box-shadow:0 5px 18px rgba(11,18,32,.04); }
  .sport-market-table td { display:grid; grid-template-columns:116px minmax(0,1fr); gap:12px; padding:10px 13px; border-top:1px solid #E4DDCF; }
  .sport-market-table td:first-child { border-top:0; background:#F4E8C9; }
  .sport-market-table td::before { content:attr(data-label); color:#756A55; font-size:.66rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
  .sports-image-band img { aspect-ratio:1/1; border-radius:15px; }
  .sport-group > .group-head, .sport-group > .sports-card-grid { width:min(100% - 32px,1120px); }
  .sport-detail-card { padding:19px; }
}


/* ==========================================================================
   Full sport Read More guides
   ========================================================================== */
.sport-detail-page { overflow: clip; }
.sport-detail-reading { max-width: 1120px; }
.sport-detail-hero {
  padding: clamp(40px, 6vw, 74px) 0;
  color: #F7F2E5;
  background:
    radial-gradient(circle at 8% 22%, rgba(211,161,61,.19), transparent 27rem),
    radial-gradient(circle at 90% 72%, rgba(35,123,87,.22), transparent 30rem),
    linear-gradient(135deg,#0B1220 0%,#14243F 54%,#12362D 100%);
  border-bottom: 1px solid rgba(201,154,59,.4);
}
.sport-detail-hero-grid { display:grid; grid-template-columns:minmax(0,.94fr) minmax(390px,1.06fr); align-items:center; gap:clamp(34px,6vw,72px); }
.sport-detail-hero .crumbs, .sport-detail-hero .crumbs a { color:#B8C0CE; }
.sport-hero-mark { display:flex; align-items:center; gap:10px; margin:18px 0 16px; color:#F0C35F; font-size:.72rem; font-weight:850; letter-spacing:.11em; text-transform:uppercase; }
.sport-detail-svg { width:36px; height:36px; padding:7px; border:1px solid rgba(240,195,95,.42); border-radius:10px; background:rgba(8,18,31,.55); }
.sport-detail-hero h1 { max-width:12ch; margin:0 0 18px; color:#FFF9E9; font-size:clamp(2.75rem,5.7vw,5rem); line-height:.94; }
.sport-detail-lede { max-width:59ch; color:#D5DBE6; font-size:clamp(1.02rem,1.4vw,1.17rem); }
.sport-detail-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.sport-detail-chips span { padding:7px 10px; border:1px solid rgba(240,195,95,.3); border-radius:999px; background:rgba(255,255,255,.045); color:#F1E7CD; font-size:.74rem; font-weight:750; }
.sport-detail-photo { position:relative; margin:0; }
.sport-detail-photo picture { display:block; overflow:hidden; border-radius:22px; box-shadow:0 28px 70px rgba(0,0,0,.34); border:1px solid rgba(255,255,255,.14); }
.sport-detail-photo img { display:block; width:100%; aspect-ratio:8/5; object-fit:cover; }
.sport-photo-icon { position:absolute; left:18px; bottom:34px; display:grid; place-items:center; width:66px; height:66px; border-radius:17px; color:#F0C35F; background:rgba(11,18,32,.93); border:1px solid rgba(240,195,95,.45); box-shadow:0 10px 26px rgba(0,0,0,.24); }
.sport-photo-svg { width:39px; height:39px; }
.sport-detail-photo figcaption { margin-top:9px; color:#AEB8C8; font-size:.72rem; text-align:right; }
.sport-detail-intro { padding:clamp(42px,6vw,70px) 0; background:linear-gradient(180deg,#FBF7ED,#FFFDF8); border-bottom:1px solid var(--line); }
.sport-intro-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:36px; align-items:start; }
.sport-intro-copy p { max-width:80ch; margin:0 0 18px; font-size:1.02rem; line-height:1.76; }
.sport-intro-copy p:last-child { margin-bottom:0; }
.sport-learn-card { padding:22px; border:1px solid #D8CFBB; border-radius:16px; background:#FFFDF8; box-shadow:var(--shadow-sm); }
.sport-learn-card > span,.sport-detail-toc > span { display:block; margin-bottom:7px; color:#80745D; font-size:.67rem; font-weight:850; letter-spacing:.12em; }
.sport-learn-card h2 { font-size:1.35rem; margin-bottom:12px; }
.sport-learn-card ul { margin:0; padding:0; list-style:none; }
.sport-learn-card li + li { border-top:1px solid var(--line); }
.sport-learn-card a { display:block; padding:9px 0; color:var(--ink); font-size:.84rem; font-weight:700; text-decoration:none; }
.sport-learn-card a:hover { color:var(--turf-dark); }
.sport-guide-quick { margin-top:36px; padding-top:32px; border-top:1px solid var(--line); scroll-margin-top:100px; }
.detail-section-label { margin-bottom:7px; color:var(--turf-dark); font-size:.68rem; font-weight:850; letter-spacing:.13em; }
.sport-guide-quick h2,.sport-related-guides h2 { font-size:clamp(1.7rem,3vw,2.3rem); }
.sport-guide-body { padding:clamp(46px,6vw,76px) 0; background:#FFFDF8; }
.sport-detail-layout { max-width:1120px; display:grid; grid-template-columns:250px minmax(0,1fr); gap:clamp(32px,5vw,62px); align-items:start; }
.sport-guide-sidebar { position:sticky; top:94px; }
.sport-detail-toc { padding:18px 18px 16px; border:1px solid #D8CFBB; border-radius:14px; background:#FAF6EC; }
.sport-detail-toc ol { margin:0; padding-left:20px; }
.sport-detail-toc li { margin:7px 0; color:#786E5A; font-size:.78rem; }
.sport-detail-toc a { color:#343A45; font-weight:650; text-decoration:none; }
.sport-detail-toc a:hover { color:var(--turf-dark); }
.sport-sidebar-note { margin-top:16px; padding:17px; border-left:3px solid var(--gold); border-radius:0 10px 10px 0; background:#F6EEDC; }
.sport-sidebar-note strong { font-family:var(--display); }
.sport-sidebar-note p { margin:6px 0 0; font-size:.76rem; line-height:1.55; color:#625B4E; }
.sport-guide-article { min-width:0; }
.sport-guide-section { padding:0 0 36px; margin:0 0 38px; border-bottom:1px solid var(--line); scroll-margin-top:104px; }
.sport-guide-section h2 { margin-bottom:17px; font-size:clamp(1.65rem,3vw,2.35rem); }
.sport-guide-section p { max-width:78ch; margin:0 0 17px; line-height:1.78; }
.sport-guide-section p:last-child { margin-bottom:0; }
.sport-guide-table-wrap { overflow:hidden; margin-top:18px; border:1px solid #D5CCB8; border-radius:15px; background:#FFFDF8; box-shadow:0 7px 22px rgba(11,18,32,.04); }
.sport-guide-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.sport-guide-table th { padding:13px 15px; text-align:left; background:linear-gradient(180deg,#17263F,#0B1220); color:#F6F0DF; font-family:var(--display); font-size:.91rem; letter-spacing:.025em; }
.sport-guide-table td { padding:13px 15px; border-top:1px solid var(--line); vertical-align:top; line-height:1.58; }
.sport-guide-table tr:nth-child(even) td { background:#FBF7EE; }
.sport-guide-table td:first-child { width:31%; color:var(--ink); }
.glossary-table td:first-child { width:25%; }
.strategy-note-list { display:grid; grid-template-columns:1fr 1fr; gap:13px; margin:0; padding:0; list-style:none; }
.strategy-note-list li { display:flex; gap:12px; padding:18px; border:1px solid #D8CFBB; border-radius:14px; background:#FBF7EE; }
.strategy-check { flex:0 0 27px; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:#E2EFE5; color:#17633F; font-weight:900; }
.strategy-note-list h3 { margin:2px 0 6px; font-size:1.02rem; }
.strategy-note-list p { margin:0; font-size:.84rem; line-height:1.58; }
.sport-guide-faq .faq-item { margin-bottom:10px; }
.sport-guide-closing { margin:2px 0 44px; padding:20px 22px; border-left:4px solid var(--turf); border-radius:0 12px 12px 0; background:#EAF2EC; }
.sport-guide-closing p { margin:0; font-size:.9rem; line-height:1.68; }
.sport-related-guides { padding-top:4px; }
.sport-related-grid,.full-guide-launcher-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.sport-related-card,.full-guide-launcher-card { display:flex; align-items:center; gap:12px; min-width:0; padding:14px; border:1px solid #D8CFBB; border-radius:13px; background:#FFFDF8; color:var(--ink); text-decoration:none; transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease; }
.sport-related-card:hover,.full-guide-launcher-card:hover { transform:translateY(-2px); border-color:#C99A3B; box-shadow:0 7px 20px rgba(11,18,32,.07); }
.related-sport-icon { flex:0 0 44px; display:grid; place-items:center; width:44px; height:44px; border-radius:11px; background:#101A2D; color:#EABF62; }
.related-sport-svg { width:27px; height:27px; }
.related-sport-copy { display:grid; min-width:0; }
.related-sport-copy small { color:#81745C; font-size:.63rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.related-sport-copy strong { margin:2px 0; font-family:var(--display); font-size:.98rem; }
.related-sport-copy em { color:var(--turf-dark); font-size:.72rem; font-style:normal; font-weight:800; }
.sport-hub-back { margin-top:24px; }
.sport-read-more { display:inline-flex; align-items:center; margin-top:15px; padding:8px 11px; border-radius:8px; background:#101A2D; color:#F3D58F; font-size:.75rem; font-weight:800; text-decoration:none; }
.sport-read-more:hover { background:#173529; color:#FFF0C4; }
.full-guide-launcher { padding:clamp(44px,6vw,66px) 0; background:#F1E9D8; border-top:1px solid #D8CFBB; border-bottom:1px solid #D8CFBB; }
.full-guide-launcher .section-head { margin-bottom:23px; }
.full-guide-launcher-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }

@media (max-width: 900px) {
  .sport-detail-hero-grid { grid-template-columns:1fr; }
  .sport-detail-hero h1 { max-width:15ch; }
  .sport-detail-photo { max-width:780px; }
  .sport-intro-grid { grid-template-columns:1fr; }
  .sport-detail-layout { grid-template-columns:1fr; }
  .sport-guide-sidebar { position:static; }
  .sport-detail-toc ol { columns:2; column-gap:28px; }
  .sport-sidebar-note { display:none; }
  .full-guide-launcher-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .sport-detail-hero { padding-top:32px; }
  .sport-detail-hero h1 { font-size:clamp(2.45rem,11vw,3.6rem); }
  .sport-detail-photo picture { border-radius:16px; }
  .sport-detail-photo img { aspect-ratio:1/1; }
  .sport-photo-icon { left:14px; bottom:32px; width:56px; height:56px; border-radius:14px; }
  .sport-photo-svg { width:33px; height:33px; }
  .sport-detail-toc ol { columns:1; }
  .sport-guide-table-wrap { overflow:visible; border:0; box-shadow:none; background:transparent; }
  .sport-guide-table,.sport-guide-table tbody,.sport-guide-table tr,.sport-guide-table td { display:block; width:100%; }
  .sport-guide-table thead { display:none; }
  .sport-guide-table tr { margin:0 0 11px; border:1px solid #D8CFBB; border-radius:12px; overflow:hidden; background:#FFFDF8; box-shadow:0 4px 15px rgba(11,18,32,.04); }
  .sport-guide-table td { display:grid; grid-template-columns:96px minmax(0,1fr); gap:11px; padding:10px 12px; border-top:1px solid #E5DED0; background:#FFFDF8 !important; }
  .sport-guide-table td:first-child { width:auto; border-top:0; background:#F4E8C9 !important; }
  .sport-guide-table td::before { content:attr(data-label); color:#766B56; font-size:.63rem; font-weight:850; letter-spacing:.06em; text-transform:uppercase; }
  .strategy-note-list { grid-template-columns:1fr; }
  .sport-related-grid,.full-guide-launcher-grid { grid-template-columns:1fr; }
}

/* Batch 3: expanded full-guide launcher and optimized photo treatment */
@media (min-width: 901px) { .full-guide-launcher-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.sport-detail-photo img { background:#101A2D; }

/* ==========================================================================
   Guides hub redesign
   ========================================================================== */
.guides-hub-page { overflow-x: hidden; }
.guides-hub-page .site-header { border-bottom-color: rgba(240,195,95,.48); }

.guides-hub-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(46px, 6vw, 82px) 0 clamp(54px, 7vw, 88px);
  background:
    radial-gradient(circle at 88% 0%, rgba(211,161,61,.16), transparent 26rem),
    radial-gradient(circle at 10% 100%, rgba(35,123,87,.18), transparent 30rem),
    linear-gradient(135deg, #08111F 0%, #111D33 56%, #0E2A28 100%);
  color: #E9ECF3;
}
.guides-hub-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, black, transparent 80%);
}
.guides-hub-hero .wrap {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(390px, .95fr);
  align-items: center;
  gap: clamp(42px, 6vw, 76px);
}
.guides-hub-hero .crumbs { color: #AEB8C9; margin: 0 0 28px; }
.guides-hub-hero .crumbs a { color: #D7DDE8; border-color: rgba(255,255,255,.24); }
.hub-eyebrow, .hub-kicker {
  margin: 0 0 12px;
  font-size: .76rem;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: .13em;
  color: #9A6E18;
}
.hub-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px 11px;
  border: 1px solid rgba(240,195,95,.34);
  border-radius: 999px;
  color: var(--gold-bright);
  background: rgba(240,195,95,.07);
}
.hub-eyebrow::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--gold-bright); box-shadow: 0 0 0 4px rgba(240,195,95,.12); }
.guides-hub-copy h1 {
  max-width: 12.5ch;
  margin: 18px 0 18px;
  color: #FFFDF8;
  font-size: clamp(3rem, 5.6vw, 5.35rem);
  line-height: .91;
}
.hub-lede {
  max-width: 57ch;
  margin: 0;
  color: #E0E5ED;
  font-size: clamp(1.08rem, 1.55vw, 1.24rem);
  line-height: 1.62;
}
.hub-support { max-width: 62ch; margin: 16px 0 0; color: #B8C2D1; font-size: .98rem; }
.hub-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hub-btn-light { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22); color: #fff; }
.hub-btn-light:hover { color: #fff; border-color: rgba(240,195,95,.6); background: rgba(255,255,255,.12); }
.hub-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  max-width: 650px;
  margin-top: 34px;
}
.hub-stats > div { border-top: 1px solid rgba(255,255,255,.14); padding-top: 15px; }
.hub-stats strong { display: block; font-family: var(--display); color: var(--gold-bright); font-size: 1.72rem; line-height: 1; }
.hub-stats span { display: block; margin-top: 5px; color: #AEB8C9; font-size: .76rem; line-height: 1.35; }

.guides-hub-visual {
  position: relative;
  margin: 0;
  border-radius: 26px;
  overflow: hidden;
  background: #17233A;
  box-shadow: 0 28px 70px rgba(0,0,0,.34);
  border: 1px solid rgba(255,255,255,.15);
}
.guides-hub-visual picture { display: block; }
.guides-hub-visual img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.guides-hub-visual::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to top, rgba(5,12,23,.94) 0%, rgba(5,12,23,.62) 34%, transparent 64%);
}
.guides-hub-visual figcaption {
  position: absolute;
  z-index: 2;
  left: 24px; right: 24px; bottom: 22px;
  color: #fff;
}
.visual-kicker { display: block; margin-bottom: 7px; color: var(--gold-bright); font-size: .69rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.guides-hub-visual figcaption strong { display: block; max-width: 26ch; font-family: var(--display); font-size: clamp(1.3rem, 2.1vw, 1.8rem); line-height: 1.03; }
.guides-hub-visual figcaption ul { display: grid; gap: 6px; margin: 14px 0 0; padding: 0; list-style: none; font-size: .78rem; color: #D8DEE9; }
.guides-hub-visual figcaption li { display: flex; align-items: center; gap: 8px; }
.guides-hub-visual figcaption li::before { content: '✓'; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: rgba(35,123,87,.86); color: #fff; font-size: .67rem; font-weight: 800; }

.hub-intro-strip { padding: 0; background: #FFFDF8; border-bottom: 1px solid var(--line); }
.hub-strip-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hub-strip-item { display: flex; align-items: center; gap: 12px; min-height: 104px; padding: 22px 20px; border-right: 1px solid var(--line); }
.hub-strip-item:first-child { border-left: 1px solid var(--line); }
.hub-strip-item strong, .hub-strip-item span { display: block; }
.hub-strip-item strong { font-family: var(--display); color: var(--ink); font-size: 1.04rem; line-height: 1.05; }
.hub-strip-item div > span { margin-top: 4px; color: #6A6558; font-size: .76rem; line-height: 1.4; }
.hub-icon, .topic-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 13px;
  background: #F0E4C8;
  color: #9A6E18;
}
.hub-icon { width: 40px; height: 40px; }
.hub-icon svg, .topic-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.hub-icon svg path:first-child:last-child { fill: none; }

.hub-section { padding: clamp(62px, 7vw, 92px) 0; }
.hub-section-alt { background: linear-gradient(180deg, rgba(255,253,248,.88), rgba(247,243,233,.9)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hub-section-head { max-width: 760px; margin-bottom: 34px; }
.hub-section-head h2 { margin-bottom: 12px; font-size: clamp(2.2rem, 4vw, 3.45rem); line-height: .98; }
.hub-section-head p:not(.hub-kicker) { margin: 0; color: #565144; font-size: 1.02rem; }
.hub-section-head-split { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(290px, .52fr); gap: clamp(28px, 5vw, 66px); align-items: end; }
.hub-section-head-split > div:first-child { max-width: 760px; }
.hub-note { border-left: 3px solid var(--gold); padding: 14px 0 14px 20px; color: #696253; font-size: .88rem; line-height: 1.6; }

.learning-path { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.path-card {
  position: relative;
  min-height: 270px;
  padding: 27px 28px 26px;
  border: 1px solid #D8D0BF;
  border-radius: 18px;
  background: rgba(255,253,248,.86);
  box-shadow: 0 9px 25px rgba(11,18,32,.055);
}
.path-card-featured {
  background:
    radial-gradient(circle at 94% 0%, rgba(211,161,61,.18), transparent 16rem),
    linear-gradient(145deg, #0F1B2E, #172943);
  color: #D8DFEA;
  border-color: #253754;
}
.path-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 34px; }
.path-step { font-family: var(--display); font-size: 2.1rem; font-weight: 800; line-height: 1; color: #C99737; }
.path-tag { padding: 5px 9px; border-radius: 999px; background: #EEE3CA; color: #775717; font-size: .65rem; font-weight: 800; letter-spacing: .09em; }
.path-card-featured .path-step { color: var(--gold-bright); }
.path-card-featured .path-tag { background: rgba(240,195,95,.13); color: var(--gold-bright); border: 1px solid rgba(240,195,95,.22); }
.path-card h3 { font-size: clamp(1.55rem, 2.5vw, 2rem); margin-bottom: 9px; }
.path-card h3 a { color: var(--ink); text-decoration: none; }
.path-card-featured h3, .path-card-featured h3 a { color: #fff; }
.path-card p { margin: 0 0 17px; max-width: 62ch; color: #5A554A; font-size: .93rem; }
.path-card-featured p { color: #C3CDDA; }
.check-list { display: grid; gap: 7px; margin: 16px 0 20px; padding: 0; list-style: none; font-size: .83rem; }
.check-list li { position: relative; padding-left: 23px; }
.check-list li::before { content: '✓'; position: absolute; left: 0; top: 1px; color: var(--turf); font-weight: 900; }
.path-card-featured .check-list li::before { color: var(--gold-bright); }
.hub-text-link { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; font-size: .86rem; text-underline-offset: 4px; }
.path-card-featured .hub-text-link { color: var(--gold-bright); }

.guide-topic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.topic-panel { border: 1px solid #D9D2C2; border-radius: 18px; padding: 25px; background: #FFFDF8; box-shadow: 0 8px 22px rgba(11,18,32,.045); }
.topic-panel-sport { background: linear-gradient(145deg, #F0E7D2, #FFFDF8); }
.topic-heading { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; }
.topic-icon { width: 46px; height: 46px; background: #E8F0EB; color: var(--turf-dark); }
.topic-panel:nth-child(2) .topic-icon { background: #F6E9D7; color: #9B6327; }
.topic-panel:nth-child(3) .topic-icon { background: #E7EAF2; color: #395176; }
.topic-panel-sport .topic-icon { background: #F2E2BB; color: #8C6518; }
.topic-label { margin: 0 0 2px; font-size: .65rem; font-weight: 800; letter-spacing: .11em; color: #7A7364; }
.topic-heading h3 { margin: 0; font-size: 1.48rem; }
.topic-guide { display: block; position: relative; padding: 16px 34px 16px 0; border-top: 1px solid var(--line); text-decoration: none; }
.topic-guide::after { content: '→'; position: absolute; right: 0; top: 17px; font-weight: 800; color: #9A6E18; }
.topic-guide strong { display: block; color: var(--ink); font-family: var(--display); font-size: 1.11rem; line-height: 1.1; }
.topic-guide span { display: block; margin-top: 6px; color: #696357; font-size: .83rem; line-height: 1.5; }
.topic-panel-sport > p { margin: 0 0 16px; color: #5F594E; font-size: .91rem; }

.hub-table-wrap { overflow-x: auto; border: 1px solid #D6CEBC; border-radius: 18px; box-shadow: var(--shadow-sm); background: #FFFDF8; }
.hub-guide-table { width: 100%; min-width: 820px; border-collapse: collapse; font-size: .9rem; }
.hub-guide-table th, .hub-guide-table td { padding: 15px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.hub-guide-table th { background: linear-gradient(180deg, #17253C, #0D1727); color: #F9F6ED; font-family: var(--display); font-size: 1rem; letter-spacing: .01em; }
.hub-guide-table tbody tr:nth-child(even) { background: #FAF7EF; }
.hub-guide-table tbody tr:last-child td { border-bottom: 0; }
.hub-guide-table td:first-child { width: 32%; color: #363B44; font-weight: 600; }
.hub-guide-table td:nth-child(2) { width: 28%; }
.hub-guide-table td:nth-child(2) a { font-family: var(--display); font-weight: 700; font-size: 1.02rem; color: var(--turf-dark); }
.hub-guide-table td:last-child { color: #656054; }

.hub-concepts-band {
  background:
    radial-gradient(circle at 90% 15%, rgba(211,161,61,.14), transparent 28rem),
    linear-gradient(140deg, #0B1220, #14233A 62%, #102723);
  color: #D6DDE7;
}
.hub-concepts-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(38px, 6vw, 78px); align-items: center; }
.hub-concepts-copy .hub-kicker { color: var(--gold-bright); }
.hub-concepts-copy h2 { max-width: 11ch; color: #fff; font-size: clamp(2.4rem, 4.5vw, 3.75rem); }
.hub-concepts-copy p { color: #BDC7D5; font-size: .95rem; }
.hub-concepts-copy .btn { margin-top: 12px; }
.concept-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.concept-card { min-height: 210px; padding: 23px; border: 1px solid rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.045); }
.concept-card span { color: var(--gold-bright); font-family: var(--display); font-size: 1.45rem; font-weight: 800; }
.concept-card h3 { margin: 20px 0 8px; color: #fff; font-size: 1.28rem; }
.concept-card p { margin: 0; color: #B8C2D0; font-size: .83rem; line-height: 1.55; }

.hub-sport-feature { background: #ECE7DA; }
.hub-sport-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(330px, .75fr); gap: clamp(34px, 6vw, 72px); align-items: center; }
.hub-sport-image { overflow: hidden; border-radius: 22px; box-shadow: var(--shadow-md); }
.hub-sport-image img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.hub-sport-copy h2 { margin-bottom: 15px; font-size: clamp(2.2rem, 3.8vw, 3.25rem); }
.hub-sport-copy p { color: #5A554A; font-size: .94rem; }
.hub-sport-copy .btn { margin-top: 11px; }
.check-list-dark { margin: 20px 0 20px; color: #363A40; font-weight: 600; }

.faq-layout { display: grid; grid-template-columns: minmax(250px, .55fr) minmax(0, 1.1fr); gap: clamp(38px, 7vw, 90px); align-items: start; }
.faq-intro { position: sticky; top: 110px; margin: 0; }
.faq-stack { border-top: 1px solid var(--line); }
.guides-hub-page .faq-item { padding: 19px 0; }
.guides-hub-page .faq-item summary { font-size: 1.25rem; }
.guides-hub-page .faq-item p { font-size: .92rem; color: #5A554A; }

.hub-closing-band { padding: clamp(54px, 6vw, 78px) 0; background: #172238; color: #D1D9E5; border-top: 1px solid #293650; }
.hub-closing-layout { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 36px; align-items: center; }
.hub-closing-band .hub-kicker { color: var(--gold-bright); }
.hub-closing-band h2 { max-width: 22ch; color: #fff; font-size: clamp(2rem, 3.6vw, 3rem); }
.hub-closing-band p { max-width: 74ch; margin-bottom: 0; color: #AEB8C7; font-size: .92rem; }
.hub-closing-actions { display: flex; flex-direction: column; gap: 11px; min-width: 240px; }
.hub-btn-outline { background: transparent; border: 1px solid rgba(255,255,255,.28); color: #fff; text-align: center; }
.hub-btn-outline:hover { border-color: var(--gold-bright); color: var(--gold-bright); }

.guides-hub-page .footer-legal-nav { display: flex; flex-wrap: wrap; gap: 10px 22px; padding-bottom: 18px; border-bottom: 1px solid var(--line-dark); }
.guides-hub-page .footer-legal-nav a { color: #A8ADC2; text-decoration: none; }
.guides-hub-page .footer-legal-nav a:hover { color: var(--gold-bright); }

@media (max-width: 980px) {
  .guides-hub-hero .wrap { grid-template-columns: 1fr; }
  .guides-hub-copy { max-width: 780px; }
  .guides-hub-copy h1 { max-width: 14ch; }
  .guides-hub-visual { max-width: 760px; }
  .hub-strip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hub-strip-item:nth-child(2) { border-right: 1px solid var(--line); }
  .hub-strip-item:nth-child(3), .hub-strip-item:nth-child(4) { border-top: 1px solid var(--line); }
  .hub-strip-item:nth-child(3) { border-left: 1px solid var(--line); }
  .hub-section-head-split, .hub-concepts-layout, .hub-sport-layout, .faq-layout { grid-template-columns: 1fr; }
  .hub-note { max-width: 700px; }
  .faq-intro { position: static; max-width: 720px; }
  .hub-closing-layout { grid-template-columns: 1fr; }
  .hub-closing-actions { flex-direction: row; flex-wrap: wrap; }
}

@media (max-width: 760px) {
  .guides-hub-hero { padding-top: 34px; }
  .guides-hub-copy h1 { font-size: clamp(2.8rem, 13vw, 4rem); max-width: none; }
  .hub-lede { font-size: 1.05rem; }
  .hub-support { font-size: .9rem; }
  .hub-stats { gap: 12px; }
  .hub-stats strong { font-size: 1.45rem; }
  .guides-hub-visual img { aspect-ratio: 1 / 1; }
  .guides-hub-visual figcaption { left: 19px; right: 19px; bottom: 18px; }
  .guides-hub-visual figcaption ul { display: none; }
  .learning-path, .guide-topic-grid, .concept-grid { grid-template-columns: 1fr; }
  .path-card { min-height: 0; }
  .hub-section-head h2 { font-size: clamp(2rem, 10vw, 2.8rem); }
  .hub-table-wrap { border-radius: 14px; }
  .hub-guide-table { min-width: 0; display: block; }
  .hub-guide-table thead { display: none; }
  .hub-guide-table tbody { display: grid; }
  .hub-guide-table tr { display: grid; padding: 17px 18px; border-bottom: 1px solid var(--line); background: #FFFDF8 !important; }
  .hub-guide-table tr:last-child { border-bottom: 0; }
  .hub-guide-table td { display: block; width: auto !important; padding: 0; border: 0; }
  .hub-guide-table td:first-child { margin-bottom: 6px; color: #6B6558; font-size: .78rem; font-weight: 700; }
  .hub-guide-table td:nth-child(2) { margin-bottom: 7px; }
  .hub-guide-table td:last-child { font-size: .8rem; line-height: 1.5; }
  .hub-sport-image img { aspect-ratio: 1 / 1; }
  .hub-closing-actions { flex-direction: column; }
}

@media (max-width: 560px) {
  .hub-actions .btn { width: 100%; text-align: center; }
  .hub-stats { grid-template-columns: repeat(3, 1fr); }
  .hub-stats span { font-size: .65rem; }
  .hub-strip-grid { grid-template-columns: 1fr; padding-left: 20px; padding-right: 20px; }
  .hub-strip-item { min-height: 88px; padding: 17px 0; border-right: 0 !important; border-left: 0 !important; border-top: 1px solid var(--line); }
  .hub-strip-item:first-child { border-top: 0; }
  .hub-section { padding-top: 54px; padding-bottom: 54px; }
  .path-card, .topic-panel, .concept-card { padding: 22px; border-radius: 15px; }
  .path-top { margin-bottom: 26px; }
  .hub-sport-copy .btn { width: 100%; text-align: center; }
  .hub-closing-actions .btn { width: 100%; text-align: center; }
}

/* Homepage sports montage + relocated rankings */
@media (min-width: 901px) {
  .hero .wrap {
    grid-template-columns: minmax(0, .92fr) minmax(440px, 1.08fr);
  }
}

.hero-sports-art {
  position: relative;
  margin: 0;
  min-width: 0;
  isolation: isolate;
  transform: translateY(-24px);
}
.hero-sports-art::before {
  content: '';
  position: absolute;
  inset: 8% 4% 4% 10%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(29,116,145,.24), rgba(211,161,61,.10) 42%, transparent 72%);
  filter: blur(20px);
  z-index: -1;
}
.hero-sports-art picture { display: block; }
.hero-sports-art img {
  display: block;
  width: 108%;
  max-width: none;
  height: auto;
  margin-left: -4%;
  border-radius: 26px;
  filter: drop-shadow(0 28px 42px rgba(0,0,0,.34));
}

.home-proof-section {
  background: linear-gradient(180deg, #FBF8F0 0%, #FFFDF8 42%, #FFFDF8 100%);
}
.home-rankings-panel {
  margin: 0 0 clamp(48px, 7vw, 78px);
  overflow: hidden;
  border: 1px solid #D8D0BF;
  border-radius: 22px;
  background: #FFFDF8;
  box-shadow: 0 20px 50px rgba(11,18,32,.08);
}
.rankings-topline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 26px 30px 22px;
  border-bottom: 1px solid #DDD6C8;
  background:
    radial-gradient(circle at 92% 0%, rgba(211,161,61,.14), transparent 14rem),
    linear-gradient(135deg, #F4EBD7 0%, #FFFDF8 66%);
}
.rankings-kicker {
  margin: 0 0 5px;
  color: var(--turf-dark);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.rankings-topline h2 {
  margin: 0 0 5px;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}
.rankings-topline p:not(.rankings-kicker) {
  margin: 0;
  color: #5B564B;
  font-size: .96rem;
}
.rankings-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 17px;
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  font-weight: 800;
  font-size: .86rem;
  text-decoration: none;
  white-space: nowrap;
}
.rankings-link:hover { background: var(--turf-dark); }
.rankings-table-wrap { overflow-x: auto; }
.home-rankings-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 520px;
}
.home-rankings-table th,
.home-rankings-table td {
  padding: 15px 30px;
  border-bottom: 1px solid #E5DFD3;
  text-align: left;
}
.home-rankings-table th {
  background: #F8F4EA;
  color: #625C50;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.home-rankings-table tr:last-child td { border-bottom: 0; }
.home-rankings-table td:nth-child(2) { font-weight: 800; color: var(--ink); }
.home-rankings-table th:last-child,
.home-rankings-table td:last-child { text-align: right; }
.table-rank {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #F0E4C9;
  color: #9A6B17;
  font-family: var(--display);
  font-weight: 850;
}
.table-score {
  display: inline-grid;
  place-items: center;
  min-width: 42px;
  height: 32px;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--ink);
  color: #F0C35F;
  font-weight: 850;
  font-size: .88rem;
}

@media (max-width: 900px) {
  .hero-sports-art { max-width: 760px; transform: translateY(-14px); }
  .hero-sports-art img { width: 100%; margin-left: 0; }
}

@media (max-width: 640px) {
  .hero-sports-art { transform: translateY(-8px); }
  .hero-sports-art img { border-radius: 18px; }
  .rankings-topline {
    grid-template-columns: 1fr;
    align-items: start;
    padding: 22px 20px 18px;
  }
  .rankings-link { width: 100%; }
  .home-rankings-table { min-width: 0; }
  .home-rankings-table th,
  .home-rankings-table td { padding: 13px 16px; }
  .home-rankings-table th:first-child,
  .home-rankings-table td:first-child { width: 62px; }
  .home-rankings-table th:last-child,
  .home-rankings-table td:last-child { width: 68px; }
}


/* Detailed homepage sportsbook comparison */
.home-rankings-panel {
  overflow: visible;
}
.rankings-table-wrap {
  overflow: hidden;
}
.home-rankings-table {
  min-width: 0;
  table-layout: fixed;
}
.home-rankings-table th,
.home-rankings-table td {
  padding: 16px 18px;
  vertical-align: middle;
}
.home-rankings-table th:nth-child(1),
.home-rankings-table td:nth-child(1) { width: 6%; }
.home-rankings-table th:nth-child(2),
.home-rankings-table td:nth-child(2) { width: 20%; }
.home-rankings-table th:nth-child(3),
.home-rankings-table td:nth-child(3) { width: 7%; }
.home-rankings-table th:nth-child(4),
.home-rankings-table td:nth-child(4) { width: 15%; }
.home-rankings-table th:nth-child(5),
.home-rankings-table td:nth-child(5) { width: 27%; }
.home-rankings-table th:nth-child(6),
.home-rankings-table td:nth-child(6) { width: 17%; }
.home-rankings-table th:nth-child(7),
.home-rankings-table td:nth-child(7) { width: 8%; text-align: right; }
.home-rankings-table td:nth-child(2) {
  font-weight: 800;
}
.home-rankings-table td:nth-child(4),
.home-rankings-table td:nth-child(5),
.home-rankings-table td:nth-child(6) {
  color: #4E4A40;
  font-size: .82rem;
  line-height: 1.45;
}
.sportsbook-brand {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  color: var(--ink);
  text-decoration: none;
}
.sportsbook-brand:hover > span:last-child {
  color: var(--turf-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.sportsbook-logo-box {
  display: grid;
  place-items: center;
  width: 118px;
  height: 48px;
  padding: 7px 9px;
  border: 1px solid #E4DED2;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}
.sportsbook-logo-box img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100px;
  object-fit: contain;
}
.sportsbook-logo-wide img { max-width: 104px; }
.sportsbook-logo-square img { max-width: 74px; }
.table-review-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 8px 11px;
  border: 1px solid #CFC5B1;
  border-radius: 999px;
  color: var(--ink);
  font-size: .75rem;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.table-review-link:hover {
  border-color: var(--turf-dark);
  background: #EDF4EF;
  color: var(--turf-dark);
}
.rankings-note {
  margin: 0;
  padding: 14px 20px 17px;
  border-top: 1px solid #E5DFD3;
  background: #FAF7EF;
  color: #716B5F;
  font-size: .76rem;
  line-height: 1.5;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 1120px) {
  .home-rankings-table th,
  .home-rankings-table td { padding: 14px 12px; }
  .sportsbook-brand {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 8px;
  }
  .sportsbook-logo-box {
    width: 92px;
    height: 43px;
  }
  .sportsbook-logo-box img { max-width: 80px; }
  .home-rankings-table td:nth-child(4),
  .home-rankings-table td:nth-child(5),
  .home-rankings-table td:nth-child(6) { font-size: .76rem; }
}

@media (max-width: 800px) {
  .rankings-table-wrap { overflow: visible; }
  .home-rankings-table,
  .home-rankings-table tbody {
    display: block;
    width: 100%;
  }
  .home-rankings-table thead { display: none; }
  .home-rankings-table tr {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) auto;
    gap: 12px 14px;
    padding: 19px 20px;
    border-bottom: 1px solid #E5DFD3;
    background: #FFFDF8;
  }
  .home-rankings-table tr:last-child { border-bottom: 0; }
  .home-rankings-table td,
  .home-rankings-table td:nth-child(n) {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    text-align: left;
  }
  .home-rankings-table td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  .home-rankings-table td:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }
  .home-rankings-table td:nth-child(3) {
    grid-column: 3;
    grid-row: 1;
    text-align: right;
  }
  .home-rankings-table td:nth-child(n+4) {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 118px minmax(0,1fr);
    gap: 12px;
    align-items: start;
    font-size: .83rem;
    line-height: 1.5;
  }
  .home-rankings-table td:nth-child(n+4)::before {
    content: attr(data-label);
    color: #756E60;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  .home-rankings-table td:nth-child(7) {
    display: flex;
    justify-content: flex-start;
    margin-top: 2px;
  }
  .home-rankings-table td:nth-child(7)::before { display: none; }
  .sportsbook-brand {
    grid-template-columns: 104px minmax(0,1fr);
    gap: 10px;
  }
  .sportsbook-logo-box {
    width: 104px;
    height: 45px;
  }
  .sportsbook-logo-box img { max-width: 90px; }
  .rankings-note { padding: 14px 20px 18px; }
}

@media (max-width: 520px) {
  .home-rankings-table tr {
    grid-template-columns: 50px minmax(0,1fr) auto;
    padding: 17px 16px;
    gap: 10px 12px;
  }
  .sportsbook-brand {
    grid-template-columns: 88px minmax(0,1fr);
    font-size: .88rem;
  }
  .sportsbook-logo-box {
    width: 88px;
    height: 40px;
    padding: 6px 7px;
  }
  .sportsbook-logo-box img { max-width: 76px; }
  .home-rankings-table td:nth-child(n+4) {
    grid-template-columns: 95px minmax(0,1fr);
  }
  .rankings-note { padding-left: 16px; padding-right: 16px; }
}

/* Top-10 homepage and review-hub logo/table refinements */
.home-rankings-table th:nth-child(1),
.home-rankings-table td:nth-child(1) { width: 5%; }
.home-rankings-table th:nth-child(2),
.home-rankings-table td:nth-child(2) { width: 19%; }
.home-rankings-table th:nth-child(3),
.home-rankings-table td:nth-child(3) { width: 7%; }
.home-rankings-table th:nth-child(4),
.home-rankings-table td:nth-child(4) { width: 13%; }
.home-rankings-table th:nth-child(5),
.home-rankings-table td:nth-child(5) { width: 25%; }
.home-rankings-table th:nth-child(6),
.home-rankings-table td:nth-child(6) { width: 18%; }
.home-rankings-table th:nth-child(7),
.home-rankings-table td:nth-child(7) { width: 13%; min-width: 124px; }
.table-review-link {
  width: 100%;
  min-width: 108px;
  padding: 9px 13px;
}
.sportsbook-logo-dark { background: #101827; border-color: #243149; }
.sportsbook-logo-dark img { max-width: 96px; }
.sportsbook-logo-dark.sportsbook-logo-wide img { max-width: 104px; }

.review-book-brand {
  display: grid;
  grid-template-columns: 118px minmax(0,1fr);
  gap: 12px;
  align-items: center;
  color: var(--ink);
  font-weight: 800;
  text-decoration: none;
}
.review-book-brand:hover > span:last-child { color: var(--turf-dark); text-decoration: underline; text-underline-offset: 3px; }
.review-logo-box {
  display: grid;
  place-items: center;
  width: 118px;
  height: 48px;
  padding: 7px 9px;
  border: 1px solid #E4DED2;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}
.review-logo-box img { width: 100%; height: 100%; max-width: 100px; object-fit: contain; display: block; }
.review-logo-wide img { max-width: 104px; }
.review-logo-square img { max-width: 74px; }
.review-logo-dark { background: #101827; border-color: #243149; }
.review-logo-dark img { max-width: 96px; }
.review-logo-dark.review-logo-wide img { max-width: 104px; }
.reviews-rankings-wrap table.compare { min-width: 860px; }
.reviews-rankings-wrap table.compare th:nth-child(1) { width: 8%; }
.reviews-rankings-wrap table.compare th:nth-child(2) { width: 38%; }
.reviews-rankings-wrap table.compare th:nth-child(3) { width: 13%; }
.reviews-rankings-wrap table.compare th:nth-child(4) { width: 24%; }
.reviews-rankings-wrap table.compare th:nth-child(5) { width: 17%; min-width: 128px; }
.review-index-button {
  display: inline-flex;
  min-width: 112px;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  padding: 8px 13px;
  border: 1px solid #CFC5B1;
  border-radius: 999px;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
}
.review-index-button:hover { border-color: var(--turf-dark); background:#EDF4EF; color:var(--turf-dark); }

@media (max-width: 1120px) and (min-width: 801px) {
  .home-rankings-table th:nth-child(7),
  .home-rankings-table td:nth-child(7) { min-width: 112px; }
  .table-review-link { min-width: 98px; font-size: .72rem; padding-left: 9px; padding-right: 9px; }
}
@media (max-width: 800px) {
  .home-rankings-table td:nth-child(7) { min-width: 0; width: auto; }
  .table-review-link { width: auto; min-width: 116px; }
}
@media (max-width: 640px) {
  .review-book-brand { grid-template-columns: 96px minmax(0,1fr); gap: 9px; }
  .review-logo-box { width: 96px; height: 42px; padding: 6px 7px; }
  .review-logo-box img { max-width: 82px; }
}

/* Logo-only sportsbook cells on home + reviews */
.home-rankings-table th:nth-child(2),
.home-rankings-table td:nth-child(2) { width: 12%; }
.home-rankings-table th:nth-child(4),
.home-rankings-table td:nth-child(4) { width: 14%; }
.home-rankings-table th:nth-child(5),
.home-rankings-table td:nth-child(5) { width: 28%; }
.home-rankings-table th:nth-child(6),
.home-rankings-table td:nth-child(6) { width: 19%; }
.home-rankings-table th:nth-child(7),
.home-rankings-table td:nth-child(7) { width: 15%; min-width: 138px; }
.sportsbook-brand.logo-only,
.review-book-brand.logo-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.sportsbook-brand.logo-only .sportsbook-logo-box,
.review-book-brand.logo-only .review-logo-box {
  width: 132px;
  height: 52px;
  padding: 7px 10px;
}
.sportsbook-brand.logo-only:hover .sportsbook-logo-box,
.review-book-brand.logo-only:hover .review-logo-box {
  border-color: var(--turf-dark);
  box-shadow: 0 0 0 3px rgba(41, 128, 63, 0.08);
}
.sportsbook-brand.logo-only .sportsbook-logo-box img,
.review-book-brand.logo-only .review-logo-box img { max-width: 110px; }
.sportsbook-brand.logo-only .sportsbook-logo-wide img,
.review-book-brand.logo-only .review-logo-wide img { max-width: 114px; }
.sportsbook-brand.logo-only .sportsbook-logo-square img,
.review-book-brand.logo-only .review-logo-square img { max-width: 80px; }
.reviews-rankings-wrap table.compare th:nth-child(2) { width: 22%; }
.reviews-rankings-wrap table.compare th:nth-child(4) { width: 28%; }
.reviews-rankings-wrap table.compare th:nth-child(5) { width: 18%; min-width: 136px; }
@media (max-width: 1120px) {
  .sportsbook-brand.logo-only .sportsbook-logo-box,
  .review-book-brand.logo-only .review-logo-box {
    width: 118px;
    height: 48px;
  }
  .sportsbook-brand.logo-only .sportsbook-logo-box img,
  .review-book-brand.logo-only .review-logo-box img { max-width: 98px; }
  .sportsbook-brand.logo-only .sportsbook-logo-wide img,
  .review-book-brand.logo-only .review-logo-wide img { max-width: 102px; }
}
@media (max-width: 800px) {
  .home-rankings-table td:nth-child(2) { justify-self: start; }
  .sportsbook-brand.logo-only .sportsbook-logo-box { width: 108px; height: 46px; }
  .sportsbook-brand.logo-only .sportsbook-logo-box img { max-width: 90px; }
}
@media (max-width: 640px) {
  .review-book-brand.logo-only .review-logo-box { width: 108px; height: 44px; }
  .review-book-brand.logo-only .review-logo-box img { max-width: 90px; }
}

/* Homepage editorial redesign from legal landscape onward */
.visual-story { padding-top: 72px; padding-bottom: 72px; }
.visual-head { max-width: 900px; margin-bottom: 30px; }
.visual-head .eyebrow {
  margin: 0 0 8px;
  color: var(--turf-dark);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.editorial-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  gap: 34px;
  align-items: stretch;
}
.editorial-feature.reverse .feature-photo { order: 2; }
.editorial-feature.reverse .feature-copy { order: 1; }
.editorial-feature-wide { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); }
.feature-photo {
  margin: 0;
  border-radius: 20px;
  overflow: hidden;
  background: #0d1828;
  box-shadow: 0 18px 42px rgba(12, 21, 33, .12);
  min-height: 100%;
}
.feature-photo picture, .feature-photo img { display: block; width: 100%; height: 100%; }
.feature-photo img { min-height: 390px; object-fit: cover; }
.feature-photo figcaption {
  position: relative;
  margin-top: -70px;
  padding: 42px 22px 18px;
  color: #fff;
  background: linear-gradient(transparent, rgba(5,16,29,.92));
  font-size: .82rem;
  line-height: 1.45;
}
.feature-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.fact-stack, .bankroll-rules { display: grid; gap: 14px; }
.fact-card, .bankroll-rule {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  padding: 18px;
  border: 1px solid #e3dccf;
  border-radius: 15px;
  background: #fffdf8;
}
.fact-card h3, .bankroll-rule h3, .choice-card h3, .market-mini h3, .promo-card h3, .topic-note h3,
.compare-panel h3, .terms-heading h3 { margin: 0 0 5px; font-size: 1rem; }
.fact-card p, .bankroll-rule p, .choice-card p, .market-mini p, .promo-card p, .topic-note p,
.compare-panel p, .terms-heading p { margin: 0; color: #5c574d; font-size: .84rem; line-height: 1.52; }
.feature-icon, .learning-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #f2e2b4;
  color: #0b1728;
  font-weight: 900;
  font-size: 1.05rem;
}
.compare-panels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
  margin-top: 22px;
}
.compare-panel {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  gap: 14px;
  padding: 20px;
  border-radius: 16px;
}
.compare-panel.good { background: #edf6ef; border: 1px solid #cfe5d4; }
.compare-panel.caution { background: #fff6e9; border: 1px solid #ead9bb; }
.mini-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  font-weight: 900;
}
.check-list { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 7px; }
.check-list li { position: relative; padding-left: 20px; color: #504b42; font-size: .83rem; line-height: 1.45; }
.check-list li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--turf-dark); font-weight: 900; }
.visual-callout {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  gap: 14px;
  align-items: center;
  margin-top: 22px;
  padding: 18px 20px;
}
.visual-callout p { margin: 0; }
.callout-icon { display: grid; place-items:center; width: 40px; height:40px; border-radius:12px; background:#fff; font-size:1.1rem; }
.topic-note-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
  margin-top: 20px;
}
.topic-note {
  padding: 18px;
  border: 1px solid #e3dccf;
  border-radius: 15px;
  background: #fff;
}
.topic-note .feature-icon { margin-bottom: 12px; }
.choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }
.choice-card {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  gap: 12px;
  padding: 16px;
  border: 1px solid #e4ddd1;
  border-radius: 14px;
  background: #fffdf8;
}
.step-chip, .rule-number {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--gold-bright);
  font-size: .75rem;
  font-weight: 900;
}
.decision-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 1px;
  margin-top: 22px;
  overflow: hidden;
  border: 1px solid #ddd5c8;
  border-radius: 16px;
  background: #ddd5c8;
}
.decision-strip > div { padding: 18px; background:#fffdf8; display:grid; grid-template-columns:38px 1fr; column-gap:10px; align-items:center; }
.decision-strip strong { display:block; font-size:.92rem; }
.decision-strip small { grid-column:2; color:#6b6559; line-height:1.35; }
.decision-icon { grid-row:1 / 3; display:grid; place-items:center; width:36px; height:36px; border-radius:11px; background:#f3e3b7; font-weight:900; }
.odds-example { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.odds-pill {
  flex:1;
  min-height:112px;
  display:grid;
  place-items:center;
  align-content:center;
  padding:16px;
  border-radius:16px;
  text-align:center;
}
.odds-pill.minus { background:#0e1a2c; color:#fff; }
.odds-pill.plus { background:#edf6ef; color:#0c3b22; }
.odds-pill span { font-family:var(--display); font-size:2rem; line-height:1; }
.odds-pill small { margin-top:8px; font-size:.76rem; opacity:.86; }
.odds-vs { color:#847b6a; font-weight:900; font-size:.78rem; }
.feature-lede { margin:0 0 16px; font-size:.93rem; line-height:1.62; color:#4d493f; }
.market-mini-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.market-mini, .promo-card {
  padding:15px;
  border:1px solid #e3dccf;
  border-radius:14px;
  background:#fffdf8;
}
.market-mini .feature-icon, .promo-card .feature-icon { width:36px; height:36px; border-radius:10px; margin-bottom:10px; }
.bankroll-meter {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:22px;
}
.bankroll-meter > div { padding:18px; border:1px solid #e0d9cc; border-radius:15px; background:#fffdf8; }
.bankroll-meter strong, .bankroll-meter small { display:block; }
.bankroll-meter strong { margin:7px 0 5px; }
.bankroll-meter small { color:#6b6559; line-height:1.4; }
.meter-label { display:inline-block; padding:5px 9px; border-radius:999px; background:#0d1a2d; color:#fff; font-weight:900; font-size:.75rem; }
.promo-grid { display:grid; gap:14px; }
.promo-card { display:grid; grid-template-columns:44px minmax(0,1fr); column-gap:12px; align-items:start; }
.promo-card .feature-icon { grid-row:1 / 3; margin:0; }
.terms-checklist {
  margin-top:22px;
  padding:22px;
  border:1px solid #e0d8ca;
  border-radius:16px;
  background:#fffdf8;
}
.terms-heading { display:grid; grid-template-columns:44px minmax(0,1fr); gap:12px; align-items:center; }
.columns-2 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 24px; }
.learning-path {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.learning-card {
  position:relative;
  min-height:190px;
  padding:22px;
  border:1px solid #e1d9cb;
  border-radius:17px;
  background:#fffdf8;
  transition:transform .18s ease, box-shadow .18s ease;
}
.learning-card:hover { transform:translateY(-2px); box-shadow:0 14px 28px rgba(11,22,38,.08); }
.learning-card.featured { background:linear-gradient(135deg,#0d1b30,#123954); color:#fff; }
.learning-card.featured p { color:#d7ddec; }
.learning-card.featured .card-meta { color:#f0be42; }
.learning-card .learning-icon { margin-bottom:16px; }
.learning-card h3 { margin:0 0 8px; font-size:1.12rem; }
.learning-card h3 a { color:inherit; text-decoration:none; }
.learning-card h3 a:hover { text-decoration:underline; text-underline-offset:3px; }
.learning-card p:last-child { margin:0; color:#625d52; line-height:1.48; }
.section-cta { display:flex; gap:18px; align-items:center; margin-top:24px; flex-wrap:wrap; }

@media (max-width: 900px) {
  .visual-story { padding-top:58px; padding-bottom:58px; }
  .editorial-feature, .editorial-feature-wide { grid-template-columns:1fr; }
  .editorial-feature.reverse .feature-photo, .editorial-feature.reverse .feature-copy { order:initial; }
  .feature-photo img { min-height:330px; }
  .decision-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .topic-note-grid, .bankroll-meter { grid-template-columns:1fr; }
  .learning-path { grid-template-columns:1fr; }
}
@media (max-width: 700px) {
  .visual-story { padding-top:46px; padding-bottom:46px; }
  .feature-photo img { min-height:240px; }
  .compare-panels, .choice-grid, .market-mini-grid, .columns-2 { grid-template-columns:1fr; }
  .decision-strip { grid-template-columns:1fr; }
  .odds-example { align-items:stretch; }
  .odds-pill { min-height:100px; }
  .visual-callout { grid-template-columns:36px minmax(0,1fr); padding:16px; }
  .feature-photo figcaption { margin-top:-60px; padding:34px 16px 14px; }
}


/* Readjust subject-photo caption overlays and learning cards */
.feature-photo figcaption {
  margin-top: -116px;
  min-height: 116px;
  padding: 54px 22px 18px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 6px;
  background: linear-gradient(180deg, rgba(5,16,29,0) 0%, rgba(5,16,29,.38) 22%, rgba(5,16,29,.94) 100%);
}
.feature-photo figcaption strong {
  display: block;
  max-width: 26ch;
  font-family: var(--display);
  font-size: clamp(1.05rem, 1.85vw, 1.42rem);
  line-height: 1.03;
  color: #fff;
}
.feature-photo figcaption span:last-child {
  display: block;
  max-width: 56ch;
  color: #E3E8F2;
}
.photo-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(240, 190, 66, 0.18);
  color: #F0BE42;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  border: 1px solid rgba(240, 190, 66, 0.24);
}
.learning-card { min-height: 204px; }
.learning-card h3 { margin: 0 0 10px; font-size: 1.16rem; line-height: 1.12; }
.learning-card h3 a { display: block; line-height: 1.12; }
.learning-card.featured h3,
.learning-card.featured h3 a { color: #fff; }
.learning-card.featured { overflow: hidden; }
.learning-card.featured::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at top right, rgba(240,190,66,.14), transparent 42%);
}
.learning-card > * { position: relative; z-index: 1; }
@media (max-width: 900px) {
  .feature-photo figcaption {
    margin-top: -106px;
    min-height: 106px;
    padding-top: 48px;
  }
}
@media (max-width: 700px) {
  .feature-photo figcaption {
    margin-top: -100px;
    min-height: 100px;
    padding: 42px 16px 14px;
    gap: 5px;
  }
  .feature-photo figcaption strong {
    max-width: 22ch;
    font-size: 1rem;
  }
  .feature-photo figcaption span:last-child {
    font-size: .75rem;
    line-height: 1.38;
  }
  .learning-card { min-height: 190px; }
}
@media (max-width: 520px) {
  .feature-photo figcaption {
    margin-top: -108px;
    min-height: 108px;
    padding-top: 44px;
  }
  .photo-kicker { font-size: .62rem; padding: 5px 9px; }
}


/* Floating scroll-to-top control */
.scroll-top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 1000;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(240, 190, 66, .58);
  border-radius: 50%;
  background: #0D1828;
  color: #F0BE42;
  box-shadow: 0 12px 28px rgba(8, 16, 29, .24);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease, background-color .2s ease, color .2s ease;
}
.scroll-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.scroll-top:hover {
  background: #F0BE42;
  color: #0D1828;
}
.scroll-top:focus-visible {
  outline: 3px solid rgba(240, 190, 66, .4);
  outline-offset: 4px;
}
.scroll-top svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}
@media (max-width: 700px) {
  .scroll-top {
    right: 16px;
    bottom: 16px;
    width: 44px;
    height: 44px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-top { transition: none; }
}


/* Human-readable sitemap */
.sitemap-hero { padding: 78px 0 58px; border-bottom: 1px solid var(--line); }
.sitemap-hero h1 { max-width: 18ch; margin: 8px 0 14px; font-size: clamp(2.6rem, 6vw, 5.4rem); }
.sitemap-hero > .wrap > p:not(.eyebrow) { max-width: 760px; font-size: 1.08rem; line-height: 1.7; }
.sitemap-stats { display:flex; gap:12px; flex-wrap:wrap; margin-top:28px; }
.sitemap-stats span { display:inline-flex; align-items:baseline; gap:7px; padding:10px 14px; border:1px solid #D8CFBB; border-radius:999px; background:#FFFDF8; color:#655E50; }
.sitemap-stats strong { color:var(--ink); font-size:1.05rem; }
.sitemap-content { padding:64px 0 82px; }
.sitemap-home-card { display:grid; grid-template-columns:54px minmax(0,1fr); gap:16px; align-items:start; max-width:760px; margin-bottom:30px; padding:22px; border:1px solid #D8CFBB; border-radius:18px; background:#FFFDF8; box-shadow:var(--shadow-sm); }
.sitemap-home-card h2 { margin:3px 0 7px; font-size:1.35rem; }
.sitemap-home-card h2 a { color:inherit; text-decoration:none; }
.sitemap-home-card h2 a:hover { color:var(--turf-dark); text-decoration:underline; text-underline-offset:3px; }
.sitemap-home-card p:last-child { margin:0; }
.sitemap-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.sitemap-group { padding:24px; border:1px solid #DDD4C3; border-radius:18px; background:#FFFDF8; box-shadow:0 8px 24px rgba(11,18,32,.045); }
.sitemap-group h2 { margin:0 0 4px; font-size:1.55rem; }
.sitemap-group > p { margin:0 0 16px; color:#817867; font-size:.78rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.sitemap-group ul { display:grid; gap:0; margin:0; padding:0; list-style:none; }
.sitemap-group li { border-top:1px solid #ECE6DA; }
.sitemap-group li:first-child { border-top:0; }
.sitemap-group a { display:block; padding:11px 2px; color:var(--ink); font-weight:700; text-decoration:none; line-height:1.35; }
.sitemap-group a:hover { color:var(--turf-dark); padding-left:5px; }
@media (max-width:800px){.sitemap-hero{padding:58px 0 42px}.sitemap-content{padding:44px 0 62px}.sitemap-grid{grid-template-columns:1fr}.sitemap-group{padding:20px}.sitemap-home-card{grid-template-columns:44px minmax(0,1fr);padding:18px}}
