/*
	Theme Name: Sana Child
	Theme URI: https://teso.io/themes/sana/
	
	Template: sana

	Author: Teso
	Author URI: https://teso.io

	Version: 1.0.0

	License: 
	License URI: 

	Description: Sana is designed to suit the needs of medical professionals from all fields of practice. By being preconfigured and optimized straight out of the box, this theme helps you set things up quickly and easily. The included custom Gutenberg blocks allow you to focus on your content, without the need for designing and coding. Use Sana to build and manage a professional website for your practice.
	Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready

	Text Domain: tesoiosanachild
	Domain Path: /languages
*/

:root {
  --color-main-2: #8ee0d6;
}

/* Classes que Gutenberg afegeix automàticament quan tries el color */
.has-main-2-color {
  color: var(--color-main-2);
}

.has-main-2-background-color {
  background-color: var(--color-main-2);
}

/* CUSTOM */

/* menú horitzontal */
header nav ul:not(#menu-side-menu) li.header__navigation-item > a {padding:1px 3px;}
header nav ul:not(#menu-side-menu) li.header__navigation-item > a:hover { transition: all 1s ease-in-out;}
header nav ul:not(#menu-side-menu)  li.header__navigation-item > a:before {
  content: "";
  transition: 0.5s;
  color: var(--color-main);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 0;
  overflow: hidden;
}
header nav ul:not(#menu-side-menu) li.header__navigation-item > a:hover::before {
  width: 100%;
  transition: all 0.5s ease-in-out;
	border-bottom:3px solid var(--color-secondary);
}
header.header--is-sticky nav ul:not(#menu-side-menu) li.header__navigation-item > a:hover { color: #000;  }
header:not(.header--is-sticky) nav ul:not(#menu-side-menu) li.header__navigation-item > a:hover {background-color:var(--color-secondary);  color: #000; } /* només transparent dalt de tot */

/* burger menú */
header nav ul li section {background-color:var(--color-secondary) !important;}
header nav ul li section ul#menu-side-menu li a { color:var(--color-main); font-size:1.5em; }
header nav ul li section ul#menu-side-menu li a:hover { color:#000;}
header nav ul li section ul#menu-side-menu li {padding-bottom:5px;}
header nav ul li section ul#menu-side-menu li:hover { border-bottom:1px solid #fff;}

/* Portada */
.portada h2 {text-transform:uppercase;} /* títol principal en majúscules */
.turquesa {background-color:var(--color-secondary) !important;}

/* ombres text  */
.ombratext {text-shadow:1px 3px 5px #666;}

/* acompanyaments - per posar 4 blocs per fila, en comptes de 3 */
.blocAcomp .acompanya { width:23%; background-color:var(--color-auxiliary); margin-right:1%; border-radius:21px;}
.blocAcomp .acompanya:last-child {margin-right:0;}
.blocAcomp .acompanya a {margin-top:1em; color:#997379 !important;}
.blocAcomp .acompanya a:hover {color: #cc99a2 !important;}
.blocAcomp .acompanya .features-block__feature-image-wrapper { --image-size: 75% !important;}

/* galeria */
figcaption { padding-top:.5em; text-align:center; }

/* línia separadora més prima */
hr.wp-block-separator {
	border-top:1px solid !important;
}

/* llistes */
.block__inner ul li {
	margin-bottom:.5em;
}

/* testimonis */
.testimoni .block__inner,
.requadre .block__inner { 
	background-color: #def6f3 !important;
	padding:50px;
	border-radius:20px;
	border-bottom:1px solid var(--color-secondary);
	border-right:1px solid var(--color-secondary);
}

/* requadre blau seccions com acompañamiento individual / grup */
.requadre .block__inner { 
	padding:30px 0 60px !important;
	/*width:65%;*/
}

/* xerrades - requadre turquesa clar amb alguns canvis*/
.xerrades .block__inner {
	padding:40px 0 !important;
	background-color: #fff !important;
	border-bottom:1px solid pink;
	border-right:1px solid pink;
}

.xerrades .block__inner h4,
.xerrades .block__inner p { 
	line-height:1.4;
	padding:0 3em;
}

.foto img {
	border-radius:10px;
	transition: all 1s ease-in-out;
}

/* separador columnes turquesa */
.colLinia section article:first-child {
	border-right:1px solid var(--color-secondary);
	padding-right: 25px;
}
/* posa línia lateral a les rodones d'espacios (features) que no siguin els acompanyaments que van en color rosa */
.espacios .features-block__feature:first-child,
.espacios .features-block__feature:nth-child(2),
.espacios .features-block__feature:nth-child(4){
	border-right:1px solid var(--color-secondary);
}

/* links roses a espacios */
.espacios .features-block__feature a {
	margin-top:.5em; color:#997379 !important;
}

.espacios .features-block__feature a:hover {
	color: #cc99a2 !important;
}

/* vídeo seccions - que ocupi tota l'amplada */
.main__inner .wp-block-wrapper:has(.elvideo) {
	padding: 0 0 !important;
}
.main__inner .wp-block-wrapper:has(.elvideo) > .wp-block-wrapper__inner {
	max-width: 100% !important;
}
.main__inner .wp-block-wrapper > .wp-block-wrapper__inner .elvideo {
	min-height:70vh !important;
}

/* vídeo amb text portada */
.main__inner .wp-block-wrapper > .wp-block-wrapper__inner .elvideo .txtportada{
	font-size:var(--font-size-title-small);
}
.main__inner .wp-block-wrapper > .wp-block-wrapper__inner .elvideo .txtportada strong{	
	font-size:var(--font-size-title-large);
	font-weight:normal;
}

ul:has(.llista) {
	width: 70%;
	margin:0 auto 4em;
}
ul:has(.llista) li {
	margin-bottom:.75em;
}


/* pàgina en construcció - sense menús ni res */
.page-id-975 header,
.page-id-975 footer,
.page-id-975 .mobile-menu,
.page-id-975 .burger-menu,
.error404 header,
.error404 footer,
.error404 .mobile-menu,
.error404 .burger-menu {
  display: none !important;
}




/* RWD */ 
/* Pantalles extra grans (grans televisors, monitors 4K i més) */
@media only screen and (min-width: 1600px) {
  /* Estils per pantalles molt grans */
  /*body { border:3px solid blue; }*/
}

/* Pantalles grans (ordinadors de sobretaula normals) */
@media only screen and (min-width: 1200px) and (max-width: 1599px) {
  /* Estils per monitors d’escriptori grans */
  /*body { border:3px solid yellow; }*/
}

/* Per pantalles fins a 1199px (ordinadors portàtils i tablets grans) */
@media only screen and (max-width: 1199px) {
  /* Estils per resolucions mitjanes */
  /*body { border:3px solid green; }*/
	.espacios .features-block__feature:first-child,
	.espacios .features-block__feature:nth-child(3){
			border-right:1px solid var(--color-secondary);
	}
	.espacios .features-block__feature:nth-child(2),
	.espacios .features-block__feature:nth-child(4) {
			border-right:none;
	}
}

/* Per pantalles fins a 991px (tablets en horitzontal, petits portàtils) */
@media only screen and (max-width: 991px) {
  /* Estils per tablets i laptops petits */
  /*body { border:3px solid purple; }*/
  .requadre .block__inner { 
		padding:30px 20px 60px !important;
		width:95%;
		
	}
	.requadre .block__inner ul {
		margin-left:2em;
		
	}
	.espacios .features-block__feature {
		border-right:none !important;
	}

	ul:has(.llista) {
		width: 93%;
	}
}

/* Per pantalles fins a 767px (tablets en vertical, phablets grans) */
@media only screen and (max-width: 767px) {
  /* Estils per tablets verticals i mòbils grans */
  /*body { border:3px solid cyan; }*/
}

/* Per pantalles fins a 575px (smartphones normals) */
@media only screen and (max-width: 575px) {
  /* Estils per mòbils típics */
  /*body { border:3px solid orange; }*/
}

/* Per pantalles molt petites (ex: 360px o menys) */
@media only screen and (max-width: 360px) {
  /* Estils específics per dispositius molt petits */
  /*body { border:3px solid pink; }*/
}