/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://davidearduini.com/wp-content/themes/twentytwentyone-child/
Description: Twenty Twenty-One Child Theme
Author: Davide Arduini
Author URI: https://dadesign.it/
Template: twentytwentyone
Version: 2.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/**** VERSIONE 2025-09-05 */


/**** INSTALLAZIONE FONT DUBAI ****/

@font-face {
	font-family: 'Dubai Regular';
	src: url(https://davidearduini.com/wp-content/themes/twentytwentyone-child/fonts/Dubai-Regular.ttf) format('truetype');
}

@font-face {
	font-family: 'Dubai Medium';
	src: url(https://davidearduini.com/wp-content/themes/twentytwentyone-child/fonts/Dubai-Medium.ttf) format('truetype');
}

@font-face {
	font-family: 'Dubai Light';
	src: url(https://davidearduini.com/wp-content/themes/twentytwentyone-child/fonts/Dubai-Light.ttf) format('truetype');
}

@font-face {
	font-family: 'Dubai Bold';
	src: url(https://davidearduini.com/wp-content/themes/twentytwentyone-child/fonts/Dubai-Bold.ttf) format('truetype');
}

/**** INSTALLAZIONE FONT AMSTERDAM FOUR ****/

@font-face {
	font-family: 'Amsterdam Four';
	src: url(https://davidearduini.com/wp-content/themes/twentytwentyone-child/fonts/AmsterdamFour.ttf) format('truetype');
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Dubai Regular';
	letter-spacing: 0.07rem;
	color: rgb(57, 65, 77);
}

p, span {
	font-family: 'Dubai Light';
	letter-spacing: 0.04rem;
}

.primary-navigation a {
	font-family: 'Dubai Light', sans serif;
	letter-spacing: 0.07rem;
}

.wp-block-button .wp-block-button__link {
	font-family: 'Dubai Light', sans serif;
	letter-spacing: 0.07rem;
}

.powered-by {
	font-family: 'Dubai Light', sans serif;
	letter-spacing: 0.05rem;
}

.footer-navigation {
	font-family: 'Dubai Light', sans serif;
	letter-spacing: 0.05rem;
}

.ti-widget {
	font-family: 'Dubai Light', sans serif;
	letter-spacing: 0.05rem;
}


/**** FORMATTAZIONE CARATTERI ****/

h1 {
	font-size: clamp(2.2rem, 2.7vw, 3.2rem) !important;
}

h2 {
	font-size: clamp(2rem, 2.5vw, 2.6rem) !important;
	color: rgb(70, 70, 70);
}

h3 {
	font-size: clamp(1.5rem, 1.8vw, 2rem) !important;
}

h4 {
	font-size: clamp(1.4rem, 1.6vw, 1.9rem) !important;
}

h5 {
	font-size: clamp(1.3rem, 1.5vw, 1.8rem) !important;
}

h6 {
	font-size: clamp(1.2rem, 1.4vw, 1.7rem) !important;
}

p  {
	font-size: clamp(1.15rem, 1.3vw, 1.4rem) !important;
	line-height: 1.5 !important;
}

.wp-block-button .wp-block-button__link {
	font-size: clamp(1.1rem, 1.2vw, 1.3rem) !important;
	line-height: 1.4 !important;
}

.social-link {
	font-size: clamp(1rem, 1.1vw, 1.1rem) !important;
}

/**** FORMATTAZIONE TITOLO PRINCIPALE ****/

.cover-h {
	font-size: clamp(2.9rem, 4.6vw, 5rem) !important;
	font-family: 'Amsterdam Four', sans serif !important;
	line-height: 2.6;
}

.cover-p {
	font-size: clamp(1.2rem, 2.6vw, 2.6rem) !important;
}

/**** FORMATTAZIONE TESTO MENU ****/

.primary-navigation a {
    font-size: 1.1rem;
}

.primary-navigation .sub-menu .menu-item > a {
    font-size: 1.1rem;
}


/**** FORMATTAZIONE WIDGET FOOTER ****/
.widget-area p {
	font-size: 1.1rem !important;
}
.widget-area h4 {
	font-size: 1.3rem !important;
}
.widget-area .wp-element-button {
	font-size: 1.1rem !important;
}
.widget-area .wp-social-link {
	font-size: 1.4rem !important;
}

/******	FORMATTAZIONE RIGA COPYRIGHT	******/
.powered-by {
	font-size: 1rem;
}
.footer-navigation-wrapper {
	display: block !important;
	font-size: 1rem;
}



/**** FORMATTAZIONE BLOG ****/

/* titolo scheda articolo */
.tw-blog-card h2 {
	font-size: clamp(1.1rem, 1.3vw, 1.4rem) !important;
	line-height: 1.4 !important;
}

/* titolo colonna destra */
.wp-block-latest-posts__post-title {
	font-size: clamp(0.9rem, 1.1vw, 1.1rem) !important;
	line-height: 1.4 !important;
}

/* BLOCCA BARRA LATERALE BLOG */
.blog-sidebar {
  position: sticky;
  top: 150px; /*  Regola la distanza dalla parte superiore */
}


/*******************************/
/****** PERSONALIZZAZIONE ******/
/*******************************/

/* CSS Responsive per trasformare la cover desktop in mobile/tablet */

/* Versione Desktop - mantenere così com'è per schermi grandi */
.break-cover {
    min-height: 100vh;
}

.break-cover .wp-block-cover__inner-container .wp-block-group.alignwide {
    justify-content: flex-start; /* left alignment per desktop */
}

.break-cover .wp-block-cover__video-background {
    object-position: 50% 50%; /* posizione standard per desktop */
}

/* Media Queries per Tablet e Mobile */
@media (max-width: 1024px) {
    /* Tablet e Mobile: cambia altezza minima */
    .break-cover {
        min-height: 600px !important;
    }
    
    /* Centra il contenuto invece di allinearlo a sinistra */
    .break-cover .wp-block-cover__inner-container .wp-block-group.alignwide {
        justify-content: center !important;
    }
    
    /* Cambia la posizione del video per mobile/tablet */
    .break-cover .wp-block-cover__video-background {
        object-position: 50% 66% !important;
    }
    
    /* Centra il testo del titolo per mobile/tablet */
    .break-cover .cover-h {
        text-align: center !important;
    }
    
    /* Rimuovi la classe tw-md-text-center se non serve più */
    .break-cover .cover-h.tw-md-text-center {
        text-align: center !important;
    }
}

/* Media Query specifica per mobile più piccoli se necessario */
@media (max-width: 768px) {
    .break-cover {
        min-height: 500px !important; /* Altezza ancora più ridotta per mobile piccoli */
    }
}

/* Stili aggiuntivi per garantire la corretta visualizzazione */
.break-cover .wp-block-cover__inner-container {
    width: 100%;
}

.break-cover .wp-block-group.alignfull {
    width: 100%;
}

/**** ALTEZZA HEADER ****/
.site-header {
	height: 80px;
}

/**** PERSONALIZZA TENDINA MENU PRINCIPALE ****/

@media only screen and (min-width: 1240px) {
 .tw-header-light:not(.tw-header-opaque) .sub-menu {
   background-color: #ffffff25 !important;
   border-color: #fff !important;
 }
 
 .tw-header-light:not(.tw-header-opaque) .menu-item {
   background-color: transparent !important;
 }
 
 .tw-header-light:not(.tw-header-opaque) .sub-menu-toggle {
 	color: white !important;
 }

 .tw-header-light:not(.tw-header-opaque) a {
 	color: white;
 }
}

/**** FRECCE FOOGALLERY LOGHI CLIENTI ****/
.fg-icon-arrow-left, 
.fg-icon-arrow-right {
	height: 18px !important;
	width: 18px !important;
}

/**** PUNTI PAGINAZIONE FOOGALLERY LOGHI CLIENTI ****/
.fg-carousel-bullet {
	height: 7px;
	width: 7px;
}

/**** PUNTI PAGINAZIONE SLIDER RECENSIONI ****/
.rpi-dot.active {
	height: 6px !important;
	width: 6px !important;
}


/**** PULSANTE INVIA WPFORM ****/
.wpforms-submit {
	border-radius: 9px !important;
	background-color: #2271b1 !important;	
}






/**** colore sfondo icona accessibilità ****/ 

.iub-accessibility-btn {
	background-color: #ffffff !important;
}



/**** PULSANTE WHATSAPP ****/

.whatsapp-button {
  /* Posizionamento del pulsante */
  position: fixed;
  top: 15px; 
  right: calc(50% - 25px);
  z-index: 9999;
  
  /* Stile e dimensione */
  width: 50px; /* Larghezza dell'immagine */
  height: 50px; /* Altezza dell'immagine */
  background-size: contain;
  background-repeat: no-repeat;
  
  /* Sfondo con immagine */
  background-image: url('img/whatsapp-button.svg');
  
  /* Nascondi il pulsante (se usi lo script) */
  display: none;
}

.whatsapp-button:hover {
  transform: scale(1.1);
  opacity: 0.9;
}

  /* Nascondi il pulsante su desktop */
@media (min-width: 1024px) {
    .whatsapp-button {
        display: none !important;
    }
}


/**** PULSANTE TORNA SU ****/

.scroll-to-top-button {
  /* Posizionamento del pulsante */
  position: fixed;
  bottom: 15px;
  right: 20px;
  z-index: 999;
  opacity: 0.9;
  
  /* Stile e dimensione */
  width: 41px; /* Larghezza dell'immagine */
  height: 41px; /* Altezza dell'immagine */
  background-size: contain;
  background-repeat: no-repeat;
  
  /* Sfondo con immagine */
  background-image: url('img/scroll-to-top-white.svg'); 
  
  /* Nascondi il pulsante (se usi lo script) */
  display: none;
}

.scroll-to-top-button:hover {
  transform: scale(1.1);
  opacity: 0.8;
}


/****    SUNSHINE GALLERY    ****/

/*** GALLERIE MODALITA' COVER ***/

/* GRANDEZZA TITOLO GALLERIE */
#sunshine--page-header h1 {
    font-size: 100%;
    margin-bottom: 30px;
}

/* nascondi menu gallerie modalità cover */
#sunshine--header {
    display: none;
}

/* altezza cover gallerie modalità cover */
#sunshine--cover {
    height: 80vh;
}

/* spazio tra immagini galleria */
#sunshine--gallery-items.sunshine--layout--justified, #sunshine--image-items.sunshine--layout--justified {
    gap: 18px;
}
/* larghezza gallerie modalità cover */
#sunshine, #sunshine--main {
    width: 80%;
    margin: auto;
}