/* Sezioni home "Facebook" e "Instagram" (09/10/2026).
   Finche' il visitatore non sceglie di caricarli, al posto dei riquadri
   di Meta c'e' un'anteprima leggera (.me-placeholder). */
.me-section { padding: 3rem 1rem; }
.me-wrap { max-width: 1100px; margin: 0 auto; }
.me-head { text-align: center; margin-bottom: 2rem; }
.me-title { font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 700; color: #1d1d1f; margin-bottom: .4rem; }
.me-subtitle { color: #6c757d; font-size: 1.05rem; margin: 0 auto; max-width: 640px; }
.hs-band-dark .me-title { color: #fff; }
.hs-band-dark .me-subtitle { color: rgba(255, 255, 255, .7); }

.me-placeholder { display: flex; flex-direction: column; align-items: center; gap: .65rem; text-align: center; padding: 2.25rem 1.5rem; }
.me-ph-icon { font-size: 2.8rem; line-height: 1; }
.me-ph-text { color: #6c757d; font-size: .92rem; margin: 0; max-width: 340px; }
.me-ph-btn { display: inline-flex; align-items: center; gap: .45rem; border: 0; border-radius: 999px; padding: .7rem 1.5rem;
             color: #fff; font-weight: 600; text-decoration: none; transition: filter .2s ease, transform .2s ease; }
.me-ph-btn:hover { color: #fff; filter: brightness(1.08); transform: translateY(-1px); }
.me-ph-link { font-size: .85rem; color: #6c757d; text-decoration: none; }
.me-ph-link:hover { text-decoration: underline; }
.fb-color { color: #1877f2; }
.fb-bg { background: #1877f2; }
.ig-color { color: #dd2a7b; }
.ig-bg { background: linear-gradient(45deg, #f58529 0%, #dd2a7b 50%, #8134af 100%); }

/* Facebook: il Page Plugin e' largo al massimo 500 px */
.fb-box { max-width: 500px; margin: 0 auto; display: flex; align-items: center; justify-content: center;
          background: #fff; border: 1px solid #e9ecef; border-radius: 14px; overflow: hidden; }
.fb-box.is-loaded { background: transparent; border: 0; border-radius: 0; min-height: 0 !important; }
.fb-box iframe { display: block; max-width: 100%; }

/* Instagram: griglia dei post scelti */
.ig-box { background: #fff; border: 1px solid #e9ecef; border-radius: 14px; }
.ig-box.is-loaded { background: transparent; border: 0; }
.ig-box:not(.is-loaded) .ig-grid, .ig-box.is-loaded .me-placeholder { display: none; }
.ig-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 1.25rem; align-items: start; }
.ig-grid.ig-n1 { max-width: 540px; margin: 0 auto; }
.ig-grid.ig-n2 { max-width: 1000px; margin: 0 auto; }
.ig-grid .instagram-media { min-width: 0 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; }
.ig-follow { text-align: center; margin-top: 1.5rem; }

/* Instagram "Griglia di foto" (10/10/2026): foto quadrate della libreria,
   ognuna porta al suo post; nessun contenuto di Meta */
.ig-photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ig-photos.ig-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ig-photos.ig-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ig-photos.ig-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.ig-photo { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 6px;
            background: #eef0f4 center / cover no-repeat; }
.ig-photo-ov { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
               background: rgba(0, 0, 0, .35); color: #fff; font-size: 1.6rem; opacity: 0; transition: opacity .2s ease; }
a.ig-photo:hover .ig-photo-ov, a.ig-photo:focus-visible .ig-photo-ov { opacity: 1; }
.ig-photos + .ig-follow { margin-top: 1rem; }
@media (max-width: 575.98px) {
    .ig-photos.ig-cols-4, .ig-photos.ig-cols-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}