/* ==========================================================================
   00 · Cabecera / hero (ancla #inicio). Slider del original con UNA diapositiva:
   foto a todo el ancho (alto = proporción de la imagen) y caja blanca
   semitransparente centrada con título, subtítulo y botón.
   Móvil (≤768px, como el original: max-width 768px inclusive): la foto queda
   bajo la cabecera fija y el texto va debajo.
   ========================================================================== */
.vf-s00 {
	--vf-s00-title: #016f9e;                  /* color_titulo (escritorio) */
	--vf-s00-subtitle: #7c5700;               /* color_subtitulo (escritorio) */
	--vf-s00-subtitle-m: #826e4c;             /* color_subtitulo (móvil) */
	--vf-s00-box-bg: rgb(255 255 255 / 0.9);  /* fondo blanco, opacidad_fondo 0.1 */
	--vf-s00-box-bg-m: rgb(255 255 255 / 0.5);
	--vf-s00-radius: 57px;
	--vf-s00-radius-m: 38px;
	background-color: var(--wp--preset--color--base);
	overflow: hidden;
}

/* Foto: llena el ancho y marca el alto de la sección (1741px a 1440) */
.vf-s00 .vf-s00__img {
	margin: 0;
}

.vf-s00 .vf-s00__img img {
	display: block;
	width: 100%;
	height: auto;
}

/* Caja de texto centrada sobre la foto. Original: .slide-content 81% de ancho con
   30px de padding y dentro .slide-content-text con otros 30px (1106.4px a 1440). */
.vf-s00 .vf-s00__box {
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	box-sizing: border-box;
	width: calc(81% - 60px);
	margin: 0;
	padding: 30px;
	background-color: var(--vf-s00-box-bg);
	border-radius: var(--vf-s00-radius);
	text-align: center;
	animation: vf-s00-fade-up 1s ease both; /* AOS fade-up, 1000 ms */
}

.vf-s00 .vf-s00__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--bubbler-one);
	font-size: 55px;
	font-weight: 400;
	line-height: 59px;
	text-align: center;
	color: var(--vf-s00-title);
}

.vf-s00 .vf-s00__subtitle {
	margin: 24px 0 0;
	font-family: var(--wp--preset--font-family--bubbler-one);
	font-size: 24px;
	font-weight: 400;
	line-height: 28px;
	text-align: center;
	color: var(--vf-s00-subtitle);
}

.vf-s00 .vf-s00__btns {
	margin: 45px 0 0;
}

.vf-s00 .vf-s00__btn .wp-block-button__link {
	font-family: var(--wp--preset--font-family--bubbler-one);
	font-size: 14px;
	font-weight: 600;               /* Bubbler One solo tiene 400: negrita sintética, como el original */
	line-height: 26px;
	text-transform: none;           /* el texto ya viene en mayúsculas en el contenido */
	padding: 15px 25px;
	border-radius: 4px;             /* .25rem */
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

@keyframes vf-s00-fade-up {
	from {
		opacity: 0;
		transform: translate3d(0, 100px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.vf-s00 .vf-s00__box { animation: none; }
}

/* Móvil: foto debajo de la cabecera fija (70px) y texto sobre fondo blanco.
   Original: .slide-content con padding 35px y .slide-content-text con 30px (radio 38px). */
@media (max-width: 768px) {
	:root .vf-section.vf-s00.vf-pt-0 {
		padding-top: var(--vf-header-h);
	}

	.vf-s00 .vf-s00__box {
		position: static;
		translate: none;
		width: auto;
		margin: 35px;
		padding: 30px;
		background-color: var(--vf-s00-box-bg-m);
		border-radius: var(--vf-s00-radius-m);
	}

	.vf-s00 .vf-s00__title {
		font-size: 45px;
		line-height: 49px;
		color: var(--wp--preset--color--primary);
	}

	.vf-s00 .vf-s00__subtitle {
		margin-top: 20px;
		font-size: 20px;
		line-height: 24px;
		color: var(--vf-s00-subtitle-m);
	}

	.vf-s00 .vf-s00__btns {
		margin-top: 25px;
	}

	.vf-s00 .vf-s00__btn .wp-block-button__link {
		padding: 8px 12px;
		line-height: 22px;
	}
}
