/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.4.1753262176
Updated: 2025-07-23 11:16:16

*/


/* =========================================================================
   DISGAMA — Ficha de producto
   Paleta y tipografías tomadas del kit de Elementor del sitio:
   azul #13427C / #2B6493 / #36A7DF, línea #DCDCDE, fondo claro #F5F4F5,
   texto #3C3C3B. Titulares en Raleway, textos en Lexend Deca.
   ========================================================================= */

/* ---- Migas de pan: azul corporativo y aire respecto a la cabecera ------- */
.single-product #primary .site-main > .woocommerce-breadcrumb,
.single-product .woocommerce-breadcrumb {
	margin: 2.75rem 0 2rem;
	padding: 0;
	font-family: "Lexend Deca", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;
	color: #9BB4CC;
}

.single-product .woocommerce-breadcrumb a {
	color: #36A7DF;
	text-decoration: none;
	transition: color .18s ease;
}

.single-product .woocommerce-breadcrumb a:hover,
.single-product .woocommerce-breadcrumb a:focus {
	color: #13427C;
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 767px) {
	.single-product .woocommerce-breadcrumb {
		margin: 1.6rem 0 1.25rem;
		font-size: 13px;
	}
}

/* ---- Pestañas ----------------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs {
	margin-top: 3.5rem;
}

/* Se anula el aspecto por defecto de WooCommerce (pestañas redondeadas
   con esquinas hechas de pseudoelementos) para partir de cero. */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
	gap: .35rem;
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: 2px solid #DCDCDE;
	scrollbar-width: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar { display: none; }

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after {
	display: none !important;
	content: none !important;
	border: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	display: block;
	margin: 0;
	padding: 0;
	background: none;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	white-space: nowrap;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none !important;
	content: none !important;
	border: 0 !important;
	box-shadow: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: .9rem 1.6rem;
	margin-bottom: -2px;
	font-family: "Lexend Deca", sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: #2B6493;
	text-decoration: none;
	background: #EAF5FB;
	border: 1px solid #CDE7F5;
	border-bottom: 2px solid transparent;
	border-radius: 6px 6px 0 0;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	background: #D5EBF8;
	color: #13427C;
	border-color: #A1D7E3;
	border-bottom-color: #A1D7E3;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li[aria-selected="true"] a {
	background: #A1D7E3;
	color: #0F3563;
	font-weight: 600;
	border-color: #A1D7E3;
	border-bottom-color: #36A7DF;
}

@media (max-width: 767px) {
	.woocommerce div.product .woocommerce-tabs { margin-top: 2.25rem; }
	.woocommerce div.product .woocommerce-tabs ul.tabs li a {
		padding: .8rem 1rem;
		font-size: 14px;
	}
}

/* ---- Contenido de las pestañas ------------------------------------------ */
.woocommerce div.product .woocommerce-Tabs-panel {
	padding: 2.5rem 0 1rem;
	font-family: "Lexend Deca", sans-serif;
	font-size: 16px;
	line-height: 1.75;
	color: #3C3C3B;
	max-width: 900px;
}

/* WooCommerce repite el nombre de la pestaña como titular; sobra. */
.woocommerce div.product .woocommerce-Tabs-panel > h2:first-child {
	display: none;
}

.woocommerce div.product .woocommerce-Tabs-panel p {
	margin: 0 0 1.15rem;
}

.woocommerce div.product .woocommerce-Tabs-panel h3 {
	font-family: Raleway, sans-serif;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.3;
	color: #13427C;
	margin: 2.4rem 0 1rem;
	padding-bottom: .55rem;
	border-bottom: 1px solid #DCDCDE;
}

.woocommerce div.product .woocommerce-Tabs-panel h3:first-child { margin-top: 0; }

.woocommerce div.product .woocommerce-Tabs-panel h4 {
	font-family: Raleway, sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: #2B6493;
	margin: 1.8rem 0 .7rem;
}

.woocommerce div.product .woocommerce-Tabs-panel strong { color: #13427C; }

.woocommerce div.product .woocommerce-Tabs-panel ul {
	margin: 0 0 1.5rem;
	padding: 0;
	list-style: none;
}

.woocommerce div.product .woocommerce-Tabs-panel ul li {
	position: relative;
	margin: 0 0 .6rem;
	padding-left: 1.6rem;
}

/* Viñeta propia, en azul claro, en lugar del disco por defecto */
.woocommerce div.product .woocommerce-Tabs-panel ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .62em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #36A7DF;
}

.woocommerce div.product .woocommerce-Tabs-panel ul li p { margin: 0; }

/* ---- Tablas: las de la descripción y la de "Información adicional" ------ */
.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla,
.woocommerce div.product table.shop_attributes {
	width: 100%;
	margin: 1.2rem 0 2rem;
	border-collapse: collapse;
	border: 1px solid #E4E6E9;
	font-family: "Lexend Deca", sans-serif;
	font-size: 15px;
	line-height: 1.6;
}

.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla thead th {
	background: #13427C;
	color: #FFFFFF;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: .02em;
	text-align: left;
	padding: .8rem 1rem;
	border: 1px solid #13427C;
}

.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla tbody th,
.woocommerce div.product table.shop_attributes th {
	width: 38%;
	background: #F5F4F5;
	color: #13427C;
	font-weight: 600;
	text-align: left;
	padding: .75rem 1rem;
	border: 1px solid #E4E6E9;
}

.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla td,
.woocommerce div.product table.shop_attributes td {
	padding: .75rem 1rem;
	border: 1px solid #E4E6E9;
	color: #3C3C3B;
	font-style: normal;   /* WooCommerce las pone en cursiva por defecto */
}

.woocommerce div.product table.shop_attributes td p { margin: 0; padding: 0; }

.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla tbody tr:nth-child(even) td,
.woocommerce div.product table.shop_attributes tr:nth-child(even) td {
	background: #FAFAFB;
}

.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla tbody tr:hover td,
.woocommerce div.product table.shop_attributes tr:hover td {
	background: #F0F7FC;
}

/* En móvil las tablas se desplazan en horizontal en vez de romper la página */
@media (max-width: 767px) {
	/* Las tablas son de 2-3 columnas de texto corto: en movil basta con
	   apretar el interlineado y dejar que el texto fluya, sin scroll lateral. */
	.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla,
	.woocommerce div.product table.shop_attributes {
		font-size: 13.5px;
	}
	.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla th,
	.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla td,
	.woocommerce div.product table.shop_attributes th,
	.woocommerce div.product table.shop_attributes td {
		padding: .55rem .65rem;
	}
	.woocommerce div.product .woocommerce-Tabs-panel table.disgama-tabla tbody th,
	.woocommerce div.product table.shop_attributes th { width: 42%; }
	.woocommerce div.product .woocommerce-Tabs-panel { padding-top: 1.75rem; font-size: 15px; }
	.woocommerce div.product .woocommerce-Tabs-panel h3 { font-size: 19px; margin-top: 1.9rem; }
}

/* ---- Restos que ya no aplican ------------------------------------------ */
.single-product .woocommerce-product-rating,
.single-product .woocommerce-review-link,
.single-product #reviews,
.single-product .related.products,
.single-product .upsells.products {
	display: none !important;
}

/* El sitio es catálogo: WooCommerce deja un <p class="price"> vacío que solo
   añade un hueco. Se retira junto con el resto de restos de compra. */
.single-product .summary > p.price:empty,
.single-product form.cart,
.single-product .quantity,
.single-product .single_add_to_cart_button,
.single-product .product_meta .sku_wrapper {
	display: none !important;
}

/* WooCommerce impone padding:0 sobre .panel con un selector más específico que
   el mío, así que el contenido quedaba pegado a la pestaña. Se repite aquí su
   mismo selector: al ir después en la hoja, gana por orden de cascada. */
.woocommerce div.product .woocommerce-tabs .panel {
	margin: 0 0 2em;
	padding: 2rem 0 1rem;
}

@media (max-width: 767px) {
	.woocommerce div.product .woocommerce-tabs .panel {
		padding: 1.4rem 0 .75rem;
	}
}

/* ---- "Información adicional" en móvil ----------------------------------
   WooCommerce ya apila filas y celdas por debajo de 768 px (display:block),
   pero la etiqueta conservaba el 42 % de ancho: quedaba media barra gris
   flotando sobre el valor. Aquí cada fila pasa a ser una ficha con la
   etiqueta pequeña encima y el valor destacado debajo.                     */
@media (max-width: 767px) {

	.woocommerce div.product table.shop_attributes {
		display: block;
		border: 0;
		margin: 1rem 0 1.75rem;
	}

	.woocommerce div.product table.shop_attributes tbody { display: block; }

	.woocommerce div.product table.shop_attributes tr {
		display: block;
		margin: 0 0 .5rem;
		padding: .65rem .85rem;
		background: #FFFFFF;
		border: 1px solid #E4E6E9;
		border-left: 3px solid #36A7DF;
		border-radius: 5px;
	}

	.woocommerce div.product table.shop_attributes tr:last-child { margin-bottom: 0; }

	/* Etiqueta: pequeña, en versalitas, sin caja */
	.woocommerce div.product table.shop_attributes th {
		display: block;
		width: auto;
		padding: 0 0 .1rem;
		background: none;
		border: 0;
		font-size: 11.5px;
		font-weight: 600;
		letter-spacing: .06em;
		text-transform: uppercase;
		line-height: 1.5;
		color: #6B8CAF;
	}

	/* Valor: el dato, que es lo que se consulta */
	.woocommerce div.product table.shop_attributes td {
		display: block;
		width: auto;
		padding: 0;
		background: none;
		border: 0;
		font-size: 15px;
		font-weight: 500;
		line-height: 1.45;
		color: #13427C;
	}

	/* En formato ficha, las filas alternas y el hover ya no tienen sentido */
	.woocommerce div.product table.shop_attributes tr:nth-child(even) td,
	.woocommerce div.product table.shop_attributes tr:hover td {
		background: none;
	}
}

/* ---- "Información adicional": formato de fichas en TODOS los tamaños -----
   Se adopta en todas las resoluciones el formato que ya se usaba en móvil.
   En pantallas anchas las fichas se reparten en columnas automáticas, para
   no dejar tarjetas de 900 px de ancho con dos palabras dentro.
   Este bloque va al final a propósito: neutraliza por orden de cascada las
   reglas de tabla anteriores (anchos, fondos y filas alternas).            */
.woocommerce div.product table.shop_attributes {
	display: block;
	width: 100%;
	margin: 1.2rem 0 2rem;
	border: 0;
	border-collapse: separate;
	font-size: 15px;
}

.woocommerce div.product table.shop_attributes tbody {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: .6rem;
}

.woocommerce div.product table.shop_attributes tr {
	display: block;
	margin: 0;
	padding: .7rem .95rem;
	background: #FFFFFF;
	border: 1px solid #E4E6E9;
	border-left: 3px solid #36A7DF;
	border-radius: 5px;
}

.woocommerce div.product table.shop_attributes th {
	display: block;
	width: auto;
	padding: 0 0 .12rem;
	background: none;
	border: 0;
	font-family: Lexend Deca, sans-serif;
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1.5;
	color: #6B8CAF;
}

.woocommerce div.product table.shop_attributes td {
	display: block;
	width: auto;
	padding: 0;
	background: none;
	border: 0;
	font-family: Lexend Deca, sans-serif;
	font-size: 15px;
	font-weight: 500;
	font-style: normal;
	line-height: 1.45;
	color: #13427C;
}

.woocommerce div.product table.shop_attributes td p { margin: 0; }

/* En formato ficha, filas alternas y hover ya no aportan nada */
.woocommerce div.product table.shop_attributes tr:nth-child(even) td,
.woocommerce div.product table.shop_attributes tr:hover td {
	background: none;
}

/* ---- Tabla comparativa PVC espumado vs uralita -------------------------- */
.disgama-comparativa {
	width: 100%;
	margin: 1.6rem 0 1.2rem;
	border-collapse: separate;
	border-spacing: 0;
	font-family: "Lexend Deca", sans-serif;
	font-size: 15px;
	line-height: 1.6;
	border: 1px solid #E4E6E9;
	border-radius: 8px;
	overflow: hidden;
}

.disgama-comparativa thead th {
	padding: .95rem 1.1rem;
	font-size: 15px;
	font-weight: 600;
	text-align: left;
	background: #F5F4F5;
	color: #3C3C3B;
	border-bottom: 1px solid #E4E6E9;
}

/* La columna del PVC va marcada: es la que queremos que se lea primero */
.disgama-comparativa thead th.pvc {
	background: #13427C;
	color: #FFFFFF;
}

.disgama-comparativa thead th.ura {
	background: #EDEDEE;
	color: #6B7A88;
}

.disgama-comparativa tbody th {
	width: 24%;
	padding: .9rem 1.1rem;
	text-align: left;
	font-weight: 600;
	color: #13427C;
	background: #FAFAFB;
	border-bottom: 1px solid #ECEDEF;
	vertical-align: top;
}

.disgama-comparativa tbody td {
	width: 38%;
	padding: .9rem 1.1rem;
	border-bottom: 1px solid #ECEDEF;
	vertical-align: top;
}

.disgama-comparativa tbody td.pvc {
	background: #F0F8FD;
	color: #13427C;
	font-weight: 500;
	box-shadow: inset 3px 0 0 #36A7DF;
}

.disgama-comparativa tbody td.ura {
	background: #FFFFFF;
	color: #6B7A88;
}

.disgama-comparativa tbody tr:last-child th,
.disgama-comparativa tbody tr:last-child td { border-bottom: 0; }

/* Filas del amianto: son el argumento de peso */
.disgama-comparativa tr.destacada th { background: #EAF5FB; }
.disgama-comparativa tr.destacada td.pvc { background: #E3F3FC; }

.nota-legal {
	padding: .9rem 1.1rem;
	background: #F5F4F5;
	border-left: 3px solid #A1D7E3;
	border-radius: 4px;
	font-size: 14px !important;
	line-height: 1.65 !important;
}

/* En móvil la tabla se convierte en fichas apiladas */
@media (max-width: 767px) {
	.disgama-comparativa,
	.disgama-comparativa tbody { display: block; border: 0; }
	.disgama-comparativa thead { display: none; }
	.disgama-comparativa tbody tr {
		display: block;
		margin: 0 0 .7rem;
		border: 1px solid #E4E6E9;
		border-radius: 6px;
		overflow: hidden;
	}
	.disgama-comparativa tbody th {
		display: block;
		width: auto;
		font-size: 12px;
		letter-spacing: .05em;
		text-transform: uppercase;
		color: #13427C;
		background: #F5F4F5;
		border-bottom: 1px solid #E4E6E9;
	}
	.disgama-comparativa tbody td {
		display: block;
		width: auto;
		border-bottom: 1px solid #ECEDEF;
	}
	.disgama-comparativa tbody td::before {
		display: block;
		margin-bottom: .15rem;
		font-size: 11px;
		font-weight: 600;
		letter-spacing: .06em;
		text-transform: uppercase;
	}
	.disgama-comparativa tbody td.pvc::before { content: "PVC espumado"; color: #36A7DF; }
	.disgama-comparativa tbody td.ura::before { content: "Uralita"; color: #9AA6B2; }
}