/*! Cadencia core styles · shared by every Cadencia template. Do not edit:
 * change colours and fonts in css/theme.css and the layout in css/styles.css. */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-height: 100svh; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, picture, video, canvas, svg { display: block; max-width: 100%; }
img { height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
ul[role='list'], ol[role='list'] { list-style: none; padding: 0; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
h1, h2, h3, h4 { text-wrap: balance; }
p { text-wrap: pretty; }
template { display: none; }

/* ---------- Utilities ---------- */
.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; left: 1rem; top: 0.75rem; z-index: 1000; padding: 0.6rem 1rem; border-radius: 6px;
  background: var(--fg, #000); color: var(--bg, #fff); transform: translateY(-150%); transition: transform 0.2s;
}
.skip-link:focus { transform: none; }
.site-error {
  position: fixed; inset: auto 1rem 1rem; z-index: 2147483001; padding: 1rem 1.25rem; border-radius: 0.75rem;
  background: #b3261e; color: #fff; font: 500 0.95rem/1.45 system-ui, sans-serif; box-shadow: 0 10px 30px rgb(0 0 0 / 0.35);
}
.site-error code { font-family: ui-monospace, Consolas, monospace; background: rgb(0 0 0 / 0.25); padding: 0.1em 0.35em; border-radius: 4px; }

/* The page shows once content.js has filled it (never half-empty). The <head> script adds .js-render */
.js-render:not(.is-rendered) body { opacity: 0; }

/* ---------- Smooth scroll (Lenis) ---------- */
html.lenis, html.lenis body { height: auto; }
.lenis:not(.lenis-autoToggle).lenis-stopped { overflow: clip; }
.lenis [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-smooth iframe { pointer-events: none; }

/* ---------- Motion ----------
   .js-motion is added in <head> only when the visitor does NOT ask for reduced motion.
   Without JS or with reduced motion everything is visible from the start. */
.js-motion [data-reveal] { opacity: 0; }
.js-motion [data-reveal='clip'] { opacity: 1; clip-path: inset(100% 0 0 0); }
.js-motion [data-stagger] > * { opacity: 0; }
.js-motion [data-split]:not([data-split='words-scrub']) { opacity: 0; }
/* Line masks: keep accents on capital letters (Á, É, Í) from being clipped */
[data-split]:not([data-split='words-scrub']) > div { padding-top: 0.18em; margin-top: -0.18em; }

/* Hero entrance in pure CSS: it does not wait for JavaScript */
.intro-line { display: block; overflow: hidden; padding-bottom: 0.08em; margin-bottom: -0.08em; }
.intro-line > span { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .intro-line > span { animation: intro-rise 1.2s var(--ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both; animation-delay: calc(0.1s + var(--i, 0) * 0.1s); }
  .intro-fade { animation: intro-fade 1.2s var(--ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both; animation-delay: calc(0.4s + var(--i, 0) * 0.1s); }
}
@keyframes intro-rise { from { transform: translateY(105%); } }
@keyframes intro-fade { from { opacity: 0; transform: translateY(16px); } }

/* Infinite marquee (speeds up with scroll) */
.marquee { overflow: hidden; display: flex; user-select: none; }
.marquee__track { display: flex; flex-shrink: 0; min-width: 100%; justify-content: space-around; gap: var(--marquee-gap, 3rem); padding-right: var(--marquee-gap, 3rem); }
@media (prefers-reduced-motion: no-preference) {
  .marquee__track { animation: marquee var(--marquee-dur, 30s) linear infinite; }
  .marquee[data-direction='right'] .marquee__track { animation-direction: reverse; }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .marquee:hover .marquee__track { animation-play-state: paused; }
}
/* Without motion the marquee stands still: let people swipe through it instead */
@media (prefers-reduced-motion: reduce) {
  .marquee { overflow-x: auto; scroll-snap-type: x proximity; }
  .marquee__track[aria-hidden='true'] { display: none; }
}
@keyframes marquee { to { transform: translateX(-100%); } }

/* Pinned horizontal section: without pinning (reduced motion) it is a native swipeable row */
[data-module~='horizontal'] [data-track] { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; }
[data-module~='horizontal'] [data-track] > * { scroll-snap-align: start; flex-shrink: 0; }
[data-module~='horizontal'].is-pinned [data-track] { overflow: visible; scroll-snap-type: none; }
[data-module~='horizontal'] [data-progress] { transform-origin: left; transform: scaleX(0); }
[data-module~='horizontal']:not(.is-pinned) [data-progress] { display: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}