/* ─── Brand tokens ───────────────────────────────────────────── */
:root {
  --brand-red:          #DC0D20;
  --brand-red-hover:    #b00a1a;
  --brand-red-cta:      #e63030;
  --brand-red-cta-hover:#c92020;
  --brand-navy:         #242c42;
  --brand-dark:         #17181c;
  --brand-blue:         #313c59;
}

html { font-size: 16px; }

/* ─── Testimonials ticker ─────────────────────────────────────── */
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.testimonials-ticker {
  mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
}

.testimonials-ticker-track {
  animation: ticker-scroll 50s linear infinite;
}

/* ─── Testimonials carousel (mobile) ──────────────────────────── */
.testimonials-carousel-track {
  touch-action: pan-y;
  will-change: transform;
  cursor: grab;
}
.testimonials-carousel-track.is-dragging {
  cursor: grabbing;
}
.testimonials-carousel-track.is-animating {
  transition: transform 400ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.testimonials-carousel-track .testimonial-slide {
  user-select: none;
  -webkit-user-select: none;
}
.testimonials-carousel-track .testimonial-slide * {
  pointer-events: none;
}

.testimonials-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  background: #ced4e4;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background-color 200ms, width 200ms;
}
.testimonials-carousel-dot.is-active {
  background: #dc0d20;
  width: 24px;
}

@media (prefers-reduced-motion: reduce) {
  .testimonials-carousel-track.is-animating { transition: none; }
  .testimonials-carousel-dot { transition: none; }
}

/* ─── Hero slideshow ─────────────────────────────────────────── */
@keyframes heroSlide1 {
  0%,25%    { opacity: 1; }
  33.333%   { opacity: 0; }
  91.667%   { opacity: 0; }
  100%      { opacity: 1; }
}
@keyframes heroSlide2 {
  0%,25%    { opacity: 0; }
  33.333%,58.333% { opacity: 1; }
  66.667%,100%    { opacity: 0; }
}
@keyframes heroSlide3 {
  0%,58.333% { opacity: 0; }
  66.667%,91.667% { opacity: 1; }
  100%        { opacity: 0; }
}
.hero-slide-1 { animation: heroSlide1 12s linear infinite; }
.hero-slide-2 { animation: heroSlide2 12s linear infinite; }
.hero-slide-3 { animation: heroSlide3 12s linear infinite; }

/* ─── Entrance animations ────────────────────────────────────── */
@keyframes fadeInUp    { from { opacity:0; transform:translateY(20px) }  to { opacity:1; transform:translateY(0) } }
@keyframes fadeInDown  { from { opacity:0; transform:translateY(-20px) } to { opacity:1; transform:translateY(0) } }
@keyframes fadeInLeft  { from { opacity:0; transform:translateX(40px) }  to { opacity:1; transform:translateX(0) } }
@keyframes fadeInRight { from { opacity:0; transform:translateX(-40px) } to { opacity:1; transform:translateX(0) } }
@keyframes fadeIn      { from { opacity:0 } to { opacity:1 } }
@keyframes spin        { to { transform:rotate(360deg) } }

.animate-fade-in-up    { animation: fadeInUp    0.5s ease-out both; }
.animate-fade-in-down  { animation: fadeInDown  0.5s ease-out both; }
.animate-fade-in-left  { animation: fadeInLeft  0.5s ease-out both; }
.animate-fade-in-right { animation: fadeInRight 0.5s ease-out both; }
.animate-fade-in       { animation: fadeIn      0.4s ease-out both; }
.animate-spin          { animation: spin 1s linear infinite; }

/* ─── Scroll-triggered animation system ─────────────────────── */
[data-animate] { opacity: 0; }

[data-animate="up"].is-visible    { animation: fadeInUp    0.5s ease-out both; opacity: 1; }
[data-animate="down"].is-visible  { animation: fadeInDown  0.5s ease-out both; opacity: 1; }
[data-animate="left"].is-visible  { animation: fadeInLeft  0.5s ease-out both; opacity: 1; }
[data-animate="right"].is-visible { animation: fadeInRight 0.5s ease-out both; opacity: 1; }
[data-animate="fade"].is-visible,
[data-animate].is-visible         { animation: fadeInUp    0.5s ease-out both; opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  [data-animate]           { opacity: 1 !important; animation: none !important; }
  .hero-slide-1, .hero-slide-2, .hero-slide-3 { animation: none !important; }
  .hero-slide-2, .hero-slide-3 { display: none; }
  .animate-fade-in-up, .animate-fade-in-down,
  .animate-fade-in-left, .animate-fade-in-right,
  .animate-fade-in        { animation: none !important; }
}

/* ─── Sticky nav ────────────────────────────────────────────── */
header {
  transition: background-color 300ms ease, box-shadow 300ms ease;
}
header.nav-scrolled {
  background-color: #ffffff;
  box-shadow: 0 2px 16px rgba(0,0,0,0.10);
}
header.nav-scrolled [data-nav-link] {
  color: #17181c !important;
}
#mobile-menu-btn { color: white; }
header.nav-scrolled #mobile-menu-btn { color: #17181c; }
#mobile-menu-btn.menu-is-open { color: white !important; }

@media (prefers-reduced-motion: reduce) {
  header { transition: none; }
}

/* ─── Nav CTA bell animation ─────────────────────────────────── */
@keyframes navCtaBell {
  0%,100% { transform: rotate(0) scale(1); }
  10%     { transform: rotate(-10deg) scale(1.06); }
  20%     { transform: rotate(10deg) scale(1.06); }
  30%     { transform: rotate(-7deg) scale(1.03); }
  40%     { transform: rotate(7deg) scale(1.03); }
  50%     { transform: rotate(-4deg); }
  60%     { transform: rotate(4deg); }
  70%     { transform: rotate(0); }
}
[data-nav-cta].nav-cta-ring {
  animation: navCtaBell 0.7s ease-in-out;
  transform-origin: top center;
}
@media (prefers-reduced-motion: reduce) {
  [data-nav-cta].nav-cta-ring { animation: none; }
}

/* ─── Mobile menu ────────────────────────────────────────────── */
.mobile-menu {
  transform: translateX(100%);
  transition: transform 300ms ease;
}
.mobile-menu.is-open { transform: translateX(0); }

@media (prefers-reduced-motion: reduce) {
  .mobile-menu { transition: none; }
}

/* ─── Accordion ──────────────────────────────────────────────── */
.accordion-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 300ms ease;
}
.accordion-body.is-open { grid-template-rows: 1fr; }
.accordion-inner        { overflow: hidden; }

.accordion-chevron              { transition: transform 300ms ease; color: #9CA8C9; }
.accordion-chevron.is-open      { transform: rotate(180deg); }
.accordion-card                 { border-color: #dee2ed; transition: border-color 200ms; }
.accordion-card.is-open         { border-color: #9ca8c9; }

@media (prefers-reduced-motion: reduce) {
  .accordion-body    { transition: none; }
  .accordion-chevron { transition: none; }
}

/* ─── Custom checkbox ────────────────────────────────────────── */
.custom-checkbox {
  appearance: none;
  -webkit-appearance: none;
  width: 24px; height: 24px;
  min-width: 24px;
  background: #f8f9fb;
  border: 1px solid #ced4e4;
  border-radius: 8px;
  cursor: pointer;
  position: relative;
  transition: background-color 200ms, border-color 200ms;
  margin-top: 2px;
}
.custom-checkbox:checked {
  background-color: #dc0d20;
  border-color: #dc0d20;
}
.custom-checkbox:checked::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 10px; height: 10px;
  background: white;
  border-radius: 3px;
}
.custom-checkbox.has-error { border-color: #dc0d20; }

/* ─── CTA button variants ────────────────────────────────────── */
.cta-primary {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 12px; padding: 15px 20px; border-radius: 8px;
  background: #DC0D20; color: white; font-weight: 700; font-size: 17px;
  letter-spacing: -0.05em; text-decoration: none; cursor: pointer;
  transition: background-color 300ms, transform 300ms;
  border: none;
}
.cta-primary:hover  { background: #A80010; }
.cta-primary:active { transform: scale(0.95); }
.cta-primary svg    { transition: transform 300ms; }
.cta-primary:hover svg { transform: scale(1.1); }

.cta-secondary {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 12px; padding: 15px 20px; border-radius: 8px;
  background: white; color: #242C42; font-weight: 700; font-size: 17px;
  letter-spacing: -0.05em; text-decoration: none; cursor: pointer;
  border: 1px solid rgba(36,44,66,0.2);
  transition: background-color 300ms, transform 300ms;
}
.cta-secondary:hover  { background: #f9fafb; }
.cta-secondary:active { transform: scale(0.95); }
.cta-secondary svg    { color: #DC0D20; transition: transform 300ms; }
.cta-secondary:hover svg { transform: translateX(4px); }

/* ─── Stat card hover ────────────────────────────────────────── */
.stat-card { transition: transform 300ms; }
.stat-card:hover { transform: translateY(-8px); }

/* ─── Form inputs ────────────────────────────────────────────── */
.form-input {
  width: 100%; background: #f8f9fb; border: 1px solid #ced4e4;
  border-radius: 8px; padding: 12px 16px;
  color: #242c42; font-size: 16px; line-height: 1.5;
  transition: border-color 200ms; outline: none;
}
.form-input::placeholder { color: rgba(36,44,66,0.6); }
.form-input:focus        { border-color: #9ca8c9; }
.form-input.has-error    { border-color: #dc0d20; }
.form-input:disabled     { opacity: 0.6; cursor: not-allowed; }

/* ─── Pricing discount pills ────────────────────────────────── */
/* font-black → Inter heavy weight (Futura not available on web) */
#pricing [aria-hidden="true"] span.font-black {
  font-family: 'Inter', 'Helvetica Neue', sans-serif;
  font-weight: 900;
  letter-spacing: -0.03em;
}

/* ─── Page transitions ───────────────────────────────────────── */
body {
  opacity: 0;
  transition: opacity 250ms ease;
}
body.page-visible { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  body { opacity: 1 !important; transition: none !important; }
}

/* ─── Wave helper ────────────────────────────────────────────── */
.wave-bottom {
  position: absolute; bottom: 0; left: 0; right: 0;
  transform: translateY(1px) rotate(180deg);
  line-height: 0;
}
.wave-top {
  position: absolute; top: 0; left: 0; right: 0;
  transform: translateY(-1px);
  line-height: 0;
}
.wave-bottom svg, .wave-top svg { display: block; width: 100%; height: auto; }

/* ─── Modal ──────────────────────────────────────────────────── */
.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 200;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; visibility: hidden;
  transition: opacity 200ms, visibility 200ms;
}
.modal-overlay.is-open { opacity: 1; visibility: visible; }
.modal-dialog {
  background: white; border-radius: 16px; padding: 24px;
  max-width: 420px; width: calc(100% - 48px);
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
  position: relative; z-index: 201;
}

/* ─── CVV help button ────────────────────────────────────────── */
.cvv-help-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; min-width: 18px;
  background: #dee2ed; color: #6c757d;
  border-radius: 50%; font-size: 11px; font-weight: 700;
  cursor: pointer; border: none;
  transition: background-color 200ms;
  vertical-align: middle;
}
.cvv-help-btn:hover { background: #ced4e4; }

/* ─── Honeypot anti-spam ──────────────────────────────────────── */
.partner-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; opacity: 0; }