
/* ==========================================================================
   NUESTROS ALUMNOS · desglose de alumnos por facultad y programa
   Paleta  fondo #F9FAFC · tinta #0B1433 · azul #2E5BFF · filete #DEDFE3
   Tipos   Playfair Display 400 (titular) · Manrope 300 / 700
   ========================================================================== */
.ufv-al *,.ufv-al *::before,.ufv-al *::after{box-sizing:border-box}

.ufv-al{
  --bg:#F9FAFC; --ink:#0B1433; --blue:#2E5BFF; --rule:#DEDFE3; --navy:#003866;
  position:relative;width:100%;margin:0;padding:0;background:var(--bg);
  font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);
}
.al-stage{display:block;width:100%;height:auto;aspect-ratio:1600/860}

/* en escritorio, encaja el gráfico dentro de la ventana sin generar scroll */
/* Regla de página completa retirada al integrar: fijaba `html,body` a
   `height:100%; overflow:hidden` para que el gráfico encajase en la ventana
   cuando se sirve solo. Embebido, eso mata el scroll de TODA la landing. */

/* ------------------------------------------------------------------- texto */
.al-title{fill:var(--ink);font-family:"Playfair Display",Georgia,serif;font-weight:400;
  font-size:71px;letter-spacing:-.9px}
.al-big{fill:var(--blue);font-weight:300;font-size:60px;letter-spacing:-1.45px}
.al-kpi{fill:var(--ink);font-weight:700;font-size:33px;letter-spacing:-.3px}
.al-cap{fill:var(--ink);fill-opacity:.82;font-weight:300;font-size:18px}
.al-head{fill:var(--ink);font-weight:700;font-size:24.8px}
.al-hint{fill:var(--blue);fill-opacity:1;font-weight:400;font-size:16px}
.al-hint:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.al-back{fill:var(--blue);font-weight:400;font-size:16px;cursor:pointer}
.al-back tspan{text-decoration:underline;text-decoration-color:rgba(46,91,255,.35)}

/* -------------------------------------------------------------- burbujas */
.al-toggle-pill{cursor:pointer}
.al-toggle-pill:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:999px}
.al-toggle-rect{fill:none;stroke:var(--navy);stroke-width:1.2;transition:fill .3s ease;pointer-events:all}
.al-toggle-pill:hover .al-toggle-rect{fill:rgba(0,56,102,.07)}
.al-toggle-rect.is-active,.al-toggle-pill:hover .al-toggle-rect.is-active{fill:var(--navy)}
.al-toggle-text{font-weight:300;font-size:21px;text-anchor:middle;pointer-events:none;fill:var(--navy);transition:fill .3s ease}
.al-toggle-text.is-active{fill:#fff}

.al-close-btn{cursor:pointer;opacity:0;transition:opacity .3s ease}
.al-close-btn:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:50%}
.al-close-circle{fill:var(--navy);stroke:rgba(255,255,255,.38);stroke-width:1;transition:filter .25s ease}
.al-close-btn:hover .al-close-circle{filter:brightness(1.25)}
.al-close-icon{transition:transform .25s ease;transform-box:fill-box;transform-origin:center}
.al-close-btn:hover .al-close-icon{transform:rotate(90deg)}
.al-close-x{stroke:#fff;stroke-width:1.6;stroke-linecap:round}

.al-bc-root{fill:#000;fill-opacity:0;cursor:pointer}
.al-node{transition:transform .7s cubic-bezier(.25,.9,.25,1)}
.al-bc-parent{fill:url(#alGrad);fill-opacity:.88;stroke:var(--navy);stroke-opacity:.55;stroke-width:1.2;cursor:pointer;
  transition:filter .15s,r .7s cubic-bezier(.25,.9,.25,1),opacity .4s ease}
.al-bc-parent:hover,.al-bc-parent:focus-visible{filter:brightness(1.06)}
.al-bc-parent:focus-visible,.al-bc-leaf:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.al-bc-leaf{fill:var(--blue);fill-opacity:.92;stroke:#F9FAFC;stroke-width:1.6;cursor:pointer;
  transition:filter .15s,r .7s cubic-bezier(.25,.9,.25,1),opacity .4s ease}
.al-bc-leaf:hover,.al-bc-leaf:focus-visible{filter:brightness(1.1)}
.al-node-label{pointer-events:none;text-anchor:middle;transition:fill-opacity .4s ease}
.al-lab-fac-num{font-weight:300;fill:var(--blue)}
.al-lab-fac-name{font-weight:300;fill:var(--navy)}
.is-leaf-label .al-lab-fac-num,.is-leaf-label .al-lab-fac-name{fill:#fff}

@media (prefers-reduced-motion:reduce){
  .al-node,.al-bc-parent,.al-bc-leaf,.al-node-label{transition:none}
}

/* ------------------------------------------------------------ tooltip */
.al-tooltip{position:fixed;z-index:9999;pointer-events:none;max-width:260px;
  background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;
  font-family:"Manrope",sans-serif;font-size:16px;line-height:1.45;
  opacity:0;transform:translate(-50%,calc(-100% - 14px));
  transition:opacity .12s ease;box-shadow:0 10px 30px rgba(11,20,51,.28)}
.al-tooltip.is-visible{opacity:1}
.al-tooltip b{display:block;font-weight:700;font-size:16px;margin-bottom:3px}
.al-tooltip .fac{display:block;font-weight:300;opacity:.78;margin-bottom:5px}
.al-tooltip .n{display:block;font-weight:700;font-size:16px;color:#8CA3FF}

/* -------------------------------------------------------------- animación */
@keyframes alFade{from{opacity:0}to{opacity:1}}

/* ------------------------------------------------------- versión de móvil */
.al-m{display:none}
@media (max-width:860px){
  .al-m{display:block}
  .al-stage{display:none}
  .al-m-title{margin:0;padding:26px 20px 0;font-family:"Playfair Display",Georgia,serif;
    font-weight:400;font-size:clamp(28px,7.6vw,42px);line-height:1.12;letter-spacing:-.01em}
  .al-m-kpis{margin:22px 0 4px;padding:0 20px;list-style:none}
  .al-m-kpis li{margin:0 0 16px}
  .al-m-kpis .n{display:block;font-weight:300;font-size:clamp(46px,14vw,74px);
    line-height:1;color:var(--blue)}
  .al-m-kpis li+li .n{font-weight:700;font-size:clamp(26px,7vw,34px);color:var(--ink)}
  .al-m-kpis .c{display:block;margin-top:4px;font-weight:300;font-size:16px;opacity:.82}
  .al-m-head{margin:24px 0 0;padding:0 20px;font-weight:700;font-size:16px;line-height:1.3}
  .al-m-sub{margin:2px 0 0;padding:0 20px;font-weight:400;font-size:16px;color:var(--blue);opacity:1}

  .al-m-acc{margin:14px 0 26px;padding:0 20px}
  .al-m-nivel{margin:20px 0 4px;font-weight:700;font-size:16px;letter-spacing:.06em;
    text-transform:uppercase;opacity:.6}
  .al-m-nivel:first-child{margin-top:6px}
  .al-m-fac{border-top:1.2px solid var(--rule)}
  .al-m-fac:last-of-type{border-bottom:1.2px solid var(--rule)}
  .al-m-fac summary{list-style:none;cursor:pointer;padding:13px 0 14px;display:flex;
    align-items:baseline;justify-content:space-between;gap:14px}
  .al-m-fac summary::-webkit-details-marker{display:none}
  .al-m-fac summary .t{font-weight:700;font-size:16px;line-height:1.25}
  .al-m-fac summary .v{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
  .al-m-fac summary b{font-weight:700;font-size:16px;color:var(--blue)}
  .al-m-fac summary i{font-style:normal;font-weight:300;font-size:16px;color:var(--blue)}
  .al-m-progs{margin:0 0 14px;padding:0;list-style:none}
  .al-m-prog{padding:9px 4px 9px 4px;border-top:1px dashed var(--rule)}
  .al-m-prog .al-m-top span{font-weight:300;font-size:16px;line-height:1.25}
  .al-m-prog .al-m-top b{font-weight:700;font-size:16px;white-space:nowrap}
  .al-m-top{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
  .al-m-track{margin-top:8px;height:2.5px}

  /* sub-programas de un programa (p. ej. Doctorado o UDE dentro de Escuela de
     Postgrado): misma fila que un programa normal, pero indentada bajo él */
  .al-m-subprogs{margin:10px 0 0;padding:0 0 0 16px;list-style:none;border-left:1.2px solid var(--rule)}
  .al-m-subprog{padding:7px 0 7px 12px;border-top:1px dashed var(--rule);opacity:.82}
  .al-m-subprog:first-child{border-top:none}
  .al-m-track i{display:block;height:2.5px;width:0;background:var(--blue);border-radius:2px;
    transition:width .8s cubic-bezier(.22,.85,.24,1);transition-delay:calc(var(--i)*45ms + 80ms)}
  .is-in .al-m-track i{width:var(--w)}
}

@media (prefers-reduced-motion:reduce){
  .al-m-track i{transition:none;width:var(--w)}
}
