.template-root[data-brand="bethany-beacon"] {
  --brand-tokens-brand-50: #f1f7f9;
  --brand-tokens-brand-100: #e2eff3;
  --brand-tokens-brand-200: #c7dee6;
  --brand-tokens-brand-300: #95c1d0;
  --brand-tokens-brand-400: #58a2bb;
  --brand-tokens-brand-500: #3c839a;
  --brand-tokens-brand-600: #2f6b7f;
  --brand-tokens-brand-700: #225262;
  --brand-tokens-brand-800: #19404d;
  --brand-tokens-brand-900: #12303a;
  --brand-tokens-brand-950: #0b1d23;

  --brand-tokens-greyscale-10: #fcfdfd;
  --brand-tokens-greyscale-50: #f6f8f9;
  --brand-tokens-greyscale-100: #ebeeef;
  --brand-tokens-greyscale-200: #d7dddf;
  --brand-tokens-greyscale-300: #b0babf;
  --brand-tokens-greyscale-400: #8a979e;
  --brand-tokens-greyscale-500: #5a676d;
  --brand-tokens-greyscale-600: #465258;
  --brand-tokens-greyscale-700: #364045;
  --brand-tokens-greyscale-800: #262d31;
  --brand-tokens-greyscale-900: #181d20;
  --brand-tokens-greyscale-950: #0f1315;
  --brand-tokens-greyscale-1000: #080b0c;

  --brand-tokens-typography-body: "Source Serif 4";
  --brand-tokens-typography-labels: "Source Serif 4";
  --brand-tokens-typography-titles-a: "Elms Sans";
  --brand-tokens-typography-titles-b: "Elms Sans";

  --tint-light: #e9eff1;
}

.template-root[data-brand="bethany-beacon"] .block-section-title {
  letter-spacing: 0.02em;
}

/* Light and painted surfaces need opposite interactive accent steps. */
.template-root[data-brand="bethany-beacon"] .block-container--bg-default,
.template-root[data-brand="bethany-beacon"] .block-container--bg-tint {
  --interactive-text-primary-idle: var(--brand-tokens-brand-700);
  --interactive-text-primary-hover: var(--brand-tokens-brand-800);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-700);
}

.template-root[data-brand="bethany-beacon"] .block-container--bg-default .card-section-label,
.template-root[data-brand="bethany-beacon"] .block-container--bg-tint .card-section-label,
.template-root[data-brand="bethany-beacon"] .block-container--bg-default .article-kicker,
.template-root[data-brand="bethany-beacon"] .block-container--bg-tint .article-kicker {
  color: var(--brand-tokens-brand-700);
}

.template-root[data-brand="bethany-beacon"] .block-container--bg-default .block-section-title__bar,
.template-root[data-brand="bethany-beacon"] .block-container--bg-tint .block-section-title__bar {
  background-color: var(--brand-tokens-brand-600);
}

.template-root[data-brand="bethany-beacon"]
  .block-container--bg-inverted
  .block-menubar__link[aria-current="page"],
.template-root[data-brand="bethany-beacon"]
  .block-container--bg-inverted
  .block-menubar__link[aria-current="page"]:hover {
  color: var(--brand-tokens-brand-200);
}

.template-root[data-brand="bethany-beacon"]
  .block-container--bg-inverted:not(:has(.block-menubar)) {
  background-image: radial-gradient(
    132% 76% at 50% 124%,
    color-mix(in srgb, var(--brand-tokens-brand-900) 24%, transparent) 0%,
    transparent 74%
  );
}

/* Scope the header wash because this recipe uses other tint Containers. */
.template-root[data-brand="bethany-beacon"] .block-container--bg-tint:has(.block-header) {
  background-image:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--brand-tokens-brand-500) 18%, transparent) 0%,
      color-mix(in srgb, var(--brand-tokens-brand-500) 8%, transparent) 72%,
      transparent 100%
    ),
    radial-gradient(
      56% 86% at 88% 6%,
      color-mix(in srgb, var(--brand-tokens-greyscale-10) 64%, transparent) 0%,
      transparent 60%
    );
}

.template-root[data-brand="bethany-beacon"] .block-container--bg-inverted:has(.block-menubar) {
  --elevation-fill-inverted-1: var(--brand-tokens-brand-900);

  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-tokens-brand-700) 24%, transparent) 0%,
    transparent 78%
  );
}