/* ==========================================================================
   PFS ACADEMY — /pfs-academy/, /en/pfs-academy/, /pt/pfs-academy/
   --------------------------------------------------------------------------
   Figma "PFS | Entregas" · canvas 2747:23 "Entrega 18. PFS Academy y Eventos"
   · frames 2749:78 (Desktop 1360) y 2749:451 (Móvil 390). Medido 28-oct-2026
   por /nodes (no por render).

   La página ES el listado de guías (invertir-en-miami/, guias.css) más dos
   secciones nuevas — las sumas de alto cuadran al píxel: escritorio
   3708 + 433 + 574 = 4715, móvil 6453 + 384 + 606 = 7443. Por eso se carga
   DESPUÉS de guias.css y solo añade:
     1. Rutas de aprendizaje (.ac-rutas) y Próximos eventos (.ac-ev).
     2. Los valores del archivo donde guias.css (hecho el 25-sep desde un
        render) se quedó corto: H1 800/52, H2 700, píldoras/buscador/botones
        radio 8 y 13px w600, etiquetas de 24. Todo bajo body.ac-page: las
        61 páginas que cargan guias.css no cambian.
   El azul de botones/enlaces sigue siendo el del sitio (#3b82f6, hover
   #2f6fd0), no el #2563eb del archivo: decisión de Mateo, sep-2026.
   La escribe scripts/build-academy.js (no editar el HTML a mano).
   ========================================================================== */

/* ------------------------------------------------- valores del archivo */
.ac-page .gl-hero__bg::after{ background:linear-gradient(180deg, rgba(3,20,32,.55) 0%, rgba(3,20,32,.95) 100%); }
.ac-page .gl-hero h1{ font-weight:800; line-height:52px; letter-spacing:0; }
.ac-page .gl-hero__sub{ max-width:720px; }
.ac-stats{ margin:12px 0 0; color:var(--h26-gold,#e5c179); font-size:13px; font-weight:600; line-height:18px; white-space:pre-wrap; }
.ac-page .gl-h2{ font-weight:700; letter-spacing:0; }
.ac-page .gl-pill{ border-radius:8px; font-size:13px; font-weight:600; }
.ac-page .gl-pill span{ font-weight:600; }
.ac-page .gl-search input{ border-radius:8px; }
.ac-page .gl-btn{ border-radius:8px; font-size:13px; font-weight:600; }
.ac-page .gl-tag{ height:24px; }
.ac-page .gl-card .gl-tags{ gap:8px; }
.ac-page .gl-feat__meta{ font-weight:600; }

/* "¿No encuentras lo que buscas?" en azul claro, no navy (Mateo 28-oct-2026).
   Mismo trato que los banners de asesor del buscador, aprobados y publicados el
   25-oct: fondo #dfeafc, título #072031, texto #697386, botón azul sin cambios.
   El dorado del rótulo no se lee sobre azul claro: va el dorado oscuro #866b44. */
.ac-page .gl-cta{ background:#dfeafc; color:var(--h26-navy,#072031); }
.ac-page .gl-cta .gl-kicker{ color:#866b44; }
.ac-page .gl-cta__t{ color:var(--h26-navy,#072031); }
.ac-page .gl-cta__x{ color:#697386; }

/* --------------------------------------------- RUTAS DE APRENDIZAJE (nueva)
   Encabezado 72 + fila de 4 tarjetas 302×257 (gap 24). Relleno 64/40/16. */
.ac-rutas{ padding:64px 0 16px; }
.ac-rutas__row{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:24px; margin-top:24px; }
.ac-ruta{
  display:flex; flex-direction:column; gap:12px; min-height:257px; padding:24px; box-sizing:border-box;
  background:#fff; border:1px solid var(--h26-mist,#d1d8e5); border-radius:12px;
  color:var(--h26-navy,#072031); text-decoration:none; transition:border-color .15s ease;
}
.ac-ruta:hover{ border-color:var(--h26-navy,#072031); }
.ac-ruta__k{ margin:0; color:#866b44; font-size:11px; font-weight:600; line-height:16px; letter-spacing:.08em; }
.ac-ruta__t{ margin:0; font-size:18px; font-weight:600; line-height:26px; }
.ac-ruta__x{ margin:0; color:var(--h26-grey,#565656); font-size:14px; line-height:22px; }
.ac-ruta__meta{ margin:auto 0 0; color:var(--h26-grey,#565656); font-size:13px; line-height:20px; }
.ac-go{ display:inline-flex; align-items:center; gap:6px; color:var(--h26-blue,#3b82f6); font-size:13px; font-weight:600; line-height:18px; text-decoration:none; }
.ac-go:hover{ color:var(--h26-blue-ink,#2f6fd0); }
.ac-go svg{ width:10px; height:10px; flex:none; }

/* ----------------------------------------------- PRÓXIMOS EVENTOS (nueva)
   Encabezado 72 + 3 tarjetas 411×414: foto 180, cuerpo con relleno 20 y
   gap 12. Fecha en ficha 56×64. Relleno de la sección 64/40/0. */
.ac-ev{ padding:64px 0 0; }
.ac-ev[hidden]{ display:none; }
.ac-ev__row{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:24px; margin-top:24px; }
.ac-evc{
  display:flex; flex-direction:column; min-height:414px; box-sizing:border-box; overflow:hidden;
  background:#fff; border:1px solid var(--h26-mist,#d1d8e5); border-radius:12px; color:var(--h26-navy,#072031);
}
.ac-evc[hidden]{ display:none; }
.ac-evc__img{ flex:none; height:180px; overflow:hidden; background:var(--ivory,#f2f2f2); }
.ac-evc__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.ac-evc__body{ flex:1; display:flex; flex-direction:column; gap:12px; padding:20px; }
.ac-evc__top{ display:flex; align-items:center; gap:12px; }
.ac-evc__date{
  flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-width:56px; height:64px; padding:0 6px; box-sizing:border-box; border-radius:8px; background:var(--ivory,#f2f2f2);
}
.ac-evc__d{ font-size:24px; font-weight:700; line-height:32px; white-space:nowrap; }
.ac-evc__m{ color:var(--h26-grey,#565656); font-size:11px; font-weight:600; line-height:16px; letter-spacing:.04em; }
.ac-evc__place{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.ac-evc__city{ margin:0; font-size:13px; font-weight:600; line-height:18px; }
.ac-evc__t{ margin:0; font-size:18px; font-weight:600; line-height:26px; }
.ac-evc__v{ margin:0; color:var(--h26-grey,#565656); font-size:14px; line-height:22px; }
.ac-evc .ac-go{ margin-top:auto; }

/* ================================================================== MÓVIL
   Rutas y eventos: fila con desplazamiento horizontal, medianil izquierdo 16
   y la siguiente tarjeta asomando por la derecha (relleno derecho 0). */
@media (max-width: 900px){
  .ac-page .gl-hero h1{ font-size:32px; line-height:40px; font-weight:700; }
  .ac-page .gl-hero__sub{ font-size:14px; line-height:22px; }

  .ac-rutas{ padding:48px 0 8px; }
  .ac-ev{ padding:48px 0 8px; }
  .ac-rutas__row, .ac-ev__row{
    display:flex; gap:12px; margin-top:16px; margin-right:-16px; padding-right:16px;
    overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
  }
  .ac-rutas__row::-webkit-scrollbar, .ac-ev__row::-webkit-scrollbar{ display:none; }
  .ac-ruta{ flex:0 0 260px; min-height:244px; padding:20px; gap:10px; scroll-snap-align:start; }
  .ac-evc{ flex:0 0 290px; min-height:410px; scroll-snap-align:start; }
  .ac-evc__img{ height:150px; }
}
