/* ============================================================
   Regulations zone treatment
   ------------------------------------------------------------
   DESIGN.md zone spec (line 104): Regulations = warm-charcoal→navy
   hero (#1A1207 → #0F172A) with a gold accent glow (#E5A835).

   The earlier light-gold wash clashed with the navy dark sections
   (a bright gold band directly above a navy CTA). This restores the
   documented DARK hero: the hero itself is charcoal→navy, so it
   harmonises with the navy CTA / navbar / footer, and gold lives in
   the accents (overline, glow, top border) rather than the surface.

   Also: a COMPACT hero heading. Regulation pages are informational
   compliance pages — the default 72px display hero is too large, so
   the zone uses a restrained heading size.

   Loaded only on regulations pages from BaseLayout.
   ============================================================ */

/* ---- Dark hero surface (overrides the base light-split wash) ----
   The base rule `section.qh-hero.is-split:not(.is-dark-section):not(.is-dark)`
   sets the light wash with !important, so match/exceed its specificity here
   (attribute + 2 classes + 2 :not = 5 classes vs its 4) and win on source
   order (this file loads after qh-combined.css). */
[data-zone="regulations"] section.qh-hero.is-split:not(.is-dark-section):not(.is-dark) {
  /* Gold accent glow over a warm-charcoal→navy gradient */
  background-image:
    radial-gradient(60% 80% at 78% 18%, rgba(229, 168, 53, 0.18), transparent 60%),
    linear-gradient(158deg, #1A1207 0%, #14161F 42%, #0F172A 100%) !important;
  background-color: #0F172A !important;
}
[data-zone="regulations"] .qh-hero.is-split {
  /* Gold gradient top border (DESIGN.md: "gold gradient top border") */
  border-top: 3px solid transparent;
  border-image: linear-gradient(90deg, #E5A835 0%, #F5D77E 50%, #E5A835 100%) 1;
}

/* The base `.qh-hero::after` is a WHITE diagonal wedge that blends a light hero
   into a white section below. Our hero is dark and is followed by a navy dark
   CTA, so that white triangle looks like a stray artifact between two dark
   bands. Hide it — the dark hero meets the navy CTA on a clean edge. */
[data-zone="regulations"] .qh-hero.is-split::after {
  display: none !important;
}

/* ---- Compact hero heading for the regulations zone ---- */
[data-zone="regulations"] .qh-hero .qh-display-1,
[data-zone="regulations"] .qh-hero .qh-display-2,
[data-zone="regulations"] .qh-hero h1 {
  font-size: clamp(30px, 2vw + 12px, 46px) !important;
  line-height: 1.1 !important;
}

/* ---- Hero text: light on the dark surface ---- */
[data-zone="regulations"] .qh-hero.is-split .qh-display-1,
[data-zone="regulations"] .qh-hero.is-split .qh-display-2,
[data-zone="regulations"] .qh-hero.is-split h1,
[data-zone="regulations"] .qh-hero.is-split h2 {
  color: #ffffff !important;
}
[data-zone="regulations"] .qh-hero.is-split .qh-body-lg,
[data-zone="regulations"] .qh-hero.is-split .qh-body,
[data-zone="regulations"] .qh-hero.is-split p:not(.qh-overline) {
  color: rgba(255, 255, 255, 0.72) !important;
}
/* Gold overline — lighter gold reads better on the dark surface */
[data-zone="regulations"] .qh-hero.is-split .qh-overline {
  color: var(--qh-warm-light, #F5D77E) !important;
}
[data-zone="regulations"] .qh-hero.is-split .qh-breadcrumb__link {
  color: rgba(255, 255, 255, 0.55) !important;
}
[data-zone="regulations"] .qh-hero.is-split .qh-breadcrumb__link:hover {
  color: rgba(255, 255, 255, 0.85) !important;
}
[data-zone="regulations"] .qh-hero.is-split .qh-breadcrumb__item.is-current {
  color: rgba(255, 255, 255, 0.4) !important;
}
[data-zone="regulations"] .qh-hero.is-split .qh-breadcrumb__separator {
  color: rgba(255, 255, 255, 0.3) !important;
}

/* Secondary (ghost) hero CTA: white outline on the dark hero */
[data-zone="regulations"] .qh-hero.is-split .qh-btn.is-ghost,
[data-zone="regulations"] .qh-hero.is-split .qh-btn.is-secondary {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
  background: transparent !important;
}
[data-zone="regulations"] .qh-hero.is-split .qh-btn.is-ghost:hover,
[data-zone="regulations"] .qh-hero.is-split .qh-btn.is-secondary:hover {
  border-color: var(--qh-warm-light, #F5D77E) !important;
  color: var(--qh-warm-light, #F5D77E) !important;
}

/* ---- Section eyebrows carry the gold identity across the page ---- */
[data-zone="regulations"] .qh-overline {
  color: var(--qh-warm-hover, #C78F2A) !important;
}
/* Lighter gold on dark sections (dark CTAs) for legibility */
[data-zone="regulations"] .is-dark-section .qh-overline,
[data-zone="regulations"] .qh-cta-section .qh-overline,
[data-zone="regulations"] .qh-hero.is-split .qh-overline {
  color: var(--qh-warm-light, #F5D77E) !important;
}

/* Gold section-nav active state */
[data-zone="regulations"] .qh-section-nav__link.is-active {
  color: var(--qh-warm-hover, #C78F2A);
  border-bottom-color: var(--qh-warm, #E5A835);
}