/* ===================================
   Responsive Media Queries
   =================================== */

/* Tablet Styles (768px - 1023px) */
@media (max-width: 1023px) {
  /* Challenge Section */
  .challenge__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Footer */
  .footer__container {
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-lg);
  }

  .footer__brand {
    grid-column: 1 / -1;
    max-width: 100%;
    margin-bottom: var(--spacing-md);
  }
}

/* Mobile Styles (< 768px) */
@media (max-width: 767px) {
  /* Base adjustments */
  :root {
    --container-padding: 16px;
    --spacing-3xl: 48px;
    --spacing-2xl: 40px;
  }

  /* Header */
  .header {
    padding: 12px 0;
  }

  .header__container {
    flex-wrap: wrap;
  }

  .header__logo {
    font-size: 16px;
  }

  .header__logo-icon {
    width: 32px;
    height: 32px;
  }

  .header__nav {
    gap: var(--spacing-sm);
  }

  .header__nav-link {
    font-size: var(--font-size-small);
  }

  /* Hero Section */
  .hero {
    min-height: 500px;
    padding: var(--spacing-2xl) 0;
  }

  .hero__tag {
    font-size: 11px;
  }

  .hero__description {
    font-size: var(--font-size-body);
  }

  .hero__cta-group {
    flex-direction: column;
    width: 100%;
  }

  .hero__cta-group .btn {
    width: 100%;
    max-width: 300px;
  }

  /* Challenge Section */
  .challenge {
    padding: var(--spacing-2xl) 0;
  }

  .challenge__header {
    margin-bottom: var(--spacing-lg);
  }

  .challenge__subtitle {
    font-size: var(--font-size-body);
  }

  .challenge__grid {
    grid-template-columns: 1fr;
    gap: var(--spacing-sm);
  }

  .challenge__card {
    padding: var(--spacing-md);
  }

  .challenge__icon {
    width: 56px;
    height: 56px;
    font-size: 28px;
  }

  /* Stats Section */
  .stats {
    padding: var(--spacing-xl) 0;
  }

  .stats__container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-lg);
  }

  .stats__number {
    font-size: 36px;
  }

  .stats__label {
    font-size: 12px;
  }

  /* CTA Card */
  .cta-section {
    padding: var(--spacing-2xl) 0;
  }

  .cta-card {
    padding: var(--spacing-lg);
  }

  .cta-card__description {
    font-size: var(--font-size-body);
  }

  .cta-card__buttons {
    flex-direction: column;
    width: 100%;
  }

  .cta-card__buttons .btn {
    width: 100%;
  }

  /* Footer */
  .footer {
    padding: var(--spacing-xl) 0 var(--spacing-sm);
  }

  .footer__container {
    grid-template-columns: 1fr;
    gap: var(--spacing-lg);
  }

  .footer__brand {
    grid-column: 1;
    margin-bottom: 0;
  }

  .footer__bottom {
    font-size: 12px;
  }
}

/* Small Mobile (< 480px) */
@media (max-width: 479px) {
  .header__nav {
    display: none;
  }

  .header__container {
    justify-content: space-between;
  }

  .hero__headline {
    font-size: 28px;
  }

  .challenge__card-title {
    font-size: 18px;
  }

  .stats__number {
    font-size: 32px;
  }

  .cta-card__heading {
    font-size: 22px;
  }
}

/* Large Desktop (> 1280px) */
@media (min-width: 1280px) {
  .container {
    padding: 0 48px;
  }

  .challenge__grid {
    gap: var(--spacing-lg);
  }

  .challenge__card {
    padding: var(--spacing-xl);
  }
}
