/* Strato responsive per TheProfessional — sotto i 900px sostituisce il layout a immagini con uno fluido */
img { max-width: 100%; height: auto; }
iframe, embed, object, video { max-width: 100%; }
.menu-toggle { display: none; }

@media (max-width: 900px) {
  html, body { overflow-x: clip; }
  body { background: #e9e9e9 !important; font-size: 15px; line-height: 1.6; }
  #container { width: auto !important; max-width: 964px; padding: 0 12px; box-sizing: border-box; }

  /* Header + logo */
  #header { height: 56px !important; margin: 0 0 14px !important; }
  .logolink { left: 0; }
  .brand-mark { width: 38px; height: 38px; }

  /* Menu a tendina "hamburger" */
  #menu { background: none !important; border: 0; border-radius: 0; height: 56px !important; margin: 0 !important; overflow: visible !important; }
  #menu.nav-open ul.nav, #menu.nav-open #search-form { position: absolute; left: -12px; right: -12px; background: #fff; }
  #menu.nav-open ul.nav { top: 118px; max-height: calc(100vh - 190px); overflow-y: auto; box-shadow: 0 16px 28px rgba(17,24,39,.14); }
  #menu.nav-open #search-form { background: #fff !important; padding: 10px 16px !important; top: 56px; height: 62px; box-sizing: border-box; border-top: 1px solid #eef0f3; }
  .menu-toggle { display: block; width: 100%; text-align: left; background: none; border: 0; padding: 0 0 0 52px; height: 56px; font: bold 15px 'Droid Sans', Arial, sans-serif; color: #333; cursor: pointer; }
  .menu-toggle:after { content: "\2630"; float: right; font-size: 20px; }
  #menu ul.nav, #menu #search-form { display: none; }
  #menu.nav-open ul.nav, #menu.nav-open #search-form { display: block; }
  ul.nav { float: none !important; padding: 0 !important; font-size: 15px; }
  ul.nav li { float: none !important; margin: 0 !important; width: auto !important; border-top: 1px solid #eef0f3; }
  ul.nav li a { float: none !important; display: block; padding: 12px 16px !important; }
  ul.nav li.backLava { display: none !important; }
  ul.nav li ul, ul.nav li:hover ul, ul.nav li.sfHover ul { position: static !important; display: block !important; visibility: visible !important; opacity: 1 !important; width: auto !important; border: 0 !important; box-shadow: none !important; background: none !important; padding: 0 0 0 16px !important; top: auto !important; left: auto !important; }
  ul.nav ul li { margin: 0 !important; padding: 0 !important; background: none !important; }
  ul.nav ul li a { width: auto !important; background: none !important; padding: 10px 16px !important; font-size: 14px; }
  #search-form { float: none !important; margin: 0 !important; padding: 10px 16px 14px; border-top: 1px solid #eef0f3; }
  #searchform { width: 100%; }

  /* Slider home */
  .hero-track { height: 300px; }
  .hero-caption { padding: 0 20px 40px 18px; }
  .hero-caption h2 { font-size: 22px !important; }
  .hero-caption p { display: none; }
  .hero-nav { opacity: 1; width: 36px; height: 36px; }
  .hero-dots { right: 14px; bottom: 16px; }

  /* Contenuto */
  #content-top, #content-bottom { display: none !important; }
  #content { background: #fff !important; border: 1px solid #cfcfcf; border-radius: 8px; box-shadow: 0 2px 6px rgba(0,0,0,.08); }
  div#content-area, .content-alt div#content-area { width: auto !important; float: none !important; padding: 0 !important; margin: 0 !important; }
  .entry, .content-alt .entry { padding: 18px 16px 10px !important; }
  #breadcrumbs { padding: 12px 16px 8px !important; }
  .entry h1.title, .entry h2.title { font-size: 22px !important; line-height: 1.25; }
  div.thumb { float: none !important; width: auto !important; height: auto !important; margin: 0 0 12px !important; padding: 0 !important; }
  div.thumb span.overlay { display: none; }
  .alignleft, .alignright, img.alignleft, img.alignright { float: none !important; display: block; margin: 8px auto !important; }
  table { max-width: 100%; display: block; overflow-x: auto; }
  .wp-caption { max-width: 100% !important; height: auto; }

  /* Servizi in home */
  body#home #content:not(.content-alt) { grid-template-columns: 1fr; gap: 16px; padding: 14px !important; }
  div.service h3.title { min-height: 0; }
  div.service img { height: 180px !important; }

  /* Sidebar + footer */
  div#sidebar { width: auto !important; float: none !important; padding: 0 !important; margin: 0 !important; border-top: 1px solid #ebebeb; }
  .widget { padding: 18px 16px !important; }
  .widget h3.widgettitle { margin-left: 0 !important; }
  #footer p#copyright { float: none !important; text-align: center; margin: 12px 0 !important; }
  #wp-calendar { width: 100%; }

  /* Commenti */
  li.depth-1 .comment-wrap, li.depth-2 .comment-wrap, li.depth-3 .comment-wrap, li.depth-4 .comment-wrap,
  .content-alt li.depth-1 .comment-wrap, .content-alt li.depth-2 .comment-wrap, .content-alt li.depth-3 .comment-wrap, .content-alt li.depth-4 .comment-wrap { width: auto !important; }
  #commentform textarea#comment, #commentform input[type=text], li.comment #respond textarea, li.comment #respond input[type=text] { width: 96% !important; }

  /* Plugin: mappe e gallerie */
  .mapp-layout, .mapp-canvas, .mapp-map, div[id^="mapp"] { max-width: 100% !important; }
  .ngg-galleryoverview, .ngg-gallery-thumbnail-box { max-width: 100%; }
  .ngg-gallery-thumbnail img { max-width: 100%; height: auto; }
}