/* ========================================
   HOME PAGE STYLES
   Extracted from style.css
   ======================================== */

/* Estilos específicos para pantallas de 1024px - thumb-disease (excluye cards home MODULO-5) */
@media screen and (max-width: 1350px) and (min-width: 769px) {
	.thumb-disease:not(.home-disease-card) {
		height: 213px !important;
		width: 98%;
		& h2 {
			font-size: 11px !important;
			font-weight: 800;
		}
		
	}
	
	.imgcard {
		object-fit: cover;
		width: 270px;
		height: 80px !important;
		border-radius: 24px;
	}
	
	.category-misc li {
		width: 22px;
		height: 9px;
		border-radius: 0 0 4px 4px;
		display: inline-block;
	}
	
	/* Card naranja home — Figma 265×384 */
	.enfermedades-prevenibles-section .box-orange {
		width: 265px;
		height: 384px !important;
		min-height: 384px;
		max-height: 384px;
		margin-top: 0;
		padding: 28px 16px;
		border-radius: 16px;
		background: none !important;

		& .box-orange__title {
			font-size: 24px;
		}
	}
	.btnhomeindex{
		padding: 0 16px !important;
	}
	.enfermedades-prevenibles-section .home-feature-card {
		width: 265px;
	}

	.enfermedades-prevenibles-section .home-feature-card__image {
		height: 128px !important;
	}
	
}

/* Swiper Home Container */
.swiper-home {
	position: relative;
	width: 100%;
	min-height: 600px;
	padding-top: -40px; /* Ahora usamos padding en lugar de margin negativo */
}

.swiper-home .swiper-slide {
	position: relative;
	min-height: 874px !important;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Contenedor — Figma 1120px (12527:68036) */
.swiper-home .swiper-slide > .container,
.swiper-home > .container {
	max-width: 1120px;
	margin: 0 auto;
}

/* Swiper Home Navigation Buttons */
.swiper-home .swiper-button-prev {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: var(--border-radius);
	top: -160px;
	left: 160px;
	background-color: var(--orange-color);
}

.swiper-home .swiper-button-next {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: var(--border-radius);
	top: -186px;
	left: 263px;
	background-color: var(--orange-color);
}

.swiper-home .swiper-button-prev.swiper-button-disabled,
.swiper-home .swiper-button-next.swiper-button-disabled {
	opacity: 0.35;
	cursor: default;
	pointer-events: none;
}

.swiper-home .swiper-button-prev.swiper-button-lock,
.swiper-home .swiper-button-next.swiper-button-lock {
	display: block;
}

/* Swiper Home Pagination */
.swiper-home .swiper-pagination {
	left: 10px;
	top: -378px;
	position: absolute;
	width: fit-content;
	gap: 4px;
}

.swiper-home .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 37.648px;
	height: 6px;
	margin: 0;
	background-color: rgba(255, 78, 0, 0.3);
	border-radius: 100px;
}

.swiper-home .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active {
	background-color: #ff4e00;
}

/* ========================================
   HOME HERO SLIDES
   ======================================== */

/* Home Buttons */
@media (min-width: 992px) {
	.btnhome{
		width: 40% !important;
	}
}

/* Estilos del botón "Infórmate aquí" según Figma */
.hero-slide-content .btn-custom.btnhome {
	background-color: #FF4E00 !important;
	height: 50px !important;
	padding: 16px 32px !important;
	border-radius: 100px !important;
	box-shadow: 0px 126px 35px 0px rgba(0, 0, 0, 0),
		0px 81px 32px 0px rgba(0, 0, 0, 0.01),
		0px 45px 27px 0px rgba(0, 0, 0, 0.05),
		0px 20px 20px 0px rgba(0, 0, 0, 0.09),
		0px 5px 11px 0px rgba(0, 0, 0, 0.1),
		0px 0px 0px 0px rgba(0, 0, 0, 0.1) !important;
	font-family: 'Inter', sans-serif !important;
	font-weight: 700 !important; /* Bold según Figma */
	font-size: 14px !important;
	line-height: 1.2 !important;
	color: #FFFFFF !important;
	letter-spacing: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: none !important;
	text-decoration: none !important;
	transition: background-color 0.3s ease !important;
}

/* Estilos de los botones "¿Dónde vacunarme?" y "Vacunas recomendadas" según Figma */
.hero-slide-content .btn-custom:not(.btnhome) {
	background-color: #FF4E00 !important;
	height: 50px !important;
	padding: 16px 32px !important;
	border-radius: 100px !important;
	box-shadow: 0px 126px 35px 0px rgba(0, 0, 0, 0),
		0px 81px 32px 0px rgba(0, 0, 0, 0.01),
		0px 45px 27px 0px rgba(0, 0, 0, 0.05),
		0px 20px 20px 0px rgba(0, 0, 0, 0.09),
		0px 5px 11px 0px rgba(0, 0, 0, 0.1),
		0px 0px 0px 0px rgba(0, 0, 0, 0.1) !important;
	font-family: 'Inter', sans-serif !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	color: #FFFFFF !important;
	letter-spacing: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: none !important;
	text-decoration: none !important;
	transition: background-color 0.3s ease !important;
}

/* Estados hover y pressed de los botones naranja (primary) del hero según Figma */
.hero-slide-content .btn-custom:hover,
.hero-slide-content .btn-custom:focus {
	background-color: var(--light-orange-color) !important;
	box-shadow: 0px 126px 35px 0px rgba(0, 0, 0, 0),
		0px 81px 32px 0px rgba(0, 0, 0, 0.01),
		0px 45px 27px 0px rgba(0, 0, 0, 0.05),
		0px 20px 20px 0px rgba(0, 0, 0, 0.09),
		0px 5px 11px 0px rgba(0, 0, 0, 0.1),
		0px 0px 0px 0px rgba(0, 0, 0, 0.1) !important;
}

.hero-slide-content .btn-custom:active {
	background-color: var(--light-orange-color) !important;
	box-shadow: 0px 126px 35px 0px rgba(0, 0, 0, 0),
		0px 81px 32px 0px rgba(0, 0, 0, 0),
		0px 45px 27px 0px rgba(0, 0, 0, 0),
		0px 20px 20px 0px rgba(0, 0, 0, 0),
		0px 5px 11px 0px rgba(0, 0, 0, 0.1),
		0px 0px 0px 0px rgba(0, 0, 0, 0.1) !important;
}

.hero-slide-content .btn-custom-outline {
	background-color: #FFFFFF !important;
	height: 50px !important;
	padding: 16px 32px !important;
	border-radius: 100px !important;
	border: 1px solid #C6C5C5 !important; /* Color según Figma */
	box-shadow: none !important;
	font-family: 'Inter', sans-serif !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	color: #4b4b4b !important; /* Color según Figma */
	letter-spacing: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	text-decoration: none !important;
	transition: border-color 0.3s ease !important;
}

.hero-slide-content .btn-custom-outline:hover {
	background-color: #FFFFFF !important;
	color: #4b4b4b !important;
	border-color: #FF4E00 !important;
}

.hero-slide-content .btn-custom-outline:active {
	background-color: rgba(255, 78, 0, 0.10) !important;
	border-color: #FF4E00 !important;
}

.btnhome1 {
	padding-left: 1em;
	padding-right: 1em;
	white-space: nowrap;
	width: auto;
}

@media (min-width: 992px) {
	.hero-slide-content .hero-slide-ctas {
		flex-wrap: nowrap !important;
	}
}

/* Background Images for Slides */
.slide-bg1 {
	background-image: url('/images/fondos/HERO1.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.slide-bg2 {
	background-image: url('/images/fondos/HERO2.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.slide-bg3 {
	background-image: url('/images/fondos/HERO3.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.slide-bg4 {
	background-image: url('/images/fondos/HERO4.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* Hero slide — Figma 11102:41648 */
.hero-slide-text {
	display: flex;
	flex-direction: column;
	gap: 32px;
	width: 100%;
}

.hero-slide-content {
	position: relative;
	z-index: 2;
	min-height: 580px;
	padding-top: 0;
	gap: 2rem; /* 32px — Figma Head-Hero */
}

/* La paginación del hero se posiciona con top negativo y tapaba los CTAs */
.home-hero-swiper-pagination-container {
	pointer-events: none;
}

.home-hero-swiper-pagination-container .swiper-pagination-bullet,
.home-hero-swiper-pagination-container .swiper-button-prev,
.home-hero-swiper-pagination-container .swiper-button-next {
	pointer-events: auto;
	cursor: pointer;
}

/* Título — H1/H1 Bold 40 */
.hero-slide-title {
	font-family: 'Inter', sans-serif;
	font-weight: 900;
	font-size: 40px;
	line-height: 1.2;
	color: #151515;
	letter-spacing: 0;
	word-break: break-word;
}

/* Descripción — H1/P1/P1 Regular 18 */
.hero-slide-description {
	color: var(--UI-GSK-Text-Gray, #4b4b4b);
	font-family: Inter, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	word-break: break-word;
}

.hero-slide-content .btn,
.hero-slide-content a.btn {
	margin: 0;
}

/* Imágenes del hero slider — Figma Compo1 (12527:68036) */
.swiper-home .hero-slide-image-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 992px) {
	.swiper-home .hero-slide-image-wrap {
		flex-shrink: 0;
	}

	.swiper-home .hero-slide-image {
		width: 100%;
		height: auto;
		object-fit: contain;
		object-position: center;
		margin: 0;
		display: block;
	}

	.swiper-home .slide-bg1 .hero-slide-image-wrap,
	.swiper-home .slide-bg1 .hero-slide-image {
		width: 100%;
		max-width: 516.783px;
	}

	.swiper-home .slide-bg2 .hero-slide-image-wrap,
	.swiper-home .slide-bg2 .hero-slide-image {
		width: 100%;
		max-width: 551.985px;
	}

	.swiper-home .slide-bg3 .hero-slide-image-wrap,
	.swiper-home .slide-bg3 .hero-slide-image {
		width: 100%;
		max-width: 516px;
	}

	.swiper-home .slide-bg4 .hero-slide-image-wrap,
	.swiper-home .slide-bg4 .hero-slide-image {
		width: 100%;
		max-width: 487.002px;
	}

	.swiper-home .slide-bg4 .hero-slide-image {
		aspect-ratio: 39 / 37;
	}
}

@media (max-width: 991.98px) {
	/* Hero mobile — Figma HERO MOBILE V2 (11129:60924) */
	.swiper-home {
		min-height: auto;
		padding-top: 0;
	}

	.swiper-home .swiper-slide {
		min-height: auto !important;
		align-items: flex-start;
		justify-content: flex-start;
	}

	.swiper-home .swiper-slide > .container {
		padding-top: 24px;
		padding-bottom: 24px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.swiper-home .swiper-slide .row.flex-column-reverse {
		row-gap: 16px;
		align-items: stretch !important;
	}

	.swiper-home .swiper-slide .row.flex-column-reverse > .col-12.col-lg-6:last-child {
		display: flex;
		justify-content: center;
		align-items: flex-start;
		padding-top: 0;
		margin-top: 0;
	}

	.hero-slide-content {
		display: flex;
		flex-direction: column;
		gap: 24px;
		min-height: auto;
		padding-top: 0;
		align-items: flex-start;
		text-align: left;
		width: 100%;
	}

	.hero-slide-text {
		display: flex;
		flex-direction: column;
		gap: 8px;
		width: 100%;
	}

	.hero-slide-text .hero-slide-title,
	.hero-slide-text .hero-slide-description {
		margin-bottom: 0 !important;
	}

	.hero-slide-content .hero-slide-title {
		font-family: 'Inter', sans-serif;
		font-weight: 700;
		font-size: 24px;
		line-height: 1.2;
		color: #151515;
		letter-spacing: 0;
		word-break: break-word;
	}

	.hero-slide-title br {
		display: none;
	}

	.hero-slide-content .hero-slide-description {
		font-family: 'Inter', sans-serif;
		font-size: 16px;
		font-weight: 400;
		line-height: 1.4;
		color: #4b4b4b;
	}

	.hero-slide-content .btn,
	.hero-slide-content .hero-slide-ctas,
	.hero-slide-content .d-flex.flex-wrap {
		margin-top: 0 !important;
		width: 100%;
	}

	.hero-slide-content .hero-slide-ctas {
		gap: 16px !important;
	}

	.swiper-home .hero-slide-image-wrap {
		width: 100%;
		height: auto;
		flex-shrink: 0;
		margin: 0 auto;
	}

	.swiper-home .hero-slide-image {
		width: 100%;
		height: auto;
		object-fit: contain;
		object-position: center;
		margin: 0;
		padding-top: 0;
		display: block;
	}

	.swiper-home .slide-bg1 .hero-slide-image-wrap,
	.swiper-home .slide-bg1 .hero-slide-image {
		max-width: 167.379px;
	}

	.swiper-home .slide-bg1 .hero-slide-image {
		aspect-ratio: 77 / 92;
	}

	.swiper-home .slide-bg2 .hero-slide-image-wrap,
	.swiper-home .slide-bg2 .hero-slide-image,
	.swiper-home .slide-bg3 .hero-slide-image-wrap,
	.swiper-home .slide-bg3 .hero-slide-image {
		max-width: 208.489px;
	}

	.swiper-home .slide-bg4 .hero-slide-image-wrap,
	.swiper-home .slide-bg4 .hero-slide-image {
		max-width: 210.814px;
	}

	.swiper-home .slide-bg4 .hero-slide-image {
		aspect-ratio: 39 / 37;
	}
}

@media (max-width: 768px) {
	.swiper-home .swiper-slide {
		min-height: 561px !important;
	}

	.swiper-home .swiper-slide .row.flex-column-reverse > .col-12.col-lg-6:last-child {
		display: flex;
		justify-content: center;
		align-items: flex-start;
		padding-top: 0;
		margin-top: 47px;
	}

	.swiper-home .swiper-pagination {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		width: 100% !important;
		display: flex;
		justify-content: center;
		margin: 0;
	}
}

/* ========================================
   HOME SECTIONS
   ======================================== */

/* Redes Section */
.redes-section{
	/* margin-top: 48px; */
	max-width: 1120px;
	width: 100%;
}

/* Título "Informarte es cuidarte" según Figma */
.redes-section h2.fw-bold {
	font-size: 24px;
	line-height: 1.2;
	color: #151515;
	margin-bottom: 16px;
}

.redes-section .btn-custom {
	background-color: var(--orange-color);
	border-color: var(--orange-color);
	color: var(--white-color);
	height: 50px;
	padding: 16px 32px;
	border-radius: 100px;
	font-weight: 700;
	transition: background-color 0.3s ease;
}

.redes-section .btn-custom:hover {
	background-color: var(--light-orange-color);
	border-color: var(--orange-color);
	color: var(--white-color);
	text-decoration: none;
}

/* Texto "Te invitamos a mantenerte informado" según Figma */
.redes-texto-invitacion {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	color: #4b4b4b;
	letter-spacing: 0;
	margin-top: 0;
	margin-bottom: 0;
}

.redes-section img.card-img-top {
	border-radius: 4px;
	object-fit: cover;
	width: 100%;
	height: 260px;
	padding: 16px;
}

.redes-section .row.g-4 {
	--bs-gutter-x: 20px;
	--bs-gutter-y: 20px;
}

.redes-section .card {
	border-radius: 6px;
}

.redes-section .card-body p.small {
	opacity: 0.6;
	color: #000;
	font-size: 14px;
	font-weight: 400;
}

.redes-section .card-body a.text-dark {
	color: #151515 !important;
	font-size: 16px;
}


/* Referencias a la misma altura */
.referencias-section {
	max-width: 1120px;
	width: 100%;
	padding: 0 12px;
}

.referencias-home {
	margin-top: 0;
	padding-top: 0 !important;
	border-top: none !important;
	width: 100%;
	max-width: 1099px;
	margin-left: auto;
	margin-right: auto;
	font-size: 14px !important;
}

body.home .referencias-home {
	margin-top: -69px !important;
}

.referencias-home strong {
	display: block;
	margin-bottom: 16px;
	font-size: 14px !important;
}

.referencias-home strong + br {
	display: none;
}

.referencias-home ol,
.referencias-home .small {
	font-size: 14px !important;
	list-style: decimal;
	padding-left: 21px;
	margin: 0;
}

.referencias-home ol li {
	font-size: 14px !important;
}

.referencias-home ol li a {
	font-size: 14px !important;
}

/* Box White Home */
.box-white-home {
	min-height: 360px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	background-color: #fff;
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
}

/* Enfermedades Prevenibles Section */
.enfermedades-prevenibles-section{
	background-image: url('/images/fondos/MODULO HOME 2.png'); /* reemplaza con la ruta correcta */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-top: 48px;
  margin-bottom: 48px;
}

/* Título — Figma Head-Modulos 01 (11119:24455) / H2 Bold 32 */
.enfermedades-prevenibles-section__title {
	font-family: 'Inter', sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: #151515;
	text-align: center;
	letter-spacing: 0;
	word-break: break-word;
	margin: 0;
	padding: 0;
}

.enfermedades-prevenibles-section__title-line {
	display: block;
}

/* Card naranja — imagen cubre todo el fondo (11119:24336) */
.enfermedades-prevenibles-section .box-orange {
	position: relative;
	isolation: isolate;
	display: flex;
	width: 265px;
	height: 384px !important;
	min-height: 384px;
	max-height: 384px;
	padding: 28px 16px;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	gap: 24px;
	flex-shrink: 0;
	border-radius: 16px;
	margin-top: 0;
	overflow: hidden;
	background: none !important;
	background-image: none !important;
	box-shadow: 4px 4px 25px 0 rgba(0, 0, 0, 0.2);
}

.enfermedades-prevenibles-section__cards-row {
	gap: 20px;
	margin-left: 0;
	margin-right: 0;
	flex-wrap: nowrap;
}

.enfermedades-prevenibles-section__cards-row > .col-auto {
	padding: 0;
	flex: 0 0 auto;
}

/* 1024px — 4 cards proporcionales en una fila */
@media screen and (min-width: 992px) and (max-width: 1199.98px) {
	/* Armonía 1024px: el contenedor del Hero usa max-width:1120px sin
	   condicionar (línea ~80), no efectivo a este ancho (1120 > viewport),
	   quedando pegado al borde (0px de margen) en vez de calzar con el
	   margen real (24px) del resto de las secciones. */
	.swiper-home .swiper-slide > .container,
	.swiper-home > .container {
		max-width: 960px;
	}

	.enfermedades-prevenibles-section.container {
		max-width: 960px;
	}

	.enfermedades-prevenibles-section__cards-row.cardhomeindex {
		display: flex !important;
		flex-wrap: nowrap !important;
		justify-content: center !important;
		gap: 16px;
		width: 100%;
	}

	.enfermedades-prevenibles-section__cards-row.cardhomeindex > .col-auto {
		flex: 0 0 calc((100% - 48px) / 4);
		width: calc((100% - 48px) / 4);
		max-width: calc((100% - 48px) / 4);
		min-width: 0;
	}

	.enfermedades-prevenibles-section .box-orange {
		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		aspect-ratio: 265 / 384;
		padding: 20px 12px;
		gap: 16px;
	}

	.enfermedades-prevenibles-section .box-orange .box-orange__title {
		font-size: 18px !important;
	}

	.enfermedades-prevenibles-section .box-orange .box-orange__btn,
	.enfermedades-prevenibles-section .box-orange .btn-custom-outline.box-orange__btn {
		height: 44px !important;
		padding: 12px 16px !important;
		font-size: 12px !important;
	}

	.enfermedades-prevenibles-section .box-orange .box-orange__btn img {
		width: 14px;
		height: 14px;
	}

	.enfermedades-prevenibles-section .home-feature-card {
		width: 100% !important;
	}

	.enfermedades-prevenibles-section .home-feature-card__image {
		height: auto !important;
		min-height: 0;
		aspect-ratio: 265 / 128;
		padding: 0 10px 6px;
	}

	.enfermedades-prevenibles-section .home-feature-card__label {
		font-size: 10px;
		padding: 3px 6px;
	}

	.enfermedades-prevenibles-section .home-feature-card__body {
		gap: 10px;
		padding-top: 10px;
	}

	.enfermedades-prevenibles-section .home-feature-card__title {
		font-size: 14px;
		line-height: 1.3;
	}

	.enfermedades-prevenibles-section .home-feature-card__description {
		font-size: 12px;
		line-height: 1.35;
	}

	.enfermedades-prevenibles-section .home-feature-card__link img {
		width: 14px;
		height: 14px;
	}

	.home-diseases-section.container {
		max-width: 960px;
	}

	/* Armonía 1024px: sin esto, redes-section/referencias-section heredan el
	   max-width:1120px sin condicionar (home.css, reglas base) y quedan sin
	   margen real (1120 > 1024). Se lleva a 960px para calzar con el mismo
	   margen que enfermedades-prevenibles-section/home-diseases-section en
	   este rango. Ninguna de las dos clases se comparte fuera de la home. */
	.redes-section,
	.referencias-section {
		max-width: 960px;
	}

	.home-diseases-section__head {
		margin-bottom: 48px;
	}

	.home-diseases-section__pager-inner {
		max-width: 100%;
	}

	#home-diseases-swiper {
		padding-left: 0;
		padding-right: 0;
	}

	#home-diseases-swiper .swiper-slide {
		width: calc((100% - 60px) / 4);
	}

	#home-diseases-swiper .home-disease-card {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		aspect-ratio: 265 / 274;
		padding: 0 12px 12px 12px;
		gap: 12px;
	}

	#home-diseases-swiper .home-disease-card__img {
		height: auto !important;
		aspect-ratio: 233 / 112;
	}

	#home-diseases-swiper .home-disease-card__title {
		font-size: 14px;
		min-height: 0;
	}

	#home-diseases-swiper .home-disease-card__labels li {
		width: 22px;
		height: 6px;
	}

	.section-descarga-index .container {
		max-width: 1120px;
	}

	.section-descarga-index .section-descarga-index__cards {
		flex-wrap: nowrap !important;
		gap: 20px;
	}

	.section-descarga-index .descarga-card-col {
		flex: 0 0 calc((100% - 60px) / 4);
		width: calc((100% - 60px) / 4) !important;
		max-width: calc((100% - 60px) / 4) !important;
		min-width: 0;
	}

	.section-descarga-index .descarga-card-img {
		height: auto;
		aspect-ratio: 265 / 142;
	}

	.section-descarga-index .descarga-card-body {
		min-height: 0;
		padding: 12px;
	}

	.section-descarga-index .descarga-card-title,
	.section-descarga-index .titledescarga {
		font-size: 14px !important;
		line-height: 1.4;
	}

	.section-descarga-index .descarga-card-link,
	.section-descarga-index .link-descargar {
		font-size: 12px;
		gap: 6px;
		padding: 6px 2px;
	}

	.section-descarga-index .descarga-card-link__icon {
		width: 14px;
		height: 14px;
	}

	.section-descarga-index .descarga-icon {
		width: 28px;
		height: 28px;
		padding: 3px;
		bottom: 6px;
		right: 6px;
	}

	.section-descarga-index .descarga-icon img {
		width: 20px;
		height: 20px;
	}

	.blog-home-wrapper .container {
		max-width: 1120px;
		padding-left: 8px;
		padding-right: 8px;
	}

	.enfermedades-prevenibles-section__disclaimer {
		padding-left: 20px;
		padding-right: 20px;
	}

	.blog-home-section__disclaimer,
	.blog-home-wrapper .referencias-blog-texto {
		white-space: normal;
		max-width: 100%;
	}

	.blog-home-section__content {
		max-width: 1120px;
	}

	.blog-home-section__cards .home-blog-card-col {
		flex: 0 0 calc((100% - 45px) / 4);
		width: calc((100% - 45px) / 4) !important;
		max-width: calc((100% - 45px) / 4) !important;
		min-width: 0;
	}

	.blog-home-wrapper .home-blog-card {
		width: 100% !important;
	}

	.blog-home-wrapper .home-blog-card__image {
		height: auto !important;
		aspect-ratio: 265 / 142;
	}

	.blog-home-wrapper .home-blog-card__body {
		gap: 10px;
		padding-top: 10px;
	}

	.blog-home-wrapper .home-blog-card__tag {
		font-size: 10px;
	}

	.blog-home-wrapper .home-blog-card__title {
		font-size: 14px;
		line-height: 1.3;
	}

	.blog-home-wrapper .home-blog-card__desc {
		font-size: 12px;
		line-height: 1.35;
	}

	.blog-home-wrapper .home-blog-card__badge {
		width: 28px;
		height: 28px;
		padding: 3px;
		top: 6px;
		right: 6px;
	}

	.blog-home-wrapper .home-blog-card__badge img {
		width: 20px;
		height: 20px;
	}
}

.enfermedades-prevenibles-section .box-orange__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: 16px;
	z-index: 0;
	pointer-events: none;
	/* La PNG trae márgenes transparentes — ampliar para cubrir toda la card */
	transform: scale(1.22);
	transform-origin: center center;
}

.enfermedades-prevenibles-section .box-orange__title {
	position: relative;
	z-index: 1;
	align-self: stretch;
	font-family: 'Inter', sans-serif;
	font-size: 24px;
	font-weight: 700;
	font-style: normal;
	line-height: 1.2;
	color: #fffcfa;
	text-align: left;
	letter-spacing: 0;
	word-break: break-word;
	width: 100%;
	margin: 0;
	background: transparent;
}

.enfermedades-prevenibles-section .box-orange .box-orange__btn,
.enfermedades-prevenibles-section .box-orange .btn-custom-outline.box-orange__btn {
	position: relative;
	z-index: 1;
	width: 100% !important;
	height: 50px !important;
	padding: 16px 32px !important;
	margin-top: 0 !important;
	border-radius: 100px !important;
	border: 1px solid #c6c5c5 !important;
	background: #ffffff !important;
	background-color: #ffffff !important;
	color: #4b4b4b !important;
	font-family: 'Inter', sans-serif !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	font-style: normal;
	line-height: 1.2 !important;
	letter-spacing: 0;
	white-space: nowrap;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	box-shadow: none !important;
}

.enfermedades-prevenibles-section .box-orange .box-orange__btn:hover,
.enfermedades-prevenibles-section .box-orange .box-orange__btn:focus {
	background: #ffffff !important;
	background-color: #ffffff !important;
	color: #4b4b4b !important;
	border-color: #ff4e00 !important;
	box-shadow: none !important;
}

.enfermedades-prevenibles-section .box-orange .box-orange__btn:active {
	background: rgba(255, 78, 0, 0.10) !important;
	background-color: rgba(255, 78, 0, 0.10) !important;
	color: #4b4b4b !important;
	border-color: #ff4e00 !important;
	box-shadow: none !important;
}

.enfermedades-prevenibles-section .box-orange .box-orange__btn img {
	width: 18px;
	height: 18px;
	margin: 0;
	filter: none;
}

/* Cards de contenido — Figma Card-feature 6/7/8 (11119:24642) */
.enfermedades-prevenibles-section .home-feature-card {
	width: 265px;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	background: transparent;
}

.enfermedades-prevenibles-section .home-feature-card__image {
	position: relative;
	width: 100%;
	height: 128px;
	border-radius: 16px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	padding: 0 16px 8px;
	overflow: hidden;
	flex-shrink: 0;
}

.enfermedades-prevenibles-section .home-feature-card__label {
	background-color: #ff4e00;
	color: #ffffff;
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 400;
	font-style: normal;
	line-height: 1.5;
	letter-spacing: 0;
	padding: 4px 8px;
	border-radius: 0 0 4px 4px;
	white-space: nowrap;
}

.enfermedades-prevenibles-section .home-feature-card__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding-top: 16px;
	width: 100%;
	background: transparent;
	box-shadow: none;
}

.enfermedades-prevenibles-section .home-feature-card__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	width: 100%;
	background: transparent;
}

.enfermedades-prevenibles-section .home-feature-card__title {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 700;
	font-style: normal;
	line-height: 1.4;
	color: #151515;
	letter-spacing: 0;
	word-break: break-word;
	margin: 0;
}

.enfermedades-prevenibles-section .home-feature-card__description {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	font-style: normal;
	line-height: 1.4;
	color: #4b4b4b;
	letter-spacing: 0;
	word-break: break-word;
	margin: 0;
}

.enfermedades-prevenibles-section .home-feature-card__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 4px;
	text-decoration: none;
	position: relative;
}

.enfermedades-prevenibles-section .home-feature-card__link::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: #FF4E00;
	transform: translateX(-50%) scaleX(0);
	transition: transform 0.3s ease;
}

.enfermedades-prevenibles-section .home-feature-card__link:hover::after {
	transform: translateX(-50%) scaleX(1);
}

.enfermedades-prevenibles-section .home-feature-card__link img {
	width: 16px;
	height: 16px;
	display: block;
}

.enfermedades-prevenibles-section .swiper-enfermedades-mobile .swiper-slide {
	width: 265px;
	background: transparent;
}

/* Selectores (pager) — Figma pager-selector 37.648x6, gap 4px (I11129:61171;11129:61157) */
.enfermedades-prevenibles-section .swiper-enfermedades-mobile .swiper-pagination {
	margin-top: 32px;
	gap: 4px;
}

.enfermedades-prevenibles-section .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 37.648px;
	height: 6px;
	margin: 0;
	background-color: rgba(255, 78, 0, 0.3);
	border-radius: 100px;
}

.enfermedades-prevenibles-section .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active {
	background-color: #ff4e00;
}

.enfermedades-prevenibles-section__disclaimer {
	padding-top: 16px;
	padding-bottom: 4px;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
}

.enfermedades-prevenibles-section .referencias-titulo-texto {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: #151515;
	text-align: center;
	margin: 0;
	white-space: nowrap;
}

@media (max-width: 991.98px) {
	section.container.enfermedades-prevenibles-section,
	.enfermedades-prevenibles-section.container {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		padding-top: 32px !important;
		padding-bottom: 32px !important;
	}

	.enfermedades-prevenibles-section__header {
		margin-bottom: 32px !important;
		padding-left: 20px;
		padding-right: 20px;
	}

	.enfermedades-prevenibles-section__swiper {
		padding-left: 20px;
		padding-right: 20px;
	}

	/* Título — Figma Head-Modulos 01 / H3 Bold 24 (11129:61010) */
	.enfermedades-prevenibles-section__title {
		font-family: 'Inter', sans-serif !important;
		font-size: 24px !important;
		font-weight: 700 !important;
		font-style: normal !important;
		line-height: 1.2 !important;
		color: #151515 !important;
		text-align: left !important;
		letter-spacing: 0;
		word-break: break-word;
		margin: 0 !important;
		padding: 0 !important;
		width: 100%;
	}

	.enfermedades-prevenibles-section__title-line {
		display: inline !important;
	}

	/* Ancho fijo de Figma (265px) como tope, no como valor rígido — el slide del
	   swiper mobile lo calcula Swiper según slidesPerView:1.2 y varía por viewport
	   (250.8px a 360px, 275.8px a 390px), así que la card debe poder achicarse. */
	.enfermedades-prevenibles-section .swiper-enfermedades-mobile .box-orange,
	.enfermedades-prevenibles-section .swiper-enfermedades-mobile .home-feature-card {
		width: 100%;
		max-width: 265px;
	}

	/* Card naranja — H3 Bold 24 #fffcfa (11119:22942) */
	.enfermedades-prevenibles-section .box-orange .box-orange__title {
		font-family: 'Inter', sans-serif !important;
		font-size: 24px !important;
		font-weight: 700 !important;
		font-style: normal !important;
		line-height: 1.2 !important;
		color: #fffcfa !important;
		text-align: left !important;
		letter-spacing: 0;
		word-break: break-word;
		margin: 0;
	}

	/* Botón card naranja — P3 Bold 14 (11119:22943) */
	.enfermedades-prevenibles-section .box-orange .box-orange__btn,
	.enfermedades-prevenibles-section .box-orange .btn-custom-outline.box-orange__btn {
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		font-style: normal !important;
		line-height: 1.2 !important;
		color: #4b4b4b !important;
		letter-spacing: 0;
	}

	/* Label card — D Regular 12 (11119:23060) */
	.enfermedades-prevenibles-section .home-feature-card__label {
		font-family: 'Inter', sans-serif !important;
		font-size: 12px !important;
		font-weight: 400 !important;
		font-style: normal !important;
		line-height: 1.5 !important;
		color: #ffffff !important;
		letter-spacing: 0;
	}

	/* Título card — P1 Bold 18 (11119:23029) */
	.enfermedades-prevenibles-section .home-feature-card__title {
		font-family: 'Inter', sans-serif !important;
		font-size: 18px !important;
		font-weight: 700 !important;
		font-style: normal !important;
		line-height: 1.4 !important;
		color: #151515 !important;
		letter-spacing: 0;
		word-break: break-word;
		margin: 0;
	}

	/* Descripción card — P3 Regular 14 (11119:23030) */
	.enfermedades-prevenibles-section .home-feature-card__description {
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		font-style: normal !important;
		line-height: 1.4 !important;
		color: #4b4b4b !important;
		letter-spacing: 0;
		word-break: break-word;
		margin: 0;
	}

	/* Disclaimer — Regular 14 (15663:84099) */
	.enfermedades-prevenibles-section__disclaimer {
		padding: 32px 20px 32px;
		max-width: none;
	}

	.enfermedades-prevenibles-section .referencias-titulo-texto {
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		font-style: normal !important;
		line-height: 1.4 !important;
		color: #151515 !important;
		text-align: center !important;
		white-space: normal !important;
		word-break: break-word;
		margin: 0;
	}
}

@media (max-width: 768px) {
	.enfermedades-prevenibles-section__disclaimer {
		padding: 32px 25px 32px !important;
	}

	section.container.enfermedades-prevenibles-section,
	.enfermedades-prevenibles-section.container {
		padding-bottom: 32px !important;
	}

	.section-descarga-index {
		padding-top: 0 !important;
		padding-bottom: 32px !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
}

.text-white4{
	color: #fff;
}

/* ========================================
   HOME BLOG SECTION — Figma 11129:26364
   ======================================== */

.blog-home-wrapper {
	background-color: #FFEDD3;
	padding-top: 64px;
	padding-bottom: 64px;
}

.blog-home-section__header {
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 16px;
	width: 100%;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 32px;
	text-align: center;
}

.blog-home-section__title,
.blog-home-wrapper .blog-title-home {
	font-family: 'Inter', sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: #151515;
	text-align: center;
	margin: 0;
}

.blog-home-section__title-accent {
	color: #FF4E00;
	font-weight: 700;
}

.blog-home-section__title-line--mobile {
	display: none;
}

@media (min-width: 992px) {
	.blog-home-section__title-line--desktop {
		display: inline;
	}

	.blog-home-section__title-line--mobile {
		display: none;
	}
}

.blog-home-section__subtitle {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	color: #4b4b4b;
	margin: 0;
	text-align: left;
}

.blog-home-section__swiper-wrap {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 34px;
}

.blog-home-section__content {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.blog-home-section__cards {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	width: 100%;
}

.blog-home-section__cards .home-blog-card-col {
	flex: 0 0 auto;
	width: 265px;
}

.blog-home-section__swiper {
	overflow: visible;
	width: 100%;
	padding-left: 16px;
	padding-right: 16px;
}

.blog-home-section__swiper .swiper-slide {
	width: 265px;
	height: auto;
	background: transparent;
}

.blog-home-section__pagination {
	display: flex;
	justify-content: center;
	margin-top: 0;
	width: 100%;
}

.blog-home-section__pagination .swiper-pagination-blog {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	max-width: none;
	margin: 0 auto;
	padding-inline: 21.84%;
	box-sizing: border-box;
}

.blog-home-section__pagination .swiper-pagination-bullet {
	flex: 1 1 0;
	width: auto !important;
	height: 6px !important;
	border-radius: 100px !important;
	background-color: #ff4e00 !important;
	opacity: 0.3 !important;
	margin: 0 !important;
}

.blog-home-section__pagination .swiper-pagination-bullet-active {
	opacity: 1 !important;
}

.blog-home-section__pagination .swiper-pagination {
	position: relative;
}

.blog-home-section__footer {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 34px;
	width: 100%;
}

.blog-home-section__disclaimer,
.blog-home-wrapper .referencias-blog-texto {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: #151515;
	text-align: center;
	margin: 0;
	max-width: 651px;
	white-space: nowrap;
}

.blog-home-section__cta,
.blog-home-wrapper .btn-custom {
	background-color: #FF4E00 !important;
	padding: 16px 32px !important;
	border-radius: 100px !important;
	/* Shadow reducido proporcionalmente (mismo criterio que vacunas-etapa-card y
	   home-blog-card__body): el 1:1 del drop-shadow de Figma es desproporcionado
	   para un botón de 50px de alto */
	box-shadow:
		0 0 0 rgba(0, 0, 0, 0.1),
		0 1px 1px rgba(0, 0, 0, 0.1),
		0 3px 2px rgba(0, 0, 0, 0.09),
		0 6px 2px rgba(0, 0, 0, 0.05),
		0 10px 2px rgba(0, 0, 0, 0.01),
		0 16px 2px rgba(0, 0, 0, 0) !important;
	font-family: 'Inter', sans-serif !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	color: #FFFFFF !important;
	letter-spacing: 0 !important;
	border: none !important;
	text-decoration: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 50px !important;
	height: auto !important;
	transition: background-color 0.3s ease !important;
}

.blog-home-section__cta:hover,
.blog-home-wrapper .btn-custom:hover {
	background-color: var(--light-orange-color) !important;
}

.blog-home-wrapper .home-blog-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 265px;
	color: inherit;
	background: transparent;
}

.blog-home-wrapper .home-blog-card:hover {
	color: inherit;
	text-decoration: none;
}

.blog-home-wrapper .home-blog-card__image {
	position: relative;
	width: 100%;
	height: 142px;
	border-radius: 4px;
	overflow: hidden;
	flex-shrink: 0;
	background: transparent;
}

.blog-home-wrapper .home-blog-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.blog-home-wrapper .home-blog-card__badge {
	position: absolute;
	top: 8px;
	right: 8px;
	background: #ffffff;
	border-radius: 4px;
	padding: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
}

.blog-home-wrapper .home-blog-card__badge img {
	width: 24px;
	height: 24px;
	display: block;
}

.blog-home-wrapper .home-blog-card__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding-top: 16px;
	width: 100%;
	background: transparent;
	box-shadow: none;
}

.blog-home-wrapper .home-blog-card__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
	width: 100%;
}

.blog-home-wrapper .home-blog-card__tag {
	font-family: 'Inter', sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;
	color: #4B4B4B;
	text-transform: uppercase;
	white-space: nowrap;
}

.blog-home-wrapper .home-blog-card__tag-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #4B4B4B;
	flex-shrink: 0;
}

.blog-home-wrapper .home-blog-card__title {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	color: #151515;
	margin: 0;
	width: 100%;
	transition: color 0.3s ease;
}

.blog-home-wrapper .home-blog-card:hover .home-blog-card__title {
	color: var(--orange-color);
}

.blog-home-wrapper .home-blog-card__desc {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.2;
	color: #4B4B4B;
	margin: 0;
	width: 100%;
}

@media (max-width: 991.98px) {
	.blog-home-wrapper {
		padding-top: 32px;
		padding-bottom: 32px;
	}

	.blog-home-wrapper .container {
		max-width: 100%;
		padding-left: 8px;
		padding-right: 8px;
	}

	.blog-home-section__header {
		align-items: flex-start;
		text-align: left;
		margin-bottom: 34px;
		gap: 12px;
		max-width: 100%;
	}

	.blog-home-section__title,
	.blog-home-wrapper .blog-title-home {
		font-size: 24px;
		text-align: left;
		width: 100%;
	}

	.blog-home-section__title-line--desktop {
		display: none;
	}

	.blog-home-section__title-line--mobile {
		display: block;
	}

	.blog-home-section__content {
		gap: 34px;
		align-items: stretch;
		max-width: 100%;
		width: 100%;
	}

	.blog-home-section__swiper-wrap {
		gap: 34px;
	}

	.blog-home-section__swiper {
		overflow: visible;
		width: auto;
		padding-left: 20px;
		padding-right: 20px;
		margin-left: -20px;
		margin-right: -20px;
	}

	.blog-home-section__swiper .swiper-slide,
	.blog-home-wrapper .home-blog-card {
		width: 265px !important;
		max-width: 265px !important;
		flex-shrink: 0;
	}

	.blog-home-wrapper .home-blog-card__image {
		height: 142px !important;
	}

	.blog-home-wrapper .home-blog-card__body {
		gap: 8px;
		padding-top: 16px;
	}

	.blog-home-wrapper .home-blog-card__badge {
		width: 32px;
		height: 32px;
		padding: 4px;
	}

	.blog-home-wrapper .home-blog-card__badge img {
		width: 24px;
		height: 24px;
	}

	.blog-home-section__footer {
		gap: 34px;
	}

	.blog-home-section__disclaimer,
	.blog-home-wrapper .referencias-blog-texto {
		white-space: normal;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
	}
}

/* Home blog — tablet (769px–991px): card más ancho para peek limpio (~52px) */
@media (min-width: 769px) and (max-width: 991.98px) {
	.blog-home-section__swiper .swiper-slide,
	.blog-home-wrapper .home-blog-card {
		width: 330px !important;
		max-width: 330px !important;
	}
}

/* Legacy selectors kept for compatibility */
#home-blog-cards {
	padding-top: 0;
}

/* Texto "Sumérgete" según Figma */
.sumergete-texto {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	color: rgba(25, 24, 37, 0.50);
	letter-spacing: 0;
	text-align: left;
	margin-top: 24px;
}

/* Banner Test Herpes Zóster según Figma */
.banner-test-herpes {
	position: relative;
	width: 100%;
	max-width: 1120px;
	margin: 48px auto 0;
	padding: 48px;
	border-radius: 16px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 37px;
	min-height: 300px;
}

.banner-test-overlay {
	position: absolute;
	inset: 0;
	border-radius: 16px;
	background-image: url('/images/blogcard/fondos/banner-test.png');
	background-size: cover;
	background-position: center;
	z-index: 1;
}

.banner-test-content {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	width: 100%;
}

.banner-test-title {
	font-family: 'Inter', sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: #FFFFFF;
	text-align: center;
	margin: 0;
	letter-spacing: 0;
	max-width: 732px;
}

.btn-banner-test {
	background-color: #FFFFFF;
	border: 1px solid #C6C5C5;
	color: #4B4B4B;
	padding: 16px 32px;
	border-radius: 100px;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 50px;
	text-decoration: none;
	transition: all 0.3s ease;
}

.btn-banner-test:hover {
	background-color: #FFFFFF;
	color: #4B4B4B;
	border-color: #FF4E00;
	text-decoration: none;
}

.btn-banner-test img {
	width: 18px;
	height: 18px;
}

@media (max-width: 991.98px) {
	.home-diseases-section .banner-test-herpes {
		display: none;
	}
}

/* ========================================
   HOME TYPOGRAPHY
   ======================================== */

.titlehome{
	font-size: 24px;
}

.textcardhome{
	font-size: 18px ;
}

/* ========================================
   HOME DOWNLOAD SECTION — Figma 15573:59545
   ======================================== */

.section-descarga-index {
	background-image: url('/images/fondos/Frame 164218.png');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding-top: 48px;
	padding-bottom: 48px;
	margin-top: 0;
	margin-bottom: 0;
}

.section-descarga-index .section-descarga-index__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	margin-bottom: 32px;
}

.section-descarga-index .section-descarga-index__title,
.section-descarga-index .descarga-titulo {
	font-family: 'Inter', sans-serif;
	font-size: 32px !important;
	font-weight: 700;
	line-height: 1.2;
	color: #151515;
	margin: 0 !important;
	text-align: center;
}

.section-descarga-index__title-line,
.section-descarga-index__subtitle-line {
	display: inline;
}

@media (min-width: 992px) {
	.section-descarga-index__title-line,
	.section-descarga-index__subtitle-line {
		display: inline;
	}

	.section-descarga-index__title-line + .section-descarga-index__title-line::before,
	.section-descarga-index__subtitle-line + .section-descarga-index__subtitle-line::before {
		content: ' ';
	}
}

.section-descarga-index .section-descarga-index__subtitle,
.section-descarga-index .textdescarga {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	color: #4B4B4B;
	margin: 0;
	text-align: center;
}

.section-descarga-index .section-descarga-index__cards {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.section-descarga-index .descarga-card-col {
	flex: 0 0 auto;
	width: calc(50% - 10px);
	max-width: 265px;
	padding: 0 !important;
}

.section-descarga-index .descarga-card {
	background: #ffffff;
	border-radius: 16px;
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
	box-shadow: none;
}

.section-descarga-index .descarga-card-img {
	position: relative;
	height: 142px;
	overflow: hidden;
	border-radius: 16px 16px 0 0;
}

.section-descarga-index .calendario-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
	margin-left: 0 !important;
}

.section-descarga-index .descarga-card-img__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(0, 0, 0, 0) 64.845%, rgba(0, 0, 0, 0.5) 100%),
		linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
	pointer-events: none;
	border-radius: 16px 16px 0 0;
}

.section-descarga-index .descarga-icon {
	position: absolute;
	bottom: 8px;
	right: 8px;
	top: auto;
	width: 32px;
	height: 32px;
	background: #FF4E00;
	border-radius: 4px;
	padding: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.section-descarga-index .descarga-icon img {
	width: 24px;
	height: 24px;
	padding-top: 0 !important;
	display: block;
}

.section-descarga-index .descarga-card-body {
	padding: 16px;
	min-height: 162px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	border: 0.86px solid #F0EFED;
	border-top: none;
	border-radius: 0 0 16px 16px;
	background: #ffffff;
	height: auto;
}

.section-descarga-index .descarga-card-title,
.section-descarga-index .titledescarga {
	font-family: 'Inter', sans-serif;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: 1.5;
	color: #151515;
	margin-bottom: 0;
}

.section-descarga-index .descarga-card-title strong {
	font-weight: 700;
}

.section-descarga-index .descarga-card-link,
.section-descarga-index .link-descargar {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	color: #FF4E00;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 0;
	padding: 8px 4px;
	align-self: flex-start;
	position: relative;
}

.section-descarga-index .descarga-card-link::after,
.section-descarga-index .link-descargar::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: #FF4E00;
	transform: translateX(-50%) scaleX(0);
	transition: transform 0.3s ease;
}

.section-descarga-index .descarga-card-link:hover::after,
.section-descarga-index .link-descargar:hover::after {
	transform: translateX(-50%) scaleX(1);
}

.section-descarga-index .descarga-card-link:hover,
.section-descarga-index .link-descargar:hover {
	color: #FF4E00;
	text-decoration: none;
}

.section-descarga-index .descarga-card-link__icon {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

@media (min-width: 1200px) {
	.section-descarga-index .section-descarga-index__cards {
		flex-wrap: nowrap !important;
		gap: 20px;
	}

	.section-descarga-index .descarga-card-col {
		flex: 0 0 calc((100% - 60px) / 4);
		width: calc((100% - 60px) / 4) !important;
		max-width: calc((100% - 60px) / 4) !important;
		min-width: 0;
	}
}

@media (max-width: 991.98px) {
	.section-descarga-index {
		padding-top: 24px !important;
		padding-bottom: 32px !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}

	.section-descarga-index .container {
		padding-left: 0 !important;
		padding-right: 0 !important;
		max-width: 100%;
		width: 100%;
	}

	.section-descarga-index .section-descarga-index__header {
		gap: 16px;
		margin-bottom: 32px !important;
	}

	.section-descarga-index .section-descarga-index__title,
	.section-descarga-index .descarga-titulo,
	.section-descarga-index .text-descarga1 {
		font-family: 'Inter', sans-serif !important;
		font-size: 24px !important;
		font-weight: 700 !important;
		font-style: normal !important;
		line-height: 1.2 !important;
		color: #151515 !important;
		text-align: center !important;
		margin: 0 !important;
	}

	.section-descarga-index__title-line,
	.section-descarga-index__subtitle-line {
		display: block !important;
	}

	.section-descarga-index .section-descarga-index__subtitle,
	.section-descarga-index .textdescarga {
		font-family: 'Inter', sans-serif !important;
		font-size: 16px !important;
		font-weight: 400 !important;
		font-style: normal !important;
		line-height: 1.4 !important;
		color: #4b4b4b !important;
		text-align: center !important;
		margin: 0 !important;
	}

	.section-descarga-index .section-descarga-index__cards {
		display: flex !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		gap: 16px !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	.section-descarga-index .descarga-card-col {
		flex: 1 1 calc(50% - 8px) !important;
		width: calc(50% - 8px) !important;
		max-width: calc(50% - 8px) !important;
		min-width: 0 !important;
		padding: 0 !important;
	}

	.section-descarga-index .descarga-card {
		border-radius: 16px !important;
		height: 100%;
	}

	.section-descarga-index .descarga-card-img {
		height: auto !important;
		aspect-ratio: 265 / 142 !important;
		border-radius: 16px 16px 0 0 !important;
	}

	.section-descarga-index .calendario-img {
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
		object-position: center top !important;
		margin-left: 0 !important;
	}

	.section-descarga-index .descarga-icon {
		position: absolute !important;
		bottom: 8px !important;
		right: 8px !important;
		top: auto !important;
		width: 32px !important;
		height: 32px !important;
		padding: 4px !important;
		background: #ff4e00 !important;
		border-radius: 4px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	.section-descarga-index .descarga-icon img {
		width: 24px !important;
		height: 24px !important;
		padding-top: 0 !important;
		display: block !important;
	}

	.section-descarga-index .descarga-card-body {
		min-height: 0 !important;
		height: auto !important;
		padding: 8px !important;
		gap: 8px !important;
		border: 0.86px solid #f0efed !important;
		border-top: none !important;
		border-radius: 0 0 16px 16px !important;
		justify-content: flex-start !important;
	}

	.section-descarga-index .descarga-card-title,
	.section-descarga-index .titledescarga {
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		font-style: normal !important;
		line-height: 1.4 !important;
		color: #151515 !important;
		margin: 0 !important;
	}

	.section-descarga-index .descarga-card-title strong {
		font-weight: 700 !important;
	}

	.section-descarga-index .descarga-card-link,
	.section-descarga-index .link-descargar {
		font-family: 'Inter', sans-serif !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		font-style: normal !important;
		line-height: 1.2 !important;
		color: #ff4e00 !important;
		gap: 10px !important;
		padding: 8px 4px !important;
		margin-top: 0 !important;
		text-decoration: none !important;
	}

	.section-descarga-index .descarga-card-link__icon {
		width: 16px !important;
		height: 16px !important;
	}
}

/* 1024px — filas de cards descarga y blog (después de estilos base) */
@media screen and (min-width: 992px) and (max-width: 1199.98px) {
	.section-descarga-index .section-descarga-index__cards {
		display: flex;
		flex-wrap: nowrap !important;
		justify-content: center;
		gap: 20px;
		max-width: 1120px;
		margin-left: auto;
		margin-right: auto;
	}

	.section-descarga-index .descarga-card-col {
		flex: 0 0 calc((100% - 60px) / 4) !important;
		width: calc((100% - 60px) / 4) !important;
		max-width: calc((100% - 60px) / 4) !important;
		min-width: 0 !important;
	}

	.blog-home-section__cards {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 15px;
		width: 100%;
	}
}

/* ========================================
   HOME VACUNAS ETAPAS — Figma 11126:25473 (MODULO 3)
   ======================================== */

.vacunas-etapas-section {
	padding-top: 48px;
	padding-bottom: 64px;
}

.vacunas-etapas-section__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	margin-bottom: 32px;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.vacunas-etapas-section__title {
	font-family: 'Inter', sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: #151515;
	margin: 0;
}

.vacunas-etapas-section__subtitle {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	color: #4B4B4B;
	margin: 0;
	max-width: 720px;
}

.vacunas-etapas-section__cards {
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

.vacunas-etapas-section__swiper {
	overflow: visible;
}

.vacunas-etapas-section .swiper-slide {
	width: 180px;
	height: auto;
}

.vacunas-etapas-section .vacunas-etapa-card {
	position: relative;
	width: 180px;
	height: 225px;
	border-radius: 24px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	text-decoration: none;
	overflow: hidden;
	/* Shadow reducido proporcionalmente: el valor 1:1 del drop-shadow de Figma
	   (offsets de hasta 247px) se funde entre cards y se corta contra el
	   overflow:hidden del swiper — ver HOME-MOBILE-CHECKLIST.md */
	box-shadow:
		0 0 0 rgba(0, 0, 0, 0.05),
		0 3px 4px rgba(0, 0, 0, 0.06),
		0 8px 8px rgba(0, 0, 0, 0.05),
		0 12px 8px rgba(0, 0, 0, 0.04);
}

.vacunas-etapas-section .vacunas-etapa-card__label {
	position: relative;
	z-index: 2;
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: #FFFCFA;
	text-align: center;
}

.vacunas-etapas-section .vacunas-etapa-card__cta {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 22px;
	flex-shrink: 0;
}

.vacunas-etapas-section .vacunas-etapa-card__cta img {
	display: block;
	width: 16px;
	height: 22px;
}

.vacunas-etapas-section .vacunas-etapa-card[data-category="bebes"] {
	background:
		linear-gradient(180deg, rgba(0, 200, 76, 0) 37.33%, rgba(0, 200, 76, 0.46) 58.95%, #00c84c 100%),
		url("/images/Frame_164001.png") center / cover no-repeat;
}

.vacunas-etapas-section .vacunas-etapa-card[data-category="Ninos"] {
	background:
		linear-gradient(180deg, rgba(73, 59, 221, 0) 37.33%, rgba(73, 59, 221, 0.46) 58.95%, #493bdd 100%),
		url("/images/Frame_164002.png") center / cover no-repeat;
}

.vacunas-etapas-section .vacunas-etapa-card[data-category="Adolescentes"] {
	background:
		linear-gradient(180deg, rgba(89, 1, 142, 0) 37.33%, rgba(89, 1, 142, 0.46) 58.95%, #59018e 100%),
		url("/images/Frame_164003.png") center / cover no-repeat;
}

.vacunas-etapas-section .vacunas-etapa-card[data-category="Adultos"] {
	background:
		linear-gradient(180deg, rgba(137, 64, 47, 0) 37.33%, rgba(137, 64, 47, 0.46) 58.95%, #89402f 100%),
		url("/images/Frame_164004.jpg") center / cover no-repeat;
}

.vacunas-etapas-section .vacunas-etapa-card[data-category="Gestantes"] {
	background:
		linear-gradient(180deg, rgba(250, 181, 3, 0) 37.33%, rgba(250, 181, 3, 0.51) 66.16%, #fab503 100%),
		url("/images/Frame_164005.png") center / cover no-repeat;
}

.vacunas-etapas-section .vacunas-etapa-card[data-category="Adultos-mayores"] {
	background:
		linear-gradient(180deg, rgba(255, 85, 0, 0) 15.11%, rgba(255, 85, 0, 0.46) 43.97%, #ff5500 100%),
		url("/images/Frame_164006v2.jpg") center / cover no-repeat;
}

.vacunas-etapas-section .vacunas-etapa-card:hover,
.vacunas-etapas-section .vacunas-etapa-card:focus,
.vacunas-etapas-section .vacunas-etapa-card:visited {
	color: #FFFCFA;
	text-decoration: none;
}

.vacunas-etapas-section .vacunas-etapa-card:hover {
	transform: scale(1.02);
	transition: transform 0.15s ease;
}

@media (min-width: 992px) and (max-width: 1199px) {
	/* Armonía 1024px: __header/__cards usan max-width:1120px sin condicionar
	   más arriba en este archivo, no efectivo a este ancho (1120 > viewport).
	   Se lleva a 960px para calzar con el margen real de
	   enfermedades-prevenibles-section/home-diseases-section/redes-section/
	   referencias-section en este mismo rango. El .container de Bootstrap que
	   envuelve a __header/__cards también se clampea aparte: sin esto, su
	   gutter propio (12px) queda MÁS angosto que 960 y termina mandando en
	   vez del max-width de __header/__cards (a diferencia de desktop, donde
	   el .container es más ancho que 1120 y por eso no interfiere). */
	.vacunas-etapas-section > .container {
		max-width: 960px;
		padding-left: 0;
		padding-right: 0;
	}

	.vacunas-etapas-section__header,
	.vacunas-etapas-section__cards {
		max-width: 960px;
	}

	.vacunas-etapas-section__swiper {
		overflow: hidden;
	}

	.vacunas-etapas-section .vacunas-etapa-card {
		width: 167px;
	}

	.vacunas-etapas-section .swiper-slide {
		width: 167px;
	}
}

.vacunas-etapas-section__pagination {
	display: flex;
	justify-content: center;
	margin-top: 24px;
}

.vacunas-etapas-section__pagination .swiper-pagination {
	position: relative;
	gap: 4px;
	--swiper-pagination-bullet-horizontal-gap: 0px;
}

@media (max-width: 991px) {
	.vacunas-etapas-section {
		padding-top: 32px;
		padding-bottom: 64px;
		padding-left: 8px;
		padding-right: 8px;
	}

	.vacunas-etapas-section__title {
		font-size: 24px;
		padding-left: 8px;
		padding-right: 8px;
	}

	.vacunas-etapas-section__subtitle {
		font-size: 16px;
		padding-left: 8px;
		padding-right: 8px;
	}

	.vacunas-etapas-section__header {
		margin-bottom: 32px;
	}

	.vacunas-etapas-section__swiper {
		overflow: visible;
		padding-left: 8px;
		padding-right: 8px;
		margin-left: -8px;
		margin-right: -8px;
	}

	.vacunas-etapas-section .vacunas-etapa-card {
		width: 167px;
		height: 225px;
	}

	.vacunas-etapas-section .swiper-slide {
		width: 167px;
	}
}

/* ========================================
   HOME BLOG CARD
   ======================================== */

/*card final home-blog*/
.recomendacion-card {
	border-radius: 20px;
	padding: 2em;
	color: white;
	height: 100%;
}

/* ========================================
   RESPONSIVE DESIGN FOR HOME
   ======================================== */

/* Mobile adjustments for home */
@media (max-width: 768px) {
	/* .swiper-home .swiper-pagination {
		display: none;
	} */
}

/* ========================================
   HOME CUSTOM SWIPER NAVIGATION STYLES
   ======================================== */

/* Botones de navegación personalizados para home */
.home-nav-btn {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: var(--orange-color, #FF4E00);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	border: none;
	outline: none;
}

.home-nav-btn:hover {
	background-color: #e95e1f;
	transform: scale(1.05);
}

.home-nav-btn:active {
	transform: scale(0.95);
}

/* Iconos de flecha dentro de los botones personalizados */
.home-nav-btn img {
	width: 20px;
	height: 20px;
	filter: brightness(0) invert(1); /* Convierte la flecha a blanco */
	transition: transform 0.3s ease;
}

/* Rotar la flecha del botón prev */
.home-nav-btn.prev img {
	transform: rotate(180deg);
}

/* Paginación personalizada para home */
.home-pagination {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
	position: relative;
}

.home-pagination .pagination-bullet {
	width: 20px;
	height: 4px;
	border-radius: 2px;
	background-color: #d3d3d3; /* Gris claro para inactivos */
	opacity: 1;
	transition: background-color 0.3s ease;
	cursor: pointer;
}

.home-pagination .pagination-bullet.active {
	background-color: var(--orange-color, #FF4E00); /* Naranja para activo */
}

/* Contenedor de navegación personalizado */
.home-navigation-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 20px;
	position: relative;
	padding: 0 20px;
}

/* Posicionamiento de botones personalizados */
.home-nav-btn.prev {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
}

.home-nav-btn.next {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
}

/* Ajustar la paginación para que no se superponga con los botones */
.home-pagination {
	margin-left: 60px;
	margin-right: 60px;
}

/* ========================================
   ADDITIONAL HOME UTILITIES
   ======================================== */

/* Align left utility */
.align-left {
	display: flex;
	justify-content: flex-start;
	/* Aligns items to the left */
}
/* Variables CSS */
:root {
	--swiper-theme-color: #ff4e00;
	--swiper-pagination-bullet-inactive-color: #ff4e00d6;
}

/* Swiper pagination general */
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 35px;
	border-radius: 3px;
}

.swiper-button-next:after,
.swiper-button-prev:after {
	content: none;
}

/* Botones del swiper home */
.swiper-home .swiper-button-prev {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: var(--border-radius);
	top: -160px;
	left: 160px;
	background-color: var(--orange-color);
}

.swiper-home .swiper-button-prev img {
	rotate: 180deg;
}

.swiper-home .swiper-button-next {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: var(--border-radius);
	top: -186px;
	left: 263px;
	background-color: var(--orange-color);
}

/* Botones específicos del banner */
.buttonprevebanner1.swiper-button-prev {
	width: 34px;
	height: 34px;
	line-height: 34px;
	text-align: center;
	border-radius: 100px;
	mix-blend-mode: multiply;
	background-color: var(--orange-color);
	top: -187px;
	left: 214px;
}

.buttonprevebanner2.swiper-button-next {
	width: 34px;
	height: 34px;
	line-height: 34px;
	text-align: center;
	border-radius: 100px;
	mix-blend-mode: multiply;
	background-color: var(--orange-color);
}

.buttonprevebanner1.swiper-button-prev img {
	transform: rotate(180deg);
}

.buttonprevebanner1.swiper-button-next {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: var(--border-radius);
	background-color: var(--orange-color);
	position: static;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Paginación del swiper home */
.swiper-home .swiper-pagination {
	left: 10px;
	top: -378px;
	position: absolute;
	width: fit-content;
	gap: 4px;
}

.swiper-home .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 37.648px;
	height: 6px;
	margin: 0;
	background-color: rgba(255, 78, 0, 0.3);
	border-radius: 100px;
}

.swiper-home .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active {
	background-color: #ff4e00;
}

/* Estilos para la paginación (bullets) */
.swiper-pagination {
	position: static;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 10px;
	gap: 8px;
}

.swiper-pagination-bullet {
	width: 35px;
	height: 5px;
	background-color: #e6cfc4;
	border-radius: 3px;
	opacity: 1;
}

.swiper-pagination-bullet-active {
	background-color: #f2572d;
}

/* Paginación enfermedades home — Figma Pager-Big (11127:24259) */
.home-diseases-section__pager-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: 100%;
	max-width: 246px;
	margin-left: auto;
	margin-right: 0;
}

.home-diseases-section__nav {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 16px;
}

.home-diseases-section__pager .home-diseases-pagination {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	align-items: center;
	gap: 4px;
	/* max-width: 126px; */
	width: 100%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.home-diseases-pagination__bullet {
	width: 37.65px;
	height: 6px;
	padding: 0;
	border: 0;
	border-radius: 100px;
	background-color: rgba(255, 78, 0, 0.3);
	flex-shrink: 0;
	cursor: pointer;
}

.home-diseases-pagination__bullet.is-active {
	background-color: #ff4e00;
}

@media (max-width: 991.98px) {
	.home-diseases-section {
		display: flex;
		flex-direction: column;
		padding-top: 48px;
		padding-bottom: 48px;
	}

	.home-diseases-section__head.row {
		display: contents;
	}

	.home-diseases-section__copy {
		order: 1;
		width: 100%;
		max-width: 100%;
		margin-bottom: 26px;
		gap: 16px !important;
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	#home-diseases-swiper {
		order: 2;
		padding-bottom: 0;
	}

	.home-diseases-section__pager {
		order: 3;
		width: 100%;
		max-width: 100%;
		justify-content: center;
		margin: 26px 0 0;
		padding: 0 !important;
		box-sizing: border-box;
	}

	.home-diseases-section__pager-inner {
		max-width: 100%;
		width: 100%;
		margin: 0;
	}

	.home-diseases-section__pager .home-diseases-pagination {
		flex-wrap: nowrap;
		justify-content: center;
		align-items: center;
		max-width: 100%;
		width: 100%;
		gap: 8px;
	}

	.home-diseases-pagination__bullet {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
		max-width: none;
		height: 6px;
	}

	.home-diseases-section__ctas {
		order: 4;
	}

	.home-diseases-section .banner-test-herpes {
		order: 5;
	}

	.home-diseases-section__head {
		margin-bottom: 0;
	}

	.home-diseases-section__title {
		font-size: 24px !important;
	}

	.home-diseases-section__subtitle {
		font-size: 16px !important;
	}

	.home-diseases-section__ctas .btn-custom,
	.home-diseases-section__ctas .btn-custom-outline {
		min-width: 0;
		width: 100%;
	}

	.home-diseases-section__ctas .btn-custom-outline {
		margin-top: 0 !important;
	}
}

/* Asegurar que las cards se vean completas en la parte inferior */
#home-diseases-swiper {
	padding: 0 20px 20px;
	margin: 0 -32px;
	overflow: visible;
	box-sizing: border-box;
}

/* MODULO-5 — Enfermedades prevenibles swiper (Figma 11127:23172) */
.home-diseases-section {
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 64px;
	/* padding-bottom: 64px; */
}

.home-diseases-section__head {
	align-items: flex-start;
	margin-bottom: 64px;
	justify-content: space-between;
}

.home-diseases-section__copy {
	display: flex;
	flex-direction: column;
	max-width: 780px;
	width: 100%;
	gap: 24px;
}

.home-diseases-section__title {
	font-family: 'Inter', sans-serif;
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	color: #151515;
	margin: 0;
}

.home-diseases-section__subtitle {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
	color: rgba(25, 24, 37, 0.5);
	margin: 0;
}

/* Sub-992px (todo mobile + tablet): el .container de Bootstrap tiene sus
   propios max-width nativos en breakpoints sm (576px→540) y md (768px→720)
   que nadie neutralizaba para estas 2 secciones — quedaban centradas en una
   caja angosta con un offset extra en vez de ir a ancho completo como el
   resto de la home en mobile. Sin min-width para cubrir también el tramo
   576-767px (tier "sm" de Bootstrap), no solo el tablet 768-991.98. */
@media screen and (max-width: 991.98px) {
	.vacunas-etapas-section > .container {
		max-width: 100%;
	}

	.enfermedades-prevenibles-section.container {
		max-width: 100%;
	}
}

/* Tablet (768-991.98px): réplica de la disposición exacta de mobile (ancho
   completo + padding lateral plano de 20px — mismo valor que ya usan mobile,
   el Hero y el blog en este mismo rango), en vez del max-width:1120px sin
   condicionar (regla base) que a este ancho no hacía nada y dejaba solo los
   12px del gutter nativo de Bootstrap como margen real. */
@media screen and (min-width: 768px) and (max-width: 991.98px) {
	.home-diseases-section,
	.redes-section,
	.referencias-section {
		padding-left: 20px;
		padding-right: 20px;
	}

	.vacunas-etapas-section {
		padding-left: 0;
		padding-right: 0;
	}

	.vacunas-etapas-section > .container {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media screen and (min-width: 992px) and (max-width: 1199.98px) {
	.home-diseases-section {
		padding-top: 48px;
		padding-bottom: 48px;
	}

	/* Cabecera en una sola fila (como desktop): a este ancho el contenedor
	   ya baja a 960px (ver bloque 992-1199.98 más arriba), y __copy seguía
	   con el max-width:780px de desktop — sumado al pager (270px con
	   padding) no entraba en los 960px disponibles y el pager caía a una
	   segunda línea. Se achica __copy y el pager (bullets a 4 por fila en
	   vez de 6) para que ambos convivan en una sola row. */
	.home-diseases-section__head {
		margin-bottom: 32px;
		flex-wrap: nowrap;
	}

	.home-diseases-section__copy {
		gap: 12px;
		max-width: 660px;
	}

	.home-diseases-section__title {
		font-size: 24px;
		line-height: 1.25;
	}

	.home-diseases-section__title br {
		display: none;
	}

	.home-diseases-section__subtitle {
		font-size: 14px;
		line-height: 1.45;
	}

	/* Bullets en 2 filas de 4 (en vez de 6+2) */
	.home-diseases-section__pager-inner {
		max-width: 170px;
	}
}

.home-diseases-section__pager {
	display: flex;
	justify-content: flex-end;
	align-items: flex-start;
	width: auto;
	max-width: none;
}

.home-diseases-section__ctas {
	gap: 16px !important;
	margin-top: 32px;
}

.home-diseases-section__ctas .btn-custom {
	min-width: 340px;
	min-height: 50px;
	padding: 16px 32px !important;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	border-radius: 100px;
	transition: background-color 0.3s ease, border-color 0.3s ease;
}

.home-diseases-section__ctas .btn-custom-outline {
	min-width: 333px;
	min-height: 50px;
	padding: 16px 32px !important;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	border-radius: 100px;
	transition: background-color 0.3s ease, border-color 0.3s ease;
	box-shadow: none;
	background-color: white;
}

.home-diseases-section__ctas .btn-custom-outline:hover {
	border-color: #FF4E00;
}

#home-diseases-swiper .swiper-slide {
	width: 265px;
	height: auto;
	flex-shrink: 0;
}

#home-diseases-swiper .home-disease-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	
	min-height: 274px;
	padding: 0 16px 16px 16px;
	margin: 0;
	gap: 16px;
	border-radius: 24px;
	background-color: #fff;
	box-shadow: 0 688.946px 192.664px 0 rgba(0, 0, 0, 0.00), 0 441.235px 176.322px 0 rgba(0, 0, 0, 0.01), 0 247.711px 148.799px 0 rgba(0, 0, 0, 0.03), 0 110.094px 110.094px 0 rgba(0, 0, 0, 0.04), 0 27.523px 61.068px 0 rgba(0, 0, 0, 0.05), 0 0 0 0 rgba(0, 0, 0, 0.05);
	position: relative;
	box-sizing: border-box;
	overflow: visible;
}

#home-diseases-swiper .home-disease-card__top {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	width: 100%;
	padding-top: 15px;
}

#home-diseases-swiper .home-disease-card__labels {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 4px;
	width: auto;
	padding: 0;
	margin: 0;
	list-style: none;
}

#home-diseases-swiper .home-disease-card__labels li {
	width: 30px;
	height: 8px;
	border-radius: 0 0 4px 4px;
	display: inline-block;
	flex-shrink: 0;
}

#home-diseases-swiper .home-disease-card__labels li[data-color="green"] {
	background-color: #00c84c;
}

#home-diseases-swiper .home-disease-card__labels li[data-color="blue"] {
	background-color: #493bdd;
}

#home-diseases-swiper .home-disease-card__labels li[data-color="violet"] {
	background-color: #59018e;
}

#home-diseases-swiper .home-disease-card__labels li[data-color="yellow"] {
	background-color: #fcb602;
}

#home-diseases-swiper .home-disease-card__labels li[data-color="red"] {
	background-color: #89402f;
}

#home-diseases-swiper .home-disease-card__labels li[data-color="orange"] {
	background-color: #ff5500;
}

#home-diseases-swiper .home-disease-card__labels li.hidden {
	display: none;
}

#home-diseases-swiper .home-disease-card__image-link {
	display: block;
	width: 100%;
	text-decoration: none;
}

#home-diseases-swiper .home-disease-card__img {
	width: 100% !important;
	height: 112px !important;
	object-fit: cover;
	border-radius: 18px;
	display: block;
}

#home-diseases-swiper .home-disease-card__body {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	width: 100%;
	flex: 1;
	min-height: 0;
}

#home-diseases-swiper .home-disease-card__title {
	font-family: 'Inter', sans-serif;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
	color: #4b4b4b;
	text-align: center;
	margin: 0;
	padding: 0;
	min-height: 66px;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: visible;
	white-space: normal;
	word-wrap: break-word;
}

#home-diseases-swiper .home-disease-card__subtitle {
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	color: #4b4b4b;
	text-align: center;
	margin: -8px 0 0;
	padding: 0;
	white-space: nowrap;
}

#home-diseases-swiper .home-disease-card__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	color: #ff4e00 !important;
	text-decoration: none;
	margin-top: auto;
	padding-bottom: 0;
}

#home-diseases-swiper .home-disease-card__cta img {
	width: 7px;
	height: auto;
	display: block;
}

/* Home — MODULO Explora enfermedades mobile (Figma 11129:62005) */
@media (max-width: 767.98px) {
	.home-diseases-section {
		padding-top: 32px !important;
		padding-bottom: 32px !important;
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	.home-diseases-section__subtitle {
		color: #4b4b4b !important;
		line-height: 1.4 !important;
	}

	#home-diseases-swiper {
		padding-left: 20px !important;
		padding-right: 20px !important;
		margin: 0 -20px !important;
		overflow: visible;
		width: auto;
		box-sizing: border-box;
	}

	#home-diseases-swiper .swiper-slide {
		width: calc(50% - 10px) !important;
		max-width: 167px;
		flex-shrink: 0;
		height: auto;
	}

	#home-diseases-swiper .home-disease-card {
		width: 100% !important;
		max-width: 167px !important;
		height: 229px !important;
		min-height: 229px !important;
		margin: 0 !important;
		padding: 16px !important;
		gap: 16px !important;
		aspect-ratio: auto !important;
		border-radius: 24px;
		/* Shadow reducido proporcionalmente (mismo criterio que vacunas-etapa-card y
		   home-blog-card__body): el 1:1 del drop-shadow de Figma se corta contra el
		   overflow:hidden del swiper mobile */
		box-shadow:
			0 0 0 rgba(0, 0, 0, 0.05),
			0 3px 4px rgba(0, 0, 0, 0.06),
			0 7px 6px rgba(0, 0, 0, 0.05),
			0 11px 6px rgba(0, 0, 0, 0.04);
	}

	#home-diseases-swiper .home-disease-card__top {
		padding-top: 0;
		gap: 0;
		width: 100%;
	}

	#home-diseases-swiper .home-disease-card__labels {
		left: 21px;
		right: 21px;
		width: auto;
		transform: none;
		gap: 4px;
	}

	#home-diseases-swiper .home-disease-card__labels li {
		flex: 1 1 0;
		width: auto !important;
		min-width: 0;
		height: 8px !important;
	}

	#home-diseases-swiper .home-disease-card__labels li[data-color="red"] {
		background-color: #e72e49 !important;
	}

	#home-diseases-swiper .home-disease-card__img {
		height: 80px !important;
		border-radius: 18px !important;
		aspect-ratio: auto !important;
	}

	#home-diseases-swiper .home-disease-card__body {
		gap: 8px;
		justify-content: space-between;
	}

	#home-diseases-swiper .home-disease-card__title {
		font-size: 14px !important;
		line-height: 1.2 !important;
		min-height: 51px;
		padding: 0 !important;
	}

	#home-diseases-swiper .home-disease-card__subtitle {
		display: none !important;
	}

	#home-diseases-swiper .home-disease-card__cta {
		font-size: 14px;
		padding: 8px 4px;
		gap: 10px;
	}

	#home-diseases-swiper .home-disease-card__cta img {
		width: 16px;
		height: 16px;
	}

	.home-diseases-section__ctas {
		margin-top: 26px !important;
	}
}

@media screen and (max-width: 1350px) and (min-width: 1200px) {
	#home-diseases-swiper .swiper-slide {
		width: 265px;
	}

	#home-diseases-swiper .home-disease-card {
		width: 100%;
		max-width: 265px;
		height: 274px;
		min-height: 274px;
	}

	#home-diseases-swiper .home-disease-card__img {
		width: 100% !important;
		height: 112px !important;
		border-radius: 18px;
	}

	#home-diseases-swiper .home-disease-card__title {
		font-size: 18px;
	}
}

/* Navegación MODULO-5 — Figma Pager-Big (11127:24259) */
.home-diseases-section .home-diseases-nav-btn {
	width: 44px !important;
	height: 45px !important;
	padding: 0;
	border-radius: 100px;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0;
	cursor: pointer;
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	margin: 0 !important;
	transform: none !important;
	transition: opacity 0.2s ease;
}

.home-diseases-section .home-diseases-nav-btn::after {
	display: none !important;
}

.home-diseases-section .home-diseases-nav-btn--prev {
	background: #fff;
	border: 1px solid #e6e6e6;
}

.home-diseases-section .home-diseases-nav-btn--next {
	background: #ff4e00;
	border: none;
	box-shadow:
		0 7px 8px rgba(0, 0, 0, 0.07),
		0 29px 14.5px rgba(0, 0, 0, 0.06);
}

.home-diseases-section .home-diseases-nav-btn img {
	width: 16px !important;
	height: 16px !important;
	max-width: 16px !important;
	max-height: 16px !important;
	display: block;
	object-fit: contain;
	pointer-events: none;
}

.home-diseases-section .home-diseases-nav-btn.swiper-button-disabled {
	opacity: 0.35;
	cursor: not-allowed;
	pointer-events: none;
}

/* Estilos para los botones de navegación - círculos con flechas */
.swiper-button-prev-home,
.swiper-button-next-home {
	width: 40px !important;
	height: 40px !important;
	
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 5px !important;
	transition: all 0.3s ease !important;
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	transform: none !important;
}

.swiper-button-prev-home img,
.swiper-button-next-home img {
	width: 60px !important;
	height: 60px !important;
	transition: all 0.3s ease !important;
}




/* ========================================
   HOME DISEASE CARDS STYLES
   ======================================== */
  
/* Main disease cards container */
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) {
	display: flex;
	flex-direction: column;
	width: 91%;
	max-width: 235px;
	align-items: center;
	justify-content: flex-start;
	padding: 0px 22px 38px;
	height: 280px; /* Altura fija para que todas las cards sean iguales */
	margin: 0px auto;
	position: relative;
}

/* Disease card titles - Desktop only */
@media (min-width: 769px) {
	body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) h2 {
		font-size: 17px;
		text-align: center;
		padding: 15px 0;
		color: #4b4b4b;
		line-height: 1.2;
		height: auto;
		min-height: 40px;
		display: block;
		overflow: visible !important;
		white-space: normal !important;
		word-wrap: break-word !important;
		overflow-wrap: break-word !important;
	}
}

/* CSS específico para forzar el salto de línea en desktop */
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) h2 br {
	display: block !important;
	content: "" !important;
	margin-top: 0.5em !important;
}

/* Disease card icons */
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) i {
	font-size: 16px;
}

/* Disease card images - general */
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) > img {
	object-fit: cover;
	width: 270px;
	height: 125px;
	border-radius: 24px;
}

/* Disease card images - specific diseases */
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) img[alt="Herpes zóster"],
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) img[alt="Enfermedad por Hib (Haemophilus influenzae tipo b)"] {
	object-fit: cover;
	width: 270px;
	height: 125px;
	border-radius: 24px;
}
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) img[alt] {
	object-fit: cover;
	width: 270px;
	height: 125px;
	border-radius: 24px;
}

body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) img[alt="Fiebre amarilla"],
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) img[alt="Enfermedad por Hib (Haemophilus influenzae tipo b)"] {
	object-fit: cover;
	width: 265px;
	height: 84px;
	border-radius: 24px;
}

/* Disease card "Conoce más" link */
body.enfermedades-prevenibles .thumb-disease:not(.ep-disease-card) .ver-en-maps {
	position: absolute;
	bottom: 9px;
	padding-bottom: 28px;
	font-size: 14px;
	font-weight: bold;
	color: #e95e1f;
	display: flex;
	align-items: center;
	gap: 6px;
}

/* General thumb-disease class */
.thumb-disease {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 247px;
	align-items: center;
	justify-content: flex-start;
	padding: 16px;
	height: 280px; /* Altura fija para que todas las cards sean iguales */
	margin: 0px auto;

	& h2 {
		font-size: 17px;
		text-align: center;
		padding: 15px 0;
		color: #4b4b4b;
		line-height: 1.2;
		height: 76px;
		display: flex;
		align-items: center;
		justify-content: center;
		overflow: hidden;
	}

	& .vsr-subtitle {
		font-family: 'Inter', sans-serif;
		font-size: 16px;
		font-weight: 400;
		line-height: 1.4;
		color: #4b4b4b;
		text-align: center;
		margin: -20px 0 0 0;
		padding: 0;
		white-space: nowrap;
	}

	& i {
		font-size: 16px;
	}

	& > img {
		object-fit: cover;
		width: 270px;
		height: 125px;
		border-radius: 24px;
	}

	& .ver-en-maps {
		position: absolute;
		bottom: -10px !important;
		padding-bottom: 28px !important;
	}

	& a.text-orange {
		margin-top: 20px;
	}
}

/* Swiper specific styles */
.swiper-conoce-mas .thumb-disease {
	margin-right: 30px;
}

/* Responsive adjustments */

/* Media query para móviles */
@media screen and (max-width: 768px) {
	/* Botón "Síguenos aquí" alineado a la izquierda en mobile */
	.redes-section .d-flex {
		gap:8px !important;
		align-items: flex-start !important;
	}
	
	.redes-section .btn-custom {
		align-self: flex-start !important;
		margin-top: 16px !important;
	}
}

/* Media query tablet/desktop intermedio */
@media screen and (max-width: 1350px) and (min-width: 992px) {
	.hero-slide-title {
		font-size: 31px;
	}
}