/* ===================================
   RESPONSIVE STYLES
   =================================== */

/* === EXTRA SMALL (xs) - < 480px === */
@media (max-width: 479px) {
  :root {
    --text-4xl: 2.8rem;
    --text-3xl: 2.4rem;
    --text-2xl: 2.0rem;
  }

  section {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .hero {
    padding: var(--space-8) var(--outer-gutter);
    min-height: auto;
  }

  .hero__headline {
    font-size: var(--text-3xl);
    margin-bottom: var(--space-3);
  }

  .hero__subheadline {
    font-size: var(--text-sm);
    margin-bottom: var(--space-4);
  }

  .hero__cover-img {
    max-width: 380px;
  }

  .offer {
    padding: var(--space-8) var(--outer-gutter);
  }

  .offer__card-inner {
    padding: var(--space-5) var(--space-4);
  }

  .offer__headline {
    font-size: var(--text-xl);
  }

  .offer__price-value {
    font-size: var(--text-3xl);
  }

  .final-cta__guarantee {
    padding: var(--space-3) var(--space-4);
    gap: var(--space-2);
  }

  .hero__cta .btn {
    width: 100%;
  }

  .hero__scroll-indicator {
    display: none;
  }

  .features__grid {
    grid-template-columns: 1fr;
  }

  .carousel__nav {
    width: 3.6rem;
    height: 3.6rem;
  }

  .stat-bar__grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .stat-bar__number {
    font-size: var(--text-3xl);
  }

  .accordion__header {
    padding: var(--space-3);
  }

  .accordion__body {
    padding: 0 var(--space-3) var(--space-3);
  }

  .sticky-cta {
    display: block;
  }
}

/* === MOBILE - 480px to 767px === */
@media (min-width: 480px) and (max-width: 767px) {
  :root {
    --text-4xl: 3.4rem;
    --text-3xl: 2.8rem;
  }

  .hero {
    padding: var(--space-10) var(--outer-gutter);
    min-height: auto;
  }

  .hero__headline {
    font-size: var(--text-3xl);
  }

  .hero__subheadline {
    font-size: var(--text-base);
  }

  .hero__cover-img {
    max-width: 280px;
  }

  .hero__cta .btn {
    width: 100%;
    white-space: normal;
  }

  .features__grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .stat-bar__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
  }

  .stat-bar__number {
    font-size: var(--text-3xl);
  }
}

/* === TABLET - 768px to 1023px === */
@media (min-width: 768px) and (max-width: 1023px) {
  :root {
    --text-4xl: 4.2rem;
    --text-3xl: 3.4rem;
  }

  .features__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
  }

  .feature-card {
    padding: var(--space-4);
  }

  .testimonials__carousel {
    max-width: 560px;
  }

  .stat-bar__grid {
    gap: var(--space-6);
  }

  .hero {
    padding: var(--space-12) var(--outer-gutter);
  }
}

/* === DESKTOP - 1024px to 1439px === */
@media (min-width: 1024px) and (max-width: 1439px) {
  .container {
    padding-left: var(--outer-gutter-md);
    padding-right: var(--outer-gutter-md);
  }

  .hero {
    padding: var(--space-16) var(--outer-gutter-md);
  }
}

/* === EXTRA LARGE (xl) - 1440px+ === */
@media (min-width: 1440px) {
  .container {
    padding-left: var(--outer-gutter-lg);
    padding-right: var(--outer-gutter-lg);
  }

  .hero {
    padding: var(--space-16) var(--outer-gutter-lg);
  }

  .features__grid {
    max-width: 1200px;
  }

  .testimonials__grid {
    max-width: 1200px;
  }
}

/* === MOBILE STICKY CTA === */
@media (max-width: 767px) {
  .sticky-cta {
    display: block;
  }

  .final-cta__actions .btn {
    width: 100%;
  }
}

/* === MOBILE BUTTONS FULL WIDTH === */
@media (max-width: 479px) {
  .btn {
    width: 100%;
    justify-content: center;
    white-space: normal;
    padding: 1.6rem 2.4rem;
  }

  .hero__cta .btn,
  .final-cta__actions .btn {
    width: 100%;
  }
}

/* === MOBILE-SMALL BUTTONS WRAP === */
@media (max-width: 600px) {
  .btn--xl {
    padding: 1.8rem 3rem;
    font-size: var(--text-base);
  }
}

/* === TABLET AND UP - HIDE STICKY CTA === */
@media (min-width: 768px) {
  .sticky-cta {
    display: none;
  }
}

/* === REDUCED MOTION === */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .hero__scroll-indicator {
    animation: none;
  }
}

/* === HIGH CONTRAST MODE === */
@media (prefers-contrast: high) {
  :root {
    --color-text: rgba(0, 0, 0, 1);
    --color-text-soft: rgba(0, 0, 0, 0.7);
    --border-color: rgba(0, 0, 0, 0.3);
  }

  .btn {
    border-width: 3px;
  }
}

/* === PRINT STYLES === */
@media print {
  .hero,
  .sticky-cta,
  .footer {
    display: none;
  }

  body {
    background-color: white;
    color: black;
  }

  .card,
  .feature-card,
  .testimonial-card,
  .accordion__item {
    box-shadow: none;
    border: 1px solid #ccc;
  }

  .feature-card__badge {
    display: none;
  }

  .btn {
    border: 2px solid currentColor;
  }
}