/* ==========================================================================
   CTA banner — full-width call-to-action band (navy, restrained orange accent)
   Used near the foot of most pages to route to /inquire/ and the phone number.
   ========================================================================== */
.cta-banner {
  position: relative;
  isolation: isolate;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-navy-700) 100%);
  color: var(--color-text-on-dark);
  overflow: hidden;
}
/* A single thin orange rule along the top — the one sanctioned orange flourish. */
.cta-banner::before {
  content: '';
  position: absolute; inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--color-orange), #ffbf66);
}
/* Subtle decorative arc, very low opacity so text contrast is unaffected. */
.cta-banner::after {
  content: '';
  position: absolute; z-index: -1;
  right: -10%; top: -40%;
  width: 520px; height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgb(33 114 193 / 0.35), transparent 70%);
}

.cta-banner__inner {
  display: grid;
  gap: var(--space-4);
  align-items: center;
  padding-block: clamp(var(--space-6), 6vw, var(--space-10));
}
@media (min-width: 860px) {
  .cta-banner__inner { grid-template-columns: 1.5fr auto; }
}
.cta-banner h2 { color: #ffffff; font-size: var(--text-3xl); margin-bottom: var(--space-1); }
.cta-banner p { color: var(--color-text-on-dark); max-width: 52ch; }
.cta-banner__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }

/* Compact inline CTA (used inside article flow) */
.cta-inline {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-accent);
  border-radius: var(--radius-lg);
}
.cta-inline h3 { font-size: var(--text-xl); margin-bottom: 0.25rem; }
.cta-inline p { font-size: var(--text-sm); color: var(--color-text-muted); margin: 0; }
