:root {
  --color-primary: #d71920;
  --color-primary-dark: #a90f16;
  --color-accent: #ffd500;
  --color-accent-soft: #fff4b8;
  --color-cream: #fff9e6;
  --color-charcoal: #211f1f;
  --color-ink: #2b2020;
  --color-warm-line: #ead99d;
  --ink: var(--color-ink);
  --ink-soft: #5f5148;
  --teal: #8a3324;
  --teal-bright: #d71920;
  --mist: #fff7df;
  --line: #ead99d;
  --dark: #241815;
  --shell-red: var(--color-primary);
  --shell-red-dark: var(--color-primary-dark);
  --orange: #f5a400;
  --orange-dark: #b35d00;
}

body {
  background:
    linear-gradient(180deg, var(--color-cream) 0, #fff 520px),
    #fff;
}

.brand__shell-logo,
.hero__shell-logo-wrap img,
.shell-band img {
  object-fit: contain;
}

.brand__shell-logo {
  width: auto;
  max-width: 56px;
  height: 48px;
}

.site-header {
  border-bottom-color: rgba(215, 25, 32, 0.18);
  background: rgba(255, 252, 239, 0.97);
}

.topline {
  background: var(--color-charcoal);
}

.topline__inner {
  color: var(--color-accent);
}

.topline a {
  color: #fff;
}

.desktop-nav a:after {
  height: 3px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
}

.hero__shade {
  background:
    linear-gradient(90deg, rgba(36, 24, 21, 0.96), rgba(62, 30, 24, 0.82) 42%, rgba(215, 25, 32, 0.18) 72%, rgba(255, 213, 0, 0.10)),
    linear-gradient(0deg, rgba(36, 24, 21, 0.56), transparent 48%);
}

.hero h1 {
  color: #fff8df;
}

.hero__lead,
.hero__trust {
  color: #f7eac7;
}

.hero__shell-logo-wrap {
  background: #fff;
  border: 2px solid var(--color-accent);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.hero__shell-logo-wrap img {
  width: 42px;
  height: 42px;
}

.shell-band img {
  width: 64px;
  height: 64px;
}

.button,
.mobile-nav__portal {
  border-color: var(--color-primary);
  background: linear-gradient(180deg, #e3272f, var(--color-primary));
  color: #fff;
  box-shadow: 0 12px 26px rgba(215, 25, 32, 0.24);
}

.button:hover,
.mobile-nav__portal:hover {
  border-color: var(--color-primary-dark);
  background: var(--color-primary-dark);
}

.button--secondary,
.button--light {
  border-color: var(--color-accent);
  background: var(--color-accent);
  color: #1d1d1b;
  box-shadow: 0 12px 26px rgba(255, 213, 0, 0.22);
}

.button--secondary:hover,
.button--light:hover {
  border-color: #f2bf00;
  background: #f2bf00;
  color: #1d1d1b;
}

.eyebrow,
.text-link,
.desktop-nav a.active,
.desktop-nav a:hover,
.footer__links a:hover,
.footer__email:hover {
  color: var(--color-primary);
}

.section--mist {
  background:
    linear-gradient(180deg, #fff8df, #fff2c2);
}

.section--dark,
.cta-band {
  background:
    linear-gradient(135deg, #241815 0%, #3a1918 52%, #5a171b 100%);
}

.signal-band,
.shell-band {
  border-top-color: rgba(251, 206, 7, 0.45);
  border-bottom-color: rgba(221, 29, 33, 0.18);
}

.signal-band {
  background: #fffdf4;
}

.signal-item {
  background: linear-gradient(180deg, #fff, #fff8df);
}

.signal-item:first-child,
.signal-item {
  border-color: rgba(234, 217, 157, 0.9);
}

.shell-band {
  background:
    linear-gradient(90deg, var(--color-primary) 0 58%, #f2a900 58% 100%);
}

.shell-band__copy span {
  color: #fff8df;
}

.media-frame:after {
  background: linear-gradient(90deg, var(--color-primary) 0 50%, var(--color-accent) 50%);
}

.process-step {
  background: rgba(255, 255, 255, 0.38);
}

.process-step__number,
.signal-item svg,
.benefit-card svg,
.form__note svg {
  color: var(--color-primary);
}

.benefit-card {
  border-color: rgba(255, 213, 0, 0.18);
  background: rgba(255, 255, 255, 0.055);
}

.video-band__copy,
.article-cta {
  background:
    linear-gradient(135deg, var(--color-primary), #8f1518 58%, var(--color-charcoal));
}

.application-form,
.application-form--compact,
.side-panel,
.blog-card,
.empty-state {
  border-color: rgba(234, 217, 157, 0.95);
  background: #fffdf4;
}

.form__grid input:focus,
.form__grid select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(215, 25, 32, 0.16);
}

.site-footer {
  background: #1d1514;
}

.footer__bottom {
  border-top-color: rgba(255, 213, 0, 0.18);
}

.page-hero__shade {
  background:
    linear-gradient(90deg, rgba(36, 24, 21, 0.94), rgba(85, 28, 24, 0.72) 56%, rgba(255, 213, 0, 0.16));
}