/* Platform-side CSS deltas, loaded AFTER the mirrored theme stylesheet.
   Keep this file tiny: every rule is a deliberate divergence from live. */

/* Raptive 2026-08-13: the theme pins the article sidebar ad fixed at
   top-right with min-width 320px, which overlaps the 50vw content column
   on viewports between 1300px and ~1400px (e.g. 1366px laptops). Clamp the
   ad to the free gutter and only show it when a 300px creative truly fits. */
div.single-sticky-ad { width: calc(25vw - 30px); min-width: 0; }
@media (max-width: 1400px) {
  div.single-sticky-ad { display: none; }
}

/* Raptive 2026-08-13 (their screenshot: div.section z-index 90): every
   section forms an equal stacking context, so their floating video player,
   rendered inside one section, paints BEHIND all later sections regardless
   of its own z-index. Lift only the section that contains a Raptive player
   above its siblings; everything else keeps the theme's stacking. */
div.section:has(.adthrive-video-player),
div.section:has([class*="adthrive-collapse"]),
div.section:has([class*="adthrive-sticky"]),
div.section:has([id^="AdThrive_Video"]) {
  z-index: 95;
}

/* SEO 2026-09-13: archive and search pages had no <h1> at all — the intro
   heading was live's <h3> (archives) and <h2> (search), and the theme sizes
   both by tag name. The tag changed to h1; these two rules re-apply the exact
   declarations from style.css so nothing moves. */
.section.article-grid > .intro h1.archive-title,
.section.search-results > .intro h1.archive-title {
  font-family: "Nuform Sans", "Helvetica", sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  line-height: 0.9;
  font-size: calc(var(--pad) * 0.75);
}
.section.article-grid.author-archive > .intro h1.archive-title,
.section.search-results.author-archive > .intro h1.archive-title {
  padding-top: 1rem;
  text-transform: unset;
}
.section.article-grid > .intro h1.search-title,
.section.search-results > .intro h1.search-title {
  font-family: "Nuform Sans", "Helvetica", sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  line-height: 0.9;
  font-size: calc(var(--pad));
}

/* CLS 2026-09-13: captured bodies carry no width/height on the hero photo or
   the .photos gallery figures, so the browser reserves nothing for them. At the
   widths where the theme lays the hero out in flow at height:auto instead of
   absolutely filling the section, the figure is 0px tall until the photo
   arrives and the whole article jumps down under the reader's thumb. The `auto`
   keyword makes these ratios a fallback only: a replaced element that knows its
   natural ratio uses that instead, so nothing moves once the image decodes and
   post-load layout is unchanged. Ratios sampled off the live corpus: 46 of 66
   review heroes are exactly 3:2 and none are portrait; the gallery crops are
   1024x682 (size-whole) and 819x1024 (size-quarter) in 235 of 235 figures.
   Raptive's own slots already ship min-height, so they are left alone. */
@media (max-width: 800px) and (orientation: portrait), (max-width: 600px) {
  .section.hero figure.fullscreen img { aspect-ratio: auto 3 / 2; }
}
.section.photos.size-whole > .container figure img { aspect-ratio: auto 3 / 2; }
.section.photos.size-quarter > .container figure img { aspect-ratio: auto 819 / 1024; }
