:root {
    /* Paleta del manual de marca v3 · Florecer: pasteles para la suavidad y un verde bosque que ancla */
    --bosque: #2E4A3E;      /* textos y trazo firme: 9,1:1 sobre crema */
    --musgo: #4F6B5E;       /* textos secundarios */
    --coralp: #B04A36;      /* coral profundo: botones y acciones, 5,4:1 con blanco */
    --coralp-osc: #963D2C;
    --menta: #9ED0B7;       /* crecimiento, esperanza */
    --durazno: #F2B592;     /* calidez, cercanía */
    --coral: #EE9884;       /* energía, acción */
    --mantequilla: #F4E1A1; /* luz, optimismo */
    --agua: #99CFC8;
    --lavanda: #BDB2E4;
    --crema: #FFF6EE;
    --crema-2: #FBEEE2;
    --linea: rgba(46, 74, 62, .13);
    --sombra: 0 22px 44px -24px rgba(46, 74, 62, .35);
    --titulo: 'Quicksand', ui-rounded, system-ui, sans-serif;
    --texto: 'Nunito Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--crema); color: var(--bosque); font: 400 1rem/1.6 var(--texto); -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
[hidden] { display: none !important; }
h1, h2, h3, h4 { font-family: var(--titulo); font-weight: 700; line-height: 1.12; margin: 0; letter-spacing: -.01em; }
p { margin: 0; }
a { color: inherit; }
button, input, select { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--coralp); outline-offset: 2px; }
::selection { background: var(--menta); color: var(--bosque); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.saltar { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: #fff; padding: .6rem 1rem; border-radius: 999px; font-weight: 700; }
.saltar:focus { top: 1rem; }
.contenedor { width: min(1200px, 100% - 2.5rem); margin-inline: auto; }
.texto-suave { color: var(--musgo); }

/* Botones */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 2.9rem; padding: .7rem 1.4rem; border-radius: 999px; border: 1.5px solid transparent; font-weight: 700; font-size: .95rem; text-decoration: none; cursor: pointer; transition: background-color .2s, transform .2s, border-color .2s; }
.btn:hover { transform: translateY(-1px); }
.btn-primario { background: var(--coralp); color: #fff; box-shadow: 0 10px 22px -12px rgba(176, 74, 54, .7); }
.btn-primario:hover { background: var(--coralp-osc); }
.btn-borde { background: #fff; border-color: rgba(46, 74, 62, .25); }
.btn-borde:hover { background: var(--crema-2); }
.btn-bosque { background: var(--bosque); color: #fff; }
.btn-claro { background: #fff; color: var(--bosque); }
.btn-pequeno { min-height: 2.5rem; padding: .5rem 1.1rem; font-size: .875rem; }
.btn:disabled { opacity: .6; cursor: default; transform: none; }
.enlace { font-weight: 700; color: var(--coralp); text-decoration: underline; text-underline-offset: 4px; }

/* Elementos de marca */
.eyebrow { font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--coralp); }
.trazo { width: 9.5rem; height: 1rem; margin-top: .7rem; color: var(--bosque); }
.centrado .trazo { margin-inline: auto; }
.hoja { border-radius: 46% 1.5rem 46% 1.5rem / 46% 1.5rem 46% 1.5rem; overflow: hidden; }
.hoja-inv { border-radius: 1.5rem 46% 1.5rem 46% / 1.5rem 46% 1.5rem 46%; overflow: hidden; }
.foto-duo { width: 100%; height: 100%; object-fit: cover; }
.patron-hojas { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath d='M18 30c-7-6-8-15-2-22 7 6 8 15 2 22z' fill='%239ED0B7' fill-opacity='.55'/%3E%3Cpath d='M52 66c-7-6-8-15-2-22 7 6 8 15 2 22z' fill='%23F2B592' fill-opacity='.55' transform='rotate(28 52 55)'/%3E%3C/svg%3E"); background-size: 72px 72px; }
.tarjeta { background: #fff; border: 1px solid var(--linea); border-radius: 1.5rem; padding: 1.6rem; }
.chip { display: inline-flex; align-items: center; gap: .35rem; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: .3rem .7rem; border-radius: 999px; background: var(--crema-2); }
.numero { width: 2.75rem; height: 2.75rem; border-radius: 50%; display: grid; place-items: center; font-family: var(--titulo); font-weight: 700; flex-shrink: 0; }
.bg-menta { background: var(--menta); } .bg-durazno { background: var(--durazno); } .bg-coral { background: var(--coral); }
.bg-mantequilla { background: var(--mantequilla); } .bg-agua { background: var(--agua); } .bg-lavanda { background: var(--lavanda); }

/* Encabezado */
.cabecera { position: sticky; top: 0; z-index: 50; background: rgba(255, 246, 238, .9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linea); }
.cabecera .contenedor { height: 4.75rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.logo { display: flex; align-items: center; gap: .6rem; text-decoration: none; }
.logo svg { width: 2.6rem; height: 2.6rem; }
.logo-palabra { font-family: var(--titulo); font-weight: 700; font-size: 1.9rem; line-height: .9; letter-spacing: -.02em; display: block; }
.logo-sub { font-family: var(--titulo); font-weight: 600; font-size: .7rem; color: var(--musgo); display: block; }
.nav { display: flex; gap: 1.8rem; font-weight: 700; font-size: .95rem; }
.nav a { text-decoration: none; color: var(--musgo); padding: .4rem 0; }
.nav a:hover { color: var(--bosque); }
.acciones { display: flex; align-items: center; gap: .5rem; }
.menu-btn { display: none; width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1.5px solid var(--linea); background: #fff; cursor: pointer; }
.usuaria { display: none; align-items: center; gap: .6rem; }
.usuaria.activa { display: flex; }
.usuaria-datos { text-align: right; line-height: 1.2; }
.usuaria-datos b { display: block; font-size: .9rem; }
.usuaria-datos small { color: var(--musgo); }
.inicial { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--menta); display: grid; place-items: center; font-family: var(--titulo); font-weight: 700; }
.salir { background: none; border: 0; color: var(--coralp); font-weight: 700; cursor: pointer; padding: .5rem; }
@media (max-width: 960px) {
    .menu-btn { display: inline-grid; place-items: center; }
    .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; gap: 0; background: var(--crema); border-bottom: 1px solid var(--linea); padding: .5rem 1.25rem 1rem; }
    .nav.abierta { display: flex; }
    .nav a { padding: .8rem 0; border-bottom: 1px solid var(--linea); }
    .logo-sub { display: none; }
    .usuaria-datos { display: none; }
}

/* Secciones */
.seccion { padding: 5rem 0; }
.seccion-blanca { background: #fff; }
.seccion-crema2 { background: var(--crema-2); }
.cabeza { max-width: 46rem; margin-bottom: 2.75rem; }
.cabeza h2 { font-size: clamp(1.9rem, 4vw, 2.7rem); margin-top: .5rem; }
.cabeza p { margin-top: 1rem; color: var(--musgo); font-size: 1.05rem; }
.centrado { text-align: center; margin-inline: auto; }
.rejilla { display: grid; gap: 1.5rem; }
.r2 { grid-template-columns: repeat(2, 1fr); } .r3 { grid-template-columns: repeat(3, 1fr); } .r4 { grid-template-columns: repeat(4, 1fr); } .r5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1024px) { .r4, .r5 { grid-template-columns: repeat(2, 1fr); } .r3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 680px) { .r2, .r3, .r4, .r5 { grid-template-columns: 1fr; } .r4.movil-2 { grid-template-columns: repeat(2, 1fr); gap: .75rem; } .seccion { padding: 3.75rem 0; } }
.js .aparece { opacity: 0; transform: translateY(14px); transition: opacity .7s ease, transform .7s ease; }
.js .aparece.visible { opacity: 1; transform: none; }

/* Héroe con entrada por rol */
.heroe { position: relative; overflow: hidden; padding: 3.5rem 0 4.5rem; }
.heroe .contenedor { display: grid; grid-template-columns: 1.15fr .85fr; gap: 3.5rem; align-items: center; }
.heroe h1 { font-size: clamp(2.5rem, 6vw, 4.4rem); line-height: 1.02; margin-top: .9rem; }
.heroe h1 em { font-style: normal; color: var(--coralp); }
.heroe-texto { font-size: 1.1rem; color: var(--musgo); margin-top: 1.2rem; max-width: 38rem; }
.roles { margin-top: 2rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.75rem; padding: 1.25rem; box-shadow: var(--sombra); }
.roles-titulo { font-family: var(--titulo); font-weight: 700; font-size: 1.15rem; margin-bottom: .8rem; }
.roles-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.rol-tab { text-align: left; border: 1.5px solid var(--linea); background: var(--crema); border-radius: 1.1rem; padding: .75rem .85rem; cursor: pointer; line-height: 1.25; }
.rol-tab b { display: block; font-size: .95rem; }
.rol-tab small { color: var(--musgo); font-size: .8rem; }
.rol-tab[aria-selected="true"] { border-color: var(--bosque); background: #fff; box-shadow: 0 0 0 3px rgba(158, 208, 183, .6); }
.rol-panel { padding: 1.1rem .25rem .25rem; }
.pasos { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; counter-reset: paso; }
.pasos li { display: flex; gap: .75rem; align-items: flex-start; counter-increment: paso; }
.pasos li::before { content: counter(paso); width: 1.65rem; height: 1.65rem; border-radius: 50%; background: var(--crema-2); display: grid; place-items: center; font: 700 .8rem var(--titulo); flex-shrink: 0; margin-top: .1rem; }
.botones { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.1rem; }
.heroe-foto { position: relative; padding-bottom: 1.5rem; }
.heroe-foto .hoja { aspect-ratio: 4 / 5; background: var(--menta); box-shadow: var(--sombra); }
.heroe-dato { position: absolute; left: -1rem; bottom: 0; background: #fff; border-radius: 1.4rem; box-shadow: var(--sombra); padding: .9rem 1.2rem; display: flex; gap: 1.1rem; align-items: center; }
.heroe-dato b { display: block; font: 700 1.5rem var(--titulo); }
.heroe-dato small { color: var(--musgo); font-size: .78rem; }
.heroe-dato i { width: 1px; height: 2.5rem; background: var(--linea); }
.heroe-patron { position: absolute; inset: 0 0 0 55%; opacity: .45; pointer-events: none; }
@media (max-width: 900px) {
    .heroe .contenedor { grid-template-columns: 1fr; gap: 2.5rem; }
    .heroe-foto { max-width: 26rem; margin-inline: auto; width: 100%; }
    .heroe-dato { left: 0; }
    .heroe-patron { display: none; }
}
@media (max-width: 520px) { .roles-tabs { grid-template-columns: 1fr; } }

/* Rutas */
.ruta { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--linea); border-radius: 1.75rem; overflow: hidden; scroll-margin-top: 6rem; }
.ruta-cab { padding: 1.5rem 1.6rem 1.3rem; }
.ruta-cab h3 { font-size: 1.75rem; margin-top: .6rem; }
.ruta-cab p { margin-top: .5rem; }
.ruta-cuerpo { padding: 1.4rem 1.6rem 1.6rem; display: flex; flex-direction: column; gap: 1.1rem; flex: 1; }
.ficha { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1rem; margin: 0; font-size: .92rem; }
.ficha dt { color: var(--musgo); }
.ficha dd { margin: 0; font-weight: 700; }
.lista-check { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; font-size: .92rem; }
.lista-check li { display: flex; gap: .55rem; }
.lista-check li::before { content: ''; width: .55rem; height: .9rem; border: solid var(--bosque); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg) translateY(-.15rem); flex-shrink: 0; margin: .25rem .2rem 0 .1rem; }
details.desplegable { border-top: 1px solid var(--linea); padding-top: .9rem; }
details.desplegable summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
details.desplegable summary::-webkit-details-marker { display: none; }
details.desplegable summary::after { content: '+'; font: 700 1.3rem/1 var(--titulo); color: var(--coralp); }
details.desplegable[open] summary::after { content: '–'; }
.temario { margin: .9rem 0 0; padding: 0; list-style: none; display: grid; gap: .7rem; font-size: .9rem; }
.temario b { display: block; }
.temario span { color: var(--musgo); }
.ruta-pie { margin-top: auto; display: flex; flex-wrap: wrap; gap: .6rem; }
.ventajas { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; justify-content: center; margin-top: 2rem; color: var(--musgo); font-weight: 600; font-size: .92rem; }
.ventajas span::before { content: '●'; color: var(--menta); margin-right: .45rem; }

/* Biblioteca */
.filtros { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: 1rem; }
.filtro { border: 1.5px solid var(--linea); background: #fff; border-radius: 999px; padding: .5rem .95rem; font-weight: 700; font-size: .875rem; cursor: pointer; min-height: 2.6rem; }
.filtro small { color: var(--musgo); font-weight: 600; margin-left: .2rem; }
.filtro[aria-pressed="true"] { background: var(--bosque); color: #fff; border-color: var(--bosque); }
.filtro[aria-pressed="true"] small { color: rgba(255, 255, 255, .8); }
.buscador { max-width: 26rem; margin-bottom: 1.75rem; }
.recurso { display: flex; flex-direction: column; gap: .8rem; }
.recurso h3 { font-size: 1.2rem; }
.recurso p { color: var(--musgo); font-size: .93rem; }
.recurso ol { margin: .7rem 0 0; padding-left: 1.2rem; display: grid; gap: .35rem; font-size: .9rem; }
.recurso-pie { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: .6rem; flex-wrap: wrap; font-size: .85rem; padding-top: .4rem; }
.recurso-pie a { font-weight: 700; color: var(--coralp); }
.pronto { color: var(--musgo); font-weight: 600; }
.calculadora { display: grid; gap: .5rem; margin-top: .9rem; background: var(--crema); border-radius: 1rem; padding: 1rem; }
.calculadora label { font-size: .85rem; font-weight: 700; }
.resultado { margin-top: .4rem; padding: .8rem 1rem; border-radius: .9rem; background: var(--menta); font-size: .92rem; }
.resultado b { font: 700 1.6rem var(--titulo); display: block; }
.vacio { text-align: center; padding: 2rem; color: var(--musgo); }

/* Sobre el CIC */
.sobre { display: grid; grid-template-columns: 1.1fr .9fr; gap: 3rem; align-items: center; }
.sobre p + p { margin-top: 1rem; }
.cita { margin-top: 1.6rem; border-left: 4px solid var(--coralp); padding: .3rem 0 .3rem 1.1rem; font: 600 1.15rem/1.45 var(--titulo); }
.video { position: relative; aspect-ratio: 4 / 3; background: var(--bosque); }
.video img { opacity: .55; }
.video-capa { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; color: #fff; padding: 1.5rem; }
.video-boton { width: 4.2rem; height: 4.2rem; border-radius: 50%; background: rgba(255, 255, 255, .92); display: grid; place-items: center; margin: 0 auto .8rem; }
.video-boton::after { content: ''; border-left: 1.1rem solid var(--coralp); border-top: .7rem solid transparent; border-bottom: .7rem solid transparent; margin-left: .3rem; }
.cascada { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; gap: .75rem; margin-top: 3.5rem; }
.cascada .tarjeta b { font: 700 2.6rem var(--titulo); display: block; line-height: 1; }
.cascada .tarjeta h3 { font-size: 1.15rem; margin: .5rem 0 .4rem; }
.cascada .tarjeta p { color: var(--musgo); font-size: .92rem; }
.flecha { align-self: center; font: 700 1.6rem var(--titulo); color: var(--coralp); }
@media (max-width: 900px) { .sobre { grid-template-columns: 1fr; } .cascada { grid-template-columns: 1fr; } .flecha { transform: rotate(90deg); justify-self: center; } }
.distintas article h3 { font-size: 1.2rem; margin: 1rem 0 .5rem; }
.distintas article p { color: var(--musgo); font-size: .93rem; }
.icono { width: 3.2rem; height: 3.2rem; border-radius: 1rem; display: grid; place-items: center; }
.icono svg { width: 1.6rem; height: 1.6rem; }
.etapas li { list-style: none; }
.etapas { padding: 0; margin: 0; }
.etapas h3 { font-size: 1.1rem; margin: .9rem 0 .4rem; }
.etapas p { color: var(--musgo); font-size: .9rem; }
.pilar { text-align: center; }
.pilar .numero { margin: 0 auto .8rem; width: 3rem; height: 3rem; }
.pilar h3 { font-size: 1.05rem; margin-bottom: .4rem; }
.pilar p { color: var(--musgo); font-size: .88rem; }
.pilar-base { background: rgba(189, 178, 228, .35); border-color: var(--lavanda); }
.subtitulo { font-size: clamp(1.4rem, 3vw, 1.8rem); margin: 4rem 0 1.5rem; }
.historias figure { margin: 0; }
.historias .hoja, .historias .hoja-inv { aspect-ratio: 4 / 5; }
.historias figcaption { margin-top: .9rem; }
.historias figcaption b { font: 700 1.1rem var(--titulo); display: block; }
.historias figcaption span { color: var(--musgo); font-size: .92rem; }
@media (min-width: 681px) { .historias figure:nth-child(2) { margin-top: 2.5rem; } }

/* Territorio */
.territorio { background: var(--bosque); color: #fff; position: relative; overflow: hidden; }
.territorio .patron-hojas { position: absolute; inset: 0; opacity: .12; }
.territorio .contenedor { position: relative; }
.territorio .eyebrow { color: var(--mantequilla); }
.territorio .cabeza p { color: rgba(255, 255, 255, .85); }
.cifra { padding: 1.4rem; border-radius: 1.25rem; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16); }
.cifra b { font: 700 2.6rem/1 var(--titulo); display: block; margin-bottom: .4rem; }
.cifra span { font-size: .92rem; color: rgba(255, 255, 255, .9); }
.satelites { margin-top: 2rem; }
.satelite { padding: 1.1rem 1.2rem; border-radius: 1.1rem; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); }
.satelite small { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--menta); font-weight: 700; }
.satelite b { display: block; font: 700 1.05rem var(--titulo); margin-top: .25rem; }

/* Aliados */
.aliado h3 { font-size: 1.15rem; margin-bottom: .5rem; }
.aliado p { color: var(--musgo); font-size: .92rem; }
.aliado .chip { margin-bottom: .9rem; }

/* Ayuda */
.ayuda { display: grid; grid-template-columns: 1.3fr .9fr; gap: 2rem; align-items: start; }
.preguntas details { background: #fff; border: 1px solid var(--linea); border-radius: 1.1rem; padding: 1rem 1.2rem; }
.preguntas details + details { margin-top: .6rem; }
.preguntas summary { cursor: pointer; font-weight: 700; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.preguntas summary::-webkit-details-marker { display: none; }
.preguntas summary::after { content: '+'; font: 700 1.3rem/1 var(--titulo); color: var(--coralp); }
.preguntas details[open] summary::after { content: '–'; }
.preguntas details p { margin-top: .7rem; color: var(--musgo); }
.lateral { display: grid; gap: 1rem; }
.lateral h3 { font-size: 1.2rem; margin-bottom: .5rem; }
.lateral p { color: var(--musgo); font-size: .93rem; }
@media (max-width: 900px) { .ayuda { grid-template-columns: minmax(0, 1fr); } }

/* Formularios */
.campo { width: 100%; border: 1.5px solid rgba(46, 74, 62, .25); border-radius: .9rem; padding: .7rem .9rem; background: #fff; font-size: 1rem; min-height: 2.9rem; }
.campo:focus { outline: none; border-color: var(--bosque); box-shadow: 0 0 0 3px rgba(158, 208, 183, .7); }
.etiqueta { display: block; font-weight: 700; font-size: .875rem; margin: .9rem 0 .35rem; }
.ayuda-campo { display: block; font-size: .8rem; color: var(--musgo); margin-top: .3rem; }
.dos-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .8rem; }
@media (max-width: 520px) { .dos-campos { grid-template-columns: 1fr; } }
.mensaje { margin-top: 1rem; border-radius: 1rem; padding: .8rem 1rem; font-size: .9rem; font-weight: 600; }
.mensaje.error { background: rgba(238, 152, 132, .3); border: 1px solid var(--coral); }
.mensaje.ok { background: rgba(158, 208, 183, .4); border: 1px solid var(--menta); }
.casilla { display: flex; gap: .7rem; align-items: flex-start; font-size: .88rem; margin-top: 1rem; }
.casilla input { width: 1.25rem; height: 1.25rem; accent-color: var(--bosque); flex-shrink: 0; margin-top: .15rem; }

/* Política y pie */
.politica { max-width: 52rem; }
.politica h3 { font-size: 1.05rem; margin: 1.3rem 0 .4rem; }
.politica p, .politica li { color: var(--musgo); font-size: .93rem; }
.politica ul { padding-left: 1.2rem; margin: .4rem 0 0; }
.pie { background: #fff; border-top: 1px solid var(--linea); padding: 3.5rem 0 2rem; }
.pie-rejilla { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 2rem; }
.pie h2 { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--coralp); margin-bottom: .8rem; font-family: var(--texto); }
.pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.pie ul a { text-decoration: none; color: var(--musgo); font-weight: 600; font-size: .93rem; }
.pie ul a:hover { color: var(--bosque); text-decoration: underline; }
.pie-legal { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--linea); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; font-size: .85rem; color: var(--musgo); }
@media (max-width: 900px) { .pie-rejilla { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .pie-rejilla { grid-template-columns: 1fr; } }

/* Diálogo de ingreso */
dialog { width: min(34rem, 100vw - 1.5rem); max-height: calc(100vh - 1.5rem); border: 0; border-radius: 2rem; padding: 0; background: var(--crema); color: var(--bosque); box-shadow: 0 30px 60px -20px rgba(46, 74, 62, .5); }
dialog::backdrop { background: rgba(46, 74, 62, .55); backdrop-filter: blur(3px); }
dialog[open] { animation: abre .25s ease; }
@keyframes abre { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.dialogo { position: relative; padding: 1.4rem; }
@media (min-width: 560px) { .dialogo { padding: 2rem; } }
.cerrar { position: absolute; top: 1rem; right: 1rem; width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 0; background: none; font-size: 1.6rem; cursor: pointer; }
.cerrar:hover { background: rgba(46, 74, 62, .08); }
.perfiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; }
.perfil input { position: absolute; opacity: 0; pointer-events: none; }
.perfil span { display: block; height: 100%; border: 2px solid var(--linea); border-radius: 1rem; background: rgba(255, 255, 255, .6); padding: .75rem .3rem; text-align: center; cursor: pointer; font-weight: 700; font-size: .8rem; line-height: 1.2; }
.perfil span::before { content: ''; display: block; width: 1.9rem; height: 1.9rem; border-radius: 50%; margin: 0 auto .45rem; background: var(--c); }
.perfil input:checked + span { border-color: var(--bosque); background: #fff; box-shadow: 0 0 0 3px rgba(158, 208, 183, .6); }
.perfil input:focus-visible + span { outline: 3px solid var(--coralp); outline-offset: 2px; }
@media (min-width: 560px) { .perfil span { font-size: .9rem; } }
.conmutador { display: grid; grid-template-columns: 1fr 1fr; gap: .25rem; background: #fff; border: 1px solid var(--linea); border-radius: 999px; padding: .25rem; margin-top: 1.1rem; }
.conmutador button { border: 0; background: none; border-radius: 999px; padding: .55rem; font-weight: 700; font-size: .9rem; cursor: pointer; }
.conmutador button[aria-selected="true"] { background: var(--bosque); color: #fff; }
.nota { margin-top: 1rem; font-size: .88rem; border-radius: 1rem; padding: .75rem 1rem; }
.clave { position: relative; }
.clave .campo { padding-right: 5.5rem; }
.ver { position: absolute; right: .4rem; top: 50%; transform: translateY(-50%); border: 0; background: none; color: var(--coralp); font-weight: 700; font-size: .85rem; padding: .5rem .7rem; cursor: pointer; }
.ancho { width: 100%; margin-top: 1.4rem; }
.texto-boton { display: block; margin: .8rem auto 0; background: none; border: 0; color: var(--musgo); font-weight: 700; font-size: .88rem; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }

/* Plataforma (después de ingresar) */
.plataforma-cab { position: relative; overflow: hidden; background: var(--crema-2); padding: 2.5rem 0; }
.plataforma-cab .patron-hojas { position: absolute; inset: 0 0 0 35%; opacity: .4; }
.plataforma-cab .contenedor { position: relative; }
.plataforma-cab h1 { font-size: clamp(2.1rem, 5vw, 3rem); margin-top: .5rem; }
.plataforma-cab h1:focus { outline: none; }
.aviso-demo { display: inline-block; background: var(--mantequilla); border-radius: 999px; padding: .4rem 1rem; font-size: .85rem; font-weight: 600; margin-bottom: 1.1rem; }
.aviso-clave { margin-top: 1.4rem; background: #fff; border-left: 4px solid var(--coralp); border-radius: 1rem; padding: 1rem 1.2rem; display: flex; flex-wrap: wrap; gap: .8rem 1.2rem; align-items: center; max-width: 48rem; }
.aviso-clave p { flex: 1 1 18rem; font-size: .92rem; }
.continuar { margin-top: 1.4rem; background: var(--bosque); color: #fff; border-radius: 1.4rem; padding: 1.2rem 1.4rem; display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; max-width: 48rem; }
.continuar small { color: var(--menta); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: .72rem; }
.continuar b { display: block; font: 700 1.15rem var(--titulo); margin-top: .2rem; }
.pestanas { display: flex; gap: .5rem; overflow-x: auto; padding: 1.4rem 0 .4rem; }
.pestana { flex-shrink: 0; border: 1.5px solid var(--linea); background: #fff; border-radius: 999px; padding: .6rem 1.2rem; font-weight: 700; font-size: .9rem; cursor: pointer; }
.pestana[aria-selected="true"] { background: var(--bosque); color: #fff; border-color: var(--bosque); }
.vista { padding: 1.5rem 0 4rem; }
.vista h2 { font-size: clamp(1.6rem, 3.5vw, 2rem); }
.vista-intro { color: var(--musgo); margin: .4rem 0 1.6rem; }
.curso { background: #fff; border: 1px solid var(--linea); border-radius: 1.5rem; overflow: hidden; }
.curso-cab { padding: 1.3rem 1.4rem 1.1rem; }
.curso-cab h3 { font-size: 1.45rem; margin-top: .3rem; }
.curso-cuerpo { padding: 1.2rem 1.4rem 1.4rem; }
.barra { display: flex; align-items: center; gap: .7rem; margin-top: .9rem; font-weight: 700; font-size: .9rem; }
.barra-fondo { flex: 1; height: .6rem; border-radius: 999px; background: var(--crema-2); overflow: hidden; }
.barra-fondo span { display: block; height: 100%; background: var(--bosque); border-radius: 999px; transition: width .4s; }
.modulos { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .2rem; }
.modulos label { display: flex; gap: .7rem; padding: .65rem .6rem; border-radius: .9rem; cursor: pointer; }
.modulos label:hover { background: var(--crema); }
.modulos input { width: 1.25rem; height: 1.25rem; accent-color: var(--bosque); flex-shrink: 0; margin-top: .15rem; }
.modulos b { display: block; font-size: .92rem; }
.modulos span span { color: var(--musgo); font-size: .88rem; }
.modulos .siguiente { background: rgba(158, 208, 183, .3); }
.logros { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.logro { display: flex; align-items: center; gap: .7rem; background: #fff; border: 1px solid var(--linea); border-radius: 999px; padding: .5rem 1rem .5rem .5rem; font-weight: 700; font-size: .9rem; }
.logro svg { width: 2.2rem; height: 2.2rem; }
.logro.pendiente { opacity: .55; }
.kpi b { font: 700 2rem var(--titulo); display: block; }
.kpi span { color: var(--musgo); font-size: .88rem; }
.barras { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.barras li { display: grid; grid-template-columns: 6.5rem 1fr 2rem; gap: .7rem; align-items: center; font-size: .9rem; }
.barras .barra-fondo span { background: var(--menta); }
.barras b { text-align: right; }
.tabla-caja { background: #fff; border: 1px solid var(--linea); border-radius: 1.5rem; overflow-x: auto; }
table { width: 100%; min-width: 44rem; border-collapse: collapse; text-align: left; }
th { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--musgo); padding: 1rem .9rem; }
td { border-top: 1px solid var(--linea); padding: .8rem .9rem; font-size: .9rem; vertical-align: top; }
th:first-child, td:first-child { padding-left: 1.3rem; }
td b { display: block; }
td small { color: var(--musgo); }
.boton-texto { background: none; border: 0; padding: 0; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.controles { display: flex; flex-wrap: wrap; gap: .8rem; align-items: flex-end; margin: 2rem 0 1.2rem; }
.controles > div { flex: 1 1 14rem; max-width: 26rem; }
.datos { margin: 0; }
.datos div { display: grid; grid-template-columns: 7.5rem 1fr; gap: .8rem; padding: .7rem 0; border-top: 1px solid var(--linea); }
.datos dt { color: var(--musgo); font-size: .9rem; }
.datos dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.etapa-actual { background: var(--coralp); color: #fff; }
.etapa-pendiente { background: var(--crema-2); color: var(--musgo); }
.lado-bosque { background: var(--bosque); color: #fff; border-radius: 1.5rem; padding: 1.6rem; position: relative; overflow: hidden; }
.lado-bosque .patron-hojas { position: absolute; inset: 0; opacity: .12; }
.lado-bosque > div { position: relative; display: grid; gap: .7rem; }
.aviso { position: fixed; left: 50%; bottom: 1.25rem; transform: translateX(-50%); z-index: 80; background: var(--bosque); color: #fff; padding: .8rem 1.3rem; border-radius: 999px; font-weight: 600; font-size: .9rem; box-shadow: var(--sombra); max-width: calc(100vw - 2rem); text-align: center; }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .js .aparece { opacity: 1; transform: none; transition: none; }
    dialog[open] { animation: none; }
    .btn:hover { transform: none; }
}
/* ===== Submenús de la barra de navegación ===== */
.nav { align-items: center; }
.submenu { position: relative; }
.submenu-btn { display: inline-flex; align-items: center; gap: .3rem; background: none; border: 0; padding: .4rem 0; font-weight: 700; font-size: .95rem; color: var(--musgo); cursor: pointer; }
.submenu-btn:hover, .submenu-btn[aria-expanded="true"] { color: var(--bosque); }
.submenu-btn svg { width: .75rem; height: .75rem; transition: transform .2s; }
.submenu-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.submenu-lista { list-style: none; margin: 0; padding: .5rem; position: absolute; top: calc(100% + .6rem); left: -1rem; min-width: 17rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.2rem; box-shadow: var(--sombra); display: grid; gap: .15rem; z-index: 60; }
.submenu-lista a { display: flex; align-items: center; gap: .75rem; padding: .6rem .7rem; border-radius: .8rem; text-decoration: none; color: var(--bosque); }
.submenu-lista a:hover, .submenu-lista a:focus-visible { background: var(--crema); }
.submenu-lista a[aria-current="page"] { background: var(--crema-2); }
.submenu-lista b { display: block; font-size: .93rem; }
.submenu-lista small { display: block; color: var(--musgo); font-size: .8rem; font-weight: 600; }
.submenu-lista .punto { width: .8rem; height: .8rem; border-radius: 50%; flex-shrink: 0; }
.submenu-lista .todas { border-top: 1px solid var(--linea); margin-top: .25rem; padding-top: .7rem; border-radius: 0 0 .8rem .8rem; font-weight: 700; font-size: .88rem; color: var(--coralp); }
.nav > a[aria-current="page"], .submenu-btn.actual { color: var(--bosque); }
@media (max-width: 960px) {
    .nav { align-items: stretch; max-height: calc(100vh - 4.75rem); overflow-y: auto; }
    .submenu { border-bottom: 1px solid var(--linea); }
    .submenu-btn { width: 100%; justify-content: space-between; padding: .8rem 0; }
    .submenu-lista { position: static; box-shadow: none; border: 0; padding: 0 0 .6rem; min-width: 0; background: transparent; }
    .submenu-lista a { padding: .55rem .5rem; }
    .submenu-lista .todas { border-top: 0; margin-top: 0; padding-top: .55rem; }
}

/* ===== Páginas internas de cada ruta ===== */
.migas { padding: 1.2rem 0 0; font-size: .88rem; }
.migas ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; color: var(--musgo); }
.migas li + li::before { content: '›'; margin-right: .4rem; }
.migas a { color: var(--musgo); font-weight: 600; }
.migas [aria-current] { color: var(--bosque); font-weight: 700; }
.ruta-heroe { position: relative; overflow: hidden; margin-top: 1rem; border-radius: 2rem; padding: 2.5rem; }
.ruta-heroe .patron-hojas { position: absolute; inset: 0 0 0 45%; opacity: .5; pointer-events: none; }
.ruta-heroe-grid { position: relative; display: grid; grid-template-columns: 1.2fr .8fr; gap: 2.5rem; align-items: center; }
.ruta-heroe h1 { font-size: clamp(2.4rem, 6vw, 4rem); margin-top: .8rem; }
.ruta-heroe .lead { font-size: 1.15rem; margin-top: 1rem; max-width: 36rem; }
.ficha-tarjeta { background: #fff; border-radius: 1.5rem; padding: 1.5rem; box-shadow: var(--sombra); }
.ficha-tarjeta .ficha { grid-template-columns: 7.5rem 1fr; gap: .7rem 1rem; font-size: .93rem; }
.ficha-tarjeta .ficha dt { font-weight: 600; }
@media (max-width: 860px) { .ruta-heroe { padding: 1.6rem; border-radius: 1.5rem; } .ruta-heroe-grid { grid-template-columns: 1fr; } .ruta-heroe .patron-hojas { display: none; } }
.bloque { padding: 4rem 0 0; }
.bloque h2 { font-size: clamp(1.7rem, 3.5vw, 2.3rem); }
.bloque > .contenedor > p.intro { color: var(--musgo); margin: .8rem 0 2rem; max-width: 46rem; font-size: 1.05rem; }
.obtienes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.obtienes li { background: #fff; border: 1px solid var(--linea); border-radius: 1.2rem; padding: 1.1rem 1.2rem; display: flex; gap: .8rem; align-items: flex-start; font-weight: 600; }
.obtienes li::before { content: ''; width: 1.6rem; height: 1.6rem; border-radius: 50%; flex-shrink: 0; background: var(--menta) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%232E4A3E' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 1rem no-repeat; }
@media (max-width: 860px) { .obtienes { grid-template-columns: 1fr; } }
.funciona { display: grid; grid-template-columns: .9fr 1.1fr; gap: 2.5rem; align-items: center; }
.funciona .hoja, .funciona .hoja-inv { aspect-ratio: 4 / 3.4; }
@media (max-width: 860px) { .funciona { grid-template-columns: 1fr; } }
.linea { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; position: relative; }
.linea::before { content: ''; position: absolute; left: 1.7rem; top: 1.5rem; bottom: 1.5rem; width: 2px; background: var(--linea); }
.paso-ruta { position: relative; display: grid; grid-template-columns: 3.4rem 1fr; gap: 1.1rem; scroll-margin-top: 6rem; }
.paso-ruta .numero { width: 3.4rem; height: 3.4rem; font-size: 1.05rem; position: relative; border: 4px solid var(--crema); }
.paso-ruta .tarjeta { padding: 1.3rem 1.4rem; }
.paso-ruta h3 { font-size: 1.25rem; }
.paso-ruta .meta { font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--coralp); }
.paso-ruta p { color: var(--musgo); margin-top: .5rem; }
.paso-ruta .logra { margin-top: .8rem; color: var(--bosque); font-size: .93rem; }
.llevas { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; align-items: center; }
.llevas span { font-size: .8rem; font-weight: 700; color: var(--musgo); }
.llevas a { font-size: .85rem; font-weight: 700; text-decoration: none; background: var(--crema-2); border-radius: 999px; padding: .35rem .8rem; }
.llevas a:hover { background: var(--menta); }
.requisitos { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; counter-reset: req; }
.requisitos li { counter-increment: req; display: flex; gap: .9rem; align-items: flex-start; }
.requisitos li::before { content: counter(req); width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: var(--bosque); color: #fff; font: 700 .9rem var(--titulo); flex-shrink: 0; }
.dos-col { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: start; }
@media (max-width: 860px) { .dos-col { grid-template-columns: 1fr; } }
.otra-ruta { display: flex; flex-direction: column; gap: .5rem; text-decoration: none; border-radius: 1.5rem; padding: 1.5rem; transition: transform .2s; }
.otra-ruta:hover { transform: translateY(-2px); }
.otra-ruta h3 { font-size: 1.4rem; }
.otra-ruta span { font-weight: 700; color: var(--coralp); margin-top: auto; }
.cta-banda { margin: 4rem 0 0; background: var(--bosque); color: #fff; border-radius: 2rem; padding: 2.2rem; display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; justify-content: space-between; position: relative; overflow: hidden; }
.cta-banda .patron-hojas { position: absolute; inset: 0; opacity: .12; }
.cta-banda > * { position: relative; }
.cta-banda h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
.cta-banda p { opacity: .9; margin-top: .4rem; }
.pagina-ruta { padding-bottom: 4rem; }
@media (max-width: 960px) { .nav .submenu-lista a { border-bottom: 0; } }
@media (max-width: 520px) {
    .ficha-tarjeta .ficha { grid-template-columns: 1fr; gap: .1rem; }
    .ficha-tarjeta .ficha dd { margin-bottom: .7rem; }
    .paso-ruta { grid-template-columns: 2.6rem 1fr; gap: .7rem; }
    .paso-ruta .numero { width: 2.6rem; height: 2.6rem; font-size: .85rem; }
    .linea::before { left: 1.3rem; }
}

/* ===== Movimiento, patrones y clic ===== */
/* Fotos que respiran: un acercamiento lento y continuo */
@keyframes respirar { from { transform: scale(1.03) translate(0, 0); } to { transform: scale(1.1) translate(-1.6%, -1.2%); } }
.foto-duo { animation: respirar 18s ease-in-out infinite alternate; transform-origin: 60% 40%; will-change: transform; }
/* La hoja cambia de forma al pasar el cursor */
.hoja, .hoja-inv { transition: border-radius .9s cubic-bezier(.3, .7, .2, 1), transform .6s ease; }
.hoja:hover { border-radius: 1.5rem 46% 1.5rem 46% / 1.5rem 46% 1.5rem 46%; }
.hoja-inv:hover { border-radius: 46% 1.5rem 46% 1.5rem / 46% 1.5rem 46% 1.5rem; }
/* Desplazamiento leve de las fotos al bajar (lo calcula sitio.js) */
.paralaje { transform: translate3d(0, var(--desfase, 0px), 0); }

/* Hojas flotantes decorativas (sitio.js las crea dentro de [data-hojas]) */
.hojas-flotantes { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 0; }
.hojas-flotantes span { position: absolute; width: var(--t); height: calc(var(--t) * 1.55); background: var(--c); border-radius: 0 100% 0 100%; opacity: .5; transform: rotate(var(--g)); animation: flotar var(--d) ease-in-out var(--r) infinite; }
@keyframes flotar {
    0%, 100% { transform: translate(0, 0) rotate(var(--g)); }
    50% { transform: translate(12px, -20px) rotate(calc(var(--g) + 22deg)); }
}

/* Patrones de fondo para algunas secciones */
.con-decor { position: relative; overflow: hidden; }
.con-decor > .contenedor { position: relative; z-index: 1; }
.decor { position: absolute; pointer-events: none; z-index: 0; }
.decor-derecha { top: 0; right: 0; width: 42%; height: 60%; -webkit-mask-image: radial-gradient(circle at 100% 0, #000 20%, transparent 70%); mask-image: radial-gradient(circle at 100% 0, #000 20%, transparent 70%); }
.decor-izquierda { bottom: 0; left: 0; width: 45%; height: 65%; -webkit-mask-image: radial-gradient(circle at 0 100%, #000 20%, transparent 70%); mask-image: radial-gradient(circle at 0 100%, #000 20%, transparent 70%); }
.decor-completo { inset: 0; -webkit-mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); }
.patron-puntos { background-image: radial-gradient(rgba(46, 74, 62, .16) 1.5px, transparent 1.8px); background-size: 22px 22px; }
.patron-ondas { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='44' viewBox='0 0 160 44'%3E%3Cpath d='M0 22 Q 20 8 40 22 T 80 22 T 120 22 T 160 22' fill='none' stroke='%239ED0B7' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-size: 160px 44px; opacity: .7; }
.patron-durazno { background-image: radial-gradient(rgba(242, 181, 146, .55) 2px, transparent 2.4px); background-size: 26px 26px; }
@keyframes deriva { to { background-position: 144px 72px; } }
@keyframes deriva-ondas { to { background-position: 160px 0; } }
.patron-hojas.animado { animation: deriva 60s linear infinite; }
.patron-ondas.animado { animation: deriva-ondas 22s linear infinite; }

/* El trazo firme se dibuja al aparecer */
.js .trazo { clip-path: inset(0 100% 0 0); transition: clip-path 1.2s cubic-bezier(.6, .1, .2, 1) .25s; }
.js .trazo.visible { clip-path: inset(0 0 0 0); }

/* Apariciones escalonadas */
.js .aparece { transition-delay: calc(var(--i, 0) * 90ms); }

/* Botones: se hunden un poco al tocarlos */
.btn:active { transform: translateY(1px) scale(.97); }
.btn-primario:active { background: var(--bosque); }
.btn-borde:active, .btn-claro:active { background: var(--menta); }

/* Chispa del clic: un aro y pétalos de un color distinto al del botón */
.chispa { position: fixed; z-index: 95; pointer-events: none; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; border: 2.5px solid var(--c); animation: chispa .6s ease-out forwards; }
@keyframes chispa { from { transform: scale(.4); opacity: 1; } to { transform: scale(4.6); opacity: 0; } }
.petalo { position: fixed; z-index: 95; pointer-events: none; width: 7px; height: 11px; margin: -5px 0 0 -3px; background: var(--c); border-radius: 0 100% 0 100%; animation: petalo .75s cubic-bezier(.2, .7, .3, 1) forwards; }
@keyframes petalo { from { transform: translate(0, 0) rotate(var(--g)) scale(1); opacity: 1; } to { transform: translate(var(--x), var(--y)) rotate(calc(var(--g) + 120deg)) scale(.5); opacity: 0; } }

/* ===== Biblioteca de recursos (página interna y adelanto en el inicio) ===== */
.temas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.tema { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.2rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.3rem; text-decoration: none; transition: transform .25s, box-shadow .25s; }
.tema:hover { transform: translateY(-3px); box-shadow: var(--sombra); }
.tema b { display: block; font: 700 1.1rem var(--titulo); }
.tema small { color: var(--musgo); font-weight: 600; }
.tema .icono { flex-shrink: 0; }
@media (max-width: 860px) { .temas { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .temas { grid-template-columns: 1fr; } }
.calc-destacada { display: grid; grid-template-columns: 1fr auto; gap: 1.5rem; align-items: center; margin-top: 1.5rem; padding: 1.6rem 1.8rem; border-radius: 1.6rem; background: var(--mantequilla); position: relative; overflow: hidden; }
.calc-destacada > * { position: relative; }
.calc-destacada h3 { font-size: 1.4rem; }
.calc-destacada p { margin-top: .3rem; }
@media (max-width: 680px) { .calc-destacada { grid-template-columns: 1fr; } }
.biblio-heroe { position: relative; overflow: hidden; margin-top: 1rem; border-radius: 2rem; padding: 2.5rem; background: var(--crema-2); }
.biblio-heroe > .contenido { position: relative; z-index: 1; max-width: 46rem; }
.biblio-heroe h1 { font-size: clamp(2.3rem, 5.5vw, 3.6rem); margin-top: .8rem; }
.biblio-heroe .lead { font-size: 1.12rem; margin-top: 1rem; color: var(--musgo); }
.biblio-cifras { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; margin-top: 1.4rem; font-weight: 700; }
.biblio-cifras b { font: 700 1.6rem var(--titulo); margin-right: .3rem; }
.biblio-buscar { margin-top: 1.6rem; max-width: 30rem; position: relative; }
.biblio-buscar .campo { padding-left: 2.8rem; min-height: 3.2rem; border-radius: 999px; }
.biblio-buscar svg { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); width: 1.2rem; height: 1.2rem; color: var(--musgo); }
@media (max-width: 680px) { .biblio-heroe { padding: 1.6rem; border-radius: 1.5rem; } }
.recurso { scroll-margin-top: 6rem; transition: transform .25s, box-shadow .25s; }
.recurso:hover { transform: translateY(-3px); box-shadow: var(--sombra); }
.recurso:target { box-shadow: 0 0 0 3px var(--coralp); }
.recurso .para { font-size: .9rem; color: var(--bosque); }
.calculadora-grande { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: start; scroll-margin-top: 6rem; }
.calculadora-grande .calculadora { margin-top: 0; background: #fff; padding: 1.4rem; }
.formula { margin-top: 1rem; background: #fff; border-radius: 1rem; padding: 1rem 1.2rem; font: 700 1.05rem var(--titulo); text-align: center; }
@media (max-width: 860px) { .calculadora-grande { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
    .foto-duo, .hojas-flotantes span, .patron-hojas.animado, .patron-ondas.animado { animation: none; }
    .paralaje { transform: none; }
    .js .trazo { clip-path: none; transition: none; }
    .chispa, .petalo { display: none; }
    .hoja, .hoja-inv, .tema, .recurso { transition: none; }
}
.js .recurso.aparece.visible:hover, .js .tema.aparece.visible:hover, .js .otra-ruta.aparece.visible:hover { transform: translateY(-3px); }
@media (prefers-reduced-motion: reduce) { .js .recurso.aparece.visible:hover, .js .tema.aparece.visible:hover, .js .otra-ruta.aparece.visible:hover { transform: none; } }
/* El contenido siempre por encima de las hojas y los patrones decorativos */
.heroe > .contenedor, .territorio > .contenedor, .ruta-heroe-grid, .cta-banda > div:not(.hojas-flotantes):not(.patron-hojas), .cta-banda > a, .calc-destacada > div:not(.hojas-flotantes), .calc-destacada > a { position: relative; z-index: 1; }
.hojas-flotantes span { opacity: .42; }

/* ===== Semanas y talleres con sus descargas (rutas HACER y SER, y «Mi semana») ===== */
.recuadro { border-radius: 1.1rem; padding: 1rem 1.2rem; margin: 1.1rem 0; overflow-wrap: anywhere; }
.recuadro.fresco { background: rgba(153, 207, 200, .28); border-left: 4px solid var(--agua); }
.recuadro.calido { background: rgba(244, 225, 161, .45); border-left: 4px solid var(--mantequilla); }
.recuadro-titulo { font: 700 1rem var(--titulo); margin-top: 0 !important; }
.abrir-leccion { display: inline-flex; margin-top: .9rem; font-weight: 700; color: var(--coralp); text-decoration: none; }
.abrir-leccion:hover { text-decoration: underline; }
.semanas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
@media (max-width: 860px) { .semanas { grid-template-columns: minmax(0, 1fr); } }
.semana-card { background: #fff; border: 1px solid var(--linea); border-radius: 1.5rem; padding: 1.4rem; scroll-margin-top: 6rem; display: flex; flex-direction: column; gap: .7rem; }
.semana-card:target { box-shadow: 0 0 0 3px var(--coralp); }
.semana-cab { display: flex; gap: .9rem; align-items: center; }
.semana-cab .numero { width: 3rem; height: 3rem; font-size: 1.15rem; }
.semana-meta { font-size: .875rem; font-weight: 700; color: var(--coralp); }
.semana-card h3 { font-size: 1.3rem; }
.semana-card > p { color: var(--musgo); }
.semana-sub { font-weight: 700; margin-top: .3rem; }
.semana-extra { margin-top: .3rem; padding: .75rem .9rem; border-radius: .9rem; background: rgba(189, 178, 228, .3); font-size: .95rem; }
.descargas { display: grid; gap: .55rem; }
.descargas-grandes { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.descarga { display: flex; align-items: center; gap: .8rem; min-height: 3.6rem; padding: .65rem .9rem; border-radius: 1rem; background: var(--crema); border: 1px solid var(--linea); text-decoration: none; transition: transform .2s, background-color .2s; }
.descarga:hover { transform: translateY(-2px); background: #fff; }
.descarga-icono { width: 2.6rem; height: 2.6rem; border-radius: .7rem; display: grid; place-items: center; font: 700 .75rem var(--titulo); flex-shrink: 0; }
.descarga b { display: block; font-size: .95rem; line-height: 1.3; }
.descarga small { color: var(--musgo); font-size: .875rem; }
.descarga-flecha { margin-left: auto; font: 700 1.2rem var(--titulo); color: var(--coralp); }
.video-pendiente { padding: .8rem 1rem; border-radius: 1rem; background: var(--crema); color: var(--musgo); font-size: .95rem; }

/* ===== Talleres y cursos del equipo ===== */
@media (min-width: 961px) and (max-width: 1180px) { .nav { gap: 1.1rem; font-size: .9rem; } .submenu-btn { font-size: .9rem; } }
.equipo-bloque { margin-top: 3rem; display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items: center; background: var(--crema); border: 1px solid var(--linea); border-radius: 1.75rem; padding: 2rem; }
.equipo-bloque h3 { font-size: clamp(1.4rem, 3vw, 1.8rem); margin: .4rem 0 .6rem; }
.equipo-bloque .botones { margin-top: 1.2rem; }
.equipo-cursos { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.equipo-cursos a { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; background: #fff; border-radius: 1rem; border: 1px solid var(--linea); text-decoration: none; }
.equipo-cursos a:hover { box-shadow: var(--sombra); }
.equipo-cursos .punto { width: .9rem; height: .9rem; border-radius: 50%; flex-shrink: 0; }
.equipo-cursos b { display: block; }
.equipo-cursos small { color: var(--musgo); font-weight: 600; }
@media (max-width: 860px) { .equipo-bloque { grid-template-columns: 1fr; padding: 1.4rem; } }
.privado { display: flex; gap: .5rem; align-items: center; margin-top: .9rem; font-size: .85rem; font-weight: 700; color: var(--musgo); }
.privado svg { width: 1rem; height: 1rem; flex-shrink: 0; }
.curso .privado { padding: .7rem .8rem; background: var(--crema); border-radius: .8rem; }
.enlaces-modulo { display: flex !important; flex-wrap: wrap; gap: .3rem 1rem; margin-top: .3rem; }
.enlaces-modulo .enlace { font-size: .85rem; }
.llevas .chip { font-size: .72rem; text-transform: none; letter-spacing: 0; }
.nota-equipo { margin-top: .9rem; font-size: .88rem; }
.nota-equipo a { font-weight: 700; color: var(--bosque); }
.pie-rejilla { grid-template-columns: 1.4fr repeat(4, 1fr); }
@media (max-width: 1024px) { .pie-rejilla { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .pie-rejilla { grid-template-columns: 1fr; } }

/* ===== El CIC: páginas del modelo (generadas por herramientas/generar_el_cic.pl) ===== */
.subnav-cic { margin-top: 1.2rem; }
.subnav-cic ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.subnav-cic a { display: block; white-space: nowrap; text-decoration: none; font-weight: 700; font-size: .9rem; padding: .55rem 1.05rem; border-radius: 999px; background: #fff; border: 1px solid var(--linea); transition: background .2s; }
.subnav-cic a:hover { background: var(--menta); }
.subnav-cic a[aria-current] { background: var(--bosque); border-color: var(--bosque); color: #fff; }
.pagina-cic .bloque { scroll-margin-top: 5rem; }
.lista-limpia { list-style: none; padding: 0; margin: 1.4rem 0 0; }
.tarjeta-num h3 { font-size: 1.15rem; margin: .9rem 0 .45rem; }
.tarjeta-num p { color: var(--musgo); font-size: .93rem; }
.tarjeta-num .numero { font-size: .95rem; }
a.enlace-tarjeta { display: block; text-decoration: none; transition: transform .25s, box-shadow .25s; }
a.enlace-tarjeta:hover { box-shadow: var(--sombra); }
.js a.enlace-tarjeta.aparece.visible:hover { transform: translateY(-3px); }
.tabla-cic { margin-top: 1.4rem; }
.tabla-cic table { min-width: 44rem; }
#hoja-de-ruta .tabla-cic table { min-width: 66rem; }
.tabla-cic thead th { background: var(--bosque); color: #fff; letter-spacing: .03em; text-transform: none; font-size: .84rem; }
.tabla-cic tbody th { font: 700 .95rem/1.3 var(--titulo); color: var(--bosque); text-transform: none; letter-spacing: 0; padding: .8rem .9rem .8rem 1.3rem; border-top: 1px solid var(--linea); vertical-align: top; }
.tabla-cic caption { caption-side: bottom; text-align: left; padding: .75rem 1.3rem .9rem; font-size: .84rem; color: var(--musgo); border-top: 1px solid var(--linea); }
.tabla-cic td small { display: block; margin-top: .2rem; }
.riesgo h3 { font-size: 1.2rem; margin-bottom: .5rem; }
.riesgo p { color: var(--musgo); font-size: .93rem; }
.riesgo .mitiga { margin-top: .8rem; color: var(--bosque); background: rgba(158, 208, 183, .3); border-radius: .9rem; padding: .7rem .9rem; }
.columnas-2 { grid-template-columns: 1fr 1fr; column-gap: 1.6rem; }
@media (max-width: 760px) { .columnas-2 { grid-template-columns: 1fr; } }
.codigos { list-style: none; margin: .8rem 0 0; padding: 0; display: grid; gap: .45rem; font-size: .93rem; }
.codigos b { display: inline-block; min-width: 3.1rem; color: var(--coralp); }
.refs { margin: 0; padding-left: 1.1rem; display: grid; gap: .45rem; font-size: .9rem; color: var(--musgo); }
.letras { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1.4rem 0 1.2rem; }
.letras a { width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: 50%; background: #fff; border: 1px solid var(--linea); font: 700 .95rem var(--titulo); text-decoration: none; }
.letras a:hover { background: var(--menta); }
.glosario { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 0; }
.glosario > div { background: #fff; border: 1px solid var(--linea); border-radius: 1.2rem; padding: 1.1rem 1.3rem; scroll-margin-top: 6rem; }
.glosario > div:target { box-shadow: 0 0 0 3px var(--coralp); }
.glosario dt { font: 700 1.1rem var(--titulo); color: var(--bosque); }
.glosario dd { margin: .35rem 0 0; color: var(--musgo); font-size: .93rem; }
@media (max-width: 760px) { .glosario { grid-template-columns: 1fr; } }
.fuente-cic { margin-top: 2.4rem; padding-top: 1.1rem; border-top: 1px solid var(--linea); font-size: .87rem; color: var(--musgo); max-width: 60rem; }
.pagina-cic .otra-ruta p { color: var(--bosque); font-size: .93rem; }
@media (prefers-reduced-motion: reduce) { a.enlace-tarjeta, .js a.enlace-tarjeta.aparece.visible:hover { transition: none; transform: none; } }

/* ===== Cómo funciona: de la Secretaría Técnica a cada emprendedora ===== */
.flujo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.flujo-paso { position: relative; display: flex; gap: .9rem; align-items: flex-start; background: #fff; border: 1px solid var(--linea); border-radius: 1.4rem; padding: 1.2rem; }
.flujo-paso + .flujo-paso::before { content: '→'; position: absolute; left: -.7rem; top: 50%; transform: translate(-50%, -50%); font: 700 1.3rem var(--titulo); color: var(--coralp); }
.flujo-num { width: 2.6rem; height: 2.6rem; border-radius: 50%; display: grid; place-items: center; font: 700 1.05rem var(--titulo); flex-shrink: 0; }
.flujo h3 { font-size: 1.15rem; margin-bottom: .3rem; }
.flujo p { color: var(--musgo); font-size: .95rem; }
@media (max-width: 860px) {
    .flujo { grid-template-columns: minmax(0, 1fr); }
    .flujo-paso + .flujo-paso::before { content: '↓'; left: 2.5rem; top: -.75rem; }
}

/* ===== Mapa de los satélites ===== */
.mapa-cic { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 2rem; align-items: start; margin-top: 2rem; }
@media (max-width: 900px) { .mapa-cic { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; } }
.mapa-figura { margin: 0; background: #fff; border: 1px solid var(--linea); border-radius: 1.75rem; padding: 1rem; }
.mapa-figura figcaption { font-size: .875rem; color: var(--musgo); padding: .4rem .5rem 0; }
.mapa-svg { width: 100%; height: auto; display: block; }
.mapa-depto { stroke: #fff; stroke-width: 2.5; stroke-linejoin: round; opacity: .8; }
.mapa-depto-nombre { font: 700 14px var(--titulo); fill: var(--bosque); opacity: .75; pointer-events: none; }
.mapa-mar { font: italic 600 15px var(--texto); fill: var(--musgo); opacity: .6; letter-spacing: .15em; }
.mapa-linea { fill: none; stroke: var(--musgo); stroke-width: 1.6; stroke-dasharray: 4 5; opacity: .45; transition: opacity .2s, stroke .2s; }
.mapa-linea.activo { stroke: var(--coralp); stroke-width: 2.8; opacity: 1; stroke-dasharray: none; }
.mapa-municipio { fill: var(--bosque); stroke: #fff; stroke-width: 2; }
.mapa-municipio.activo { fill: var(--coralp); }
.mapa-pin { cursor: pointer; }
.mapa-pin circle { fill: var(--bosque); stroke: #fff; stroke-width: 3; transition: fill .2s; }
.mapa-pin text { fill: #fff; font: 700 14px var(--titulo); pointer-events: none; }
.mapa-pin.activo circle { fill: var(--coralp); r: 17; }
.mapa-st rect { fill: var(--bosque); }
.mapa-st text { fill: #fff; font: 700 13px var(--titulo); }
.mapa-panel-titulo { font: 700 1.15rem var(--titulo); margin-bottom: .8rem; }
.satelites-lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
@media (max-width: 400px) { .satelites-lista { grid-template-columns: minmax(0, 1fr); } }
.satelite-btn { width: 100%; height: 100%; min-height: 3.4rem; display: flex; align-items: center; gap: .65rem; text-align: left; padding: .55rem .7rem; border-radius: 1rem; border: 1.5px solid var(--linea); background: #fff; cursor: pointer; font: inherit; color: inherit; }
.satelite-btn:hover, .satelite-btn[aria-pressed="true"] { border-color: var(--bosque); box-shadow: 0 0 0 3px rgba(158, 208, 183, .6); }
.satelite-btn b { display: block; font-size: .95rem; line-height: 1.2; }
.satelite-btn small { display: block; color: var(--musgo); font-size: .875rem; line-height: 1.3; }
.satelite-num { width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--bosque); color: #fff; display: grid; place-items: center; font: 700 .875rem var(--titulo); flex-shrink: 0; }
.satelite-btn[aria-pressed="true"] .satelite-num { background: var(--coralp); }
.satelite-info { margin-top: 1rem; padding: 1rem 1.1rem; border-radius: 1.1rem; background: var(--bosque); color: #fff; min-height: 5.5rem; }
.satelite-info b { display: block; font: 700 1.15rem var(--titulo); }
.satelite-info span { display: block; opacity: .92; font-size: .95rem; margin-top: .2rem; }

/* ===== Plataforma: «Mi semana», cursos con video y videos de la Secretaría ===== */
.semana-panel { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 1.2rem; align-items: start; }
@media (max-width: 860px) { .semana-panel { grid-template-columns: minmax(0, 1fr); } }
.semana-actual h2 { font-size: clamp(1.6rem, 4vw, 2.1rem); margin-top: .3rem; }
.semana-actual > p { margin-top: .6rem; }
.semana-lado { display: grid; gap: 1.2rem; }
.semana-lado h3 { font-size: 1.25rem; margin: .3rem 0 .2rem; }
.semana-lado .btn { margin-top: .8rem; }
.progreso-semanas { list-style: none; display: flex; gap: .35rem; padding: 0; margin: .9rem 0 .3rem; }
.progreso-semanas li { flex: 1; height: .55rem; border-radius: 999px; background: var(--crema-2); }
.progreso-semanas li.hecha { background: var(--menta); }
.progreso-semanas li.actual { background: var(--coralp); }
.vista-subtitulo { font-size: 1.3rem; margin: 2.2rem 0 .3rem; }
.toda-ruta { display: grid; gap: .6rem; }
.toda-ruta details { background: #fff; border: 1px solid var(--linea); border-radius: 1.1rem; padding: .7rem 1.1rem; }
.toda-ruta .descargas { margin: .8rem 0 .3rem; }
.toda-ruta p { margin-top: .5rem; }
details.desplegable summary { min-height: 2.75rem; align-items: center; }
.curso-ancho { margin-bottom: 1.4rem; }
.modulos-video { list-style: none; margin: 0; padding: .4rem 1.2rem 1rem; display: grid; }
.modulos-video > li { border-bottom: 1px solid var(--linea); }
.modulos-video > li:last-child { border-bottom: 0; }
.modulos-video details.desplegable { border-top: 0; padding: .3rem 0 .6rem; }
.modulos-video .botones { margin-top: .9rem; }
.codigo { display: inline-block; font: 700 .8125rem/1 var(--titulo); letter-spacing: .04em; background: var(--crema-2); color: var(--bosque); border-radius: .5rem; padding: .35rem .5rem; margin-right: .3rem; vertical-align: middle; }
.video-lite { margin-top: .8rem; max-width: 40rem; }
.video-lite-btn, .video-lite iframe { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: 1rem; overflow: hidden; background: var(--bosque); padding: 0; cursor: pointer; }
.video-lite-btn img { width: 100%; height: 100%; object-fit: cover; opacity: .85; display: block; }
.video-lite-btn .video-boton { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: 0; }
.video-pie { font-size: .95rem; color: var(--musgo); margin-top: .4rem; }
.casilla-boton { margin: 0; align-items: center; min-height: 2.9rem; padding: 0 1rem; border: 1.5px solid rgba(46, 74, 62, .25); border-radius: 999px; background: #fff; font-weight: 700; font-size: .95rem; cursor: pointer; }
.casilla-boton input { margin-top: 0; }
.codigo-vista { margin: 0; min-height: 2.9rem; display: flex; align-items: center; font: 700 1rem var(--titulo); color: var(--coralp); overflow-wrap: anywhere; }
.lista-videos { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.lista-videos li { display: flex; flex-wrap: wrap; gap: .5rem .8rem; align-items: center; background: #fff; border: 1px solid var(--linea); border-radius: 1rem; padding: .7rem .9rem; }
.lista-videos li > span:nth-child(2) { flex: 1 1 12rem; }
.lista-videos b { display: block; font-size: .95rem; }
.lista-videos small { color: var(--musgo); }
.lista-videos .boton-texto, .lista-videos .enlace { min-height: 2.75rem; display: inline-flex; align-items: center; }
.campo-mini { min-height: 2.75rem; padding: .4rem .6rem; width: auto; font-size: .95rem; }

/* ===== Diálogo de ingreso ===== */
.dialogo-titulo { font-size: 1.7rem; padding-right: 2.6rem; }
.dialogo-sub { font-size: .95rem; margin-top: .2rem; }
.nota-demo { background: var(--mantequilla); margin-top: .8rem; }
.perfiles-grupo { border: 0; padding: 0; margin: 1rem 0 0; }
.perfiles-grupo legend { font-weight: 700; font-size: .95rem; margin-bottom: .5rem; }
.perfil span { font-size: .95rem; padding: .65rem .3rem; min-height: 3rem; }
.perfil span::before { width: 1.5rem; height: 1.5rem; margin-bottom: .35rem; }
.conmutador button { min-height: 2.75rem; font-size: .95rem; }
.opcionales { margin-top: 1rem; }
.opcionales summary { cursor: pointer; font-weight: 700; color: var(--coralp); min-height: 2.75rem; display: flex; align-items: center; }
.ver, .texto-boton { min-height: 2.75rem; font-size: .95rem; }

/* ===== Tamaños mínimos: botones de 44 px y textos legibles en el celular ===== */
.btn-pequeno { min-height: 2.75rem; font-size: .95rem; }
.eyebrow, .chip { font-size: .8125rem; }
.rol-tab small, .heroe-dato small, .ayuda-campo, .submenu-lista small, .etiqueta, .tema small { font-size: .875rem; }
.casilla, .nota, .mensaje { font-size: .95rem; }
.pestana { min-height: 2.75rem; font-size: .95rem; }
.preguntas summary { min-height: 2.75rem; }
.pie li a { display: inline-block; padding: .3rem 0; }
.menu-btn { width: 2.9rem; height: 2.9rem; }
@media (max-width: 960px) {
    .nav > a { min-height: 2.9rem; display: flex; align-items: center; }
    body.menu-abierto::after { content: ''; position: fixed; inset: 4.75rem 0 0; background: rgba(46, 74, 62, .35); z-index: 40; }
}

/* ===== Inicio más corto en el celular ===== */
@media (max-width: 680px) {
    .heroe-foto .hoja { aspect-ratio: 4 / 3; }
    .pilar { text-align: left; display: grid; grid-template-columns: auto 1fr; gap: .1rem .9rem; align-items: start; padding: 1.1rem 1.2rem; }
    .pilar .numero { margin: 0; grid-row: span 2; width: 2.6rem; height: 2.6rem; }
    .pilar h3 { margin: 0; }
    .rejilla.r4.aliados-rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
    .aliados-rejilla .tarjeta { padding: 1.1rem; }
    .aliados-rejilla h3 { font-size: 1.05rem; }
}
.llevas .chip, .paso-ruta .meta, .descarga-icono { font-size: .8125rem; }
.filtro, .filtros button { min-height: 2.75rem; }
.llevas > span:not(.chip), .filtro small { font-size: .8125rem; }
@media (max-width: 520px) {
    .pie-rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem 1rem; }
    .pie-rejilla > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
    .seccion { padding: 3.2rem 0; }
    .equipo-cursos { display: none; }
}

/* =====================================================================
   Accesibilidad: tamaños mínimos de lectura en celular (público con poca práctica digital)
   ===================================================================== */
.eyebrow { font-size: .8125rem; }
.chip { font-size: .8125rem; }
.ayuda-campo { font-size: .875rem; }
.mensaje, .nota, .casilla, .texto-boton { font-size: .95rem; }

/* =====================================================================
   Acceso con código de activación o recuperación
   ===================================================================== */
.acceso-enlaces { display: flex; flex-wrap: wrap; justify-content: center; gap: .2rem 1.4rem; }
.acceso-enlaces .texto-boton { margin: .8rem 0 0; min-height: 2.75rem; }
.subtitulo-dialogo { font-size: 1.2rem; margin-top: .4rem; }
#form-codigo .btn-borde { margin-top: .7rem; }
.campo-codigo { font: 700 1.5rem/1 var(--titulo); letter-spacing: .4em; text-align: center; }

/* =====================================================================
   Cursos del equipo: recorrido, unidades y estados
   ===================================================================== */
.recorrido { list-style: none; margin: 1.2rem 0 1.6rem; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); }
.recorrido li { display: flex; gap: .7rem; align-items: center; background: #fff; border: 1.5px solid var(--linea); border-radius: 1.1rem; padding: .75rem .9rem; }
.recorrido b { display: block; font: 700 .98rem/1.2 var(--titulo); }
.recorrido small { display: block; color: var(--musgo); font-size: .875rem; }
.recorrido-num { flex-shrink: 0; width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; font: 700 1rem var(--titulo); background: var(--crema-2); }
.recorrido li.hecho .recorrido-num { background: var(--menta); }
.recorrido li.actual { border-color: var(--coralp); box-shadow: var(--sombra); }
.recorrido li.actual .recorrido-num { background: var(--coralp); color: #fff; }

.compromiso { margin-bottom: 1.6rem; border: 2px solid var(--menta); }
.compromiso h3 { font-size: 1.25rem; margin-bottom: .5rem; }
.compromiso .btn { margin-top: 1rem; }
.compromiso .btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

.barra-avance { height: .55rem; border-radius: 999px; background: rgba(255, 255, 255, .6); margin: .8rem 0 .2rem; overflow: hidden; }
.barra-avance span { display: block; height: 100%; background: var(--bosque); border-radius: inherit; transition: width .4s ease; }
.curso-cab .btn-claro { margin-top: .8rem; }

.unidades { list-style: none; margin: 0; padding: .4rem 1rem 1rem; display: grid; gap: .5rem; }
.unidad details { border: 1.5px solid var(--linea); border-radius: 1.1rem; background: #fff; }
.unidad summary { cursor: pointer; list-style: none; display: flex; gap: .8rem; align-items: center; padding: .8rem 1rem; min-height: 3.2rem; }
.unidad summary::-webkit-details-marker { display: none; }
.unidad summary::after { content: '+'; margin-left: auto; font: 700 1.3rem/1 var(--titulo); color: var(--coralp); }
.unidad details[open] summary::after { content: '–'; }
.unidad-icono { flex-shrink: 0; width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; font-weight: 700; background: var(--crema-2); }
.unidad-titulo { font-weight: 700; line-height: 1.3; }
.unidad-titulo small { display: block; font-weight: 600; color: var(--musgo); font-size: .875rem; margin-top: .15rem; }
.est-aprobada .unidad-icono { background: var(--menta); }
.est-curso .unidad-icono, .est-disponible .unidad-icono { background: var(--mantequilla); }
.est-pausada .unidad-icono { background: var(--coral); }
.est-bloqueada summary { color: var(--musgo); }
.est-bloqueada .unidad-icono { background: #EDE6DE; }
.unidad-cuerpo { padding: 0 1rem 1.1rem; }
.pasos-modulo { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.pasos-modulo > li { border-left: 4px solid var(--linea); padding: .2rem 0 .3rem .9rem; display: grid; gap: .55rem; justify-items: start; }
.pasos-modulo > li.ok { border-left-color: var(--menta); }
.pasos-modulo h4 { font-size: 1.05rem; }
.pasos-modulo .btn { min-height: 2.9rem; }
.pasos-modulo .btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.paso-ok { font-weight: 700; color: #2F6B4F; }
.lista-archivos { margin: 0; padding-left: 1.1rem; display: grid; gap: .35rem; }
.form-evidencia { width: 100%; display: grid; gap: .1rem; }
.form-evidencia textarea { min-height: 6rem; resize: vertical; }
.form-evidencia .btn { margin-top: .8rem; justify-self: start; }

/* Cuestionario */
.dialogo-cuestionario { width: min(40rem, 100vw - 1rem); }
.pregunta { border: 0; margin: 1.3rem 0 0; padding: 0; }
.pregunta legend { font-weight: 700; line-height: 1.4; margin-bottom: .6rem; padding: 0; }
.pregunta-num { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--menta); font: 700 .95rem var(--titulo); margin-right: .3rem; }
.opcion { display: flex; gap: .7rem; align-items: flex-start; padding: .75rem .9rem; margin-top: .45rem; border: 1.5px solid var(--linea); border-radius: 1rem; background: #fff; cursor: pointer; min-height: 2.9rem; }
.opcion:has(input:checked) { border-color: var(--bosque); background: rgba(158, 208, 183, .25); }
.opcion input { width: 1.2rem; height: 1.2rem; accent-color: var(--bosque); flex-shrink: 0; margin-top: .15rem; }
.dialogo-cuestionario .btn.ancho { margin-top: 1.4rem; }
.resultado-cue { text-align: center; }
.resultado-nota { font: 700 3.6rem/1 var(--titulo); margin: .5rem 0 .3rem; }
.resultado-nota small { font-size: 1.6rem; color: var(--musgo); }
.resultado-nota.aprobado { color: #2F6B4F; }
.resultado-nota.no-aprobado { color: var(--coralp); }
.retro { text-align: left; padding-left: 1.1rem; display: grid; gap: .5rem; margin-top: .5rem; }

/* Panel de la Secretaría: avance del equipo y evidencias */
.avance-equipo { margin-top: 2.2rem; }
.subtitulo-seccion { font-size: 1.35rem; margin: 2rem 0 1rem; }
.tabla-equipo td small { display: block; color: var(--musgo); font-size: .875rem; }
.mini-barra { display: inline-block; vertical-align: middle; width: 3.2rem; height: .45rem; border-radius: 999px; background: var(--crema-2); overflow: hidden; }
.mini-barra span { display: block; height: 100%; background: var(--bosque); }
.fila-alerta { background: rgba(238, 152, 132, .14); }
.casilla-mini { margin: 0 .6rem 0 0; display: inline-flex; align-items: center; min-height: 2.75rem; font-size: .9rem; }
.evidencia { margin-top: .9rem; display: grid; gap: .45rem; }
.evidencia h4 { font-size: 1.1rem; }
.evidencia-texto { background: var(--crema); border-radius: .9rem; padding: .7rem .9rem; white-space: pre-line; }
.evidencia .botones { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .5rem; }
.codigo-grande { font: 700 2.6rem/1 var(--titulo); letter-spacing: .3em; text-align: center; margin: 1rem 0 .5rem; color: var(--bosque); }
.recurso-entrega { font-size: .9rem; font-weight: 700; color: var(--musgo); }
/* Mapa con contornos reales */
.mapa-agua { fill: #EAF4F1; }
.mapa-vecino { fill: #F4EEE6; stroke: #fff; stroke-width: 1.5; }
.mapa-depto { opacity: .92; transition: opacity .2s, filter .2s; }
.mapa-depto:hover { filter: brightness(.97); }
.mapa-depto-nombre { font-size: 13px; paint-order: stroke; stroke: rgba(255, 255, 255, .85); stroke-width: 3px; }
.mapa-mar { text-anchor: middle; }
.mapa-pin:focus-visible circle { stroke: var(--coralp); }

/* ============ Página base por bloques (v4) ============ */
.barra-progreso { position: fixed; top: 0; left: 0; height: 3px; width: 100%; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--menta), var(--coral), var(--coralp)); z-index: 60; pointer-events: none; }
.lead { font-size: 1.12rem; color: var(--musgo); margin-top: 1rem; }
.indice { display: inline-grid; place-items: center; min-width: 2rem; height: 1.45rem; padding: 0 .45rem; margin-right: .45rem; border-radius: 999px; background: var(--bosque); color: #fff; letter-spacing: .04em; font-size: .72rem; }
h2 em { font-style: normal; color: var(--coralp); background: linear-gradient(transparent 62%, rgba(244, 225, 161, .8) 62%); padding: 0 .1em; }
.onda { display: block; width: 100%; height: 56px; margin-top: -1px; background: #fff; }
.cabeza-fila { display: flex; align-items: end; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: 1.6rem; }
.cabeza-fila .cabeza { margin-bottom: 0; }
.subtitulo-bloque { font-size: 1.35rem; }

/* Banda de cifras */
.banda-cifras { position: relative; overflow: hidden; background: var(--bosque); color: #fff; padding: 2.6rem 0; }
.banda-cifras .patron-hojas { position: absolute; inset: 0; opacity: .1; }
.banda-cifras .contenedor { position: relative; }
.cifras { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.2rem; text-align: center; }
.cifras li + li { border-left: 1px solid rgba(255, 255, 255, .16); }
.cifras b { display: block; font: 700 clamp(2.2rem, 4.4vw, 3.2rem)/1 var(--titulo); color: var(--mantequilla); }
.cifras li:nth-child(2) b { color: var(--menta); }
.cifras li:nth-child(3) b { color: var(--durazno); }
.cifras li:nth-child(4) b { color: var(--agua); }
.cifras li:nth-child(5) b { color: var(--lavanda); }
.cifras span { display: block; margin-top: .45rem; font-size: .9rem; color: rgba(255, 255, 255, .85); }
@media (max-width: 760px) { .cifras { grid-template-columns: repeat(2, 1fr); row-gap: 1.8rem; } .cifras li + li { border-left: 0; } .cifras li:last-child { grid-column: 1 / -1; } }

/* Texto + collage */
.split { display: grid; grid-template-columns: 1.05fr .95fr; gap: 3.5rem; align-items: center; margin-bottom: 4rem; }
.split h2 { font-size: clamp(1.9rem, 4vw, 2.7rem); margin-top: .5rem; }
.lista-iconos { list-style: none; padding: 0; margin: 1.6rem 0; display: grid; gap: 1rem; }
.lista-iconos li { display: flex; gap: .9rem; align-items: center; }
.lista-iconos b { display: block; font-family: var(--titulo); }
.lista-iconos li > span:last-child { color: var(--musgo); font-size: .95rem; }
.icono-circulo { width: 2.8rem; height: 2.8rem; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; color: var(--bosque); font-size: 1.1rem; }
.collage { position: relative; min-height: 26rem; }
.collage-a { position: absolute; left: 0; top: 0; width: 64%; aspect-ratio: 4 / 5; box-shadow: var(--sombra); background: var(--menta); }
.collage-b { position: absolute; right: 0; bottom: 0; width: 50%; aspect-ratio: 1; box-shadow: var(--sombra); background: var(--durazno); border: 6px solid #fff; }
.collage-sello { position: absolute; right: 8%; top: 6%; width: 8.5rem; height: 8.5rem; border-radius: 50%; background: var(--mantequilla); display: grid; place-content: center; text-align: center; transform: rotate(-10deg); box-shadow: var(--sombra); animation: girar-suave 14s ease-in-out infinite alternate; }
.collage-sello b { font: 700 1.15rem var(--titulo); }
.collage-sello span { font-size: .85rem; color: var(--musgo); }
@keyframes girar-suave { from { transform: rotate(-10deg); } to { transform: rotate(6deg) translateY(-6px); } }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; gap: 2.5rem; } .collage { min-height: 0; aspect-ratio: 1 / .9; width: 100%; max-width: 30rem; } }

/* Carrusel de pilares */
.carrusel { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(15rem, 1fr); gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .3rem .2rem 1.2rem; scrollbar-width: thin; }
.carrusel > li { scroll-snap-align: start; transition: transform .3s ease, box-shadow .3s ease; }
.carrusel > li:hover { transform: translateY(-6px); box-shadow: var(--sombra); }
.carrusel-controles { display: flex; gap: .5rem; }
.carrusel-btn { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1.5px solid rgba(46, 74, 62, .25); background: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; transition: background .2s; }
.carrusel-btn:hover { background: var(--menta); }
@media (min-width: 1100px) { .carrusel { grid-auto-flow: row; grid-template-columns: repeat(5, 1fr); overflow: visible; } .carrusel-controles { display: none; } }

/* Pasos horizontales */
.pasos-h { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-bottom: 2.5rem; position: relative; }
.pasos-h::before { content: ""; position: absolute; left: 16%; right: 16%; top: 1.6rem; border-top: 2px dashed rgba(46, 74, 62, .25); }
.paso-h { position: relative; text-align: center; padding: 0 .5rem; }
.paso-h-num { width: 3.2rem; height: 3.2rem; margin: 0 auto .8rem; border-radius: 50%; display: grid; place-items: center; font: 700 1.2rem var(--titulo); border: 4px solid var(--crema); }
.paso-h h3 { font-size: 1.1rem; }
.paso-h p { color: var(--musgo); font-size: .92rem; margin-top: .3rem; }
@media (max-width: 680px) {
    .pasos-h { grid-template-columns: 1fr; }
    .pasos-h::before { left: 1.6rem; right: auto; top: 0; bottom: 0; border-top: 0; border-left: 2px dashed rgba(46, 74, 62, .25); }
    .paso-h { display: grid; grid-template-columns: 3.2rem 1fr; column-gap: 1rem; text-align: left; padding: 0; }
    .paso-h-num { margin: 0; grid-row: span 2; }
}

/* Catálogo de talleres */
.catalogo { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.tarjeta-taller { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--linea); border-radius: 1.4rem; overflow: hidden; text-decoration: none; transition: transform .35s cubic-bezier(.3, .7, .2, 1), box-shadow .35s; }
.tarjeta-taller:hover { transform: translateY(-8px); box-shadow: var(--sombra); }
.taller-portada { position: relative; aspect-ratio: 16 / 10; overflow: hidden; display: flex; align-items: end; padding: .9rem; }
.taller-portada .patron-hojas { position: absolute; inset: -20%; opacity: .55; transition: transform 1.2s ease; }
.tarjeta-taller:hover .taller-portada .patron-hojas { transform: rotate(8deg) scale(1.1); }
.taller-num { position: absolute; right: .6rem; top: -.4rem; font: 700 5.5rem/1 var(--titulo); color: rgba(255, 255, 255, .7); }
.chip-claro { position: relative; background: rgba(255, 255, 255, .85); color: var(--bosque); text-transform: none; letter-spacing: 0; }
.taller-cuerpo { padding: 1.1rem 1.2rem 1.3rem; display: flex; flex-direction: column; gap: .45rem; flex: 1; }
.taller-meta { font-size: .8rem; font-weight: 700; color: var(--musgo); text-transform: uppercase; letter-spacing: .06em; }
.taller-cuerpo h3 { font-size: 1.08rem; }
.taller-cuerpo p:not(.taller-meta) { color: var(--musgo); font-size: .9rem; }
.taller-enlace { margin-top: auto; padding-top: .4rem; font-weight: 700; color: var(--coralp); }
.taller-enlace span { display: inline-block; transition: transform .25s; }
.tarjeta-taller:hover .taller-enlace span { transform: translateX(5px); }
@media (max-width: 1024px) { .catalogo { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .catalogo { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 82%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 1rem; } .tarjeta-taller { scroll-snap-align: start; } }

/* Bloques con foto */
.duo-bloques { margin-top: 2.2rem; }
.bloque-foto { position: relative; display: block; min-height: 15rem; border-radius: 1.6rem; overflow: hidden; color: #fff; text-decoration: none; background: var(--bosque); }
.bloque-foto img { position: absolute; inset: 0; opacity: .75; transition: transform .8s ease; }
.bloque-foto:hover img { transform: scale(1.05); }
.bloque-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 20%, rgba(46, 74, 62, .88)); }
.bloque-foto-color { background: var(--coralp); }
.bloque-foto-color::after { background: linear-gradient(180deg, transparent, rgba(150, 61, 44, .6)); }
.bloque-foto-color .patron-hojas { position: absolute; inset: 0; opacity: .25; }
.bloque-foto-texto { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; padding: 1.5rem; display: grid; gap: .4rem; justify-items: start; }
.bloque-foto-texto b { font: 700 1.45rem var(--titulo); }
.bloque-foto-texto > span:last-child { color: rgba(255, 255, 255, .92); font-size: .95rem; }

/* Equipo del CIC (cerrado) */
.bloque-equipo { position: relative; overflow: hidden; background: var(--bosque); color: #fff; }
.bloque-equipo .patron-hojas { position: absolute; inset: 0 0 0 45%; opacity: .14; }
.bloque-equipo .contenedor { position: relative; }
.bloque-equipo h2 { font-size: clamp(1.9rem, 4vw, 2.7rem); margin-top: .5rem; }
.bloque-equipo h2 em { color: var(--mantequilla); background: none; }
.bloque-equipo .lead { color: rgba(255, 255, 255, .88); }
.bloque-equipo .botones { margin-top: 1.6rem; display: flex; flex-wrap: wrap; gap: .7rem; }
.eyebrow-claro { color: var(--mantequilla); }
.eyebrow-claro .indice { background: var(--mantequilla); color: var(--bosque); }
.btn-borde-claro { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.btn-borde-claro:hover { background: rgba(255, 255, 255, .1); }
.split-equipo { margin-bottom: 1.5rem; }
.escalera { display: grid; gap: .7rem; }
.escalera li { display: flex; gap: 1rem; align-items: center; padding: .9rem 1.1rem; border-radius: 1.1rem; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); }
.escalera li:nth-child(2) { margin-left: 1.2rem; }
.escalera li:nth-child(3) { margin-left: 2.4rem; }
.escalera li:nth-child(4) { margin-left: 3.6rem; }
.escalera b { display: block; font-family: var(--titulo); }
.escalera small { color: rgba(255, 255, 255, .78); }
.escalera-num { width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--mantequilla); color: var(--bosque); display: grid; place-items: center; font: 700 1rem var(--titulo); flex-shrink: 0; }
.candado-nota { display: flex; gap: .6rem; align-items: center; color: rgba(255, 255, 255, .82); font-size: .92rem; }
.candado-nota svg { width: 1.2rem; height: 1.2rem; color: var(--mantequilla); }
@media (max-width: 560px) { .escalera li:nth-child(n) { margin-left: 0; } }

/* Galería y marquesina */
.galeria-seccion { padding-bottom: 0; overflow: hidden; }
.galeria { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 13rem; gap: 1rem; }
.galeria-item { position: relative; margin: 0; border-radius: 1.4rem; overflow: hidden; background: var(--menta); }
.galeria-alta { grid-row: span 2; }
.galeria-ancha { grid-column: span 2; }
.galeria-item figcaption { position: absolute; left: .8rem; bottom: .8rem; background: rgba(255, 255, 255, .92); padding: .35rem .8rem; border-radius: 999px; font-weight: 700; font-size: .85rem; transition: transform .3s; }
.galeria-item:hover figcaption { transform: translateY(-4px); }
@media (max-width: 680px) { .galeria { grid-template-columns: 1fr 1fr; grid-auto-rows: 9.5rem; } .galeria-ancha { grid-column: 1 / -1; } }
.marquesina { margin-top: 3rem; background: var(--mantequilla); padding: 1rem 0; overflow: hidden; white-space: nowrap; }
.marquesina-pista { display: inline-flex; gap: 2.4rem; animation: marquesina 45s linear infinite; font: 700 1.2rem var(--titulo); }
.marquesina-pista span::before { content: "✿"; margin-right: 2.4rem; color: var(--coralp); }
@keyframes marquesina { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .marquesina-pista, .collage-sello { animation: none; } .barra-progreso { display: none; } }

/* Cursos del equipo: página cerrada */
.puerta-cerrada { position: relative; overflow: hidden; margin-top: 1rem; border-radius: 2rem; background: var(--bosque); color: #fff; padding: clamp(2.2rem, 6vw, 4.5rem); }
.puerta-cerrada .patron-hojas { position: absolute; inset: 0; opacity: .14; }
.puerta-contenido { position: relative; max-width: 40rem; }
.puerta-cerrada h1 { font-size: clamp(1.9rem, 4.5vw, 2.9rem); margin-top: .6rem; }
.puerta-cerrada .lead { color: rgba(255, 255, 255, .88); }
.puerta-cerrada .botones { margin-top: 1.6rem; display: flex; flex-wrap: wrap; gap: .7rem; }
.puerta-candado { display: grid; place-items: center; width: 4rem; height: 4rem; border-radius: 50%; background: var(--mantequilla); color: var(--bosque); margin-bottom: 1.2rem; animation: latir 2.8s ease-in-out infinite; }
.puerta-candado svg { width: 1.9rem; height: 1.9rem; }
@keyframes latir { 50% { transform: scale(1.07); box-shadow: 0 0 0 10px rgba(244, 225, 161, .18); } }
.paso-puerta h2 { font-size: 1.2rem; margin: .9rem 0 .4rem; }
.paso-puerta p { color: var(--musgo); }
@media (prefers-reduced-motion: reduce) { .puerta-candado { animation: none; } }

/* Páginas internas: menú «En esta página» fijo, bandas alternas y franja con foto */
.subnav-fija { position: sticky; top: 4.75rem; z-index: 20; margin-inline: -.5rem; padding: .6rem .5rem; background: rgba(255, 246, 238, .92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-radius: 999px; }
.subnav-fija ol { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.subnav-fija ol::-webkit-scrollbar { display: none; }
.subnav-fija a.activo { background: var(--bosque); border-color: var(--bosque); color: #fff; }
.bloque { scroll-margin-top: 8.5rem; }
.bloque-banda { background: #fff; padding-bottom: 4rem; margin-top: 4rem; position: relative; }
.bloque-banda::before { content: ""; position: absolute; left: 0; right: 0; top: -40px; height: 41px; background: #fff; clip-path: path("M0 40 C 240 0, 480 40, 720 20 S 1200 0, 1440 30 L 1440 41 L 0 41 Z"); -webkit-mask: linear-gradient(#000, #000); }
@supports not (clip-path: path("M0 0")) { .bloque-banda::before { display: none; } }
.franja-foto { display: grid; grid-template-columns: .9fr 1.1fr; gap: 3rem; align-items: center; }
.franja-img { aspect-ratio: 4 / 3.2; box-shadow: var(--sombra); background: var(--menta); }
.franja-datos { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; margin-top: 1.6rem; }
.franja-datos li { background: #fff; border: 1px solid var(--linea); border-radius: 1.2rem; padding: 1rem; }
.franja-datos b { display: block; font: 700 1.9rem/1 var(--titulo); color: var(--coralp); }
.franja-datos span { display: block; margin-top: .35rem; color: var(--musgo); font-size: .9rem; }
@media (max-width: 800px) { .franja-foto { grid-template-columns: 1fr; gap: 1.8rem; } .franja-datos { grid-template-columns: 1fr 1fr 1fr; } .franja-datos b { font-size: 1.5rem; } }
@media (max-width: 960px) { .subnav-fija { top: 4.2rem; } }

/* Activación: separador entre el enlace al correo y el código */
.separador-o { display: flex; align-items: center; gap: .7rem; margin: 1.3rem 0 .2rem; color: var(--musgo); font-size: .85rem; text-align: center; }
.separador-o::before, .separador-o::after { content: ""; flex: 1; border-top: 1px solid var(--linea); }
.separador-o span { max-width: 22rem; }

/* ============ Cursos: lista de módulos y lección por pasos ============ */
.modulos-lista { list-style: none; margin: 0; padding: .6rem 1rem 1rem; display: grid; gap: .5rem; }
.modulo-fila { width: 100%; display: flex; align-items: center; gap: .9rem; padding: .85rem 1rem; min-height: 3.4rem; border: 1.5px solid var(--linea); border-radius: 1.1rem; background: #fff; text-align: left; cursor: pointer; transition: border-color .2s, transform .2s, box-shadow .2s; }
.modulo-fila:hover:not([aria-disabled="true"]) { border-color: var(--bosque); transform: translateX(3px); box-shadow: 0 10px 24px -18px rgba(46, 74, 62, .5); }
.modulo-fila[aria-disabled="true"] { cursor: not-allowed; opacity: .75; background: var(--crema-2); }
.modulo-texto { flex: 1; display: block; }
.modulo-texto b { font-family: var(--titulo); }
.modulo-texto small { display: block; color: var(--musgo); font-size: .85rem; margin-top: .15rem; }
.modulo-chip { text-transform: none; letter-spacing: 0; background: var(--menta); }
.modulo-flecha { font-size: 1.5rem; color: var(--coralp); }

.leccion-migas { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; color: var(--musgo); margin-bottom: 1rem; }
.leccion-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 2rem; align-items: start; }
.leccion-principal h2 { font-size: clamp(1.6rem, 3.4vw, 2.2rem); margin: .3rem 0 1rem; }
.leccion-principal h2:focus { outline: none; }
.leccion-pasos { list-style: none; margin: 0 0 1.4rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.leccion-pasos a { display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .95rem; border-radius: 999px; background: #fff; border: 1.5px solid var(--linea); text-decoration: none; font-weight: 700; font-size: .9rem; }
.leccion-pasos a span { width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; background: var(--crema-2); font-size: .8rem; }
.leccion-pasos li.hecho a { border-color: var(--menta); background: rgba(158, 208, 183, .25); }
.leccion-pasos li.hecho a span { background: var(--bosque); color: #fff; }
.leccion-bloque { background: #fff; border: 1px solid var(--linea); border-radius: 1.4rem; padding: 1.4rem; margin-bottom: 1.2rem; scroll-margin-top: 6rem; }
.leccion-bloque h3 { display: flex; align-items: center; gap: .6rem; font-size: 1.25rem; margin-bottom: 1rem; }
.paso-n { width: 2rem; height: 2rem; border-radius: 50%; background: var(--mantequilla); display: grid; place-items: center; font-size: 1rem; flex-shrink: 0; }
.nota-pausa { background: rgba(238, 152, 132, .25); border-left: 4px solid var(--coralp); margin-bottom: 1.2rem; }

.video-grande { position: relative; aspect-ratio: 16 / 9; border-radius: 1.1rem; overflow: hidden; background: var(--bosque); }
.video-grande iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-grande-btn { position: absolute; inset: 0; width: 100%; border: 0; padding: 0; cursor: pointer; background: var(--bosque); display: grid; place-items: center; color: #fff; }
.video-grande-btn img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.video-grande-btn .video-boton { position: relative; width: 5rem; height: 5rem; transition: transform .2s; }
.video-grande-btn:hover .video-boton { transform: scale(1.08); }
.video-grande-txt { position: absolute; bottom: 1rem; left: 1rem; font-weight: 700; background: rgba(46, 74, 62, .75); padding: .4rem .9rem; border-radius: 999px; }
.video-estado { margin-top: .8rem; }
.reloj-video { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .8rem; color: var(--musgo); }
.reloj-barra { flex-basis: 100%; height: .5rem; border-radius: 999px; background: var(--crema-2); overflow: hidden; }
.reloj-barra span { display: block; height: 100%; background: linear-gradient(90deg, var(--menta), var(--bosque)); transition: width 1s linear; }

.lista-archivos { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.archivo { display: flex; align-items: center; gap: .8rem; padding: .75rem 1rem; border-radius: 1rem; border: 1.5px solid var(--linea); text-decoration: none; transition: border-color .2s, background .2s; }
.archivo:hover { border-color: var(--bosque); background: var(--crema); }
.archivo small { display: block; color: var(--musgo); font-size: .82rem; }
.archivo-icono { font-size: 1.4rem; }

.fuente-evaluacion { display: inline-block; background: rgba(189, 178, 228, .35); border-radius: .8rem; padding: .5rem .9rem; font-weight: 700; font-size: .92rem; margin-bottom: .8rem; }
.reglas-evaluacion { margin: 0 0 1rem; padding-left: 1.2rem; color: var(--musgo); display: grid; gap: .2rem; }
.cuestionario-inline .pregunta { border: 1.5px solid var(--linea); border-radius: 1rem; padding: 1rem 1.1rem; margin: 0 0 .9rem; }
.cuestionario-inline legend { font-weight: 700; padding: 0 .3rem; }
.resultado-inline { display: grid; grid-template-columns: auto 1fr; gap: .4rem 1.2rem; align-items: center; padding: 1.1rem; border-radius: 1.1rem; margin-bottom: 1rem; }
.resultado-inline.aprobado { background: rgba(158, 208, 183, .35); }
.resultado-inline.no-aprobado { background: rgba(244, 225, 161, .5); }
.resultado-inline .resultado-nota { font: 700 2.6rem/1 var(--titulo); margin: 0; }
.resultado-inline h4 { font-size: 1.15rem; }
.retro-caja { grid-column: 1 / -1; }

.leccion-nav { display: flex; justify-content: space-between; gap: 1rem; margin-top: .4rem; }
.leccion-lateral { position: sticky; top: 6rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.4rem; padding: 1.1rem; max-height: calc(100vh - 7rem); overflow: auto; }
.leccion-lateral ol { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .3rem; }
.lateral-modulo { width: 100%; display: flex; gap: .6rem; align-items: flex-start; text-align: left; padding: .6rem .7rem; border-radius: .9rem; border: 0; background: transparent; cursor: pointer; font-size: .9rem; }
.lateral-modulo small { display: block; color: var(--musgo); font-size: .78rem; }
.lateral-modulo:hover:not([aria-disabled="true"]) { background: var(--crema); }
.lateral-modulo.actual { background: rgba(158, 208, 183, .3); font-weight: 700; }
.lateral-modulo[aria-disabled="true"] { cursor: not-allowed; opacity: .6; }
@media (max-width: 960px) {
    .leccion-rejilla { grid-template-columns: 1fr; }
    .leccion-lateral { position: static; max-height: none; order: -1; }
    .leccion-lateral ol { display: flex; overflow-x: auto; gap: .4rem; }
    .lateral-modulo { min-width: 12rem; border: 1px solid var(--linea); }
}
@media (max-width: 560px) { .leccion-bloque { padding: 1.1rem; } .leccion-nav { flex-direction: column-reverse; } .leccion-nav .btn { width: 100%; } }

/* ============ Ritmo entre secciones, espaciado y animaciones al desplazarse (v5) ============ */
/* Ondas entre secciones: color de la sección anterior arriba y de la siguiente abajo */
.onda { display: block; width: 100%; height: clamp(36px, 5vw, 70px); margin: -1px 0; }
.seccion { padding: clamp(3.5rem, 7vw, 6rem) 0; position: relative; }
.seccion + .onda, .onda + .seccion { margin-top: 0; }

/* Pilares: sección propia con fondo y patrón */
.seccion-pilares { background: var(--crema-2); overflow: hidden; }
.seccion-pilares .decor-completo { position: absolute; inset: 0; opacity: .14; pointer-events: none; }
.seccion-pilares .contenedor { position: relative; }
.seccion-pilares .cabeza-fila { margin-bottom: 2rem; align-items: flex-end; }
.carrusel { align-items: stretch; }
.carrusel > li { height: 100%; }
.pilar { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; padding: 2rem 1.4rem 1.8rem; height: 100%; box-shadow: 0 14px 30px -26px rgba(46, 74, 62, .45); }
.pilar .numero { margin: 0 0 1rem; width: 3.2rem; height: 3.2rem; font-size: 1.15rem; }
.pilar h3 { font-size: 1.08rem; margin-bottom: .55rem; min-height: 2.6em; display: flex; align-items: center; justify-content: center; }
.pilar p { line-height: 1.55; }

/* Tarjetas con alto parejo y texto centrado verticalmente */
.split { margin-bottom: 0; }
.lista-iconos li { align-items: center; }
.icono-circulo { line-height: 1; }
.tarjeta-taller { height: 100%; }
.catalogo { align-items: stretch; }
.taller-cuerpo { padding: 1.25rem 1.3rem 1.4rem; }
.paso-h p { max-width: 18rem; margin-inline: auto; }
.chip { line-height: 1.2; }
.bloque-foto-texto { padding: 1.6rem 1.7rem; }

/* Equipo del CIC: tarjetas alineadas, del mismo ancho y alto */
.split-equipo { align-items: center; gap: 3rem; }
.escalera { gap: .8rem; }
.escalera li, .escalera li:nth-child(n) { margin-left: 0; min-height: 4.6rem; padding: 1rem 1.2rem; align-items: center; }
.escalera li span:last-child { display: flex; flex-direction: column; justify-content: center; }
.candado-nota { justify-content: flex-start; margin-top: 1.5rem; }

/* Aliados */
.aliados-split { display: grid; grid-template-columns: .9fr 1.1fr; gap: 3.5rem; align-items: center; position: relative; }
.aliados-split h2 { font-size: clamp(1.9rem, 4vw, 2.6rem); margin-top: .5rem; }
.convenio { display: flex; gap: 1rem; align-items: center; margin-top: 1.6rem; padding: 1rem 1.2rem; border-radius: 1.2rem; background: var(--crema); border: 1px dashed rgba(46, 74, 62, .25); }
.convenio p { color: var(--musgo); font-size: .92rem; }
.convenio b { display: block; color: var(--bosque); font-family: var(--titulo); font-size: 1rem; }
.convenio-sello { flex-shrink: 0; width: 4rem; height: 4rem; border-radius: 50%; display: grid; place-items: center; background: var(--bosque); color: var(--mantequilla); font: 700 1.15rem var(--titulo); box-shadow: 0 0 0 6px rgba(244, 225, 161, .5); }
.aliados-tarjetas { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.aliado-tarjeta { display: flex; flex-direction: column; gap: .9rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.4rem; padding: 1.4rem; height: 100%; transition: transform .35s cubic-bezier(.3, .7, .2, 1), box-shadow .35s, border-color .35s; }
.aliado-tarjeta:hover { transform: translateY(-6px); box-shadow: var(--sombra); border-color: transparent; }
.aliado-tarjeta:nth-child(even) { transform: translateY(1.5rem); }
.aliado-tarjeta:nth-child(even):hover { transform: translateY(calc(1.5rem - 6px)); }
.aliado-monograma { width: 3.4rem; height: 3.4rem; border-radius: 1rem; display: grid; place-items: center; font: 700 .95rem var(--titulo); letter-spacing: .04em; }
.aliado-tarjeta .chip { text-transform: none; letter-spacing: 0; margin-bottom: .5rem; }
.aliado-tarjeta h3 { font-size: 1.15rem; margin-bottom: .35rem; }
.aliado-tarjeta p { color: var(--musgo); font-size: .92rem; }
@media (max-width: 900px) { .aliados-split { grid-template-columns: 1fr; gap: 2.2rem; } }
@media (max-width: 520px) { .aliados-tarjetas { grid-template-columns: 1fr; } .aliado-tarjeta:nth-child(even), .aliado-tarjeta:nth-child(even):hover { transform: none; } }

/* ---------- Animaciones al aparecer (al estilo de innpulsamujeres.com, con la estética Florecer) ---------- */
.js .aparece, .js .aparece-izq, .js .aparece-der, .js .aparece-zoom { opacity: 0; transition: opacity .8s ease, transform .9s cubic-bezier(.2, .7, .2, 1), clip-path 1.1s cubic-bezier(.6, .1, .2, 1); will-change: transform, opacity; }
.js .aparece { transform: translateY(32px); }
.js .aparece-izq { transform: translateX(-48px); }
.js .aparece-der { transform: translateX(48px); }
.js .aparece-zoom { transform: scale(.92); }
.js .aparece.visible, .js .aparece-izq.visible, .js .aparece-der.visible, .js .aparece-zoom.visible { opacity: 1; transform: none; }
/* Fotos que se descubren de abajo hacia arriba */
.js .revela { clip-path: inset(100% 0 0 0 round 1.4rem); }
.js .revela.visible { clip-path: inset(0 0 0 0 round 0); }
/* Resaltado de la palabra clave del título, que se pinta al aparecer */
h2 em { background-image: linear-gradient(transparent 62%, rgba(244, 225, 161, .85) 62%); background-repeat: no-repeat; background-size: 100% 100%; background-color: transparent; transition: background-size 1s .35s cubic-bezier(.6, .1, .2, 1); }
.js .aparece h2 em, .js .aparece-izq h2 em { background-size: 0% 100%; }
.js .aparece.visible h2 em, .js .aparece-izq.visible h2 em { background-size: 100% 100%; }
.bloque-equipo h2 em { background-image: none; }
/* La pastilla del número de sección «salta» al entrar */
.js .aparece .indice, .js .aparece-izq .indice { transform: scale(0); transition: transform .5s .2s cubic-bezier(.3, 1.6, .5, 1); display: inline-grid; }
.js .visible .indice { transform: scale(1); }
/* Las tarjetas de la sección crecen un poco al pasar el cursor */
.carrusel > li, .paso-h, .escalera li { transition: transform .35s cubic-bezier(.3, .7, .2, 1), box-shadow .35s, background .35s; }
.escalera li:hover { transform: translateX(6px); background: rgba(255, 255, 255, .14); }
.paso-h:hover .paso-h-num { transform: scale(1.12) rotate(-6deg); }
.paso-h-num { transition: transform .3s; }
@media (prefers-reduced-motion: reduce) {
    .js .aparece, .js .aparece-izq, .js .aparece-der, .js .aparece-zoom, .js .revela { opacity: 1; transform: none; clip-path: none; transition: none; }
    .js .aparece h2 em, .js .aparece-izq h2 em { background-size: 100% 100%; }
    .js .aparece .indice, .js .aparece-izq .indice { transform: none; }
}

/* ============ Foro de la comunidad ============ */
.foro-heroe { position: relative; overflow: hidden; border-radius: 2rem; background: var(--bosque); color: #fff; padding: clamp(2rem, 5vw, 3.5rem); display: grid; grid-template-columns: 1.2fr .8fr; gap: 2rem; align-items: center; margin-top: 1rem; }
.foro-heroe .patron-hojas { position: absolute; inset: 0; opacity: .14; }
.foro-heroe > * { position: relative; }
.foro-heroe h1 { font-size: clamp(2rem, 4.5vw, 3rem); margin-top: .5rem; }
.foro-heroe .lead { color: rgba(255, 255, 255, .88); }
.foro-normas { display: grid; gap: .6rem; }
.foro-normas li { display: flex; gap: .7rem; align-items: center; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .16); border-radius: 1rem; padding: .8rem 1rem; font-size: .92rem; }
@media (max-width: 800px) { .foro-heroe { grid-template-columns: 1fr; } }
.foro-rejilla { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 2rem; align-items: start; }
.foro-lateral { position: sticky; top: 6rem; display: grid; gap: 1rem; }
.foro-categorias { display: grid; gap: .3rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.2rem; padding: .6rem; }
.foro-categorias button { width: 100%; text-align: left; border: 0; background: transparent; border-radius: .8rem; padding: .65rem .8rem; font-weight: 600; cursor: pointer; }
.foro-categorias button:hover { background: var(--crema); }
.foro-categorias button.activa { background: var(--bosque); color: #fff; }
.foro-lista-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.foro-lista-cab h2 { font-size: 1.5rem; }
.tema { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: start; background: #fff; border: 1px solid var(--linea); border-radius: 1.3rem; padding: 1.2rem 1.3rem; margin-bottom: .8rem; transition: transform .25s, box-shadow .25s; }
.tema:hover { transform: translateY(-3px); box-shadow: 0 16px 30px -24px rgba(46, 74, 62, .5); }
.avatar { width: 2.8rem; height: 2.8rem; border-radius: 50%; display: grid; place-items: center; font: 700 1.1rem var(--titulo); flex-shrink: 0; }
.tema-meta { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .4rem; }
.tema-meta .chip { text-transform: none; letter-spacing: 0; }
.tema-titulo { border: 0; background: none; padding: 0; text-align: left; font: 700 1.12rem var(--titulo); color: var(--bosque); cursor: pointer; }
.tema-titulo:hover { color: var(--coralp); text-decoration: underline; text-underline-offset: 3px; }
.tema-extracto { color: var(--musgo); font-size: .93rem; margin-top: .3rem; }
.tema-pie { font-size: .85rem; color: var(--musgo); margin-top: .5rem; }
.tema-respuestas { text-align: center; min-width: 4.5rem; padding: .5rem; border-radius: 1rem; background: var(--crema); }
.tema-respuestas b { display: block; font: 700 1.4rem/1 var(--titulo); }
.tema-respuestas small { color: var(--musgo); font-size: .75rem; }
.foro-tema { max-width: 52rem; }
.mensaje-foro { background: #fff; border: 1px solid var(--linea); border-radius: 1.3rem; padding: 1.3rem 1.4rem; margin-bottom: .9rem; }
.mensaje-principal { border-color: var(--menta); box-shadow: 0 18px 34px -28px rgba(46, 74, 62, .5); margin-top: 1rem; }
.mensaje-principal h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin: .3rem 0 1rem; }
.mensaje-autor { display: flex; gap: .8rem; align-items: center; margin-bottom: .8rem; }
.mensaje-autor small { display: block; color: var(--musgo); font-size: .82rem; }
.mensaje-texto p + p { margin-top: .7rem; }
.mensaje-acciones { display: flex; gap: 1rem; margin-top: .6rem; }
.form-responder textarea, .form-nuevo textarea { font-family: inherit; }
.foro-puerta { text-align: center; max-width: 36rem; margin: 1rem auto; background: #fff; border: 1px solid var(--linea); border-radius: 1.6rem; padding: 2.4rem 1.6rem; }
.foro-puerta .puerta-candado { margin: 0 auto 1rem; }
.foro-puerta h2 { font-size: 1.5rem; margin-bottom: .6rem; }
@media (max-width: 860px) { .foro-rejilla { grid-template-columns: 1fr; } .foro-lateral { position: static; } .foro-categorias { display: flex; overflow-x: auto; } .foro-categorias button { white-space: nowrap; } }
@media (max-width: 520px) { .tema { grid-template-columns: auto 1fr; } .tema-respuestas { grid-column: 2; justify-self: start; display: flex; gap: .4rem; align-items: baseline; } }

/* Ajustes finos de alineación (v5) */
.preguntas summary { align-items: center; min-height: 2.6rem; }
.preguntas details { padding: .85rem 1.2rem; transition: border-color .25s, box-shadow .25s; }
.preguntas details:hover, .preguntas details[open] { border-color: var(--menta); box-shadow: 0 12px 26px -22px rgba(46, 74, 62, .5); }
.politica { max-width: none; background: var(--crema); border-radius: 1.4rem; padding: 1.3rem 1.5rem !important; }
.politica summary { align-items: center; }
.galeria-seccion { padding-bottom: 0; }
.seccion-pilares { padding-bottom: clamp(3rem, 5vw, 4rem); }
.aliado-tarjeta:nth-child(even), .aliado-tarjeta:nth-child(even):hover { transform: none; }
.aliado-tarjeta:hover { transform: translateY(-6px); }
.lateral .tarjeta { display: flex; flex-direction: column; justify-content: center; }
/* Que el efecto al pasar el cursor siga funcionando en tarjetas que ya aparecieron */
.js .tarjeta-taller.visible:hover { transform: translateY(-8px); }
.js .carrusel > li.visible:hover, .js .aliado-tarjeta.visible:hover { transform: translateY(-6px); }
.js .escalera li.visible:hover { transform: translateX(6px); }
.foro-heroe > .hojas-flotantes, .foro-heroe > .patron-hojas { position: absolute; inset: 0; }

/* ---------- Aliados con logo: misma caja para todos, el logo se ajusta sin deformarse ---------- */
.aliado-logo { display: flex; align-items: center; justify-content: center; height: 7.5rem; padding: 1.1rem 1.4rem; border-radius: 1rem; background: var(--crema); border: 1px solid var(--linea); }
.aliado-logo img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.aliado-logo-oscuro { background: #1f3a5c; border-color: #1f3a5c; }
.aliado-info { display: flex; flex-direction: column; align-items: flex-start; }
.aliado-tarjeta { padding: 1.2rem; }
@media (max-width: 520px) { .aliado-logo { height: 6.5rem; } }

/* ---------- Descargas y archivos como botones (PDF que entrega el servidor) ---------- */
button.descarga, button.archivo { width: 100%; font: inherit; color: inherit; text-align: left; cursor: pointer; }
button.archivo { background: #fff; }
button.descarga:disabled, button.archivo:disabled { opacity: .6; cursor: progress; }
.descarga-bloqueada { position: relative; }
.descarga-bloqueada small { color: var(--musgo); }
.descarga-candado { width: 1.3rem; height: 1.3rem; margin-left: auto; flex-shrink: 0; color: var(--coralp); }
.archivo-icono.archivo-pdf, .archivo-icono.archivo-xls { width: 2.4rem; height: 2.4rem; border-radius: .6rem; display: grid; place-items: center; font: 700 .75rem var(--titulo); flex-shrink: 0; }
.archivo-pdf { background: var(--coral, #f2a38a); }
.archivo-xls { background: var(--menta); }

/* ---------- Video de bienvenida (obligatorio antes del curso Gestión) ---------- */
.bienvenida { border: 2px solid var(--mantequilla); }
.bienvenida-texto { margin-bottom: 1rem; }
.bienvenida-texto h3 { margin: .5rem 0 .4rem; }

/* ---------- Modelo del CIC en tarjetas: franja del ser, tres pilares en tarjetas de texto y franja de la base ---------- */
.pilares-cards { display: grid; gap: clamp(1rem, 2.4vw, 1.5rem); margin-top: 1.4rem; }
.pc-etiqueta { margin: 0 0 .2rem; font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--fuerte, var(--coralp)); }
.pc-ancha { display: flex; align-items: center; gap: 1.2rem; padding: 1.3rem 1.6rem; border-radius: 1.6rem; border: 1px solid var(--linea); box-shadow: 0 14px 30px -26px rgba(46, 74, 62, .45); }
.pc-ancha h3 { font-size: clamp(1.15rem, 2.2vw, 1.4rem); margin: 0 0 .2rem; }
.pc-ancha p:last-child { margin: 0; color: var(--musgo); }
.pc-icono { display: grid; place-items: center; width: 3.4rem; height: 3.4rem; flex-shrink: 0; border-radius: 50%; background: #fff; transition: transform .4s cubic-bezier(.34, 1.56, .64, 1); }
.pc-icono svg { width: 1.7rem; height: 1.7rem; }
.pc-ancha:hover .pc-icono { transform: scale(1.12) rotate(-8deg); }
.pc-ser { --fuerte: #6f61b0; background: rgba(189, 178, 228, .35); }
.pc-ser .pc-icono svg { fill: var(--coral); animation: latido-suave 2.8s ease-in-out infinite; }
.pc-base { --fuerte: #2f7a70; background: rgba(153, 207, 200, .4); }
.pc-base .pc-icono { color: #2f7a70; }
.pc-base .pc-icono svg { transform-origin: 50% 100%; animation: mecer 4s ease-in-out infinite; }
@keyframes latido-suave { 0%, 100% { transform: scale(1); } 14% { transform: scale(1.15); } 28% { transform: scale(1); } 42% { transform: scale(1.08); } }
@keyframes mecer { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }

.pt-pilares { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.4vw, 1.5rem); align-items: stretch; }
.pt-tarjeta { position: relative; display: flex; flex-direction: column; height: 100%; padding: 1.6rem 1.5rem 1.6rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.6rem; box-shadow: 0 14px 30px -26px rgba(46, 74, 62, .45); overflow: hidden; transition: transform .35s cubic-bezier(.3, .7, .2, 1), box-shadow .35s, border-color .35s; }
.pt-tarjeta::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--color); }
.pt-tarjeta::after { content: ""; position: absolute; right: -2.6rem; bottom: -2.6rem; width: 8rem; height: 8rem; border-radius: 50%; background: var(--tinte); transition: transform .5s cubic-bezier(.3, .7, .2, 1); }
.pt-tarjeta:hover, .js .pt-tarjeta.visible:hover { transform: translateY(-6px); box-shadow: var(--sombra); border-color: transparent; }
.pt-tarjeta:hover::after { transform: scale(1.35); }
.pt-tarjeta > * { position: relative; z-index: 1; }
.pt-cabeza { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-bottom: 1.1rem; }
.pt-icono { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; border-radius: 1rem; background: var(--tinte); color: var(--fuerte); transition: transform .4s cubic-bezier(.34, 1.56, .64, 1); }
.pt-icono svg { width: 1.6rem; height: 1.6rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pt-tarjeta:hover .pt-icono { transform: rotate(-8deg) scale(1.08); }
.pt-num { padding: .3rem .75rem; border-radius: 999px; background: var(--tinte); color: var(--fuerte); font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.pt-tarjeta h3 { font-size: 1.25rem; margin: 0 0 .4rem; }
.pt-frase { margin: 0 0 1rem; color: var(--bosque); font-size: .98rem; line-height: 1.5; }
.pt-tarjeta ul { list-style: none; margin: auto 0 0; padding: 1rem 0 0; border-top: 1px dashed var(--linea); display: grid; gap: .5rem; color: var(--musgo); font-size: .92rem; line-height: 1.45; }
.pt-tarjeta li { position: relative; padding-left: 1.6rem; }
.pt-tarjeta li::before { content: ""; position: absolute; left: 0; top: .1em; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: var(--tinte) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%232E4A3E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / .7rem no-repeat; }
.pt-menta { --color: var(--menta); --tinte: rgba(158, 208, 183, .35); --fuerte: #3f8a69; }
.pt-coral { --color: var(--coral); --tinte: rgba(238, 152, 132, .25); --fuerte: var(--coralp); }
.pt-mantequilla { --color: var(--mantequilla); --tinte: rgba(244, 225, 161, .5); --fuerte: #93721a; }
@media (max-width: 860px) {
    .pt-pilares { grid-template-columns: 1fr; }
    .pc-ancha { align-items: flex-start; padding: 1.2rem; }
    .pc-icono { width: 2.8rem; height: 2.8rem; }
}
@media (prefers-reduced-motion: reduce) { .pc-ser .pc-icono svg, .pc-base .pc-icono svg { animation: none; } }
.pt-tarjeta::after { content: none; }
.pt-tarjeta ul { margin-top: 0; }
.pt-tarjeta:hover .pt-num { background: var(--color); color: var(--bosque); }
.pt-num { transition: background .3s, color .3s; }
/* Tarjetas blancas de los pilares: información centrada, mismo tamaño de letra y espaciados parejos */
.pt-pilares { gap: 1.5rem; }
.pt-tarjeta { align-items: center; text-align: center; padding: 2.3rem 1.8rem 2rem; }
.pt-cabeza { flex-direction: column; justify-content: center; gap: .8rem; margin-bottom: 1.1rem; }
.pt-icono { width: 3.8rem; height: 3.8rem; border-radius: 1.2rem; }
.pt-icono svg { width: 1.9rem; height: 1.9rem; }
.pt-tarjeta h3 { font-size: 1.3rem; margin-bottom: .5rem; }
.pt-frase, .pt-tarjeta ul { font-size: .95rem; line-height: 1.5; }
.pt-frase { max-width: 17rem; min-height: 3em; margin: 0 auto 1.2rem; color: var(--musgo); }
.pt-tarjeta ul { width: 100%; padding-top: 1.2rem; justify-items: center; gap: .6rem; }
.pt-tarjeta li { max-width: 17rem; padding-left: 0; }
.pt-tarjeta li::before { position: static; display: inline-block; vertical-align: -.2em; margin-right: .45rem; }
@media (max-width: 860px) {
    .pt-pilares { max-width: 28rem; width: 100%; margin: 0 auto; }
    .pt-tarjeta { padding: 2rem 1.5rem 1.8rem; }
    .pt-frase { min-height: 0; }
}
/* Mismo nivel en las tres tarjetas: cada fila (ícono, título, frase y cada punto) alineada entre tarjetas */
@media (min-width: 861px) {
    .pt-pilares { grid-template-rows: repeat(6, auto); row-gap: 0; }
    .pt-tarjeta { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 0; justify-items: center; align-items: start; }
    .pt-cabeza { margin-bottom: 1.1rem; }
    .pt-frase { min-height: 0; }
    .pt-tarjeta ul { grid-row: span 3; display: grid; grid-template-rows: subgrid; row-gap: .6rem; align-items: start; margin: 0; }
}
/* Tarjetas blancas más pequeñas */
.pt-pilares { max-width: 58rem; width: 100%; margin: 0 auto; gap: 1.2rem; }
.pt-tarjeta { padding: 1.5rem 1.2rem 1.4rem; border-radius: 1.3rem; }
.pt-tarjeta::before { height: 5px; }
.pt-cabeza { gap: .55rem; margin-bottom: .8rem; }
.pt-icono { width: 3rem; height: 3rem; border-radius: .95rem; }
.pt-icono svg { width: 1.5rem; height: 1.5rem; }
.pt-num { font-size: .68rem; padding: .25rem .65rem; }
.pt-tarjeta h3 { font-size: 1.12rem; margin-bottom: .35rem; }
.pt-frase, .pt-tarjeta ul { font-size: .88rem; line-height: 1.45; }
.pt-frase { max-width: 15rem; margin-bottom: .9rem; }
.pt-tarjeta ul { padding-top: .9rem; }
.pt-tarjeta li { max-width: 15rem; }
@media (min-width: 861px) { .pt-tarjeta ul { row-gap: .45rem; } }
@media (max-width: 860px) { .pt-pilares { max-width: 24rem; } .pt-tarjeta { padding: 1.5rem 1.2rem 1.4rem; } }

/* ---------- Emprendimientos: asignación (Secretaría) y seguimiento de actividades (dinamizadora) ---------- */
.emp-panel { margin: 1.6rem 0; }
.emp-panel:empty { display: none; }
.emp-subtitulo { font-size: 1.15rem; margin: 2rem 0 .4rem; }
.emp-cabeza { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .8rem 1.5rem; margin-bottom: 1rem; }
.emp-cabeza h3 { font-size: 1.3rem; margin: 0 0 .3rem; }
.emp-cabeza .vista-intro { margin: 0; max-width: 46rem; }
.emp-kpis { display: flex; gap: .6rem; flex-wrap: wrap; }
.emp-kpis span { padding: .45rem .9rem; border-radius: 999px; background: var(--crema); border: 1px solid var(--linea); font-size: .9rem; }
.emp-kpis b { font-family: var(--titulo); font-size: 1.05rem; }
.emp-alerta { color: var(--coralp); }
.emp-kpis .emp-alerta { background: rgba(238, 152, 132, .18); border-color: rgba(238, 152, 132, .45); }
.emp-tabla td small.emp-alerta { display: block; margin-top: .25rem; font-size: .78rem; }
.emp-check { width: 2.4rem; text-align: center; }
.emp-check input { width: 1.1rem; height: 1.1rem; accent-color: var(--bosque); cursor: pointer; }
.emp-lote { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin: 0 0 1rem; padding: .8rem 1rem; border-radius: 1rem; background: rgba(158, 208, 183, .3); border: 1px solid rgba(158, 208, 183, .7); }
.emp-avance { min-width: 11rem; }
.emp-avance small { display: block; margin-top: .3rem; color: var(--musgo); font-size: .8rem; line-height: 1.35; }
.emp-barra { display: block; height: .5rem; border-radius: 999px; background: var(--crema-2); overflow: hidden; }
.emp-barra span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--menta), var(--bosque)); transition: width .6s ease; }
.emp-tarjetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: 1rem; }
.emp-tarjeta { display: flex; flex-direction: column; gap: .9rem; padding: 1.2rem; background: #fff; border: 1px solid var(--linea); border-radius: 1.3rem; box-shadow: 0 14px 30px -26px rgba(46, 74, 62, .45); }
.emp-tarjeta small { display: block; color: var(--musgo); font-size: .85rem; margin-top: .15rem; }
.emp-tarjeta .btn { align-self: flex-start; margin-top: auto; }
.emp-volver { margin-bottom: 1rem; }
.emp-ficha { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem 2rem; padding: 1.2rem 1.4rem; margin-bottom: 1.4rem; border-radius: 1.3rem; background: var(--crema); border: 1px solid var(--linea); }
.emp-ficha h3 { margin: 0 0 .2rem; font-size: 1.35rem; }
.emp-ficha p { margin: 0; }
.emp-ficha-lado { display: grid; gap: .5rem; justify-items: start; min-width: 14rem; }
.emp-grupo { margin-bottom: 1.6rem; }
.emp-grupo h4 { font-size: 1.1rem; margin: 0 0 .8rem; }
.emp-actividades { display: grid; grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr)); gap: 1rem; }
.emp-act { display: flex; flex-direction: column; gap: .55rem; padding: 1.1rem 1.2rem 1.2rem; background: #fff; border: 1px solid var(--linea); border-left: 0; border-radius: 1.2rem; position: relative; overflow: hidden; }
.emp-act::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--linea); }
.emp-act.es-si::before { background: var(--menta); }
.emp-act.es-no::before { background: var(--coral); }
.emp-act-cabeza { display: flex; justify-content: space-between; align-items: center; gap: .6rem; flex-wrap: wrap; }
.emp-act-cabeza h5 { margin: 0; font: 700 1.05rem var(--titulo); }
.emp-act .chip { text-transform: none; letter-spacing: 0; font-size: .75rem; }
.emp-ok { background: rgba(158, 208, 183, .45); }
.emp-pend { background: rgba(244, 225, 161, .7); }
.emp-no { background: rgba(238, 152, 132, .3); }
.emp-pregunta { margin: .3rem 0 0; font-weight: 700; font-size: .9rem; }
.emp-sino { display: flex; gap: .5rem; }
.emp-sino button { flex: 1; padding: .55rem .8rem; border-radius: .8rem; border: 1.5px solid var(--linea); background: var(--crema); font: 700 .95rem var(--texto); color: var(--bosque); cursor: pointer; transition: background .2s, border-color .2s, transform .15s; }
.emp-sino button:hover { transform: translateY(-1px); border-color: var(--bosque); }
.emp-sino .emp-si[aria-pressed="true"] { background: var(--menta); border-color: #4f9a78; }
.emp-sino .emp-no-btn[aria-pressed="true"] { background: rgba(238, 152, 132, .55); border-color: var(--coralp); }
.emp-act .campo-mini { max-width: 12rem; }
.emp-docs { display: grid; gap: .55rem; }
.emp-doc { display: grid; grid-template-columns: auto 1fr; gap: .2rem .7rem; align-items: center; padding: .7rem .8rem; border-radius: .9rem; border: 1.5px dashed var(--linea); background: var(--crema); }
.emp-doc.subido { border-style: solid; border-color: rgba(158, 208, 183, .9); background: rgba(158, 208, 183, .15); }
.emp-doc-icono { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: #fff; font-size: .95rem; grid-row: span 2; }
.emp-doc.subido .emp-doc-icono { background: var(--menta); color: var(--bosque); font-weight: 700; }
.emp-doc-texto b { display: block; font-size: .9rem; }
.emp-doc-texto small { display: block; color: var(--musgo); font-size: .8rem; word-break: break-word; }
.emp-doc-acciones { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .8rem; margin-top: .3rem; }
.emp-subir { cursor: pointer; }
.emp-subir.cargando { opacity: .6; pointer-events: none; }
.emp-quitar { color: var(--coralp); }
@media (max-width: 640px) { .emp-actividades { grid-template-columns: 1fr; } .emp-ficha-lado { min-width: 0; width: 100%; } }
.emp-tabla td small { display: block; color: var(--musgo); font-size: .8rem; }

/* Reproductor: franja transparente sobre la barra superior (bloquea «abrir en otra ventana», desde donde se descarga) */
.video-lite-marco { position: relative; border-radius: 1rem; overflow: hidden; background: var(--bosque); }
.video-lite-marco iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.video-tapa { position: absolute; top: 0; left: 0; right: 0; height: 3.6rem; z-index: 2; background: transparent; }
.video-grande iframe { z-index: 1; }
@media (max-width: 640px) { .video-tapa { height: 2.8rem; } }
.emp-drive { display: inline-block; margin-top: .25rem; font-size: .8rem; font-weight: 700; color: #2f7a70; }
.emp-drive-ok { color: #2f7a70 !important; }
.emp-drive-pend { color: var(--coralp) !important; }
.emp-drive-barra { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: 0 0 1rem; padding: .7rem 1rem; border-radius: 1rem; background: rgba(153, 207, 200, .25); border: 1px solid rgba(153, 207, 200, .6); font-size: .9rem; }

/* Logo con el nombre completo del centro (en dos líneas) */
.logo-sub { max-width: 15rem; line-height: 1.25; }