/* ============================================================
   SearchTires.com mockup extras — DARK MODE
   Matches the homepage hero treatment: dark slate body with the
   orange grid texture, dark slate cards on top.
   Reuses --st-orange, --st-dark, --st-font, --st-font-cond
   from site.css.
   ============================================================ */

:root {
  --st-card:        #1e293b;   /* slate-800 — card surface on dark body */
  --st-card-2:      #273449;   /* slate-700-ish — hover / tint */
  --st-card-border: #334155;   /* slate-700 — borders */
  --st-text-light:  #e2e8f0;   /* slate-200 — body text on dark */
  --st-text-mid:    #94a3b8;   /* slate-400 — muted text */
  --st-text-faint:  #64748b;   /* slate-500 — even fainter */
}

/* ── Body surface: dark slate with the orange grid texture
      (matches the homepage hero .st-hero::before pattern) ──── */
body {
  background-color: var(--st-dark) !important;
  background-image:
    linear-gradient(rgba(255,105,15,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,105,15,.05) 1px, transparent 1px);
  background-size: 40px 40px;
  background-attachment: fixed;
}

/* Force main transparent so the gridded body shows through */
main { background: transparent !important; }

/* Eliminate the bottom border on the hero — content area continues
   the same dark surface */
.st-legal-hero { border-bottom: none; }

/* ── Body content area (wider than legal-body 820px cap) ──── */
.st-page-body {
  padding: 3rem 0 4rem;
  color: var(--st-text-light);
}
.st-page-body p.lead {
  font-size: 1.15rem;
  line-height: 1.6;
  color: var(--st-text-light);
  max-width: 720px;
  margin-bottom: 1.5rem;
}
.st-page-body p { color: var(--st-text-light); line-height: 1.7; }
.st-page-body strong { color: #fff; font-weight: 700; }
.st-page-body a:not(.btn):not([class*="st-"]) {
  color: var(--st-orange);
  text-decoration: none;
  font-weight: 600;
}
.st-page-body a:not(.btn):not([class*="st-"]):hover { text-decoration: underline; }

/* When the prose legal-body is used in a mockup with dark body, give it
   the dark-card treatment too (Privacy uses this; it stays readable) */
.dark-page .st-legal-body {
  background: var(--st-card);
  border-radius: var(--st-radius);
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  padding: clamp(2rem, 4vw, 3rem);
  color: var(--st-text-light);
  margin-top: -1rem;
  max-width: 880px;
}
.dark-page .st-legal-body p { color: var(--st-text-light); }
.dark-page .st-legal-body strong { color: #fff; }
.dark-page .st-legal-body h3 {
  color: #fff;
  border-top-color: var(--st-card-border);
}
.dark-page .st-legal-body h3:first-of-type { border-top: none; }
.dark-page .st-legal-body a {
  color: var(--st-orange);
}
.dark-page .st-legal-address {
  background: rgba(0,0,0,.25);
  border-color: var(--st-card-border);
  color: var(--st-text-mid);
}
.dark-page .st-legal-address strong { color: #fff; }

/* ── Section headers (on dark bg) ──────────────────────────── */
.st-section-eyebrow {
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--st-orange);
  margin-bottom: .5rem;
  display: block;
}
.st-section-title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: #fff;
  letter-spacing: -.01em;
  line-height: 1.1;
  margin: 2.5rem 0 1rem;
}

/* ── Stat strip (About) ─────────────────────────────────────── */
.st-stats {
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  margin: 2.5rem 0 3rem;
}
.st-stats__item {
  padding: 1.5rem 1.25rem;
  text-align: left;
  border-right: 1px solid var(--st-card-border);
}
.st-stats__item:last-child { border-right: none; }
.st-stats__num {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  line-height: 1;
  color: var(--st-orange);
  letter-spacing: -.01em;
}
.st-stats__label {
  margin-top: .5rem;
  font-size: .82rem;
  color: var(--st-text-mid);
  line-height: 1.45;
}
@media (max-width: 768px) {
  .st-stats { grid-template-columns: repeat(2, 1fr); }
  .st-stats__item:nth-child(2) { border-right: none; }
  .st-stats__item:nth-child(1),
  .st-stats__item:nth-child(2) { border-bottom: 1px solid var(--st-card-border); }
}

/* ── Belief cards (About) ───────────────────────────────────── */
.st-belief {
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  padding: 1.75rem;
  height: 100%;
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.st-belief:hover {
  transform: translateY(-3px);
  border-color: var(--st-orange);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
}
.st-belief__num {
  display: inline-block;
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.1rem;
  color: var(--st-orange);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .75rem;
}
.st-belief__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.35rem;
  color: #fff;
  letter-spacing: -.01em;
  line-height: 1.15;
  margin: 0 0 .75rem;
}
.st-belief__body {
  font-size: .95rem;
  line-height: 1.6;
  color: var(--st-text-mid);
  margin: 0;
}
.st-belief__body strong { color: var(--st-text-light); }

/* ── TMI B2B callout (already dark, light touch-up for grid bg) ── */
.st-tmi {
  background: linear-gradient(135deg, #0c1424 0%, #1a2540 100%);
  border: 1px solid var(--st-card-border);
  color: #fff;
  border-radius: var(--st-radius);
  padding: 2.5rem 2rem;
  margin: 3rem 0;
  position: relative;
  overflow: hidden;
}
.st-tmi::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,105,15,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,105,15,.08) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
}
.st-tmi > * { position: relative; }
.st-tmi__eyebrow {
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--st-orange);
  margin-bottom: .5rem;
  display: block;
}
.st-tmi__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  line-height: 1.15;
  margin: 0 0 1rem;
}
.st-tmi__body {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--st-text-mid);
  margin: 0 0 1rem;
}
.st-tmi__list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.st-tmi__list li {
  padding: .65rem 0 .65rem 1.5rem;
  position: relative;
  font-size: .95rem;
  color: var(--st-text-light);
  border-top: 1px solid var(--st-card-border);
}
.st-tmi__list li:first-child { border-top: none; }
.st-tmi__list li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--st-orange);
  font-weight: 700;
}

/* ── Team grid (About) ──────────────────────────────────────── */
.st-team__card {
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  padding: 1rem;
  height: 100%;
  transition: transform .2s, border-color .2s;
}
.st-team__card:hover {
  transform: translateY(-3px);
  border-color: var(--st-orange);
}
.st-team__photo {
  aspect-ratio: 1 / 1;
  width: 100%;
  background: var(--st-dark);
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 1rem;
}
.st-team__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.st-team__card:hover .st-team__photo img { transform: scale(1.04); }
.st-team__name {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.25rem;
  color: #fff;
  letter-spacing: -.01em;
  margin: 0 0 .15rem;
}
.st-team__role {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--st-orange);
  margin-bottom: .5rem;
}
.st-team__bio {
  font-size: .88rem;
  line-height: 1.55;
  color: var(--st-text-mid);
  margin: 0;
}

/* ── FAQ category cards (FAQ landing grid) ──────────────────── */
.st-faq-cat {
  display: block;
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  padding: 1.5rem;
  text-decoration: none;
  color: #fff;
  transition: transform .2s, border-color .2s, box-shadow .2s;
  height: 100%;
}
.st-faq-cat:hover {
  transform: translateY(-3px);
  border-color: var(--st-orange);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
  color: #fff;
  text-decoration: none;
}
.st-faq-cat__num {
  display: block;
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: .85rem;
  color: var(--st-orange);
  letter-spacing: .1em;
  margin-bottom: .35rem;
}
.st-faq-cat__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.15rem;
  letter-spacing: -.01em;
  line-height: 1.2;
  margin: 0 0 .35rem;
  color: #fff;
}
.st-faq-cat__count {
  font-size: .72rem;
  color: var(--st-text-mid);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.st-faq-cat--max {
  background: linear-gradient(135deg, #1e293b 0%, #2a2017 100%);
  border-color: rgba(255,105,15,.35);
}

/* ── FAQ Q&A accordion (native <details>) ───────────────────── */
.st-faq-section {
  margin-top: 3rem;
  scroll-margin-top: 80px;
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  padding: 2rem clamp(1.25rem, 3vw, 2.25rem);
}
.st-faq-section__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.65rem;
  color: #fff;
  letter-spacing: -.01em;
  margin: 0 0 .5rem;
  padding-bottom: .65rem;
  border-bottom: 2px solid var(--st-orange);
}
.st-faq-section__eyebrow {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--st-orange);
  display: block;
  margin-bottom: .35rem;
}

details.st-faq-q {
  border-bottom: 1px solid var(--st-card-border);
  padding: 1.1rem 0;
}
details.st-faq-q:last-of-type { border-bottom: none; }
details.st-faq-q summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  font-weight: 600;
  font-size: 1rem;
  color: #fff;
  padding-right: 1rem;
  transition: color .15s;
}
details.st-faq-q summary::-webkit-details-marker { display: none; }
details.st-faq-q summary::before {
  content: '+';
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--st-orange);
  line-height: 1;
}
details.st-faq-q[open] summary::before { content: '−'; }
details.st-faq-q summary:hover { color: var(--st-orange); }
.st-faq-a {
  padding: .75rem 0 0 2.5rem;
  color: var(--st-text-mid);
  font-size: .98rem;
  line-height: 1.65;
}
.st-faq-a strong { color: var(--st-text-light); }
.st-faq-a a {
  color: var(--st-orange);
  font-weight: 600;
  text-decoration: none;
}
.st-faq-a a:hover { text-decoration: underline; }
.st-faq-a table {
  width: 100%;
  margin-top: .75rem;
  border-collapse: collapse;
  font-size: .92rem;
}
.st-faq-a th,
.st-faq-a td {
  text-align: left;
  padding: .65rem .75rem;
  border-bottom: 1px solid var(--st-card-border);
  vertical-align: top;
  color: var(--st-text-light);
}
.st-faq-a th {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--st-orange);
  border-bottom: 2px solid var(--st-orange);
  font-weight: 700;
}

.st-faq-section--max {
  background: linear-gradient(135deg, #1e293b 0%, #2a2017 100%);
  border-color: rgba(255,105,15,.35);
}
.st-faq-section--max .st-faq-section__title {
  border-bottom-color: var(--st-orange);
}

/* ── Contact pathways ───────────────────────────────────────── */
.st-pathway {
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  padding: 1.75rem;
  text-decoration: none;
  color: #fff;
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.st-pathway:hover {
  transform: translateY(-3px);
  border-color: var(--st-orange);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
  color: #fff;
  text-decoration: none;
}
.st-pathway__num {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: .85rem;
  color: var(--st-orange);
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: .65rem;
}
.st-pathway__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.3rem;
  color: #fff;
  line-height: 1.15;
  letter-spacing: -.01em;
  margin: 0 0 .75rem;
}
.st-pathway__desc {
  font-size: .95rem;
  line-height: 1.55;
  color: var(--st-text-mid);
  margin: 0 0 1.25rem;
}
.st-pathway__cta {
  margin-top: auto;
  font-size: .82rem;
  font-weight: 700;
  color: var(--st-orange);
  letter-spacing: .02em;
}
.st-pathway__cta .arrow {
  display: inline-block;
  transition: transform .2s;
  margin-left: .35rem;
}
.st-pathway:hover .st-pathway__cta .arrow { transform: translateX(3px); }

/* ── Contact form card — mirrors the homepage .st-search-bar exactly ── */
.st-contact-card {
  /* Container styled like the live homepage tire-search bar */
  background: var(--st-dark-2);
  border: 1px solid var(--st-dark-3);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,.35);
  overflow: hidden;
  margin: 0 auto;
  max-width: 880px;
}
.st-contact-card__head {
  padding: 1.4rem 1.75rem 1rem;
  border-bottom: 1px solid var(--st-dark-3);
}
.st-contact-card__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.4rem;
  color: #fff;
  margin: 0 0 .35rem;
  letter-spacing: -.01em;
}
.st-contact-card__sub {
  font-size: .88rem;
  color: rgba(255,255,255,.6);
  margin: 0;
  line-height: 1.5;
}
.st-contact-card__sub strong { color: #fff; font-weight: 700; }
.st-contact-card__sub .st-pill {
  display: inline-flex;
  align-items: center;
  background: rgba(255,105,15,.12);
  color: var(--st-orange);
  font-weight: 700;
  font-size: .72rem;
  padding: .1rem .5rem;
  border-radius: 4px;
  letter-spacing: .03em;
  margin: 0 .15rem;
}
.st-contact-card__body { padding: 1.75rem; }

/* Form labels (uppercase, muted — matches site language) */
.st-form .form-label {
  font-size: .72rem;
  font-weight: 700;
  color: rgba(255,255,255,.55);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: .4rem;
}
.st-form .form-label .opt {
  color: rgba(255,255,255,.35);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
}

/* Inputs + selects + textareas — match .st-picker-btn / .st-search-bar__zip */
.st-form .form-control,
.st-form .form-select {
  background: var(--st-dark-3);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  color: rgba(255,255,255,.9);
  font-family: var(--st-font);
  font-size: .92rem;
  font-weight: 500;
  padding: .65rem .9rem;
  min-height: 44px;
  transition: border-color .15s, box-shadow .15s;
}
.st-form .form-control::placeholder { color: rgba(255,255,255,.35); }
.st-form .form-control:focus,
.st-form .form-select:focus {
  background: var(--st-dark-3);
  border-color: var(--st-orange);
  color: #fff;
  box-shadow: 0 0 0 3px rgba(255,105,15,.18);
  outline: none;
}
.st-form textarea.form-control {
  min-height: 110px;
  resize: vertical;
  font-family: var(--st-font);
}

/* Native select arrow color */
.st-form .form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ff690f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right .9rem center;
  background-size: 14px 12px;
  padding-right: 2.5rem;
  cursor: pointer;
}
.st-form .form-select option,
.st-form .form-select optgroup {
  background: var(--st-dark-2);
  color: #fff;
}
.st-form .form-select optgroup { font-weight: 700; color: var(--st-orange); }

/* Autofill kill (same as homepage zip input) */
.st-form .form-control:-webkit-autofill,
.st-form .form-control:-webkit-autofill:hover,
.st-form .form-control:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--st-dark-3) inset;
  -webkit-text-fill-color: rgba(255,255,255,.9);
  caret-color: rgba(255,255,255,.9);
}

/* Submit button — dynamic, branded with SearchTires T-shield mark */
.st-form-submit {
  background: var(--st-orange);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 0;
  font-weight: 800;
  font-family: var(--st-font);
  font-size: 1.02rem;
  letter-spacing: .04em;
  cursor: pointer;
  display: inline-flex;
  align-items: stretch;
  overflow: hidden;
  text-transform: uppercase;
  box-shadow: 0 6px 18px rgba(255,105,15,.32), inset 0 1px 0 rgba(255,255,255,.18);
  transition: background .18s, box-shadow .18s, transform .18s;
  position: relative;
}
.st-form-submit:hover {
  background: var(--st-orange-dark);
  box-shadow: 0 8px 24px rgba(255,105,15,.5), inset 0 1px 0 rgba(255,255,255,.22);
  transform: translateY(-1px);
}
.st-form-submit:active { transform: translateY(0); }
/* Brand container — fixed width clipping window. The full logo.svg is loaded but
   object-fit:cover + object-position:left shows only the leftmost portion (the
   T-shield). Uses the original asset directly — no raster crop, no manipulation. */
.st-form-submit__brand {
  display: flex;
  align-items: stretch;
  width: 56px;
  padding: 0;
  background: rgba(0,0,0,.18);
  border-right: 1px solid rgba(255,255,255,.18);
  overflow: hidden;
  flex-shrink: 0;
}
.st-form-submit__logo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
  display: block;
}
.st-form-submit__body {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .9rem 1.5rem;
}
.st-form-submit__body i { font-size: .92rem; opacity: .9; }
.st-form-submit__arrow {
  display: inline-block;
  transition: transform .2s;
  font-weight: 900;
}
.st-form-submit:hover .st-form-submit__arrow { transform: translateX(3px); }

/* ── Footer Quick Links — 2-column, tight spacing ── */
.st-footer-quicklinks {
  display: grid;
  grid-template-rows: repeat(3, auto);
  grid-template-columns: 1fr 1fr;
  grid-auto-flow: column;
  gap: 0 1.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.st-footer-quicklinks li { line-height: 1.25; }
.st-footer-quicklinks a {
  display: inline-block;
  position: relative;
  color: rgba(255,255,255,.72);
  text-decoration: none;
  font-size: .85rem;
  font-weight: 500;
  letter-spacing: .01em;
  padding: 0;
  margin: 0;
  line-height: 1.7;
  transition: color .15s, padding-left .2s;
}
.st-footer-quicklinks a::before {
  content: "›";
  position: absolute;
  left: -.85rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--st-orange);
  font-weight: 800;
  opacity: 0;
  transition: opacity .2s, left .2s;
  font-size: 1.1em;
}
.st-footer-quicklinks a:hover {
  color: var(--st-orange);
  padding-left: 1rem;
}
.st-footer-quicklinks a:hover::before {
  opacity: 1;
  left: 0;
}

.st-form__footer {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--st-dark-3);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.st-form__fineprint {
  font-size: .76rem;
  color: rgba(255,255,255,.4);
}
.st-form__fineprint a {
  color: var(--st-orange);
  font-weight: 600;
  text-decoration: none;
}
.st-form__fineprint a:hover { text-decoration: underline; }

/* ── Validation states ────────────────────────────────────── */
/* Field-level: red border + tinted background + small error icon */
.st-form .form-control.is-invalid,
.st-form .form-select.is-invalid {
  border-color: #ef4444 !important;
  background-color: rgba(239,68,68,.08) !important;
}
.st-form .form-control.is-invalid:focus,
.st-form .form-select.is-invalid:focus {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,.22) !important;
}
/* Keep the existing form-select dropdown caret (orange) even when invalid */
.st-form .form-select.is-invalid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ef4444' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

/* Inline message under each field */
.st-form__field-error {
  color: #fca5a5;
  font-size: .82rem;
  font-weight: 500;
  margin-top: .35rem;
}
.st-form__field-error:empty { display: none; }

/* Top-of-form alert summary */
.st-form__alert {
  background: rgba(220,38,38,.12);
  border: 1px solid rgba(220,38,38,.45);
  color: #fecaca;
  border-radius: 10px;
  padding: .9rem 1rem;
  margin-bottom: 1.25rem;
  font-size: .92rem;
  line-height: 1.5;
}
.st-form__alert strong { color: #fff; }
.st-form__alert ul { color: #fecaca; margin-bottom: 0; }
.st-form__alert li { margin: .15rem 0; }

/* ── CTA strip — full-orange action band ───────────────────── */
.st-cta-strip {
  background: linear-gradient(135deg, var(--st-orange) 0%, var(--st-orange-dark) 100%);
  border: 1px solid var(--st-orange-dark);
  color: #fff;
  border-radius: var(--st-radius);
  padding: 2.25rem 2.25rem;
  margin: 3rem 0 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 32px rgba(255,105,15,.25);
}
.st-cta-strip::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
}
.st-cta-strip > * { position: relative; z-index: 1; }
.st-cta-strip__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: clamp(1.4rem, 2.6vw, 1.85rem);
  line-height: 1.15;
  margin: 0;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: .01em;
}
.st-cta-strip__sub {
  font-size: .95rem;
  color: rgba(255,255,255,.85);
  margin: .35rem 0 0;
}
/* Primary CTA on orange band: white bg, dark text */
.st-cta-strip .btn.st-btn-primary,
.st-cta-strip .btn.btn-light,
.st-cta-strip .btn-on-orange {
  background: #fff;
  border-color: #fff;
  color: var(--st-dark);
  font-weight: 700;
}
.st-cta-strip .btn.st-btn-primary:hover,
.st-cta-strip .btn.btn-light:hover,
.st-cta-strip .btn-on-orange:hover {
  background: var(--st-dark);
  border-color: var(--st-dark);
  color: #fff;
}
/* Secondary CTA on orange band: outlined white */
.st-cta-strip .btn.btn-outline-light {
  border-color: rgba(255,255,255,.7);
  color: #fff;
}
.st-cta-strip .btn.btn-outline-light:hover {
  background: rgba(255,255,255,.15);
  border-color: #fff;
  color: #fff;
}

/* ── Contact-page filler blocks (replaces address card) ───── */
.st-info-block {
  background: var(--st-card);
  border: 1px solid var(--st-card-border);
  border-radius: var(--st-radius);
  padding: 1.5rem;
  transition: border-color .2s, transform .2s;
}
.st-info-block + .st-info-block { margin-top: 1rem; }
.st-info-block:hover {
  border-color: var(--st-orange);
  transform: translateY(-2px);
}
.st-info-block__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: rgba(255,105,15,.15);
  color: var(--st-orange);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  margin-bottom: .75rem;
}
.st-info-block__title {
  font-family: var(--st-font-cond);
  font-weight: 900;
  font-size: 1.15rem;
  color: #fff;
  letter-spacing: -.01em;
  line-height: 1.2;
  margin: 0 0 .5rem;
}
.st-info-block__body {
  font-size: .9rem;
  line-height: 1.55;
  color: var(--st-text-mid);
  margin: 0;
}
.st-info-block__body a {
  color: var(--st-orange);
  font-weight: 600;
  text-decoration: none;
}
.st-info-block__body a:hover { text-decoration: underline; }
.st-info-block__links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.st-info-block__links li {
  border-top: 1px solid var(--st-card-border);
  padding: .65rem 0;
}
.st-info-block__links li:first-child { border-top: none; padding-top: 0; }
.st-info-block__links li:last-child { padding-bottom: 0; }
.st-info-block__links a {
  color: var(--st-text-light);
  text-decoration: none;
  font-size: .92rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 500;
}
.st-info-block__links a:hover { color: var(--st-orange); }
.st-info-block__links a::after {
  content: '→';
  color: var(--st-orange);
  margin-left: .5rem;
  transition: transform .2s;
  display: inline-block;
}
.st-info-block__links a:hover::after { transform: translateX(3px); }