.template-root[data-brand="the-san-mateo-record"] {
  --brand-tokens-brand-50: #f6f8f2;
  --brand-tokens-brand-100: #edf1e4;
  --brand-tokens-brand-200: #dbe2ca;
  --brand-tokens-brand-300: #bbc89d;
  --brand-tokens-brand-400: #97ab69;
  --brand-tokens-brand-500: #6d8042;
  --brand-tokens-brand-600: #515e31;
  --brand-tokens-brand-700: #404b25;
  --brand-tokens-brand-800: #313a1d;
  --brand-tokens-brand-900: #252c17;
  --brand-tokens-brand-950: #1a1e10;

  --brand-tokens-greyscale-10: #f8f7f4;
  --brand-tokens-greyscale-50: #f2f1ec;
  --brand-tokens-greyscale-100: #e8e6e0;
  --brand-tokens-greyscale-200: #d6d3cb;
  --brand-tokens-greyscale-300: #b5b1a7;
  --brand-tokens-greyscale-400: #918d83;
  --brand-tokens-greyscale-500: #6a665e;
  --brand-tokens-greyscale-600: #54514a;
  --brand-tokens-greyscale-700: #403d38;
  --brand-tokens-greyscale-800: #2c2a26;
  --brand-tokens-greyscale-900: #1a1917;
  --brand-tokens-greyscale-950: #111110;
  --brand-tokens-greyscale-1000: #080807;
  --brand-tokens-typography-body: "Manrope";
  --brand-tokens-typography-labels: "Manrope";
  --brand-tokens-typography-titles-a: "Lora";
  --brand-tokens-typography-titles-b: "Lora";

  --tint-light: #eceade;
}

.template-root[data-brand="the-san-mateo-record"] .block-container--bg-default,
.template-root[data-brand="the-san-mateo-record"] .block-container--bg-tint {
  --interactive-text-primary-hover: var(--brand-tokens-brand-700);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-800);

  --interactive-contained-primary-hover: var(--brand-tokens-brand-700);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-800);
  /* Feeds the section-title bar and the hero's dark forecast chip; brand-700
     carries white text at about 9:1. */
  --elevation-fill-default-4: var(--brand-tokens-brand-700);
}

.template-root[data-brand="the-san-mateo-record"] .block-container--bg-brand {
  --interactive-text-primary-idle: var(--brand-tokens-brand-100);
  --interactive-text-primary-hover: var(--brand-tokens-brand-200);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-300);
}

/* ---- Sand chrome ------------------------------------------------------ */

/* A warmer wash at the top of the masthead band, fading into the plain tint
   the nav sits on, so the band reads as nameplate stock rather than a flat fill. */
.template-root[data-brand="the-san-mateo-record"] .block-container--bg-tint:has(.block-header) {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-tokens-brand-300) 26%, transparent) 0%,
    transparent 70%
  );
}
.template-root[data-brand="the-san-mateo-record"] .block-container--bg-tint:has(.block-footer) {
  border-top: 1px solid var(--brand-tokens-brand-200);
}

/* ---- Type voice ------------------------------------------------------- */

.template-root[data-brand="the-san-mateo-record"] .block-header__masthead {
  letter-spacing: -0.01em;
}
.template-root[data-brand="the-san-mateo-record"] .card-section-label,
.template-root[data-brand="the-san-mateo-record"] .article-kicker {
  font-weight: 700;
  letter-spacing: 0.08em;
}
.template-root[data-brand="the-san-mateo-record"]
  .block-container--bg-default
  .block-section-title--v5,
.template-root[data-brand="the-san-mateo-record"]
  .block-container--bg-tint
  .block-section-title--v5 {
  border-bottom-color: var(--brand-tokens-brand-200);
}

/* ---- Newsletter band -------------------------------------------------- */

/* Use a fixed gradient stop so a tall brand band is not shaded end to end. */
.template-root[data-brand="the-san-mateo-record"] .block-container--bg-brand {
  background-image: linear-gradient(
    to top,
    color-mix(in srgb, var(--brand-tokens-brand-950) 34%, transparent) 0,
    transparent 300px
  );
}

/* A paper-white button on the olive band; the default black one is too heavy. */
.template-root[data-brand="the-san-mateo-record"] .block-container--bg-brand .block-cta__button {
  background: var(--brand-tokens-greyscale-10);
  border-color: var(--brand-tokens-greyscale-10);
  color: var(--brand-tokens-brand-900);
}
.template-root[data-brand="the-san-mateo-record"]
  .block-container--bg-brand
  .block-cta__button:hover {
  background: var(--brand-tokens-brand-100);
  border-color: var(--brand-tokens-brand-100);
  opacity: 1;
}

/* Painted containers otherwise render typed input text on the field's light fill. */
.template-root[data-brand="the-san-mateo-record"] .block-container--bg-brand .block-cta__input {
  color: var(--brand-tokens-greyscale-900);
}
