/* Pagina del seguro dental (modulos/dental-pilar.php).
   Se apoya en /css/home-asisa.css (.hx) y /css/salud-pilar.css (.sp: intro, indice, cuadro medico, llamada final);
   aqui van solo los bloques propios, dentro de .dp-*. */

#calcula-precio-dental {
	scroll-margin-top: 70px;
}

/* ---------- Modalidades y precios ---------- */
.dp-precios {
	background: var(--hx-fondo);
}
.dp-planes {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}
.dp-plan {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 28px 22px 22px;
	border: 1px solid var(--hx-linea);
	border-radius: var(--hx-radio);
	background: #fff;
	box-shadow: var(--hx-sombra);
}
.dp-plan--destacado {
	border: 2px solid var(--hx-naranja);
	box-shadow: var(--hx-sombra-alta);
}
.dp-plan-cinta {
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
	padding: 4px 14px;
	border-radius: 999px;
	background: var(--hx-naranja);
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .04em;
	text-transform: uppercase;
	white-space: nowrap;
	color: #fff;
}
.dp-plan-icono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-bottom: 14px;
	border-radius: 14px;
	background: rgba(255, 84, 0, .1);
	font-size: 1.2rem;
	color: var(--hx-naranja);
}
.dp-plan-para {
	margin: 0 0 2px;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--hx-azul-claro);
}
.dp-plan h3 {
	margin: 0 0 12px;
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--hx-azul);
}
.dp-plan-precio {
	display: flex;
	align-items: baseline;
	gap: 2px;
	margin: 0;
	font-size: 2.3rem;
	font-weight: 800;
	line-height: 1;
	color: var(--hx-naranja);
}
/* Modalidad sin precio publicado (Dental Familiar): texto en lugar del importe */
.dp-plan-precio--calcula {
	font-size: 1.45rem;
}
.dp-plan-desde {
	margin-right: 6px;
	font-size: .8rem;
	font-weight: 700;
	color: var(--hx-gris);
}
.dp-plan-unidad {
	margin: 6px 0 14px;
	font-size: .82rem;
	color: var(--hx-gris);
}
.dp-plan-texto {
	flex: 1;
	margin: 0 0 18px;
	font-size: .92rem;
	line-height: 1.55;
	color: var(--hx-texto);
}

/* ---------- Coberturas ---------- */
.dp-cob-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}
.dp-cob-col {
	padding: 26px 24px;
	border-radius: var(--hx-radio);
	border: 1px solid var(--hx-linea);
	background: #fff;
	box-shadow: var(--hx-sombra);
}
.dp-cob-titulo {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 14px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--hx-linea);
	font-size: 1.05rem;
	font-weight: 800;
}
.dp-cob-col--gratis .dp-cob-titulo {
	color: var(--hx-verde);
}
.dp-cob-col--descuento .dp-cob-titulo {
	color: var(--hx-naranja);
}
.dp-cob-col--reembolso .dp-cob-titulo {
	color: var(--hx-azul-claro);
}
.dp-cob-col ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.dp-cob-col li {
	position: relative;
	padding: 7px 0 7px 22px;
	font-size: .93rem;
	line-height: 1.45;
	color: var(--hx-texto);
}
.dp-cob-col li::before {
	content: "";
	position: absolute;
	top: 14px;
	left: 4px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
	opacity: .35;
}
.dp-cob-col--gratis li::before {
	background: var(--hx-verde);
	opacity: 1;
}
.dp-cob-col--descuento li::before {
	background: var(--hx-naranja);
	opacity: 1;
}
.dp-cob-col--reembolso li::before {
	background: var(--hx-azul-claro);
	opacity: 1;
}
.hx .dp-cob-enlace {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	font-size: .9rem;
	font-weight: 700;
	color: var(--hx-azul);
}
.dp-cob-extra {
	margin: 16px 0 0;
	padding: 14px 16px;
	border-radius: 14px;
	background: var(--hx-fondo);
	font-size: .9rem;
	color: var(--hx-gris);
}
.dp-cob-extra strong {
	color: var(--hx-texto);
}

/* ---------- Condiciones ---------- */
.dp-cond {
	background: var(--hx-fondo);
}
.dp-cond-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.dp-cond-grid li {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 22px 14px;
	border: 1px solid var(--hx-linea);
	border-radius: 18px;
	background: #fff;
	text-align: center;
}
.dp-cond-grid i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	margin-bottom: 6px;
	border-radius: 50%;
	background: var(--hx-verde-fondo);
	font-size: 1.1rem;
	color: var(--hx-verde);
}
.dp-cond-grid strong {
	font-size: .98rem;
	color: var(--hx-azul);
}
.dp-cond-grid span {
	font-size: .84rem;
	line-height: 1.4;
	color: var(--hx-gris);
}

/* ---------- Tablet ---------- */
@media (max-width: 1199.98px) {
	.dp-planes {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 28px;
	}
	.dp-cond-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
@media (max-width: 991.98px) {
	.dp-cob-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- Móvil ---------- */
@media (max-width: 575.98px) {
	.dp-planes {
		grid-template-columns: minmax(0, 1fr);
	}
	.dp-cond-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}
	.dp-cob-col {
		padding: 22px 18px;
	}
}

/* Pagina del seguro de vida (modulos/vida-pilar.php): «¿Cuánto capital necesito?» en tres pasos */
.vp-capital {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	max-width: 960px;
	margin: 0 auto 28px !important;
}
@media (max-width: 575.98px) {
	.vp-capital {
		grid-template-columns: minmax(0, 1fr);
	}
}
/* Solo dos seguros de vida: tarjetas más anchas y centradas */
.vp-planes {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 820px;
	margin: 0 auto;
}
@media (max-width: 575.98px) {
	.vp-planes {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Pagina del seguro de viaje (modulos/viaje-pilar.php): cuatro seguros (tambien Cruise desde el 04/10/2026) y
   comparativa de cuatro columnas; los cuatro consejos de «elige» van en dos filas de dos */
.vj-planes {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
.vj-matriz {
	min-width: 860px;
}
.hx .vj-elige {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 1199.98px) {
	.vj-planes {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 767.98px) {
	.vj-planes {
		grid-template-columns: minmax(0, 1fr);
		max-width: 520px;
		margin: 0 auto;
	}
	.hx .vj-elige {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Pagina del seguro de mascotas (modulos/mascotas-pilar.php): responsabilidad civil sin precio fijo */
.mp-plan-capital {
	font-size: 1.6rem;
}

/* Pagina del seguro medico internacional (modulos/internacional-pilar.php): precio para estudiantes y para trabajadores */
.ip-precios {
	margin: 0 0 4px;
	padding: 0;
	list-style: none;
}
.ip-precios li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 0;
	border-top: 1px solid var(--hx-linea);
}
.ip-precios li:last-child {
	border-bottom: 1px solid var(--hx-linea);
}
.ip-precios-perfil {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .9rem;
	font-weight: 700;
	color: var(--hx-azul);
}
.ip-precios-perfil i {
	color: var(--hx-azul-claro);
}
.ip-precios-valor {
	font-size: 1.7rem;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
	color: var(--hx-naranja);
}
.ip-precios-valor small {
	font-size: .75rem;
	font-weight: 700;
	color: var(--hx-gris);
}
/* Tabla de copagos: el servicio puede ocupar dos líneas */
.ip-copagos tbody th {
	font-weight: 500;
	line-height: 1.4;
}

/* Fichas de producto de ASISA Salud (modulos/producto-salud-pilar.php) */
.ps-precio-grid {
	align-items: stretch;
}
.ps-precio-grid .dp-plan {
	margin-top: 13px;
}
/* La columna del producto de la pagina, resaltada en la comparativa */
.sp-matriz th.ps-actual,
.sp-matriz td.ps-actual {
	background: rgba(255, 84, 0, .06);
}
.hx .sp-matriz thead th.ps-actual {
	background: var(--hx-naranja);
	color: #fff;
}
.ps-docs {
	margin-top: 28px;
	padding: 22px 24px;
	border: 1px solid var(--hx-linea);
	border-radius: var(--hx-radio);
	background: #fff;
}
.ps-docs-titulo {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	font-weight: 800;
	color: var(--hx-azul);
}
.ps-docs-titulo i {
	color: var(--hx-naranja);
}
.ps-docs ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.hx .ps-docs a {
	display: inline-flex;
	padding: 8px 14px;
	border: 1px solid var(--hx-linea);
	border-radius: 999px;
	font-size: .88rem;
	font-weight: 600;
	color: var(--hx-azul);
	text-decoration: none;
}
.hx .ps-docs a:hover {
	border-color: var(--hx-naranja);
	color: var(--hx-naranja);
}
/* Tabla de reembolso de cuatro columnas (ASISA Integral, copCabecera): mas compacta en movil para que quepa */
@media (max-width: 575.98px) {
	.hx .ps-reembolso th,
	.hx .ps-reembolso td {
		padding: 9px 6px;
		font-size: .74rem;
		white-space: normal;
	}
	.hx .ps-reembolso th:first-child {
		padding-left: 12px;
	}
	.hx .ps-reembolso td:last-child,
	.hx .ps-reembolso thead th:last-child {
		padding-right: 12px;
	}
}

/* Fichas de los seguros de viaje (modulos/producto-viaje-pilar.php): «Qué no cubre», franja bajo las tres tarjetas */
.hx .pv-nocubre {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 28px;
	margin-top: 20px;
	padding: 18px 24px;
	border-radius: var(--hx-radio);
	border: 1px dashed var(--hx-linea);
	background: #fff;
}
.hx .pv-nocubre-titulo {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: .98rem;
	font-weight: 800;
	color: var(--hx-texto);
}
.hx .pv-nocubre-titulo i {
	color: var(--hx-gris);
}
.hx .pv-nocubre ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.hx .pv-nocubre li {
	position: relative;
	padding-left: 16px;
	font-size: .9rem;
	color: var(--hx-texto);
}
.hx .pv-nocubre li::before {
	content: "";
	position: absolute;
	top: 9px;
	left: 2px;
	width: 7px;
	height: 2px;
	background: var(--hx-gris);
}
@media (max-width: 575.98px) {
	.hx .pv-nocubre {
		padding: 16px 18px;
	}
	.hx .pv-nocubre ul {
		flex-direction: column;
	}
}