.template-root[data-brand="potomac-beacon"] {
  --brand-tokens-brand-50: #fbf7ef;
  --brand-tokens-brand-100: #f6efdf;
  --brand-tokens-brand-200: #eddebf;
  --brand-tokens-brand-300: #dbbd80;
  --brand-tokens-brand-400: #cea450;
  --brand-tokens-brand-500: #c79738;
  --brand-tokens-brand-600: #b68b35;
  --brand-tokens-brand-700: #71551e;
  --brand-tokens-brand-800: #5a4316;
  --brand-tokens-brand-900: #423110;
  --brand-tokens-brand-950: #2a1f09;

  --brand-tokens-greyscale-10: #fcfdfd;
  --brand-tokens-greyscale-50: #f6f8f8;
  --brand-tokens-greyscale-100: #ebedef;
  --brand-tokens-greyscale-200: #d8dcdf;
  --brand-tokens-greyscale-300: #b1b9be;
  --brand-tokens-greyscale-400: #8b959c;
  --brand-tokens-greyscale-500: #5a656c;
  --brand-tokens-greyscale-600: #475057;
  --brand-tokens-greyscale-700: #363e44;
  --brand-tokens-greyscale-800: #262c31;
  --brand-tokens-greyscale-900: #181d20;
  --brand-tokens-greyscale-950: #0f1215;
  --brand-tokens-greyscale-1000: #080b0c;

  --brand-tokens-typography-body: "Host Grotesk";
  --brand-tokens-typography-labels: "Host Grotesk";
  --brand-tokens-typography-titles-a: "Source Serif 4";
  --brand-tokens-typography-titles-b: "Source Serif 4";
  --tint-light: #eceff1;
}

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

.template-root[data-brand="potomac-beacon"] .block-container--bg-default,
.template-root[data-brand="potomac-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="potomac-beacon"] .block-container--bg-default .card-section-label,
.template-root[data-brand="potomac-beacon"] .block-container--bg-tint .card-section-label,
.template-root[data-brand="potomac-beacon"] .block-container--bg-default .article-kicker,
.template-root[data-brand="potomac-beacon"] .block-container--bg-tint .article-kicker {
  color: var(--brand-tokens-brand-700);
}

.template-root[data-brand="potomac-beacon"] {
  --interactive-contained-primary-idle: var(--brand-tokens-brand-700);
  --interactive-contained-primary-hover: var(--brand-tokens-brand-800);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-900);
}

.template-root[data-brand="potomac-beacon"] .block-container--bg-brand:has(.block-header) {
  --interactive-outlined-primary-toggled-idle: var(--brand-tokens-brand-600);
  --text-default-1: var(--brand-tokens-greyscale-900);
  --text-default-2: var(--brand-tokens-greyscale-900);
  --text-default-3: var(--brand-tokens-greyscale-800);
  --text-default-4: var(--brand-tokens-greyscale-900);

  --interactive-contained-primary-idle: var(--brand-tokens-brand-900);
  --interactive-contained-primary-hover: var(--brand-tokens-brand-950);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-950);

  --interactive-text-primary-idle: var(--brand-tokens-brand-950);
  --interactive-text-primary-hover: var(--brand-tokens-brand-950);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-950);

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

.template-root[data-brand="potomac-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-400);
}
.template-root[data-brand="potomac-beacon"]
  .block-container--bg-inverted
  .block-menubar__link[aria-current="page"] {
  color: var(--brand-tokens-brand-300);
}

.template-root[data-brand="potomac-beacon"] .block-container--bg-inverted:has(.block-menubar) {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--brand-tokens-brand-700) 14%, transparent) 0%,
    transparent 76%
  );
}

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