/* ============================================================
   MOBILE.CSS — Responsività per Manfellotto Arredamenti
   Breakpoint principale: 768px (tablet/mobile)
   ============================================================ */

@media (max-width: 900px) {

  /* ── HEADER ──────────────────────────────────────────────── */
  #main-header .container { padding: 0 20px; }
  .header-inner { height: 64px; }

  /* Nascondi menu orizzontale, mostra hamburger */
  #top-menu { display: none; }

  .logo img { height: 60px !important; }

  /* Hamburger button */
  .hamburger {
    display: flex;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 8px;
    background: none;
    border: none;
  }
  .hamburger span {
    display: block;
    width: 24px;
    height: 2px;
    background: #fff;
    transition: all 0.3s;
  }

  /* Menu mobile aperto */
  #top-menu.open {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 64px; left: 0; right: 0;
    background: rgba(26,23,20,0.98);
    padding: 20px 0 32px;
    gap: 0;
    border-top: 1px solid rgba(180,154,106,0.15);
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    z-index: 99;
  }
  #top-menu.open > li > a {
    display: block;
    padding: 14px 28px;
    font-size: 13px;
    color: rgba(255,255,255,0.8) !important;
    border-bottom: 1px solid rgba(255,255,255,0.05);
  }
  #top-menu.open > li > a::after { display: none; }

  /* Dropdown mobile */
  .sub-menu {
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    top: auto !important;
    display: none;
    background: rgba(0,0,0,0.3);
    border: none;
    padding: 0;
    min-width: unset;
  }
  .sub-menu.open { display: block; }
  .sub-menu li a {
    padding: 12px 28px 12px 44px !important;
    font-size: 12px !important;
    border-bottom: 1px solid rgba(255,255,255,0.03) !important;
  }
  .nav-contact-btn {
    margin: 16px 28px 0 !important;
    text-align: center !important;
    display: block !important;
  }

  /* ── HERO HOME ───────────────────────────────────────────── */
  #hero { min-height: 100svh; }
  .hero-inner {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .hero-h1 { font-size: 42px !important; }
  .hero-p { font-size: 14px !important; }
  .hero-ctas { flex-direction: column; gap: 12px; }
  .hero-ctas a { text-align: center; }

  /* ── PAGE HERO (pagine interne) ──────────────────────────── */
  #page-hero { height: 220px; }
  .page-hero-inner h1 { font-size: 32px !important; }

  /* ── SEZIONI GENERICHE ───────────────────────────────────── */
  .container { padding: 0 20px !important; }

  /* Grid 2 colonne → 1 colonna */
  .intro-grid,
  .prog-grid,
  .lavori-grid,
  .storia-inner,
  .home-design-inner,
  .mv-grid,
  .contatti-grid,
  .featured-grid,
  .footer-grid,
  .privacy-wrap { grid-template-columns: 1fr !important; gap: 40px !important; }

  /* Grid 3 colonne → 1 colonna */
  .pillars-grid,
  .prog-cats,
  .reviews-grid,
  .news-grid,
  .sc-grid { grid-template-columns: 1fr !important; }

  /* Grid 4 colonne → 2 colonne */
  .gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* ── CORNICI GOLD (offset) — rimuovi su mobile ───────────── */
  .prog-img::before,
  .storia-img::before,
  .lavori-img-wrap::before,
  .video-outer::before,
  .cat-intro-img::before { display: none !important; }

  /* ── IMMAGINI ────────────────────────────────────────────── */
  .prog-img img,
  .storia-img img,
  .lavori-img-wrap img,
  .cat-intro-img img { height: 260px !important; }

  /* ── SEZIONE TESTI ───────────────────────────────────────── */
  .section-title,
  .section-title-light { font-size: 30px !important; }

  /* ── STAT NUMERI ─────────────────────────────────────────── */
  .storia-stat { flex-direction: column; gap: 20px !important; }
  .stat-num { font-size: 40px !important; }

  /* ── COUNTERS ────────────────────────────────────────────── */
  .counters { gap: 16px !important; }
  .counter-num { font-size: 40px !important; }

  /* ── MAPPA CONTATTI ──────────────────────────────────────── */
  .mappa-inner { grid-template-columns: 1fr !important; }
  .mappa-frame { height: 300px !important; }
  .mappa-aside { padding: 40px 20px !important; }

  /* ── NEWS CARD ───────────────────────────────────────────── */
  .news-card-img { height: 180px !important; }
  .featured-img img { height: 240px !important; }

  /* ── CTA BLOCKS ──────────────────────────────────────────── */
  .cat-cta,
  .art-cta {
    flex-direction: column !important;
    gap: 24px !important;
    text-align: center;
  }
  .cat-cta h3,
  .art-cta h3 { font-size: 22px !important; }

  /* ── PRIVACY INDICE ──────────────────────────────────────── */
  .privacy-index { display: none; }

  /* ── STICKY BUTTONS ──────────────────────────────────────── */
  .sticky-contacts { display: none; }

  /* ── FOOTER ──────────────────────────────────────────────── */
  .footer-bottom {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }

  /* ── ARTICOLI ────────────────────────────────────────────── */
  .articolo-item { grid-template-columns: 1fr !important; }
  .articolo-arrow { display: none; }
  .art-wrap { padding: 0 !important; }
  .art-img { height: 220px !important; }

  /* ── TAB ARREDI ──────────────────────────────────────────── */
  .cat-nav-inner { gap: 0 !important; }
  .cat-tab { padding: 14px 16px !important; font-size: 10px !important; }

}

/* ── HAMBURGER nascosto su desktop ───────────────────────── */
@media (min-width: 901px) {
  .hamburger { display: none; }
}