/*
Theme Name: Funbapa
Theme URI: https://www.funbapa.org.ar/
Author: Fundación Barrera Zoofitosanitaria Patagónica
Description: Tema institucional de bloques de Funbapa. Portada editable, noticias y páginas.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: funbapa
*/

/* ---------------------------------------------------------------
   Tipografía: Archivo expandida para títulos (vernáculo de cartelería
   vial), Source Serif 4 para lectura.
---------------------------------------------------------------- */
h1, h2, h3, h4,
.wp-block-site-title,
.wp-block-navigation,
.wp-block-button__link,
.fb-sans {
	font-stretch: 125%;
}
h3, h4, .wp-block-navigation, .wp-block-button__link { font-stretch: 112%; }

:where(.wp-site-blocks) :focus-visible {
	outline: 3px solid var(--wp--preset--color--coiron);
	outline-offset: 3px;
}

html { scroll-behavior: smooth; }
/* Las secciones de la portada van pegadas entre sí y al pie. */
.wp-site-blocks > * { margin-block-start: 0; }
.fb-mapa .fb-leyenda { margin-block: var(--wp--preset--spacing--40); }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
}
[id] { scroll-margin-top: 6rem; }

/* ---------------------------------------------------------------
   Encabezado
---------------------------------------------------------------- */
.fb-header {
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: saturate(140%) blur(10px);
	-webkit-backdrop-filter: saturate(140%) blur(10px);
	background: color-mix(in srgb, var(--wp--preset--color--cielo) 88%, transparent);
	border-bottom: 1px solid var(--wp--preset--color--niebla);
}
.admin-bar .fb-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .fb-header { top: 46px; } }

/* Logo del encabezado (patrón funbapa/marca): 48 px de alto, 40 px en celulares. */
.fb-logo { margin: 0; line-height: 0; flex-shrink: 0; }
.fb-logo img { display: block; width: 192px; height: auto; }
@media (max-width: 600px) { .fb-logo img { width: 160px; } }
.fb-brand__name { font-family: var(--wp--preset--font-family--archivo); font-stretch: 125%; font-weight: 800; font-size: 1.35rem; letter-spacing: -.01em; line-height: 1; }

/* ---------------------------------------------------------------
   Portada: la línea de la barrera es el gesto memorable.
   Una franja color coirón que cruza la página bajo el hero y vuelve
   a aparecer en el mapa.
---------------------------------------------------------------- */
/* Con posición "abajo a la izquierda" el contenedor interno se encoge; lo estiramos para alinear con el resto. */
.wp-block-cover.fb-hero.has-custom-content-position.has-custom-content-position .wp-block-cover__inner-container { width: 100%; }

.fb-hero h1 {
	max-width: 15ch;
	text-wrap: balance;
	text-shadow: 0 1px 24px rgba(15, 25, 28, .35);
}
.fb-hero .fb-lead { max-width: 38rem; }
.fb-hero .wp-block-cover__image-background { animation: fb-dawn 2.2s cubic-bezier(.2,.7,.2,1) both; }
@keyframes fb-dawn {
	from { transform: scale(1.06); filter: saturate(.6) brightness(.85); }
	to { transform: scale(1); filter: none; }
}

.fb-barrera {
	position: relative;
	border-top: 10px solid var(--wp--preset--color--coiron);
}
.fb-barrera::before {
	content: "";
	position: absolute;
	inset: -10px 0 auto 0;
	height: 10px;
	background: repeating-linear-gradient(90deg, transparent 0 46px, var(--wp--preset--color--basalto) 46px 58px);
	opacity: .55;
	transform-origin: left;
	animation: fb-line 1.6s .9s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes fb-line { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.fb-dato { border-left: 3px solid var(--wp--preset--color--coiron); padding-left: 1rem; }
.fb-dato strong { display: block; font-family: var(--wp--preset--font-family--archivo); font-stretch: 125%; font-weight: 800; font-size: clamp(1.75rem, 3vw, 2.4rem); line-height: 1; margin-bottom: .35rem; color: var(--wp--preset--color--blanco); }

.fb-que-hacemos .wp-block-media-text { border-top: 1px solid var(--wp--preset--color--niebla); }
.fb-que-hacemos .wp-block-media-text__media img { aspect-ratio: 4 / 3; object-fit: cover; }

.fb-mapa img { width: 100%; height: auto; max-height: 82vh; object-fit: contain; }
.fb-leyenda { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.fb-leyenda li { display: flex; gap: .75rem; align-items: center; }
.fb-leyenda li::before { content: ""; flex: none; width: 1.5rem; height: .9rem; border-radius: 2px; background: var(--fb-sw, currentColor); }
.fb-leyenda .is-region { --fb-sw: var(--wp--preset--color--lenga); }
.fb-leyenda .is-region::before { outline: 1px solid rgba(255, 255, 255, .45); }
.fb-leyenda .is-miembro { --fb-sw: #7f998f; }
.fb-leyenda .is-barrera::before { height: 6px; border-radius: 3px; background: var(--wp--preset--color--coiron); }

.fb-viajeros ul { padding-left: 1.2rem; }
.fb-viajeros li { margin-bottom: .5rem; }
.fb-viajeros li::marker { color: var(--wp--preset--color--basalto); }

.fb-noticias .wp-block-post-featured-image img { aspect-ratio: 3 / 2; object-fit: cover; }
.fb-noticias .wp-block-post-title a { text-decoration: none; }
.fb-noticias .wp-block-post-title a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .2em; }

.fb-contacto a { color: inherit; }

.fb-creditos { font-size: .78rem; opacity: .7; }
.fb-creditos a { color: inherit; }

/* Imágenes de artículos */
.wp-block-post-featured-image img { border-radius: 2px; }

/* Títulos de noticias: más contenidos que los de la portada. */
.single h1.wp-block-post-title { font-size: clamp(2rem, 3.6vw, 3rem); text-wrap: balance; }