/* Scavi di Pompei — header responsive 1:1 col design */
@media (max-width: 980px) {
  /* riga unica compatta: logo sx, menu/hamburger dx */
  .elementor-element-5218d88.e-con { padding: 0 !important; }
  /* header sticky su mobile (richiesta Gabriele): resta bloccato in alto allo scroll */
  .elementor-location-header { position: sticky !important; top: 0 !important; z-index: 999 !important; background: #FAF6EC !important; }
  .elementor-element-7299d5a.e-con > .e-con-inner {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 60px !important;
    padding: 0 24px !important;
  }
  .elementor-element-9f250fe.e-con,
  .elementor-element-fe07510.e-con {
    width: auto !important;
    max-width: none !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .elementor-element-9f250fe.e-con { gap: 9px !important; }
  /* ordine header mobile: logo > CTA > menu (richiesta Gabriele) */
  .elementor-element-9f250fe.e-con { order: 0 !important; margin-right: auto !important; }
  .elementor-element-fe07510.e-con { order: 1 !important; }
  .elementor-element-2619008 { flex: 0 0 auto !important; width: auto !important; margin-left: 8px !important; order: 2 !important; }
  /* logo compatto, niente a capo; testo si tronca con ellissi SOLO se lo spazio non basta (mai overlap, mai a capo) */
  .elementor-element-ef098ff { flex-shrink: 0 !important; }
  .elementor-element-ef098ff img { width: 22px !important; height: auto !important; }
  .elementor-element-64b77d3 { min-width: 0 !important; flex-shrink: 1 !important; overflow: hidden !important; }
  .elementor-element-64b77d3 .elementor-heading-title {
    font-size: 1.15rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: block !important;
  }
  /* CTA compatto tra 481 e 980 */
  .elementor-element-ec7ba91 .elementor-button {
    font-size: 0.85rem !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
  }
  /* hamburger: target touch 44px, allineato */
  .e-n-menu-toggle { min-width: 44px !important; min-height: 44px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
  /* pannello mobile del menu: larghezza piena, voci comode */
  .elementor-element-2619008 .e-n-menu-content { width: 100% !important; }
  .elementor-element-2619008 .e-n-menu-content > .e-con {
    width: 100vw !important; max-width: 100vw !important;
    background: #FAF6EC !important;
    box-shadow: 0 12px 24px -12px rgba(33,30,38,.35);
  }
  /* chevron submenu: target touch pieno */
  .e-n-menu-dropdown-icon { min-width: 44px !important; min-height: 44px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; }
  .elementor-element-2619008 .e-n-menu-title { min-height: 44px !important; }
  .elementor-element-2619008 .elementor-icon-list-item a { padding: 12px 8px !important; }
}
@media (max-width: 640px) {
  .elementor-element-7299d5a.e-con > .e-con-inner { padding: 0 16px !important; }
}
@media (max-width: 480px) {
  /* CTA sempre visibile anche su mobile piccolo (richiesta Gabriele) */
  .elementor-element-fe07510.e-con { display: flex !important; }
  .elementor-element-ec7ba91 .elementor-button { font-size: 0.7rem !important; padding: 6px 8px !important; letter-spacing: 0 !important; }
  .elementor-element-ec7ba91 .elementor-button { padding: 6px 6px !important; }
  .elementor-element-7299d5a.e-con > .e-con-inner { padding: 0 6px !important; gap: 4px !important; }
  .elementor-element-9f250fe.e-con { gap: 5px !important; }
  .elementor-element-ef098ff img { width: 18px !important; }
  .elementor-element-64b77d3 .elementor-heading-title { font-size: 0.95rem !important; }
  /* Fix overflow ~20px: logo e CTA avevano flex-shrink:0 dal desktop (width 30%/20%), non si restringevano mai sotto il loro contenuto naturale. CTA resta SEMPRE visibile (vedi regola sopra), solo ora puo' restringersi. */
  .elementor-element-9f250fe.e-con, .elementor-element-fe07510.e-con { flex-shrink: 1 !important; width: auto !important; min-width: 0 !important; }
}
@media (max-width: 360px) {
  /* larghezze estreme: il bottone CTA puo' andare su 2 righe invece di sovrapporsi all'hamburger (mai nascosto, resta sempre leggibile) */
  .elementor-element-fe07510.e-con { min-width: 0 !important; }
  .elementor-element-ec7ba91 { min-width: 0 !important; }
  .elementor-element-ec7ba91 .elementor-button {
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.15 !important;
  }
  .elementor-element-64b77d3 .elementor-heading-title { font-size: 0.92rem !important; }
}

/* Footer: 2 colonne <=900, 1 colonna <=560 (design .footer-grid) */
@media (max-width: 900px) {
  .elementor-element-82d348e.e-con > .e-con-inner,
  .elementor-element-82d348e.e-con { flex-wrap: wrap !important; flex-direction: row !important; }
  .elementor-element-4b73587.e-con, .elementor-element-b71209b.e-con,
  .elementor-element-58a3f48.e-con, .elementor-element-89897dd.e-con, .elementor-element-8ff2ddb.e-con {
    width: calc(50% - 16px) !important; max-width: calc(50% - 16px) !important; flex: 0 0 auto !important;
  }
}
@media (max-width: 560px) {
  .elementor-element-4b73587.e-con, .elementor-element-b71209b.e-con,
  .elementor-element-58a3f48.e-con, .elementor-element-89897dd.e-con, .elementor-element-8ff2ddb.e-con {
    width: 100% !important; max-width: 100% !important;
  }
}
/* ===== Raffinamento hamburger + menu mobile (palette design) ===== */
@media (max-width: 1024px) {
  /* Toggle: come .nav-toggle del design (bordo travertino, fondo trasparente) */
  .e-n-menu-toggle{
    background: transparent !important;
    border: 1px solid #E4DAC5 !important;
    border-radius: 2px !important;
    color: #211E26 !important;
    transition: background .15s ease, color .15s ease, border-color .15s ease !important;
  }
  .e-n-menu-toggle svg{ fill: currentColor !important; stroke: currentColor !important; }
  /* Hover: superficie chiara + icona rosso scuro (niente blocchi rossi pieni) */
  .e-n-menu-toggle:hover{
    background: #F2EBDA !important;
    color: #7A4F12 !important;
    border-color: #D9CDAF !important;
  }
  /* Aperto: travertino pieno, icona cenere */
  .e-n-menu-toggle[aria-expanded="true"]{
    background: #E4DAC5 !important;
    color: #211E26 !important;
    border-color: #E4DAC5 !important;
  }
  .e-n-menu-toggle:focus-visible{ outline: 2px solid #9C6A1E !important; outline-offset: 2px !important; }

  /* Pannello voci: righe piene con divisori, testo cenere */
  .elementor-element-2619008 .e-n-menu-wrapper{
    background: #FAF6EC !important;
    border-top: 1px solid #E4DAC5 !important;
    box-shadow: 0 14px 28px -14px rgba(33,30,38,.35) !important;
  }
  .elementor-element-2619008 .e-n-menu-heading{ flex-direction: column !important; align-items: stretch !important; }
  .elementor-element-2619008 .e-n-menu-item{
    border-bottom: 1px solid #EFE7D2 !important;
  }
  .elementor-element-2619008 .e-n-menu-item:last-child{ border-bottom: 0 !important; }
  .elementor-element-2619008 .e-n-menu-title{
    padding: 2px 16px !important;
    transition: background .15s ease !important;
  }
  .elementor-element-2619008 .e-n-menu-title .e-n-menu-title-text,
  .elementor-element-2619008 .e-n-menu-title a{
    color: #211E26 !important; font-weight: 600 !important; font-size: 1rem !important;
  }
  /* Hover voce: tinta accento leggera + testo rosso scuro (design dropdown) */
  .elementor-element-2619008 .e-n-menu-title:hover{ background: #F5E4DF !important; }
  .elementor-element-2619008 .e-n-menu-title:hover .e-n-menu-title-text,
  .elementor-element-2619008 .e-n-menu-title:hover a{ color: #7A4F12 !important; }
  /* Chevron di riga: neutro, rosso scuro in hover */
  .e-n-menu-dropdown-icon{ color: #6B6459 !important; border-radius: 2px !important; transition: background .15s ease, color .15s ease !important; }
  .e-n-menu-dropdown-icon:hover{ background: #F2EBDA !important; color: #7A4F12 !important; }
  .e-n-menu-dropdown-icon[aria-expanded="true"]{ color: #7A4F12 !important; }

  /* Sottomenu: leggero rientro, voci comode, hover coerente */
  .elementor-element-2619008 .e-n-menu-content > .e-con{ padding: 6px 16px 14px !important; }
  .elementor-element-2619008 .e-n-menu-content .elementor-icon-list-item a{ padding: 12px 8px !important; border-radius: 2px !important; }
  .elementor-element-2619008 .e-n-menu-content .elementor-icon-list-item a:hover{ background: #F5E4DF !important; }
  .elementor-element-2619008 .e-n-menu-content .elementor-icon-list-item a:hover .elementor-icon-list-text{ color: #7A4F12 !important; }
}

/* ===== Footer: gutter laterale omogeneo a 34px su mobile 1-colonna (richiesta Gabriele) ===== */
@media (max-width: 560px) {
  .elementor-location-footer > .e-con.e-con-full { padding-left: 34px !important; padding-right: 34px !important; }
  .elementor-location-footer > .e-con.e-con-full .e-con { padding-left: 0 !important; padding-right: 0 !important; }
}


/* === FIX 10/08/2026 === */
/* Il menu dell'header non deve andare a capo: si stringono voci e spaziature, non si nascondono voci. */
@media (min-width:1025px){
  .e-n-menu-heading{flex-wrap:nowrap !important; column-gap:2px !important;}
  .e-n-menu-title{padding-inline:7px !important;}
  .e-n-menu-title-text{font-size:.9rem !important; letter-spacing:0 !important; white-space:nowrap !important;}
  .header-cta,.header-cta .elementor-button{white-space:nowrap !important;}
}
@media (min-width:1025px) and (max-width:1240px){
  .e-n-menu-title-text{font-size:.84rem !important;}
  .e-n-menu-title{padding-inline:5px !important;}
}

/* La foto del box CTA va ancorata in alto, o il tempio viene tagliato. */
.cta-block-media img{object-position:center center !important;}
.inst-hero img{object-position:center center;}

/* FIX 10/08/2026 - object-position: 'center top' era ereditato dal sito madre e ancorava
   il ritaglio al bordo alto: sulle foto di questo sito il soggetto sta al centro, quindi
   le hero mostravano solo cielo. Portato a 'center center'. */

/* === FIX 10/08/2026 - badge di fiducia: overflow orizzontale su mobile ===
   ul .elementor-icon-list-items era inline-flex nowrap, larghezza intrinseca 316px
   dentro un widget da 192px: sforava il viewport sotto i 380px. */
@media (max-width: 767px) {
  .elementor-widget-icon-list .elementor-icon-list-items { max-width: 100% !important; flex-wrap: wrap !important; }
}


/* === FIX 10/08/2026 - CTA vs menu a desktop ===
   Misurato: le 6 voci occupavano 721px in una colonna da 583px e sfondavano fino a
   sovrapporsi alla CTA (margine -87px, 'FAQ' interamente coperta e non cliccabile).
   Lo spazio si recupera dalla colonna del marchio, larga 293px per un testo di 126px.
   Effetto misurato a 1366px: da -87px a +40px circa. */
@media (min-width:1025px){
  .elementor-element-9f250fe.e-con{ width:auto !important; flex:0 0 auto !important; }
  .elementor-element-2619008{ flex:1 1 auto !important; }
  .elementor-location-header .e-con-inner{ gap:10px !important; }
  .e-n-menu-heading{ flex-wrap:nowrap !important; column-gap:0 !important; }
  .e-n-menu-title{ padding-inline:4px !important; }
  .e-n-menu-title-text{ font-size:13.5px !important; white-space:nowrap !important; letter-spacing:0 !important; }
  .header-cta,.header-cta .elementor-button{ white-space:nowrap !important; }
}


/* === FIX 11/08/2026 - Riposizionamento hero per singola foto ===
   La regola generica 'center center' (fix 10/08/2026) centra il ritaglio della fascia
   28% ma su molte foto il soggetto (tempio/colonna/monumento) non e' al centro esatto.
   Ogni valore qui sotto e' stato calcolato guardando la foto e simulando il ritaglio
   della fascia hero (1425x300, object-fit:cover) a quel object-position. Le regole sono
   piu' specifiche (selettore per attributo src) quindi vincono sulla regola generica sopra. */
.inst-hero img[src*="art-biglietti-tempio-della-concordia-agrigento-30-09-2023-10"],
.cta-block-media img[src*="art-biglietti-tempio-della-concordia-agrigento-30-09-2023-10"] { object-position: center 36% !important; }

.inst-hero img[src*="art-kolymbethra-biglietto-il-giardino-della-kolymbethra"],
.cta-block-media img[src*="art-kolymbethra-biglietto-il-giardino-della-kolymbethra"] { object-position: center 35% !important; }

.inst-hero img[src*="art-tour-guidato-valle-dei-templi-towards-temple-of-concordia-1"],
.cta-block-media img[src*="art-tour-guidato-valle-dei-templi-towards-temple-of-concordia-1"] { object-position: center 45% !important; }

.inst-hero img[src*="band-tramonto-temple-of-hercules-33614481"],
.cta-block-media img[src*="band-tramonto-temple-of-hercules-33614481"] { object-position: center 15% !important; }

.inst-hero img[src*="art-selinunte-selinunte-tempio-e-tempio-di-hera-1"],
.cta-block-media img[src*="art-selinunte-selinunte-tempio-e-tempio-di-hera-1"] { object-position: center 35% !important; }

.inst-hero img[src*="art-segesta-segesta-tempio-greco"],
.cta-block-media img[src*="art-segesta-segesta-tempio-greco"] { object-position: center 42% !important; }

.inst-hero img[src*="art-salinas-museoarcheosalinas"],
.cta-block-media img[src*="art-salinas-museoarcheosalinas"] { object-position: center 45% !important; }

.inst-hero img[src*="art-chiostro-capitello-chiostro-monreale-3"],
.cta-block-media img[src*="art-chiostro-capitello-chiostro-monreale-3"] { object-position: center 38% !important; }

.inst-hero img[src*="art-palermo-bus-palermo-teatro-massimo-vittorio-emanuele"],
.cta-block-media img[src*="art-palermo-bus-palermo-teatro-massimo-vittorio-emanuele"] { object-position: center 45% !important; }

.inst-hero img[src*="art-cosa-vedere-agrigento-dalla-valle-dei-templi"],
.cta-block-media img[src*="art-cosa-vedere-agrigento-dalla-valle-dei-templi"] { object-position: center 60% !important; }

.inst-hero img[src*="art-concordia-tempio-della-concordia-ag"],
.cta-block-media img[src*="art-concordia-tempio-della-concordia-ag"] { object-position: center 54% !important; }

.inst-hero img[src*="art-kolymbethra-natura-kolymbetra-view-of-agrigento-120785"],
.cta-block-media img[src*="art-kolymbethra-natura-kolymbetra-view-of-agrigento-120785"] { object-position: center 45% !important; }

.inst-hero img[src*="art-come-arrivare-tempio-dei-dioscuri-agrigento-01-10-2023-01"],
.cta-block-media img[src*="art-come-arrivare-tempio-dei-dioscuri-agrigento-01-10-2023-01"] { object-position: center 70% !important; }

.inst-hero img[src*="art-akragas-panorama-agrigento-30-09-2023-05"],
.cta-block-media img[src*="art-akragas-panorama-agrigento-30-09-2023-05"] { object-position: center 55% !important; }

.inst-hero img[src*="art-faq-agrigento-tempio-di-ercole-06"],
.cta-block-media img[src*="art-faq-agrigento-tempio-di-ercole-06"] { object-position: center 40% !important; }


/* === FIX 11/08/2026 - hamburger fino a 1150px ===
   Misurato: fra 1025 e 1149px le 6 voci + CTA non stanno nell'header nemmeno
   comprimendo testo (11px) e padding (2px): il massimo ottenibile era +10px contro
   i 20px di regola. Sopra 1150px il menu orizzontale rispetta la regola (+21px a
   1150, +64px da 1280 in su). In questa fascia si usa quindi il menu a pannello,
   lo stesso che gia' funziona sotto i 1025px.
   Elementor commuta il pannello via aria-expanded sul toggle, non con display inline:
   le regole qui sotto si agganciano a quello. */
@media (min-width:1025px) and (max-width:1150px){
  .elementor-element-2619008 .e-n-menu{ position:relative !important; }
  .elementor-element-2619008 .e-n-menu-toggle{ display:flex !important; }
  .elementor-element-2619008 .e-n-menu-toggle[aria-expanded="false"] + .e-n-menu-wrapper{ display:none !important; }
  .elementor-element-2619008 .e-n-menu-toggle[aria-expanded="true"] + .e-n-menu-wrapper{
    display:flex !important; position:absolute !important; top:100% !important;
    left:50% !important; transform:translateX(-50%) !important;
    width:100vw !important; max-width:100vw !important; z-index:999 !important;
    background:#FAF6EC !important; border-top:1px solid #E4DAC5 !important;
    box-shadow:0 14px 28px -14px rgba(33,30,38,.35) !important;
  }
  .elementor-element-2619008 .e-n-menu-toggle[aria-expanded="true"] + .e-n-menu-wrapper .e-n-menu-heading{
    flex-direction:column !important; align-items:stretch !important; width:100% !important;
    max-width:1120px !important; margin:0 auto !important;
  }
  .elementor-element-2619008 .e-n-menu-item{ border-bottom:1px solid #EFE7D2 !important; }
  .elementor-element-2619008 .e-n-menu-item:last-child{ border-bottom:0 !important; }
  .elementor-element-2619008 .e-n-menu-title{ min-height:44px !important; padding:2px 16px !important; }
}

/* Sicurezza: oltre 1150px il pannello torna menu orizzontale anche se era rimasto
   aperto attraversando il breakpoint ridimensionando la finestra (reset oltre 1150). */
@media (min-width:1151px){
  .elementor-element-2619008 .e-n-menu-toggle[aria-expanded="true"] + .e-n-menu-wrapper{
    position:static !important; transform:none !important; width:auto !important;
    max-width:none !important; background:none !important; border-top:0 !important;
    box-shadow:none !important; left:auto !important; top:auto !important;
  }
  .elementor-element-2619008 .e-n-menu-toggle[aria-expanded="true"] + .e-n-menu-wrapper .e-n-menu-heading{
    flex-direction:row !important; align-items:center !important; margin:0 !important;
  }
}

/* FIX 11/08/2026 - allineamento verticale marchio e testo nell'header:
   il contenitore aveva align-items:normal, quindi i due elementi non erano
   centrati fra loro (scarto misurato 2px). */
.elementor-location-header .elementor-element-9f250fe.e-con{ align-items:center !important; }
