/*
Theme Name: Bounty Sports (blankslate child)
Theme URI: https://bountysports.com
Description: Child theme for the custom blankslate build. Adds article-body typography, SEO metadata and fixes two defects inherited from the parent header/single templates. Parent CSS is unaffected.
Author: Playon
Template: blankslate
Version: 1.0.0
*/

/* ---------------------------------------------------------------------------
   ARTICLE BODY TYPOGRAPHY

   The parent is a Figma-exported Tailwind v4 build. Tailwind's preflight resets
   headings to `font-size: inherit; font-weight: inherit; margin: 0`, and
   the_content() is dumped into the "Rich Text" wrapper with no classes on it.
   Net effect: correct h2s in the HTML that render identically to body copy,
   with no vertical rhythm. Everything below re-establishes that hierarchy.

   Scope: [data-name="Rich Text"] exists ONLY on single posts (verified: 2 on an
   article, 0 on the homepage), so nothing here can leak into the front page.
   The child stylesheet is enqueued via get_stylesheet_uri() in wp_head, which
   fires after the parent's hardcoded <link> tags, so the cascade favours these
   rules without needing !important.
--------------------------------------------------------------------------- */

[data-name="Rich Text"] {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
}

[data-name="Rich Text"] p,
[data-name="Rich Text"] li {
  font-size: 1.125rem;
  line-height: 1.75;
  color: #1c2735;
  margin: 0 0 1.35em;
  max-width: 68ch;
}

[data-name="Rich Text"] h2 {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: #121e2d;
  margin: 2.75rem 0 0.9rem;
  max-width: 34ch;
}

[data-name="Rich Text"] h3 {
  font-size: 1.3125rem;
  font-weight: 600;
  line-height: 1.3;
  color: #121e2d;
  margin: 2rem 0 0.65rem;
}

/* No stranded heading at the very top of the body */
[data-name="Rich Text"] h2:first-child,
[data-name="Rich Text"] h3:first-child {
  margin-top: 0;
}

[data-name="Rich Text"] ul,
[data-name="Rich Text"] ol {
  margin: 0 0 1.35em;
  padding-left: 1.5rem;
  max-width: 68ch;
}

[data-name="Rich Text"] ul { list-style: disc; }
[data-name="Rich Text"] ol { list-style: decimal; }

[data-name="Rich Text"] li { margin-bottom: 0.5em; }

[data-name="Rich Text"] a {
  color: #0f7d80;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

[data-name="Rich Text"] a:hover {
  color: #121e2d;
  text-decoration-color: #5ec5c8;
}

[data-name="Rich Text"] strong { font-weight: 700; color: #121e2d; }
[data-name="Rich Text"] em { font-style: italic; }

[data-name="Rich Text"] blockquote {
  margin: 2rem 0;
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 3px solid #5ec5c8;
  max-width: 64ch;
}

[data-name="Rich Text"] blockquote p {
  font-size: 1.1875rem;
  font-style: italic;
  color: #2b3a4d;
  margin-bottom: 0.6em;
}

[data-name="Rich Text"] img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 1.75rem 0;
}

[data-name="Rich Text"] hr {
  border: 0;
  border-top: 1px solid #c9d5e4;
  margin: 2.5rem 0;
}

/* Last paragraph: no trailing gap, but the same size as the rest of the body.
   An earlier version styled this as a small grey disclosure line, per the July
   content plan. None of the 19 articles actually carry that line, so the rule
   was shrinking each writer's closing argument instead. */
[data-name="Rich Text"] p:last-child {
  margin-bottom: 0;
}

@media (max-width: 640px) {
  [data-name="Rich Text"] p,
  [data-name="Rich Text"] li { font-size: 1.0625rem; line-height: 1.7; }
  [data-name="Rich Text"] h2 { font-size: 1.5rem; margin-top: 2.25rem; }
  [data-name="Rich Text"] h3 { font-size: 1.1875rem; }
}

/* ---------------------------------------------------------------------------
   ARTICLE HERO

   The parent hardcodes the hero as h-[337px] with overflow-clip. Any headline
   long enough to push the title + dek past 337px is silently chopped - the NFC
   North piece renders 466px of content into that 337px box, cutting the top of
   the headline and the bottom of the standfirst. Let the banner grow to fit its
   content while keeping 337px as the floor, so short-headline articles are
   unchanged. The background image is absolutely positioned and object-cover, so
   it simply covers the taller box.
--------------------------------------------------------------------------- */

body.single-post [data-name="Banner"] {
  height: auto;
  min-height: 337px;
}
