.template-root[data-brand="conejo-valley-view"] {
  /* Live-oak olive. 600 is the link and title-rule colour on the cream; 700
     is the footer plate. */
  --brand-tokens-brand-50: #f3f5ea;
  --brand-tokens-brand-100: #e3e8cf;
  --brand-tokens-brand-200: #c7d1a5;
  --brand-tokens-brand-300: #a6b577;
  --brand-tokens-brand-400: #86974f;
  --brand-tokens-brand-500: #6c7c37;
  --brand-tokens-brand-600: #586a2b;
  --brand-tokens-brand-700: #465522;
  --brand-tokens-brand-800: #36421b;
  --brand-tokens-brand-900: #262f13;
  --brand-tokens-brand-950: #171d0b;
  /* Warm cream neutrals: the paper is oat, the ink is a brown-black. */
  --brand-tokens-greyscale-10: #fdfbf5;
  --brand-tokens-greyscale-50: #f7f3e8;
  --brand-tokens-greyscale-100: #ede8d9;
  --brand-tokens-greyscale-200: #d9d2bf;
  --brand-tokens-greyscale-300: #b5ac95;
  --brand-tokens-greyscale-400: #8c836d;
  --brand-tokens-greyscale-500: #625b4a;
  --brand-tokens-greyscale-600: #4f493b;
  --brand-tokens-greyscale-700: #3c372c;
  --brand-tokens-greyscale-800: #29251d;
  --brand-tokens-greyscale-900: #1b1812;
  --brand-tokens-greyscale-950: #100e0a;
  --brand-tokens-greyscale-1000: #080705;
  --brand-tokens-typography-body: "Source Serif 4";
  --brand-tokens-typography-labels: "Barlow Semi Condensed";
  --brand-tokens-typography-titles-a: "Gloock";
  --brand-tokens-typography-titles-b: "Gloock";
  --tint-light: #f4f0e3; /* sand, one step warmer than the paper */
  --accent-clay: #9a4a22; /* terracotta for kickers and labels, 5.9:1 on the paper */
  --accent-clay-rule: #c8703f; /* the same clay for rules, where 3:1 is the bar */
}

/* Link colour per painted surface: Container.css remaps the text tokens on a
   painted band but not the interactive ones. */
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-tint {
  --interactive-text-primary-idle: var(--brand-tokens-brand-600);
  --interactive-text-primary-hover: var(--brand-tokens-brand-700);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-800);
}
.template-root[data-brand="conejo-valley-view"] .block-container--bg-brand {
  --interactive-text-primary-idle: var(--brand-tokens-brand-100);
  --interactive-text-primary-hover: var(--brand-tokens-greyscale-10);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-200);
}
.template-root[data-brand="conejo-valley-view"] .block-container--bg-inverted {
  --interactive-text-primary-idle: var(--brand-tokens-brand-300);
  --interactive-text-primary-hover: var(--brand-tokens-brand-200);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-100);
  --text-default-4: var(--brand-tokens-brand-300);
}

/* Buttons. The fleet hover fill (brand-400) is too light under a white label
   on the page; on the plate the button flips to paper. */
.template-root[data-brand="conejo-valley-view"] {
  --interactive-contained-primary-hover: var(--brand-tokens-brand-700);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-800);
}
.template-root[data-brand="conejo-valley-view"] .block-container--bg-brand,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-inverted {
  --interactive-contained-primary-idle: var(--brand-tokens-greyscale-10);
  --interactive-contained-primary-hover: var(--brand-tokens-brand-100);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-200);
  --interactive-contained-primary-on-idle: var(--brand-tokens-brand-900);
}
.template-root[data-brand="conejo-valley-view"] .block-container--bg-brand .block-cta__input,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-inverted .block-cta__input {
  color: var(--brand-tokens-greyscale-900);
}

/* Header wash: olive with real weight, fading into the paper before the nav. */
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default:has(.block-header) {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-tokens-brand-300) 34%, transparent) 0%,
    color-mix(in srgb, var(--brand-tokens-brand-200) 18%, transparent) 55%,
    transparent 100%
  );
}

/* Footer plate: light type on a dark ground, so it darkens from below. */
.template-root[data-brand="conejo-valley-view"] .block-container--bg-brand {
  background-image: radial-gradient(
    130% 80% at 50% 125%,
    color-mix(in srgb, var(--brand-tokens-brand-950) 40%, transparent) 0%,
    transparent 72%
  );
}

/* The repeated mark: terracotta kickers, meta and the section-title top rule,
   plus the most-read strip's label. */
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default .card-section-label,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-tint .card-section-label,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default .article-kicker,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-tint .article-kicker,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-tint .block-quick-hits__label {
  color: var(--accent-clay);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default .block-section-title--v8,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-tint .block-section-title--v8 {
  border-top-color: var(--accent-clay-rule);
}
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default .block-cta__bar-title,
.template-root[data-brand="conejo-valley-view"] .block-container--bg-tint .block-cta__bar-title {
  border-left-color: var(--accent-clay-rule);
}
/* The signup bar under the lead: a hairline separates it from the story. */
.template-root[data-brand="conejo-valley-view"] .block-container--bg-default .block-cta__bar {
  border-top: 1px solid var(--elevation-outline-default-1);
  padding-top: var(--global-height-xxl, 24px);
}

/* Overlay forms set type on a photo; keep the fleet's light overlay ramp. */
.template-root[data-brand="conejo-valley-view"] .block-container .block-hero__overlay-kicker.card-section-label,
.template-root[data-brand="conejo-valley-view"] .block-container .block-hero__cover-kicker.card-section-label,
.template-root[data-brand="conejo-valley-view"] .block-container .block-feature-card__overlay-kicker.card-section-label,
.template-root[data-brand="conejo-valley-view"] .block-container .block-article-hero__overlay-kicker.article-kicker {
  color: var(--brand-tokens-greyscale-10);
}