/*!
Theme Name: Palo Artesanos - Theme
Theme URI: https://victorcuenca.design/
Author: Victor Cuenca
Author URI: https://victorcuenca.design/
Description: Description
Version: 1.2.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: palo-artesanos-theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Palo Artesanos - Theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	/*margin-bottom: 1.5em;*/
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */

/*a {
	color: #4169e1;
}

a:visited {
	color: #800080;
}

a:hover,
a:focus,
a:active {
	color: #191970;
}
*/

a {
	color: inherit;
	text-decoration: none;
}

a:focus {
	outline: thin dotted;
	outline: none;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus-visible {
	background-color: #f1f1f1;
	border-radius: 0px;
	clip: auto !important;
	clip-path: none;
	color: var(--color-primary);
	display: block;
	font-size: var(--font-size-body);
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: var(--line-height-flat);
	padding: var(--btn-padding-y) var(--btn-padding-y);
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

/* Global parallax: máscara + capa 120% + imagen (reference/global parallax setup).
 * - .parallax-mask: recorte; debe tener tamaño (p. ej. .parallax-mask--ratio-*).
 * - .parallax-layer: capa absoluta 120% + data-parallax="trigger" (sin target = anima la capa).
 * - .parallax-media: img object-fit cover dentro de la capa. */
.parallax-mask {
	position: relative;
	overflow: hidden;
}

.parallax-mask .parallax-target {
	position: absolute;
	z-index: 0;
	left: 0;
	top: -10%;
	width: 100%;
	height: 120%;
}

.parallax-media {
	display: block;
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}

[data-parallax="trigger"], [data-parallax="target"] {
	will-change: transform;
  }
/* Ratios opcionales para la máscara (elige una clase por bloque; sin esto la altura colapsa). */
.aspect-ratio-1-1 {
	aspect-ratio: 1 / 1;
}

.aspect-ratio-4-3 {
	aspect-ratio: 4 / 3;
}

.aspect-ratio-3-4 {
	aspect-ratio: 3 / 4;
}

.aspect-ratio-4-5 {
	aspect-ratio: 4 / 5;
}

.aspect-ratio-3-2 {
	aspect-ratio: 3 / 2;
}

.aspect-ratio-2-3 {
	aspect-ratio: 2 / 3;
}

.aspect-ratio-9-16 {
	aspect-ratio: 9 / 16;
}

.aspect-ratio-16-9 {
	aspect-ratio: 16 / 9;
}

/* SplitText scroll reveal: FOUC (reference/split-text). Mismos roles que en main.js. */
[data-split='paragraph'],
[data-split='heading-1'],
[data-split='heading-2'],
[data-split-underline-reveal],
[data-hero-reveal="bar"],
[data-hero-reveal="btn-bg"]
/*header > .site-header__inner li,
.header-logo,
.header-nav--secondary .header-lang-switcher*/ {
	visibility: hidden;
}

/*@media (prefers-reduced-motion: reduce) {
[data-split='paragraph'],
[data-split='heading-1'],
[data-split='heading-2'],
[data-split-underline-reveal],
[data-hero-reveal="bar"],
[data-hero-reveal="btn-bg"] {
	visibility: visible;
}
}*/

.palo-preloader-active header > .site-header__inner li,
.palo-preloader-active .header-logo,
.palo-preloader-active .header-nav--secondary .header-lang-switcher,
.palo-preloader-active .bold-nav-full__hamburger {
	visibility: hidden;
}

html[lang="es-ES"] .heading-split-fix-aviso[data-split='heading-2'][aria-label="Aviso Legal"]  .line-mask .line .word:first-of-type .letter:first-of-type{
	margin-right: -0.15em !important;
}

html[lang="es-ES"] .heading-split-fix-aviso[data-split='heading-2'][aria-label="Política de privacidad"]  .line-mask .line .word:nth-of-type(3) .letter:nth-of-type(4){
	margin-right: -0.15em !important;
}

@media (max-width: 768px) {

	html[lang="es-ES"] .heading-split-fix-aviso[data-split='heading-2'][aria-label="Política de privacidad"]  .line-mask:nth-of-type(2) .line .word .letter:nth-of-type(4){
		margin-right: -0.15em !important;
	}
}

[data-split='heading-1'] .line-mask,
[data-split='heading-2'] .line-mask {
	padding-top: 0.2em;   
	margin-top: -0.2em;
}

[data-split="paragraph"] .line-mask {
	padding-bottom: 0.1em;
	margin-bottom: -0.1em;
}


/*[data-split='heading-1'] .line-mask:first-child,
[data-split='heading-2'] .line-mask:first-child {
   margin-top: 0em;
}*/

/* Comienzo de CSS custom */

/* Tipografías: subir .woff2 y .woff a assets/fonts/ (nombres indicados abajo).
   Para reducir flickering, preload en header: <link rel="preload" href=".../lfs-adelia-regular.woff2" as="font" type="font/woff2" crossorigin> (y lo mismo para arizona-flare). */
@font-face {
	font-family: "LFS Adelia";
	src: url("assets/fonts/LFSAdelia-Regular.woff2") format("woff2"),
	     url("assets/fonts/LFSAdelia-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "ABC Arizona Flare";
	src: url("assets/fonts/ABCArizonaFlare-Regular.woff2") format("woff2"),
	     url("assets/fonts/ABCArizonaFlare-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* Variables CSS */
:root {
	/* Colores principales */
	--color-primary: #1A1511;
	--color-secondary: #FAF2E6;
	/* RGB del primario para fondos con transparencia (ej. glass, lightbox) */
	--color-primary-rgb: 26, 21, 17;
	--color-secondary-rgb: 250, 242, 230;

	/* Familias (fallback: Adelia → serif, Arizona → sans-serif) */
	--font-heading: "LFS Adelia", Georgia, "Times New Roman", serif;
	--font-body: "ABC Arizona Flare", "Helvetica Neue", Arial, sans-serif;

	/* Base: 1rem = 16px (dejar html por defecto) */
	--font-size-body: clamp(0.875rem, 0.75rem + 0.2083vw, 1.125rem); /* 14px → ~16px@1440 → 18px */
	--line-height-body: 1.25; /* 1.05 */
	--line-height-tight: 0.7; /* 0.7 */
	--line-height-flat: 1;
	--letter-spacing-body: -0.01em;
	--letter-spacing-heading: -0.02em;
	--letter-spacing-display: -0.05em;
	--font-kerning: normal;
	--font-text-rendering: optimizeSpeed;

	/* Headings: clamp(móvil, preferido + vw, máx) */
	--font-size-h1: clamp(1.75rem, 1.5rem + 0.5vw, 2.25rem);   /* 28px → 36px */
	--font-size-h2: clamp(1.75rem, 1.5rem + 0.5vw, 2.25rem);   /* mismo que h1 si comparten estilo */
	--font-size-h3: clamp(4rem, 3rem + 5.5vw, 9rem);          /* 64px → 128px  OG: clamp(3rem, 4rem + 4vw, 8rem);)  */
	--font-weight-heading: normal;

	/* Botones */
	--btn-padding-y: 12px;
	--btn-padding-x: 24px;

	/* Escala de espaciado (valores fijos; usar en margins, paddings, gaps) */
	--space-xs: 12px;
	--space-s: 24px;
	--space-m: 48px;
	--space-l: 80px;
	--space-xl: 120px;
	--space-xxl: 160px;
	--space-xxxl: 200px;
	--space-240: 240px;

	/* Gaps de grid: semánticos (row-gap-s/m/l). column-gap se sobrescribe en media query para responsive */
	--column-gap: var(--space-s);
	--row-gap-xs: var(--space-xs);
	--row-gap-s: var(--space-s);
	--row-gap-m: var(--space-m);
	--row-gap-l: var(--space-l);
	--row-gap-xl: var(--space-xl);
	/* Alias por contexto (opcional) */
	--row-gap-list: var(--row-gap-s);
	--row-gap-block: var(--row-gap-l);

	/* Paddings de sección (xs…xxl) */
	--section-padding-xs: 40px;
	--section-padding-s: 80px;
	--section-padding-m: 120px;
	--section-padding-l: 160px;
	--section-padding-xl: 180px;
	--section-padding-xxl: 200px;
	--section-padding-xxxl: 240px;

	/* Contenedor: padding lateral (responsive vía media query si quieres) */
	--content-padding: var(--space-s);

	--content-max-width: 100%;

	/* Transiciones de color: mismo ease para homogeneidad (header, barra con tile activo, etc.). */
	--ease-color: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Responsive: menos column-gap (y opcionalmente content-padding) en móvil */
@media (max-width: 768px) {
	:root {
		/* Gaps de grid: semánticos (row-gap-s/m/l).*/
		--column-gap: var(--space-xs);

		/* Contenedor: padding lateral (responsive vía media query si quieres) */
		--content-padding: var(--space-xs);
	}
}
/* Ajustes generales */

main {
	min-height: calc(100svh);
}

html {
	background-color: var(--color-secondary);
}

.oculto {
	display: none;
}

/* Base tipográfica */

body {
	background-color: var(--color-secondary);
	color: var(--color-primary);
	font-family: var(--font-body);
	font-size: var(--font-size-body);
	line-height: var(--line-height-body);
	letter-spacing: var(--letter-spacing-body);
	font-kerning: var(--font-kerning);
	text-rendering: var(--font-text-rendering);
}
h1, h2 {
	font-family: var(--font-heading);
	font-weight: var(--font-weight-heading);
	font-size: var(--font-size-h1);
	line-height: var(--line-height-tight);
	letter-spacing: var(--letter-spacing-heading);
	text-transform: uppercase;
	font-kerning: var(--font-kerning);
	text-rendering: var(--font-text-rendering);
}
h3 {
	font-family: var(--font-heading);
	font-weight: var(--font-weight-heading);
	font-size: var(--font-size-h3);
	line-height: var(--line-height-tight);
	letter-spacing: var(--letter-spacing-display);
	text-transform: uppercase;
	font-kerning: var(--font-kerning);
	text-rendering: var(--font-text-rendering);
}
h4,h5 {
	font-family: var(--font-body);
	font-size: var(--font-size-body);
	line-height: var(--line-height-body);
	letter-spacing: var(--letter-spacing-body);
	font-weight: var(--font-weight-heading);
	text-transform: uppercase;
	font-kerning: var(--font-kerning);
	text-rendering: var(--font-text-rendering);	
}
/* Botones (tamaño body, line-height 1) */
button,
.btn,
input[type="submit"] {
	font-size: var(--font-size-body);
	line-height: var(--line-height-flat);
	padding: var(--btn-padding-y) var(--btn-padding-x);
}

/* Ocultar scrollbar */
::-webkit-scrollbar {
	display: none;
}
body {
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
	min-height: 100%;
}

/* Header: contenedor full width. Color secundario por defecto; al hacer scroll pasa a primario. */
.site-header {
	color: var(--color-primary);
	transition: color var(--ease-color), transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	line-height: var(--line-height-flat);
}

/*[data-scrolling-started="false"] .site-header {
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}*/

[data-scrolling-started="false"].page:not(.page-template-template-contact):not(.page-template-template-legal) .site-header {
    color: var(--color-secondary);
}

/* Enlaces del header: no usar estilos globales de a/a:visited; heredar color del header. */
.site-header a,
.site-header a:visited {
	color: inherit;
}

/* Scrolled: elementos del header en color primario */
/*html body[data-scrolling-started="true"][data-scrolling-direction="up"] #masthead.site-header {
	color: var(--color-primary);
}*/

[data-scrolling-direction="up"] .site-header {
	color: var(--color-primary);
	color: inherit;
}


/*.page:not(.page-template-template-contact):not(.page-template-template-legal)[data-scrolling-started="true"] .site-header {
	color: var(--color-primary);
}*/

/* Scroll down: ocultar header (sube fuera de vista) */
/*[data-scrolling-started="false"][data-scrolling-direction="up"] .site-header {
	transform: translateY(-100%);
}*/


/* Scroll down: ocultar header (sube fuera de vista) */
[data-scrolling-started="true"][data-scrolling-direction="down"] .site-header {
	transform: translateY(-100%);
}

/* Tile activo: barra (logo + hamburger) en secundario para el overlay. */
[data-navigation-status="active"] .site-header__inner {
	color: var(--color-secondary);
}

.site-header__inner {
	color: inherit;
	transition: color var(--ease-color);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
  /* mantén max-width, margin, padding como ya los tienes */
  max-width: var(--content-max-width);
  margin-inline: auto;
  /*padding-inline: var(--content-padding);*/
  padding: var(--content-padding);
  min-height: 90px; /*Placeholder*/
}
  
  /* Bloque 1: menú principal (izq).
  Con menú asignado: ul.header-nav__menu.
  Sin asignar (wp_page_menu): div.header-nav__menu > ul */

  .header-nav--primary ul.header-nav__menu,
  .header-nav--primary .header-nav__menu > ul {
	display: flex;
	gap: var(--column-gap);
	list-style: none;
	margin: 0;
	padding: 0;
  }
  
  .header-nav--primary ul.header-nav__menu a,
  .header-nav--primary .header-nav__menu > ul a {
	text-decoration: none;
  }
  
  /* Bloque 2: logo (centro). Color por herencia desde .site-header. */
  .header-logo__link,
  .header-logo__link:visited,
  .header-logo .custom-logo-link,
  .header-logo .custom-logo-link:visited {
	display: block;
	text-decoration: none;
	transition: opacity var(--ease-color);
	overflow: hidden;
	will-change: opacity;
	-webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  .header-logo__link:hover {
	opacity: 0.85;
  }

  .header-logo__svg {
	display: block;
	line-height: 0;
  }

  .header-logo__svg svg {
	display: block;
	width: auto;
	height: auto;
	fill: currentColor;
	overflow: visible;
  }

  .header-logo__svg--desktop svg {
	height: 35px;
	max-width: none;
  }

  .header-logo__svg--mobile svg {
	height: 70px;
  }

  .header-logo__svg--desktop {
	display: block;
	overflow: visible;
  }

  .header-logo__svg--mobile {
	display: none;
  }

  .header-logo .custom-logo {
	height: 35px;
	width: auto;
	object-fit: contain;
  }

  .header-logo__text {
	font-weight: bold;
  }
  
  /* Bloque 3: utility (derecha) - menú + hamburger */
  .header-nav--secondary {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 1rem;
  }
  
  .header-nav--secondary ul.header-nav__menu,
  .header-nav--secondary .header-nav__menu > ul {
	display: flex;
	gap: var(--column-gap);
	list-style: none;
	margin: 0;
	padding: 0;
  }
  
  .header-nav--secondary ul.header-nav__menu a,
  .header-nav--secondary .header-nav__menu > ul a {
	text-decoration: none;
  }
  
  /* Hamburger: oculto en desktop, en la barra (header-nav--secondary) */
  .header-nav--secondary .bold-nav-full__hamburger {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0.5rem;
  }

  /* Móvil: ocultar menú principal desktop, mostrar hamburger */
  @media (max-width: 768px) {

	.site-header__inner {
		grid-template-columns: 1fr auto 1fr; 
		padding-top: var(--space-s);
		padding-bottom: var(--space-s);
	}
		/* Logo siempre en la columna central; en móvil mostrar isotipo, ocultar logotipo */
	.header-logo {
		z-index: 110;
		grid-column: 2;
	}

	.header-logo__svg--desktop {
		display: none;
	}

	.header-logo__svg--mobile {
		display: block;
	}
	/* Menú móvil siempre en la columna derecha */
	.header-nav--secondary {
		grid-column: 3;
	}
	

	.header-nav--primary {
	  display: none;
	}
  
	.header-nav--secondary .header-nav__menu {
	  display: none; /* Contact en desktop; en móvil va dentro del drawer */
	}

	.header-nav--secondary ul.header-nav__menu,
  	.header-nav--secondary .header-nav__menu > ul {
    display: none;  /* Especificidad por el fallback para wp_nav_menu móvil */
  	}

	.header-nav--secondary > .header-lang-switcher {
		display: none;
	}
  
	.header-nav--secondary .bold-nav-full__hamburger {
	  display: flex;
	}
  }

/*--------------------------------------------------------------
# Hamburger fullscreen (bold-nav-full)
--------------------------------------------------------------*/
/* Wrapper del overlay: hermano de .site-header__inner (como en referencia). 100vw/100vh para que el tile ocupe toda la pantalla. */
.bold-nav-full {
	z-index: 100;
	pointer-events: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	min-height: calc(var(--vh)*100);
}

/* Bloquear scroll cuando el menú tile está abierto (sin clase en body; :has() con data-navigation-status). */
body:has([data-navigation-status="active"]) {
	overflow: hidden;
}

.bold-nav-full__logo {
	pointer-events: auto;
	justify-content: center;
	align-items: center;
	width: 8em;
	height: 2em;
	display: flex;
}

/* Hamburger: 2 barras (referencia hamburger-2-bars). z-index por encima del tile (100) para poder cerrar al abrir. */
.bold-nav-full__hamburger {
	position: relative;
	z-index: 110;
	color: inherit;
	pointer-events: auto;
	cursor: pointer;
	background-color: transparent;
	justify-content: center;
	align-items: center;
	/*align-items: flex-start; /*Placeholder*/
	/*margin-top: -0.15em; /*Placeholder*/
	margin-top: calc(-1 * (0.5rem + 4px)); /*Placeholder*/
	width: 2.5em;
	height: 2.5em;
	padding: 0;
	display: flex;
	position: relative;
	border: none;
}

.bold-nav-full__hamburger .bold-nav-full__hamburger-bar {
	background-color: currentColor;
	width: 1.875em;
	width: 32px; /*Placeholder*/
	height: 0.125em;
	position: absolute;
	transition: transform 0.6s cubic-bezier(0.65, 0, 0, 1);
	transform: translateY(-0.25em) rotate(0.001deg);
}

.bold-nav-full__hamburger .bold-nav-full__hamburger-bar:nth-child(2) {
	transform: translateY(0.15em) rotate(0.001deg);
}

.bold-nav-full__hamburger:hover .bold-nav-full__hamburger-bar:nth-child(1) {
	transform: translateY(0.25em) rotate(0.001deg);
}

.bold-nav-full__hamburger:hover .bold-nav-full__hamburger-bar:nth-child(2) {
	transform: translateY(-0.15em) rotate(0.001deg); 
}

[data-navigation-status="active"] .bold-nav-full__hamburger .bold-nav-full__hamburger-bar:nth-child(1) {
	transform: translateY(5px) rotate(45deg);
}

[data-navigation-status="active"] .bold-nav-full__hamburger .bold-nav-full__hamburger-bar:nth-child(2) {
	transform: translateY(5px) rotate(-45deg);
}

/* Contenido del overlay siempre en color secundario (hereda todo lo del tile). Enlaces sin estilos globales a:visited. */
.bold-nav-full__tile a,
.bold-nav-full__tile a:visited {
	color: inherit;
}

.bold-nav-full__tile {
	color: var(--color-secondary);
	pointer-events: auto;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	display: flex;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: clip-path 1s cubic-bezier(0.9, 0, 0.1, 1);
	clip-path: polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%);
}

.safari-bar-tint-fix-top {
    position: fixed;
	opacity: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 6px;
    background-color: var(--color-secondary);
}

.safari-bar-tint-fix-bottom {
    position: fixed;
	opacity: 1;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 6px;
    background-color: var(--color-secondary);
}

/* Atributo en .site-header*/
[data-navigation-status="active"] .bold-nav-full .bold-nav-full__tile {
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}

/* Panel tipo “glass”: fondo con color primario al 20% + blur del contenido detrás (Figma: fill 20%, background blur uniform 100). Reutilizable en menú móvil y lightbox. */
.glass-panel {
	background-color: rgba(var(--color-primary-rgb), 0.6);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}

.page.page-template-template-contact .glass-panel {
	background-color: rgba(var(--color-primary-rgb), 0.8);
}

.bold-nav-full__ul {
	flex-flow: column;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	row-gap: var(--row-gap-m);

}

/* FULL FALLBACK wp_nav_menu móvil (sin menú asignado -> wp_page_menu).
   Estructura diferente: #mobile-menu-list > .bold-nav-full__ul > ul > li.page_item */
#mobile-menu-list:has(> .bold-nav-full__ul) {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
}

#mobile-menu-list > .bold-nav-full__ul {
	margin: 0;
	padding: 0;
	width: 100%;
}

#mobile-menu-list > .bold-nav-full__ul > ul {
	flex-flow: column;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	row-gap: var(--row-gap-m);
	width: 100%;
}

/* Items menú móvil + FALLBACK:
   - Con menú asignado: .bold-nav-full__ul .menu-item
   - Sin menú móvil asignado (wp_page_menu): #mobile-menu-list > .bold-nav-full__ul > ul > .page_item
*/
.bold-nav-full__ul .menu-item,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item {
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;
	text-decoration: none;
	display: flex;
	position: relative;
	overflow: hidden; /* Ocultar si quieres mostrar el underline*/
	transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
}

.bold-nav-full__ul .menu-item a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item a {
	font-family: var(--font-heading);
	font-size: var(--font-size-h1);
	line-height: var(--line-height-flat);
	font-weight: 400;
	letter-spacing: var(--letter-spacing-heading);
	padding-left: 0.075em;
	padding-right: 0.075em;
	padding-top: 0.1em;
	text-decoration: none;
	transform: translateY(100%) rotate(5deg);
	transition: transform 0.75s cubic-bezier(0.7, 0, 0.3, 1);
	text-transform: uppercase;
}

.bold-nav-full__ul .menu-item.current-menu-item a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item.current_page_item a {
	/*color: rgba(var(--color-secondary-rgb), 0.2);*/
}

.bold-nav-full__ul .menu-item:nth-child(1) a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(1) a { transition-delay: 0.2s; }
.bold-nav-full__ul .menu-item:nth-child(2) a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(2) a { transition-delay: 0.15s; }
.bold-nav-full__ul .menu-item:nth-child(3) a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(3) a { transition-delay: 0.1s; }
.bold-nav-full__ul .menu-item:nth-child(4) a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(4) a { transition-delay: 0.05s; }
.bold-nav-full__ul .menu-item:nth-child(5) a,
#mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(5) a { transition-delay: 0s; }

[data-navigation-status="active"] .bold-nav-full .bold-nav-full__ul .menu-item a,
[data-navigation-status="active"] .bold-nav-full #mobile-menu-list > .bold-nav-full__ul > ul > .page_item a {
	transform: translateY(0%) rotate(0.001deg);
	transition-delay: 0.3s;
}

[data-navigation-status="active"] .bold-nav-full .bold-nav-full__ul .menu-item:nth-child(1) a,
[data-navigation-status="active"] .bold-nav-full #mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(1) a { transition-delay: 0.3s; }
[data-navigation-status="active"] .bold-nav-full .bold-nav-full__ul .menu-item:nth-child(2) a,
[data-navigation-status="active"] .bold-nav-full #mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(2) a { transition-delay: 0.35s; }
[data-navigation-status="active"] .bold-nav-full .bold-nav-full__ul .menu-item:nth-child(3) a,
[data-navigation-status="active"] .bold-nav-full #mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(3) a { transition-delay: 0.4s; }
[data-navigation-status="active"] .bold-nav-full .bold-nav-full__ul .menu-item:nth-child(4) a,
[data-navigation-status="active"] .bold-nav-full #mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(4) a { transition-delay: 0.45s; }
[data-navigation-status="active"] .bold-nav-full .bold-nav-full__ul .menu-item:nth-child(5) a,
[data-navigation-status="active"] .bold-nav-full #mobile-menu-list > .bold-nav-full__ul > ul > .page_item:nth-child(5) a { transition-delay: 0.5s; }

/* Hover: atenuar el resto, resaltar el item hover */
.bold-nav-full__ul:has(.menu-item:hover) .menu-item,
#mobile-menu-list > .bold-nav-full__ul > ul:has(.page_item:hover) .page_item {
	opacity: 0.15;
}

.bold-nav-full__ul:has(.menu-item:hover) .menu-item:hover,
#mobile-menu-list > .bold-nav-full__ul > ul:has(.page_item:hover) .page_item:hover {
	opacity: 1;
}

.bold-nav__bottom {
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding: var(--content-padding);
	padding-top: var(--space-s);
    padding-bottom: var(--space-s);
	/*padding-bottom: calc(var(--space-s) + env(safe-area-inset-bottom)); /* A ver si funciona */
	display: flex;
	position: absolute;
	bottom: 0;
	left: 0;
}

.bold-nav__bottom-left,
.bold-nav__bottom-right {
	margin: 0;
	font-size: 1.125em;
}

.bold-nav__bottom a{
	text-decoration: none;
	color: inherit;
}

.mobile-lang-switcher {
	margin-bottom: 0;
	position: relative;
}


/*--------------------------------------------------------------
# Barba.js — layout durante transición (boilerplate OSMO + WP)
El hook beforeEnter pone el <main> siguiente en position:fixed; al salir
del flujo, el [data-barba="wrapper"] puede quedar con altura ~0 y el
footer (hermano debajo en el DOM) sube visualmente. min-height reserva
hueco hasta que resetPage quite el fixed. El demo del curso no tiene
footer fuera del wrapper; en WP hace falta esta pieza.
--------------------------------------------------------------*/
/*[data-barba="wrapper"] {
	position: relative;
	z-index: 2;
	min-height: 100vh;
}

.site-footer {
	position: relative;
	z-index: 1;
}*/

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.site-footer {
	width: 100%;
}

.footer__inner {
	max-width: var(--content-max-width);
	margin-inline: auto;
	padding-inline: var(--content-padding);
	display: flex;
	flex-direction: column;
	row-gap: var(--space-240); /* MIRAR*/
	padding-top: var(--space-s);
}

/* Primera fila: grid 12 columnas desktop, 6 columnas tablet/móvil */
.footer__row--1 {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	column-gap: var(--column-gap);
	row-gap: var(--row-gap-m);
}

.footer__block {
	margin: 0;
}

.footer__credits > * , .footer__credits-2 > *{
	margin: 0;
}
.footer__credits, .footer__credits-2 {
	display:flex;
	flex-direction: column;
	row-gap: var(--row-gap-xs); /*Placeholder*/
}

.footer__credits {
	grid-column: span 3;
}

.footer__menu--1 {
	grid-column: span 2;
}

.footer__menu--2 {
	grid-column: span 2;
}

.footer__menu--3 {
	grid-column: span 2;
}

.footer__credits-2 {
	grid-column: span 3;
}

.footer__credits-2-line a {
	text-decoration: none;
	color: inherit;
}


.footer__nav-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	row-gap: var(--row-gap-xs);
}

.footer__nav-menu a {
	text-decoration: none;
	color: inherit;
}

/* Segunda fila: 1992 | logo | 2025. Desktop = logotipo, mobile = isotipo (control por CSS) */
.footer__row--2 {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: end;
	gap: var(--column-gap);
}

.footer__year--start {
	order: 1;
	justify-self: start;
}

.footer__logo {
	order: 2;
	flex-shrink: 0;
	overflow: visible;
}

.footer__logo-link,
.footer__logo-link:visited {
	display: block;
	color: var(--color-primary);
	text-decoration: none;
}

.footer__logo-svg {
	display: block;
	line-height: 0;
}

.footer__logo-svg svg {
	display: block;
	width: auto;
	fill: currentColor;
	height: 70px;
}

.footer__logo .custom-logo {
	height: 2.5rem;
	width: auto;
	object-fit: contain;
	display: block;
}

.footer__logo-placeholder {
	display: inline-block;
	font-weight: bold;
	letter-spacing: 0.02em;
}

.footer__year--end {
	order: 3;
	justify-self: end;
}

.footer__year--start, .footer__year--end {
	font-size: var(--font-size-h1);
	font-family: var(--font-heading);
	line-height: var(--line-height-tight);
	letter-spacing: var(--letter-spacing-heading);
}

/* Tablet / móvil: 6 columnas */
@media (max-width: 1024px) {
	.footer__credits, .footer__credits-2, .footer__nav-menu{
		row-gap: var(--row-gap-xs); /* Placeholder*/
	}
	.footer__row--1 {
		grid-template-columns: repeat(6, 1fr);
		column-gap: 0;
	}

	.footer__credits {
		grid-column: span 3;
		order: 5;
	}

	.footer__credits > .footer__credits-line:nth-child(2){
		/*letter-spacing: -0.0275em;*/
	}

	.footer__menu--1 {
		grid-column: span 3;
		order: 2;
	}

	.footer__menu--2 {
		grid-column: span 3;
		order: 4;
	}

	.footer__menu--3 {
		grid-column: span 3;
		order: 3;
	}

	.footer__credits-2 {
		grid-column: span 6;
		order: 1;
	}
}

@media (max-width: 400px) {
	.footer__credits > .footer__credits-line:nth-child(2){
		letter-spacing: -0.0275em;
	}
}

/* Footer logo: siempre se muestra el isotipo en todas las resoluciones */

/*body {
	min-height:500vh;
	}*/

	#wpadminbar {
		bottom: 0;
		top: unset;
	}

	.otgs-development-site-front-end {
		display: none;
	}

html{
	margin-top: 0px !important;
}

/*--------------------------------------------------------------
# Botones (backup).
--------------------------------------------------------------*/
a.btn {
	display: inline-block;
	font-family: var(--font-body);
	font-size: var(--font-size-body);
	line-height: 1;
	padding: var(--btn-padding-y) var(--btn-padding-x);
	background: color-mix(in srgb, var(--color-secondary) 20%, transparent);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	color: var(--color-secondary);
	text-decoration: none;
	transition: color var(--ease-color);
	border-radius: 3em;
}

a.btn:hover {
	color: var(--color-primary);
}

/*--------------------------------------------------------------
# Botones global (staggering animation).
--------------------------------------------------------------*/

/* Variante por defecto: sobre fondo oscuro (texto claro / secondary). */
.btn-animate-chars {
	display: flex;
	flex-grow: 1;
	justify-content: center;
	align-items: center;
	position: relative;
	max-width: 12em;
	font-family: var(--font-body);
	font-size: var(--font-size-body);
	line-height: 1;
	padding: var(--btn-padding-y) var(--btn-padding-x);
	color: var(--color-secondary);
	text-decoration: none;
	transition: color var(--ease-color);
	border-radius: 3em;
	cursor: pointer;
}

/* Sobre fondo claro: texto primary + halo primary suave. */
.btn-animate-chars--on-light {
	color: var(--color-primary);
}

.btn-animate-chars--on-light .btn-animate-chars__bg {
	background-color: color-mix(in srgb, var(--color-primary) 5%, transparent);
}

  
  .btn-animate-chars__text {
	white-space: nowrap;
	line-height: 1.3;
  }
  
  /* Characters */
  .btn-animate-chars [data-button-animate-chars] {
	overflow: hidden;
	position: relative;
	display: inline-block;
  }
  
  .btn-animate-chars [data-button-animate-chars] span {
	display: inline-block;
	position: relative;
	text-shadow: 0px 1.3em currentColor;
	transform: translateY(0em) rotate(0.001deg);
	transition: transform 0.8s cubic-bezier(0.625, 0.05, 0, 1);
  }
  
  .btn-animate-chars:hover [data-button-animate-chars] span {
	transform: translateY(-1.3em) rotate(0.001deg);
  }
  
  /* Background */
.btn-animate-chars__bg {
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	background-color: color-mix(in srgb, var(--color-secondary) 20%, transparent);
	border-radius: 3em;
	position: absolute;
	inset: 0;
	transition: inset 0.6s cubic-bezier(0.625, 0.05, 0, 1); 
}



.btn-animate-chars:hover .btn-animate-chars__bg {
	inset: 0.125em;
}

/* Underline link */
  

.underline-link {
	color: inherit;
	font-size: 1em;
	line-height: 1.25;
  }
  
.menu-item a, [data-underline-link] {
	text-decoration: none;
	position: relative;
}
  
.current_page_item a::before, .current_page_item a::after,.menu-item a::before, [data-underline-link]::before,
  [data-underline-link="alt"]::before,
  [data-underline-link="alt"]::after{
	content: "";
	position: absolute;
	bottom: -0.0625em;
	left: 0;
	width: 100%;
	height: 0.0625em;
	background-color: currentColor;
	transition: transform 0.735s cubic-bezier(0.625, 0.05, 0, 1);
	transform-origin: right;
	transform: scaleX(0) rotate(0.001deg);
}
  
.current_page_item a::before,[data-underline-link="alt"]::before {
	transform-origin: left;
	transform: scaleX(1) rotate(0.001deg);
	transition-delay: 0.3s;
}
  
.current_page_item a::after, [data-underline-link="alt"]::after {
	transform-origin: right;
	transform: scaleX(0) rotate(0.001deg);
	transition-delay: 0s;
}
 @media (hover: hover) and (pointer: fine) {
	[data-hover]:hover .menu-item a::before, .menu-item a:hover::before, [data-hover]:hover [data-underline-link]::before,
	[data-underline-link]:hover::before {
	  transform-origin: left;
	  transform: scaleX(1) rotate(0.001deg);
	}  
	
	[data-hover]:hover .current_page_item a::before,
	.current_page_item a:hover::before, [data-hover]:hover [data-underline-link="alt"]::before,
	[data-underline-link="alt"]:hover::before {
	  transform-origin: right;
	  transform: scaleX(0) rotate(0.001deg);
	  transition-delay: 0s;
	}
	
	[data-hover]:hover .current_page_item a::after,
	.current_page_item a:hover::after, [data-hover]:hover [data-underline-link="alt"]::after,
	[data-underline-link="alt"]:hover::after {
	  transform-origin: left;
	  transform: scaleX(1) rotate(0.001deg);
	  transition-delay: 0.3s;
	}
}

/*--------------------------------------------------------------
# Underline link reveal (sin SplitText; pensado para links de 1 línea)
--------------------------------------------------------------*/

  /* Reveal: el <a> lo anima GSAP (yPercent + clip-path). La línea se gestiona por CSS vía .is-revealed. */
  [data-split-underline-reveal] {
	display: inline-block;
  }

  /* Línea oculta hasta activar reveal; al quitar el override vuelve al estado base (::before scaleX(1) con su cubic-bezier + delay). */
  [data-split-underline-reveal][data-underline-link="alt"]:not(.is-revealed)::before {
	transform: scaleX(0) rotate(0.001deg);
  }

/*--------------------------------------------------------------
# Hero (100svh, imagen, contenido centrado, barra abajo) y Banner (sin barra; h2 + botón).
--------------------------------------------------------------*/
.hero,
.banner {
	width: 100%;
	height: calc(var(--vh)*100);
	height: 100svh; /* cambiar arriba del que tiene calc*/
	min-height: 100svh;
	position: relative;
	overflow: hidden;
	color: var(--color-secondary);
}

.banner{
	padding: var(--content-padding);

}

.hero__wrap,
.banner__wrap {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}


.hero__background,
.banner__background {
	position: absolute;
	inset: 0;
	z-index: 0;
    /*Parallax effect*/
	top: -10%;
	left: 0;
	right: 0;
	height: 120%;
	background-color: var(--color-primary);
}


.hero__background--placeholder,
.banner__background--placeholder {
	background-color: var(--color-primary);
	opacity: 0.15;
}

.hero__image,
.banner__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.hero--split-bg .hero__split {
	position: absolute;
	inset: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.hero--split-bg .hero__split-mask {
	position: relative;
	overflow: hidden;
}

.hero--split-bg .hero__image--split {
	position: absolute;
	left: 0;
	right: 0;
    /*Parallax effect*/
	top: -10%;
	width: 100%;
	height: 120%;
}

.hero__overlay,
.banner__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(var(--color-primary-rgb), 0.2);
	pointer-events: none;
}

.hero__inner,
.banner__inner {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	min-height: 100%;
	max-width: var(--content-max-width);
	margin-inline: auto;
	padding: var(--content-padding);
}

.hero__content-wrap,
.banner__content-wrap {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.hero__content,
.banner__content {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-s);
}

.hero__title {
	font-family: var(--font-heading);
	font-size: var(--font-size-h1);
	line-height: var(--line-height-tight);
	letter-spacing: var(--letter-spacing-heading);
	margin: 0;
	color: inherit;
	/*text-wrap-style: balance;*/
	max-width: 20ch;
}

.banner__title {
	font-family: var(--font-heading);
	font-size: var(--font-size-h2);
	line-height: var(--line-height-tight);
	letter-spacing: var(--letter-spacing-heading);
	margin: 0;
	color: inherit;
	text-wrap-style: balance;
	max-width: 20ch;
}

.hero__bar {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--column-gap);
	width: 100%;
	font-family: var(--font-body);
	font-size: var(--font-size-body);
	line-height: var(--line-height-flat);
	text-transform: uppercase;
}

.hero__bar-text--left {
	text-align: left;
}

.hero__bar-text--center {
	text-align: center;
}

.hero__bar-text--right {
	text-align: right;
}

/* Dos puntos de la hora (hero bar): parpadeo. JS toggle .time-sep--off cada 1s. */
.time-sep {
	transition: opacity 0.25s ease-in-out;
}
.time-sep--off {
	opacity: 0;
}

@media (max-width: 768px) {
	.hero--split-bg .hero__split {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr;
		min-height: 0;
	}

	/* min-height: 0 evita que el mínimo intrínseco de cada <img> rompa el reparto 50/50 de 1fr 1fr */
	.hero--split-bg .hero__image--split {
		min-height: 0;
		min-width: 0;
		object-fit: cover;
		object-position: center;
		display: block;
		height: 160%;
		top: -30%;
	}

	.hero__inner,
	.banner__inner {
		padding: var(--content-padding);
	}

	.hero__bar-city {
		display: none;
	}
}

/*--------------------------------------------------------------
# Home template (base sección 1 sticky + media track)
--------------------------------------------------------------*/

.layout-grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--column-gap);
	max-width: var(--content-max-width);
	padding-inline: var(--content-padding);
	margin-inline: auto;
}

.home-section__sticky > .layout-grid{
	width: 100%;
	min-width: 100%;
}

.home-section--intro {
	padding-top: var(--section-padding-xl);
}

.home-section--intro__stack {
	display: grid;
}

.home-section__sticky,
.home-section__media-track {
	grid-area: 1 / 1;
}

.home-section__sticky {
	position: sticky;
	top: 0;
	height: 100svh;
	display: grid;
	align-items: center;
	z-index: 2;
	margin-top: calc(-1 * var(--section-padding-xl));
	margin-bottom: 20%;

}

.home-section--intro__text-col {
	grid-column: 5 / span 4;
	display: grid;
	place-items: center;
	text-align: left;
	padding: 1em;
	/*padding: 1.5em;*/
}


.home-section--intro__text {
	margin: 0;
	width:100%;
	min-width: 100%;
}

.home-section__media-track {
	position: relative;
	z-index: 1;
}

.home-section__media-grid {
	position: relative;
	align-content: start;
}

.home-section__media-intro-mobile {
	display: none;
}

.home-section__media-grid--intro-mobile {
	align-content: start;
}

.home-media-item--intro-mobile {
	margin: 0;
	grid-row: auto;
	align-self: start;
}

.home-media-item {
	margin: 0;
}

.home-media-item__media {
	position: relative;
	overflow: hidden;
}

.home-media-item__media img {
	display: block;
	width: 100%;
	height: auto;
}

.home-media-item--1 {
	grid-column: 10 / span 3;
	grid-row: 1;
	aspect-ratio: 3/4; 
}

.home-media-item--2 {
	grid-column: 1 / span 3;
	grid-row: 2;
	margin-top: -10%;
	aspect-ratio: 2/3; 
}

.home-media-item--3 {
	grid-column: 10 / span 3;
	grid-row: 3;
	margin-top: -10%;
	aspect-ratio: 2/3; 
}

.home-media-item--4 {
	grid-column: 1 / span 6;
	grid-row: 4;
	margin-top: 20%;
	aspect-ratio: 16/10;
}

.home-section--marquee {
	padding: var(--section-padding-xxxl) 0;

}

.home-section--marquee__title {
	grid-column: 4 / span 6;
	margin: 0 auto var(--space-xxl) auto;
	text-align: center;
	color: var(--color-primary);
	max-width: 20ch;
	text-wrap-style: balance;
}

.home-section--marquee__component {
	width: 100%;
	margin-bottom: var(--space-l);
}

.home-section--marquee__cta {
	display: flex;
	justify-content: center;
	margin: 0;
	text-align: center;
}

.home-section--closing__layout {
	align-items: stretch;
}

.home-section--closing__media-main {
	grid-column: 1 / span 5;
	margin: 0;
}

.home-section--closing__side {
	grid-column: 8 / 13;
	display: grid;
	column-gap: var(--column-gap);
	grid-template-columns: repeat(5, minmax(0, 1fr));
	align-content: space-between;
	row-gap: var(--row-gap-l);
}

.home-section--closing__text {
	grid-column: 1 / span 4;
	margin: 0;
}

.home-section--closing__media-secondary {
	grid-column: 4 / span 2;
	margin: 0;
	align-self: end;
}

@media (max-width: 1024px) {


	.home-section--intro__text-col {
		grid-column: 4 / span 6;
	}

	.home-section--closing__media-main {
		grid-column: 1 / span 6;
	}

	.home-section--closing__side {
		grid-column: 8 / 13;
	}

	.home-section--closing__text {
		grid-column: 1 / span 5;
	}
}

@media (max-width: 768px) {


	.home-section--intro {
		padding-top: var(--section-padding-xs);
		padding-bottom: var(--section-padding-xs);
	}

	.home-section--intro__stack {
		display: flex;
        flex-direction: column;
	}

	.home-section__media-intro-mobile {
		display: block;
	}

	.home-section__sticky {
		margin-top: 0;
		margin-bottom: 0;
		position: static;
		height: auto;
		display: block;
		padding: var(--section-padding-s) 0;
	}

	.home-section__media-grid--main .home-media-item--1,
	.home-section__media-grid--main .home-media-item--2 {
		display: none;
	}

	.home-media-item {
		/*grid-row: auto;*/
	}

	.home-media-item--intro-mobile-1 {
		grid-column: 1 / span 4;
		padding-top: 0;
	}

	.home-media-item--intro-mobile-2 {
		grid-column: 7 / span 6;
		margin-top: 0;
		padding-top: 50%;
	}

	.home-media-item--3 {
		grid-column: 1 / span 5;
		margin-top: 0;
		
	}

	.home-media-item--4 {
		grid-column: 4  / span 9;
		/*margin-top: var(--space-l);*/
		margin-top: 0;
		padding-top: var(--space-m);
		
	}

	.home-media-item:has([data-image-reveal-only-mobile]) {
      aspect-ratio: unset;
	}


	figure.parallax-mask [data-image-reveal-only-mobile] {
		position: relative;
		inset: 0 ;
		height: 100% ;
	}

	.home-media-item--1 [data-image-reveal-only-mobile] img{
		aspect-ratio: 2/3; 
	}
	
	.home-media-item--2 [data-image-reveal-only-mobile] img{
		aspect-ratio: 2/3; 
	}
	
	.home-media-item--3 [data-image-reveal-only-mobile] img{
		aspect-ratio: 2/3; 
	}
	
	.home-media-item--4 [data-image-reveal-only-mobile] img{
		aspect-ratio: 16/10;
	}

	.home-section--intro__text-col {
		grid-column: 1 / -1;
		padding: 0;
	}

	.home-section--marquee {
		padding: var(--section-padding-m) 0 var(--section-padding-m) 0;
	}

	.home-section--marquee__title {
		margin: 0 auto var(--space-l) auto;
	}

	.home-section--marquee__title,
	.home-section--marquee__cta {
		grid-column: 1 / -1;
	}

	.home-section--closing__layout {
		row-gap: var(--row-gap-l);
	}

	.home-section--closing__media-main {
		grid-column: 6 / 13;
		order: 2;
	}

	.home-section--closing__side {
		grid-column: 1 / -1;
		grid-template-columns: repeat(6, minmax(0, 1fr));
		row-gap: var(--row-gap-m);
	}

	.home-section--closing__text {
		grid-column: 1 / -1;
	}

	.home-section--closing__media-secondary {
		display: none;
		grid-column: 4 / span 3;
	}
}

/*--------------------------------------------------------------
# Contact template
--------------------------------------------------------------*/

.contact-section {
	padding-top: var(--section-padding-xxl);
	padding-bottom: 0;
}

.contact-section__grid {
	align-content: start;
}

.contact-section__title {
	grid-column: 1 / -1;
	margin: 0 0 var(--space-xl);
}

/*
 * Rail desktop: grid de 12 columnas; cada .contact-rail__col es una celda con flex
 * (head + hueco + body). La línea full width es ::before del padre, alineada a altura
 * fija de titulares (--contact-rail-head-h).
 */
.contact-rail {
	--contact-rail-head-h: calc(var(--font-size-body) * var(--line-height-body));
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--column-gap);
	align-items: start;
	grid-column: 1 / -1;
	margin-bottom: var(--space-xxxl);
	position: relative;
}

.contact-rail > .contact-rail__col {
	min-width: 0;
}
/* Underline-link width fix - Address text*/

.contact-rail__text::before{
	width: 16ch;
}


/*@media (min-width: 769px) and (max-width: 1500px) {

	.contact-rail {
		row-gap: var(--row-gap-l);
	}           

	.contact-rail__col--intro .contact-rail__body {
        margin-top: 0 !important;
    }

	.contact-rail::before {
		content: none !important;
	}
	
	.contact-rail__col--intro {
		grid-column: 1 / -1 !important;
		grid-row: 1;
	}

	.contact-rail__col--address {
		grid-column: 1 / span 4 !important;
		grid-row: 2;
	}

	.contact-rail__col--contact {
		grid-column: 5 / span 4 !important;	
		grid-row: 2;
	}

	.contact-rail__col--social {
		grid-column: 9 / span 4 !important;
		grid-row: 2;
	}
}*/

/* Estado inicial de la animación rail (GSAP --palo-rail-rule-*). Sin esto, hasta
   después de afterEnter de Barba las variables no existen y el ::before/::after
   usa fallback scaleX(1): flash de línea completa. Con 0 desde la primera pintura
   el tween solo revela. */

[data-rail-rule-reveal] {
	--palo-rail-rule-scale: 0;
	--palo-rail-rule-scale-child: 0;
}

@media (min-width: 769px) {
	.contact-rail::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: calc(var(--contact-rail-head-h) + var(--space-xs) + 1px);
		height: 1px;
		background-color: currentColor;
		opacity: 0.35;
		transform-origin: left center;
		transform: scaleX(var(--palo-rail-rule-scale, 1));
		pointer-events: none;
		z-index: 1;
	}

	.contact-rail__col {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}

	.contact-rail__head {
		margin-bottom: var(--space-xs);
	}

	.contact-rail__body {
		margin-top: calc((var(--space-s) + var(--space-xs)) + 1px);
	}

	.contact-rail__col--intro {
		grid-column: 1 / span 5;
	}

	.contact-rail__col--address {
		grid-column: 7 / span 2;
	}

	.contact-rail__col--contact {
		grid-column: 9 / span 2;
	}

	.contact-rail__col--social {
		grid-column: 11 / span 2;
	}
}

.contact-rail__head--spacer {
	margin: 0;
	min-height: calc(1em * var(--line-height-body));
	pointer-events: none;
}

.contact-rail__text,
.contact-rail__line {
	margin: 0;
	color: inherit;
}

.contact-rail__line + .contact-rail__line {
	margin-top: 0;
}

.contact-rail__link {
	color: inherit;
	text-decoration: none;
}

.contact-rail__body--social .contact-rail__link {
	text-decoration: none;
}

.contact-section__figure {
	margin: 0;
	align-self: end;
}

.contact-section__figure--1 {
	grid-column: 1 / span 2;
}

.contact-section__figure--2 {
	grid-column: 9 / span 4;
}

.contact-section__media {
	overflow: hidden;
}

.contact-section__media img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

@media (max-width: 1200px) {
	.contact-rail::before {
		content: none;
	}

	.contact-rail__body {
        margin-top: 0 !important;
    }

	/* Gap between lines Contact & Socials */

	.contact-rail__body {
		display: flex;
		flex-direction: column;
		gap: var(--space-xs) !important;
	}

	.contact-rail {
		display: flex;
		flex-direction: column;
		gap: var(--row-gap-l);
		margin-bottom: var(--space-xxxl);
	}

	.contact-rail__col {
		display: flex;
		flex-direction: column;
		gap: var(--space-xs);
		width: 100%;
		min-width: 0;
	}
	

	.contact-rail__col--intro .contact-rail__head--spacer {
		display: none;
	}

	.contact-rail__head.palo-rail-block__title::after {
		content: "";
		display: block;
		width: 100%;
		height: 1px;
		margin-top: var(--space-xs);
		background-color: currentColor;
		opacity: 0.35;
		transform-origin: left center;
		transform: scaleX(var(--palo-rail-rule-scale, 1));
	}

	/*.contact-section__figure--1{
		grid-column: 1 / span 4;
		align-self: start;
		max-width: 100%;
	}*/

	.contact-section__figure--1{
       display: none;
	}

	.contact-section__figure--2 {
		grid-column: 7 / span 6;
		align-self: start;
		max-width: 100%;
	}
}

/*--------------------------------------------------------------
# Legal template (sidebar 4 col + contenido editor 8 col)
--------------------------------------------------------------*/

.legal-section {
	padding-top: var(--section-padding-xxl);
	padding-bottom: var(--section-padding-xl);
}

.legal-section__grid {
	align-content: start;
}

.legal-section__title-rail {
	grid-column: 1 / -1;
	margin: 0 0 var(--space-xl);
	position: relative;
}

.legal-section__title {
  margin: 0;
}

.legal-section__title-rail::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: calc(var(--space-l) * -1);
		height: 1px;
		background-color: currentColor;
		opacity: 0.35;
		transform-origin: left center;
		transform: scaleX(var(--palo-rail-rule-scale, 1));
		pointer-events: none;
		z-index: 1;
	}

.legal-sidebar {
	grid-column: 1 / span 4;
	min-width: 0;
}

.legal-sidebar__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}
.legal-sidebar__list > li {
	/*overflow: hidden;*/
	transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
}
/* Reposo: página actual destacada, resto atenuado */

.legal-sidebar__list > .menu-item:not(.current-menu-item),
.legal-sidebar__list > .page_item:not(.current_page_item) {
	opacity: 0.15;
}
.legal-sidebar__list > .menu-item.current-menu-item,
.legal-sidebar__list > .page_item.current_page_item{
	opacity: 1;
}

/* Hover: atenuar no hover; mantener ancla en la página actual; hover a tope */

.legal-sidebar__list:has(.menu-item:hover) > .menu-item:not(:hover),
.legal-sidebar__list:has(.page_item:hover) > .page_item:not(:hover) {
	opacity: 0.15;
}
.legal-sidebar__list:has(.menu-item:hover) > .menu-item.current-menu-item:not(:hover),
.legal-sidebar__list:has(.page_item:hover) > .page_item.current_page_item:not(:hover){
	opacity: 0.15;
}
.legal-sidebar__list:has(.menu-item:hover) > .menu-item:hover,
.legal-sidebar__list:has(.page_item:hover) > .page_item:hover {
	opacity: 1;
}

.legal-sidebar__list > li > a {
	display: inline-block;
	text-decoration: none;
	color: inherit;
	overflow: hidden;
	font-family: var(--font-heading);
	font-weight: var(--font-weight-heading);
	font-size: var(--font-size-h1);
	line-height: var(--line-height-flat);
	letter-spacing: var(--letter-spacing-heading);
	text-transform: uppercase;
}

.legal-content {
	grid-column: 5 / span 8;
	padding-right: 12.5%; 
	min-width: 0;
}

.legal-content h4{
	margin-block-start: var(--space-s);
	margin-block-start: 30px;
	margin-block-end: var(--space-xs);
	/*margin-block-end: 15px;*/
}

.legal-content__body > p {
	margin-block-start: calc(var(--space-xs) / 2);
	margin-block-start: 0;
	margin-block-end: calc(var(--space-xs) / 2);
	/*margin-block-end: var(--space-xs);*/
	/*margin-block-end: 15px;*/
}

/*.legal-content > .legal-content__body > h4:first-of-type{
	margin-block-start: 0em;
}*/

.legal-content__body {
	margin-top: 0;
}

.legal-content__body > :first-child {
	margin-top: 0;
}

@media (max-width: 1024px) {
	.legal-section__grid {
		/*row-gap: var(--row-gap-l);*/
	}
	.legal-sidebar {
		grid-column: 1 / -1;
		display: none;
	}

	.legal-content {
		grid-column: 1 / -1;
		padding-right: 0; 
	}
}


.wp-block-separator {
    border: none;
    border-top: none;
}

hr {
    background-color: var(--color-primary);
    border: 0;
    height: 0.5px;
    margin-bottom: 1.5em;
}

.wp-block-list {
	padding-inline-start: 1em;
    margin-left: 0em;
}

.wp-block-list {
	list-style: none;
	padding-left: 0.75em;
}

.wp-block-list li {
	position: relative;
}

.wp-block-list li::before {
	content: "•";
	position: absolute;
	left: -0.75em;
	top: calc((50% - 1px));
	transform: translateY(-50%);
	font-size: 0.75em;
	line-height: calc((var(--line-height-body)* var(--font-size-body)));
}

/*--------------------------------------------------------------
# Projects template
--------------------------------------------------------------*/

.projects-section--intro-marquee {
	padding-top: var(--section-padding-xxl);
	padding-bottom: var(--section-padding-xxxl);
}

.projects-section--intro-marquee__grid {
	align-content: start;
}

.projects-section--intro-marquee__lead {
	grid-column: 7 / span 5;
	margin: 0 0 var(--space-xxxl);
	color: inherit;
}

.projects-section--intro-marquee__component {
	width: 100%;
}

/* Títulos de carril reutilizables (proyectos, contacto, etc.): jerarquía h4 + aspecto body uppercase */
h4.palo-rail-block__title,
h5.palo-rail-block__title {
	color: inherit;
	margin: 0;
}

.projects-section--index {
	padding-bottom: var(--space-xxxl);
}

.projects-section--index__footer-grid {
	align-content: start;
}

.projects-section--index__catalog {
	grid-column: 1 / span 5;
}

.projects-section--index__catalog-text {
	margin: 0 0 1rem;
	color: inherit;
}

.projects-section--index__catalog-link {
	display: inline-block;
}

/* Índice: 3 columnas (INDEX / PROYECTOS / PREMIOS) como hermanos; línea global ::before (≥769).
   layout-grid aporta las 12 columnas. Inner: proyectos en grid 6 (8 si ≤1024); premios en columna flex.
   Animación: --palo-rail-rule-scale. */
.projects-index {
	--projects-index-head-h: calc(var(--font-size-body) * var(--line-height-body));
	position: relative;
	align-content: start;
	margin-bottom: var(--space-240);
	/*overflow: visible;*/
}

.projects-index > .projects-index__col {
	min-width: 0;
}

@media (min-width: 769px) {
	.projects-index::before {
		content: "";
		position: absolute;
		left: var(--content-padding);
        right: var(--content-padding);
		top: calc(var(--projects-index-head-h) + var(--space-xs) + 1px);
		height: 1px;
		background-color: currentColor;
		opacity: 0.35;
		transform-origin: left center;
		transform: scaleX(var(--palo-rail-rule-scale, 1));
		pointer-events: none;
		z-index: 1;
	}

	.projects-index__col {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}

	.projects-index__head {
		margin: 0 0 var(--space-xs) 0;
	}

	.projects-index__body {
		margin-top: calc((var(--space-s) + var(--space-xs)) + 1px);
	}

	.projects-index__col--index {
		grid-column: 1 / span 3;
	}

	.projects-index__col--projects {
		grid-column: 4 / span 6;
	}

	.projects-index__col--premios {
		grid-column: 10 / span 3;
	}

	.projects-index__col--projects .projects-index__head::after,
	.projects-index__col--premios .projects-index__head::after {
		content: none;
		display: none;
	}

	.projects-index__tag {
		position: absolute;
		left: 0;
		top: 0;
		width: max-content;
		transform: translateX(calc(-100% - var(--column-gap)));
	}
}

.projects-index__projects-inner {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	column-gap: var(--column-gap);
	row-gap: var(--row-gap-m);
	min-width: 0;
}

.projects-index__awards {
	display: flex;
	flex-direction: column;
	gap: var(--row-gap-m);
	min-width: 0;
	/*overflow: visible;*/
}

.projects-index__year-body {
	display: flex;
	flex-direction: column;
	gap: var(--row-gap-m);
	min-width: 0;
}

.projects-index__hotel-name {
	margin: 0 0 var(--space-xs);
	color: inherit;
}

.projects-index__group {
	position: relative;
	min-width: 0;
	grid-column: span 3;
}

.projects-index__tag {
	text-transform: uppercase;
}

.projects-index__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.projects-index__item {
	margin: 0;
	padding: 0;
	color: inherit;
}

.projects-index__rail-spacer {
	min-height: 0;
}

@media (max-width: 1024px) {
	.projects-section--intro-marquee__lead, 
	.projects-section--index__catalog {
		grid-column: 1 / span 6;
	}


	.projects-index__col--index {
		display: none;
	}

	.projects-index__col--projects {
		grid-column: 1 / span 8;
	}

	.projects-index__col--premios {
		grid-column: 9 / span 4;
	}

	.projects-index__projects-inner {
		grid-template-columns: repeat(8, minmax(0, 1fr));
		margin-left: calc(var(--column-gap) * 2);
	}

	.projects-index__group {
		grid-column: span 4;
		padding-right: var(--column-gap);
	}
}


@media (max-width: 768px) {

	.projects-section--intro-marquee__lead {
		grid-column: 1 / -1;
		margin-bottom: var(--space-xxl);
	}

	.projects-section--intro-marquee {
		padding-top: var(--section-padding-m);
		padding-bottom: var(--section-padding-xxl);
	}

	.projects-section--index{
		padding-bottom: var(--section-padding-l);
	}

	.projects-index::before {
		content: none;
	}

	.projects-index {
		display: flex;
		flex-direction: column;
		gap: var(--row-gap-xl);
		margin-bottom: var(--space-xxxl);
	}

	.projects-index__col {
		width: 100%;
		gap: var(--space-s);
	}

	.projects-index__head {
		margin-bottom: 0;
	}

	.projects-index__body {
		margin-top: 0;
	}

	.projects-index__col--projects .projects-index__head::after,
	.projects-index__col--premios .projects-index__head::after {
		content: "";
		display: block;
		width: 100%;
		height: 1px;
		margin-top: var(--space-xs);
		margin-bottom: var(--space-s);
		background-color: currentColor;
		opacity: 1;
		transform-origin: left center;
		transform: scaleX(var(--palo-rail-rule-scale, 1));
	}

	.projects-index__projects-inner {
		grid-template-columns: 1fr;
		row-gap: var(--row-gap-m);
		margin-left: 0;
		padding-right: 0;
	}

	.projects-index__group,
	.projects-index__group--year {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 5fr);
		column-gap: var(--column-gap);
		align-items: start;
	}

	.projects-index__tag {
		position: static;
		transform: none;
	}

	.projects-section--index__catalog {
		grid-column: 1 / -1;
	}
}

/*--------------------------------------------------------------
# About template
--------------------------------------------------------------*/


.about-section--intro {
	padding-top: var(--section-padding-xl);
	padding-bottom: var(--section-padding-xxl);
}

.about-section--intro__grid {
	align-content: start;
}

.about-section--intro__lead {
	grid-column: 1 / span 5;
	margin: 0 0 var(--space-l);
}

.about-section--intro__figure {
	margin: 0;
}

.about-section--intro__media {
	margin-bottom: var(--space-xs);
	position: relative;
	overflow: hidden;
}

.about-section--intro__media img {
	display: block;
	width: 100%;
	height: auto;
}

.about-section--intro__figure--1 {
	grid-column: 4 / span 4;
	grid-row: 2;
	align-self: start;
}

.about-section--intro__figure--2 {
	grid-column: 8 / span 5;
	grid-row: 2;
	align-self: start;
}

.about-photo-credit {
	margin: 0;
}

[data-image-reveal-caption] {
	visibility: hidden;
	overflow: hidden;
}

.about-section--manifesto__grid {
	align-content: start;
}

.about-section--manifesto__heading {
	grid-column: 1 / -1;
	margin: 0 0 var(--space-l);
	text-align: left;
	width: 100%;
	max-width: none;
}

.about-section--manifesto__text-pair {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--column-gap);
	row-gap: var(--row-gap-m);
	margin-bottom: var(--space-xl);
	width: 100%;
}

.about-section--manifesto__text {
	margin: 0;
}

.about-section--manifesto__text--1 {
	grid-column: 1 / span 4;
}

.about-section--manifesto__text--2 {
	grid-column: 5 / span 4;
}

/* About manifesto: track (scroll) + sticky viewport + pares split */
.about-manifesto-split__track {
	width: 100%;
	height: 3600px;
	position: relative;
}

.about-manifesto-split__sticky {
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100vh;
	padding-left: 0;
	padding-right: 0;
	display: flex;
	position: sticky;
	top: 0;
	overflow: hidden;
}

.about-manifesto-split__inner {
	text-align: center;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	display: flex;
	position: relative;
	background: color-mix(in srgb, var(--color-primary) 100%, transparent);
	height: 100%;
	overflow: hidden;
}

.sticky-image-stage {
	max-width: none;
	width: 100%;
	height: 100%;
	display: block;
	position: relative;
}

.sticky-image-pair {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	opacity: 0;
}

.sticky-image-pair.is--stacked {
	opacity: 0;
}

.sticky-image-pair:first-child {
	opacity: 1;
}

.sticky-image-pair__img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	min-width: 0;
	min-height: 0;
}



@media screen and (max-width: 767px) {
	.sticky-image-pair {
		height: 100%;
	}

	.about-manifesto-split__track {
		height: 2400px;
	}
}

.about-section--historia {
	padding-top: var(--section-padding-xxxl);
	padding-bottom: var(--section-padding-xxxl);
}

.about-section--historia__grid {
	align-content: start;
}

.about-section--historia__heading {
	grid-column: 1 / -1;
	margin: 0 0 var(--space-l);
	text-align: center;
	width: 100%;
	max-width: none;
}

.about-section--historia__text-pair {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--column-gap);
	row-gap: var(--row-gap-m);
	width: 100%;
}

.about-section--historia__text-pair--offset {
	grid-column: 1 / -1;
	margin-bottom: var(--space-xl);
}

.about-section--historia__text-pair--offset .about-section--historia__text--1 {
	grid-column: 5 / span 4;
}

.about-section--historia__text-pair--offset .about-section--historia__text--2 {
	grid-column: 9 / span 4;
}

.about-section--historia__text {
	margin: 0;
}

.about-section--historia__marquee {
	width: 100%;
	margin: 0 0 var(--space-xxl);
}

.about-section--historia__marquee .home-section--marquee__component {
	margin-bottom: 0;
}

.about-section--historia__grid--bottom .about-section--historia__text-pair {
	grid-column: 1 / -1;
	margin-bottom: 0;
}

.about-section--historia__grid--bottom .about-section--historia__text--3 {
	grid-column: 1 / span 4;
}

.about-section--historia__grid--bottom .about-section--historia__text--4 {
	grid-column: 5 / span 4;
}

@media (max-width: 1024px) {

	.about-section--intro__lead {
		grid-column: 1 / span 6;
	}

	.about-section--intro__figure--1 {
		grid-column: 1 / span 5;
		grid-row: auto;
	}

	.about-section--intro__figure--2 {
		grid-column: 6 / span 7;
		grid-row: auto;
	}

	.about-photo-credit__city {
		display: none;
	}

	.about-section--manifesto__text--1,
	.about-section--historia__text-pair--offset .about-section--historia__text--1,
	.about-section--historia__grid--bottom .about-section--historia__text--3 {
		grid-column: 1 / span 6;
	}

	.about-section--manifesto__text--2,
	.about-section--historia__text-pair--offset .about-section--historia__text--2,
	.about-section--historia__grid--bottom .about-section--historia__text--4 {
		grid-column: 7 / span 6;
	}

}

@media (max-width: 768px) {

	.about-section--intro {
		padding-top: var(--section-padding-m);
		padding-bottom: var(--section-padding-l);
	}

	.about-section--intro__lead {
		grid-column: 1 / -1;
		margin-bottom: var(--space-m);
	}

	.about-section--manifesto__text-pair {
		margin-bottom: var(--space-xl);
	}

	.about-section--manifesto__text--1,
	.about-section--manifesto__text--2,
	.about-section--historia__text-pair--offset .about-section--historia__text--1,
	.about-section--historia__text-pair--offset .about-section--historia__text--2,
	.about-section--historia__grid--bottom .about-section--historia__text--3,
	.about-section--historia__grid--bottom .about-section--historia__text--4 {
		grid-column: 1 / -1;
	}

	.about-section--historia {
		padding-top: var(--section-padding-xl);
		padding-bottom: var(--section-padding-l);
	}

}

/*--------------------------------------------------------------
# Error 404
--------------------------------------------------------------*/

.error-404 {
	padding-top: var(--section-padding-xxl);
	padding-bottom: 0;
}

.error-404__grid {
	align-content: start;
}

.error-404__title-rail {
	grid-column: 1 / -1;
	grid-row: 1;
	margin: 0 0 var(--space-xl);
	position: relative;
}

.error-404__title-rail::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(var(--space-l) * -1);
	height: 1px;
	background-color: currentColor;
	opacity: 0.35;
	transform-origin: left center;
	transform: scaleX(var(--palo-rail-rule-scale, 1));
	pointer-events: none;
	z-index: 1;
}

.error-404__title {
	margin: 0;
	/*max-width: 10ch;*/
}

.error-404__body {
	grid-column: 1 / span 8;
	grid-row: 2;
	min-width: 0;
}

.error-404__intro {
	margin: 0;
}

.error-404__action {
	margin: var(--space-xs) 0 0;
}

.error-404__home-link {
	display: inline-block;
}

.error-404__home-link-arrow {
	white-space: nowrap;
}

/* Figuras (misma idea que contact: pequeña cols 1–2, grande 9–12). */
.error-404__figure {
	margin: var(--space-xxxl) 0 0;
	align-self: end;
}

.error-404__figure--1 {
	grid-column: 1 / span 2;
	grid-row: 3;
}

.error-404__figure--2 {
	grid-column: 8 / span 5;
	grid-row: 3;
}

.error-404__media {
	overflow: hidden;
}

.error-404__media img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

@media (max-width: 1200px) {
	.error-404__figure--1 {
		display: none;
	}

	.error-404__figure--2 {
		grid-column: 7 / span 6;
		grid-row: 3;
		align-self: start;
		max-width: 100%;
	}
}

@media (max-width: 1024px) {
	.error-404__title {
		width: 100%;
	}

	.error-404__title-rail {
		grid-row: auto;
	}

	.error-404__body {
		grid-column: 1 / -1;
		grid-row: auto;
	}

	.error-404__figure--2 {
		grid-column: 1 / -1;
		grid-row: auto;
	}
}