/* =========================================================================
   DigiFlux — Responsive (Mobile-first → up)
   Breakpoints:  768px (tablet) • 1024px (desktop) • 1280px (large)
   ========================================================================= */

/* ============================== TABLET (≥ 768px) ============================== */
@media (min-width: 768px) {

  /* Header: show login buttons */
  .header-actions .btn-login {
    display: inline-flex;
  }

  /* Hero CTA inline */
  .hero-cta {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .hero-cta .btn { width: auto; }

  /* About: 2-column grid */
  .features-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }

  /* Stats: 4-up with vertical divider */
  .stats-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
  }
  .stat-item:not(:last-child) {
    border-right: 1px solid rgba(255, 255, 255, 0.10);
  }
  .stat-item { padding: 0.5rem 1rem; }

  /* Partners: 2 cols */
  .partners-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* CTA side-by-side */
  .cta-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  /* Footer */
  .footer-grid {
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 2rem;
  }

  /* .footer-bottom kept as column on all sizes (logo + disclaimer + copy stacked) */
}

/* ============================== DESKTOP (≥ 1024px) ============================== */
@media (min-width: 1024px) {

  /* Header */
  .main-nav { display: block; }
  .mobile-menu-toggle { display: none; }
  .mobile-panel { display: none; }

  /* Hero side-by-side */
  .hero {
    padding: 5.5rem 0 8rem;
  }
  .hero-inner {
    grid-template-columns: 1.35fr 1fr;
    gap: 4rem;
  }
  .hero-text h1 { font-size: clamp(2.5rem, 4.4vw, 3.5rem); }

  /* About: 4-column */
  .features-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
  }

  /* Stages: horizontal flow w/ arrows */
  .stages-flow {
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr auto 1fr;
    gap: 0.5rem;
    align-items: stretch;
  }
  .stage-arrow.arrow-mobile { display: none; }
  .stage-arrow.arrow-desktop {
    display: flex;
    color: var(--df-gray-200);
    opacity: 1;
  }

  /* Partners: 5-up */
  .partners-grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 1.25rem;
  }

  /* Hero wave taller */
  .hero-wave svg { height: 80px; }
}

/* Mobile-only arrows visible below desktop */
@media (max-width: 1023.98px) {
  .stage-arrow.arrow-desktop { display: none; }
  .stage-arrow.arrow-mobile  { display: flex; padding: 0.25rem 0; }
}

/* ============================== LARGE DESKTOP (≥ 1280px) ============================== */
@media (min-width: 1280px) {
  .hero { padding: 7rem 0 9rem; }
  .hero-visual { max-width: 480px; }
  .stage-badge { width: 72px; height: 72px; font-size: 1.4rem; }
}

/* ============================== Very small mobile ============================== */
@media (max-width: 380px) {
  .header-actions .lang-switcher { display: none; } /* Falls back to mobile-panel lang list */
  .logo img { height: 32px; }
}
