/*
Theme Name: García Rocha
Theme URI: https://maderasgarciarocha.com/
Author: Pumpún Dixital
Author URI: https://pumpun.com/
Description: Tema a medida para Hermanos García Rocha, S.L. — maderas gallegas desde 1959. Pensado para usarse con Pumpún Builder.
Version: 2.1.0
Requires at least: 6.4
Requires PHP: 8.1
License: Propietario
Text Domain: garcia-rocha
*/

/* ==========================================================================
   Tokens
   Los colores y tipografías vienen de theme.json (--wp--preset--*); aquí se
   les da nombre corto y se pasan a Pumpún Builder (--pb-*).
   ========================================================================== */

:root {
	--c-base: var(--wp--preset--color--base, #F5F1EA);
	--c-base-2: var(--wp--preset--color--base-2, #EAE3D6);
	--c-white: #fff;
	--c-forest: var(--wp--preset--color--contrast, #18261D);
	--c-forest-2: var(--wp--preset--color--contrast-2, #2A3D30);
	--c-ink: var(--wp--preset--color--ink, #2B2A26);
	--c-muted: var(--wp--preset--color--muted, #6B675E);
	--c-accent: var(--wp--preset--color--accent, #81AA44);
	--c-accent-dark: var(--wp--preset--color--accent-dark, #5E8129);
	--c-line: var(--wp--preset--color--line, #D9D1C2);
	--f-body: var(--wp--preset--font-family--body, Inter, system-ui, sans-serif);
	--f-heading: var(--wp--preset--font-family--heading, Archivo, Inter, sans-serif);
	--radius: 14px;
	--radius-s: 8px;
	--ease: cubic-bezier(.2, .7, .2, 1);
	--wrap: 1240px;
	--gutter: clamp(1rem, 4vw, 2.5rem);
	--shadow: 0 1px 2px rgba(24,38,29,.06), 0 12px 32px -12px rgba(24,38,29,.18);

	/* Pumpún Builder con la marca */
	--pb-container: var(--wrap);
	--pb-gutter: var(--gutter);
	--pb-accent: var(--c-accent);
	--pb-accent-contrast: var(--c-forest);
	--pb-dark: var(--c-forest);
	--pb-muted: var(--c-muted);
	--pb-line: var(--c-line);
	--pb-surface: var(--c-white);
	--pb-light-text: var(--c-base);
	--pb-radius: var(--radius);
	--pb-heading-font: var(--f-heading);
}

/* ==========================================================================
   Base
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: 110px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html:focus-within { scroll-behavior: smooth; } }
body {
	margin: 0;
	overflow-x: clip; /* nada que sobresalga (como el círculo de la foto doble) crea scroll lateral */
	background: var(--c-base);
	color: var(--c-ink);
	font-family: var(--f-body);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; height: auto; }
h1, h2, h3, h4, h5, h6 {
	font-family: var(--f-heading);
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -.02em;
	color: var(--c-forest);
	margin: 0 0 .6em;
}
h1, h2 { font-size: clamp(2rem, 4.2vw, 3.25rem); }
h3 { font-size: clamp(1.4rem, 2.4vw, 1.75rem); }
h4 { font-size: 1.25rem; }
p { margin: 0 0 1em; }
a { color: var(--c-accent-dark); text-underline-offset: 3px; }
a:hover { color: var(--c-forest); }
::selection { background: var(--c-accent); color: var(--c-forest); }
:focus-visible { outline: 3px solid var(--c-accent); outline-offset: 2px; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.hgr-skip { position: absolute; left: 1rem; top: -4rem; z-index: 100; padding: .6rem 1rem; background: var(--c-forest); color: #fff; border-radius: var(--radius-s); }
.hgr-skip:focus { top: 1rem; }

.hgr-wrap { width: 100%; max-width: calc(var(--wrap) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
.hgr-wrap--narrow { max-width: calc(900px + 2 * var(--gutter)); }
.hgr-wrap--text { max-width: calc(760px + 2 * var(--gutter)); }
.hgr-section { padding-block: clamp(3rem, 7vw, 6rem); }
.hgr-section--alt { background: var(--c-base-2); }

/* Botones y enlaces */
.hgr-btn, .pb-btn.is-primary, .pb-btn.is-dark, .pb-btn.is-outline, .pb-btn.is-outline-light {
	font-family: var(--f-heading);
	font-weight: 600;
	font-size: 1rem;
}
.hgr-btn {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .85rem 1.6rem;
	border-radius: 999px;
	background: var(--c-accent);
	color: var(--c-forest);
	text-decoration: none;
	line-height: 1.2;
	transition: background-color .2s, color .2s, transform .2s var(--ease);
}
.hgr-btn:hover, .pb-btn.is-primary:hover { background: var(--c-forest); color: #fff; transform: translateY(-1px); }
.hgr-btn.is-dark, .pb-btn.is-dark { background: var(--c-forest); color: #fff; }
.hgr-btn.is-dark:hover, .pb-btn.is-dark:hover { background: var(--c-accent); color: var(--c-forest); }
.hgr-btn.is-outline { background: transparent; box-shadow: inset 0 0 0 2px var(--c-forest); color: var(--c-forest); }
.hgr-actions { display: flex; flex-wrap: wrap; gap: .75rem; }

.hgr-eyebrow, .pb-heading.is-eyebrow {
	display: flex;
	align-items: center;
	gap: .6rem;
	margin: 0 0 .75rem;
	font-family: var(--f-heading);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--c-accent-dark);
}
.hgr-eyebrow::before, .pb-heading.is-eyebrow::before { content: ""; width: 1.75rem; height: 2px; background: currentColor; flex-shrink: 0; }
.has-text-align-center .pb-heading.is-eyebrow, .pb-heading.is-eyebrow.has-text-align-center { justify-content: center; }
.hgr-eyebrow.is-light, .is-text-light .pb-heading.is-eyebrow { color: var(--c-accent); }
.hgr-eyebrow a { color: inherit; text-decoration: none; }
.hgr-eyebrow a:hover { color: #fff; }

.hgr-link-arrow { margin: 0; }
.hgr-link-arrow a, .pb-btn.is-link {
	font-family: var(--f-heading);
	font-weight: 600;
	text-decoration: none;
	color: var(--c-forest);
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	border-bottom: 2px solid var(--c-accent);
	padding-bottom: .15rem;
}
.hgr-link-arrow a::after { content: "→"; transition: transform .2s var(--ease); }
.hgr-link-arrow a:hover::after { transform: translateX(4px); }
.is-text-light .pb-btn.is-link { color: #fff; }

.hgr-section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; margin-bottom: clamp(1.75rem, 3vw, 2.5rem); }
.hgr-section-head h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2rem); }

/* ==========================================================================
   Cabecera
   ========================================================================== */

.hgr-site-header { position: sticky; top: 0; z-index: 50; transition: box-shadow .25s var(--ease); }
.admin-bar .hgr-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .hgr-site-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .hgr-site-header { top: 0; } }
.hgr-site-header.is-scrolled { box-shadow: 0 8px 24px -16px rgba(24, 38, 29, .35); }

.hgr-topbar { background: var(--c-forest); color: var(--c-base); font-size: .875rem; }
.hgr-topbar__inner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 2.25rem; }
.hgr-topbar p { margin: 0; }
.hgr-topbar__tag { opacity: .7; }
.hgr-topbar__contact { display: flex; gap: 1.5rem; }
.hgr-topbar a { color: inherit; text-decoration: none; opacity: .85; }
.hgr-topbar a:hover { opacity: 1; color: var(--c-accent); }

.hgr-header {
	background: color-mix(in srgb, var(--c-base) 94%, transparent);
	backdrop-filter: saturate(1.4) blur(10px);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid var(--c-line);
}
.hgr-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; min-height: 76px; }
.hgr-logo { display: block; line-height: 0; flex-shrink: 0; }
.hgr-logo img { width: clamp(170px, 18vw, 230px); height: auto; }

.hgr-nav { display: flex; align-items: center; gap: 1.75rem; }
.hgr-menu { display: flex; align-items: center; gap: 1.6rem; margin: 0; padding: 0; list-style: none; }
.hgr-menu li { position: relative; }
.hgr-menu a {
	position: relative;
	display: block;
	padding-block: .35rem;
	font-size: .95rem;
	font-weight: 500;
	color: var(--c-forest);
	text-decoration: none;
}
.hgr-menu > li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: -2px;
	height: 2px;
	background: var(--c-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s var(--ease);
}
.hgr-menu > li > a:hover::after,
.hgr-menu > .current-menu-item > a::after,
.hgr-menu > .current-menu-ancestor > a::after,
.hgr-menu > .current_page_parent > a::after,
.hgr-menu > li > a.is-current::after { transform: scaleX(1); }
/* En la web de una página, los enlaces a anclas no heredan el "actual" de WordPress */
.hgr-menu > .menu-item-type-custom.current-menu-item > a:not(.is-current)::after { transform: scaleX(0); }
/* Submenús (hasta 2 niveles) */
.hgr-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: -1rem;
	min-width: 220px;
	margin: 0;
	padding: .5rem;
	list-style: none;
	background: #fff;
	border: 1px solid var(--c-line);
	border-radius: var(--radius-s);
	box-shadow: var(--shadow);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .2s, transform .2s, visibility .2s;
}
.hgr-menu li:hover > .sub-menu, .hgr-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.hgr-menu .sub-menu a { padding: .5rem .75rem; border-radius: 6px; }
.hgr-menu .sub-menu a:hover { background: var(--c-base); }
.hgr-menu .menu-item-has-children > a { padding-right: 1rem; }
.hgr-menu .menu-item-has-children > a::before { content: ""; position: absolute; right: 0; top: 50%; width: 6px; height: 6px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: translateY(-70%) rotate(45deg); }

.hgr-header__cta { padding: .6rem 1.2rem; }

.hgr-nav-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; color: var(--c-forest); }
.hgr-nav-toggle__bars, .hgr-nav-toggle__bars::before, .hgr-nav-toggle__bars::after { display: block; width: 26px; height: 2px; background: currentColor; border-radius: 2px; transition: transform .25s var(--ease), opacity .2s; }
.hgr-nav-toggle__bars { position: relative; margin-inline: auto; }
.hgr-nav-toggle__bars::before, .hgr-nav-toggle__bars::after { content: ""; position: absolute; left: 0; }
.hgr-nav-toggle__bars::before { top: -8px; }
.hgr-nav-toggle__bars::after { top: 8px; }
.hgr-nav-toggle[aria-expanded="true"] .hgr-nav-toggle__bars { background: transparent; }
.hgr-nav-toggle[aria-expanded="true"] .hgr-nav-toggle__bars::before { transform: translateY(8px) rotate(45deg); }
.hgr-nav-toggle[aria-expanded="true"] .hgr-nav-toggle__bars::after { transform: translateY(-8px) rotate(-45deg); }

@media (max-width: 1100px) {
	/* backdrop-filter convertiría la cabecera en el contenedor del panel fijo y lo recortaría */
	.hgr-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--c-base); }
	.hgr-nav-toggle { display: block; }
	.hgr-nav {
		position: fixed;
		inset: var(--hgr-header-h, 112px) 0 0 0;
		z-index: 40;
		flex-direction: column;
		align-items: stretch;
		gap: 1.5rem;
		padding: 2rem var(--gutter) 3rem;
		background: var(--c-forest);
		overflow-y: auto;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity .25s, transform .25s var(--ease), visibility .25s;
	}
	.hgr-nav.is-open { opacity: 1; visibility: visible; transform: none; }
	.hgr-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.hgr-menu a { color: var(--c-base); font-family: var(--f-heading); font-size: 1.5rem; font-weight: 600; padding-block: .6rem; border-bottom: 1px solid rgba(245,241,234,.1); }
	.hgr-menu > li > a::after { display: none; }
	.hgr-menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; background: none; border: 0; box-shadow: none; padding: 0 0 0 1rem; }
	.hgr-menu .sub-menu a { font-size: 1.1rem; font-weight: 500; }
	.hgr-menu .sub-menu a:hover { background: none; color: var(--c-accent); }
	.hgr-menu .menu-item-has-children > a::before { display: none; }
	.hgr-header__cta { align-self: flex-start; }
	body.hgr-nav-open { overflow: hidden; }
}
@media (max-width: 781px) {
	.hgr-topbar__tag { display: none; }
	.hgr-topbar__inner { justify-content: center; }
	.hgr-topbar__contact { gap: 1rem; }
}

/* ==========================================================================
   Cabecera de página
   ========================================================================== */

.hgr-page-hero { position: relative; overflow: hidden; background: var(--c-forest); color: var(--c-base); padding-block: clamp(2.5rem, 5vw, 4rem); }
.hgr-page-hero::after {
	content: "";
	position: absolute;
	right: -6rem; top: 50%;
	width: 26rem; height: 26rem;
	transform: translateY(-50%);
	background: url("assets/img/mark.png") center / contain no-repeat;
	opacity: .06;
	pointer-events: none;
}
.hgr-page-hero h1 { margin: 0; color: #fff; text-wrap: balance; max-width: 24ch; }
.hgr-page-hero__lead { max-width: 44rem; margin-top: 1rem; font-size: 1.25rem; color: rgba(245, 241, 234, .8); }
.hgr-page-hero__lead p:last-child { margin: 0; }
.hgr-meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin: 0 0 1rem; font-size: .85rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--c-accent); }
.hgr-meta a { color: inherit; text-decoration: none; }
.hgr-meta a:hover { color: #fff; }

/* ==========================================================================
   Tarjetas y rejillas
   ========================================================================== */

.hgr-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1000px) { .hgr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .hgr-grid { grid-template-columns: 1fr; } }

.hgr-product-card, .hgr-news-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
	overflow: hidden;
	transition: transform .25s var(--ease), box-shadow .25s;
}
.hgr-product-card:hover, .hgr-news-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.hgr-product-card.is-static:hover { transform: none; box-shadow: none; }
.hgr-product-card.is-static:hover .hgr-card__media img { transform: none; }
.hgr-card__media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--c-base-2); }
.hgr-news-card .hgr-card__media { aspect-ratio: 16 / 10; }
.hgr-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--ease); }
.hgr-product-card:hover .hgr-card__media img, .hgr-news-card:hover .hgr-card__media img { transform: scale(1.05); }
.hgr-card__media.is-empty { background: var(--c-forest-2) url("assets/img/mark.png") center / 28% no-repeat; background-blend-mode: luminosity; }
.hgr-card__body { padding: 1.2rem 1.3rem 1.4rem; }
.hgr-card__title { margin: 0 0 .4rem; font-size: 1.25rem; text-wrap: balance; }
.hgr-card__title a { color: var(--c-forest); text-decoration: none; }
.hgr-card__title a:hover { color: var(--c-accent-dark); }
.hgr-card__excerpt { margin: 0; font-size: .9rem; color: var(--c-muted); line-height: 1.5; }
.hgr-card__date { display: block; margin-bottom: .4rem; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--c-accent-dark); }

.hgr-pagination { margin-top: clamp(2rem, 4vw, 3rem); }
.hgr-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin: 0; padding: 0; list-style: none; font-weight: 600; }
.hgr-pagination a, .hgr-pagination span { display: block; padding: .45rem .85rem; border-radius: 999px; text-decoration: none; color: var(--c-forest); }
.hgr-pagination .current { background: var(--c-forest); color: #fff; }

/* Certificados */
.hgr-certs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.hgr-certs a {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .25rem;
	height: 100%;
	padding: 1.4rem 1.3rem;
	border-radius: var(--radius);
	background: #fff;
	border: 1px solid var(--c-line);
	text-decoration: none;
	color: var(--c-ink);
	transition: border-color .2s, transform .2s var(--ease), box-shadow .2s;
}
.hgr-certs a::after { content: "PDF ↓"; position: absolute; top: 1.3rem; right: 1.2rem; font-size: .7rem; font-weight: 700; letter-spacing: .08em; color: var(--c-muted); }
.hgr-certs a { padding-right: 3.6rem; }
.hgr-certs a:hover { border-color: var(--c-accent); transform: translateY(-2px); box-shadow: var(--shadow); }
.hgr-certs strong { font-family: var(--f-heading); font-size: 1.35rem; color: var(--c-forest); letter-spacing: -.01em; }
.hgr-certs span { font-size: .88rem; color: var(--c-muted); }
@media (max-width: 900px) { .hgr-certs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Datos de contacto */
.hgr-contact-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.25rem; }
.hgr-contact-list li { display: grid; gap: .15rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--c-line); }
.hgr-contact-list small { font-weight: 700; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent-dark); }
.hgr-contact-list a, .hgr-contact-list span { font-family: var(--f-heading); font-size: 1.25rem; font-weight: 600; color: var(--c-forest); text-decoration: none; }
.hgr-maps { margin: 1.5rem 0 0; }

/* Foto doble */
.hgr-photo-stack { position: relative; margin: 0 0 3.5rem; }
.hgr-photo-stack__main { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; border-radius: var(--radius); display: block; }
/*
 * Círculo en la esquina inferior izquierda. Su centro queda a ~9 % del ancho de la
 * esquina de la foto de detrás, así que la esquina redondeada queda tapada del todo.
 * Se posiciona con `translate` (no con `transform`) para no chocar con la animación.
 */
.hgr-photo-stack__old {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 42%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50%;
	border: 8px solid var(--c-base-2);
	box-shadow: var(--shadow);
	translate: -28% 28%;
}
@media (max-width: 781px) {
	.hgr-photo-stack__old { width: 38%; border-width: 6px; translate: -10% 26%; }
}

/* Banda de contacto */
.hgr-cta-band { background: var(--c-accent); color: var(--c-forest); padding-block: clamp(2.5rem, 5vw, 4rem); }
.hgr-cta-band__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; }
.hgr-cta-band h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin-bottom: .4rem; }
.hgr-cta-band p { margin: 0; }
.hgr-cta-band a:not(.hgr-btn) { color: inherit; font-weight: 600; }

/* ==========================================================================
   Texto largo (noticias, legales, fichas)
   ========================================================================== */

.hgr-prose > :first-child { margin-top: 0; }
.hgr-prose h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin-top: 2.5rem; }
.hgr-prose h3 { font-size: 1.35rem; margin-top: 2rem; }
.hgr-prose img { border-radius: var(--radius-s); }
.hgr-prose ul, .hgr-prose ol { padding-left: 1.25rem; }
.hgr-prose figure { margin: 2rem 0; }
.hgr-prose .wp-block-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 2.5rem; }
.hgr-prose .wp-block-gallery figure { margin: 0; }
.hgr-prose .wp-block-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 600px) { .hgr-prose .wp-block-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.hgr-single-media { margin: 0 0 2.5rem; }
.hgr-single-media img { width: 100%; border-radius: var(--radius); display: block; }

.hgr-prose table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: #fff;
	border: 1px solid var(--c-line);
	border-radius: var(--radius-s);
	overflow: hidden;
	font-size: .95rem;
	font-variant-numeric: tabular-nums;
}
.hgr-prose th, .hgr-prose td { padding: .6rem .9rem; border: 0; border-bottom: 1px solid var(--c-line); text-align: left; }
.hgr-prose tr:last-child td { border-bottom: 0; }
.hgr-prose th { background: var(--c-forest); color: #fff; font-family: var(--f-heading); font-weight: 600; font-size: .92rem; }
.hgr-prose tbody tr:nth-child(odd) td { background: color-mix(in srgb, var(--c-base) 55%, white); }
.hgr-prose .wp-block-table { margin: 0; }
.hgr-specs { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; margin-block: 2rem; }

.hgr-post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--c-line); }
.hgr-post-nav div:last-child { text-align: right; }
.hgr-post-nav a { font-family: var(--f-heading); font-weight: 600; color: var(--c-forest); text-decoration: none; }
.hgr-post-nav small { display: block; font-family: var(--f-body); font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--c-accent-dark); }

/* Ficha de producto */
.hgr-product { display: grid; grid-template-columns: 44% 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.hgr-product__media { position: sticky; top: 130px; }
.hgr-product__img { margin: 0 0 1.25rem; }
.hgr-product__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); display: block; }
.hgr-product__ask { background: var(--c-base-2); border-radius: var(--radius); padding: 1.5rem; }
.hgr-product__ask h2 { font-size: 1.25rem; margin: 0 0 .4rem; }
.hgr-product__ask p { font-size: .9rem; margin: 0 0 1rem; }
.hgr-product__body > p:first-child { font-size: 1.25rem; line-height: 1.55; color: var(--c-forest); }
@media (max-width: 860px) { .hgr-product { grid-template-columns: 1fr; } .hgr-product__media { position: static; } }

/* ==========================================================================
   Formularios (Contact Form 7)
   ========================================================================== */

.wpcf7-form { display: grid; gap: 1.1rem; }
.wpcf7-form .hgr-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
@media (max-width: 640px) { .wpcf7-form .hgr-row { grid-template-columns: 1fr; } }
.wpcf7-form p { margin: 0; }
.wpcf7-form label { display: block; font-weight: 600; font-size: .9rem; color: var(--c-forest); }
.wpcf7-form .hgr-req { color: var(--c-accent-dark); }
.wpcf7-form input[type="text"], .wpcf7-form input[type="email"], .wpcf7-form input[type="tel"], .wpcf7-form input[type="number"], .wpcf7-form select, .wpcf7-form textarea {
	display: block;
	width: 100%;
	margin-top: .4rem;
	padding: .75rem .9rem;
	font: inherit;
	font-weight: 400;
	color: var(--c-ink);
	background: var(--c-base);
	border: 1px solid var(--c-line);
	border-radius: var(--radius-s);
	transition: border-color .2s, box-shadow .2s, background .2s;
}
.wpcf7-form textarea { min-height: 8rem; resize: vertical; }
.wpcf7-form input:focus, .wpcf7-form select:focus, .wpcf7-form textarea:focus { outline: none; background: #fff; border-color: var(--c-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-accent) 25%, transparent); }
.wpcf7-form .hgr-quiz .wpcf7-quiz-label { display: block; margin-top: .35rem; font-weight: 400; color: var(--c-muted); }
.wpcf7-form .wpcf7-radio { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.wpcf7-form .wpcf7-radio .wpcf7-list-item { margin: 0; }
.wpcf7-form .wpcf7-radio label { font-weight: 500; display: inline-flex; gap: .45rem; align-items: center; padding: .5rem .9rem; border: 1px solid var(--c-line); border-radius: 999px; cursor: pointer; background: var(--c-base); }
.wpcf7-form .wpcf7-radio label:has(input:checked) { border-color: var(--c-accent); background: color-mix(in srgb, var(--c-accent) 15%, white); }
.wpcf7-form .wpcf7-acceptance label { font-weight: 400; display: flex; gap: .6rem; align-items: flex-start; }
.wpcf7-form .wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.wpcf7-form .wpcf7-acceptance input { margin-top: .3rem; accent-color: var(--c-accent-dark); }
.wpcf7-form .hgr-legal { font-size: .8rem; color: var(--c-muted); line-height: 1.5; }
.wpcf7-form .wpcf7-submit { justify-self: start; font-family: var(--f-heading); font-weight: 600; font-size: 1rem; padding: .9rem 1.8rem; border: 0; border-radius: 999px; background: var(--c-accent); color: var(--c-forest); cursor: pointer; transition: background .2s, color .2s; }
.wpcf7-form .wpcf7-submit:hover { background: var(--c-forest); color: #fff; }
.wpcf7-not-valid-tip { font-size: .82rem; margin-top: .3rem; }
.wpcf7 form .wpcf7-response-output { margin: 0; border-radius: var(--radius-s); padding: .8rem 1rem; }
.pb-form.is-boxed { box-shadow: var(--shadow); }
.pb-form__title { font-size: 1.25rem; }

/* ==========================================================================
   Pumpún Builder con la piel de García Rocha
   ========================================================================== */

.pb-row.has-bg-color:not(.is-text-light) { color: var(--c-ink); }
.pb-heading.is-display { color: #fff; }
.pb-row:not(.is-text-light) .pb-heading.is-display { color: var(--c-forest); }
.is-text-light .pb-text { color: rgba(245, 241, 234, .85); }

/* Banda de título de las páginas hechas con el constructor (misma que .hgr-page-hero) */
.hgr-page-hero-row { overflow: hidden; }
.hgr-page-hero-row::after { content: ""; position: absolute; right: -6rem; top: 50%; width: 26rem; height: 26rem; transform: translateY(-50%); background: url("assets/img/mark.png") center / contain no-repeat; opacity: .06; pointer-events: none; z-index: -1; }
.hgr-page-hero-row h1 { margin: 0; color: #fff; }
.hgr-page-hero-row .pb-text.is-lead { max-width: 44rem; }

/* Formulario en tarjeta blanca dentro de una fila oscura */
.is-text-light .pb-form.is-boxed { color: var(--c-ink); }
.is-text-light .pb-form.is-boxed :is(h2, h3, h4) { color: var(--c-forest); }

/* Ayuda destacada (portada) */
.hgr-aid-feature .pb-image img { box-shadow: var(--shadow); border-radius: var(--radius-s); }
.hgr-aid-feature .pb-list.is-check li { grid-template-columns: 11rem 1fr; column-gap: 1rem; padding: .55rem 0 .55rem 1.75rem; border-bottom: 1px solid var(--c-line); }
.hgr-aid-feature .pb-list.is-check strong { color: var(--c-forest); font-weight: 600; }
@media (max-width: 560px) { .hgr-aid-feature .pb-list.is-check li { grid-template-columns: 1fr; } }

/* Degradados en el verde bosque de la marca */
.pb-overlay--gradient::before { background: linear-gradient(100deg, rgba(24,38,29,.95) 0%, rgba(24,38,29,.75) 45%, rgba(24,38,29,.25) 100%); }
.pb-overlay--dark::before { background: rgba(24,38,29,.7); }
.pb-overlay--darker::before { background: rgba(24,38,29,.82); }

.pb-btn.is-outline { color: var(--c-forest); }

/* Cifras sobre fondo oscuro */
.pb-stats > div { border-left-color: var(--c-accent); }
.is-text-light .pb-stats dt { color: #fff; }
.is-text-light .pb-stats dd { color: rgba(245, 241, 234, .7); opacity: 1; }

/* Tarjetas de actividad */
.pb-cards.is-numbered .pb-card::before, .pb-cards.is-overlay .pb-card::before { background: linear-gradient(180deg, rgba(24,38,29,0) 25%, rgba(24,38,29,.92) 80%); }
.pb-cards.is-numbered .pb-card { min-height: 440px; }
.pb-cards:is(.is-overlay, .is-numbered) .pb-card__body { padding: 1.5rem; }
.pb-cards:is(.is-overlay, .is-numbered) .pb-card__title { font-size: 1.4rem; margin-bottom: .5rem; }
.pb-cards:is(.is-overlay, .is-numbered) a.pb-card .pb-card__title::after { content: " →"; color: var(--c-accent); display: inline-block; transition: transform .2s var(--ease); }
.pb-cards:is(.is-overlay, .is-numbered) a.pb-card:hover .pb-card__title::after { transform: translateX(4px); }
.pb-cards:is(.is-overlay, .is-numbered) .pb-card__text { font-size: .93rem; line-height: 1.5; color: rgba(255,255,255,.82); }
.pb-cards.is-plain .pb-card { transition: transform .25s var(--ease), box-shadow .25s; }
.pb-cards.is-plain a.pb-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
@media (max-width: 600px) { .pb-cards.is-numbered .pb-card { min-height: 320px; } }

/* Pasos sobre fondo oscuro */
.is-text-light .pb-list.is-steps li { background: rgba(245, 241, 234, .07); border-color: rgba(245, 241, 234, .12); }
.is-text-light .pb-list.is-steps strong { color: #fff; font-family: var(--f-heading); }
.is-text-light .pb-list.is-steps span { font-size: .9rem; color: rgba(245, 241, 234, .7); }
.pb-list.is-cards li { color: var(--c-ink); }
.pb-list.is-timeline strong { color: var(--c-forest); }
.pb-list.is-timeline li::before { box-shadow: 0 0 0 4px var(--c-base); }

.pb-downloads a { font-weight: 600; color: var(--c-forest); }
.pb-el--image.hgr-historia img { max-width: 420px; margin-inline: auto; filter: drop-shadow(0 18px 30px rgba(24,38,29,.25)); border-radius: 0; }
.pb-el--image.hgr-historia figcaption { text-align: center; }

/* Carteles de ayudas: cada columna, tarjeta blanca */
.hgr-aid .pb-col { background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius); padding: clamp(1.25rem, 3vw, 2rem); }
.hgr-aid .pb-heading { font-size: 1.25rem; }
.hgr-aid .pb-image img { width: auto; max-width: 100%; margin-inline: auto; }

/* ==========================================================================
   Pie
   ========================================================================== */

.hgr-footer { background: var(--c-forest); color: rgba(245, 241, 234, .72); font-size: .95rem; padding-block: clamp(3.5rem, 7vw, 6rem) 1.5rem; }
.hgr-footer a { color: rgba(245, 241, 234, .85); text-decoration: none; }
.hgr-footer a:hover { color: var(--c-accent); }
.hgr-footer p { margin: 0 0 1rem; }
.hgr-footer__cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); }
@media (max-width: 900px) { .hgr-footer__cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .hgr-footer__cols { grid-template-columns: 1fr; } }
.hgr-logo--footer img { width: 210px; opacity: .95; }
.hgr-footer__about { max-width: 22rem; margin-top: 1.5rem !important; }
.hgr-footer__title { color: #fff; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 1rem; }
.hgr-footer__links { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.hgr-footer__funding { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: clamp(2.5rem, 5vw, 4rem); padding-top: 2rem; border-top: 1px solid rgba(245, 241, 234, .12); }
.hgr-footer__funding a { display: inline-flex; flex-wrap: wrap; gap: 1.75rem; align-items: center; padding: 1rem 1.5rem; background: #fff; border-radius: var(--radius-s); }
.hgr-footer__funding img { height: 80px; width: auto; }
@media (max-width: 600px) { .hgr-footer__funding a { gap: 1.1rem; } .hgr-footer__funding img { height: 56px; } }
.hgr-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 2rem; margin-top: 1.5rem; font-size: .875rem; }
.hgr-footer__bottom p { margin: 0; opacity: .7; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   Animaciones y transiciones
   Solo con html.js-anim (JavaScript activo y sin "reducir movimiento").
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* Barra de progreso de lectura */
.hgr-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 100; pointer-events: none; transform-origin: 0 50%; transform: scaleX(var(--p, 0)); background: linear-gradient(90deg, var(--c-accent), var(--c-accent-dark)); }
.admin-bar .hgr-progress { top: 32px; }

/* Cabecera que se compacta al bajar */
.hgr-site-header { transition: box-shadow .25s var(--ease), transform .35s var(--ease); }
.hgr-header__inner { transition: min-height .35s var(--ease); }
.hgr-logo img { transition: width .35s var(--ease); }
@media (min-width: 782px) {
	/* Se desplaza la cabecera entera: con margin-top negativo la barra no se oculta (el margen se solapa) */
	.hgr-site-header.is-scrolled { transform: translateY(-2.25rem); }
	.hgr-site-header.is-scrolled .hgr-header__inner { min-height: 62px; }
	.hgr-site-header.is-scrolled .hgr-logo img { width: clamp(150px, 15vw, 190px); }
}

/* Aparición al entrar en pantalla */
.js-anim [data-anim] {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition: opacity .8s var(--ease), transform .9s var(--ease);
	transition-delay: calc(var(--d, 0) * 90ms);
	will-change: opacity, transform;
}
.js-anim [data-anim="fade"] { transform: none; }
.js-anim [data-anim="zoom"] { transform: scale(.94); }
.js-anim [data-anim="left"] { transform: translate3d(-36px, 0, 0); }
.js-anim [data-anim="right"] { transform: translate3d(36px, 0, 0); }
.js-anim [data-anim].is-inview { opacity: 1; transform: none; }

/* Hero: zoom lento de la foto */
.js-anim .hgr-hero .pb-row__bg { animation: hgr-hero-zoom 2.6s var(--ease) both; }
@keyframes hgr-hero-zoom { from { transform: scale(1.12); } to { transform: scale(1); } }
.js-anim .hgr-hero.has-overlay::before { animation: hgr-fade-in 1.2s ease both; }
@keyframes hgr-fade-in { from { opacity: 0; } to { opacity: 1; } }

/* La línea de los antetítulos se dibuja */
.js-anim .pb-heading.is-eyebrow[data-anim]::before,
.js-anim [data-anim] .pb-heading.is-eyebrow::before { width: 0; transition: width .7s var(--ease) .35s; }
.js-anim .pb-heading.is-eyebrow[data-anim].is-inview::before,
.js-anim [data-anim].is-inview .pb-heading.is-eyebrow::before { width: 1.75rem; }

/* Foto redonda del taller: entra girando */
.js-anim .hgr-photo-stack__old { opacity: 0; transform: scale(.6) rotate(-12deg); transition: opacity .8s var(--ease) .45s, transform 1s cubic-bezier(.34, 1.4, .64, 1) .45s; }
.js-anim .is-inview .hgr-photo-stack__old { opacity: 1; transform: none; }

/* Cifras: el número se cuenta; evita saltos de ancho */
.pb-stats dt { font-variant-numeric: tabular-nums; }

/* Transiciones suaves en tarjetas y enlaces */
.hgr-certs a, .pb-downloads a, .pb-gallery a img, .pb-list.is-cards li { transition: transform .3s var(--ease), box-shadow .3s, border-color .2s; }
.pb-gallery a { display: block; overflow: hidden; border-radius: calc(var(--radius) * .66); }
.pb-gallery a:hover img { transform: scale(1.04); }
.pb-list.is-cards li:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.pb-downloads a:hover { transform: translateX(3px); }
.hgr-aid-feature .pb-image a { display: block; transition: transform .4s var(--ease); }
.hgr-aid-feature .pb-image a:hover { transform: translateY(-4px) rotate(-.4deg); }
.pb-btn.is-primary, .pb-btn.is-dark, .hgr-btn { position: relative; overflow: hidden; }
.pb-btn.is-primary::after, .pb-btn.is-dark::after, .hgr-btn::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
	transform: translateX(-120%);
	transition: transform .7s var(--ease);
	pointer-events: none;
}
.pb-btn.is-primary:hover::after, .pb-btn.is-dark:hover::after, .hgr-btn:hover::after { transform: translateX(120%); }

@media (prefers-reduced-motion: reduce) {
	.hgr-progress { display: none; }
}

/* ==========================================================================
   Sección «Ayudas recibidas» (portada)
   Carteles de proporciones distintas: todos en la misma tarjeta, enteros y
   centrados; la última fila se centra en vez de quedar coja.
   ========================================================================== */

#ayudas .pb-col { gap: clamp(1.5rem, 3vw, 2.25rem); }

#ayudas .pb-gallery {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.25rem;
	--cols: 4;
}
#ayudas .pb-gallery > a {
	flex: 0 0 calc((100% - (var(--cols) - 1) * 1.25rem) / var(--cols));
	aspect-ratio: 10 / 7;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: .85rem;
	background: #fff;
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
	overflow: hidden;
	transition: transform .3s var(--ease), box-shadow .3s, border-color .2s;
}
#ayudas .pb-gallery > a:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--c-accent); }
#ayudas .pb-gallery > a img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	border-radius: 4px;
	transform: none !important; /* sin el zoom general de las galerías: el cartel debe verse entero */
}
@media (max-width: 1000px) { #ayudas .pb-gallery { --cols: 3; } }
@media (max-width: 640px) { #ayudas .pb-gallery { --cols: 2; gap: .75rem; } #ayudas .pb-gallery > a { padding: .5rem; } }

/* Descarga del cartel: tarjeta a juego, centrada bajo la galería */
#ayudas .pb-downloads { max-width: 760px; margin-inline: auto; width: 100%; }
#ayudas .pb-downloads a { padding: 1.1rem 5rem 1.1rem 1.25rem; border-radius: var(--radius); background: var(--c-forest); border-color: var(--c-forest); color: #fff; }
#ayudas .pb-downloads a strong { color: #fff; }
#ayudas .pb-downloads a span { color: rgba(245, 241, 234, .7); }
#ayudas .pb-downloads a::after { color: var(--c-accent); top: 50%; transform: translateY(-50%); }
#ayudas .pb-downloads a:hover { background: var(--c-forest-2); }

/* Programas (RE-ACCIONA, Fábrica 4.0): dos columnas iguales a todo el ancho */
#ayudas .pb-list.is-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
#ayudas .pb-list.is-cards li { padding: 1.5rem 1.6rem; }
#ayudas .pb-list.is-cards strong { font-family: var(--f-heading); font-size: 1.1rem; color: var(--c-forest); margin-bottom: .35rem; display: block; }
#ayudas .pb-list.is-cards span { font-size: .93rem; color: var(--c-muted); line-height: 1.55; }
@media (max-width: 700px) { #ayudas .pb-list.is-cards { grid-template-columns: 1fr; } }