/*
Theme Name: Uraitz Olaizola Portfolio
Theme URI: https://www.enagora.com/
Author: Enagora
Description: Portfolio minimalista para Uraitz Olaizola, con proyectos personales bajo la marca Enagora.
Version: 3.0.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: enagora-portfolio
*/

@font-face {
  font-display: swap;
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 100 900;
  src: url("assets/fonts/montserrat-latin-variable.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 200 900;
  src: url("assets/fonts/source-sans-3-latin-variable.woff2") format("woff2");
}

:root {
  --uo-border: rgba(34, 31, 28, 0.13);
  --uo-display: "Montserrat", Avenir, "Avenir Next", Futura, sans-serif;
  --uo-body: "Source Sans 3", "Segoe UI", sans-serif;
}

html { scroll-behavior: smooth; }

body {
  font-family: var(--uo-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

a { text-underline-offset: 0.2em; }

.uo-site-header {
  border-bottom: 1px solid var(--uo-border);
}

.uo-wordmark {
  font-family: var(--uo-display);
  letter-spacing: -0.035em;
  text-decoration: none;
}

.uo-kicker {
  font-family: var(--uo-display);
  font-weight: 650;
  font-size: .78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.uo-hero {
  min-height: min(780px, 86vh);
  display: flex;
  align-items: center;
}

.uo-title-button {
  appearance: none;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  display: inline-block;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  padding: 0;
  text-align: left;
}

.uo-title-button { display: inline-block; }
.uo-title-button:focus-visible {
  outline: 3px solid var(--wp--preset--color--accent);
  outline-offset: 8px;
}

.uo-letter {
  display: inline-block;
  transform-origin: 50% 60%;
  transition: transform 620ms cubic-bezier(.2,.75,.2,1), opacity 260ms ease;
}

.uo-title-button.is-bursting .uo-letter {
  opacity: 0;
  transform: translate(var(--uo-x), var(--uo-y)) rotate(var(--uo-r)) scale(.45);
}

.uo-number {
  color: var(--wp--preset--color--accent);
  font-variant-numeric: tabular-nums;
}

.uo-tag {
  border: 1px solid var(--uo-border);
  border-radius: 999px;
  display: inline-block;
  padding: .35rem .7rem;
}

/* Personal editorial portfolio */
.uo-personal-hero,
.uo-page-hero,
.uo-case-hero,
.uo-section,
.uo-manifesto,
.uo-contact {
  padding: clamp(4rem, 9vw, 8rem) clamp(1rem, 3vw, 2rem);
}

.uo-personal-hero {
  min-height: calc(100vh - 82px);
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.uo-personal-hero::after {
  color: rgba(245,130,32,.12);
  content: "{ }";
  font-family: var(--wp--preset--font-family--mono);
  font-size: clamp(12rem, 32vw, 34rem);
  line-height: .8;
  position: absolute;
  right: -4vw;
  top: 14%;
  transform: translate3d(0, calc(var(--uo-hero-shift, 0) * 9rem), 0) rotate(calc(var(--uo-hero-shift, 0) * 7deg));
  transition: transform 80ms linear;
  z-index: -1;
}

.uo-personal-hero h1.has-display-font-size {
  font-family: var(--uo-display);
  font-size: clamp(2rem, 7.35vw, 7rem) !important;
  font-weight: 750;
  letter-spacing: -.06em;
  line-height: .92;
  margin: .45rem 0 2rem;
  max-width: none;
}

.uo-personal-hero .uo-title-button { white-space: nowrap; }

.uo-intro { max-width: 38rem; }

.uo-profile-panel { align-self: stretch; }

.uo-margin-note {
  border-left: 1px solid var(--uo-border);
  margin-left: clamp(0rem, 3vw, 3rem);
  max-width: 16rem;
  padding: 1rem 0 1rem 2rem;
}
.uo-margin-note p { font-size: .92rem; line-height: 1.45; }
.uo-margin-number { color: var(--wp--preset--color--accent); font-family: var(--wp--preset--font-family--mono); }
.uo-margin-note strong { font-family: var(--uo-display); font-size: 1.5rem; font-weight: 650; letter-spacing: -.03em; line-height: 1.08; }
.uo-margin-note .uo-place { color: var(--wp--preset--color--muted); margin-top: 3rem; }

.uo-hero-links { display: flex; flex-wrap: wrap; gap: .75rem 2rem; margin-top: 2.5rem; }
.uo-hero-links a,
.uo-contact-link { font-weight: 700; text-decoration-thickness: 2px; }

.uo-manifesto,
.uo-skill-map {
  background: var(--wp--preset--color--surface);
}

.uo-work { border-top: 1px solid var(--uo-border); }
.uo-projects-strip { background: #f3eee7; }

.uo-editorial-grid { gap: clamp(2.5rem, 8vw, 8rem); }

.uo-chapters-layout { align-items: flex-start !important; }
.uo-chapters-intro { position: sticky; top: 6rem; }
.uo-chapters-intro h2 { max-width: 10ch; }
.uo-chapters-intro > p:last-child { color: var(--wp--preset--color--muted); max-width: 24rem; }

.uo-chapter-list {
  border-bottom: 1px solid var(--uo-border);
  border-left: 1px solid var(--uo-border);
}

.uo-chapter-row {
  align-items: center;
  border-top: 1px solid var(--uo-border);
  color: inherit;
  display: grid;
  gap: clamp(.8rem, 2vw, 1.8rem);
  grid-template-columns: 2.4rem minmax(0, 1fr) minmax(7.5rem, 10rem) 1.5rem;
  min-height: 9rem;
  padding: 1.35rem 0 1.35rem clamp(1.2rem, 3vw, 2.5rem);
  text-decoration: none;
  transition: background-color 260ms ease, color 260ms ease, transform 420ms cubic-bezier(.16,1,.3,1);
}

.uo-chapter-index {
  color: var(--wp--preset--color--accent);
  font-family: var(--wp--preset--font-family--mono);
  font-size: .78rem;
}

.uo-chapter-copy small {
  color: var(--wp--preset--color--muted);
  display: block;
  font-family: var(--uo-display);
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .08em;
  margin-bottom: .45rem;
  text-transform: uppercase;
}

.uo-chapter-copy strong {
  display: block;
  font-family: var(--uo-display);
  font-size: clamp(1.25rem, 2.1vw, 2rem);
  font-weight: 650;
  letter-spacing: -.035em;
  line-height: 1.08;
}

.uo-chapter-result {
  color: var(--wp--preset--color--muted);
  font-size: .88rem;
  line-height: 1.35;
}

.uo-chapter-arrow {
  color: var(--wp--preset--color--accent);
  font-family: var(--uo-display);
  font-size: 1.3rem;
  transition: transform 320ms cubic-bezier(.16,1,.3,1);
}

.uo-chapter-row:hover,
.uo-chapter-row:focus-visible {
  background: var(--wp--preset--color--accent-soft);
  outline: none;
  transform: translateX(.45rem);
}
.uo-chapter-row:hover .uo-chapter-arrow,
.uo-chapter-row:focus-visible .uo-chapter-arrow { transform: translate(.2rem, -.2rem); }
.uo-text-link { font-weight: 700; text-decoration-thickness: 2px; }

.uo-mini-timeline { border-left: 1px solid var(--uo-border); }
.uo-timeline-item { padding: 0 0 2.5rem 2rem; position: relative; }
.uo-timeline-item::before { background: var(--wp--preset--color--accent); border-radius: 50%; content: ""; height: .7rem; left: -.38rem; position: absolute; top: .45rem; width: .7rem; }
.uo-timeline-item span { color: var(--wp--preset--color--muted); display: block; font-family: var(--wp--preset--font-family--mono); font-size: .8rem; }
.uo-timeline-item strong { display: block; font-size: 1.4rem; margin-top: .2rem; }
.uo-timeline-item p { margin-top: .35rem; }

.uo-simple-projects { margin-top: 3rem; }
.uo-simple-projects > .wp-block-column { border-top: 1px solid var(--uo-border); padding-top: 1.25rem; }
.uo-simple-projects h3 { font-family: var(--uo-display); font-size: 1.7rem; font-weight: 650; }
.uo-note { border-top: 1px solid var(--uo-border); padding: 1.5rem 0; }

.uo-contact { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }
.uo-contact a { color: inherit; }
.uo-contact .uo-kicker { color: var(--wp--preset--color--ink); }
.uo-contact h2 { font-family: var(--uo-display); font-weight: 650; max-width: 16ch; }

.uo-page-hero,
.uo-case-hero { border-bottom: 1px solid var(--uo-border); }
.uo-page-hero h1,
.uo-case-hero h1 { max-width: 12ch; }

.uo-case-meta { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 2rem; }
.uo-case-meta span { border: 1px solid var(--uo-border); border-radius: 999px; padding: .45rem .8rem; }
.uo-story { border-top: 1px solid var(--uo-border); gap: clamp(2rem, 7vw, 7rem); padding: clamp(2rem, 5vw, 4rem) 0; }
.uo-story h2 { font-size: clamp(1.6rem, 3vw, 2.7rem); }
.uo-pending-note { background: var(--wp--preset--color--accent-soft); border-left: 3px solid var(--wp--preset--color--accent); padding: 1rem; }

.uo-career-item {
  border-top: 1px solid var(--uo-border);
  display: grid;
  gap: clamp(2rem, 7vw, 7rem);
  grid-template-columns: minmax(14rem, 30%) 1fr;
  padding: clamp(2.5rem, 5vw, 4.5rem) 0;
  position: relative;
  transition: opacity 400ms ease;
}
.uo-career-item span,
.uo-project-index span { color: var(--wp--preset--color--accent); font-family: var(--wp--preset--font-family--mono); font-size: .8rem; text-transform: uppercase; }
.uo-career-item h2 { font-size: clamp(1.8rem, 4vw, 3.5rem); margin: .5rem 0; }
.uo-career-item > div:first-child p { color: var(--wp--preset--color--muted); }
.uo-career-item ul { margin: 1.25rem 0; padding-left: 1.2rem; }
.uo-career-item li { margin-bottom: .65rem; }
.uo-role-summary { font-size: clamp(1.15rem, 2vw, 1.4rem); line-height: 1.45; margin-top: 0; }
.uo-role-stack {
  border-top: 1px solid var(--uo-border);
  color: var(--wp--preset--color--muted);
  font-family: var(--wp--preset--font-family--mono);
  font-size: .76rem;
  letter-spacing: .015em;
  margin-top: 1.5rem;
  padding-top: 1rem;
}

/* Scroll narrative: movement follows the document and never hides content without JS. */
.uo-motion-ready .uo-scroll-reveal {
  filter: blur(7px);
  opacity: 0;
  transform: translate3d(0, 7rem, 0) scale(.96);
  transition:
    opacity 760ms cubic-bezier(.2,.7,.2,1) var(--uo-reveal-delay, 0ms),
    transform 1050ms cubic-bezier(.16,1,.3,1) var(--uo-reveal-delay, 0ms),
    filter 780ms ease var(--uo-reveal-delay, 0ms);
  will-change: opacity, transform, filter;
}

.uo-motion-ready .uo-scroll-reveal.is-visible {
  filter: blur(0);
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.uo-scroll-progress {
  background: var(--wp--preset--color--accent);
  height: 4px;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  transform: scaleX(0);
  transform-origin: 0 50%;
  z-index: 99999;
}

.uo-career {
  --uo-career-progress: 0;
  padding-left: 2.5rem;
  position: relative;
}

.uo-career::before,
.uo-career::after {
  content: "";
  left: 0;
  position: absolute;
  top: 0;
  width: 2px;
}

.uo-career::before { background: var(--uo-border); bottom: 0; }
.uo-career::after {
  background: var(--wp--preset--color--accent);
  height: calc(var(--uo-career-progress) * 100%);
  transition: height 90ms linear;
}

.uo-career-item::before {
  background: var(--wp--preset--color--base);
  border: 2px solid var(--wp--preset--color--accent);
  border-radius: 50%;
  content: "";
  height: .72rem;
  left: calc(-2.5rem - 5px);
  position: absolute;
  top: clamp(2.7rem, 5vw, 4.7rem);
  width: .72rem;
  z-index: 1;
}

.uo-motion-ready .uo-career-item:not(.is-current).is-visible { opacity: .48; }
.uo-motion-ready .uo-career-item.is-current { opacity: 1; }
.uo-motion-ready .uo-career-item.is-current::before {
  background: var(--wp--preset--color--accent);
  box-shadow: 0 0 0 .45rem rgba(245,130,32,.16);
  transform: scale(1.25);
}

.uo-chapter-row .uo-chapter-index { transition: transform 600ms cubic-bezier(.16,1,.3,1), color 300ms ease; }
.uo-motion-ready .uo-chapter-row.is-current .uo-chapter-index {
  color: var(--wp--preset--color--ink);
  transform: translateX(.55rem) scale(1.7);
}

.uo-motion-ready .uo-chapter-row.is-visible strong,
.uo-motion-ready .uo-career-item.is-visible h2 {
  animation: uo-heading-settle 900ms cubic-bezier(.16,1,.3,1) both;
}

@keyframes uo-heading-settle {
  from { letter-spacing: -.08em; transform: translateX(-.3rem); }
  to { letter-spacing: -.045em; transform: translateX(0); }
}

.uo-project-index { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.uo-project-index article { border: 1px solid var(--uo-border); margin: -1px 0 0 -1px; min-height: 20rem; padding: clamp(1.5rem, 4vw, 3rem); }
.uo-project-index h2 { font-size: clamp(1.8rem, 4vw, 3rem); }
.uo-project-index a { font-weight: 700; }

@media (max-width: 781px) {
  .uo-hero { min-height: auto; }
  .uo-personal-hero { min-height: auto; }
  .uo-profile-panel { display: block; }
  .uo-margin-note { margin: 2rem 0 0; max-width: none; }
  .uo-personal-hero h1.has-display-font-size { max-width: none; }
  .uo-chapters-intro { position: static; }
  .uo-chapter-list { border-left: 0; }
  .uo-chapter-row {
    grid-template-columns: 2rem minmax(0, 1fr) 1.5rem;
    min-height: 0;
    padding: 1.35rem 0;
  }
  .uo-chapter-result { display: none; }
  .uo-career-item { grid-template-columns: 1fr; gap: 1rem; }
  .uo-career { padding-left: 0; }
  .uo-career::before,
  .uo-career::after,
  .uo-career-item::before { display: none; }
  .uo-project-index { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {html:not(.uo-force-motion) { scroll-behavior: auto; }html:not(.uo-force-motion) *,
  html:not(.uo-force-motion) *::before,
  html:not(.uo-force-motion) *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }html:not(.uo-force-motion) .uo-scroll-reveal { opacity: 1 !important; transform: none !important; }html:not(.uo-force-motion) .uo-scroll-progress { display: none !important; }}

/* ------------------------------------------------------------------
   0.5.0 — Detalle y movimiento
   Todo lo que sigue es progresivo: sin JS o con reduced-motion el
   contenido se ve completo y estático.
   ------------------------------------------------------------------ */

/* Navegación entre páginas: el nombre viaja del hero a la cabecera. */
@view-transition { navigation: auto; }
.uo-wordmark { view-transition-name: uo-wordmark; }
.uo-scroll-progress { view-transition-name: uo-progress; }

/* Cabecera: se compacta y difumina el fondo al hacer scroll. */
.uo-site-header {
  transition: padding 320ms cubic-bezier(.16,1,.3,1), background-color 320ms ease, border-color 320ms ease;
  z-index: 50;
}
.uo-site-header.is-scrolled {
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
  background-color: rgba(251,250,247,.78) !important;
  padding-bottom: 10px !important;
  padding-top: 10px !important;
}
.uo-site-header .wp-block-navigation__responsive-container-open,
.uo-site-header .wp-block-navigation__responsive-container-close { color: var(--wp--preset--color--ink); }
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open {
  background: var(--wp--preset--color--canvas);
  font-family: var(--uo-display);
  font-size: clamp(1.6rem, 6vw, 2.4rem);
  font-weight: 650;
  letter-spacing: -.03em;
}
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1.2rem; }
/* WordPress copia el tamaño de letra del nav como estilo inline en contenedor e ítems; el overlay lo hereda del bloque abierto. */
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { font-size: inherit !important; }

/* Enlaces: subrayado que se dibuja. */
.uo-hero-links a,
.uo-text-link,
.uo-contact-link,
.uo-project-index a {
  background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 100% 2px;
  padding-bottom: .12em;
  text-decoration: none;
  transition: background-size 420ms cubic-bezier(.16,1,.3,1), background-position 0s 420ms;
}
.uo-hero-links a:hover,
.uo-text-link:hover,
.uo-contact-link:hover,
.uo-project-index a:hover {
  background-position: 100% 100%;
  background-size: 0 2px;
  transition: background-size 420ms cubic-bezier(.16,1,.3,1), background-position 0s;
}
.uo-hero-links a:hover { animation: uo-underline-redraw 900ms cubic-bezier(.16,1,.3,1) 420ms both; }
@keyframes uo-underline-redraw {
  from { background-position: 0 100%; background-size: 0 2px; }
  to { background-position: 0 100%; background-size: 100% 2px; }
}

/* Hero: entrada editorial línea a línea. */
.uo-js .uo-hero-reveal {
  animation: uo-rise 1100ms cubic-bezier(.16,1,.3,1) both;
  animation-delay: calc(var(--uo-i, 0) * 110ms + 120ms);
}
.uo-js .uo-personal-hero h1.has-display-font-size { overflow: hidden; padding-bottom: .08em; margin-bottom: 1.5rem; }
.uo-js .uo-personal-hero h1.is-settled { overflow: visible; }
.uo-js .uo-personal-hero h1 .uo-title-button {
  animation: uo-mask-up 1100ms cubic-bezier(.16,1,.3,1) 200ms both;
}
.uo-js .uo-personal-hero::after {
  animation: uo-brace-in 1600ms cubic-bezier(.16,1,.3,1) 500ms both;
}
@keyframes uo-rise {
  from { opacity: 0; translate: 0 1.6rem; filter: blur(4px); }
  to { opacity: 1; translate: 0 0; filter: blur(0); }
}
@keyframes uo-mask-up {
  from { translate: 0 110%; }
  to { translate: 0 0; }
}
@keyframes uo-brace-in {
  from { opacity: 0; scale: .82; }
  to { opacity: 1; scale: 1; }
}

/* Hero: hacia dónde va el siguiente capítulo. */
.uo-next-role {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  font-family: var(--uo-display);
  font-size: clamp(1rem, 1.6vw, 1.25rem);
  font-weight: 650;
  gap: .5rem .6rem;
  letter-spacing: -.02em;
  margin-top: 1.6rem;
}
.uo-next-role-label { color: var(--wp--preset--color--muted); font-weight: 600; }
.uo-role-rotator { display: inline-grid; position: relative; }
.uo-role-rotator > span {
  color: var(--wp--preset--color--accent);
  filter: blur(3px);
  grid-area: 1 / 1;
  opacity: 0;
  transition: opacity 520ms cubic-bezier(.2,.7,.2,1), translate 720ms cubic-bezier(.16,1,.3,1), filter 520ms ease;
  translate: 0 .55em;
  white-space: nowrap;
}
.uo-role-rotator > span.is-leaving { opacity: 0; translate: 0 -.55em; filter: blur(3px); }
.uo-role-rotator > span.is-active { opacity: 1; translate: 0 0; filter: blur(0); }
.uo-role-rotator.is-static { display: inline; }
.uo-role-rotator.is-static > span { filter: none; opacity: 1; translate: none; white-space: normal; }
.uo-role-rotator.is-static > span:not(:last-child)::after { color: var(--wp--preset--color--muted); content: " · "; }
.uo-visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

/* Cifras. */
.uo-numbers {
  border-bottom: 1px solid var(--uo-border);
  border-top: 1px solid var(--uo-border);
  padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1rem, 3vw, 2rem);
}
.uo-numbers-grid {
  display: grid;
  gap: 1.5rem clamp(1rem, 3vw, 3rem);
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}
.uo-figure { border-left: 1px solid var(--uo-border); padding-left: 1rem; }
.uo-figure strong {
  color: var(--wp--preset--color--ink);
  display: block;
  font-family: var(--uo-display);
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  letter-spacing: -.05em;
  line-height: 1;
}
.uo-figure strong sup { color: var(--wp--preset--color--accent); font-size: .5em; margin-left: .05em; vertical-align: .55em; }
.uo-figure span { color: var(--wp--preset--color--muted); display: block; font-size: .9rem; line-height: 1.35; margin-top: .5rem; }

/* Capítulos: foco que sigue al puntero. */
.uo-chapter-row { position: relative; }
.uo-chapter-row::before {
  background: radial-gradient(14rem circle at var(--mx, 50%) var(--my, 50%), rgba(245,130,32,.22), transparent 62%);
  content: "";
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity 360ms ease;
}
.uo-chapter-row:hover::before,
.uo-chapter-row:focus-visible::before { opacity: 1; }
.uo-chapter-row > * { position: relative; }

/* Cómo trabajo con agentes. */
.uo-agents { background: var(--wp--preset--color--surface); border-top: 1px solid var(--uo-border); }
.uo-agents-intro p:last-of-type { color: var(--wp--preset--color--muted); }
.uo-pipeline {
  counter-reset: uo-step;
  display: grid;
  gap: 2.25rem 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  list-style: none;
  margin: clamp(2rem, 4vw, 3.5rem) 0 0;
  padding: 0;
}
.uo-pipeline li {
  --uo-i: 0;
  border-top: 2px solid var(--uo-border);
  counter-increment: uo-step;
  padding-top: 1.1rem;
  position: relative;
}
.uo-pipeline li::before {
  color: var(--wp--preset--color--accent);
  content: counter(uo-step, decimal-leading-zero);
  display: block;
  font-family: var(--wp--preset--font-family--mono);
  font-size: .78rem;
  margin-bottom: .6rem;
}
.uo-pipeline li::after {
  background: var(--wp--preset--color--accent);
  border-radius: 999px;
  content: "";
  height: 2px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: -2px;
  width: 2.5rem;
}
.uo-pipeline.is-visible li::after {
  animation: uo-packet 5400ms cubic-bezier(.45,0,.2,1) infinite;
  animation-delay: calc(var(--uo-i) * 900ms);
}
@keyframes uo-packet {
  0% { left: 0; opacity: 0; }
  6% { opacity: 1; }
  16% { left: calc(100% - 2.5rem); opacity: 1; }
  18% { opacity: 0; }
  100% { left: calc(100% - 2.5rem); opacity: 0; }
}
.uo-pipeline li.is-lead { border-top-color: var(--wp--preset--color--accent); }
.uo-pipeline li.is-lead::before { content: "Lead"; }
.uo-pipeline small {
  color: var(--wp--preset--color--muted);
  display: block;
  font-family: var(--uo-display);
  font-size: .7rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.uo-pipeline strong {
  display: block;
  font-family: var(--uo-display);
  font-size: 1.15rem;
  font-weight: 650;
  letter-spacing: -.02em;
  line-height: 1.15;
  margin: .3rem 0 .4rem;
}
.uo-pipeline p { font-size: .9rem; line-height: 1.4; margin: 0; }
.uo-pipeline-caption { color: var(--wp--preset--color--muted); font-size: .85rem; margin-top: 1.5rem; }

/* Trayectoria: el año acompaña al scroll. */
.uo-year-marker {
  bottom: clamp(1rem, 4vh, 3rem);
  color: var(--wp--preset--color--accent);
  font-family: var(--uo-display);
  font-size: clamp(2.6rem, 6vw, 5.5rem);
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  left: clamp(1rem, 3vw, 2.5rem);
  letter-spacing: -.06em;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  transition: opacity 400ms ease;
  z-index: 5;
}
.uo-year-marker.is-visible { opacity: .28; }
.uo-year-marker.is-flipping { animation: uo-year-flip 520ms cubic-bezier(.16,1,.3,1); }
@keyframes uo-year-flip {
  0% { translate: 0 0; filter: blur(0); }
  40% { translate: 0 -.35em; filter: blur(4px); opacity: .05; }
  41% { translate: 0 .35em; }
  100% { translate: 0 0; filter: blur(0); }
}

/* Contacto: entra como una hoja que se aplana (solo CSS, scroll-driven). */
@supports (animation-timeline: view()) {
  .uo-js .uo-contact {
    animation: uo-sheet linear both;
    animation-range: entry 0% entry 70%;
    animation-timeline: view();
    transform-origin: 50% 100%;
  }
  @keyframes uo-sheet {
    from { border-radius: 2.5rem 2.5rem 0 0; scale: .965 1; }
    to { border-radius: 0; scale: 1 1; }
  }
}

/* Pie: hora local y nota de autoría. */
.uo-footer-meta { color: var(--wp--preset--color--muted); display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; margin-top: 1.25rem; width: 100%; }
.uo-footer-meta span { font-family: var(--wp--preset--font-family--mono); font-size: .76rem; }
.uo-local-time::before { animation: uo-blink 2s steps(2, start) infinite; background: var(--wp--preset--color--accent); border-radius: 50%; content: ""; display: inline-block; height: .45em; margin-right: .5em; width: .45em; }
@keyframes uo-blink { to { visibility: hidden; } }

@media (max-width: 781px) {
  .uo-year-marker { display: none; }
  .uo-pipeline { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .uo-pipeline { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {html:not(.uo-force-motion) .uo-js .uo-hero-reveal,
  html:not(.uo-force-motion) .uo-js .uo-personal-hero h1 .uo-title-button,
  html:not(.uo-force-motion) .uo-js .uo-personal-hero::after,
  html:not(.uo-force-motion) .uo-js .uo-contact { animation: none !important; }html:not(.uo-force-motion) .uo-pipeline.is-visible li::after { animation: none !important; opacity: 0; }html:not(.uo-force-motion) .uo-year-marker { display: none; }html:not(.uo-force-motion) .uo-local-time::before { animation: none; }}

/* 0.6.0 — CV directo */
.uo-facts { margin: 0; }
.uo-facts div + div { margin-top: 1.1rem; }
.uo-facts dt { color: var(--wp--preset--color--accent); font-family: var(--wp--preset--font-family--mono); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; }
.uo-facts dd { font-family: var(--uo-display); font-size: 1.02rem; font-weight: 650; letter-spacing: -.02em; line-height: 1.25; margin: .2rem 0 0; }
.uo-principles { counter-reset: uo-p; list-style: none; margin: 1.75rem 0 0; padding: 0; }
.uo-principles li { border-top: 1px solid var(--uo-border); counter-increment: uo-p; font-family: var(--uo-display); font-size: .98rem; font-weight: 600; letter-spacing: -.015em; line-height: 1.3; padding: .75rem 0 .75rem 2.2rem; position: relative; }
.uo-principles li::before { color: var(--wp--preset--color--accent); content: counter(uo-p, decimal-leading-zero); font-family: var(--wp--preset--font-family--mono); font-size: .74rem; font-weight: 400; left: 0; position: absolute; top: .95rem; }
.uo-featured-story { background: var(--wp--preset--color--accent-soft); padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.uo-featured { display: grid; gap: clamp(1.5rem, 5vw, 5rem); grid-template-columns: minmax(14rem, 30%) 1fr; }
.uo-featured h2 { font-size: clamp(1.6rem, 3vw, 2.6rem); margin-top: .5rem; }
.uo-featured p + p { margin-top: 1rem; }
@media (max-width: 781px) { .uo-featured { grid-template-columns: 1fr; } }

/* 0.7.0 — Contacto */
.uo-contact-grid { align-items: flex-start !important; }
.uo-contact-ways { list-style: none; margin: 1.5rem 0 0; padding: 0; }
.uo-contact-ways li + li { margin-top: .6rem; }
.uo-contact-ways .uo-contact-link { font-family: var(--uo-display); font-size: 1.2rem; }
.uo-form { display: grid; gap: 1rem; }
.uo-form-grid { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }
.uo-form label { display: grid; gap: .35rem; }
.uo-form label > span { font-family: var(--uo-display); font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.uo-form input:not([type="hidden"]),
.uo-form textarea {
  background: rgba(255,255,255,.55);
  border: 0;
  border-bottom: 2px solid var(--wp--preset--color--ink);
  border-radius: 0;
  color: var(--wp--preset--color--ink);
  font: inherit;
  padding: .7rem .8rem;
  transition: background-color 240ms ease, box-shadow 240ms ease;
  width: 100%;
}
.uo-form textarea { resize: vertical; }
.uo-form input:focus-visible,
.uo-form textarea:focus-visible { background: #fff; box-shadow: 0 0 0 3px rgba(34,31,28,.25); outline: none; }
.uo-form-hp { position: absolute; left: -9999px; }
.uo-form-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; }
.uo-form button {
  background: var(--wp--preset--color--ink);
  border: 0;
  color: var(--wp--preset--color--surface);
  cursor: pointer;
  font-family: var(--uo-display);
  font-size: .95rem;
  font-weight: 650;
  padding: .9rem 1.6rem;
  transition: transform 280ms cubic-bezier(.16,1,.3,1), opacity 200ms ease;
}
.uo-form button:hover { transform: translateY(-2px); }
.uo-form button:focus-visible { outline: 3px solid var(--wp--preset--color--surface); outline-offset: 3px; }
.uo-form button[disabled] { cursor: progress; opacity: .6; transform: none; }
.uo-form-status { font-weight: 650; margin: 0; min-height: 1.5em; }
.uo-form-status:empty { display: none; }
@media (max-width: 600px) { .uo-form-grid { grid-template-columns: 1fr; } }

/* 0.7.1 — Formación */
.uo-education { border-top: 1px solid var(--uo-border); }
.uo-edu-grid { display: grid; gap: 2rem clamp(1.5rem, 4vw, 4rem); grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); margin-top: 2rem; }
.uo-edu-grid h3 { font-family: var(--uo-display); font-size: 1.1rem; font-weight: 700; margin-bottom: .75rem; }
.uo-plain-list { list-style: none; margin: 0; padding: 0; }
.uo-plain-list li { border-top: 1px solid var(--uo-border); padding: .7rem 0; }
.uo-plain-list strong { display: block; font-weight: 650; }
.uo-plain-list span { color: var(--wp--preset--color--muted); display: block; font-family: var(--wp--preset--font-family--mono); font-size: .78rem; margin-top: .15rem; }

/* 0.7.2 — Retrato */
.uo-portrait { border-radius: 50%; box-shadow: 0 0 0 4px var(--wp--preset--color--canvas), 0 0 0 5px var(--uo-border); display: block; height: auto; margin-bottom: 1.5rem; width: clamp(7rem, 10vw, 10rem); }
@media (max-width: 781px) { .uo-portrait { width: 7rem; } }

/* 0.8.0 — Estado de los proyectos */
.uo-status { color: var(--wp--preset--color--accent); display: block; font-family: var(--wp--preset--font-family--mono); font-size: .76rem; letter-spacing: .02em; margin: 0 0 .5rem; text-transform: uppercase; }
.uo-project-index .uo-status { margin: -.25rem 0 .75rem; }

/* 0.9.0 — Momentos */
.uo-moments { counter-reset: uo-m; display: grid; gap: clamp(1.5rem, 3vw, 2.5rem) clamp(1.5rem, 4vw, 4rem); grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); list-style: none; margin: 2.5rem 0 0; padding: 0; }
.uo-moments li { border-top: 2px solid var(--wp--preset--color--accent); counter-increment: uo-m; padding-top: 1.1rem; position: relative; }
.uo-moments li::before { color: var(--wp--preset--color--accent); content: counter(uo-m, decimal-leading-zero); font-family: var(--wp--preset--font-family--mono); font-size: .78rem; position: absolute; right: 0; top: 1.1rem; }
.uo-moment-when { color: var(--wp--preset--color--muted); display: block; font-family: var(--wp--preset--font-family--mono); font-size: .78rem; text-transform: uppercase; }
.uo-moments h3 { font-family: var(--uo-display); font-size: clamp(1.3rem, 2vw, 1.7rem); font-weight: 650; letter-spacing: -.03em; line-height: 1.1; margin: .5rem 0 .8rem; max-width: 22ch; }
.uo-moments p { margin: 0 0 .7rem; }
.uo-moments-note { border-top: 1px solid var(--uo-border); color: var(--wp--preset--color--muted); font-family: var(--uo-display); font-size: 1.05rem; font-weight: 600; letter-spacing: -.02em; margin-top: 2.5rem; padding-top: 1.25rem; }
.uo-featured-story .uo-featured { display: none; }

/* ------------------------------------------------------------------
   1.0.0 — Home en cinco bloques y movimiento con presencia
   ------------------------------------------------------------------ */

/* Hero */
.uo-personal-hero .uo-intro { max-width: 34rem; }
.uo-scroll-cue {
  align-items: center;
  bottom: 1.5rem;
  color: var(--wp--preset--color--muted);
  display: flex;
  flex-direction: column;
  font-family: var(--wp--preset--font-family--mono);
  font-size: .72rem;
  gap: .5rem;
  left: 50%;
  letter-spacing: .12em;
  position: absolute;
  text-decoration: none;
  text-transform: uppercase;
  translate: -50% 0;
}
.uo-scroll-cue i { background: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent)) no-repeat 0 0 / 100% 40%, var(--uo-border); display: block; height: 3rem; width: 1px; }
.uo-motion-ready .uo-scroll-cue i { animation: uo-cue 2200ms cubic-bezier(.65,0,.35,1) infinite; }
@keyframes uo-cue { 0% { background-position: 0 -3rem; } 55% { background-position: 0 3rem; } 100% { background-position: 0 3rem; } }

/* Titulares que entran palabra a palabra */
.uo-split .uo-w { display: inline-block; overflow: hidden; padding-bottom: .12em; margin-bottom: -.12em; vertical-align: top; }
.uo-split .uo-w > span { display: inline-block; }
.uo-motion-ready .uo-split .uo-w > span { translate: 0 110%; transition: translate 1000ms cubic-bezier(.16,1,.3,1) calc(var(--uo-wi, 0) * 55ms); }
.uo-motion-ready .uo-split.is-visible .uo-w > span { translate: 0 0; }

.uo-section-head { max-width: 46rem; }
.uo-section-head h2 { margin-top: .6rem; }
.uo-section-lead { color: var(--wp--preset--color--muted); font-size: 1.15rem; margin-top: 1rem; }
.uo-section-foot { margin-top: clamp(2rem, 4vw, 3rem); }

/* Cifras: cuatro, grandes */
.uo-numbers-grid { grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.uo-figure strong { font-size: clamp(2.6rem, 5vw, 4.4rem); }
.uo-figure strong em { color: var(--wp--preset--color--accent); font-style: normal; font-weight: 400; margin: 0 .05em; }

/* Tres pruebas: tarjetas que se apilan */
.uo-proof { background: var(--wp--preset--color--canvas); }
.uo-stack { display: grid; gap: 1.5rem; margin-top: clamp(2.5rem, 5vw, 4rem); }
.uo-card {
  --uo-cover: 0;
  align-items: center;
  background: var(--wp--preset--color--surface);
  border: 1px solid var(--uo-border);
  box-shadow: 0 30px 60px -40px rgba(34,31,28,.35);
  color: inherit;
  display: grid;
  gap: clamp(1.5rem, 4vw, 4rem);
  grid-template-columns: 3rem minmax(0, 1fr) minmax(12rem, 16rem);
  min-height: 24rem;
  padding: clamp(1.75rem, 4vw, 3.5rem);
  position: sticky;
  text-decoration: none;
  top: calc(5.5rem + var(--uo-i) * 1.25rem);
  transform-origin: 50% 0;
  transition: background-color 300ms ease, border-color 300ms ease;
}
.uo-motion-ready .uo-card { scale: calc(1 - var(--uo-cover) * .05); filter: brightness(calc(1 - var(--uo-cover) * .12)); }
.uo-card:hover { border-color: var(--wp--preset--color--accent); }
.uo-card-index { color: var(--wp--preset--color--accent); font-family: var(--wp--preset--font-family--mono); font-size: .85rem; align-self: start; }
.uo-card-body small { color: var(--wp--preset--color--muted); display: block; font-family: var(--uo-display); font-size: .74rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.uo-card-body h3 { font-family: var(--uo-display); font-size: clamp(1.6rem, 3vw, 2.6rem); font-weight: 650; letter-spacing: -.04em; line-height: 1.05; margin: .6rem 0 1rem; max-width: 18ch; }
.uo-card-body p { color: var(--wp--preset--color--muted); font-size: 1.05rem; max-width: 40rem; }
.uo-card-link { color: var(--wp--preset--color--ink); display: inline-block; font-weight: 700; margin-top: 1.25rem; transition: translate 300ms cubic-bezier(.16,1,.3,1); }
.uo-card:hover .uo-card-link { translate: .4rem 0; }
.uo-card-metric { border-left: 1px solid var(--uo-border); padding-left: clamp(1rem, 2vw, 2rem); }
.uo-card-metric strong { color: var(--wp--preset--color--accent); display: block; font-family: var(--uo-display); font-size: clamp(3rem, 6vw, 5.5rem); font-weight: 750; letter-spacing: -.06em; line-height: .95; }
.uo-card-metric strong sup { font-size: .32em; letter-spacing: -.02em; margin-left: .1em; vertical-align: .9em; }
.uo-card-metric span { color: var(--wp--preset--color--muted); display: block; font-size: .95rem; line-height: 1.35; margin-top: .6rem; }

/* Cómo trabajo: bloque oscuro */
.uo-dark { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--canvas); }
.uo-dark .uo-kicker { color: var(--wp--preset--color--accent); }
.uo-dark .uo-section-lead { color: rgba(251,250,247,.62); }
.uo-dark a { color: var(--wp--preset--color--canvas); }
.uo-dark-grid { display: grid; gap: clamp(2.5rem, 6vw, 6rem); grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); margin-top: clamp(2.5rem, 5vw, 4rem); }
.uo-principles-xl { counter-reset: uo-p; list-style: none; margin: 0; padding: 0; }
.uo-principles-xl li {
  border-top: 1px solid rgba(251,250,247,.14);
  counter-increment: uo-p;
  font-family: var(--uo-display);
  font-size: clamp(1.3rem, 2.2vw, 1.9rem);
  font-weight: 650;
  letter-spacing: -.03em;
  line-height: 1.15;
  padding: 1.25rem 0 1.25rem 3rem;
  position: relative;
  transition: opacity 500ms ease, translate 700ms cubic-bezier(.16,1,.3,1);
}
.uo-principles-xl li::before { color: var(--wp--preset--color--accent); content: counter(uo-p, decimal-leading-zero); font-family: var(--wp--preset--font-family--mono); font-size: .8rem; font-weight: 400; left: 0; position: absolute; top: 1.55rem; }
.uo-motion-ready .uo-principles-xl li { opacity: .28; }
.uo-motion-ready .uo-principles-xl li.is-current { opacity: 1; translate: .5rem 0; }
.uo-dark .uo-pipeline { margin-top: 0; }
.uo-dark .uo-pipeline li { border-top-color: rgba(251,250,247,.18); }
.uo-dark .uo-pipeline small, .uo-dark .uo-pipeline p { color: rgba(251,250,247,.62); }
.uo-dark .uo-pipeline-caption { color: rgba(251,250,247,.62); }
.uo-dark .uo-pipeline-caption a { border-bottom: 1px solid var(--wp--preset--color--accent); text-decoration: none; }

/* Interruptor de movimiento en el pie */
.uo-motion-toggle { appearance: none; background: none; border: 0; color: inherit; cursor: pointer; font: inherit; padding: 0; text-decoration: underline dotted; text-underline-offset: .2em; }
.uo-motion-toggle:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 3px; }

@media (max-width: 781px) {
  .uo-scroll-cue { display: none; }
  .uo-card { grid-template-columns: 2rem minmax(0, 1fr); min-height: 0; position: relative; top: auto; }
  .uo-card-metric { border-left: 0; border-top: 1px solid var(--uo-border); grid-column: 2; padding: 1rem 0 0; }
  .uo-dark-grid { grid-template-columns: 1fr; }
}

/* Movimiento reducido: por preferencia del sistema (salvo que el visitante lo active) o por elección explícita. */
@media (prefers-reduced-motion: reduce) {
  html:not(.uo-force-motion) .uo-js .uo-hero-reveal,
  html:not(.uo-force-motion) .uo-scroll-cue i { animation: none !important; }
}
html.uo-reduce .uo-hero-reveal,
html.uo-reduce .uo-personal-hero h1 .uo-title-button,
html.uo-reduce .uo-personal-hero::after,
html.uo-reduce .uo-contact,
html.uo-reduce .uo-scroll-cue i,
html.uo-reduce .uo-pipeline li::after { animation: none !important; }
html.uo-reduce .uo-scroll-reveal { filter: none !important; opacity: 1 !important; transform: none !important; }
html.uo-reduce .uo-split .uo-w > span { translate: 0 0 !important; transition: none !important; }
html.uo-reduce .uo-card { filter: none !important; scale: 1 !important; }
html.uo-reduce .uo-principles-xl li { opacity: 1 !important; translate: 0 0 !important; }
html.uo-reduce .uo-scroll-progress, html.uo-reduce .uo-year-marker { display: none !important; }

.uo-motion-ready .uo-split.uo-scroll-reveal { filter: none; opacity: 1; transform: none; }

/* 1.1.0 — Cinco tarjetas */
.uo-card { min-height: 21rem; }
.uo-card-metric strong em { color: var(--wp--preset--color--muted); font-style: normal; font-weight: 400; margin: 0 .04em; }

/* 1.1.1 — La cabecera acompaña todo el scroll. El sticky del grupo solo actuaba dentro
   de su propio contenedor (la template part), así que el sticky va en el contenedor. */
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }

/* 1.2.0 — Los tres roles siempre visibles */
.uo-roles { color: var(--wp--preset--color--accent); }

/* 1.2.1 — Una llave a cada lado del hero; bajan con el scroll a ritmos distintos */
.uo-personal-hero::before,
.uo-personal-hero::after {
  color: rgba(245,130,32,.12);
  font-family: var(--wp--preset--font-family--mono);
  font-size: clamp(12rem, 30vw, 32rem);
  line-height: .8;
  pointer-events: none;
  position: absolute;
  top: 10%;
  transition: transform 80ms linear;
  z-index: -1;
}
.uo-personal-hero::before {
  content: "{";
  left: -1vw;
  right: auto;
  transform: translate3d(0, calc(var(--uo-hero-shift, 0) * 10rem), 0) rotate(calc(var(--uo-hero-shift, 0) * -5deg));
}
.uo-personal-hero::after {
  content: "}";
  left: auto;
  right: -1vw;
  transform: translate3d(0, calc(var(--uo-hero-shift, 0) * 15rem), 0) rotate(calc(var(--uo-hero-shift, 0) * 5deg));
}
.uo-js .uo-personal-hero::before { animation: uo-brace-in 1600ms cubic-bezier(.16,1,.3,1) 420ms both; }
html.uo-reduce .uo-personal-hero::before { animation: none !important; }
@media (max-width: 781px) {
  .uo-personal-hero::before, .uo-personal-hero::after { font-size: 34vw; top: 4%; }
  .uo-personal-hero::before { left: -4vw; }
  .uo-personal-hero::after { right: -4vw; }
}

/* 1.2.2 — Las llaves abrazan la ficha (foto + datos), como en el CV; ya no flotan por el hero */
.uo-personal-hero::before,
.uo-personal-hero::after { content: none; }
.uo-margin-note { border-left: 0; padding-left: 0; position: relative; }
.uo-margin-note::before,
.uo-margin-note::after {
  color: rgba(245,130,32,.16);
  font-family: var(--wp--preset--font-family--mono);
  font-size: clamp(9rem, 13vw, 15rem);
  line-height: .8;
  pointer-events: none;
  position: absolute;
  top: 50%;
  z-index: -1;
  transition: transform 80ms linear;
}
.uo-margin-note::before {
  content: "{";
  left: -.62em;
  transform: translate3d(0, calc(-50% + var(--uo-hero-shift, 0) * 6rem), 0) rotate(calc(var(--uo-hero-shift, 0) * -4deg));
}
.uo-margin-note::after {
  content: "}";
  right: -.62em;
  transform: translate3d(0, calc(-50% + var(--uo-hero-shift, 0) * 9rem), 0) rotate(calc(var(--uo-hero-shift, 0) * 4deg));
}
.uo-js .uo-margin-note::before,
.uo-js .uo-margin-note::after { animation: uo-brace-in 1600ms cubic-bezier(.16,1,.3,1) 700ms both; }
html.uo-reduce .uo-margin-note::before,
html.uo-reduce .uo-margin-note::after { animation: none !important; }
@media (max-width: 781px) {
  .uo-margin-note { margin-top: 3rem; padding: 0 2.5rem; }
  .uo-margin-note::before, .uo-margin-note::after { font-size: 8rem; }
  .uo-margin-note::before { left: -.1em; }
  .uo-margin-note::after { right: -.1em; }
}

/* 1.2.3 — Llaves dibujadas (SVG) que se estiran a la altura exacta de la ficha */
.uo-margin-note::before,
.uo-margin-note::after {
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 40 200%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M34 2C20 2 20 12 20 28L20 84C20 94 14 100 4 100C14 100 20 106 20 116L20 172C20 188 20 198 34 198%22 fill=%22none%22 stroke=%22%23f58220%22 stroke-width=%222.5%22 stroke-linecap=%22round%22 vector-effect=%22non-scaling-stroke%22/%3E%3C/svg%3E") no-repeat center / 100% 100%;
  bottom: -.75rem;
  color: transparent;
  content: "";
  font-size: 0;
  left: auto;
  opacity: .55;
  right: auto;
  top: -.75rem;
  width: 2.2rem;
}
.uo-margin-note::before {
  left: -2.6rem;
  transform: translate3d(0, calc(var(--uo-hero-shift, 0) * 5rem), 0);
}
.uo-margin-note::after {
  right: -2.6rem;
  transform: translate3d(0, calc(var(--uo-hero-shift, 0) * 8rem), 0) scaleX(-1);
}
.uo-margin-note { max-width: 17rem; padding: .25rem 0; }
@keyframes uo-brace-draw {
  from { opacity: 0; scale: 1 .6; }
  to { opacity: .55; scale: 1 1; }
}
.uo-js .uo-margin-note::before,
.uo-js .uo-margin-note::after { animation: uo-brace-draw 1400ms cubic-bezier(.16,1,.3,1) 800ms both; }
@media (max-width: 781px) {
  .uo-margin-note { margin: 3rem auto 0; max-width: 22rem; padding: .5rem 0; }
  .uo-margin-note::before, .uo-margin-note::after { width: 1.6rem; }
  .uo-margin-note::before { left: -2.2rem; }
  .uo-margin-note::after { right: -2.2rem; }
}

/* 1.2.4 — Menú móvil. El backdrop-filter de la cabecera convertía a ésta en el bloque contenedor del
   overlay (position: fixed), así que el menú quedaba encajado en los 60 px de la cabecera y solo
   asomaba "Inicio". El desenfoque pasa a un pseudo-elemento sin descendientes. */
.uo-site-header { isolation: isolate; position: relative; }
.uo-site-header::before {
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
  background: rgba(251,250,247,.78);
  content: "";
  inset: 0;
  opacity: 0;
  position: absolute;
  transition: opacity 320ms ease;
  z-index: -1;
}
.uo-site-header.is-scrolled { -webkit-backdrop-filter: none; backdrop-filter: none; background-color: transparent !important; }
.uo-site-header.is-scrolled::before { opacity: 1; }
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open {
  font-size: clamp(1.35rem, 5vw, 1.8rem);
  inset: 0;
  line-height: 1.2;
  overflow-y: auto;
  padding: 5rem 1.5rem 2rem;
  position: fixed;
}
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; display: flex; flex-direction: column; gap: 1rem; padding: 0; }
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { display: flex; flex-direction: column; gap: .9rem; }
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: .2rem 0; }
.uo-site-header .wp-block-navigation__responsive-container-close { right: 1.25rem; top: 1.25rem; }

/* 1.2.5 — Menú móvil alineado a la izquierda, cierre en la esquina */
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; justify-content: flex-start !important; text-align: left; }
.uo-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { justify-content: flex-start; }
.uo-site-header .wp-block-navigation__responsive-container-close { position: fixed; right: 1.25rem; top: 1.1rem; }

/* ------------------------------------------------------------------
   1.3.0 — Noticias y artículos
   ------------------------------------------------------------------ */
.uo-news-section { padding-top: clamp(2rem, 4vw, 3.5rem); }
.uo-news-list { display: grid; gap: 0; grid-template-columns: 1fr; margin: 0; padding: 0; }
.uo-news-item { border-top: 1px solid var(--uo-border); display: grid; gap: .4rem 3rem; grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr); padding: clamp(1.5rem, 3vw, 2.25rem) 0; }
.uo-news-item .uo-news-meta { grid-row: 1 / 3; }
.uo-news-meta { align-items: baseline; color: var(--wp--preset--color--muted); font-family: var(--wp--preset--font-family--mono); font-size: .78rem; gap: .5rem 1rem !important; text-transform: uppercase; }
.uo-news-meta .wp-block-post-date { margin: 0; }
.uo-news-meta .wp-block-post-terms { margin: 0; }
.uo-news-meta .wp-block-post-terms a { border-bottom: 1px solid transparent; color: var(--wp--preset--color--accent); text-decoration: none; }
.uo-news-meta .wp-block-post-terms a:hover { border-bottom-color: currentColor; }
.uo-news-item .uo-news-meta { flex-direction: column; }
.uo-news-title { font-family: var(--uo-display); font-size: clamp(1.25rem, 2.2vw, 1.7rem) !important; font-weight: 650; letter-spacing: -.03em; line-height: 1.15; margin: 0; }
.uo-news-title a { text-decoration: none; transition: color 200ms ease; }
.uo-news-title a:hover { color: var(--wp--preset--color--accent); }
.uo-news-excerpt { color: var(--wp--preset--color--muted); font-size: .98rem; margin: 0; max-width: 48rem; }
.uo-news-excerpt p { margin: 0; }
.uo-news-excerpt .wp-block-post-excerpt__more-link { color: var(--wp--preset--color--ink); display: inline-block; font-weight: 700; margin-top: .4rem; text-decoration: none; }
.uo-pagination { border-top: 1px solid var(--uo-border); font-family: var(--uo-display); font-size: .9rem; font-weight: 650; margin-top: 1rem; padding-top: 1.5rem; }
.uo-pagination a { text-decoration: none; }
.uo-pagination .page-numbers { margin: 0 .35rem; }
.uo-pagination .page-numbers.current { color: var(--wp--preset--color--accent); }

/* Artículo */
.uo-post { padding: clamp(3rem, 6vw, 5rem) clamp(1rem, 3vw, 2rem) clamp(4rem, 8vw, 7rem); }
.uo-post-head { margin-bottom: 2rem; }
.uo-post-title { font-size: clamp(1.9rem, 4.2vw, 3.4rem) !important; letter-spacing: -.04em; line-height: 1.05; margin: .9rem 0 1.25rem; }
.uo-auto-note { border-left: 3px solid var(--wp--preset--color--accent); color: var(--wp--preset--color--muted); font-size: .88rem; margin: 0; padding: .35rem 0 .35rem 1rem; }
.uo-auto-note a { color: inherit; }
.uo-reading-time:empty { display: none; }
.uo-post-cover { margin: 0 0 2.5rem; }
.uo-post-cover img { height: auto; width: 100%; }
.uo-post-body { font-size: 1.06rem; line-height: 1.7; }
.uo-post-body > * { margin-bottom: 1.15rem; margin-top: 0; }
.uo-post-body h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); margin-top: 2.5rem; }
.uo-post-body h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); margin-top: 2rem; }
.uo-post-body h4 { font-size: 1.1rem; margin-top: 1.5rem; }
.uo-post-body img { border: 1px solid var(--uo-border); height: auto; max-width: 100%; }
.uo-post-body a { color: var(--wp--preset--color--ink); text-decoration-color: var(--wp--preset--color--accent); text-decoration-thickness: 2px; }
.uo-post-body ul, .uo-post-body ol { padding-left: 1.4rem; }
.uo-post-body li { margin-bottom: .45rem; }
.uo-post-body blockquote { border-left: 3px solid var(--wp--preset--color--accent); color: var(--wp--preset--color--muted); font-size: 1.15rem; margin: 2rem 0; padding: .25rem 0 .25rem 1.5rem; }
.uo-post-body hr { border: 0; border-top: 1px solid var(--uo-border); margin: 2.5rem 0; }
.uo-post-body .uo-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.uo-post-body table { border-collapse: collapse; font-size: .92rem; min-width: 100%; }
.uo-post-body th, .uo-post-body td { border: 1px solid var(--uo-border); padding: .55rem .75rem; text-align: left; vertical-align: top; }
.uo-post-body th { background: var(--wp--preset--color--surface); font-family: var(--uo-display); font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }

/* Código: inline y bloques */
.uo-post-body :not(pre) > code { background: var(--wp--preset--color--accent-soft); border-radius: 3px; color: var(--wp--preset--color--ink); font-family: var(--wp--preset--font-family--mono); font-size: .86em; padding: .1em .35em; }
.uo-post-body pre {
  background: var(--wp--preset--color--ink);
  color: #f3efe9;
  font-family: var(--wp--preset--font-family--mono);
  font-size: .86rem;
  line-height: 1.55;
  margin: 1.5rem 0;
  max-width: 100%;
  overflow: auto;
  padding: 1.1rem 1.25rem;
  position: relative;
  tab-size: 4;
  -webkit-text-size-adjust: 100%;
}
.uo-post-body pre code { background: none; color: inherit; font-size: inherit; padding: 0; white-space: pre; }
.uo-code { margin: 1.5rem 0; position: relative; }
.uo-code pre { margin: 0; padding-top: 2.6rem; }
.uo-code-bar { align-items: center; color: rgba(251,250,247,.55); display: flex; font-family: var(--wp--preset--font-family--mono); font-size: .72rem; justify-content: space-between; left: 0; letter-spacing: .06em; padding: .55rem 1rem .55rem 1.25rem; position: absolute; right: 0; text-transform: uppercase; top: 0; z-index: 1; }
.uo-code-copy { appearance: none; background: rgba(251,250,247,.1); border: 1px solid rgba(251,250,247,.18); border-radius: 3px; color: #f3efe9; cursor: pointer; font: inherit; letter-spacing: inherit; padding: .3rem .6rem; text-transform: inherit; transition: background-color 200ms ease; }
.uo-code-copy:hover { background: rgba(251,250,247,.2); }
.uo-code-copy:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 2px; }
.uo-code-copy.is-done { background: var(--wp--preset--color--accent); border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }
.uo-tok-c { color: #8a8378; font-style: italic; }
.uo-tok-s { color: #ffc98a; }
.uo-tok-k { color: #ff9a4d; }
.uo-tok-n { color: #9ad0ff; }
.uo-tok-t { color: #d8c8ff; }
.uo-tok-p { color: #b9b2a8; }

.uo-post-foot { border-top: 1px solid var(--uo-border); display: grid; gap: 1rem 2rem; grid-template-columns: 1fr 1fr; margin-top: 3rem; padding-top: 1.5rem; }
.uo-post-foot > p { grid-column: 1 / -1; }
.uo-post-foot .post-navigation-link-next { text-align: right; }
.uo-post-foot .wp-block-post-navigation-link a { display: block; font-family: var(--uo-display); font-weight: 650; letter-spacing: -.02em; line-height: 1.2; text-decoration: none; }
.uo-post-foot .wp-block-post-navigation-link a:hover { color: var(--wp--preset--color--accent); }
.uo-post-foot .post-navigation-link__label { color: var(--wp--preset--color--muted); display: block; font-family: var(--wp--preset--font-family--mono); font-size: .74rem; margin-bottom: .3rem; text-transform: uppercase; }

@media (max-width: 781px) {
  .uo-news-item { grid-template-columns: 1fr; }
  .uo-news-item .uo-news-meta { flex-direction: row; grid-row: auto; }
  .uo-post-foot { grid-template-columns: 1fr; }
  .uo-post-foot .post-navigation-link-next { text-align: left; }
  .uo-post-body pre { font-size: .8rem; margin-left: calc(-1 * clamp(1rem, 3vw, 2rem)); margin-right: calc(-1 * clamp(1rem, 3vw, 2rem)); }
  .uo-code pre { margin-left: 0; margin-right: 0; }
  .uo-code { margin-left: calc(-1 * clamp(1rem, 3vw, 2rem)); margin-right: calc(-1 * clamp(1rem, 3vw, 2rem)); }
}

/* 1.3.1 — Sin borde en imágenes (los píxeles de seguimiento de los feeds se veían como un punto) */
.uo-post-body img { border: 0; }
.uo-post-body img.is-tiny { display: none; }

/* 1.3.3 — Pregunta de verificación (solo sin JavaScript) */
.uo-form-question { display: grid; gap: .35rem; }
.uo-form-question span { font-size: .9rem; }

/* 2.0.0 — Selector de idioma en la cabecera */
.uo-lang { display: flex; font-family: var(--wp--preset--font-family--mono); font-size: .74rem; gap: .15rem; letter-spacing: .06em; margin-left: auto; margin-right: 1.5rem; }
.uo-lang a { border: 1px solid transparent; border-radius: 999px; color: var(--wp--preset--color--muted); padding: .2rem .5rem; text-decoration: none; transition: color 200ms ease, border-color 200ms ease; }
.uo-lang a:hover { color: var(--wp--preset--color--ink); }
.uo-lang a[aria-current="page"] { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }
.uo-site-header .wp-block-group.alignwide { align-items: center; }
@media (max-width: 781px) { .uo-lang { margin-right: .75rem; } }

/* 2.0.1 — Páginas genéricas (políticas, textos legales) */
.uo-generic-page { padding-top: clamp(2rem, 4vw, 3rem); }
.uo-page-hero .uo-post-title { margin: .4rem 0 .75rem; }

/* 2.0.2 — Páginas genéricas sin cabecera */
.uo-page-hero:first-child { padding-top: clamp(3rem, 7vw, 6rem); }

/* 2.1.0 — Formulario de contacto de las apps (solo email y mensaje) */
.uo-form-grid.is-single { grid-template-columns: 1fr; }
.uo-generic-page .uo-form { background: var(--wp--preset--color--surface); border: 1px solid var(--uo-border); padding: clamp(1.25rem, 3vw, 2rem); }
.uo-generic-page .uo-form input:not([type="hidden"]), .uo-generic-page .uo-form textarea { background: var(--wp--preset--color--canvas); }

/* ------------------------------------------------------------------
   3.0.0 — enagora.com: portada de la marca
   ------------------------------------------------------------------ */
.uo-brand-hero .uo-intro { max-width: 38rem; }
.uo-brand {
  align-items: center;
  color: var(--wp--preset--color--accent);
  display: inline-flex;
  font-family: var(--wp--preset--font-family--mono);
  font-size: clamp(1.1rem, 1.8vw, 1.4rem);
  gap: .6rem;
  letter-spacing: .04em;
  margin: 0 0 .5rem;
}
.uo-brand::before, .uo-brand::after { color: var(--wp--preset--color--muted); content: "{"; font-size: 1.6em; font-weight: 300; line-height: 1; }
.uo-brand::after { content: "}"; }
.uo-brand-word { display: inline-block; min-width: 9ch; text-align: center; transition: opacity 360ms ease, translate 520ms cubic-bezier(.16,1,.3,1), filter 360ms ease; }
.uo-brand-word.is-leaving { filter: blur(3px); opacity: 0; translate: 0 -.5em; }
.uo-brand-word.is-entering { filter: blur(3px); opacity: 0; translate: 0 .5em; transition: none; }
.uo-brand-title { font-family: var(--uo-display); font-size: clamp(2rem, 5.6vw, 5.2rem) !important; font-weight: 750; letter-spacing: -.05em; line-height: .98; margin: .2rem 0 1.6rem; max-width: 14ch; }
.uo-brand-title > span { display: inline; }
.uo-brand-title-soft { color: var(--wp--preset--color--muted); font-weight: 650; }

/* Panel "ahora mismo" */
.uo-board {
  background: var(--wp--preset--color--ink);
  border-radius: 6px;
  box-shadow: 0 40px 80px -50px rgba(34,31,28,.6);
  color: var(--wp--preset--color--canvas);
  font-family: var(--wp--preset--font-family--mono);
  font-size: .82rem;
  padding: 1.4rem 1.5rem 1.5rem;
  position: relative;
}
.uo-board-title { align-items: center; color: rgba(251,250,247,.6); display: flex; font-size: .72rem; gap: .6rem; letter-spacing: .1em; margin: 0 0 1.1rem; text-transform: uppercase; }
.uo-board-title i { animation: uo-blink 1.6s steps(2, start) infinite; background: #6fd38a; border-radius: 50%; box-shadow: 0 0 0 4px rgba(111,211,138,.18); display: inline-block; height: .55rem; width: .55rem; }
.uo-board dl { display: grid; gap: .9rem; margin: 0; }
.uo-board dt { color: var(--wp--preset--color--accent); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.uo-board dd { margin: .15rem 0 0; }
.uo-board dd::after { animation: uo-blink 1s steps(2, start) infinite; content: "▍"; color: var(--wp--preset--color--accent); display: none; }
.uo-board div:last-child dd::after { display: inline; margin-left: .2rem; }
.uo-board .uo-local-time::before { display: none; }

/* Apps */
.uo-apps { background: var(--wp--preset--color--surface); border-top: 1px solid var(--uo-border); }
.uo-app-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); margin-top: clamp(2rem, 4vw, 3rem); perspective: 1200px; }
.uo-app {
  --rx: 0deg; --ry: 0deg;
  background: var(--wp--preset--color--canvas);
  border: 1px solid var(--uo-border);
  display: flex;
  flex-direction: column;
  gap: .75rem;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  transform: rotateX(var(--rx)) rotateY(var(--ry));
  transform-style: preserve-3d;
  transition: transform 160ms ease, border-color 300ms ease, box-shadow 300ms ease;
}
.uo-app:hover { border-color: var(--wp--preset--color--accent); box-shadow: 0 30px 60px -40px rgba(34,31,28,.4); }
.uo-app h3 { font-family: var(--uo-display); font-size: clamp(1.4rem, 2.2vw, 1.9rem); font-weight: 650; letter-spacing: -.035em; line-height: 1.1; margin: 0; }
.uo-app p { margin: 0; }
.uo-app .uo-status { margin-bottom: 0; }
.uo-app-meta { color: var(--wp--preset--color--muted); font-family: var(--wp--preset--font-family--mono); font-size: .76rem; margin-top: auto !important; padding-top: .5rem; }

/* Sistemas */
.uo-systems-grid { display: grid; gap: clamp(1.5rem, 4vw, 4rem); grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); margin-top: clamp(2rem, 4vw, 3rem); }
.uo-system { border-top: 2px solid var(--wp--preset--color--accent); padding-top: 1.25rem; }
.uo-system h3 { font-family: var(--uo-display); font-size: clamp(1.4rem, 2.2vw, 1.9rem); font-weight: 650; letter-spacing: -.035em; line-height: 1.1; margin: .4rem 0 .8rem; }
.uo-system .uo-text-link { display: inline-block; margin-top: 1rem; }
.uo-bot-stats { display: grid; gap: 1rem 2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1.25rem 0 0; }
.uo-bot-stats dt { color: var(--wp--preset--color--muted); font-family: var(--wp--preset--font-family--mono); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.uo-bot-stats dd { margin: .2rem 0 0; }
.uo-bot-stats strong { font-family: var(--uo-display); font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 750; letter-spacing: -.04em; line-height: 1; }

/* Contratar */
.uo-hire { display: grid; gap: 1.25rem; margin-top: 1.5rem; }
.uo-hire-option { border-top: 1px solid rgba(34,31,28,.25); padding-top: .9rem; }
.uo-hire-option h3 { font-family: var(--uo-display); font-size: 1.15rem; font-weight: 700; margin: 0 0 .5rem; }
.uo-hire-option ul { margin: 0; padding-left: 1.1rem; }
.uo-hire-option li { margin-bottom: .3rem; }
.uo-hire-option p { margin: 0; }
.uo-hire-option a { color: inherit; font-weight: 700; }

@media (max-width: 781px) {
  .uo-brand-title { max-width: none; }
  .uo-board { margin-top: 2rem; }
  .uo-bot-stats { grid-template-columns: 1fr; }
}
html.uo-reduce .uo-board-title i, html.uo-reduce .uo-board dd::after { animation: none; }
html.uo-reduce .uo-app { transform: none !important; }