/* ==========================================================================
   v41 · Cursos Veganos en dos caminos (cursos-veganos.html · ES/EN/PT)
   ========================================================================== */

/* ---------- Portada: los dos caminos ---------- */
.al-cv-caminos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 620px; margin-top: 26px; }
.al-cv-camino { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 15px 46px 15px 18px; border-radius: 16px; border: 1px solid rgba(244,239,233,.16); background: rgba(244,239,233,.04); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: var(--hueso, #f4efe9) !important; text-decoration: none !important; transition: background .3s ease, border-color .3s ease, transform .4s cubic-bezier(.2,.8,.2,1); }
.al-cv-camino span { font-size: .64rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--lila, #cfa8ef); }
.al-cv-camino b { font-family: var(--display); font-weight: 500; font-size: 1.05rem; letter-spacing: -.01em; line-height: 1.2; }
.al-cv-camino em { font-style: normal; font-size: .78rem; line-height: 1.4; color: rgba(244,239,233,.62); }
.al-cv-camino .al-icono { position: absolute; right: 16px; top: 50%; width: 15px; height: 15px; margin-top: -7px; transform: rotate(90deg); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.al-cv-camino:hover, .al-cv-camino:focus-visible { background: rgba(126,23,190,.32); border-color: var(--lila, #cfa8ef); transform: translateY(-2px); outline: none; }
.al-cv-camino:hover .al-icono { transform: rotate(90deg) translateX(3px); }

/* ---------- Bandas de cada camino ---------- */
.al-cv-acto { position: relative; overflow: hidden; padding: clamp(64px, 8vw, 116px) 0 clamp(56px, 7vw, 96px); scroll-margin-top: 60px; }
.al-cv-acto--aprender { background: var(--violeta, #7E17BE); color: #fff; }
.al-cv-acto--profesionales { background: radial-gradient(70% 120% at 100% 0%, rgba(126,23,190,.45), transparent 60%), #0b0710; color: var(--hueso, #f4efe9); }
.al-cv-acto::after { content: ""; position: absolute; right: -6vw; bottom: -18vw; width: 44vw; height: 44vw; border-radius: 50%; border: 1px solid rgba(255,255,255,.14); pointer-events: none; }
.al-cv-acto-in { position: relative; z-index: 1; }
.al-cv-acto-n { display: inline-flex; align-items: center; gap: 12px; font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.8); }
.al-cv-acto-n::before { content: ""; width: 34px; height: 1px; background: currentColor; }
.al-cv-acto--profesionales .al-cv-acto-n { color: var(--lila, #cfa8ef); }
.al-cv-acto h2 { margin: 18px 0 14px; max-width: 14em; font-family: var(--display); font-weight: 500; font-size: clamp(2.5rem, 1.5rem + 3.6vw, 5rem); line-height: .98; letter-spacing: -.035em; color: inherit; }
.al-cv-acto h2 em { font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: -.01em; }
.al-cv-acto--aprender h2 em { color: #f3d9ff; }
.al-cv-acto--profesionales h2 em { color: var(--lila, #cfa8ef); }
.al-cv-acto p { margin: 0; max-width: 36em; font-size: clamp(1rem, .95rem + .3vw, 1.2rem); line-height: 1.55; color: rgba(255,255,255,.82); }
/* la sección que sigue a la banda oscura arranca sin hueco */
.al-cv-acto--profesionales + .al-edu { padding-top: clamp(20px, 3vw, 40px); }

/* ---------- Brújula: ahora abre el camino ---------- */
.al-cv-brujula-sec .al-cv-brujula { margin-top: 0; }

/* ---------- Pasos con el registro al lado ---------- */
.al-cv-pasos-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: clamp(30px, 3.4vw, 46px); }
.al-cv-pasos-acc p { margin: 0; font-size: .86rem; color: var(--texto-2, #5f5866); }

/* ---------- Comunidad: puntos + voces ---------- */
.al-cv-voces-cab { margin-top: clamp(48px, 6vw, 80px); }
.al-cv-voces { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 18px 0 0; padding: 0; list-style: none; }
.al-cv-voces li { display: flex; }
.al-cv-voces blockquote { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; width: 100%; margin: 0; padding: 24px 24px 22px; border: 1px solid rgba(27,22,32,.08); border-radius: 20px; background: var(--papel, #fbf9f6); font-style: normal; color: inherit; transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease, border-color .3s ease; }
.al-cv-voces blockquote:hover { transform: translateY(-3px); border-color: rgba(126,23,190,.25); box-shadow: 0 20px 40px -24px rgba(126,23,190,.35); }
.al-cv-voces blockquote p { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(1.08rem, 1rem + .35vw, 1.3rem); line-height: 1.38; color: var(--texto, #1b1620); }
.al-cv-voces cite { display: inline-flex; align-items: center; gap: 10px; font-style: normal; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--violeta, #7E17BE); }
.al-cv-voces cite::before { content: ""; width: 22px; height: 1px; background: currentColor; }

/* ---------- Por qué formar: dos tarjetas ---------- */
@media (min-width: 1001px) { .al-edu-grid { grid-template-columns: 1.15fr 1fr; } }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
  .al-cv-voces { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .al-cv-caminos { grid-template-columns: 1fr; }
  .al-cv-acto::after { width: 80vw; height: 80vw; bottom: -40vw; }
  .al-cv-voces { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 18px -16px 0; padding: 2px 16px 8px; scrollbar-width: none; }
  .al-cv-voces::-webkit-scrollbar { display: none; }
  .al-cv-voces li { flex: 0 0 82%; scroll-snap-align: start; }
  .al-cv-pasos-acc { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .al-cv-camino, .al-cv-camino .al-icono, .al-cv-voces blockquote { transition: none; transform: none !important; }
}

/* ---------- Pasos: ahora son tres ---------- */
@media (min-width: 992px) { .al-pasos:has(> li:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- Banda «Camino 01»: animal de partículas blancas ---------- */
.al-cv-acto--aprender { display: flex; align-items: center; min-height: clamp(380px, 34vw, 540px); }
.al-cv-acto--aprender::after { display: none; }
.al-cv-acto--aprender .al-cv-acto-in { width: 100%; }
.al-cv-acto--aprender .al-cv-acto-in > * { max-width: 52%; }
.al-cv-acto-lienzo { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; }
@media (max-width: 767px) {
  .al-cv-acto--aprender { align-items: flex-start; min-height: 0; padding-bottom: 230px; }
  .al-cv-acto--aprender .al-cv-acto-in > * { max-width: none; }
}

/* ---------- Brújula de aprendizaje con identidad propia ---------- */
.al-edu-brujula.al-cv-brujula { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-rows: auto 1fr; column-gap: clamp(40px, 6vw, 96px); row-gap: 22px; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--texto, #1b1620); }
.al-cv-brujula .al-br-cab { grid-column: 1; grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; margin: 0; }
.al-cv-brujula .al-br-cab h3 { margin: 14px 0 16px; font-weight: 500; font-size: clamp(2rem, 1.3rem + 2.2vw, 3.3rem); line-height: 1.02; letter-spacing: -.03em; color: var(--texto, #1b1620); }
.al-cv-brujula .al-br-cab h3 em { display: block; margin-top: 4px; color: var(--violeta, #7E17BE); }
.al-cv-brujula .al-br-cab p { max-width: 30rem; font-size: 1rem; line-height: 1.6; color: var(--texto-2, #5f5866); }
.al-br-rosa { width: clamp(170px, 17vw, 230px); margin-top: clamp(24px, 3vw, 40px); }
.al-br-rosa svg { display: block; width: 100%; height: auto; overflow: visible; }
.al-br-rosa circle { fill: rgba(126,23,190,.3); }
.al-br-rosa .al-br-card { fill: var(--violeta, #7E17BE); }
.al-br-rosa .al-br-int { fill: rgba(126,23,190,.18); }
.al-br-rosa text { font-family: var(--serif); font-style: italic; font-size: 14px; fill: var(--texto-3, #8b8392); transition: fill .3s ease; }
.al-br-rosa text.al-on { fill: var(--violeta, #7E17BE); }
.al-br-aguja { transform-box: view-box; transform-origin: 100px 100px; transition: transform 1s cubic-bezier(.34,1.56,.64,1); }
.al-br-aguja circle { fill: var(--violeta, #7E17BE); }
.al-br-aguja .al-br-cola { fill: rgba(126,23,190,.32); }
.al-br-rosa .al-br-centro { fill: #E93B24; }
.al-cv-brujula.al-br-mira .al-br-aguja { transition-duration: .5s; }

.al-cv-brujula .al-br-tabs { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; gap: 0; margin: 0; border-top: 1px solid var(--linea, rgba(27,22,32,.12)); }
.al-cv-brujula .al-br-tab { position: relative; flex-direction: row; align-items: baseline; gap: 18px; width: 100%; padding: 18px 40px 18px 4px; border: 0; border-bottom: 1px solid var(--linea, rgba(27,22,32,.12)); border-radius: 0; background: none; color: var(--texto, #1b1620); transition: padding .4s cubic-bezier(.2,.8,.2,1), color .25s ease; }
.al-cv-brujula .al-br-tab span { flex: none; min-width: 62px; font-size: 1.05rem; color: var(--texto-3, #8b8392); }
.al-cv-brujula .al-br-tab b { font-family: var(--display); font-weight: 500; font-size: clamp(1.05rem, .95rem + .4vw, 1.3rem); letter-spacing: -.01em; color: inherit; }
.al-cv-brujula .al-br-tab::after { content: ""; position: absolute; right: 8px; top: 50%; width: 11px; height: 11px; margin-top: -5.5px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px rgba(126,23,190,.45); transition: background .3s ease, box-shadow .3s ease, transform .3s ease; }
.al-cv-brujula .al-br-tab:hover { transform: none; border-color: var(--linea, rgba(27,22,32,.12)); color: var(--violeta, #7E17BE); }
.al-cv-brujula .al-br-tab.al-on { padding-left: 14px; background: none; border-color: var(--linea, rgba(27,22,32,.12)); color: var(--violeta, #7E17BE); }
.al-cv-brujula .al-br-tab.al-on span { color: var(--violeta, #7E17BE); }
.al-cv-brujula .al-br-tab.al-on::after { background: #E93B24; box-shadow: 0 0 0 5px rgba(233,59,36,.14); transform: scale(1.1); }
.al-cv-brujula .al-br-tab:focus-visible { outline: 2px solid var(--violeta, #7E17BE); outline-offset: -2px; }

.al-cv-brujula .al-br-panel { grid-column: 2; grid-row: 2; align-self: start; grid-template-columns: 1fr; gap: 22px; padding: clamp(22px, 2.4vw, 30px); border: 0; border-radius: 22px; background: var(--hueso, #f4efe9); }
.al-cv-brujula .al-br-ruta-txt span { color: #c2331d; }
.al-cv-brujula .al-br-ruta-txt h4 { font-family: var(--display); font-weight: 500; font-size: clamp(1.25rem, 1.1rem + .5vw, 1.55rem); letter-spacing: -.015em; color: var(--texto, #1b1620); }
.al-cv-brujula .al-br-ruta-txt p { color: var(--texto-2, #5f5866); }
.al-cv-brujula .al-br-cursos { position: relative; gap: 14px; padding-top: 22px; }
.al-cv-brujula .al-br-cursos::before { content: ""; position: absolute; left: 6px; right: calc(50% - 7px); top: 5px; border-top: 2px dotted rgba(126,23,190,.45); }
.al-cv-brujula .al-br-curso { position: relative; padding: 16px 18px; border-radius: 16px; border: 1px solid rgba(27,22,32,.08); background: #fff; color: var(--texto, #1b1620) !important; }
.al-cv-brujula .al-br-curso::before { content: ""; position: absolute; left: 0; top: -23px; width: 12px; height: 12px; border-radius: 50%; background: var(--hueso, #f4efe9); box-shadow: inset 0 0 0 2px var(--violeta, #7E17BE); }
.al-cv-brujula .al-br-curso + .al-br-curso::before { background: #E93B24; box-shadow: 0 0 0 4px rgba(233,59,36,.15); }
.al-cv-brujula .al-br-curso:hover { border-color: rgba(126,23,190,.4); transform: translateY(-2px); }
.al-cv-brujula .al-br-curso small { color: var(--violeta, #7E17BE); }
.al-cv-brujula .al-br-curso b { font-family: var(--display); font-weight: 500; font-size: 1.05rem; }
.al-cv-brujula .al-br-curso i { color: #c2331d; font-weight: 500; }
@media (max-width: 991px) {
  .al-edu-brujula.al-cv-brujula { grid-template-columns: 1fr; grid-template-rows: none; }
  .al-cv-brujula .al-br-cab, .al-cv-brujula .al-br-tabs, .al-cv-brujula .al-br-panel { grid-column: 1; grid-row: auto; }
  .al-cv-brujula .al-br-cab { position: relative; padding-right: 150px; min-height: 150px; }
  .al-br-rosa { position: absolute; right: 0; top: 0; width: 130px; margin: 0; }
  .al-cv-brujula .al-br-tabs { margin-top: 8px; }
}
@media (max-width: 560px) {
  .al-cv-brujula .al-br-cab { padding-right: 0; }
  .al-br-rosa { position: static; width: 132px; margin-top: 18px; }
  .al-cv-brujula .al-br-cursos { grid-template-columns: 1fr; padding-top: 0; padding-left: 24px; }
  .al-cv-brujula .al-br-cursos::before { left: 5px; right: auto; top: 12px; bottom: 50%; border-top: 0; border-left: 2px dotted rgba(126,23,190,.45); }
  .al-cv-brujula .al-br-curso::before { left: -24px; top: 18px; }
}

/* ---------- Voces: cada tarjeta con su animal en línea fina ---------- */
.al-cv-voces blockquote { position: relative; overflow: hidden; isolation: isolate; }
.al-cv-voces blockquote > p, .al-cv-voces blockquote > cite { position: relative; z-index: 1; }
.al-cv-voz-animal { position: absolute; z-index: 0; right: -6%; bottom: -14%; width: 46%; height: auto; fill: none; stroke: rgba(126,23,190,.34); stroke-width: 6; stroke-linejoin: round; stroke-linecap: round; pointer-events: none; transition: transform .7s cubic-bezier(.2,.8,.2,1), stroke .4s ease; }
/* todas miran a la derecha: se dejan entrar enteras por ese lado (el corte va por las patas) */
.al-cv-voz-animal--conejo, .al-cv-voz-animal--gallina, .al-cv-voz-animal--pato { width: 28%; bottom: -10%; right: 5%; }
.al-cv-voz-animal--cerdo, .al-cv-voz-animal--vaca, .al-cv-voz-animal--oveja { width: 44%; bottom: -15%; right: 5%; }
.al-cv-voces blockquote:hover .al-cv-voz-animal { transform: translateY(-8px); stroke: rgba(126,23,190,.7); }
.al-cv-voces blockquote > p { padding-right: 6%; }
@media (prefers-reduced-motion: reduce) {
  .al-br-aguja, .al-cv-voz-animal { transition: none; }
}

/* ---------- Portada: cada dato con su gráfico de puntos ---------- */
.al-portada-datos--cv span { position: relative; }
.al-pd-g { display: block; height: 56px; width: auto; margin: 0 0 14px; overflow: visible; }
.al-pd-g circle { fill: var(--lila, #cfa8ef); opacity: .13; transform-box: fill-box; transform-origin: center; transform: scale(.55);
  animation: al-pd-on .7s cubic-bezier(.2,.8,.2,1) forwards; animation-delay: calc(var(--d, 0ms) + 900ms); }
.al-pd-g circle.c { fill: #E93B24; }
@keyframes al-pd-on { to { opacity: 1; transform: scale(1); } }
/* el anillo, ya completo, gira muy despacio */
.al-pd-g--anillo g { transform-origin: 22px 22px; animation: al-pd-gira 40s linear 2.4s infinite; }
@keyframes al-pd-gira { to { transform: rotate(360deg); } }
/* la multitud respira: cada punto titila a su tiempo */
.al-pd-g--multitud circle { animation: al-pd-on .7s cubic-bezier(.2,.8,.2,1) forwards, al-pd-titila 5s ease-in-out infinite; animation-delay: calc(var(--d, 0ms) + 900ms), calc(var(--d, 0ms) * 4 + 2600ms); }
@keyframes al-pd-titila { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.8); } }
.al-portada-datos--cv span:hover .al-pd-g circle { fill: #f3d9ff; }
.al-portada-datos--cv span:hover .al-pd-g circle.c { fill: #ff6a52; }
@media (prefers-reduced-motion: reduce) {
  .al-pd-g circle, .al-pd-g--multitud circle { animation: none; opacity: 1; transform: none; }
  .al-pd-g--anillo g { animation: none; }
}

/* ---------- En Cursos Veganos, el flotante invita a registrarse ---------- */
a.al-flot-registro { text-decoration: none !important; color: #fff !important; }
a.al-flot-registro .al-flot-ico { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* Educación · revisión de dirección · 26 octubre 2026 */
.al-cursos-portada .al-cv-camino.al-cv-camino--principal { background: #fff; border-color: #ead0ff; color: #2b2525 !important; box-shadow: 0 0 24px rgba(207,168,239,.3), inset 0 1px 0 #fff; transition: background .3s ease, box-shadow .3s ease, border-color .3s ease, transform .3s ease; }
.al-cv-camino--principal span { color: #68149d; }
.al-cv-camino--principal em { color: #514552; }
.al-cursos-portada .al-cv-camino.al-cv-camino--principal:hover, .al-cursos-portada .al-cv-camino.al-cv-camino--principal:focus-visible { background: #fff; border-color: #fff; box-shadow: 0 0 20px rgba(230,195,255,.65), 0 0 48px rgba(171,70,235,.4), inset 0 1px 0 #fff; transform: translateY(-3px); }
.al-cv-camino:focus-visible { outline: 3px solid #cfa8ef; outline-offset: 4px; }
.al-cursos-portada .al-acciones { flex-wrap: wrap; gap: 20px; }
.al-cursos-portada .mil-button span { white-space: normal; }
.al-pfi-participacion { margin: 28px 0 36px; padding: clamp(20px, 3vw, 32px); border: 1px solid #cfa8ef; border-radius: 18px; background: rgba(207,168,239,.09); }
.al-pfi-participacion p { max-width: 70ch; color: #f4efe9; line-height: 1.65; margin: 0; }
.al-pfi-participacion p + p { margin-top: 12px; }
.al-pfi-participacion strong { font-weight: 600; font-size: clamp(1.15rem, 2vw, 1.5rem); }
#programa, #universidades { scroll-margin-top: 80px; }
@media (max-width: 600px) { .al-cursos-portada .al-acciones { align-items: flex-start; flex-direction: column; } .al-cursos-portada .mil-button { max-width: 100%; } }
@media print { .al-pfi-participacion { break-inside: avoid; background: none; border-color: #666; margin: 16px 0; padding: 14px; } }