/* =============================================================================
   Design Option 02 — Logo Blue Editorial
   -----------------------------------------------------------------------------
   Loaded AFTER /assets/css/output.css. Pure override layer:
   - shifts the accent token toward the logo blue (≈ #30649d)
   - deepens the footer "ground" to a navy
   - makes the sticky header read a touch more "hochwertig"
   - lifts the link/card/button/form accents to the new blue
   The existing warm editorial palette, type, layout, spacing all stay.
   No new structure, no new content, no JS, no external resources.
   ============================================================================= */

/* ----- 1. Token overrides --------------------------------------------------- */
:root {
  /* Logo blue (#30649d ≈ oklch(48.4% 0.094 256)) — pushed a hair to the right
     so it sits with authority next to the warm cream paper. */
  --color-accent: 47.5% 0.110 252;

  /* Footer ground: deeper navy, blue-leaning (was 20% 0.014 254). */
  --color-ground: 27% 0.070 252;
  --color-ground-line: 45% 0.075 252;

  /* Borders pick up a faint blue tint so the cool/warm contrast reads on purpose. */
  --color-border: 87% 0.018 250;
  --color-border-strong: 76% 0.024 250;

  /* Card shadow gets a hint of blue instead of pure neutral. */
  --shadow-card:
    0 1px 0 color-mix(in oklab, var(--accent) 5%, transparent),
    0 8px 24px -22px color-mix(in oklab, var(--accent) 28%, transparent);
}

/* ----- 2. Header — sticky, more present, blue baseline --------------------- */
.site-header {
  background:
    linear-gradient(
      180deg,
      color-mix(in oklab, var(--surface) 99%, var(--accent) 1%),
      color-mix(in oklab, var(--surface) 96%, var(--accent) 4%)
    );
  border-bottom: 1px solid color-mix(in oklab, var(--accent) 24%, var(--border));
  box-shadow:
    0 1px 0 color-mix(in oklab, var(--accent) 10%, transparent),
    0 6px 20px -18px color-mix(in oklab, var(--accent) 35%, transparent);
}

/* Subtle blue tint on logo hover well. */
.site-header__logo:hover,
.site-header__logo:focus-visible {
  background: color-mix(in oklab, var(--accent) 6%, var(--surface));
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--accent) 22%, var(--border));
}

/* Active nav item: pull the colour to blue (underline already uses --accent
   via the base CSS, so it follows the token shift automatically). */
.nav-link.is-active,
.nav-link.is-group-active {
  color: var(--accent);
}

/* Dropdown panel — keep paper bg, but active item reads in blue. */
.nav-dropdown-link.is-current {
  color: var(--accent);
}

/* ----- 3. Hero — warm cream with a confident blue marker ------------------- */
.home-hero,
.page-hero {
  background:
    linear-gradient(
      180deg,
      color-mix(in oklab, var(--surface) 97%, var(--accent) 3%),
      color-mix(in oklab, var(--surface) 93%, var(--bg))
    );
  border-bottom-color: color-mix(in oklab, var(--accent) 16%, var(--border));
}

/* brass-rule was a 1px brass mark in the hero — give it presence in blue. */
.brass-rule {
  height: 2px;
  width: 3rem;
  background: linear-gradient(
    90deg,
    var(--accent),
    color-mix(in oklab, var(--accent) 35%, transparent)
  );
}

/* page-hero figure picks up a soft blue inset frame. */
.page-hero__figure {
  border-color: color-mix(in oklab, var(--accent) 8%, var(--surface));
  box-shadow:
    0 0 0 1px color-mix(in oklab, var(--accent) 14%, transparent),
    var(--shadow-card);
}

/* ----- 4. Editorial details ------------------------------------------------- */
/* Eyebrow now reads blue, not brass — matches the new accent system. */
.eyebrow {
  color: var(--accent);
}

/* In-body links inherit --accent already; bump the underline a touch. */
.section-body a:not(.button-primary):not(.button-secondary):not(.button-quiet):not(.editorial-link):not(.link-card),
.text-link {
  text-decoration-color: color-mix(in oklab, var(--accent) 60%, transparent);
}

/* Link cards: blue meta with a subtle arrow + bluer hover state. */
.link-card__meta {
  color: var(--accent);
  letter-spacing: 0.02em;
}
.link-card__meta::after {
  content: " →";
  display: inline-block;
  transition: transform 0.18s ease;
}
.link-card:hover .link-card__meta::after,
.link-card:focus-visible .link-card__meta::after {
  transform: translateX(0.18rem);
}
.link-card:hover,
.link-card:focus-visible {
  border-color: color-mix(in oklab, var(--accent) 45%, var(--border));
  background: color-mix(in oklab, var(--accent) 4%, var(--surface));
  box-shadow:
    0 1px 0 color-mix(in oklab, var(--accent) 8%, transparent),
    0 10px 30px -22px color-mix(in oklab, var(--accent) 35%, transparent);
}

/* feature-list bullets: cool the brass bullet a hair toward blue-leaning brass. */
.feature-list li:before {
  background: color-mix(in oklab, var(--accent) 22%, var(--brass));
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 10%, transparent);
}

/* term-list pills: subtle blue left edge. */
.term-list li {
  border-color: color-mix(in oklab, var(--accent) 14%, var(--border));
}

/* ----- 5. Buttons & form ---------------------------------------------------- */
.button-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--surface);
}
.button-primary:hover,
.button-primary:focus-visible {
  background: oklch(40% 0.115 252);
  border-color: oklch(40% 0.115 252);
}

.button-secondary:hover,
.button-secondary:focus-visible {
  border-color: var(--accent);
  color: var(--accent);
}

/* Field focus rings already use --accent; deepen them slightly. */
.field-input:focus,
.field-textarea:focus {
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 26%, transparent);
}

/* Consent checkbox: filled state in brand blue instead of ink-black. */
.field-consent input[type="checkbox"]:checked {
  background: var(--accent);
  border-color: var(--accent);
}

/* ----- 6. Footer — navy, with a thin blue rule ----------------------------- */
.site-footer__divider {
  background: color-mix(in oklab, var(--accent) 28%, var(--ground-line));
}

/* Footer logo well: keep the warm paper background, but lift the inset. */
.footer-logo-wrap {
  background: color-mix(in oklab, var(--surface) 92%, var(--accent) 8%);
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--accent) 18%, transparent);
}

/* Client feedback 2026-05-23: lower footer row should read as a slightly lighter blue within Preview 2. */
.site-footer__bottom {
  background: transparent;
}

@media (max-width: 639px) {
  .site-footer__bottom {
    margin-inline: -0.75rem;
    padding: 0.85rem 0.75rem;
  }
}

/* Disable logo hover frame. */
.site-header__logo:hover {
  background: transparent;
  box-shadow: none;
}


/* Footer logo size override. */
.site-footer .footer-logo-wrap img {
  height: 3.75rem;
  width: auto;
}

@media (max-width: 639px) {
  .site-footer .footer-logo-wrap img {
    height: 3rem;
  }
}