/* Fundación — scroll-world blueprint.
   Capas: 1) tokens · 2) base · 3) overrides del motor (marca, copy, botones, riel, hint)
          4) menú · 5) paneles · 6) responsive / movimiento.
   El motor inyecta sus defaults en @layer sw; todo lo de aquí (sin capa) gana. Sin gradientes. */

/* ---------- 1. Tokens ---------- */
:root{
  --sw-bg:#123a5f; --sw-bg-deep:#0e2c47; --sw-ink:#eef4f6; --sw-ink-soft:#b8cdd9; --sw-accent:#9fc4d6; --sw-warm:#d8a878;
  --sw-deep-rgb:14 44 71; --sw-accent-rgb:159 196 214; --sw-shadow-rgb:5 15 26;
  --f-display:'Newsreader',Georgia,'Times New Roman',serif;
  --f-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --glass:rgb(var(--sw-deep-rgb) / .62); --glass-strong:rgb(var(--sw-deep-rgb) / .9);
  --line:rgb(var(--sw-accent-rgb) / .22); --line-strong:rgb(var(--sw-accent-rgb) / .45);
  --r-card:18px; --r-pill:999px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --gutter:clamp(18px,5vw,64px);
}
.sw-root{--sw-bg:#123a5f;--sw-ink:#eef4f6;--sw-ink-soft:#b8cdd9;--sw-accent:#9fc4d6;--sw-font-display:var(--f-display);--sw-font-body:var(--f-body)}

/* ---------- 2. Base ---------- */
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--sw-bg);color:var(--sw-ink);font-family:var(--f-body);-webkit-font-smoothing:antialiased}
.no-script{background:var(--sw-bg);color:var(--sw-ink);font-size:14px;line-height:1.6;margin:0;padding:20px max(5vw,28px);text-align:center}
.sw-kicker{display:block;margin:0;font:500 .7rem/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--sw-accent)}
:where(a,button,summary):focus-visible{outline:2px solid var(--sw-accent);outline-offset:3px;border-radius:6px}

/* Botón circular reutilizable (☰ cerrar, × paneles) */
.sw-iconbtn{flex:0 0 auto;width:44px;height:44px;display:grid;place-items:center;padding:0;background:var(--glass);border:1px solid var(--line-strong);border-radius:50%;color:var(--sw-ink);font-size:1.4rem;line-height:1;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .2s,color .2s,border-color .2s}
.sw-iconbtn:hover{background:var(--sw-ink);color:var(--sw-bg-deep);border-color:var(--sw-ink)}

/* ---------- 3. Overrides del motor ---------- */
/* Marca: descriptor «Fundación para la» + nombre; placa glass para leerse sobre cualquier frame. */
.sw-brand{gap:0;padding:9px 16px 10px;border-radius:12px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.sw-brand__mark{display:none}
.sw-brand__text{display:flex;flex-direction:column;gap:3px}
.sw-brand__eyebrow{font:500 .62rem/1 var(--f-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--sw-ink-soft)}
.sw-brand__name{font-family:var(--f-display);font-weight:500;font-size:1.06rem;line-height:1.1;color:var(--sw-ink)}

.sw-menubtn{background:var(--glass);border-color:var(--line-strong);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.sw-menubtn i{width:18px;height:1.5px;background:var(--sw-ink)}
.sw-menubtn i:nth-child(2){width:12px;margin-left:6px}

/* Copy de cada escena: panel glass plano (sin velo degradado). */
.sw-copylayer::before{display:none}
.sw-copy{background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:var(--r-card);padding:clamp(22px,2.6vw,34px);box-shadow:0 24px 60px rgb(var(--sw-shadow-rgb) / .28)}
.sw-copy__num{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;color:var(--sw-ink-soft)}
.sw-copy__eyebrow{display:flex;align-items:center;gap:10px;margin-top:16px;font:500 .72rem/1.3 var(--f-mono);letter-spacing:.16em;color:var(--sw-accent)}
.sw-copy__eyebrow::before{content:"";width:20px;height:1px;background:currentColor;flex:0 0 auto}
.sw-copy__title{font-family:var(--f-display);font-weight:400;font-size:clamp(2.05rem,3.7vw,3.2rem);line-height:1.04;letter-spacing:-.018em;margin-top:14px;text-shadow:none;text-wrap:balance}
.sw-copy__body{margin-top:16px;font-size:clamp(1rem,1.1vw,1.08rem);line-height:1.62;color:#d4e2e9;text-shadow:none;max-width:42ch}
.sw-copy__tags{gap:6px;margin-top:20px}
.sw-copy__tags li{font:500 .66rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sw-ink-soft);background:transparent;border:1px solid var(--line);border-radius:6px;padding:7px 9px}
.sw-copy__cta{margin-top:24px;gap:10px;align-items:center}

/* Botones (escenas y paneles). Flecha = acción; ↗ = sale del sitio. */
.sw-btn{display:inline-flex;align-items:center;gap:10px;font:500 .94rem/1 var(--f-body);padding:13px 20px;border-radius:var(--r-pill);text-decoration:none;cursor:pointer;transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease)}
.sw-btn::after{content:"→";font-family:var(--f-mono);transition:transform .25s var(--ease)}
.sw-btn[href^="http"]::after{content:"↗"}
.sw-btn:hover{transform:translateY(-1px)}
.sw-btn:hover::after{transform:translateX(3px)}
.sw-btn[href^="http"]:hover::after{transform:translate(2px,-2px)}
.sw-btn--primary{color:var(--sw-bg-deep);background:var(--sw-ink);border:1px solid var(--sw-ink)}
.sw-btn--primary:hover{background:var(--sw-accent);border-color:var(--sw-accent)}
.sw-btn--ghost{color:var(--sw-ink);background:transparent;border:1px solid var(--line-strong)}
.sw-btn--ghost:hover{background:rgb(var(--sw-accent-rgb) / .12);border-color:var(--sw-accent)}
.sw-btn:focus-visible{outline:2px solid var(--sw-accent);outline-offset:3px}

/* Riel y hint */
.sw-route__dot{background:rgb(var(--sw-deep-rgb) / .66);border-radius:50%;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);width:20px;height:20px}
.sw-route__label{font:500 .66rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sw-ink);background:rgb(var(--sw-deep-rgb) / .82);border-color:var(--line)}
.sw-hint{flex-direction:row;white-space:nowrap;gap:12px;padding:8px 16px;font-family:var(--f-mono);font-size:.66rem;color:var(--sw-ink);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:var(--r-pill)}
.sw-hint i{width:18px;height:28px}
.sw-particles{display:none}

/* El motor escribe transform inline (parallax) y anula su translateY(-50%): centrado sin transform. */
@media (min-width:861px){.sw-copy{width:min(44vw,520px);top:0;bottom:0;margin:auto 0;height:fit-content;max-height:calc(100vh - 150px);overflow:auto}}

/* ---------- 4. Menú (full-screen) ---------- */
.sw-menu{position:fixed;inset:0;z-index:200;overflow-y:auto;overscroll-behavior:contain;background:rgb(var(--sw-deep-rgb) / .9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.sw-menu[hidden]{display:none}
.sw-menu__close{position:fixed;top:clamp(14px,2.4vw,26px);right:var(--gutter);z-index:1}
.sw-menu__inner{min-height:100%;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(36px,6vw,104px);align-content:center;padding:clamp(88px,11vh,128px) var(--gutter) 56px}
.sw-menu__col{min-width:0}
.sw-menu__col > .sw-kicker{padding:0 14px 14px}
.sw-menu__list{list-style:none;margin:0;padding:0;counter-reset:none}
.sw-menu__list li{border-top:1px solid var(--line)}
.sw-menu__list li:last-child{border-bottom:1px solid var(--line)}
.sw-menu__scene,.sw-menu__page{display:grid;grid-template-columns:3.2ch minmax(0,1fr);column-gap:16px;row-gap:3px;width:100%;padding:13px 14px;text-align:left;color:var(--sw-ink);text-decoration:none;background:transparent;border:0;border-radius:10px;cursor:pointer;font:inherit;transition:background .2s var(--ease)}
.sw-menu__page{grid-template-columns:minmax(0,1fr);padding:16px 14px}
.sw-menu__scene:hover,.sw-menu__page:hover{background:rgb(var(--sw-accent-rgb) / .09)}
.sw-menu__num{grid-row:span 2;padding-top:.32em;font:500 .74rem/1 var(--f-mono);letter-spacing:.08em;color:var(--sw-ink-soft)}
.sw-menu__title{font-family:var(--f-display);font-size:clamp(1.18rem,1.7vw,1.42rem);line-height:1.2}
.sw-menu__page .sw-menu__title{font-size:clamp(1.4rem,2.2vw,1.85rem)}
.sw-menu__blurb{font-size:.86rem;line-height:1.45;color:var(--sw-ink-soft)}
.sw-menu__title::after{content:"";display:inline-block;width:6px;height:6px;margin-left:10px;border-radius:50%;vertical-align:middle;background:var(--sw-accent);opacity:0;transform:scale(.4);transition:opacity .2s,transform .2s}
.sw-menu__scene[aria-current] .sw-menu__num{color:var(--sw-accent)}
.sw-menu__scene[aria-current] .sw-menu__title::after{opacity:1;transform:none}
.sw-menu__scene:hover .sw-menu__title,.sw-menu__page:hover .sw-menu__title{color:var(--sw-accent)}
.sw-menu__contact{margin:32px 14px 0;display:flex;flex-direction:column;gap:8px}
.sw-menu__contact a{font-family:var(--f-display);font-size:1.3rem;color:var(--sw-ink);text-decoration:none;border-bottom:1px solid var(--line-strong);align-self:flex-start;padding-bottom:2px}
.sw-menu__contact a:hover{color:var(--sw-accent);border-color:var(--sw-accent)}
.sw-menu:not([hidden]) .sw-menu__list li{animation:sw-rise .5s var(--ease) both}
.sw-menu__list li:nth-child(2){animation-delay:.03s}.sw-menu__list li:nth-child(3){animation-delay:.06s}.sw-menu__list li:nth-child(4){animation-delay:.09s}
.sw-menu__list li:nth-child(5){animation-delay:.12s}.sw-menu__list li:nth-child(6){animation-delay:.15s}.sw-menu__list li:nth-child(7){animation-delay:.18s}.sw-menu__list li:nth-child(8){animation-delay:.21s}
@keyframes sw-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Idioma: enlace en la barra superior (CTA del motor) y en el menú */
.sw-topcta{order:-1;display:grid;place-items:center;min-width:44px;height:44px;padding:0 12px;font:500 .72rem/1 var(--f-mono);letter-spacing:.14em;color:var(--sw-ink);background:var(--glass);border:1px solid var(--line-strong);border-radius:var(--r-pill);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .2s,color .2s}
.sw-topcta:hover{background:var(--sw-ink);color:var(--sw-bg-deep)}
.sw-menu__lang{margin:24px 14px 0;display:flex;flex-direction:column;gap:10px}
.sw-menu__lang > span:last-child{display:flex;gap:18px}
.sw-menu__lang a{font:500 .8rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sw-ink-soft);text-decoration:none;padding-bottom:4px;border-bottom:1px solid transparent}
.sw-menu__lang a:hover{color:var(--sw-ink)}
.sw-menu__lang a[aria-current]{color:var(--sw-ink);border-color:var(--sw-accent)}

/* ---------- 5. Paneles (hoja lateral) ---------- */
.sw-panel{position:fixed;inset:0;z-index:210;display:flex;justify-content:flex-end;background:rgb(var(--sw-shadow-rgb) / .42)}
.sw-panel[hidden]{display:none}
.sw-panel__sheet{position:relative;display:flex;flex-direction:column;width:min(620px,100%);height:100%;background:var(--glass-strong);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-left:1px solid var(--line);box-shadow:-30px 0 80px rgb(var(--sw-shadow-rgb) / .35);animation:sw-sheet .45s var(--ease) both}
@keyframes sw-sheet{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.sw-panel__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:clamp(24px,4vw,40px) clamp(22px,4vw,44px) 20px;border-bottom:1px solid var(--line)}
.sw-panel__title{margin:10px 0 0;font-family:var(--f-display);font-weight:400;font-size:clamp(1.9rem,4vw,2.6rem);line-height:1.05;letter-spacing:-.015em}
.sw-panel__body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:28px clamp(22px,4vw,44px) 48px}
.sw-panel__body > .sw-kicker{margin:34px 0 14px}
.sw-panel__body p{line-height:1.65;color:#d4e2e9}
.sw-panel__body a:not(.sw-btn){color:var(--sw-ink);text-decoration:none;border-bottom:1px solid var(--line-strong)}
.sw-panel__body a:not(.sw-btn):hover{color:var(--sw-accent);border-color:var(--sw-accent)}
.sw-lead{margin:0;font-family:var(--f-display);font-size:clamp(1.2rem,2vw,1.42rem);line-height:1.45!important;color:var(--sw-ink)!important}
.sw-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}

/* Principios numerados */
.sw-points{list-style:none;margin:0;padding:0;counter-reset:pt}
.sw-points li{counter-increment:pt;position:relative;padding:14px 0 14px 44px;border-top:1px solid var(--line);line-height:1.6;color:#d4e2e9}
.sw-points li::before{content:counter(pt,decimal-leading-zero);position:absolute;left:0;top:17px;font:500 .72rem/1 var(--f-mono);color:var(--sw-accent)}
.sw-points strong{color:var(--sw-ink);font-weight:600}

/* Directorio */
.sw-team{list-style:none;margin:0;padding:0}
.sw-team li{border-top:1px solid var(--line)}
.sw-team li:last-child{border-bottom:1px solid var(--line)}
.sw-team a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:14px 2px;border:0!important}
.sw-team__name{font-family:var(--f-display);font-size:1.2rem}
.sw-team__name::after{content:" ↗";font-family:var(--f-mono);font-size:.8rem;color:var(--sw-ink-soft)}
.sw-team__role{font:500 .68rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--sw-ink-soft)}
.sw-team a:hover .sw-team__name{color:var(--sw-accent)}

/* Cifras / datos en mono */
.sw-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:28px 0 0;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.sw-facts div{background:var(--sw-bg-deep);padding:14px 16px}
.sw-facts dt{font:500 .64rem/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--sw-ink-soft)}
.sw-facts dd{margin:8px 0 0;font:500 1rem/1.2 var(--f-mono);color:var(--sw-ink)}

/* Líneas de trabajo */
.sw-lines{list-style:none;margin:24px 0 0;padding:0}
.sw-lines li{display:grid;grid-template-columns:3ch minmax(0,1fr);gap:16px;padding:16px 0;border-top:1px solid var(--line)}
.sw-lines__n{padding-top:.4em;font:500 .72rem/1 var(--f-mono);color:var(--sw-accent)}
.sw-lines h3{margin:0;font-family:var(--f-display);font-weight:500;font-size:1.18rem;line-height:1.25}
.sw-lines p{margin:6px 0 0;font-size:.95rem}
.sw-tags{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.sw-tags li{font:500 .66rem/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sw-ink-soft);border:1px solid var(--line);border-radius:6px;padding:8px 10px}

/* FAQ */
.sw-faq details{border-top:1px solid var(--line)}
.sw-faq details:last-child{border-bottom:1px solid var(--line)}
.sw-faq summary{list-style:none;display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:17px 2px;cursor:pointer;font-family:var(--f-display);font-size:1.16rem;line-height:1.35;color:var(--sw-ink)}
.sw-faq summary::-webkit-details-marker{display:none}
.sw-faq summary::after{content:"+";flex:0 0 auto;font:400 1.2rem/1 var(--f-mono);color:var(--sw-accent);transition:transform .25s var(--ease)}
.sw-faq details[open] summary::after{transform:rotate(45deg)}
.sw-faq summary:hover{color:var(--sw-accent)}
.sw-faq__a{padding:0 32px 18px 2px}
.sw-faq__a p{margin:0}
.sw-faq details{scroll-margin-top:12px}

/* Estatutos */
.sw-note{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:22px 0 0;padding:12px 14px;border:1px dashed var(--line-strong);border-radius:10px;font:400 .8rem/1.4 var(--f-mono);color:var(--sw-ink-soft)!important}
.sw-articles{margin:24px 0 0}
.sw-articles div{display:grid;grid-template-columns:7ch minmax(0,1fr);gap:16px;padding:14px 0;border-top:1px solid var(--line)}
.sw-articles div:last-child{border-bottom:1px solid var(--line)}
.sw-articles dt{padding-top:.25em;font:500 .72rem/1 var(--f-mono);letter-spacing:.06em;color:var(--sw-accent)}
.sw-articles dd{margin:0;line-height:1.6;color:#d4e2e9}
.sw-articles strong{color:var(--sw-ink);font-weight:600}

/* Participa */
.sw-ways{list-style:none;display:grid;gap:10px;margin:26px 0 0;padding:0}
.sw-ways li{padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:rgb(var(--sw-accent-rgb) / .04)}
.sw-ways h3{margin:0;font-family:var(--f-display);font-weight:500;font-size:1.2rem}
.sw-ways p{margin:6px 0 0;font-size:.95rem}
.sw-contact{margin-top:36px;padding-top:24px;border-top:1px solid var(--line)}
.sw-contact__mail{display:inline-block;margin-top:10px;font-family:var(--f-display);font-size:clamp(1.5rem,4vw,2.1rem);border:0!important;color:var(--sw-ink)!important}
.sw-contact__mail:hover{color:var(--sw-accent)!important}
.sw-contact__meta{margin:8px 0 0;font:400 .76rem/1.4 var(--f-mono);letter-spacing:.06em;color:var(--sw-ink-soft)!important}

/* ---------- 6. Responsive y movimiento ---------- */
@media (max-width:860px){
  .sw-brand{padding:7px 12px 8px}
  .sw-brand__eyebrow{font-size:.56rem}
  .sw-brand__name{font-size:.92rem}
  .sw-copy{right:52px}
  .sw-copy__tags{display:none}   /* en móvil el texto ya lo dice; libera la imagen */
  .sw-copy__title{font-size:clamp(1.8rem,7.4vw,2.5rem)}
  .sw-hint{font-size:.6rem;letter-spacing:.1em}
  .sw-menu__inner{grid-template-columns:minmax(0,1fr);align-content:start;gap:40px;padding-top:84px}
  .sw-panel__sheet{border-left:0}
}
@media (hover:none) and (pointer:coarse){.sw-route__dot{width:28px;height:28px}}
@media (prefers-reduced-motion:reduce){
  .sw-menu:not([hidden]) .sw-menu__list li,.sw-panel__sheet{animation:none}
  .sw-btn,.sw-btn::after{transition:none}
}

/* ---------- 7. Accesibilidad (auditoría WCAG 2.2 AA) ---------- */
.sw-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}
.sw-skip{position:fixed;left:var(--gutter);top:12px;z-index:300;padding:12px 18px;border-radius:var(--r-pill);background:var(--sw-ink);color:var(--sw-bg-deep);font:500 .9rem/1 var(--f-body);text-decoration:none;transform:translateY(-200%);transition:transform .2s}
.sw-skip:focus{transform:none;outline:2px solid var(--sw-accent);outline-offset:3px}
.sw-route__dot{width:24px;height:24px}
.sw-menu__lang a{text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:.35em;border-bottom:0}
.sw-menu__lang a[aria-current]{text-decoration-color:var(--sw-accent);text-decoration-thickness:2px}

/* Crédito del sitio: discreto pero visible y legible (texto oculto = spam para Google). */
.sw-credit{margin:28px 14px 0;font:400 .66rem/1.5 var(--f-mono);letter-spacing:.06em;color:var(--sw-ink-soft)}
.sw-credit a{color:var(--sw-ink);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:.25em}
.sw-credit a:hover{color:var(--sw-accent);text-decoration-color:var(--sw-accent)}
.bl-foot__meta .sw-credit{margin:0}


/* ---------- 8. Móvil: panel compacto para que el video respire (≈ la mitad de la pantalla) ---------- */
@media (max-width:860px){
  .sw-copy{padding:18px 18px 20px;border-radius:14px;bottom:calc(76px + env(safe-area-inset-bottom))}
  .sw-copy__num{display:none}                       /* la posición ya la marcan los puntos del riel */
  .sw-copy__eyebrow{margin-top:0;font-size:.62rem;letter-spacing:.14em}
  .sw-copy__eyebrow::before{width:14px}
  .sw-copy__title{margin-top:10px;font-size:clamp(1.55rem,6.6vw,2rem);line-height:1.08}
  .sw-copy__body{margin-top:10px;font-size:.93rem;line-height:1.5}
  .sw-copy__cta{margin-top:16px;gap:8px}
  .sw-copy .sw-btn{padding:11px 16px;font-size:.86rem}
  .sw-hint{bottom:calc(16px + env(safe-area-inset-bottom));padding:7px 14px}
}
