/*
Theme Name: Cristina Rubio
Theme URI: http://localhost/wptest/
Author: Cristina Rubio
Description: Tema de bloques para la web personal de Cristina Rubio, Online Marketing Manager. Paleta aqua y azul pizarra, tipografías Cal Sans y Montserrat.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cristina-rubio
*/

/* ==========================================================================
   Este archivo solo contiene lo que theme.json no puede expresar:
   pseudo-elementos, estados hover/focus complejos, animaciones,
   el formulario de Contact Form 7 y ajustes responsive concretos.
   Colores, tipografías y espaciados salen siempre de los presets.
   ========================================================================== */

/* Base
   ========================================================================== */
html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--wp--custom--alto-cabecera) + 1rem);
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Cabecera, contenido y pie van pegados; las secciones de la portada también.
   (El blockGap raíz de theme.json añadiría un margen entre ellos.) */
.wp-site-blocks > *,
.wp-block-post-content > .alignfull {
	margin-block: 0;
}

::selection {
	background: var(--wp--preset--color--pizarra);
	color: var(--wp--preset--color--aqua);
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--verde-azulado);
	outline-offset: 3px;
}

/* Titulares: equilibrio de líneas. La palabra destacada va en color, no en cursiva. */
:where(h1, h2, h3) {
	text-wrap: balance;
}

:where(h1, h2, h3, .wp-block-quote) em {
	font-style: normal;
	color: var(--wp--preset--color--verde-azulado);
}

.is-style-seccion-pizarra :where(h1, h2, h3, .wp-block-quote) em {
	color: var(--wp--preset--color--aqua-intenso);
}

/* Transiciones de los botones (theme.json define colores y estados) */
.wp-element-button,
.wp-block-button__link {
	transition:
		background-color 0.35s var(--wp--custom--curva),
		color 0.35s var(--wp--custom--curva),
		border-color 0.35s var(--wp--custom--curva);
}

/* Flecha de los botones principales: se desplaza al pasar el ratón */
.wp-block-button:not(.is-style-outline):not(.is-style-enlace) .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 0.8rem;
}

.wp-block-button:not(.is-style-outline):not(.is-style-enlace) .wp-block-button__link::after {
	content: "→" / "";
	font-size: 1rem;
	letter-spacing: 0;
	transition: transform 0.35s var(--wp--custom--curva);
}

.wp-block-button__link:hover::after {
	transform: translateX(5px);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--pizarra);
	color: var(--wp--preset--color--blanco);
}

/* Variación «Enlace»: texto en mayúsculas con subrayado que se recoge */
.wp-block-button.is-style-enlace .wp-block-button__link {
	position: relative;
	padding: 0 0 0.3rem;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--wp--preset--color--pizarra);
}

.wp-block-button.is-style-enlace .wp-block-button__link::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 1.5px;
	background: currentColor;
	transform-origin: left;
	transition: transform 0.45s var(--wp--custom--curva);
}

.wp-block-button.is-style-enlace .wp-block-button__link:hover::after {
	transform: scaleX(0.35);
}

/* Antetítulo: raya fina delante del texto */
.is-style-antetitulo {
	display: flex;
	align-items: flex-start;
	gap: 0.9rem;
}

.is-style-antetitulo::before {
	content: "";
	flex: none;
	width: 2rem;
	height: 2px;
	margin-top: 0.5rem;
	border-radius: 2px;
	background: currentColor;
}

.is-style-seccion-pizarra .is-style-antetitulo {
	color: var(--wp--preset--color--aqua-intenso);
}

.has-text-align-center.is-style-antetitulo {
	justify-content: center;
}

/* Tarjeta: leve elevación al pasar el ratón */
.wp-block-group.is-style-tarjeta {
	border: 1px solid transparent;
	transition:
		background-color 0.35s var(--wp--custom--curva),
		border-color 0.35s var(--wp--custom--curva),
		transform 0.35s var(--wp--custom--curva);
}

.wp-block-group.is-style-tarjeta:hover {
	background-color: var(--wp--preset--color--aqua);
	border-color: var(--wp--preset--color--aqua-intenso);
	transform: translateY(-2px);
}

.wp-block-group.is-style-tarjeta-blanca.cr-con-sombra {
	box-shadow: var(--wp--preset--shadow--suave);
}

/* Separador: línea fina de 1px */
.wp-block-separator {
	border: 0;
	border-top: 1px solid var(--wp--custom--linea);
	opacity: 1;
}

/* Cabecera
   ========================================================================== */
.cr-cabecera {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--wp--preset--color--blanco);
	border-bottom: 1px solid transparent;
	transition: border-color 0.4s, box-shadow 0.4s;
}

.admin-bar .cr-cabecera {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .cr-cabecera {
		top: 0;
	}
}

.cr-cabecera.is-scrolled {
	border-bottom-color: var(--wp--custom--linea);
	box-shadow: 0 8px 30px rgba(36, 66, 90, 0.06);
}

.cr-cabecera__fila {
	min-height: var(--wp--custom--alto-cabecera);
}

.cr-marca__rol {
	margin: 0;
	color: var(--wp--preset--color--gris);
	font-size: 0.64rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	line-height: 1;
	text-transform: uppercase;
}

/* Menú: subrayado animado y «Contacto» como botón en píldora */
.cr-cabecera .wp-block-navigation-item:not(.cr-nav-cta) > .wp-block-navigation-item__content {
	position: relative;
	padding-block: 0.4rem;
}

.cr-cabecera .wp-block-navigation-item:not(.cr-nav-cta) > .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 2px;
	border-radius: 2px;
	background: var(--wp--preset--color--verde-azulado);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s var(--wp--custom--curva);
}

.cr-cabecera .wp-block-navigation-item:not(.cr-nav-cta) > .wp-block-navigation-item__content:hover::after {
	transform: scaleX(1);
}

.cr-cabecera .cr-nav-cta > .wp-block-navigation-item__content {
	padding: 0.75rem 1.5rem;
	border: 1.5px solid var(--wp--preset--color--pizarra);
	border-radius: 999px;
	color: var(--wp--preset--color--pizarra);
	line-height: 1;
	transition: background-color 0.35s var(--wp--custom--curva), color 0.35s var(--wp--custom--curva);
}

.cr-cabecera .cr-nav-cta > .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--pizarra);
	color: var(--wp--preset--color--blanco);
}

/* El menú se convierte en botón por debajo de 900px (el núcleo lo hace a 600px
   y con cinco enlaces no caben junto a la marca en tablet). */
@media (min-width: 600px) and (max-width: 900px) {
	.cr-cabecera .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.cr-cabecera .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Menú móvil a pantalla completa: enlaces grandes en Cal Sans */
.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1rem clamp(1.25rem, 5vw, 3rem);
}

.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
	height: 100%;
}

.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	flex: 1;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	padding-top: 0;
}

/* Botón de cerrar con zona táctil de 44px */
.cr-cabecera .wp-block-navigation__responsive-container-close {
	top: 0.25rem;
	right: -0.5rem;
	padding: 0.6rem;
}

.cr-cabecera .wp-block-navigation__responsive-container-open {
	margin-right: -0.6rem;
	padding: 0.6rem;
}

.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex: 0 0 auto;
	align-items: center;
	gap: 2rem;
}

.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(.cr-nav-cta) {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.5rem;
	font-weight: 400;
	letter-spacing: 0.04em;
}

.cr-cabecera .wp-block-navigation__responsive-container.is-menu-open .cr-nav-cta > .wp-block-navigation-item__content {
	padding: 1rem 2.25rem;
	font-size: 0.9rem;
}

/* Portada (hero)
   ========================================================================== */
.cr-hero__modos {
	padding-top: 1.75rem;
	border-top: 1px solid var(--wp--custom--linea);
}

.cr-hero__modos p {
	margin: 0;
}

.cr-modo__titulo {
	color: var(--wp--preset--color--pizarra);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.15rem;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: uppercase;
}

.cr-modo__detalle {
	margin-top: 0.35rem !important;
	color: var(--wp--preset--color--gris);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.5;
	text-transform: uppercase;
}

.cr-hero__entradilla {
	max-width: 31rem;
}

/* Foto circular con halo blanco y aro fino */
.cr-foto-circulo {
	position: relative;
	max-width: 26rem;
	margin-inline: auto;
}

.cr-foto-circulo::before,
.cr-foto-circulo::after {
	content: "";
	position: absolute;
	top: 0;
	left: -6%;
	width: 112%;
	aspect-ratio: 1;
	border-radius: 50%;
	pointer-events: none;
	/* -6% del ancho de la foto, expresado sobre el propio halo (112%) */
	transform: translateY(-5.357%);
}

.cr-foto-circulo::before {
	background: var(--wp--preset--color--blanco);
	opacity: 0.6;
}

.cr-foto-circulo::after {
	border: 1.5px solid var(--wp--preset--color--pizarra);
	opacity: 0.25;
}

.cr-foto-circulo img {
	position: relative;
	z-index: 1;
	width: 100%;
	aspect-ratio: 1;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 30%;
	box-shadow: var(--wp--preset--shadow--foto);
}

.cr-foto-circulo figcaption {
	position: relative;
	z-index: 1;
	margin-top: 2.5rem;
	text-align: center;
}

/* Sobre mí y Formación: el titular acompaña al hacer scroll en escritorio
   ========================================================================== */
@media (min-width: 782px) {
	.cr-fijo {
		position: sticky;
		top: calc(var(--wp--custom--alto-cabecera) + 2.5rem);
	}
}

/* Cifras destacadas */
.cr-cifras {
	padding-top: 2.25rem;
	border-top: 1px solid var(--wp--custom--linea);
}

.cr-cifras p {
	margin: 0;
}

.cr-cifra__valor {
	color: var(--wp--preset--color--pizarra);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--cifra);
	line-height: 1;
}

.cr-cifra__texto {
	margin-top: 0.7rem !important;
	color: var(--wp--preset--color--gris);
	font-size: 0.84rem;
	line-height: 1.5;
}

/* Declaración (cita grande sobre pizarra)
   ========================================================================== */
.cr-declaracion {
	text-align: center;
}

.cr-declaracion .wp-block-quote {
	margin: 0;
}

.cr-declaracion .wp-block-quote::before {
	content: "“" / "";
	display: block;
	height: 3rem;
	color: var(--wp--preset--color--aqua-intenso);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 5.5rem;
	line-height: 1;
}

.cr-declaracion .wp-block-quote p {
	font-size: var(--wp--preset--font-size--cita);
	font-weight: 300;
	line-height: 1.5;
	text-wrap: pretty;
}

.cr-declaracion .wp-block-quote em {
	font-weight: 500;
}

.cr-declaracion .wp-block-quote cite {
	display: block;
	margin-top: 2.5rem;
	color: var(--wp--preset--color--aqua-intenso);
	font-size: var(--wp--preset--font-size--etiqueta);
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

/* Servicios: tarjetas numeradas
   ========================================================================== */
.cr-num {
	flex: none;
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	margin: 0;
	border-radius: 50%;
	background: var(--wp--preset--color--blanco);
	color: var(--wp--preset--color--verde-azulado);
	font-family: var(--wp--preset--font-family--display);
	font-size: 0.8rem;
	letter-spacing: 0.02em;
	line-height: 1;
}

.wp-block-group.cr-servicio {
	min-height: 6.25rem;
}

.cr-servicio h3 {
	margin-top: 0.3rem;
}

.cr-servicio p:not(.cr-num) {
	margin-top: 0.3rem;
	color: var(--wp--preset--color--gris);
	font-size: 0.9rem;
	line-height: 1.5;
}

.cr-servicio > .wp-block-group {
	gap: 0;
}

/* Párrafo introductorio junto a un titular */
.cr-intro {
	max-width: 26rem;
}

/* Sectores: fila con línea superior bajo las tarjetas de servicios */
.cr-sectores-fila {
	padding-top: 2.5rem;
	border-top: 1px solid var(--wp--custom--linea);
}

/* Sectores: rejilla de tres columnas con línea fina sobre cada sector */
.cr-sectores {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0 clamp(1.25rem, 3vw, 2rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.cr-sectores li {
	padding-block: 0.85rem;
	border-top: 1px solid var(--wp--custom--linea);
	color: var(--wp--preset--color--pizarra);
	font-family: var(--wp--preset--font-family--display);
	font-size: 0.95rem;
	letter-spacing: 0.03em;
	line-height: 1.3;
	text-transform: uppercase;
}

@media (max-width: 900px) {
	.cr-sectores {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Línea de tiempo (Experiencia y Formación)
   ========================================================================== */
.cr-linea-tiempo > .cr-hito {
	padding-block: 1.75rem;
	border-bottom: 1px solid var(--wp--custom--linea);
}

.cr-linea-tiempo > .cr-hito:last-child {
	border-bottom: 0;
}

.cr-linea-tiempo > .wp-block-group {
	margin-block-start: 0 !important;
}

.cr-hito__etiqueta {
	margin: 0;
	color: var(--wp--preset--color--verde-azulado);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.6;
	text-transform: uppercase;
}

.cr-hito .cr-hito__empresa {
	color: var(--wp--preset--color--verde-azulado) !important;
	font-weight: 600;
}

.cr-hito h3 + p,
.cr-hito h3 + p + p {
	margin-top: 0.4rem;
	color: var(--wp--preset--color--gris);
	font-size: 0.92rem;
	line-height: 1.55;
}

.cr-hito h3:not(:first-child) {
	margin-top: 1.1rem;
}

.cr-hito {
	display: grid !important;
	gap: 0.5rem 1.5rem !important;
	align-items: baseline;
}

.cr-hito > *,
.cr-hito > .wp-block-group > * {
	margin-block: 0;
}

@media (min-width: 641px) {
	.cr-hito {
		grid-template-columns: 8.5rem minmax(0, 1fr);
	}
}

/* Cómo trabajo: pasos numerados
   ========================================================================== */
.cr-paso__num {
	display: grid;
	place-items: center;
	width: 3.75rem;
	height: 3.75rem;
	margin: 0;
	border-radius: 50%;
	background: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--pizarra);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.4rem;
	line-height: 1;
}

.cr-paso__etiqueta {
	margin-top: 1.5rem !important;
	color: var(--wp--preset--color--verde-azulado);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.cr-paso h3 {
	margin-top: 0.4rem !important;
}

.cr-paso h3 + p {
	margin-top: 0.85rem !important;
	color: var(--wp--preset--color--gris);
	font-size: 0.94rem;
	line-height: 1.65;
}

.cr-paso > * {
	margin-block: 0;
}

/* Contacto
   ========================================================================== */
.cr-lista-lineas {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--wp--custom--linea);
	list-style: none;
}

.cr-lista-lineas li {
	padding-block: 1rem;
	border-bottom: 1px solid var(--wp--custom--linea);
	color: var(--wp--preset--color--gris);
}

.cr-lista-lineas strong {
	margin-right: 0.5rem;
	color: var(--wp--preset--color--pizarra);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.05rem;
	font-weight: 400;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.cr-lista-lineas a {
	color: var(--wp--preset--color--gris);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.cr-lista-lineas a:hover {
	color: var(--wp--preset--color--pizarra);
}

/* Formulario (Contact Form 7)
   ========================================================================== */
.wpcf7 *,
.wpcf7 *::before,
.wpcf7 *::after {
	box-sizing: border-box;
}

.wpcf7 fieldset {
	min-width: 0;
	margin: 0 0 1.6rem;
	padding: 0;
	border: 0;
}

.wpcf7 legend {
	padding: 0;
}

.wpcf7 form > p,
.wpcf7 .cr-campo {
	margin: 0 0 1.6rem;
}

.cr-form__fila {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 2rem;
}

.wpcf7 label,
.wpcf7 .cr-leyenda {
	display: block;
	margin-bottom: 0.5rem;
	color: var(--wp--preset--color--pizarra);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.5;
	text-transform: uppercase;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
	display: block;
	width: 100%;
	margin-top: 0.5rem;
	padding: 0.85rem 1.1rem;
	border: 1.5px solid var(--wp--preset--color--aqua-intenso);
	border-radius: var(--wp--custom--radio-campo);
	background: var(--wp--preset--color--aqua-suave);
	color: var(--wp--preset--color--tinta);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.5;
	text-transform: none;
	appearance: none;
	transition: border-color 0.3s, background-color 0.3s, box-shadow 0.3s;
}

.wpcf7 textarea {
	min-height: 7rem;
	resize: vertical;
}

.wpcf7 input:focus,
.wpcf7 textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--verde-azulado);
	background: var(--wp--preset--color--blanco);
	box-shadow: 0 0 0 3px rgba(63, 117, 133, 0.15);
}

/* Opciones en píldora (radio) */
.wpcf7 .wpcf7-radio {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 0.25rem;
}

.wpcf7 .wpcf7-radio .wpcf7-list-item {
	position: relative;
	margin: 0;
}

.wpcf7 .wpcf7-radio label {
	margin: 0;
	cursor: pointer;
}

.wpcf7 .wpcf7-radio input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.wpcf7 .wpcf7-radio .wpcf7-list-item-label {
	display: inline-block;
	padding: 0.7rem 1.6rem;
	border: 1.5px solid var(--wp--preset--color--pizarra);
	border-radius: 999px;
	color: var(--wp--preset--color--pizarra);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	transition: background-color 0.3s var(--wp--custom--curva), color 0.3s var(--wp--custom--curva);
}

.wpcf7 .wpcf7-radio label:hover .wpcf7-list-item-label {
	background: var(--wp--preset--color--aqua);
}

.wpcf7 .wpcf7-radio input:checked + .wpcf7-list-item-label {
	background: var(--wp--preset--color--pizarra);
	color: var(--wp--preset--color--blanco);
}

.wpcf7 .wpcf7-radio input:focus-visible + .wpcf7-list-item-label {
	outline: 2px solid var(--wp--preset--color--verde-azulado);
	outline-offset: 3px;
}

/* Casilla de privacidad */
.wpcf7 .wpcf7-acceptance label {
	display: flex;
	align-items: flex-start;
	gap: 0.8rem;
	color: var(--wp--preset--color--gris);
	font-size: 0.88rem;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.55;
	text-transform: none;
	cursor: pointer;
}

.wpcf7 .wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}

.wpcf7 .wpcf7-acceptance input {
	flex: none;
	width: 1.1rem;
	height: 1.1rem;
	margin: 0.18rem 0 0;
	accent-color: var(--wp--preset--color--pizarra);
}

.cr-form__pie {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem 2rem;
	margin: 0;
}

.cr-form__nota {
	color: var(--wp--preset--color--gris);
	font-size: 0.82rem;
}

.wpcf7 .wpcf7-submit {
	cursor: pointer;
}

.wpcf7 .wpcf7-submit:disabled {
	opacity: 0.6;
	cursor: progress;
}

.wpcf7 .wpcf7-spinner {
	margin: 0 0 0 1rem;
}

.wpcf7 .wpcf7-not-valid-tip {
	margin-top: 0.45rem;
	color: var(--wp--custom--error);
	font-size: 0.84rem;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.4;
	text-transform: none;
}

.wpcf7 .wpcf7-not-valid {
	border-color: var(--wp--custom--error) !important;
}

.wpcf7 form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: 1rem 1.25rem;
	border: 0;
	border-radius: var(--wp--custom--radio-campo);
	background: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--pizarra);
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1.55;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
	background: rgba(180, 71, 58, 0.08);
	color: var(--wp--custom--error);
}

/* Pie
   ========================================================================== */
.cr-pie {
	color: rgba(227, 242, 243, 0.75);
	font-size: 0.85rem;
	line-height: 1.7;
}

.cr-pie p {
	margin: 0;
}

.cr-pie a {
	color: rgba(227, 242, 243, 0.75);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.cr-pie a:hover {
	color: var(--wp--preset--color--blanco);
}

.cr-pie__meta {
	text-align: right;
}

@media (max-width: 640px) {
	.cr-pie__meta {
		text-align: left;
	}
}

.cr-pie__nombre {
	margin-bottom: 0.2rem !important;
	color: var(--wp--preset--color--blanco);
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.4rem;
	letter-spacing: 0.03em;
	line-height: 1.2;
	text-transform: uppercase;
}

/* Páginas de texto (legales)
   ========================================================================== */
.cr-texto h2 {
	margin-top: 3rem;
	font-size: var(--wp--preset--font-size--destacado);
	letter-spacing: 0.03em;
}

.cr-texto p,
.cr-texto li {
	color: var(--wp--preset--color--gris);
}

.cr-aviso-borrador {
	padding: 1rem 1.25rem;
	border-radius: var(--wp--custom--radio-campo);
	background: var(--wp--preset--color--aqua);
	color: var(--wp--preset--color--pizarra) !important;
	font-size: 0.9rem;
}

/* Aparición al hacer scroll (solo con JavaScript activo)
   ========================================================================== */
.js .cr-revelar {
	opacity: 0;
	transform: translateY(1.25rem);
	transition: opacity 0.9s var(--wp--custom--curva), transform 0.9s var(--wp--custom--curva);
}

.js .cr-revelar.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.js .cr-revelar {
		opacity: 1;
		transform: none;
		transition: none;
	}

	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
	}
}

/* Muestras de color (solo en la guía de estilo) */
.cr-muestra {
	aspect-ratio: 3 / 2;
	border: 1px solid var(--wp--custom--linea);
	border-radius: var(--wp--custom--radio-campo);
}

/* Ajustes responsive
   La maquetación en rejilla viene de los bloques Grupo (columnCount);
   aquí solo se reduce el número de columnas en pantallas estrechas.
   ========================================================================== */
@media (max-width: 1080px) {
	.cr-marca__rol {
		display: none;
	}

	.cr-pasos {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		row-gap: 3rem !important;
	}
}

@media (max-width: 781px) {
	.cr-foto-circulo {
		max-width: min(20rem, 78%);
		margin-top: 1.5rem;
	}
}

@media (max-width: 640px) {
	:root {
		--wp--custom--alto-cabecera: 4.25rem;
	}

	.cr-cabecera .wp-block-site-title {
		font-size: 1.2rem;
	}

	.cr-form__fila,
	.cr-servicios,
	.cr-cifras,
	.cr-pasos {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	.cr-pasos {
		row-gap: 2.5rem !important;
	}

	.cr-servicio {
		min-height: 0 !important;
	}

	.cr-cifras > .wp-block-group {
		display: flex;
		align-items: baseline;
		gap: 1rem;
	}

	.cr-cifras .cr-cifra__valor {
		flex: none;
		min-width: 5.5rem;
	}

	.cr-cifras .cr-cifra__texto {
		margin-top: 0 !important;
	}
}