/**
 * PlaidCars — brand cinematic background for existing page headers.
 * BR-IMG Option A (image agent, 2026-06): mount a placed, text-free brand photo
 * BEHIND a header that already owns its single <h1>, with a dark scrim so the
 * live HTML headline/sub stay readable. Purely additive — only *--branded*
 * variants; base rules untouched. Reverse by removing the --branded class.
 *
 * Image is set per-instance via the --pc-brand-hero custom property, which the
 * PHP writes from assets/brand/hero/{model|home}.webp. Composition of the source
 * photos is car-RIGHT / negative-space-LEFT, so the scrim is heaviest on the left.
 */

/* ---- Homepage hero — keeps its white finder card; flips H1/sub to light --- */
.pc-home-hero.pc-home-hero--branded {
  position: relative;
  background-color: #161616;
  background-image:
    linear-gradient(180deg, rgba(16, 16, 18, 0.72) 0%, rgba(16, 16, 18, 0.84) 100%),
    var(--pc-brand-hero, none);
  background-size: cover, cover;
  background-position: center, right center;
  background-repeat: no-repeat, no-repeat;
  border-bottom: 1px solid #0c0c0c;
}
.pc-home-hero--branded .pc-home-hero__title { color: #ffffff; }
.pc-home-hero--branded .pc-home-hero__sub { color: rgba(255, 255, 255, 0.88); }
.pc-home-hero--branded .pc-home-hero__counter { color: rgba(255, 255, 255, 0.72); }

/* ---- Buy model landing header (archive-cars.php) ------------------------- */
/* Scoped to brand model landings only (PHP adds --branded there, never to the
 * generic archive). Left-weighted scrim because the H1/intro sit left. */
.pc-tm-archive__header.pc-tm-archive__header--branded {
  position: relative;
  margin: 0 0 22px;
  padding: clamp(28px, 6vw, 64px) clamp(18px, 4vw, 40px);
  border-radius: 8px;
  overflow: hidden;
  background-color: #161616;
  background-image:
    linear-gradient(90deg, rgba(16, 16, 18, 0.90) 0%, rgba(16, 16, 18, 0.58) 46%, rgba(16, 16, 18, 0.06) 80%),
    var(--pc-brand-hero, none);
  background-size: cover, cover;
  background-position: center, right center;
  background-repeat: no-repeat, no-repeat;
}
.pc-tm-archive__header--branded .pc-tm-archive__title { color: #ffffff; }
.pc-tm-archive__header--branded .pc-tm-archive__intro,
.pc-tm-archive__header--branded .pc-tm-archive__intro p,
.pc-tm-archive__header--branded .pc-tm-archive__lede { color: rgba(255, 255, 255, 0.88); }

/* ---- Rent model header --------------------------------------------------- */
/* Generic wrapper the rent renderer can add around its model header. */
.pc-rent-hero--branded {
  position: relative;
  padding: clamp(28px, 6vw, 64px) clamp(18px, 4vw, 40px);
  border-radius: 8px;
  overflow: hidden;
  background-color: #161616;
  background-image:
    linear-gradient(90deg, rgba(16, 16, 18, 0.90) 0%, rgba(16, 16, 18, 0.58) 46%, rgba(16, 16, 18, 0.06) 80%),
    var(--pc-brand-hero, none);
  background-size: cover, cover;
  background-position: center, right center;
  background-repeat: no-repeat, no-repeat;
}
.pc-rent-hero--branded :is(h1, h2) { color: #ffffff; }
.pc-rent-hero--branded p { color: rgba(255, 255, 255, 0.88); }