/* ===================================================================
   Ice hockey theme: "Rink Boards". Loaded after main.css on hockey.thegearsports.com only.
   Ice white and navy with goal-line red and blue-line blue: a cold ice-sheet
   hero with the blue, red and blue lines across its base, jersey-number
   card markers, and tables headed like a scoreboard.
   =================================================================== */
html:root {
  --paper:       #f5f8fb;
  --paper-2:     #e9eff5;
  --ink:         #0e1a26;
  --ink-soft:    #3b4a5a;
  --ink-faint:   #5a6878;
  --line:        #d3dde7;
  --accent:      #c8102e;
  --accent-deep: #a00d25;
  --accent-soft: #fbe5e8;
  --white:       #ffffff;
  --navy:        #0b1f3a;
  --blueline:    #0b4fa8;
  --goalred:     #c8102e;
  --display: 'Bebas Neue', 'Oswald', Impact, sans-serif;
  --body:    'Source Sans 3', system-ui, sans-serif;
  --radius:  4px;
}
html:root[data-theme="dark"] {
  --paper:       #0b141e;
  --paper-2:     #111d2a;
  --ink:         #eef3f8;
  --ink-soft:    #c3cfdb;
  --ink-faint:   #94a3b3;
  --line:        #22324a;
  --accent:      #ff5a6e;
  --accent-deep: #ff8494;
  --accent-soft: #2b1419;
  --white:       #111d2a;
  --blueline:    #6aa3ef;
}

body { font-size: 1.06rem; }
body::before { display: none; }
h1, h2, h3 { font-family: var(--display); font-weight: 400; letter-spacing: .02em; }
h1 { line-height: .95; }
h2 { font-size: clamp(1.9rem, 3.2vw, 2.6rem); }
a { color: var(--blueline); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--accent); }
.eyebrow { color: var(--accent); font-family: var(--body); font-weight: 700; letter-spacing: .14em; }

/* Nav: navy with a red goal-line rule */
.nav { background: var(--navy); border-bottom: 4px solid var(--goalred); backdrop-filter: none; }
html[data-theme="dark"] .nav { background: #071526; }
.brand { color: #f5f8fb; }
.brand .rev { color: #8fbaf0; }
.brand__mark { background: var(--goalred); color: #fff; }
.brand__sub { color: #b9c8d8; }
.nav__links a { color: #f5f8fb; font-weight: 600; font-size: .92rem; }
.nav__links a:hover, .nav__links a[aria-current="page"] { color: #8fbaf0; }
.nav__cta { background: var(--goalred); color: #fff !important; }
.nav__cta:hover { background: #f5f8fb; color: var(--navy) !important; }
.nav__toggle span { background: #f5f8fb; }
.nav .iconbtn { background: transparent; border-color: #2a4466; color: #f5f8fb; }
.nav .iconbtn:hover { color: #8fbaf0; border-color: #8fbaf0; }
@media (max-width: 1120px) {
  .nav__links { background: var(--navy); border-bottom-color: #2a4466; }
  .nav__links a { border-bottom-color: #1a3354; }
}

/* Hero: a cold ice sheet with skate scratches, then blue, red and blue lines */
.hero {
  background-color: #e8f0f7; color: var(--navy);
  background-image:
    radial-gradient(ellipse at 30% 0%, rgba(255,255,255,.9), rgba(255,255,255,0) 60%),
    repeating-linear-gradient(115deg, rgba(11,79,168,.035) 0 2px, transparent 2px 46px),
    repeating-linear-gradient(65deg, rgba(11,31,58,.03) 0 1px, transparent 1px 63px);
  padding-bottom: calc(clamp(2.5rem,6vw,4rem) + 30px);
}
html[data-theme="dark"] .hero { background-color: #10233a; color: #eef3f8;
  background-image:
    radial-gradient(ellipse at 30% 0%, rgba(143,186,240,.14), rgba(143,186,240,0) 60%),
    repeating-linear-gradient(115deg, rgba(255,255,255,.035) 0 2px, transparent 2px 46px),
    repeating-linear-gradient(65deg, rgba(255,255,255,.025) 0 1px, transparent 1px 63px); }
.hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; top: auto;
  width: auto; height: 30px; aspect-ratio: auto; transform: none; border-radius: 0; opacity: 1; filter: none;
  background: linear-gradient(90deg, transparent 0 18%, var(--blueline) 18% 24%, transparent 24% 47%, var(--goalred) 47% 53%, transparent 53% 76%, var(--blueline) 76% 82%, transparent 82%), #ffffff;
  border-top: 1px solid #cdd9e5;
}
.hero h1 { color: var(--navy); }
html[data-theme="dark"] .hero h1 { color: #ffffff; }
.hero h1 .spin { color: var(--goalred); }
.hero h1 .hero__brand { color: var(--blueline); font-family: var(--body); font-weight: 700; font-size: .2em; letter-spacing: .24em; text-transform: uppercase; }
.hero .lede { color: var(--ink-soft); }
html[data-theme="dark"] .hero .lede { color: #c3cfdb; }
.hero .btn--solid { background: var(--goalred); border-color: var(--goalred); color: #fff; }
.hero .btn--solid:hover { background: var(--navy); border-color: var(--navy); }
.hero .btn--ghost { border-color: var(--navy); color: var(--navy); }
html[data-theme="dark"] .hero .btn--ghost { border-color: #fff; color: #fff; }

.btn { font-weight: 700; }

/* Cards: jersey numbers */
.card::before { display: none; }
.card:hover { border-color: var(--blueline); }
a.card > .card__num { font-family: var(--display); font-size: 2.1rem; line-height: 1; color: var(--goalred); letter-spacing: .02em; }
.card__tag { color: var(--blueline); font-weight: 700; }

/* Section headings: a short red goal-line bar */
.shead { border-bottom: 3px solid var(--blueline); }
.shead h2::before { content: ""; display: inline-block; width: .22em; height: .8em; margin-right: .4em; background: var(--goalred); vertical-align: -.05em; }

.callout { background: var(--accent-soft); border: 0; border-left: 4px solid var(--goalred); }

/* Tables: scoreboard headers */
.facts thead th { background: var(--navy); color: #f5f8fb; border-bottom: 3px solid var(--goalred); letter-spacing: .04em; }
.facts tbody tr:nth-child(even) td { background: #f9fbfd; }
html[data-theme="dark"] .facts tbody tr:nth-child(even) td { background: #0f1b28; }

/* Gear box: a dasher board with the red kick plate */
.gearline { background: var(--white); border: 2px solid var(--navy); border-bottom: 8px solid var(--goalred); }
html[data-theme="dark"] .gearline { border-color: #2a4466; border-bottom-color: var(--goalred); }
.gearline__t { color: var(--navy); }
html[data-theme="dark"] .gearline__t { color: #eef3f8; }
.gearline a.btn { background: var(--blueline); border-color: var(--blueline); color: #fff; }

.footer { background: #071526; border-top: 4px solid var(--goalred); }
.footer, .footer a, .footer__bottom a { color: #e4ebf2; }
.footer__brand .rev { color: #8fbaf0; }
.footer h4 { color: #8fbaf0; }

.pick__cta .btn--solid { background: var(--goalred); border-color: var(--goalred); color: #fff; }
.pick__cta .btn--solid:hover { background: var(--navy); border-color: var(--navy); }