/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 25 2026 | 15:50:29 */
/***********************
 *  VARIABILI / BASE
 ***********************/
:root{
  --header-h: 90px;        /* altezza barra */
  --adminbar-h: 0px;       /* viene cambiata quando sei loggato */
}
html,body{margin:0;padding:0}
#wpadminbar{position:fixed;top:0}
body.admin-bar{ --adminbar-h:32px }
@media (max-width:782px){ body.admin-bar{ --adminbar-h:46px }}

/***********************
 *  HEADER (glass 40%)
 ***********************/
.wp-site-blocks > header.wp-block-template-part{
  position:fixed;
  top:var(--adminbar-h);
  left:0; right:0;
  z-index:9999;
  min-height:var(--header-h);
  background:rgba(255,255,255,.8) !important; /* vetro iniziale */
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  box-shadow:none !important;
  overflow:visible !important;
  transition:background-color .3s ease, box-shadow .3s ease;
}

/* Solo header: NON rendere trasparente il pannello del menu mobile */
header.wp-block-template-part,
header.wp-block-template-part *:not(.wp-block-navigation__responsive-container):not(.wp-block-navigation__responsive-container *){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ======================================================
 * FIX CRITICO:
 * prima avevi:
 * body.has-modal-open .is-menu-open, .is-menu-open * { background-color: transparent; }
 * Questo annulla QUALSIASI sfondo nel menu (anche i submenu).
 * Ora il reset è limitato solo alle parti “sporche” e lasciamo liberi i submenu.
 * ====================================================== */
body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open{
  background: rgba(255,255,255,.98) !important;
}
body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-inner,
body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-content{
  background: rgba(255,255,255,.98) !important;
}

/* (opzionale ma utile) evita “macchie” su elementi generici senza killare i submenu */
body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__container{
  background: transparent !important;
}

header.wp-block-template-part a{ color:#111 !important }

/* stato dopo scroll – richiede la classe .scrolled sul <body> (già inserita dallo script) */
body.scrolled header.wp-block-template-part{
  background:#fff !important;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:0 6px 18px rgba(0,0,0,.08) !important;
}
body.scrolled header.wp-block-template-part a{ color:#111 !important }

/************************************
 *  ELIMINA LO SPAZIO BIANCO IN ALTO
 ************************************/
/* niente block-gap globale tra fratelli */
.wp-site-blocks{ --wp--style--block-gap:0 !important; padding-top:0 !important }
/* nessun margine per l’elemento subito dopo l’header (la cover) */
.wp-site-blocks > header.wp-block-template-part + *{
  margin-top:0 !important;
  margin-block-start:0 !important;
}
/* TT25 impone 1.2rem ai figli constrained: annulla solo dopo l’header */
:root :where(.is-layout-constrained) > header.wp-block-template-part + *{
  margin-block-start:0 !important;
}

/***********************
 * COVER VIDEO (hero)
 ***********************/
/* Regole generali per eliminare margini indesiderati */
.wp-block-cover{ margin-top:0 !important; margin-block-start:0 !important }

/* Regola per il tuo specifico blocco Hero-Video */
#hero-video.wp-block-cover.alignfull{ 
    min-height:85vh !important; 
}

/* Regola per il video all'interno del blocco (OK, non crea conflitti) */
.wp-block-cover__video-background{ width:100%; height:100%; object-fit:cover }



/********************************
 *  MENU MOBILE (overlay pulito)
 ********************************/
/* Quando il menu è aperto WordPress usa .has-modal-open sul body.
   In quel momento togliamo il fixed all’header (per evitare “gabbie”)
   e rendiamo il pannello del menu FULLSCREEN. */
body.has-modal-open header.wp-block-template-part{
  position:static !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open{
  position: fixed !important;
  left: 0; right: 0;
  top: var(--adminbar-h);
  bottom: 0;                     /* IMPORTANTISSIMO */
  height: auto !important;

  z-index: 10000 !important;
  background: rgba(255,255,255,.98) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  padding-top: 0 !important;     /* non rubare spazio */
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;

  display: flex;
  flex-direction: column;
}

body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open a{
  color:#111 !important; font-size:1.1rem; padding:.9rem 0; text-align:center;
}

/* Fallback: se il tuo WP non aggiunge .has-modal-open,
   prendi il contenitore del menu quando è realmente “aperto” e forzalo fullscreen. */
@media (max-width:960px){
  .wp-block-navigation__responsive-container.is-menu-open,
  .wp-block-navigation__responsive-container[aria-hidden="false"]{
    position:fixed !important;
    inset:0; top:calc(var(--adminbar-h) + var(--header-h));
    height:calc(100vh - var(--adminbar-h) - var(--header-h)) !important;
    z-index:10000 !important;
    background:rgba(255,255,255,.98) !important;
    overflow-y:auto !important;
    display:block !important;
  }
  .wp-block-navigation__responsive-container-open,
  .wp-block-navigation__responsive-container-close{ z-index:10001 !important }
/* riduco pagging testo news home */
.wp-block-heading.wp-block-heading.has-background{
  padding-left: 0.75em !important;
  padding-right: 0.75em !important;
}
}

/* Contenitore del blocco */
.hover-card {
  background: linear-gradient(180deg, #279BDE 0%, #214588 100%) !important;
  padding: 1.5rem;
  text-align: center;
  border-radius: 8px;
  transition: background 0.2s ease,
              box-shadow 0.2s ease,
              transform 0.2s ease;
}

/* Effetto hover sul blocco intero */
.hover-card:hover {
  background: linear-gradient(180deg, #0D6EFD 0%, #11449C 100%) !important;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  transform: translateY(-2px);
}


/******************************************
 * PRENOTAZIONI ORMEGGI (ID 635)
 * - Hero compatto,  Contenuto sotto l'header fisso, Niente onda automatica
 ******************************************/

/* 1) Hero compatto e allineato sotto il menu */
body.page-id-635 main .wp-block-cover.alignfull:first-of-type {
  position: relative;
  padding-top: calc(var(--header-h) + var(--adminbar-h) + 10px);
  min-height: 320px !important;
  height: auto !important;
}

/* 2) Niente onda sotto la cover in questa pagina */
body.page-id-635 .wp-site-blocks main .wp-block-cover.alignfull:first-of-type::after {
  content: none !important;
}

/* ==== FORM PRENOTAZIONE ORMEGGI (Contact Form 7) ==== */
.cf7-ormeggio {
  max-width: none;
  width: 100%;
  margin: 0 auto 40px;
  font-size: 16px;
}

/* Fieldset “card” moderne */
.cf7-ormeggio fieldset {
  border: 1px solid #e0e4f4;
  border-radius: 12px;
  padding: 22px 22px 18px;
  margin: 0 0 24px;
  background: #ffffff;
  box-shadow: 0 14px 40px rgba(0,0,0,.04);
}

.cf7-ormeggio legend {
  font-size: 1.15rem;
  font-weight: 700;
  color: #221550;
  padding: 0 8px;
}

/* Spaziatura base tra righe del form */
.cf7-ormeggio p {
  margin: 0 0 14px;
}

/* Etichette */
.cf7-ormeggio label {
  display: block;
  font-size: .95rem;
  font-weight: 600;
  margin-bottom: 6px;
  color: #27195c;
}

/* Campi input/select/textarea */
.cf7-ormeggio input[type="text"],
.cf7-ormeggio input[type="email"],
.cf7-ormeggio input[type="tel"],
.cf7-ormeggio select,
.cf7-ormeggio textarea {
  width: 100%;
  box-sizing: border-box;
  margin:5px;
  padding: 10px 14px;
  border-radius: 12px !important;
  border: 1px solid #d4d9ea;
  background: #f6f7fc;
  font-size: .95rem;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.cf7-ormeggio p.cf7-full{
  display: block !important;
  width: 100% !important;
  margin-right: 0 !important;
}

/* Focus */
.cf7-ormeggio input[type="text"]:focus,
.cf7-ormeggio input[type="email"]:focus,
.cf7-ormeggio input[type="tel"]:focus,
.cf7-ormeggio select:focus,
.cf7-ormeggio textarea:focus {
  border-color: #295bb8;
  background: #ffffff;
  box-shadow: 0 0 0 2px rgba(41,91,184,.15);
}

/* Placeholder più chiaro */
.cf7-ormeggio ::placeholder {
  color: #9aa0bf;
}

/* Select più compatta */
.cf7-ormeggio select {
  border-radius: 12px;
}

/* --- Layout a due colonne dove ha senso (desktop) --- */
@media (min-width: 720px){
  .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(2),
  .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(3),
  .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(4) {
    display: inline-block;
    width: calc(30% );
    vertical-align: top;
  }
  .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(2),
  .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(3) {
    margin-right: 24px;
  }
  .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(4) {
    margin-right: 0;
  }
}

/* Dati personali affiancati */
@media (min-width: 720px){
  .cf7-ormeggio fieldset:nth-of-type(3) p {
    display: inline-block;
    width: calc(40% );
    margin-right: 24px;
  }
}

/* Arrivo / Partenza affiancati */
@media (min-width: 720px){
  .cf7-ormeggio fieldset:nth-of-type(4) p {
    display: inline-block;
    width: calc(40% );
    margin-right: 24px;
  }
}

/* In mobile tornano a tutta larghezza */
@media (max-width: 719px){
  .cf7-ormeggio fieldset p {
    display: block;
    width: 100%;
  }
}

/* Checkbox privacy */
.cf7-ormeggio input[type="checkbox"] {
  width: auto;
  margin-right: 8px;
}
.cf7-ormeggio fieldset:last-of-type label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: .9rem;
}
.cf7-ormeggio fieldset:last-of-type a {
  color: #295bb8;
  text-decoration: underline;
}

/* Bottoni INVIA / RESET */
.cf7-ormeggio .wpcf7-form-control.wpcf7-submit,
.cf7-ormeggio input[type="submit"] {
  display: inline-block;
  border: none;
  border-radius: 12px;
  color:#FFF;
  width:100%;
  padding: 12px 30px;
  border-radius: 25px;
  background: linear-gradient(0deg, rgb(230, 179, 92) 0%, rgb(156, 109, 28) 100%);
  font-weight: 800;
  font-size: .95rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}

.cf7-ormeggio .wpcf7-form-control.wpcf7-submit:hover,
.cf7-ormeggio input[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,0,0,.16);
  opacity: .96;
}

/* eventuale bottone reset che hai aggiunto come <button type="reset"> */
.cf7-ormeggio button[type="reset"] {
  display: inline-block;
  margin-left: 10px;
  border-radius: 12px;
  padding: 10px 22px;
  border: 1px solid #d4d9ea;
  background: #ffffff;
  color: #221550;
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
.cf7-ormeggio button[type="reset"]:hover {
  background: #f3f4fb;
  border-color: #b8c0df;
}

/* Allineamento bottoni */
.cf7-ormeggio p:last-of-type {
  margin-top: 10px;
}

/* Messaggi di errore CF7 */
.cf7-ormeggio .wpcf7-not-valid-tip {
  font-size: .8rem;
  margin-top: 4px;
  color: #d93025;
}
.cf7-ormeggio .wpcf7-response-output {
  border-radius: 12px;
  padding: 10px 14px;
  font-size: .9rem;
}

/* Allarga il wrapper CF7 dentro il gruppo alignwide della pagina ormeggi */
body.page-id-635 .wp-block-group.alignwide.is-layout-constrained > .wpcf7 {
  max-width: var(--wp--style--global--wide-size) !important;
  width: 100% !important;
}

.cf7-ormeggio fieldset:not(:last-of-type) label {
  padding-left: -10px;
  text-indent: +10px;
}

/* Icone a sinistra nelle "Procedure di Prenotazione" */
figure.procedura-icona img {
  width: 40px !important;
  height: 40px !important;
  max-width: none !important;
  object-fit: contain;
  flex-shrink: 0;
  flex-grow: 0;
}

/* Usiamo una combinazione ultra-specifica per scavalcare il tema */
html body #top-header h1#top.wp-block-heading {
    display: table !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    float: none !important;

    background-color: rgba(19, 46, 107, 0.7) !important;
    padding: 10px 25px !important;
    border-radius: 12px !important;
    color: #ffffff !important;

    max-width: fit-content !important;
    width: auto !important;
}

a { text-decoration: none !important; }

/* Solo home, evita effetti collaterali globali */
body.home .wp-block-post-content > p:empty { display: none; }
body.home .wp-block-post-content > p { margin: 0; }
body.home .wp-block-post-content { padding-top: 0.1px; }
body.home .wp-block-cover { margin-top: 0 !important; }

/* CONTATTI: pillola blu */
header.wp-block-template-part .wp-block-navigation .wp-block-navigation-item a[href*="/en/castelsardo-marina-contacts/"]{
  display:inline-block;
  background:#183B8C !important;
  color:#fff !important;
  padding:8px 14px;
  border-radius:10px;
  font-weight:600;
  line-height:1.2;
  transition:all .25s ease;
}
/* CONTACTS: pillola blu */
header.wp-block-template-part .wp-block-navigation .wp-block-navigation-item a[href*="/contatti"]{
  display:inline-block;
  background:#183B8C !important;
  color:#fff !important;
  padding:8px 14px;
  border-radius:10px;
  font-weight:600;
  line-height:1.2;
  transition:all .25s ease;
}

/* 1. Reset e Layout Squadrato Morbido */
.wp-block-button.btn-whatsapp a.wp-block-button__link {
    background-color: #25D366 !important;
    color: transparent !important;
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 50px !important;
    height: 40px !important;
    border-radius: 12px !important;

    padding: 0 !important;
    border: none !important;
    position: relative;
    min-width: 50px;
    overflow: hidden;
}

/* 2. Icona centrata */
.wp-block-button.btn-whatsapp a.wp-block-button__link::before {
    content: '';
    display: block;
    position: absolute;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='white' d='M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.1 0-65.6-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.4 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-5.5-2.8-23.2-8.5-44.2-27.1-16.4-14.6-27.4-32.7-30.6-38.2-3.2-5.6-.3-8.6 2.4-11.4 2.5-2.5 5.5-6.5 8.3-9.7 2.8-3.2 3.7-5.5 5.6-9.2 1.9-3.7 1-6.9-.5-9.7-1.4-2.8-12.4-29.9-17-41.1-4.5-10.9-9.1-9.4-12.4-9.6-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 13.2 5.8 23.5 9.2 31.5 11.8 13.3 4.2 25.4 3.6 34.9 2.2 10.6-1.5 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

/* 3. Rimuovi ombre o stili del tema che potrebbero sporcarlo */
.btn-whatsapp {
    border: none !important;
    box-shadow: none !important;
    background: none !important;
}

/* Bordo anche su CONTATTI per avere il “gruppo” completo */
header.wp-block-template-part .wp-block-navigation .wp-block-navigation-item a[href*="/contatti"]{
  border-right:none !important;
}

/* Hover */
header.wp-block-template-part .wp-block-navigation .wp-block-navigation-item a[href*="/contatti"]:hover{
  background:#0f2d73 !important;
}
header.wp-block-template-part .wp-block-navigation a[href^="tel:"]:hover{
  background:#f1f1f1 !important; color:#0f2d73 !important;
}

/* Menu mobile: pulsanti interi separati */
body.has-modal-open .wp-block-navigation__responsive-container a[href*="/contatti"],
body.has-modal-open .wp-block-navigation__responsive-container a[href^="tel:"]{
  display:block !important;
  width:100%;
  margin:4px 0;
  border-radius:8px !important;
  border-right:2px solid #183B8C !important;
}

/* ===== ONDA IN FONDO AL PRIMO BLOCCO COVER ===== */
:root{
  --wave-min: 44px;
  --wave-max: 120px;
  --wave-ratio: 12;
}

/* ===== ONDA IN FONDO SOLO HERO (HOME) ===== */
body.home .wp-block-post-content > .wp-block-cover.alignfull:first-of-type{
  position: relative;
  overflow: visible;
}

body.home .wp-block-post-content > .wp-block-cover.alignfull:first-of-type::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:-1px;
  width:100%;
  height: clamp(var(--wave-min), calc(100vw / var(--wave-ratio)), var(--wave-max));
  pointer-events:none;
  z-index:2;
  background-image:url("https://www.marinadicastelsardo.com/wp-content/uploads/2025/11/wave-top3-00db3c.svg");
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:100% auto;
}

/* bordi stondati */
.wp-block-media-text.stondato img { border-radius: 20px; }

/*mobileheight*/
/***********************
 * VARIABILI
 ***********************/
:root{
  --header-h: 90px;
  --adminbar-h: 0px;
  --hero-xs: 90svh;
  --hero-sm: 90svh;
  --hero-wp: 90svh;
  --hero-md: 90svh;
  --hero-lg: 90svh;
  --hero-xl: 100svh;
  --hero-bonus: 12svh;
}
body.admin-bar{ --adminbar-h: 32px; }
@media (max-width:782px){ body.admin-bar{ --adminbar-h: 46px; }}

/***********************
 * RESET SPAZIO PRIMO BLOCCO
 ***********************/
.wp-site-blocks{ --wp--style--block-gap:0 !important; padding-top:0 !important; }
.wp-site-blocks > header.wp-block-template-part + *{
  margin-top:0 !important; margin-block-start:0 !important;
}

/***********************
 * HERO COVER (PRIMA COVER)
 ***********************/
.home .wp-block-cover.alignfull:first-of-type{
  position: relative;
  padding-top: calc(var(--header-h) + var(--adminbar-h) + env(safe-area-inset-top, 0px));
  margin-top:0 !important; margin-block-start:0 !important;
  min-height: calc(var(--hero-xl) - var(--header-h) - var(--adminbar-h)) !important;
}
body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
  min-height: calc(var(--hero-xl) - var(--header-h)) !important;
}

/* Video a pieno contenitore */
.home .wp-block-cover.alignfull:first-of-type .wp-block-cover__video-background{
  width:100%; height:100%; object-fit:cover;
}

/* Contenuto sopra video/onda */
.home .wp-block-cover.alignfull:first-of-type .wp-block-cover__inner-container{
  position: relative; z-index: 3; padding: 24px 16px 64px;
}

/***********************
 * BREAKPOINTS
 ***********************/
@media (max-width:1279px) and (min-width:1025px){
  .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-lg) - var(--header-h) - var(--adminbar-h)) !important;
  }
  body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-lg) - var(--header-h)) !important;
  }
}

@media (max-width:1024px) and (min-width:783px){
  .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-md) - var(--header-h) - var(--adminbar-h)) !important;
  }
  body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-md) - var(--header-h)) !important;
  }
}

@media (max-width:782px) and (min-width:641px){
  .home .wp-block-cover.alignfull:first-of-type{
    padding-top: calc(var(--header-h) + var(--adminbar-h) + env(safe-area-inset-top, 0px) + 8px);
    min-height: calc(var(--hero-wp) + var(--hero-bonus) - var(--header-h) - var(--adminbar-h)) !important;
  }
  body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-wp) + var(--hero-bonus) - var(--header-h)) !important;
  }
}

@media (max-width:640px) and (min-width:481px){
  .home .wp-block-cover.alignfull:first-of-type{
    padding-top: calc(var(--header-h) + var(--adminbar-h) + env(safe-area-inset-top, 0px) + 8px);
    min-height: calc(var(--hero-sm) + var(--hero-bonus) - var(--header-h) - var(--adminbar-h)) !important;
  }
  body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-sm) + var(--hero-bonus) - var(--header-h)) !important;
  }
}

@media (max-width:480px){
  .home .wp-block-cover.alignfull:first-of-type{
    padding-top: calc(var(--header-h) + var(--adminbar-h) + env(safe-area-inset-top, 0px) + 8px);
    min-height: calc(var(--hero-xs) + var(--hero-bonus) - var(--header-h) - var(--adminbar-h)) !important;
  }
  body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(var(--hero-xs) + var(--hero-bonus) - var(--header-h)) !important;
  }
  .home .wp-block-cover.alignfull:first-of-type .wp-block-cover__inner-container{
    padding: 20px 14px 56px;
  }
}

@media (orientation:landscape) and (max-height:500px){
  .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(100lvh - var(--header-h) - var(--adminbar-h)) !important;
  }
  body:not(.admin-bar) .home .wp-block-cover.alignfull:first-of-type{
    min-height: calc(100lvh - var(--header-h)) !important;
  }
}

/***********************
 * ONDA sotto il testo (pseudo-elemento)
 ***********************/
.wp-site-blocks main .wp-block-cover.alignfull:first-of-type::after{
  z-index: 2;
}

/* Nascondi eventuale onda duplicata <figure> sotto l'hero su mobile */
@media (max-width:782px){
  .home .wp-block-post-content > figure.wp-block-image.wp-image-98,
  .home .wp-block-post-content > figure.wp-block-image img[src*="wave-top"]{
    display:none !important;
  }
}

/***********************
 * TIPOGRAFIA HERO
 ***********************/
@media (max-width:1024px){
  .home .wp-block-cover.alignfull:first-of-type h1{ font-size: clamp(1.8rem, 3.5vw, 2.2rem); }
  .home .wp-block-cover.alignfull:first-of-type p{  font-size: clamp(1rem, 2.6vw, 1.15rem); }
}
@media (max-width:640px){
  .home .wp-block-cover.alignfull:first-of-type h1{ font-size: clamp(1.6rem, 5vw, 2rem); }
  .home .wp-block-cover.alignfull:first-of-type p{  font-size: clamp(.95rem, 3.6vw, 1.05rem); }
}


/* **** icone servizi **** */
.wp-block-columns.icone-marina{
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 16px;
  align-items: start;
}
.wp-block-columns.icone-marina > .wp-block-column{
  margin: 0 !important;
  flex: none !important;
  width: auto !important;
}
@media (max-width: 1024px){
  .wp-block-columns.icone-marina{
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
}
@media (max-width: 781px){
  .wp-block-columns.icone-marina{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
.wp-block-columns.icone-marina .wp-block-column{ text-align: center; }
.wp-block-columns.icone-marina .wp-block-image{ margin-inline: auto; }

/* Cover con altezza fissa personalizzata */
.home .wp-block-cover.cover-fixed-height{
  height: 300px !important;
  min-height: 300px !important;
  display: flex;
  align-items: center;
}
.home .wp-block-cover.cover-fixed-height .wp-block-cover__inner-container{
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
.home .wp-block-cover.cover-fixed-height p{
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}

/* sezione ambiente e sicurezza: altezza in base al contenuto, non fissa */
.home .wp-block-cover.ticss-30184161{
  min-height: auto !important;
  height: auto !important;
  padding-top: 30px;
  padding-bottom: 30px;
}

/* Solo articoli: sovrascrivo l'altezza */
body.single-post .cover-fixed-height {
    height: 300px !important;
    min-height: 300px !important;
    max-height: 300px !important;
}

/* Ritaglio immagine solo per articoli */
body.single-post .cover-fixed-height .wp-block-cover__image-background {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
    background-size: cover !important;
    background-position: center !important;
}

/* Mantieni l'interno controllato negli articoli */
body.single-post .cover-fixed-height .wp-block-cover__inner-container {
    padding: 20px !important;
}

/* SOLO articoli – sfondo bianco semitrasparente dietro al titolo nella cover */
body.single-post .wp-block-cover .wp-block-post-title {
    display: inline-block;
    background: rgba(255, 255, 255, 0.75);
    color: #221550 !important;
    padding: 10px !important;
    border-radius: 6px;
    backdrop-filter: blur(4px);
}

/* Su mobile: icona + testo restano sulla stessa riga */
@media (max-width: 781px){
  .wp-block-columns.icon-text-row{
    flex-wrap: nowrap !important;
    align-items: flex-start;
    column-gap: 10px;
  }
  .wp-block-columns.icon-text-row > .wp-block-column{ margin: 0 !important; }
  .wp-block-columns.icon-text-row > .wp-block-column:first-child{
    flex: 0 0 20% !important;
    max-width: 20% !important;
  }
  .wp-block-columns.icon-text-row > .wp-block-column:last-child{
    flex: 0 0 80% !important;
    max-width: 80% !important;
    min-width: 0;
  }
}

.tpg-widget-heading-wrapper.tpg-widget-heading-wrapper { display: none !important; }

.pillola-testo { font-size: 0.7rem !important; }
@media (max-width: 781px) { .pillola-testo { font-size: 1.1rem !important; } }

footer .wp-block-cover__background.has-background-dim { background-color: #221550 !important; }

/* Pulsanti DETTAGLI per lo shortcode TPG con data-sc-id=462 */
.tpg-shortcode-main-wrapper[data-sc-id="462"] .read-more a {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    background: linear-gradient(0deg, #295BB8 0%, #221550 100%) !important;
    border-radius: 20px !important;
    padding: 12px 20px !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    text-transform: uppercase;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .read-more a:hover { opacity: 0.9; }

/* CARD tutte stessa altezza + pulsante in basso */
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-grid-item {
    display: flex !important;
    flex-direction: column;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-holder {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
    border-radius: 20px;
    background: #ffffff;
    overflow: hidden;
    padding: 20px 20px 24px;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-holder .rt-row {
    display: flex !important;
    flex: 1 1 auto;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-holder .rt-row > .rt-col-sm-5,
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-holder .rt-row > .rt-col-sm-7 {
    float: none !important;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-holder .rt-row > .rt-col-sm-7 {
    display: flex !important;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-detail {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
}
.tpg-shortcode-main-wrapper[data-sc-id="462"] .rt-detail .read-more {
    margin-top: auto !important;
    width: 100%;
    display: block;
}

/* Classe personalizzata per arrotondare solo le immagini selezionate */
.round-image img { border-radius: 20px; overflow: hidden; }
.wp-block-image.round-image figure { border-radius: 20px; overflow: hidden; }

/* CLASSE PER IL CONTENITORE */
.centra-titoli { text-align: center; }

/* CLASSE GENERALE (H1 E P) */
.sfondo-titolo {
    display: block !important;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
    color: white !important;
    background-color: rgba(230, 179, 92, 0.9) !important;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
    z-index: 10;
}

/* REGOLA PER IL PULSANTE */
.wp-block-button { text-align: center; }

/* Tabella responsive */
@media screen and (max-width: 768px) {
    .tabella-mobile-scroll table {
        table-layout: auto !important;
        width: auto !important;
        min-width: 600px !important;
    }
    .tabella-mobile-scroll {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        width: 100%;
    }
    .tabella-mobile-scroll table th,
    .tabella-mobile-scroll table td {
        white-space: nowrap;
    }
}

/* data field in booking */
.cf7-ormeggio input[type="date"] {
    width: 100%;
    box-sizing: border-box;
    margin: 5px;
    padding: 10px 14px;
    border-radius: 12px !important;
    border: 1px solid #d4d9ea;
    background: #f6f7fc;
    font-size: .95rem;
    color: #27195c;
    outline: 0;
    min-height: 45px;
    font-family: inherit;
}
@media (min-width: 720px) {
    .cf7-ormeggio fieldset:nth-of-type(2) p {
        display: inline-block;
        width: calc(45%);
        vertical-align: top;
        margin-right: 15px;
    }
}

/*table first row strong */
.wp-block-table tr:first-child td, 
.wp-block-table thead th {
    font-weight: bold !important;
    color: #221550;
}

/**
 * Gutenberg - Classe custom: paragrafo a larghezza ampia 1340px
 */
.egsb-wide-1340{
  max-width: 1340px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.is-layout-constrained > .egsb-wide-1340{
  max-width: 1340px;
  width: 100%;
}

/* ================================
   FIX MENU MOBILE LUNGO – SCROLL OK
   ================================ */
body.has-modal-open
.wp-block-navigation__responsive-container.is-menu-open{
  position: fixed !important;
  inset: auto 0 0 0 !important;
  top: var(--adminbar-h) !important;
  bottom: 0 !important;

  height: auto !important;
  max-height: calc(100vh - var(--adminbar-h)) !important;

  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;

  display: block !important;
  padding: 0 !important;
  z-index: 10000 !important;
}

/* padding SOLO al contenuto */
body.has-modal-open
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-content{
  padding-top: calc(var(--header-h) + 12px) !important;
  padding-bottom: calc(24px + env(safe-area-inset-bottom,0px)) !important;
  box-sizing: border-box;
}

/* ======================================================
   FIX MENU MOBILE: scroll fino in fondo (anche col bottone WhatsApp)
   ====================================================== */

/* Overlay: fullscreen reale (adminbar esclusa) */
body.has-modal-open #modal-1.wp-block-navigation__responsive-container{
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  top: var(--adminbar-h) !important;
  bottom: 0 !important;
  height: auto !important;

  overflow: hidden !important;
  background: rgba(255,255,255,.98) !important;
  z-index: 10000 !important;

  padding-top: 0 !important;
}

/* Il vero contenuto scrollabile */
body.has-modal-open #modal-1-content.wp-block-navigation__responsive-container-content{
  height: calc(100svh - var(--adminbar-h)) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;

  padding-top: calc(var(--header-h) + 12px) !important;
  padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;

  box-sizing: border-box !important;
}

/* Evita che il blocco bottoni crei “tagli” */
body.has-modal-open #modal-1-content .wp-block-buttons{
  margin-top: 18px !important;
  margin-bottom: 0 !important;
  width: 100%;
}

/* ======================================================
   MENU MOBILE: WhatsApp sempre visibile + spazio extra
   ====================================================== */
@media (max-width:960px){

  body.has-modal-open #modal-1-content{
    padding-bottom: calc(140px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.has-modal-open #modal-1-content .wp-block-buttons{
    position: sticky !important;
    bottom: 0 !important;
    z-index: 5 !important;

    padding: 12px 0 calc(12px + env(safe-area-inset-bottom, 0px)) !important;

    background: rgba(255,255,255,.98) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);

    margin-top: 18px !important;
    margin-bottom: 0 !important;
  }

  body.has-modal-open #modal-1-content .wp-block-button,
  body.has-modal-open #modal-1-content .wp-block-button__link{
    width: 100% !important;
  }

  .wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content{
    margin-bottom:200px;
  }
}

/* =========================================================
 * FIX DEFINITIVO: SUBMENU MOBILE - sfondo grigio sulle righe
 * Target: voci tipo "Tariffe", "Gestione" dentro il submenu
 * ========================================================= */
@media (max-width: 960px){

  /* 1) Forza il contenitore submenu a comportarsi “a righe” */
  body.has-modal-open #modal-1-content ul.wp-block-navigation__submenu-container{
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  /* 2) Metti sfondo sul LI (fallback) */
  body.has-modal-open #modal-1-content ul.wp-block-navigation__submenu-container > li{
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #f2f2f2 !important;
    border-bottom: 1px solid rgba(0,0,0,.08) !important;
  }

  /* 3) Metti sfondo ANCHE sul link (questa è la “riga vera”) */
  body.has-modal-open #modal-1-content ul.wp-block-navigation__submenu-container > li > a.wp-block-navigation-item__content{
    display: block !important;
    width: 100% !important;

    /* sovrascrive la tua regola globale che centra tutto */
    text-align: left !important;

    /* padding riga submenu */
    padding: 12px 14px 12px 28px !important;

    background: #f2f2f2 !important;
    background-color: #f2f2f2 !important;
  }

  /* 4) Se qualche tema “pittura” lo span interno, blindiamo anche quello */
  body.has-modal-open #modal-1-content ul.wp-block-navigation__submenu-container > li > a.wp-block-navigation-item__content > span{
    background: transparent !important;
  }

  /* Hover/tap */
  body.has-modal-open #modal-1-content ul.wp-block-navigation__submenu-container > li:hover,
  body.has-modal-open #modal-1-content ul.wp-block-navigation__submenu-container > li:hover > a.wp-block-navigation-item__content{
    background: #eaeaea !important;
    background-color: #eaeaea !important;
  }
	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item {background-color: #e6b35c !important;}
	
}
/**
 * =========================================================
 * Gutenberg Navigation submenu
 * - rounded corners
 * - orange bottom line
 * =========================================================
 */

/* il pannello dropdown */
.wp-block-navigation__submenu-container{
  border-radius: 12px !important;
  overflow: hidden !important; /* fa rispettare il radius */
  border: 1px solid rgba(0,0,0,.12) !important;

  /* riga arancione al fondo */
  border-bottom: 4px solid #cfa04eff !important;

  /* (opzionale) un po' di respiro */
  padding: 8px 0 !important;
}

/* se il tema mette background e ti “spacca” l'effetto */
.wp-block-navigation__submenu-container.has-background{
  background-color: #fff !important;
}

/* link nel submenu: allineamento e hover */
.wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  display: block;
  padding: 10px 14px;
}

/* evita che l'ultimo item copra la riga arancione */
.wp-block-navigation__submenu-container .wp-block-navigation-item:last-child{
  margin-bottom: 0 !important;
}
/**
 * =========================================================
 * WP Block Navigation - FORCE HAMBURGER < 1024 (MDC)
 * - Nasconde menu orizzontale desktop
 * - Mostra hamburger
 * - Overlay cliccabile solo quando aperto (evita X sopra hamburger)
 * =========================================================
 */
@media (max-width: 1024px){

  /* 1) nascondi il menu "desktop" (UL orizzontale) */
  nav.wp-block-navigation.is-horizontal > ul.wp-block-navigation__container,
  nav.wp-block-navigation.is-horizontal > .wp-block-navigation__container{
    display: none !important;
  }

  /* 2) hamburger sempre visibile e cliccabile */
  nav.wp-block-navigation .wp-block-navigation__responsive-container-open{
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 100010 !important;
  }

  /* 3) overlay: di default non deve bloccare click */
  nav.wp-block-navigation > .wp-block-navigation__responsive-container{
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 100000 !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* overlay aperto: ora intercetta click */
  nav.wp-block-navigation > .wp-block-navigation__responsive-container.is-menu-open{
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* la X non deve esistere quando chiuso (extra sicurezza) */
  nav.wp-block-navigation > .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-close{
    display: none !important;
  }
}
/**
 * =========================================================
 * FIX overlay menu sopra HERO/VIDEO (stacking + pannello)
 * =========================================================
 */
@media (max-width: 1024px){

  /* overlay FULLSCREEN sopra TUTTO */
  nav.wp-block-navigation > .wp-block-navigation__responsive-container{
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;

    /* fondamentale: deve stare sopra video/hero */
    z-index: 999999 !important;

    /* backdrop */
    background: rgba(0,0,0,.45) !important;
  }

  /* contenuto (il pannello vero e proprio) */
  nav.wp-block-navigation
    > .wp-block-navigation__responsive-container
    .wp-block-navigation__responsive-dialog{
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;           /* pannello a destra */
    width: min(380px, 88vw) !important;
    height: 100vh !important;
    overflow: auto !important;

    background: #fff !important;
    box-shadow: -12px 0 30px rgba(0,0,0,.25) !important;
  }

  /* se preferisci pannello a sinistra su mobile, cambia right->left qui */
  /* @media (max-width: 600px){
      nav.wp-block-navigation
        > .wp-block-navigation__responsive-container
        .wp-block-navigation__responsive-dialog{
        right:auto !important;
        left:0 !important;
      }
  } */

  /* la X sempre sopra e cliccabile */
  nav.wp-block-navigation
    > .wp-block-navigation__responsive-container
    .wp-block-navigation__responsive-container-close{
    position: sticky !important;
    top: 0 !important;
    z-index: 1000000 !important;
    margin-left: auto !important;
  }

  /* EXTRA: se qualche hero/video ha z-index altissimo, lo “tagliamo” */
  .wp-block-cover,
  .wp-block-cover__video-background,
  .wp-block-video video,
  .wp-block-cover video{
    z-index: 1 !important;
  }
}
/**
 * =========================================================
 * Menu overlay: larghezza + padding contenuto
 * =========================================================
 */
@media (max-width: 1024px){

  /* allarga pannello di circa 50px */
  nav.wp-block-navigation 
  > .wp-block-navigation__responsive-container 
  .wp-block-navigation__responsive-dialog{

    width: min(430px, 92vw) !important;   /* prima era ~380px */
  }

  /* padding interno del contenuto */
  nav.wp-block-navigation 
  > .wp-block-navigation__responsive-container 
  .wp-block-navigation__responsive-container-content{

    padding: 10px !important;
  }
}
/* =========================================================
 * EG Lang Dropdown - stile menu bandiere
 * - box bianco
 * - non trasparente
 * - sempre sopra (z-index)
 * - non taglia le lingue
 * ========================================================= */

.eg-lang-dd{
  position: relative;
  display: inline-block;
}

.eg-lang-dd__summary{
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 6px;
  /*border: 1px solid rgba(0,0,0,.15);*/
  border-radius: 999px;
  background: #fff;
	margin-right: 18px;
}

.eg-lang-dd__summary::-webkit-details-marker{ display:none; }

.eg-lang-dd__current img,
.eg-lang-dd__menu img{
  display: block;
  width: 18px;
  height: auto;
}

.eg-lang-dd__menu{
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 99999;

  background: #fff !important;
  background-color: #fff !important;
  /*border: 1px solid rgba(0,0,0,.15);*/
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);

  padding: 8px;
  display: none;

  /* importante: non tagliare gli item */
  max-height: none;
  overflow: visible;
  white-space: nowrap;
}

.eg-lang-dd[open] .eg-lang-dd__menu{ display: flex; }

.eg-lang-dd__menu{ flex-direction: column; }

.eg-lang-dd__item{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  border-radius: 8px;
}

.eg-lang-dd__item:hover{
  background: rgba(0,0,0,.06);
}

.eg-lang-dd__item.is-current{
  outline: 1px solid rgba(0,0,0,.15);
  outline-offset: 1px;
}
header.wp-block-template-part details.eg-lang-dd[open] > .eg-lang-dd__menu{
  gap: 14px !important;      /* spazio tra bandiere */
  padding: 12px !important;  /* padding interno del box */
}
/* =========================================================
 * OVERRIDE header "tutto trasparente" per eg-lang-dd
 * ========================================================= */

header.wp-block-template-part details.eg-lang-dd,
header.wp-block-template-part details.eg-lang-dd > summary.eg-lang-dd__summary,
header.wp-block-template-part details.eg-lang-dd > .eg-lang-dd__menu,
header.wp-block-template-part details.eg-lang-dd > .eg-lang-dd__menu *{
  background: #fff !important;
  background-color: #fff !important;
  opacity: 1 !important;
}

/* =========================================================
 * EG Lang Dropdown
 * - CHIUSO: summary trasparente
 * - HOVER o OPEN: summary bianco
 * - MENU: bianco solo quando open
 * ========================================================= */

/* 1) Stato chiuso: summary trasparente */
header.wp-block-template-part details.eg-lang-dd:not([open]) > summary.eg-lang-dd__summary{
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* 2) Hover sul controllo (anche se chiuso): summary bianco */
header.wp-block-template-part details.eg-lang-dd:not([open]):hover > summary.eg-lang-dd__summary{
  background: #fff !important;
  background-color: #fff !important;
}

/* 3) Stato open: summary bianco */
header.wp-block-template-part details.eg-lang-dd[open] > summary.eg-lang-dd__su
/* =========================================================
 * EG Lang Dropdown - remove black border / focus ring
 * ========================================================= */

header.wp-block-template-part details.eg-lang-dd > summary.eg-lang-dd__summary{
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* se il nero appare quando clicchi (focus) */
header.wp-block-template-part details.eg-lang-dd > summary.eg-lang-dd__summary:focus,
header.wp-block-template-part details.eg-lang-dd > summary.eg-lang-dd__summary:focus-visible{
  outline: none !important;
  box-shadow: none !important;
}

/* a volte il tema mette un bordo via pseudo-elemento */
header.wp-block-template-part details.eg-lang-dd > summary.eg-lang-dd__summary::before,
header.wp-block-template-part details.eg-lang-dd > summary.eg-lang-dd__summary::after{
  border: 0 !important;
  box-shadow: none !important;
}
.eg-lang-dd__quick{ display:inline-flex; align-items:center; }
.eg-lang-dd__quick img{ display:block; }
/* =========================================================
 * EG Lang Dropdown - size flags
 * ========================================================= */
header.wp-block-template-part .eg-lang-dd__current img,
header.wp-block-template-part .eg-lang-dd__menu img{
  width: 22px !important;   /* prova 20–26 */
  height: auto !important;
}
