/* ==========================================================================
   theme-trust.css — "Trust" personality.
   Navy header with a hard red rule, call-first hierarchy, square-ish surfaces.
   Tokens live in tokens.css; this file only changes composition and emphasis.
   ========================================================================== */

.site-header {
  border-bottom: 3px solid var(--accent);
}

.site-nav a {
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hero {
  background: var(--gradient-hero);
}

.hero h1 {
  text-wrap: balance;
}

.hero-card {
  border-top: 4px solid var(--accent);
  border-radius: var(--radius);
}

.hero-card h2 {
  letter-spacing: 0.16em;
}

.btn {
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.card {
  border-radius: var(--radius);
}

.card h3 {
  font-size: 1rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.card-icon {
  border-radius: var(--radius);
}

.callband p {
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.step {
  border-radius: 0;
}

.quote {
  border-radius: var(--radius);
  border-left-width: 5px;
}

.section-head h2 {
  text-transform: uppercase;
  letter-spacing: 0.01em;
  /* The same red rule as the header, so a section heading reads as part of the
     same document instead of a floating label. */
  display: inline-block;
  padding-bottom: 0.3rem;
  border-bottom: 3px solid var(--accent);
}

/* In this style the tick marks are the "we checked it" signal, so they carry the
   safety colour rather than the house navy. */
.hero-points svg {
  color: var(--accent);
}

.footer-brand {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}