@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url("https://use.typekit.net/ixf8ain.css");


/**********************FAQ**************************/

/* Fattore di scala attuale (le dimensioni sono state confermate) */
:root {
    --scale-factor: 1;
    --bg-color: #ECE6E8; /* Colore di sfondo richiesto */
    --primary-text-color: #333; /* Grigio scuro per il testo principale */
    --secondary-text-color: #333; /* Grigio medio per testo secondario/dettagli */
    --light-border: rgba(0, 0, 0, 0.1); /* Bordo leggero per gli elementi */
    --glass-bg-light: rgba(190, 180, 185, 0.4); /* Sfondo vetro fumè chiaro - leggermente grigiastro e più opaco */
    --glass-bg-dark: rgba(190, 180, 185, 0.55); /* Sfondo vetro fumè più opaco per elementi aperti */
    --box-shadow-light: rgba(0, 0, 0, 0.08); /* Ombra più delicata */
    --box-shadow-medium: rgba(0, 0, 0, 0.12); /* Ombra leggermente più pronunciata */
    --yellow-accent: rgb(175, 184, 189); /* Un giallo leggermente meno saturo */
}

/* Sezione FAQ Generale */
.faq-section {
    background-color: transparent; /* Lo sfondo è sul body, questa sezione è trasparente */
    color: var(--primary-text-color);
    font-family: "Figtree", sans-serif;
    padding: calc(80px * var(--scale-factor)) calc(60px * var(--scale-factor));
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}

/* Intestazione FAQ */
.faq-header {
    text-align: center;
    margin-bottom: calc(50px * var(--scale-factor));
}

.faq-subtitle {
font-family: 'Montserrat', sans-serif;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 12px;
  color: #2d2d2d;
}

.faq-title {
font-family: 'Montserrat', sans-serif;
  text-align: center;
  font-size: 30px;
  color: #2d2d2d;
  line-height: 40px;
}

/* Contenitore delle singole FAQ */
.faq-container {
    display: flex;
    flex-direction: column;
    gap: calc(20px * var(--scale-factor));
    max-width: calc(1000px * var(--scale-factor));
    margin: 0 auto;
    padding: 0 calc(60px * var(--scale-factor));
    box-sizing: border-box;
}

/* Singola FAQ Item (details element) */
.faq-item {
    border-radius: calc(20px * var(--scale-factor));
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
    overflow: visible;
}

/* Aggiungi questo al tuo CSS esistente per nascondere le FAQ */
.faq-item.hidden {
    display: none; /* Nasconde l'elemento */
}
    
/* La summary che contiene le 3 "colonne" */
.faq-question-summary {
    display: flex;
    align-items: center;
    padding: 0;
    cursor: pointer;
    font-size: calc(1.3rem * var(--scale-factor));
    font-weight: 600;
    color: var(--primary-text-color);
    line-height: 1.5; /* Aumentata la line-height per le domande */
    transition: color 0.3s ease;
    -webkit-tap-highlight-color: transparent;
    margin: 0 calc(-60px * var(--scale-factor));
}

.faq-question-summary:hover .faq-question-main {
    color: var(--primary-text-color); /* Mantieni il colore principale */
}

/* Contenitore del numero (colonna sinistra) */
.faq-number-container {
    flex-shrink: 0;
    padding: 0 calc(20px * var(--scale-factor));
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Il cerchio giallo del numero */
.faq-number {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: calc(50px * var(--scale-factor));
    height: calc(50px * var(--scale-factor));
    border-radius: 50%;
    background-color: none; /* Usa la nuova variabile accent-color */
    color: #b5b0b2;
    font-size: calc(1.4rem * var(--scale-factor));
    font-weight: 400;
    border: 1px solid rgba(0, 0, 0, 0.2); /* Bordo più leggero */
    text-shadow: none; /* Rimuovi text-shadow per un look più neutro */
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}

/* Blocco centrale del testo della domanda */
.faq-question-main {
    flex-grow: 1;
    background-color: #f2f0f1!important; /* Sfondo vetro fumè chiaro */
    border-radius: calc(20px * var(--scale-factor));
    padding: calc(25px * var(--scale-factor)) calc(30px * var(--scale-factor));
    box-shadow: 0 calc(5px * var(--scale-factor)) calc(15px * var(--scale-factor)) var(--box-shadow-light);
    transition: background-color 0.3s ease, box-shadow 0.3s ease, border-radius 0.3s ease;
    color: var(--primary-text-color);
    border: 1px solid var(--light-border); /* Aggiungo un bordo sottile */
    backdrop-filter: blur(8px); /* Effetto glass */
    -webkit-backdrop-filter: blur(8px);
		font-family: 'Montserrat', sans-serif;
  font-weight: bold;
  font-size: 13px;
  color: #2d2d2d;
}

.faq-item[open] .faq-question-main {
    background-color: var(--glass-bg-dark); /* Sfondo vetro fumè più opaco quando aperto */
    box-shadow: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: none; /* Nessun bordo sotto quando aperto per unire con la risposta */
	font-family: 'Montserrat', sans-serif;
  font-weight: bold;
  font-size: 13px;
  color: #2d2d2d;
}

/* Contenitore dell'icona (colonna destra) */
.faq-icon-container {
    flex-shrink: 0;
    padding: 0 calc(20px * var(--scale-factor));
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Il cerchio con icona +/- */
.faq-icon-wrapper {
    width: calc(50px * var(--scale-factor));
    height: calc(50px * var(--scale-factor));
    background-color: #f2f0f1;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none; /* Bordo leggero */
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor)) var(--box-shadow-light);
}

.faq-icon {
    font-size: calc(2.2rem * var(--scale-factor));
    font-weight: 200;
    line-height: 1;
    color: var(--primary-text-color); /* Colore dell'icona neutrale */
    transition: transform 0.3s ease;
}

/* Nasconde l'icona di default del browser per details/summary */
.faq-item > summary::-webkit-details-marker {
    display: none;
}
.faq-item > summary::marker {
    display: none;
}

/* Nasconde l'icona minus (-) quando la FAQ è chiusa e mostra plus (+) */
.faq-item:not([open]) .faq-icon.minus {
    display: none;
}

/* Nasconde l'icona plus (+) quando la FAQ è aperta e mostra minus (-) */
.faq-item[open] .faq-icon.plus {
    display: none;
}

/* Contenuto della risposta FAQ (il contenitore della transizione) */
.faq-answer-content {
    background-color: #f2f0f1!important; /* Sfondo vetro fumè per il contenuto aperto */
    border-bottom-left-radius: calc(20px * var(--scale-factor));
    border-bottom-right-radius: calc(20px * var(--scale-factor));
    box-shadow: none;
    border: 1px solid var(--light-border); /* Aggiungo un bordo sottile */
    border-top: none; /* Nessun bordo superiore per unire con la domanda */
    /* Usiamo Grid per la transizione dell'altezza */
    display: grid;
    grid-template-rows: 0fr; /* Inizia a 0 altezza per il contenuto */
    transition: grid-template-rows 0.4s ease-out, background-color 0.3s ease, border-radius 0.3s ease, box-shadow 0.3s ease;
    backdrop-filter: blur(8px); /* Effetto glass */
    -webkit-backdrop-filter: blur(8px);
    margin: 0 calc(30px * var(--scale-factor));
}

/* Applica il padding al contenuto interno */
.faq-answer-inner {
    overflow: hidden; /* Nasconde il contenuto quando la riga è 0fr */
    padding: calc(20px * var(--scale-factor)) calc(30px * var(--scale-factor)) calc(25px * var(--scale-factor));
    font-size: 12px;
    color: var(--secondary-text-color); /* Colore più neutro per la risposta */
    line-height: 1.6;
			font-family: 'Montserrat', sans-serif;
  color: #969595;
}

.faq-item[open] .faq-answer-content {
    grid-template-rows: 1fr; /* Quando aperto, occupa la riga */
}

.faq-answer {
    margin: 0;
}

/* Pulsante "Show more" */
.faq-footer {
    text-align: center;
    margin-top: calc(40px * var(--scale-factor));
}

.show-more-button {
    background-color: var(--glass-bg-light); /* Sfondo vetro fumè per il pulsante */
    color: var(--yellow-accent);
    border: 1px solid var(--light-border);
    padding: calc(15px * var(--scale-factor)) calc(30px * var(--scale-factor));
    border-radius: calc(30px * var(--scale-factor));
    font-size: calc(1.1rem * var(--scale-factor));
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor)) var(--box-shadow-light);
}

.show-more-button:hover {
    background-color: var(--glass-bg-dark); /* Sfondo più opaco al hover */
    border-color: rgba(0, 0, 0, 0.2);
    box-shadow: 0 calc(3px * var(--scale-factor)) calc(8px * var(--scale-factor)) var(--box-shadow-medium);
}

/* Media Queries per la responsività */
/* Per schermi fino a 1000px (desktop più piccoli e tablet in landscape) */
@media (max-width: 1000px) {
    .faq-section {
        padding: calc(80px * var(--scale-factor)) calc(25px * var(--scale-factor));
    }
    .faq-container {
        padding: 0 calc(25px * var(--scale-factor));
    }
    .faq-question-summary {
        margin: 0 calc(-25px * var(--scale-factor));
        line-height: 1.5;
    }
    .faq-question-main {
        padding: calc(25px * var(--scale-factor)) calc(22px * var(--scale-factor));
    }
    .faq-icon-container {
        padding-right: calc(15px * var(--scale-factor));
    }
    .faq-number-container {
        padding-left: calc(15px * var(--scale-factor));
    }
    .faq-item[open] .faq-answer-content{
    margin-right: 60px;
    margin-left: 60px;
    }
}

@media (max-width: 768px) {
    .faq-section {
        padding: 60px 15px;
    }
    .faq-title {
        font-size: 2.5rem;
        line-height: 1.35;
    }

    .faq-question-summary {
        font-size: 1.2rem;
        margin: 0;
        line-height: 1.5;
    }

    .faq-number-container {
        display: none;
    }

    .faq-container {
        padding: 0 15px;
    }

    .faq-question-main {
        padding: 20px 20px;
    }

    .faq-icon-container {
        padding-left: 15px;
        padding-right: 0;
    }
    .faq-icon-wrapper {
        width: 45px;
        height: 45px;
    }

    .faq-icon {
        font-size: 2rem;
    }

    .faq-answer-inner {
        padding: 15px 25px 20px;
        font-size: 1rem;
    }
    
    .faq-item[open] .faq-answer-content{
    margin-right: 52px;
    margin-left: 0px;
    }
    
}

@media (max-width: 480px) {

.sparire {padding:0px!important;}

    .faq-section {
        padding: 50px 10px;
    }
    .faq-title {
        font-size: 2rem;
        line-height: 1.35;
    }

    .faq-question-summary {
        font-size: 1.1rem;
        margin: 0;
        line-height: 1.5;
    }

    .faq-container {
        padding: 0 10px;
    }

    .faq-question-main {
        padding: 18px 18px;
    }

    .faq-icon-container {
        padding-left: 12px;
        padding-right: 0;
    }

    .faq-icon-wrapper {
        width: 40px;
        height: 40px;
    }

    .faq-icon {
        font-size: 1.8rem;
    }

    .faq-answer-inner {
        padding: 12px 22px 18px;
        font-size: 0.95rem;
    }

    .show-more-button {
        padding: 12px 25px;
        font-size: 1rem;
    }
}				

.grve-carousel-wrapper{border-radius:30px;}
.grve-hover-animation .grve-hover-animation-wrapper{border-radius:30px;}

.testo-in-border {border: 1px solid #b5b0b2; border-radius:30px; padding: 60px; font-family:'Montserrat', sans-serif; text-align: center;font-size: 16px; color:#969595; line-height: 30px;}

#grve-theme-wrapper .grve-padding-bottom-1x{padding:20px 0;}

#grve-main-header.grve-sticky-ready, #grve-main-header.grve-sticky-ready .grve-bottom-header-area{background-color:transparent!important;}

.pochiposti{color:#ff0063!important;}

.grve-menu-text, .grve-header-menu li .grve-link-wrapper:not(.grve-menu-element-link-wrapper), .grve-header-menu li.grve-first-level:not(.grve-menu-element-first-level) > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) > a, #grve-main-header .grve-header-button, #grve-main-header .megamenu .sub-menu > li.menu-item-has-children > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) > a, #grve-main-header .grve-language.grve-list, #grve-main-header .grve-language.grve-dropdown, #grve-offcanvas-area.grve-layout-2 #grve-second-menu li.grve-first-level:not(.grve-menu-element-first-level) > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) > a, .grve-burger-label{font-size:12px;}

.fa.fa-facebook-official, .fa.fa-pinterest-p, .fa.fa-whatsapp{color:#00bf22;}

.cta-whatsapp {
  /* Stile di base del bottone */
  display: inline-flex; /* Usa flexbox per allineare icona e testo */
  align-items: center; /* Centra verticalmente gli elementi */
  justify-content: center; /* Centra orizzontalmente gli elementi */
  padding: 12px 30px; /* Spaziatura interna */
  background-color: #ffffff!important; /* Sfondo bianco */
  color: #333333; /* Testo grigio scuro */
  text-decoration: none;
  border-radius: 30px; /* Bordi arrotondati a pillola */
 font-family:'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: normal;
  border: none;
  cursor: pointer;
  outline: none;
  /* Ombra iniziale sottile, come nell'immagine */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Transizioni fluide per un effetto non meccanico */
  transition: box-shadow 0.3s ease-out, transform 0.3s ease-out;
}

/* Stile per l'icona WhatsApp all'interno del bottone */
.cta-whatsapp .whatsapp-icon {
  margin-right: 10px; /* Spazio tra icona e testo */
  width: 24px; /* Dimensione dell'icona */
  height: 24px;
  /* Se l'icona è un SVG o un font icon, puoi anche animare il colore */
  color: #25D366; /* Il verde classico di WhatsApp */
  transition: color 0.3s ease-out;
}

.cta-whatsapp:hover {
  /* Ombra più pronunciata e leggero spostamento verso l'alto */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); /* Ombra più grande e scura */
  transform: translateY(-3px); /* Si "solleva" leggermente */
  color:#FFFFFF!important;
}

/* Effetto al click (active/tapped state) */
.cta-whatsapp:active {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Ombra ridotta */
  transform: translateY(0); /* Ritorna alla posizione originale */
  background-color: #f0f0f0; /* Leggermente più scuro per dare feedback visivo */
}

/* Se vuoi un effetto hover anche sull'icona (es. un leggero ingrandimento o cambio colore) */
.cta-whatsapp:hover .whatsapp-icon {
  transform: scale(1.05); /* Lieve ingrandimento dell'icona */
  color: #1DA74B; /* Un verde leggermente più scuro o acceso */
}



.grve-menu-text, .grve-header-menu li .grve-link-wrapper:not(.grve-menu-element-link-wrapper), .grve-header-menu li.grve-first-level:not(.grve-menu-element-first-level) > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) > a, #grve-main-header .grve-header-button, #grve-main-header .megamenu .sub-menu > li.menu-item-has-children > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) > a, #grve-main-header .grve-language.grve-list, #grve-main-header .grve-language.grve-dropdown, #grve-offcanvas-area.grve-layout-2 #grve-second-menu li.grve-first-level:not(.grve-menu-element-first-level) > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) > a, .grve-burger-label{font-size:13px!important;}

.fa.fa-facebook-official, .fa.fa-pinterest-p, .fa.fa-whatsapp{color:#00bf22;}

.cta-whatsapp {
  /* Stile di base del bottone */
  display: inline-flex; /* Usa flexbox per allineare icona e testo */
  align-items: center; /* Centra verticalmente gli elementi */
  justify-content: center; /* Centra orizzontalmente gli elementi */
  padding: 12px 30px; /* Spaziatura interna */
  background-color: #ffffff!important; /* Sfondo bianco */
  color: #333333; /* Testo grigio scuro */
  text-decoration: none;
  border-radius: 9999px; /* Bordi arrotondati a pillola */
 font-family:'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: normal;
  border: none;
  cursor: pointer;
  outline: none;
  /* Ombra iniziale sottile, come nell'immagine */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Transizioni fluide per un effetto non meccanico */
  transition: box-shadow 0.3s ease-out, transform 0.3s ease-out;
  transition: transform 0.1s ease-out;
}

/* Stile per l'icona WhatsApp all'interno del bottone */
.cta-whatsapp .whatsapp-icon {
  margin-right: 10px; /* Spazio tra icona e testo */
  width: 24px; /* Dimensione dell'icona */
  height: 24px;
  /* Se l'icona è un SVG o un font icon, puoi anche animare il colore */
  color: #25D366; /* Il verde classico di WhatsApp */
  transition: color 0.3s ease-out;
}

.cta-whatsapp:hover {
  /* Ombra più pronunciata e leggero spostamento verso l'alto */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); /* Ombra più grande e scura */
  transform: translateY(-3px); /* Si "solleva" leggermente */
  animation: bounce 1.2s; /* Ho raddoppiato la durata a 1.2 secondi */
}

/* Effetto al click (active/tapped state) */
.cta-whatsapp:active {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Ombra ridotta */
  transform: translateY(0); /* Ritorna alla posizione originale */
  background-color: #f0f0f0; /* Leggermente più scuro per dare feedback visivo */
}

/* Se vuoi un effetto hover anche sull'icona (es. un leggero ingrandimento o cambio colore) */
.cta-whatsapp:hover .whatsapp-icon {
  transform: scale(1.05); /* Lieve ingrandimento dell'icona */
  color: #1DA74B; /* Un verde leggermente più scuro o acceso */
  animation: bounce 1.2s; /* Ho raddoppiato la durata a 1.2 secondi */
}


.cta-prezzi {
    /* Stili base del bottone */
    background-color: #2d2d2d;
    color: #FFFFFF!important;
    padding: 10px 20px;
    border: none;
    border-radius: 30px;
    font-size: 16px;
    cursor: pointer;
    transition: transform 0.1s ease-out;
}

.cta-prezzi:hover {
    /* Effetto di bounce al passaggio del mouse - ORA PIÙ LENTO */
    animation: bounce 1.2s; /* Ho raddoppiato la durata a 1.2 secondi */
	background-color: #1e1e1e;
}

.cta-riceviiltuosito{color:#2d2d2d;}


/* Contenitore generale delle card per allineamento */
.pricing-cards-container {
    display: flex;
    justify-content: center;
    gap: 1.5rem; 
    padding: 1.55rem 1.25rem; 
    font-family:'Montserrat', sans-serif;
    background-color: none!important;
    box-sizing: border-box;
}

/* Stile base per ogni singola card di prezzo */
.price-card {
    background-color: var(--glass-base-bg);
    border-radius: 1.5625rem; /* 25px */
    box-shadow: 0 0.9375rem 1.875rem var(--glass-base-shadow);
    width: 21.25rem; /* 340px - Manteniamo la larghezza originale per desktop */
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-align: center;
    color: var(--primary-text-color);
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
    box-sizing: border-box;
    border: 1px solid var(--glass-base-border);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Effetto di sollevamento (lift) per le card BASIC e PREMIUM all'hover */
.price-card:not(.featured):hover {
    transform: translateY(-0.5rem); /* 8px */
    box-shadow: 0 1.5625rem 3.125rem rgba(0, 0, 0, 0.1);
    background-color: var(--glass-base-hover-bg);
    border-color: rgba(0, 0, 0, 0.12);
}

/* Sezione superiore della card (nome, prezzo, pulsante) */
.card-header-price {
    padding: 2.5rem 1.5625rem; /* 40px 25px */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 15.625rem; /* 250px */
    position: relative;
    z-index: 1;
    background-color: transparent;
    transition: background 0.3s ease;
}

.plan-name {
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    opacity: 0.9;
    color: #fff;
}

.price-value {
    font-size: 35px;
    font-weight: 800;
    margin-bottom: 0;
    line-height: 1;
    text-shadow: 0 0.125rem 0.3125rem rgba(0, 0, 0, 0.1);
    white-space: nowrap;
    color: #fff;
}

.price-period {
    font-size: 1.1rem;
    font-weight: 500;
    margin: 20px auto;
    opacity: 0.85;
    color: #fff;
}

/* Stile per il pulsante "Iniziamo" - Default non featured (trasparente) */
.cta-button {
background-color: rgba(255, 255, 255, 0.25);
  color: #FFFFFF!important;
  border: none;
  padding: 12px 35px;
  border-radius: 30px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease, border-color 0.3s ease;
  box-shadow: 0 0.375rem 0.75rem rgba(0, 0, 0, 0.2);
  letter-spacing: 0.5px;
  font-family: 'Montserrat', sans-serif;
}

.cta-button:hover {
    background-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-0.1875rem);
    border-color: rgba(255, 255, 255, 0.6);
}

/* Sezione inferiore della card (dettagli) */
.card-details {
    background-color: #fff;
    color: var(--secondary-text-color);
    padding: 1.875rem 1.5625rem;
    border-bottom-left-radius: 1.5625rem;
    border-bottom-right-radius: 1.5625rem;
    flex-grow: 1;
    text-align: left;
    box-shadow: inset 0 0.3125rem 0.625rem rgba(0, 0, 0, 0.03);
    border-top: 1px solid rgba(0,0,0,0.05);
}

.details-intro {
font-size: 14px!important;
  color: #969595!important;
    font-weight: 600;
    margin-bottom: 1.125rem;
    color: var(--primary-text-color);
    line-height: 1.3;
}

.features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.features-list li {
font-size: 14px !important;
  color: #969595 !important;
    margin-bottom: 0.75rem;
    line-height: 1.5;
    color: var(--secondary-text-color);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Colori specifici per ogni card - Gradienti originali */
.price-card.basic .card-header-price {
    background-image: url(https://hostify.it/wp-content/uploads/2025/05/p2.png); /* Rosa/Rosso */
 	background-repeat: no-repeat; /* L'immagine non viene ripetuta */
  background-position: center; /* L'immagine è centrata */
  background-size: cover; /* L'immagine copre l'intero sfondo */

}
.price-card.gold .card-header-price {
    background-image: url(https://hostify.it/wp-content/uploads/2025/05/p1.png); /* Blu */
	background-repeat: no-repeat; /* L'immagine non viene ripetuta */
  background-position: center; /* L'immagine è centrata */
  background-size: cover; /* L'immagine copre l'intero sfondo */

}
.price-card.premium .card-header-price {
    background-image: url(https://hostify.it/wp-content/uploads/2025/05/p3.png); /* Verde */
	background-repeat: no-repeat; /* L'immagine non viene ripetuta */
  background-position: center; /* L'immagine è centrata */
  background-size: cover; /* L'immagine copre l'intero sfondo */

}

/* Badge "Più Popolare" per la card featured */


/* --- Stile SPECIFICO per la card FEATURED (GOLD) - APPLICATO SEMPRE (desktop base) --- */
.price-card.featured {
    transform: scale(1.01) translateY(-0.625rem); /* Sempre più grande e sollevata */
    box-shadow: 0 1.5625rem 3.125rem rgba(0, 0, 0, 0.2); /* Ombra più scura */
    z-index: 2; /* Sempre sopra le altre */
    border: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

/* Effetto ZOOM specifico per la card FEATURED all'hover */
.price-card.featured:hover {
    transform: scale(1.03) translateY(-0.9375rem);
    box-shadow: 0 2.1875rem 4.375rem rgba(0, 0, 0, 0.25);
}

/* Pulsante "Iniziamo" per la card FEATURED (sfondo pieno) */
.price-card.featured .cta-button {
    background-color: #2d2d2d; /* Sfondo pieno blu */
    color: #fff!important; /* Testo bianco */
    border-color: #2d2d2d; /* Bordo dello stesso colore */
    padding: 1.125rem 2.5rem;
    font-size: 1.3rem;
}

.price-card.featured .cta-button:hover {
    background-color: #2d2d2d; /* Colore più scuro all'hover */
    border-color: #2d2d2d;
    transform: translateY(-0.3125rem);
}

/* Testo e dimensioni nella header della card featured */
.price-card.featured .card-header-price {
    padding: 3.125rem 1.875rem;
}

.price-card.featured .plan-name {
    font-size: 1.8rem;
}

.price-card.featured .price-value {
    font-size: 40px;
    white-space: nowrap;
}

.price-card.featured .price-period {
    font-size: 1.2rem;
    margin: 20px auto;;
}

/* Dettagli della card featured */
.price-card.featured .card-details {
    padding: 2.1875rem 1.875rem;
}

.price-card.featured .details-intro {
    font-size: 14px!important; color: #969595!important;
}

.price-card.featured .features-list li {
   font-size: 14px!important;
  color: #969595!important;
}




/* Definizione dell'animazione 'bounce' */
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}







/*inizio cards*/

@media screen and (min-width: 739px) and (max-width: 992px) {
       
    .price-value {
    font-size: 3.1rem;
    }
    .pricing-cards-container {
        gap: 0.5rem; /* Riduci il gap per fare spazio */
        padding: 2rem 1rem; /* Riduci il padding generale */
    }

    /* Regolazioni per la featured card in questo breakpoint - scala leggermente meno */
    .price-card.featured {
        transform: scale(1.06) translateY(-0.4rem); /* Scala e sollevamento ridotti */
        box-shadow: 0 1.25rem 2.5rem rgba(0, 0, 0, 0.18);
    }
    .price-card.featured:hover {
        transform: scale(1.1) translateY(-0.6rem);
    }

    .price-card.featured .card-header-price {
        padding: 2.5rem 1.5rem;
        min-height: 14.375rem;
    }
    .price-card.featured .plan-name { font-size: 1.6rem; }
    .price-card.featured .price-value { font-size: 3.1rem; }
    .price-card.featured .price-period { font-size: 1.1rem; margin-bottom: 2.1875rem; }
    .price-card.featured .cta-button {
        padding: 1rem 2.1875rem;
        font-size: 1.2rem;
    }
    .price-card.featured .card-details {
        padding: 1.875rem 1.5625rem;
    }
    .price-card.featured .features-list li { font-size: 1.05rem; }
}


/* --- Media Query per impilamento: A 738px e sotto (Mobile/Tablet verticale) --- */
@media screen and (max-width: 738px) {
    html {
        font-size: 14px; /* Base font leggermente più piccola per adattarsi meglio */
    }
    .pricing-cards-container {
        flex-direction: column; /* Impila le card */
        align-items: center;
        padding: 1.8rem 0.5rem; /* Padding ridotto per schermi stretti */
        gap: 0.4rem; /* Rimuovi il gap diretto per il "sfioramento" */
    }

    .price-card {
        width: 90%; /* Quasi tutta la larghezza */
        max-width: 25rem; /* Limite massimo per farle più larghe, ma non esagerate */
        margin-bottom: 0.5rem; /* Un piccolo margine positivo per evitare sovrapposizioni indesiderate tra non-featured */
        border-radius: 1.25rem;
        }

    /* La card GOLD featured deve essere sempre al centro e più grande */
    .price-card.featured {
        transform: scale(1.05) translateY(-0.8rem); /* Scala ridotta ma ancora visibile */
        box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.15); /* Ombra più leggera per farla distinguere */
        margin-bottom: -1.5rem; /* Un margine negativo controllato per l'effetto "sfioramento" */
        z-index: 3; /* Assicurati che sia sempre sopra */
        position: relative; /* Necessario per z-index */
    }

    .price-card.featured:hover {
        transform: scale(1.07) translateY(-1rem); /* Effetto hover più marcato ma controllato */
        box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.2);
    }
    
  }

/*fine cards*/








@media screen and (min-width: 1024px) {
	
	.grve-logo {
  height: 110px!important;
  width: 400px!important;
}

	.grve-logo .grve-logo-inner img {
	width: 300px!important;height: auto!important;}
	
	.display-block-mobile{display: inline-block;}

}

@media screen and (max-width: 1024px) {
	
	#grve-main-content .grve-main-content-wrapper, #grve-sidebar{padding-top:0px;}
	
	.grve-responsive-menu-text, #grve-responsive-main-menu .grve-menu .grve-first-level:not(.grve-menu-element-first-level) > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) .pochiposti{font-style:italic!important; color: #ff0063!important;}
	
	.grve-close-button-wrapper .grve-close-btn{margin:50px;}

	.grve-responsive-menu-text, #grve-responsive-main-menu .grve-menu .grve-first-level:not(.grve-menu-element-first-level) > .grve-link-wrapper:not(.grve-menu-element-link-wrapper) a{margin:20px!important;}
	
	.cta-prezzi {background-color: transparent!important; padding: 0px!important;}
	
	.grve-link-wrapper a .grve-item .pochiposti{font-size:15px;}
	.grve-link-wrapper a .grve-item{font-size:20px;}
	
	.cta-riceviiltuosito{color:#FFFFFF!important;}
	
	.display-block-mobile{display: block;}
	
	.img-max{width: 100%!important;}
	
	.testo-in-border {border: 1px solid #b5b0b2;
  border-radius: 30px;
  padding: 30px;
  font-family: 'Montserrat', sans-serif;
  text-align: center;
  font-size: 11px;
  color: #969595;
	line-height: 20px;}
	
	.price-card{margin-bottom:40px;}
	.price-card.featured{margin-bottom:20px;}
	
	.price-value{font-size: 35px;}
	.price-card.featured .price-value{font-size:35px;}
	
	}
	

@media screen and (max-width: 768px) {
	


}

/* **************LOGO E COPYRIGHT FOOTER************************************************************ */

/* Stili generali del custom-page-bottom */
.custom-page-bottom {
    background-color: #000;
    color: #fff;
    padding: 60px 40px;
    font-family: "Figtree", sans-serif;
}

.custom-page-bottom-container {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 30px;
}

/* Sezione sinistra del custom-page-bottom (Logo e Copyright) */
.custom-page-bottom-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
}

.bottom-logo img {
    height: 40px;
    width: auto;
}

.bottom-copyright {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}

/* Sezione destra del custom-page-bottom (contenitore principale dei link) */
.custom-page-bottom-right {
    display: flex;
    align-items: center;
    /*min-height: 40px; /* Non più strettamente necessario qui, ma puoi lasciarlo se vuoi un'altezza minima per il contenitore */
}

/* Contenitore flex per i link testuali */
.bottom-links {
    display: flex;
    gap: 20px; /* Spazio tra i link */
    align-items: center;
}

/* Stili per i singoli link testuali */
.bottom-link-item {
    color: #fff; /* Colore del testo dei link */
    text-decoration: none; /* Rimuove la sottolineatura */
    font-size: 1rem; /* Dimensione del font, puoi regolarla */
    transition: color 0.3s ease; /* Transizione colore al hover */
}

/* Effetto hover sui link testuali */
.bottom-link-item:hover {
    color: #ffd700; /* Colore giallo all'hover */
}

/* Media Query per la Responsività */
@media (max-width: 768px) {
    .custom-page-bottom {
        padding: 40px 20px;
    }

    .custom-page-bottom-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .custom-page-bottom-left {
        align-items: center;
        margin-bottom: 20px;
    }

    .bottom-links { /* Centra i link */
        justify-content: center;
    }

    .custom-page-bottom {
        padding: 40px 20px;
    }

    .custom-page-bottom-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .custom-page-bottom-left {
        align-items: center;
        margin-bottom: 20px;
    }

    .bottom-links { /* Centra i link */
        justify-content: center;
    }
 
}