/* ============================================================
   LegalAtoms — PRESS RELEASE single (/press-releases/{slug}/).
   Loaded ONLY on press_releases singles, AFTER tokens.css +
   legalatoms-gutenberg.css + legalatoms-blog-single.css — so the
   Harbor chrome, hero wash, breadcrumb, .la-article__* masthead,
   .la-prose reading typography and full dark-mode support all come
   from the blog sheet unchanged. This sheet adds only what a press
   release needs on top: the eyebrow, the single-column measure that
   replaces the blog's article+rail grid, and the back link.
   All colour/space via tokens; theme-aware.
   ============================================================ */

body.la-blog-press-single{ background:var(--surface-page); }

/* Eyebrow — coral mono caps, the same treatment .la-bx-eyebrow gives the
   archive. Restated here (with the identical token values) so the single does
   not have to load the whole blog-index sheet for one class. */
.la-prel__eyebrow{
  color:var(--text-accent);
  font:500 .75rem/1.3 var(--font-mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  margin:0 0 14px;
}

/* Body measure. The blog single uses .la-article__grid (content + 320px sticky
   rail); a press release has no rail, so the prose is simply centred at its own
   measure instead of being left-aligned in a now-missing two-column grid. */
.la-prel__body{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-block:var(--space-8);
}
.la-prel__body > .la-prose{ width:100%; }

/* Legacy body content that carries Beaver Builder page chrome.
   Release 12084 ("…restraining-orders-in-california") was authored by pasting a
   rendered BB page into post_content, so its stored body opens with
   <div id="fl-main-content" class="fl-page-content">. The BB theme skin
   (wp-content/uploads/bb-theme/skin-*.css) paints that wrapper opaque white —
   `.fl-page-content{background-color:#fff}`, specificity (0,1,0), no
   !important — which in dark mode renders a white island under our light
   dark-mode body text and makes the release unreadable.

   Override the one offending property so the wrapper inherits the press page
   surface in both themes. Unconditional rather than dark-only: --surface-page
   is #FFFFFF in light mode, so this is a visual no-op there, and the wrapper
   keeps following the page surface if that token is ever retinted. Keyed on
   the class, not the post ID, so any future release pasted the same way is
   covered. Render-time only — stored post_content is untouched. */
body.la-blog-press-single .la-prose .fl-page-content{
  background-color:transparent;
}

/* The blog's coral drop cap is an editorial device that misfires here: several
   releases open with a bold restatement of the headline (a standfirst), where a
   floated 4.6rem capital lands on bold text and reads as a mistake — and the 19
   releases are inconsistent about whether they open that way at all. Neutralise
   it for press singles only; the blog keeps its drop cap. */
body.la-blog-press-single .la-prose > p:first-of-type::first-letter{
  color:inherit;
  float:none;
  font:inherit;
  margin:0;
  padding-top:0;
}

/* Back link — quiet, sits under the prose at the same measure, separated by the
   standard hairline rather than a heavy divider. */
.la-prel__back{
  width:100%;
  max-width:var(--article-measure);
  margin:var(--space-7) 0 0;
  padding-top:var(--space-5);
  border-top:1px solid var(--border-default);
  font:500 .9375rem/1.5 var(--font-sans);
}
body.la-blog-press-single .la-prel__back a{
  color:var(--text-secondary);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  /* >=44px tap target without visually inflating the link text. */
  min-height:44px;
}
body.la-blog-press-single .la-prel__back a:hover{
  color:var(--text-link);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.18em;
}
body.la-blog-press-single .la-prel__back a:focus-visible{
  outline:2px solid var(--la-coral-500);
  outline-offset:3px;
  border-radius:var(--radius-sm);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:640px){
  .la-prel__eyebrow{ margin-bottom:12px; }
  .la-prel__body{ padding-block:var(--space-7); }
}