/* ==========================================================================
   CAMEEP — responsive.css
   Breakpoints: Desktop XL (1440+), Desktop/Laptop (1024-1439),
   Tablet (768-1023), Mobile (≤767), Mobile pequeño (≤380)
   ========================================================================== */

/* ---- Desktop grande: más aire ---------------------------------------------*/
@media (min-width: 1440px) {
  :root { --container-max: 1360px; }
  .hero h1 { max-width: 20ch; }
}

/* ---- Laptop / Desktop estándar --------------------------------------------*/
@media (max-width: 1180px) {
  .reason-grid { grid-template-columns: repeat(2, 1fr); }
  .values-grid { grid-template-columns: repeat(3, 1fr); }
  .stat-grid { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-md); }
  .stat-item:nth-child(3) { border-left: none; }
  .footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
  .footer-grid .footer-col:last-child { grid-column: span 1; }
}

/* ---- Tablet ----------------------------------------------------------------*/
@media (max-width: 1023px) {
  :root { --header-h: 76px; }

  .main-nav { display: none; }
  .nav-toggle { display: flex; }
  .header-actions .btn--primary-nav { display: none; }

  .hero h1 { font-size: clamp(2.2rem, 4.5vw + 1rem, 3.2rem); max-width: 16ch; }
  .hero p.hero-sub { font-size: var(--fs-md); }
  .hero-scroll-cue { display: none; }

  .split { grid-template-columns: 1fr; gap: var(--space-lg); }
  .split .split-media { order: -1 !important; }

  .process-track { grid-template-columns: repeat(3, 1fr); row-gap: var(--space-lg); }
  .process-track::before { display: none; }

  .contact-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }

  .fact-list { grid-template-columns: repeat(2, 1fr); }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-md) var(--space-lg); }
  .footer-brand { grid-column: span 2; }

  .collab-band { padding: var(--space-lg) var(--space-md); }
  .collab-band::before { background-position: right -30% top -10%; background-size: 90%; }
}

/* ---- Mobile ------------------------------------------------------------------*/
@media (max-width: 767px) {
  :root {
    --space-2xl: 4.5rem;
    --space-xl: 3.25rem;
    --space-lg: 2.25rem;
    --header-h: 68px;
  }

  body { font-size: 0.98rem; }

  .hero { min-height: 100svh; align-items: flex-end; }
  .hero-inner { padding-bottom: var(--space-xl); }
  .hero h1 { max-width: 100%; font-size: clamp(2rem, 8vw, 2.6rem); }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { width: 100%; }

  .reason-grid { grid-template-columns: 1fr; }
  .values-grid { grid-template-columns: repeat(2, 1fr); }

  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item { border-left: none; border-top: 1px solid rgba(255,255,255,0.14); padding-top: var(--space-sm); }
  .stat-item:nth-child(1), .stat-item:nth-child(2) { border-top: none; padding-top: 0; }

  .process-track { grid-template-columns: 1fr 1fr; }
  .process-cta { flex-direction: column; align-items: stretch; text-align: center; }
  .process-cta p { max-width: 100%; }
  .process-cta .btn { width: 100%; }

  .split-media-caption { flex-direction: column; align-items: flex-start; gap: 0.35rem; }
  .split-media-caption span { text-align: left; }

  .fact-list { grid-template-columns: 1fr; }
  .faq-toc ol { grid-template-columns: 1fr; }

  .contact-form { padding: var(--space-md); }

  .footer-grid { grid-template-columns: 1fr; text-align: left; }
  .footer-brand { grid-column: span 1; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .footer-bottom-right { align-items: flex-start; }
  .footer-legal-nav { justify-content: flex-start; }

  .float-actions { right: 1rem; bottom: 1rem; }
  .fab-whatsapp { width: 52px; height: 52px; }
  .fab-whatsapp svg { width: 24px; height: 24px; }

  .collab-band::before { display: none; }
  .collab-band h2 { font-size: var(--fs-lg); }

  .tax-table { font-size: var(--fs-xs); }
}

/* ---- Mobile pequeño --------------------------------------------------------*/
@media (max-width: 380px) {
  .values-grid { grid-template-columns: 1fr; }
  .process-track { grid-template-columns: 1fr; }
  .brand-tag { display: none; }
}

/* ---- Altura reducida (landscape móvil) --------------------------------------*/
@media (max-height: 480px) and (orientation: landscape) {
  .hero { min-height: 620px; }
  .hero-scroll-cue { display: none; }
}

/* ---- Impresión ---------------------------------------------------------------*/
@media print {
  .site-header, .float-actions, .mobile-panel, .hero-scroll-cue, .wave-divider { display: none; }
  .hero { min-height: auto; color: #000; }
  .hero-media img { display: none; }
  .hero-media::after { display: none; }
  body { color: #000; }
}
