/* ==========================================================================
   Páginas de seguros construidas con bloques de Gutenberg
   Reproduce el aspecto de las antiguas plantillas page-seguros-*.php
   ========================================================================== */

/* Variables del tema solo para el editor (en la web ya las define main.css) */
.editor-styles-wrapper {
	--color-primary: #1671D4;
	--color-primary-light: #2275ac;
	--color-text: #0D0D0D;
	--color-text-muted: #545454;
	--color-bg: #f5f7fa;
	--color-bg-light: #eef2f6;
	--color-bg-card: #ffffff;
	--color-border-light: #e6edf2;
	--color-success: #2e7d32;
	--color-whatsapp: #25d366;
	--color-whatsapp-hover: #20ba5a;
	--border-radius: 8px;
	--shadow-medium: 0 8px 24px rgba(0, 0, 0, 0.06);
	--container-width: 1240px;
	font-family: 'Inter', sans-serif;
}
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4 {
	font-family: 'Outfit', sans-serif;
}

/* ---------- Banner (bloque Portada) ---------- */
.wp-block-cover.inp-banner {
	min-height: 0;
	margin: 0;
	padding: 100px 20px;
	color: #fff;
	text-align: center;
}
.inp-banner .wp-block-cover__inner-container {
	max-width: var(--container-width);
	margin: 0 auto;
}
.inp-banner .inp-badge {
	display: inline-block;
	margin: 0;
	padding: 4px 12px;
	border-radius: 20px;
	background-color: rgba(255, 255, 255, 0.2);
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.inp-banner .inp-banner-title {
	margin: 10px 0;
	color: #fff;
	font-size: 38px;
	font-weight: 700;
}
.inp-banner .inp-banner-subtitle {
	max-width: 600px;
	margin: 0 auto;
	color: #fff;
	font-size: 16px;
	opacity: 0.9;
}

/* ---------- Sección principal ---------- */
.inp-seguro-section {
	margin: 0;
	padding: 60px 0;
	background-color: var(--color-bg-card);
}
.inp-container {
	box-sizing: border-box;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 20px;
}
.wp-block-columns.inp-seguro-layout {
	gap: 40px;
	margin: 0;
}

.inp-h2 {
	margin: 0 0 20px;
	color: var(--color-primary);
	font-size: 26px;
	font-weight: 600;
}
.inp-lead {
	margin: 0 0 30px;
	color: var(--color-text-muted);
	font-size: 16px;
	line-height: 1.8;
}
.inp-h3-line {
	margin: 0 0 20px;
	padding-left: 12px;
	border-left: 4px solid var(--color-primary);
	color: var(--color-primary);
	font-size: 20px;
	font-weight: 600;
}

/* Tarjetas de coberturas */
.inp-coberturas {
	display: grid;
	gap: 20px;
	margin: 0 0 40px;
}
.inp-coberturas > * {
	margin: 0;
}
.inp-cobertura {
	padding: 20px;
	border-left: 4px solid var(--color-primary-light);
	border-radius: var(--border-radius);
	background-color: var(--color-bg);
}
.inp-cobertura h4 {
	margin: 0 0 8px;
	color: var(--color-text);
	font-size: 16px;
	font-weight: 600;
}
.inp-cobertura p {
	margin: 0;
	color: var(--color-text-muted);
	font-size: 14px;
	line-height: 1.6;
}

/* Caja de ventajas */
.inp-ventajas {
	margin: 0;
	padding: 30px;
	border: 1px dashed var(--color-primary);
	border-radius: var(--border-radius);
	background-color: var(--color-bg-light);
}
.inp-ventajas h3 {
	margin: 0 0 15px;
	color: var(--color-primary);
	font-size: 18px;
	font-weight: 600;
}
.inp-checklist {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--color-text-muted);
	font-size: 14px;
}
.inp-checklist li {
	position: relative;
	margin: 0;
	padding-left: 24px;
}
.inp-checklist li::before {
	content: "\2713";
	position: absolute;
	top: 0;
	left: 0;
	color: var(--color-success);
	font-weight: bold;
}

/* ---------- Tarjeta del asesor ---------- */
.inp-advisor {
	position: sticky;
	top: 100px;
	margin: 0;
	padding: 30px;
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	background: #fff;
	box-shadow: var(--shadow-medium);
	text-align: center;
}
.inp-advisor-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	height: 100px;
	margin: 0 auto 15px;
	border: 3px solid var(--color-primary);
	border-radius: 50%;
	background-color: var(--color-bg);
	color: var(--color-primary);
}
.inp-advisor .inp-advisor-name {
	margin: 0 0 5px;
	color: var(--color-text);
	font-size: 18px;
	font-weight: 600;
}
.inp-advisor-role {
	margin: 0 0 20px;
	color: var(--color-text-muted);
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
}
.inp-advisor-text {
	margin: 0 0 25px;
	color: var(--color-text-muted);
	font-size: 14px;
	line-height: 1.6;
}

/* Botones */
.wp-block-buttons.inp-advisor-buttons {
	display: grid;
	gap: 12px;
	margin: 0;
}
.inp-advisor-buttons .wp-block-button {
	width: 100%;
	margin: 0;
}
.inp-advisor-buttons .wp-block-button .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	box-sizing: border-box;
	width: 100%;
	padding: 12px;
	border: 1px solid transparent;
	border-radius: var(--border-radius);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	transition: all 0.2s ease;
}
.inp-advisor-buttons .inp-btn-call .wp-block-button__link {
	background-color: var(--color-primary);
	color: #fff;
}
.inp-advisor-buttons .inp-btn-call .wp-block-button__link:hover {
	filter: brightness(0.92);
}
.inp-advisor-buttons .inp-btn-whatsapp .wp-block-button__link {
	background-color: var(--color-whatsapp);
	color: #fff;
}
.inp-advisor-buttons .inp-btn-whatsapp .wp-block-button__link:hover {
	background-color: var(--color-whatsapp-hover);
}
.inp-advisor-buttons .inp-btn-outline .wp-block-button__link {
	border-color: var(--color-primary);
	background-color: transparent;
	color: var(--color-primary);
}
.inp-advisor-buttons .inp-btn-outline .wp-block-button__link:hover {
	background-color: var(--color-primary);
	color: #fff;
}

/* Iconos de los botones (los mismos SVG que pinta inpogest_get_svg) */
.inp-btn-call .wp-block-button__link::before,
.inp-btn-whatsapp .wp-block-button__link::before {
	content: "";
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--inp-icon) center / contain no-repeat;
	mask: var(--inp-icon) center / contain no-repeat;
}
.inp-btn-call {
	--inp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}
.inp-btn-whatsapp {
	--inp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946C.06 5.348 5.397.01 12.008.01c3.202.001 6.212 1.246 8.477 3.514 2.266 2.268 3.507 5.28 3.505 8.484-.004 6.657-5.34 11.997-11.953 11.997-2.005-.001-3.973-.502-5.724-1.457L0 24zm6.59-4.846c1.6.95 3.498 1.45 5.419 1.451 5.428 0 9.845-4.383 9.848-9.777.001-2.612-1.015-5.07-2.861-6.92C17.207 2.057 14.74 1.04 12.11 1.04c-5.432 0-9.849 4.383-9.852 9.778-.001 2.01.528 3.975 1.535 5.696L2.73 20.73l4.31-.976zM17.447 14.3c-.293-.146-1.734-.856-2.002-.953-.267-.096-.462-.146-.656.146-.194.291-.75.953-.919 1.147-.168.193-.337.218-.63.072-1.285-.642-2.224-1.12-3.117-2.66-.235-.403.235-.374.67-.786.136-.128.204-.258.272-.387.068-.13.034-.243-.017-.34-.052-.096-.462-1.114-.633-1.525-.166-.403-.332-.348-.462-.354h-.394c-.136 0-.356.05-.543.255-.187.205-.714.698-.714 1.702 0 1.004.73 1.977.83 2.113.102.137 1.437 2.196 3.483 3.076.487.21.867.335 1.164.43.49.155.935.133 1.289.08.394-.058 1.734-.707 1.98-1.388.248-.682.248-1.267.174-1.388-.074-.121-.267-.193-.56-.34z'/%3E%3C/svg%3E");
}

/* ---------- Móvil ---------- */
@media (max-width: 781px) {
	.inp-advisor {
		position: static;
	}
	.inp-banner .inp-banner-title {
		font-size: 30px;
	}
}
