/* Uriarte Elkartea — efectos (compartido). Usa las variables --uri-* definidas en cada entorno. */

/* Barra de progreso y botón arriba */
.uri-progress{position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--uri-accent),var(--uri-gold));transform-origin:0 50%;transform:scaleX(0);z-index:200;pointer-events:none}
.uri-top{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));width:46px;height:46px;border-radius:50%;border:1px solid var(--uri-line);background:var(--uri-surface);color:var(--uri-accent);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 24px -10px rgba(0,0,0,.35);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .25s,transform .25s,background .2s;z-index:150}
.uri-top.is-visible{opacity:1;transform:none;pointer-events:auto}
.uri-top:hover{background:var(--uri-accent);color:var(--uri-surface)}

/* Cabecera al hacer scroll */
.uri-header{transition:box-shadow .25s,padding .25s}
.uri-header.is-scrolled{box-shadow:0 10px 30px -18px rgba(0,0,0,.35)}

/* Entrada del hero */
@keyframes uriUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes uriFade{from{opacity:0}to{opacity:1}}
.uri-motion .uri-hero > *,.uri-motion .hero-txt > *{animation:uriUp .8s cubic-bezier(.2,.7,.2,1) both}
.uri-motion .uri-hero > :nth-child(2),.uri-motion .hero-txt > :nth-child(2){animation-delay:.08s}
.uri-motion .uri-hero > :nth-child(3),.uri-motion .hero-txt > :nth-child(3){animation-delay:.16s}
.uri-motion .uri-hero > :nth-child(4),.uri-motion .hero-txt > :nth-child(4){animation-delay:.24s}
.uri-motion .hero .ph-portrait{animation:uriFade 1.1s .2s both}

/* Aparición al hacer scroll */
.uri-motion .uri-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1) var(--d,0ms),transform .7s cubic-bezier(.2,.7,.2,1) var(--d,0ms)}
.uri-motion .uri-reveal.is-in{opacity:1;transform:none}

/* Línea del tiempo animada */
.uri-timeline.is-enhanced{position:relative;list-style:none;margin:1.5rem 0 1rem;padding:.5rem 0;--p:0}
.uri-timeline.is-enhanced::before,.uri-timeline.is-enhanced::after{content:"";position:absolute;top:0;bottom:0;left:11px;width:2px;background:var(--uri-line);border-radius:2px}
.uri-timeline.is-enhanced::after{background:linear-gradient(var(--uri-accent),var(--uri-gold));transform-origin:50% 0;transform:scaleY(var(--p))}
.uri-timeline.is-enhanced > .uri-tl-row{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:18px;padding:10px 0;margin:0;border:0}
.uri-timeline.is-enhanced > li::marker{content:none}
.uri-tl-dot{grid-column:1;grid-row:1;justify-self:center;align-self:start;margin-top:22px;width:14px;height:14px;border-radius:50%;background:var(--uri-bg);border:2px solid var(--uri-line);position:relative;z-index:1;transition:background .35s,border-color .35s,box-shadow .35s,transform .35s}
.uri-timeline .uri-tl-row.is-active .uri-tl-dot{background:var(--uri-accent);border-color:var(--uri-accent);box-shadow:0 0 0 6px color-mix(in srgb,var(--uri-accent) 16%,transparent);transform:scale(1.1)}
.uri-tl-card{grid-column:2;grid-row:1;background:var(--uri-surface);border:1px solid var(--uri-line);border-radius:4px;padding:14px 18px;transition:opacity .6s,transform .6s cubic-bezier(.2,.7,.2,1),border-color .4s,box-shadow .4s}
.uri-tl-yr{display:block;font-family:var(--uri-serif);font-size:1.45rem;font-weight:500;line-height:1.2;color:var(--uri-accent);font-variant-numeric:lining-nums tabular-nums;margin-bottom:4px}
.uri-tl-tx{margin:0;color:var(--uri-ink)}
.uri-motion .uri-timeline.is-enhanced .uri-tl-card{opacity:.3;transform:translateY(14px)}
.uri-motion .uri-timeline.is-enhanced .uri-tl-row.is-active .uri-tl-card{opacity:1;transform:none;border-color:color-mix(in srgb,var(--uri-accent) 35%,var(--uri-line));box-shadow:0 12px 30px -22px rgba(0,0,0,.4)}
@media (min-width:820px){
  .uri-timeline.is-enhanced::before,.uri-timeline.is-enhanced::after{left:50%;margin-left:-1px}
  .uri-timeline.is-enhanced > .uri-tl-row{grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);column-gap:0}
  .uri-tl-dot{grid-column:2}
  .uri-timeline.is-enhanced > .uri-tl-row:nth-child(odd) .uri-tl-card{grid-column:1;text-align:right}
  .uri-timeline.is-enhanced > .uri-tl-row:nth-child(even) .uri-tl-card{grid-column:3}
  .uri-timeline.is-enhanced > .uri-tl-row + .uri-tl-row{margin-top:-28px}
  .uri-motion .uri-timeline.is-enhanced > .uri-tl-row:nth-child(odd) .uri-tl-card{transform:translateX(-26px)}
  .uri-motion .uri-timeline.is-enhanced > .uri-tl-row:nth-child(even) .uri-tl-card{transform:translateX(26px)}
  .uri-motion .uri-timeline.is-enhanced > .uri-tl-row.is-active .uri-tl-card{transform:none}
}

/* Índice lateral */
.uri-toc{display:none}
.uri-page-grid.has-toc .uri-toc{display:block;position:sticky;top:var(--uri-sticky-top,110px);align-self:start;font-size:.9rem}
.uri-toc-t{font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;font-weight:600;color:var(--uri-gold);margin:0 0 .8rem}
.uri-toc ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--uri-line)}
.uri-toc li{margin:0}
.uri-toc a{display:block;padding:6px 0 6px 14px;margin-left:-2px;border-left:2px solid transparent;color:var(--uri-muted);text-decoration:none;line-height:1.35;transition:color .2s,border-color .2s}
.uri-toc a:hover{color:var(--uri-ink)}
.uri-toc a.is-active{color:var(--uri-accent);border-left-color:var(--uri-accent);font-weight:600}
@media (max-width:1023px){.uri-page-grid.has-toc .uri-toc{display:none}}

@media (prefers-reduced-motion:reduce){.uri-top,.uri-tl-card,.uri-tl-dot{transition:none}}

/* Timeline v5: tarjetas con imagen */
.uri-tl-card > *{margin-block:0}
.uri-tl-card > * + *{margin-top:.5rem}
.uri-tl-card p.uri-tl-yr{font-family:var(--uri-serif);font-size:1.45rem;font-weight:500;line-height:1.2;color:var(--uri-accent);font-variant-numeric:lining-nums tabular-nums}
.uri-tl-card figure{margin:.9rem 0 0!important;overflow:hidden;border-radius:2px}
.uri-tl-card figure img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
@media (min-width:820px){.uri-timeline.is-enhanced > .uri-tl-row.has-img + .uri-tl-row{margin-top:-28px}}

/* Pestañas */
.uri-tablist{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--uri-line);margin-bottom:1.5rem}
.uri-tab{appearance:none;background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:.7rem 1rem;font:inherit;font-weight:600;color:var(--uri-muted);cursor:pointer;transition:color .2s,border-color .2s}
.uri-tab:hover{color:var(--uri-ink)}
.uri-tab[aria-selected="true"]{color:var(--uri-accent);border-bottom-color:var(--uri-accent)}
.uri-tab-n{display:inline-block;min-width:1.5em;padding:0 .4em;margin-left:.3em;border-radius:999px;background:var(--uri-line);color:var(--uri-ink);font-size:.75rem;line-height:1.6;text-align:center}
.uri-motion .uri-tabs [role=tabpanel]:not([hidden]){animation:uriFade .4s ease both}
.uri-tl-card{max-width:520px}
.uri-tl-card figure img{aspect-ratio:16/9}
@media (min-width:820px){
  .uri-timeline.is-enhanced > .uri-tl-row:nth-child(odd) .uri-tl-card{justify-self:end}
  .uri-timeline.is-enhanced > .uri-tl-row:nth-child(even) .uri-tl-card{justify-self:start}
}
