/* ============================================================
   CARVO · Responsive
   Desktop 12 col · Tablet 8 col · Mobile 4 col
   ============================================================ */

/* ---------- Tablet (≤ 1024px) ---------- */
@media (max-width: 1024px) {
  :root {
    --cols: 8;
    --header-h: 68px;
  }

  .service-card { grid-column: span 6; }
  .service-card--wide { grid-column: span 12; }

  .services-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }

  .process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .diagnostic-layout,
  .service-layout,
  .contact-grid {
    grid-template-columns: 1fr;
  }

  .diagnostic-sticky,
  .service-aside {
    position: static;
  }

  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid > [style*="grid-column"] {
    grid-column: 1 / -1 !important;
  }

  .nav-desktop .nav-link { display: none; }
  .nav-desktop .btn { display: inline-flex; }
  .burger { display: flex; }
}

/* ---------- Mobile (≤ 680px) ---------- */
@media (max-width: 680px) {
  :root {
    --cols: 4;
    --announce-h: 38px;
  }

  .brand img { height: 36px; }

  /* En móvil el CTA del header se sustituye por la sticky-cta y el drawer */
  .nav-desktop { display: none; }

  /* Hero móvil: composición propia */
  .hero {
    min-height: calc(100svh - var(--header-h) - var(--announce-h));
    justify-content: flex-end;
  }

  .hero-media img { object-position: 62% center; }

  .hero-meta { gap: 0.4rem 1.1rem; }

  .hero-title { max-width: 12ch; }

  .hero-sub { font-size: 1.02rem; }

  .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hero-actions .btn { width: 100%; }

  .hero-foot {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }

  .service-card,
  .service-card--wide { grid-column: span 12; }

  .service-card-media { aspect-ratio: 16 / 9; }

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

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

  .hybrid-services { grid-template-columns: 1fr; }

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

  .cta-band-inner {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
  }

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

  /* CTA fija inferior */
  .sticky-cta { display: flex; }
  .sticky-cta .btn { flex: 1; min-height: 50px; padding-inline: 1rem; }

  body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }

  .drawer { padding-top: calc(var(--header-h) + 0.5rem); }

  .selector-nav { flex-direction: column-reverse; }
  .selector-nav .btn { width: 100%; }

  .announce { font-size: 0.65rem; letter-spacing: 0.06em; }

  .map-frame { aspect-ratio: 1 / 1; }

  .step { grid-template-columns: auto 1fr; gap: 1rem; }
}

/* ---------- Pantallas muy anchas ---------- */
@media (min-width: 1800px) {
  .hero-media img { object-position: center 55%; }
}

/* ---------- Hover solo cuando hay hover real ---------- */
@media (hover: none) {
  .service-card:hover { transform: none; }
}