.template-root[data-brand="sandy-herald"] {
  --brand-tokens-brand-50: #fdf1e7;
  --brand-tokens-brand-100: #fbdfc9;
  --brand-tokens-brand-200: #f5bd93;
  --brand-tokens-brand-300: #e58d4e;
  --brand-tokens-brand-400: #c96a1a;
  --brand-tokens-brand-500: #a34c0a;
  --brand-tokens-brand-600: #893806;
  --brand-tokens-brand-700: #6f2d05;
  --brand-tokens-brand-800: #582304;
  --brand-tokens-brand-900: #3f1903;
  --brand-tokens-brand-950: #280f02;
  --brand-tokens-greyscale-10: #f7f8f8;
  --brand-tokens-greyscale-50: #eff1f1;
  --brand-tokens-greyscale-100: #e3e5e6;
  --brand-tokens-greyscale-200: #cbcecf;
  --brand-tokens-greyscale-300: #a7abad;
  --brand-tokens-greyscale-400: #7e8385;
  --brand-tokens-greyscale-500: #585d5f;
  --brand-tokens-greyscale-600: #464b4c;
  --brand-tokens-greyscale-700: #353839;
  --brand-tokens-greyscale-800: #252728;
  --brand-tokens-greyscale-900: #1c1a18;
  --brand-tokens-greyscale-950: #121110;
  --brand-tokens-greyscale-1000: #090808;
  --brand-tokens-typography-body: "Lora";
  --brand-tokens-typography-labels: "Elms Sans";
  --brand-tokens-typography-titles-a: "Stack Sans Headline";
  --brand-tokens-typography-titles-b: "Stack Sans Headline";
  --tint-light: #e9ebec;
}

.template-root[data-brand="sandy-herald"] .block-container--bg-default,
.template-root[data-brand="sandy-herald"] .block-container--bg-tint {
  --interactive-text-primary-hover: var(--brand-tokens-brand-800);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-900);
  --interactive-contained-primary-hover: var(--brand-tokens-brand-800);
  --interactive-contained-primary-pressed: var(--brand-tokens-brand-900);
}

.template-root[data-brand="sandy-herald"] .block-container--bg-brand {
  --interactive-text-primary-idle: var(--brand-tokens-brand-200);
  --interactive-text-primary-hover: var(--brand-tokens-brand-100);
  --interactive-text-primary-pressed: var(--brand-tokens-brand-50);

  --text-inverted-3: var(--brand-tokens-greyscale-200);
  --text-inverted-4: var(--brand-tokens-brand-200);

  --hairline-color: color-mix(in srgb, var(--brand-tokens-greyscale-10) 22%, transparent);
}

.template-root[data-brand="sandy-herald"] .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);
}

.template-root[data-brand="sandy-herald"] .block-container--bg-brand {
  background-image: linear-gradient(
    180deg,
    transparent 0%,
    color-mix(in srgb, var(--brand-tokens-brand-950) 24%, transparent) 100%
  );
}

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

.template-root[data-brand="sandy-herald"] .block-container--bg-brand .block-cta__button,
.template-root[data-brand="sandy-herald"] .block-container--bg-brand .block-header__subscribe-btn {
  background: var(--brand-tokens-greyscale-10);
  background-color: var(--brand-tokens-greyscale-10);
  border-color: var(--brand-tokens-greyscale-10);
  color: var(--brand-tokens-greyscale-900);
}

.template-root[data-brand="sandy-herald"] .block-container--bg-brand .block-cta__button:hover,
.template-root[data-brand="sandy-herald"]
  .block-container--bg-brand
  .block-header__subscribe-btn:hover {
  background: var(--brand-tokens-brand-100);
  background-color: var(--brand-tokens-brand-100);
  border-color: var(--brand-tokens-brand-100);
  color: var(--brand-tokens-greyscale-900);
  opacity: 1;
}

.template-root[data-brand="sandy-herald"] .block-container--bg-brand .block-section-title__square {
  background-color: var(--brand-tokens-brand-200);
}

.template-root[data-brand="sandy-herald"] .block-section-title--v7,
.template-root[data-brand="sandy-herald"]
  .block-subcategory-section-title--v2
  .block-subcategory-section-title__row {
  border-bottom-color: var(--brand-tokens-brand-600);
}

.template-root[data-brand="sandy-herald"] .block-container--bg-brand .block-section-title--v7 {
  border-bottom-color: color-mix(in srgb, var(--brand-tokens-greyscale-10) 30%, transparent);
}
