/* ==========================================================================
   Zerbetto Tech Hub — Responsive overrides
   Mobile-first tweaks layered on top of style.css. Breakpoints:
   1440 (4K/wide), 1024 (tablet landscape / small desktop),
   768 (tablet portrait), 480 (phone).
   ========================================================================== */

/* ---------- 4K / ultra-wide ---------- */
@media (min-width: 1600px) {
  :root { --container-max: 1440px; }
}

/* ---------- Small desktop / tablet landscape ---------- */
@media (max-width: 1024px) {
  .hero-slide__content { grid-template-columns: 1fr; }
  .hero-slide__visual { display: none; }
  .hero-slide__text { max-width: 100%; }

  .cards-grid { grid-template-columns: repeat(3, 1fr); }
  .docs-list { grid-template-columns: repeat(2, 1fr); }
  .hero-arrow--prev { left: var(--space-4); }
  .hero-arrow--next { right: var(--space-4); }
}

/* ---------- Tablet portrait ---------- */
@media (max-width: 768px) {
  :root { --header-height: 68px; }

  .container { padding-inline: var(--space-4); }

  .brand__sub { display: none; }

  .hero { height: 600px; min-height: 480px; }
  .hero-slide__content { padding-inline: var(--space-4); }
  .hero-slide__subtitle { max-width: 100%; }
  .hero-slide__desc { max-width: 100%; }

  .hero-arrow { width: 40px; height: 40px; }
  .hero-arrow--prev { left: var(--space-3); }
  .hero-arrow--next { right: var(--space-3); }
  .hero-indicators { bottom: var(--space-6); }

  .search-section { margin-top: -32px; }
  .search-panel__input { font-size: var(--fs-base); }

  .section { padding-block: var(--space-16); }
  .section__header { flex-direction: column; align-items: flex-start; gap: var(--space-3); }

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

  .footer-row { gap: var(--space-6); }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------- Phone ---------- */
@media (max-width: 480px) {
  .hero-slide__title { font-size: clamp(1.75rem, 8vw, 2.25rem); }
  .hero-slide__subtitle { font-size: var(--fs-base); }
  .hero-slide__divider { margin-block: var(--space-4); }
  .hero-slide__desc { font-size: var(--fs-sm); margin-bottom: var(--space-6); }

  .btn { padding: var(--space-3) var(--space-5); font-size: 0.75rem; }

  .hero-arrow { display: none; }

  .search-panel { padding: var(--space-2); border-radius: var(--radius-lg); }
  .search-panel__icon { margin-left: var(--space-2); }
  .search-panel__submit { width: 40px; height: 40px; }

  .cards-grid { grid-template-columns: 1fr 1fr; }
  .hub-card { padding: var(--space-5) var(--space-4); }

  .footer-item { flex: 1 1 100%; }

  .update-strip { flex-direction: column; align-items: flex-start; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .hero-slide__texture { transition: none !important; transform: scale(1) !important; }
}
