.template-root[data-brand="franklin-beacon"] {
  --brand-tokens-brand-50: #fbeeeb;
  --brand-tokens-brand-100: #f6d9d3;
  --brand-tokens-brand-200: #e9b1a6;
  --brand-tokens-brand-300: #d78474;
  --brand-tokens-brand-400: #c05745;
  --brand-tokens-brand-500: #a53627;
  --brand-tokens-brand-600: #8d2313;
  --brand-tokens-brand-700: #741a0d;
  --brand-tokens-brand-800: #5a1309;
  --brand-tokens-brand-900: #3f0d06;
  --brand-tokens-brand-950: #280704;
  --brand-tokens-greyscale-10: #fdfcfa;
  --brand-tokens-greyscale-50: #f5f3ee;
  --brand-tokens-greyscale-100: #e9e6df;
  --brand-tokens-greyscale-200: #d6d1c7;
  --brand-tokens-greyscale-300: #b2aca0;
  --brand-tokens-greyscale-400: #8a8477;
  --brand-tokens-greyscale-500: #635d52;
  --brand-tokens-greyscale-600: #4f4a40;
  --brand-tokens-greyscale-700: #3b372f;
  --brand-tokens-greyscale-800: #29261f;
  --brand-tokens-greyscale-900: #191712;
  --brand-tokens-greyscale-950: #100e0b;
  --brand-tokens-greyscale-1000: #080705;
  --brand-tokens-typography-body: "Source Serif 4";
  --brand-tokens-typography-labels: "DM Mono";
  --brand-tokens-typography-titles-a: "Instrument Serif";
  --brand-tokens-typography-titles-b: "Host Grotesk";
  --tint-light: #f4ebe6; /* limestone with a brick cast, one step off the paper */
  --accent-marquee: #8f5407; /* theatre-marquee amber, 5.96:1 paper / 5.20:1 tint */
  --accent-marquee-lit: #f0c877; /* the same amber lit, for the brick plates */
}

/* Link colour per painted surface: Container.css remaps the text tokens on a
   painted band but not the interactive ones. */
.template-root[data-brand="franklin-beacon"] .block-container--bg-default,
.template-root[data-brand="franklin-beacon"] .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="franklin-beacon"] .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="franklin-beacon"] .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 brick plates the button flips to paper. */
.template-root[data-brand="franklin-beacon"] {
  --interactive-contained-primary-hover: var(--brand-tokens-brand-700);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-800);
}
.template-root[data-brand="franklin-beacon"] .block-container--bg-brand,
.template-root[data-brand="franklin-beacon"] .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="franklin-beacon"] .block-container--bg-brand .block-cta__input,
.template-root[data-brand="franklin-beacon"] .block-container--bg-inverted .block-cta__input {
  color: var(--brand-tokens-greyscale-900);
}

.template-root[data-brand="franklin-beacon"] .block-container--bg-brand {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--accent-marquee-lit) 14%, transparent) 0%,
    transparent 46%
  );
}

.template-root[data-brand="franklin-beacon"] .block-container--bg-default .block-section-title--v1,
.template-root[data-brand="franklin-beacon"] .block-container--bg-tint .block-section-title--v1 {
  border-bottom-color: transparent;
  background-image: radial-gradient(
    circle at center,
    var(--accent-marquee) 0 1.5px,
    transparent 1.6px
  );
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: 10px 3px;
}
.template-root[data-brand="franklin-beacon"] .block-container--bg-brand .block-section-title--v1 {
  border-bottom-color: transparent;
  background-image: radial-gradient(
    circle at center,
    var(--accent-marquee-lit) 0 1.5px,
    transparent 1.6px
  );
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: 10px 3px;
}
.template-root[data-brand="franklin-beacon"] .block-container--bg-default .block-cta__bar-title,
.template-root[data-brand="franklin-beacon"] .block-container--bg-tint .block-cta__bar-title {
  border-left-color: var(--accent-marquee);
}

.template-root[data-brand="franklin-beacon"] .block-container--bg-default .card-section-label,
.template-root[data-brand="franklin-beacon"] .block-container--bg-tint .card-section-label,
.template-root[data-brand="franklin-beacon"] .block-container--bg-default .article-kicker,
.template-root[data-brand="franklin-beacon"] .block-container--bg-tint .article-kicker {
  color: var(--accent-marquee);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.template-root[data-brand="franklin-beacon"] .block-container--bg-brand .card-section-label,
.template-root[data-brand="franklin-beacon"] .block-container--bg-brand .article-kicker {
  color: var(--accent-marquee-lit);
}

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

.template-root[data-brand="franklin-beacon"] .block-header__masthead,
.template-root[data-brand="franklin-beacon"] .block-section-title__heading,
.template-root[data-brand="franklin-beacon"] .block-feature-card__title {
  letter-spacing: -0.015em;
  line-height: 1.08;
}