/*
Theme Name:   Faneca Brava
Theme URI:    https://fanecabrava.com
Description:  Child theme de Twenty Twenty-Five para Faneca Brava. Promoción destacada actual: Costamoura.
Author:       Estudio Besta
Template:     twentytwentyfive
Version:      1.1.2
Text Domain:  fanecabrava
*/

/* =========================================================
   RUTA: /wp-content/themes/fanecabrava/style.css
   PASO 1 · Base general del sitio (secciones 1 a 5).
   PASO 2 · Cabecera (sección 6).
   PASO 3 · Hero de la ficha (sección 7).
   PASO 4 · Bandas y leyenda (secciones 8 y 9).
   PASO 5 · Etiquetas y banda "Conoce la promoción" (secciones 10 y 11).
   PASO 6 · Resto de secciones de la ficha y pie (secciones 12 a 22).
   Los estilos de cada sección de la ficha de Costamoura
   se añadirán en los pasos siguientes, al final de este archivo.
   ========================================================= */


/* ---------------------------------------------------------
   1. VARIABLES PROPIAS
   Alturas y medidas que usaremos en varias secciones.
   (Los colores y tipografías viven en theme.json y se usan
   como var(--wp--preset--color--slug), no se repiten aquí.)
   --------------------------------------------------------- */
:root {
	--fb-barra-dorada: 60px;      /* Altura de la franja dorada superior (la que se desliza hacia arriba) */
	--fb-barra-menu: 40px;        /* Altura de la barra azul marino (la que se queda fija) */
	--fb-separacion-seccion: clamp(60px, 9vw, 120px); /* Aire vertical dentro de cada banda */
	--fb-margen-lateral: clamp(20px, 5vw, 60px);      /* Margen a izquierda y derecha del contenido */
	--fb-parrafo-separacion: 1em; /* Hueco entre dos párrafos seguidos (sección 23). Antes 1.5rem */
}

/* En móvil y tablet, la franja dorada es algo más baja */
@media (max-width: 781px) {
	:root {
		--fb-barra-dorada: 50px;
	}
}


/* ---------------------------------------------------------
   2. SCROLL SUAVE Y ANCLAS
   Al pinchar en el menú de anclas, la sección no queda
   tapada por la barra fija del menú.
   --------------------------------------------------------- */
html {
	scroll-behavior: smooth;
}

[id] {
	scroll-margin-top: calc(var(--fb-barra-menu) + 20px);
}

/* Si el usuario tiene activado "reducir movimiento", sin scroll suave */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}


/* ---------------------------------------------------------
   3. TIPOGRAFÍA BASE
   Inter variable (assets/fonts/inter/): cuerpo a 350 (en
   theme.json) y negritas a 700, del mismo archivo.
   --------------------------------------------------------- */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

strong,
b {
	font-weight: 700;
}

/* Texto solo para lectores de pantalla (invisible en pantalla).
   Se usa, por ejemplo, en la pestaña "PromociónDestacada". */
.fb-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}


/* ---------------------------------------------------------
   4. IMÁGENES Y VÍDEO
   Evita huecos bajo imágenes y vídeos en bloque.
   --------------------------------------------------------- */
img,
video {
	display: block;
	max-width: 100%;
	height: auto;
}


/* ---------------------------------------------------------
   5. ELIMINAR HUECOS ENTRE BANDAS
   Las secciones de la one-page son bandas de color a ancho
   completo pegadas unas a otras: quitamos el margen que
   WordPress mete entre bloques de primer nivel.
   --------------------------------------------------------- */
.wp-site-blocks > *,
.wp-site-blocks main > *,
.entry-content > .alignfull {
	margin-block-start: 0;
}


/* ---------------------------------------------------------
   6. CABECERA  (archivo: parts/header.html)
   --------------------------------------------------------- */

/* 6.1 Comportamiento al hacer scroll.
   Toda la cabecera es "pegajosa", pero con un tope negativo
   igual a la altura de la franja dorada: la franja dorada
   se va hacia arriba y la barra marino se queda fija.
   La variable del admin bar evita que la tape la barra negra
   de WordPress cuando estás conectado. */
header.wp-block-template-part {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) - var(--fb-barra-dorada));
	z-index: 100;
}

/* 6.2 Contenedores interiores de las dos franjas:
   mismo ancho de contenido y márgenes que el resto de la web */
.fb-franja-dorada__interior,
.fb-barra-menu__interior {
	box-sizing: content-box;
	max-width: var(--wp--style--global--content-size, 1200px);
	height: 100%;
	margin-inline: auto;
	padding-inline: var(--fb-margen-lateral);
}

/* 6.3 Franja dorada con degradado */
.fb-franja-dorada {
	height: var(--fb-barra-dorada);
	background: var(--wp--preset--gradient--dorado);
	color: var(--wp--preset--color--blanco);
}

.fb-franja-dorada__interior {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* Logo Faneca Brava (blanco, enlaza a la portada).
   El SVG tiene aire arriba y abajo: con 44px de alto
   las letras quedan a unos 20px. */
.fb-logo {
	display: block;
	line-height: 0;
	color: inherit;
}

.fb-logo svg {
	height: 44px;
	width: auto;
}

/* Icono decorativo de la derecha */
.fb-icono {
	display: block;
	line-height: 0;
}

.fb-icono svg {
	height: 44px;
	width: auto;
}

@media (max-width: 781px) {
	.fb-logo svg,
	.fb-icono svg {
		height: 36px;
	}
}

/* 6.4 Barra azul marino (la que se queda fija) */
.fb-barra-menu {
	height: var(--fb-barra-menu);
	background: var(--wp--preset--color--marino);
	color: var(--wp--preset--color--blanco);
}

.fb-barra-menu__interior.is-layout-flex {
	align-items: stretch;
	gap: 1rem;
}

/* 6.5 Pestaña "PromociónDestacada" en dorado liso,
   ocupando toda la altura de la barra */
.fb-pestana {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	width: clamp(180px, 20vw, 290px);
	margin: 0;
	padding-inline: 12px;
	background: var(--wp--preset--color--dorado);
	color: var(--wp--preset--color--blanco);
	font-size: var(--wp--preset--font-size--etiqueta);
	font-weight: 350;  /* mismo peso que el texto (theme.json) */
	letter-spacing: 0.02em;
	line-height: 1;
}

/* 6.6 Menú de anclas (escritorio) */
.fb-menu {
	align-self: center;
	font-size: 0.8125rem;
}

.fb-menu .wp-block-navigation__container {
	gap: 2.25rem;
}

.fb-menu .wp-block-navigation-item__content {
	color: var(--wp--preset--color--blanco);
	text-decoration: none;
	opacity: 0.85;
	transition: opacity 0.2s ease;
}

.fb-menu .wp-block-navigation-item__content:hover,
.fb-menu .wp-block-navigation-item__content:focus-visible {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 4px;
	text-decoration-thickness: 1px;
}

/* 6.7 Menú en móvil: el botón hamburguesa abre un menú
   a pantalla completa en azul marino, con los enlaces
   grandes en Ivyora */
.fb-menu .wp-block-navigation__responsive-container.is-menu-open {
	padding: calc(var(--fb-barra-menu) + 40px) var(--fb-margen-lateral) 40px;
}

.fb-menu .is-menu-open .wp-block-navigation__container {
	gap: 1.25rem;
}

.fb-menu .is-menu-open .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--ivyora);
	font-size: 2rem;
	opacity: 1;
}


/* ---------------------------------------------------------
   7. HERO DE LA FICHA  (bloque Portada con clase "fb-hero")
   Imagen o vídeo a ancho completo, wordmark centrado
   y caja de situación abajo a la izquierda.
   --------------------------------------------------------- */

/* 7.1 La portada sin relleno interior: el wordmark se centra
   solo y la caja de situación se apoya en el borde inferior */
.wp-block-cover.fb-hero {
	padding: 0;
}

/* 7.2 El contenedor interior deja de ser la referencia de
   posición, para que la caja de situación se coloque
   respecto a toda la imagen y no respecto al wordmark */
.fb-hero .wp-block-cover__inner-container {
	position: static;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* 7.3 Wordmark CostaMoura (h1 de la página) en blanco */
.fb-hero__marca {
	position: relative;
	z-index: 2;
	margin: 0;
	line-height: 0;
	color: var(--wp--preset--color--blanco);
}

.fb-hero__marca svg {
	width: clamp(240px, 36vw, 640px);
	height: auto;
}

/* 7.4 Caja de situación "O Con da Ventureira · Sanxenxo".
   Mismo ancho y misma línea de arranque que la pestaña
   "PromociónDestacada" de la cabecera, para que queden alineadas */
.fb-hero__lugar {
	position: absolute;
	z-index: 2;
	bottom: 0;
	left: max(var(--fb-margen-lateral), calc((100% - var(--wp--style--global--content-size, 1200px)) / 2));
	box-sizing: border-box;
	width: clamp(180px, 20vw, 290px);
	margin: 0;
	padding: 18px 12px 26px;
	background: var(--wp--preset--color--azul-medio);
	color: var(--wp--preset--color--marino);
	font-size: var(--wp--preset--font-size--etiqueta);
	line-height: 1.4;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}


/* ---------------------------------------------------------
   8. BANDAS (clase "fb-banda")
   Todas las secciones de color de la ficha llevan esta clase:
   mismo aire arriba y abajo en todas. Para dar más o menos
   aire a toda la web, cambia --fb-separacion-seccion (sección 1).
   --------------------------------------------------------- */
.fb-banda {
	padding-block: var(--fb-separacion-seccion);
}


/* ---------------------------------------------------------
   9. LEYENDA (banda azul medio con texto grande en Ivyora)
   Ancho del texto: 960px (se fija en el propio bloque Grupo).
   --------------------------------------------------------- */
.fb-leyenda__texto {
	margin: 0;
	font-family: var(--wp--preset--font-family--ivyora);
	font-size: var(--wp--preset--font-size--leyenda);
	font-weight: 300;
	line-height: 1.3;
	text-align: center;
	text-wrap: pretty;           /* Evita líneas finales de una sola palabra */
	color: var(--wp--preset--color--marino);
}


/* ---------------------------------------------------------
   10. ETIQUETAS (párrafos con la clase "fb-etiqueta")
   El texto pequeño en mayúsculas que va encima de cada
   título: "Conoce la promoción", "Para descargar"...
   --------------------------------------------------------- */
.fb-etiqueta {
	margin: 0 0 1.25rem;
	font-size: var(--wp--preset--font-size--etiqueta);
	font-weight: 350;  /* mismo peso que el texto (theme.json) */
	letter-spacing: 0.08em;
	text-transform: uppercase;
}


/* ---------------------------------------------------------
   11. BANDA "CONOCE LA PROMOCIÓN"  (patrón 03)
   Texto a la izquierda alineado con el resto de la web;
   imagen a la derecha que llega hasta el borde de la pantalla.
   --------------------------------------------------------- */

/* 11.1 Margen izquierdo = arranque del contenido de la web.
   (El 100% aquí es el ancho del contenedor de la página, que
   ya descuenta su margen lateral; por eso se vuelve a sumar.)
   Sin margen derecho, para que la imagen toque el borde.
   La galería (patrón 06) usa el mismo sistema. */
.fb-intro,
.fb-galeria {
	padding-left: max(var(--fb-margen-lateral), calc((100% - var(--wp--style--global--content-size, 1200px)) / 2 + var(--wp--style--root--padding-left, 0px)));
	padding-right: 0;
}

/* 11.2 Columnas: separación entre texto e imagen */
.fb-intro__columnas.wp-block-columns {
	gap: clamp(30px, 5vw, 80px);
	margin: 0;
}

/* 11.3 Columna de texto */
.fb-intro__texto h2 {
	margin-block: 0 1.5rem;
}

.fb-intro__texto p {
	max-width: 34em;   /* Líneas de lectura cómoda */
}

/* 11.4 Imagen: ocupa toda su columna, sin márgenes */
.fb-intro__imagen .wp-block-image {
	margin: 0;
}

.fb-intro__imagen img {
	width: 100%;
}

/* 11.5 Móvil y tablet: columnas apiladas, texto arriba,
   e imagen con margen también a la derecha */
@media (max-width: 781px) {
	.fb-intro {
		padding-right: var(--fb-margen-lateral);
	}
}


/* ---------------------------------------------------------
   12. CIFRAS  (patrón 04, banda coral)
   Cuatro recuadros con borde fino blanco y número grande.
   Los anchos (20/20/30/30 %) se fijan en cada Columna del bloque.
   --------------------------------------------------------- */
.fb-cifras {
	color: var(--wp--preset--color--blanco);
}

.fb-cifras__columnas.wp-block-columns {
	gap: 10px;
	margin: 0;
}

.fb-cifra {
	padding: clamp(28px, 4vw, 48px) 20px;
	border: 1px solid rgba(255, 255, 255, 0.6);
	text-align: center;
}

.fb-cifra p {
	margin: 0;
	font-family: var(--wp--preset--font-family--ivyora);
	font-weight: 300;
}

.fb-cifra__numero {
	font-size: var(--wp--preset--font-size--cifra);
	line-height: 1;
}

.fb-cifra__texto {
	margin-top: 0.75rem !important;
	font-size: 1.375rem;
	line-height: 1.2;
}

/* En móvil y tablet: dos recuadros por fila
   (arriba "2" y "+1", abajo las dos superficies) */
@media (max-width: 781px) {
	.fb-cifras__columnas.wp-block-columns {
		flex-wrap: wrap !important;
	}

	.fb-cifras__columnas.wp-block-columns > .fb-cifra.wp-block-column {
		box-sizing: border-box;
		flex-basis: calc(50% - 5px) !important;
		flex-grow: 0;
		padding-inline: 10px;
	}

	.fb-cifra__numero {
		font-size: 3.5rem;
	}

	.fb-cifra__texto {
		font-size: 1.0625rem;
	}
}


/* ---------------------------------------------------------
   13. IMAGEN A ANCHO COMPLETO CON PARALLAX  (patrón 05)
   El movimiento lo hace assets/js/fanecabrava.js.
   La imagen es un poco más alta que el bloque para que,
   al desplazarse, nunca se vea el borde.
   Si el bloque tiene "Fondo fijo" activado, esto no se aplica:
   la imagen queda quieta detrás y la página pasa por encima.
   --------------------------------------------------------- */
.wp-block-cover.fb-parallax {
	padding: 0;
	overflow: hidden;
}

.fb-parallax-activo .fb-parallax img.wp-block-cover__image-background {
	top: -12%;
	height: 124%;
	will-change: transform;
}

/* El párrafo vacío que el bloque Fondo necesita por dentro */
.fb-parallax__vacio {
	display: none;
}


/* ---------------------------------------------------------
   14. NOTA LEGAL  (párrafos con la clase "fb-nota-legal")
   --------------------------------------------------------- */
.fb-nota-legal {
	max-width: 46em;
	margin-block: 0 2rem;
	font-size: 0.6875rem;
	line-height: 1.5;
	opacity: 0.85;
}


/* ---------------------------------------------------------
   15. GALERÍA EN CARRUSEL  (patrón 06)
   Fila horizontal de imágenes que llega al borde derecho.
   Se desliza con el dedo, con el trackpad o con las flechas.
   Al pinchar una imagen se amplía (opción del propio bloque).
   ALTO DE LAS IMÁGENES: --fb-galeria-alto.
   --------------------------------------------------------- */
.fb-galeria {
	--fb-galeria-alto: clamp(240px, 32vw, 460px);
}

.fb-galeria h2 {
	margin-block: 0 1rem;
}

/* La galería se convierte en una fila que se desplaza */
.wp-block-gallery.fb-galeria__carrusel {
	display: flex;
	flex-wrap: nowrap !important;
	gap: 10px;
	margin: 0;
	padding-right: var(--fb-margen-lateral);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;            /* Oculta la barra de desplazamiento */
}

.wp-block-gallery.fb-galeria__carrusel::-webkit-scrollbar {
	display: none;
}

/* Cada imagen: misma altura, ancho según su proporción 16:10 */
.wp-block-gallery.fb-galeria__carrusel > .wp-block-image {
	flex: 0 0 auto !important;
	width: calc(var(--fb-galeria-alto) * 1.6) !important;
	height: var(--fb-galeria-alto);
	margin: 0 !important;
	scroll-snap-align: start;
}

.wp-block-gallery.fb-galeria__carrusel > .wp-block-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
}

/* Flechas (las crea el script) */
.fb-carrusel__flechas {
	display: flex;
	gap: 8px;
	margin-top: 1.25rem;
}

.fb-carrusel__flecha {
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--wp--preset--color--marino);
	border-radius: 0;
	background: transparent;
	color: var(--wp--preset--color--marino);
	font-size: 1.125rem;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.fb-carrusel__flecha:hover:not(:disabled) {
	background: var(--wp--preset--color--marino);
	color: var(--wp--preset--color--blanco);
}

.fb-carrusel__flecha:disabled {
	opacity: 0.3;
	cursor: default;
}


/* ---------------------------------------------------------
   16. DESCARGAS  (patrón 07, banda azul medio)
   --------------------------------------------------------- */
.fb-descargas__columnas.wp-block-columns,
.fb-descargas__lista.wp-block-columns {
	margin: 0;
}

.fb-descargas h2 {
	margin: 0;
}

.fb-descargas__lista.wp-block-columns {
	gap: clamp(20px, 3vw, 40px);
}

/* Cada documento: título, miniatura y botón */
.fb-documento {
	max-width: 200px;
}

.fb-documento__titulo {
	margin: 0 0 0.75rem;
	font-size: 1.25rem;
	line-height: 1.15;
}

.fb-documento__miniatura {
	margin: 0 0 0.75rem;
}

.fb-documento__miniatura img {
	width: 100%;
	transition: opacity 0.2s ease;
}

.fb-documento__miniatura a:hover img {
	opacity: 0.85;
}

/* Botón "Descargar": pequeño, mayúsculas, con borde */
.fb-boton .wp-block-button__link {
	padding: 0.5em 1em;
	border: 1px solid var(--wp--preset--color--marino);
	border-radius: 0;
	background: transparent;
	color: var(--wp--preset--color--marino);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: background 0.2s ease, color 0.2s ease;
}

.fb-boton .wp-block-button__link:hover,
.fb-boton .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--marino);
	color: var(--wp--preset--color--blanco);
}


/* ---------------------------------------------------------
   17. MAPA  (patrón 08)
   Imagen a todo el ancho que abre Google Maps.
   En móvil se recorta por los lados: deja el marcador en
   la franja central de la imagen.
   --------------------------------------------------------- */
.fb-mapa .wp-block-image {
	margin: 0;
	line-height: 0;          /* Sin franja bajo la imagen */
}

.fb-mapa .wp-block-image a {
	display: block;
}

.fb-mapa img {
	width: 100%;
	height: auto;
	aspect-ratio: 8 / 3;
	object-fit: cover;
	transition: filter 0.3s ease;
}

.fb-mapa a:hover img {
	filter: brightness(1.05);
}

@media (max-width: 781px) {
	.fb-mapa img {
		aspect-ratio: auto;
		height: 340px;
	}
}


/* ---------------------------------------------------------
   18. CONTACTO  (patrón 09, banda azul claro)
   --------------------------------------------------------- */
.fb-contacto h2 {
	margin-block: 0 2rem;
}

.fb-contacto__columnas.wp-block-columns {
	gap: clamp(30px, 5vw, 80px);
	margin: 0;
}

.fb-contacto__columnas p {
	max-width: 34em;
}

.fb-contacto__columnas p:first-child {
	margin-top: 0;
}

/* Los párrafos del formulario sí ocupan todo su ancho */
.fb-contacto__columnas .fb-form p {
	max-width: none;
}

.fb-contacto a {
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}


/* ---------------------------------------------------------
   19. FORMULARIO  (Contact Form 7, "Contacto Costamoura")
   Campos con solo una línea inferior, etiquetas pequeñas
   en mayúsculas, email y teléfono en dos columnas.
   --------------------------------------------------------- */
.fb-form {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem 1.5rem;
}

.fb-form__campo {
	margin: 0;
}

.fb-form__campo--ancho {
	grid-column: 1 / -1;
}

.fb-form br {
	display: none;                    /* Saltos de línea que añade CF7 */
}

.fb-form label {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	font-size: var(--wp--preset--font-size--etiqueta);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fb-form input[type="text"],
.fb-form input[type="email"],
.fb-form input[type="tel"],
.fb-form textarea {
	box-sizing: border-box;
	width: 100%;
	padding: 0.5rem 0;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--marino);
	border-radius: 0;
	background: transparent;
	color: var(--wp--preset--color--marino);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 350;  /* mismo peso que el texto (theme.json) */
	letter-spacing: 0;
	text-transform: none;
}

.fb-form textarea {
	height: 7.5rem;
	resize: vertical;
}

.fb-form input:focus,
.fb-form textarea:focus {
	outline: none;
	border-bottom-width: 2px;
}

/* Casilla de privacidad */
.fb-form__privacidad {
	font-size: 0.875rem;
}

.fb-form__privacidad .wpcf7-list-item {
	margin: 0;
}

/* La casilla y su texto, en la misma línea y en minúscula normal */
.fb-form .fb-form__privacidad label {
	flex-direction: row;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.875rem;
	letter-spacing: 0;
	text-transform: none;
}

.fb-form__privacidad input {
	flex-shrink: 0;
	margin: 0.2rem 0 0;
	accent-color: var(--wp--preset--color--marino);
}

/* Botón Enviar */
.fb-form .fb-form__boton {
	padding: 0.9em 2.5em;
	border: 0;
	border-radius: 0;
	background: var(--wp--preset--color--marino);
	color: var(--wp--preset--color--blanco);
	font-family: inherit;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease;
}

.fb-form .fb-form__boton:hover {
	background: var(--wp--preset--color--coral);
}

/* Mensajes de error y de envío correcto */
.fb-contacto .wpcf7-not-valid-tip {
	margin-top: 0.3rem;
	color: var(--wp--preset--color--coral);
	font-size: 0.75rem;
	text-transform: none;
	letter-spacing: 0;
}

.fb-contacto .wpcf7 form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: 0.75rem 1rem;
	border-width: 1px;
	font-size: 0.875rem;
}

/* En móvil, todos los campos a una columna */
@media (max-width: 600px) {
	.fb-form {
		grid-template-columns: 1fr;
	}
}


/* ---------------------------------------------------------
   20. EL ARQUITECTO  (patrón 10, banda crema)
   --------------------------------------------------------- */
.fb-arquitecto h2 {
	margin-block: 0 2rem;
}

.fb-arquitecto__columnas.wp-block-columns {
	gap: clamp(30px, 5vw, 80px);
	margin: 0;
}

.fb-arquitecto__retrato {
	max-width: 380px;
	margin: 0;
}

.fb-arquitecto__columnas p {
	max-width: 34em;
}

.fb-arquitecto__columnas p:first-child {
	margin-top: 0;
}


/* ---------------------------------------------------------
   21. FANECA BRAVA  (patrón 11, opcional, banda marino)
   --------------------------------------------------------- */
.fb-promotora .fb-etiqueta,
.fb-promotora h2,
.fb-promotora p {
	color: var(--wp--preset--color--blanco);
}

.fb-promotora h2 {
	margin: 0;
}

.fb-promotora__columnas.wp-block-columns {
	gap: clamp(30px, 5vw, 80px);
	margin: 0;
}


/* ---------------------------------------------------------
   22. PIE  (parts/footer.html)
   Copyright y enlaces legales en una línea, en pequeño.
   --------------------------------------------------------- */
.fb-pie {
	padding-block: 2.5rem;
	font-size: var(--wp--preset--font-size--etiqueta);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fb-pie__interior {
	gap: 0.75rem 2rem;
}

.fb-pie p {
	margin: 0;
}

.fb-pie a {
	color: inherit;
	text-decoration: none;
}

.fb-pie a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}


/* ---------------------------------------------------------
   23. TEXTO CORRIDO COMPACTO
   Junta los párrafos seguidos de las bandas para que el
   texto se lea como un bloque. El hueco se cambia con
   --fb-parrafo-separacion (sección 1). Interlineado (1.48)
   e interletrado (-0.011em) están en theme.json
   (styles → typography).
   --------------------------------------------------------- */

/* 23.1 Hueco entre dos párrafos seguidos (antes 1.5rem,
   el hueco general entre bloques de WordPress) */
.fb-banda p + p {
	margin-block-start: var(--fb-parrafo-separacion);
}

/* 23.2 Excepción: los campos del formulario mantienen su
   propio reparto (rejilla de la sección 19) */
.fb-banda .fb-form p + p {
	margin-block-start: 0;
}