/* =============================================================
   Responsive — Global mobile/tablet overrides
   ============================================================= */

/* ---------- Mobile (max 640px) ---------- */
@media (max-width: 640px) {
  /* Prevent horizontal overflow — only on body, html overflow-x breaks sticky */
  body { overflow-x: clip; }
  .container { padding-left: 16px; padding-right: 16px; }
  * { overflow-wrap: break-word; word-break: normal; }

  /* Hero */
  .hero { min-height: auto; }
  .hero-inner { padding: 48px 0 36px; }
  .hero .eyebrow { font-size: 0.625rem; letter-spacing: 1.5px; margin-bottom: 10px; }
  .hero h1 { font-size: 1.75rem; margin-bottom: 12px; }
  .hero-sub { font-size: 0.9375rem; margin-bottom: 20px; }

  /* Key facts 2x2 */
  .key-facts { flex-direction: row; flex-wrap: wrap; gap: 0; margin: 16px 0 20px; padding: 16px 0; }
  .key-facts > div { flex: 1 1 50%; border-right: none; border-bottom: none; padding: 8px 0; font-size: 0.8125rem; }
  .key-facts strong { font-size: 0.625rem; margin-bottom: 2px; }

  /* Countdown compatto */
  .countdown { margin: 16px 0 20px; gap: 8px; justify-content: center; }
  .countdown-item { min-width: 64px; padding: 12px 10px; }
  .countdown-value { font-size: 1.75rem; }
  .countdown-label { font-size: 0.5625rem; letter-spacing: 1.5px; }
  .countdown-caption { font-size: 0.75rem; margin-top: 4px; }

  /* Pulsanti hero — full width */
  .btn-xl { padding: 14px 20px; font-size: 0.9375rem; }
  .hero-ctas { flex-direction: column; gap: 10px; margin-top: 4px; }
  .hero-ctas .btn {
    width: 100%; min-height: 48px;
    justify-content: center; text-align: center;
    font-size: 0.9375rem; padding: 14px 16px;
  }
  .hero-ctas .btn-outline-light { font-size: 0.8125rem; padding: 12px 16px; min-height: 44px; }

  /* Scroll indicator nascosto */
  .scroll-indicator { display: none; }

  /* Sticky bar — single row (lang-toggle rimosso dal header → piu' spazio per CTA) */
  .sticky-bar-inner { padding: 0 8px; gap: 8px; flex-wrap: nowrap; min-height: 48px; }
  .sticky-bar-item { display: none !important; }
  .sticky-bar-nav { display: none; }
  .sticky-bar-logo img { height: 28px; }
  .sticky-bar-cta-green {
    padding: 8px 14px;
    font-size: 0.75rem;
    min-height: 34px;
    gap: 6px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .sticky-bar-cta-green i { display: inline-block; font-size: 0.8125rem; }
  .auth-widget { margin-left: 0; gap: 6px; flex-shrink: 0; }
  .auth-widget-btn {
    padding: 8px 12px;
    font-size: 0.75rem;
    gap: 6px;
    min-width: auto;
    white-space: nowrap;
  }
  .auth-widget-btn i { font-size: 0.8125rem; margin: 0; }
  .auth-user-name { font-size: 0.6875rem; max-width: 80px; }

  /* Filtri compact sotto la sticky bar fixed */
  .catalog-filters { top: 48px; }
  .catalog-filters.compact { top: 48px; }

  /* Badge */
  .badge-loc { font-size: 0.625rem; padding: 4px 8px; max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* Partecipare / Steps */
  #partecipare .section-header { margin-bottom: 32px; }
  #partecipare .deck { font-size: 0.9375rem; }
  .steps-phases { gap: 6px; margin-bottom: 12px; }
  .phase-label { font-size: 0.6875rem; padding-bottom: 8px; gap: 6px; }
  .phase-badge { font-size: 0.625rem; padding: 3px 10px; }
  .step-v2 { padding: 20px 18px; }
  .step-v2-header { margin-bottom: 14px; gap: 10px; }
  .step-v2-icon { width: 40px; height: 40px; border-radius: 12px; font-size: 1.0625rem; }
  .step-v2-num { font-size: 1.625rem; }
  .step-v2-body h3 { font-size: 1rem; margin-bottom: 8px; }
  .step-v2-body p { font-size: 0.8125rem; margin-bottom: 12px; }
  .step-v2-detail { padding: 8px 12px; font-size: 0.6875rem; }

  /* CTA closer */
  .cta-closer { padding: 64px 0; }
  .cta-closer .hero-ctas { flex-direction: column; }
  .cta-closer .hero-ctas .btn { width: 100%; }

  /* Footer */
  .footer-legal { line-height: 2; }
  .footer-legal a { display: inline-block; margin: 0 4px; }
}

/* ---------- Tablet (641-900px) ---------- */
@media (min-width: 641px) and (max-width: 900px) {
  .btn-xl { padding: 18px 32px; font-size: 1.0625rem; }
  .countdown-value { font-size: 2.125rem; }
  .cta-closer { padding: 80px 0; }
  .catalog-filters { top: 56px; }
  .catalog-filters.compact { top: 56px; }
}