/* ============================================================
   CTA Nuclear Gold — Task #1308925
   MUST load LAST. Nuclear override for all primary CTAs.

   Defines .sr-cta-primary (gold gradient) and .sr-cta-secondary
   as the canonical button classes going forward.

   Primary CTA spec:
     - Gold gradient: #f59e0b → #d97706
     - Height: 52px desktop, 48px mobile
     - Padding: 0 32px
     - Border-radius: 12px
     - Font: 16px/600
     - Shadow: 0 4px 14px rgba(245,158,11,0.3)
     - Hover: translateY(-1px) + shadow boost

   Secondary CTA spec:
     - Transparent bg, 2px solid #f59e0b border
     - Color: #d97706
     - Same dimensions as primary

   GA4 tracking: cta_click event with location + label
   ============================================================ */

/* ── PRIMARY CTA: Gold Gradient ─────────────────────────── */
.sr-cta-primary,
a.sr-cta-primary,
button.sr-cta-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  height: 52px !important;
  padding: 0 32px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.3) !important;
  transition: transform 150ms ease, box-shadow 150ms ease !important;
  white-space: nowrap !important;
  -webkit-appearance: none !important;
}

.sr-cta-primary:hover,
a.sr-cta-primary:hover,
button.sr-cta-primary:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #b45309 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4) !important;
  text-decoration: none !important;
}

.sr-cta-primary:active,
a.sr-cta-primary:active,
button.sr-cta-primary:active {
  transform: scale(0.98) translateY(0) !important;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3) !important;
}

/* ── SECONDARY CTA: Gold Outline ────────────────────────── */
.sr-cta-secondary,
a.sr-cta-secondary,
button.sr-cta-secondary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  background: transparent !important;
  color: #d97706 !important;
  -webkit-text-fill-color: #d97706 !important;
  height: 52px !important;
  padding: 0 32px !important;
  border-radius: 12px !important;
  border: 2px solid #f59e0b !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: border-color 150ms ease, color 150ms ease, transform 150ms ease !important;
  white-space: nowrap !important;
}

.sr-cta-secondary:hover,
a.sr-cta-secondary:hover,
button.sr-cta-secondary:hover {
  background: rgba(245, 158, 11, 0.06) !important;
  border-color: #d97706 !important;
  color: #b45309 !important;
  -webkit-text-fill-color: #b45309 !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
}

/* ── TERTIARY CTA: Understated text link ────────────────── */
.sr-cta-tertiary,
a.sr-cta-tertiary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #6b7280 !important;
  -webkit-text-fill-color: #6b7280 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 150ms ease !important;
}

.sr-cta-tertiary:hover,
a.sr-cta-tertiary:hover {
  color: #374151 !important;
  -webkit-text-fill-color: #374151 !important;
}

/* ── MOBILE: Min 48px height, full-width option ─────────── */
@media (max-width: 640px) {
  .sr-cta-primary,
  a.sr-cta-primary,
  button.sr-cta-primary,
  .sr-cta-secondary,
  a.sr-cta-secondary,
  button.sr-cta-secondary {
    height: 48px !important;
    font-size: 15px !important;
  }

  .sr-cta-primary--full,
  a.sr-cta-primary--full,
  .sr-cta-secondary--full,
  a.sr-cta-secondary--full {
    width: 100% !important;
    padding: 0 20px !important;
  }
}

/* ── REDUCED MOTION ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .sr-cta-primary,
  a.sr-cta-primary,
  button.sr-cta-primary,
  .sr-cta-secondary,
  a.sr-cta-secondary,
  button.sr-cta-secondary {
    transition: none !important;
  }

  .sr-cta-primary:hover,
  .sr-cta-secondary:hover {
    transform: none !important;
  }
}

/* ── LARGE VARIANT: XL hero CTAs ─────────────────────────── */
.sr-cta-primary--xl,
a.sr-cta-primary--xl {
  height: 56px !important;
  padding: 0 40px !important;
  font-size: 18px !important;
  border-radius: 14px !important;
}

/* ── SMALL VARIANT: compact CTAs ─────────────────────────── */
.sr-cta-primary--sm,
a.sr-cta-primary--sm {
  height: 40px !important;
  padding: 0 20px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
}

/* ── FOOTER CTAs: Override fp-cta-btn-primary with gold ───── */
/* Footer primary CTAs should use gold to drive conversion */
.sr-footer-cta-gold,
a.sr-footer-cta-gold {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  height: 52px !important;
  padding: 0 32px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.3) !important;
  transition: transform 150ms ease, box-shadow 150ms ease !important;
}

.sr-footer-cta-gold:hover,
a.sr-footer-cta-gold:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

/* ── SETTLEMENT DETAIL: Above-fold CTA strip gold treatment ─ */
/* above-fold-cta-btn gets gold gradient when no urgency class overrides it */
.above-fold-cta-btn:not(.cta-red):not(.cta-orange):not(.cta-pulse) {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.3) !important;
}

.above-fold-cta-btn:not(.cta-red):not(.cta-orange):not(.cta-pulse):hover {
  background: linear-gradient(135deg, #f59e0b 0%, #b45309 100%) !important;
  box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* ── HOMEPAGE STICKY CTA BAR: Gold gradient ─────────────── */
#sr-homepage-sticky-cta a {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.3) !important;
  border-radius: 12px !important;
}

#sr-homepage-sticky-cta a:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #b45309 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4) !important;
}

/* ── SETTLEMENTS DIRECTORY: dir-cta-primary gold treatment ─ */
.dir-cta-primary,
a.dir-cta-primary {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.3) !important;
  border: none !important;
}

.dir-cta-primary:hover,
a.dir-cta-primary:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #b45309 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4) !important;
}

/* ── BLOG/GUIDE INLINE CTA CARD ────────────────────────── */
.sr-inline-cta-card {
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border: 1px solid #fcd34d;
  border-radius: 12px;
  padding: 24px 28px;
  margin: 32px 0;
  text-align: center;
}

.sr-inline-cta-card__title {
  font-size: 18px;
  font-weight: 700;
  color: #1d1d1f;
  margin-bottom: 8px;
}

.sr-inline-cta-card__sub {
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 16px;
}
