/* Páginas por comuna (/colegios/<comuna>/ y /jardines/<comuna>/), generadas por herramientas/generar-comunas.mjs. Se suman a estilos.css. */
.pagina-comuna { background: var(--superficie-pagina); }
.comuna { display: flex; flex-direction: column; gap: 16px; padding-top: 18px; padding-bottom: 56px; min-width: 0; }
.comuna h1 { font-size: var(--fs-h1); line-height: 1.1; }
.comuna h2 { font-size: 22px; }
.migas { font-size: 14px; color: var(--texto-suave); display: flex; flex-wrap: wrap; gap: 6px; }
.comuna__region { margin-top: -8px; color: var(--texto-suave); font-size: 14.5px; }
.comuna__bajada { max-width: 760px; font-size: 16.5px; }
.cta-comuna { display: flex; flex-direction: column; gap: 6px; }
.cta-comuna__enlace { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 20px; border-radius: var(--radio-m); background: var(--accion-primaria); color: var(--cm-tinta); text-decoration: none; font-size: 17px; line-height: 1.35; box-shadow: var(--sombra-elevada); }
.cta-comuna__enlace:hover { background: var(--cm-lapiz-hover, #CDB400); color: var(--cm-tinta); }
.cta-comuna__flecha { font-size: 24px; font-weight: 700; flex: none; }
.herramientas-comuna { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; background: var(--cm-blanco); border: 1px solid var(--borde); border-radius: var(--radio-m); }
.herramientas-comuna[hidden] { display: none; }
.herramientas-comuna__campo--q { grid-column: 1 / -1; }
@media (max-width: 759px) { .herramientas-comuna__campo:last-child { grid-column: 1 / -1; } }
@media (min-width: 760px) { .herramientas-comuna { grid-template-columns: 2fr 1fr 1fr 1fr; } .herramientas-comuna__campo--q { grid-column: auto; } }
.herramientas-comuna__campo { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; min-width: 0; }
.herramientas-comuna__campo input, .herramientas-comuna__campo select { min-height: 44px; padding: 0 10px; border: 1px solid var(--cm-tinta-20); border-radius: 8px; background: var(--cm-blanco); font: 400 15px/1.2 var(--font-texto, inherit); color: var(--cm-tinta); width: 100%; min-width: 0; }
.tabla-comuna__marco { min-width: 0; }
.tabla-comuna { width: 100%; border-collapse: collapse; background: var(--cm-blanco); border: 1px solid var(--borde); border-radius: var(--radio-m); font-size: 14.5px; }
.tabla-comuna th { text-align: left; font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--texto-suave); padding: 10px 12px; border-bottom: 1px solid var(--borde); background: var(--cm-papel); }
.tabla-comuna td { padding: 10px 12px; border-bottom: 1px solid var(--borde); vertical-align: top; overflow-wrap: anywhere; }
.tabla-comuna tr[hidden] { display: none; }
.tabla-comuna__nombre a { font-weight: 600; }
.tabla-comuna__nota { display: block; font-size: 12px; color: var(--texto-suave); font-family: inherit; }
/* Celular: cada fila es una tarjeta, con el nombre de la columna a la izquierda. */
@media (max-width: 760px) {
  .tabla-comuna, .tabla-comuna tbody, .tabla-comuna tr, .tabla-comuna td { display: block; width: 100%; }
  .tabla-comuna { border: 0; background: none; }
  .tabla-comuna thead { display: none; }
  .tabla-comuna tr { background: var(--cm-blanco); border: 1px solid var(--borde); border-radius: var(--radio-m); margin-bottom: 10px; padding: 6px 4px; }
  .tabla-comuna td { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 10px; border: 0; padding: 6px 10px; }
  .tabla-comuna td::before { content: attr(data-t); font-size: 12px; font-weight: 600; color: var(--texto-suave); text-transform: uppercase; letter-spacing: .03em; }
  .tabla-comuna td.tabla-comuna__nombre { grid-template-columns: 1fr; font-size: 16.5px; }
  .tabla-comuna td.tabla-comuna__nombre::before { display: none; }
}
.lista-comunas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 18px; }
.lista-comunas li { font-size: 15px; }
.indice-regiones { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; }
.region-comunas { display: flex; flex-direction: column; gap: 10px; padding-top: 14px; border-top: 1px solid var(--borde); }
.comuna__fuentes { max-width: 820px; display: flex; flex-direction: column; gap: 6px; }
.comuna__otra a { font-weight: 600; }
.comuna__vecinas { display: flex; flex-direction: column; gap: 10px; }

/* ---------- Páginas por comuna más cálidas (ESPEC-COMUNAS-2, 1-10-2026) ---------- */
.sprite-iconos { position: absolute; width: 0; height: 0; overflow: hidden; }
.ico { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
/* Portada: texto + mapa ilustrado */
.portada-comuna { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 20px 16px; border-radius: 18px; background: linear-gradient(160deg, var(--cm-cuaderno) 0%, #E6F1FA 55%, var(--cm-blanco) 100%); border: 1px solid rgba(80, 163, 226, .25); }
.portada-comuna__texto { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.portada-comuna__texto .comuna__region { margin-top: -6px; }
@media (min-width: 900px) {
  .portada-comuna { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; gap: 32px; padding: 32px; }
  .portada-comuna--sin-mapa { grid-template-columns: minmax(0, 1fr); }
}
.portada-comuna__mapa { margin: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.mapa-comuna { display: block; width: 100%; height: auto; border-radius: 18px; box-shadow: 0 14px 30px -18px rgba(27, 43, 75, .55); }
.mc-fondo { fill: var(--cm-tinta); }
.mc-zona { fill: #2A4170; stroke: #2A4170; stroke-width: 56; stroke-linejoin: round; }
.mc-calles { fill: url(#mc-calles); }
#mc-calles path { fill: none; stroke: #FFFFFF; stroke-opacity: .07; stroke-width: 1.5; }
.mc-avenidas { fill: none; stroke: #FFFFFF; stroke-opacity: .1; stroke-width: 6; stroke-linecap: round; }
.mapa-comuna circle[class^="p-"] { stroke: var(--cm-tinta); stroke-width: 2; }
.mc-escala path { fill: none; stroke: var(--cm-papel); stroke-width: 2; }
.mc-escala text, .mc-norte text { fill: var(--cm-papel); font: 500 14px var(--font-text); }
.mc-norte path { fill: var(--cm-lapiz); }
.mc-norte text { text-anchor: middle; font-weight: 700; font-size: 11px; }
/* Colores por dependencia (puntos y leyenda) */
.p-pub, .p-gratis { fill: var(--cm-cielo); background: var(--cm-cielo); }
.p-sub, .p-particular { fill: var(--cm-lapiz); background: var(--cm-lapiz); }
.p-pag, .p-colegio { fill: var(--cm-blanco); background: var(--cm-blanco); }
.p-subvencionado { fill: #F3E9A6; background: #F3E9A6; }
.p-publico { fill: #9CCBF0; background: #9CCBF0; }
.p-otro { fill: #9AA7BD; background: #9AA7BD; }
.mapa-leyenda { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13.5px; }
.mapa-leyenda__punto { display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; border: 2px solid var(--cm-tinta); }
/* Cifras con íconos */
.cifras-comuna__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
@media (max-width: 420px) { .cifras-comuna__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
.cifra-comuna { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: var(--cm-blanco); border: 1px solid var(--borde); border-radius: 14px; box-shadow: var(--sombra-tarjeta); min-width: 0; }
.cifra-comuna__icono { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--superficie-activa); color: var(--cm-tinta); }
.cifra-comuna--tinta .cifra-comuna__icono { background: var(--cm-tinta); color: var(--cm-lapiz); }
.cifra-comuna--cielo .cifra-comuna__icono { background: var(--cm-cuaderno); color: var(--cm-cielo-oscuro); }
.cifra-comuna--lapiz .cifra-comuna__icono { background: #FAF1B0; color: var(--cm-ambar); }
.cifra-comuna--papel .cifra-comuna__icono { background: var(--cm-cuaderno); color: var(--cm-tinta); }
.cifra-comuna__cuerpo { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cifra-comuna__valor { font: 700 26px/1.1 var(--font-display); color: var(--cm-tinta); overflow-wrap: anywhere; }
.cifra-comuna__txt { font-size: 14.5px; font-weight: 600; }
.cifra-comuna__nota { font-size: 12.5px; color: var(--texto-suave); line-height: 1.35; }
@media (max-width: 420px) { .cifra-comuna__valor { font-size: 22px; } .cifra-comuna { padding: 12px; } }
/* Franja de logos */
.logos-comuna { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; background: var(--cm-blanco); border: 1px solid var(--borde); border-radius: 14px; }
.logos-comuna__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; }
.logos-comuna__lista li[hidden] { display: none; }
.logos-comuna__lista a { display: flex; align-items: center; justify-content: center; height: 76px; padding: 8px; border-radius: 10px; border: 1px solid var(--borde); background: var(--cm-blanco); transition: border-color .15s; }
.logos-comuna__lista a:hover { border-color: var(--cm-cielo); }
.logos-comuna__lista img { max-width: 100%; max-height: 100%; object-fit: contain; }
/* Destacados */
.destacados-comuna { display: flex; flex-direction: column; gap: 12px; }
.destacados-comuna__cab { display: flex; flex-direction: column; gap: 4px; }
.destacados-comuna__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
@media (max-width: 420px) { .destacados-comuna__grid { grid-template-columns: minmax(0, 1fr); } }
.destacado-comuna { display: flex; flex-direction: column; gap: 10px; padding: 16px; background: var(--cm-blanco); border: 1px solid var(--borde); border-top: 4px solid var(--cm-lapiz); border-radius: 14px; min-width: 0; }
.destacado-comuna__cab { display: flex; align-items: center; gap: 10px; }
.destacado-comuna__cab h3 { font-size: 17px; line-height: 1.2; }
.destacado-comuna__icono { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--cm-cuaderno); color: var(--cm-cielo-oscuro); flex: none; }
.destacado-comuna__icono .ico { width: 18px; height: 18px; }
.destacado-comuna__criterio { font-size: 13.5px; color: var(--texto-suave); line-height: 1.4; }
.destacado-comuna__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.destacado-comuna__lista li { display: flex; align-items: center; gap: 10px; min-width: 0; }
.destacado-comuna__nombre { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.destacado-comuna__nombre a { font-weight: 600; overflow-wrap: anywhere; }
.destacado-comuna__dato { font-size: 13.5px; font-weight: 600; color: var(--cm-tinta); }
.destacado-comuna__dato .suave { font-weight: 400; }
.destacado-comuna__fuente { margin-top: auto; padding-top: 8px; border-top: 1px dashed var(--borde); font-size: 12.5px; color: var(--texto-suave); }
/* Filas: logo o monograma antes del nombre */
.fm { display: flex; align-items: center; gap: 10px; min-width: 0; }
.fm a { min-width: 0; }
.comuna__titulo-tabla { margin-top: 8px; }
/* Índices: tarjetas por región */
.regiones-tarjetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.region-tarjeta { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; align-items: center; align-content: center; padding: 12px 14px; background: var(--cm-blanco); border: 1px solid var(--borde); border-left: 4px solid var(--cm-cielo); border-radius: 12px; color: var(--cm-tinta); text-decoration: none; }
.region-tarjeta:hover { border-left-color: var(--cm-lapiz); box-shadow: var(--sombra-tarjeta); }
.region-tarjeta__icono { grid-row: span 2; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--cm-cuaderno); color: var(--cm-cielo-oscuro); }
.region-tarjeta__icono .ico { width: 18px; height: 18px; }
.region-tarjeta__nombre { font-weight: 600; font-size: 15px; line-height: 1.25; }
.region-tarjeta__datos { font-size: 13px; color: var(--texto-suave); }
.region-tarjeta__datos strong { color: var(--cm-tinta); }
.region-comunas__total { display: inline-block; margin-left: 6px; padding: 2px 10px; border-radius: 999px; background: var(--cm-cuaderno); font: 600 13px/1.5 var(--font-text); vertical-align: middle; }
.logos-comuna[hidden] { display: none; }
@media (max-width: 420px) { .cifra-comuna:last-child:nth-child(odd) { grid-column: 1 / -1; } }
/* Monograma compacto: mismo aspecto que .logo-colegio--sm.logo-colegio--mono de estilos.css (fondo cuaderno, texto tinta). */
.mn { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: var(--cm-cuaderno); color: var(--cm-tinta); font: 700 13px/1 var(--font-display); font-style: normal; letter-spacing: .03em; }
/* ---------- Mapa de Chile (ESPEC-MAPA-CHILE, 1-10-2026): enlace en la cabecera e índices ---------- */
.cabecera__enlace--mapa { gap: 6px; white-space: nowrap; }
.cabecera__enlace--mapa .ico { width: 18px; height: 18px; }
@media (max-width: 480px) { .cabecera__mapa-txt { display: none; } }
.enlace-mapa-chile { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: var(--radio-m); background: var(--cm-degradado); color: var(--cm-papel); text-decoration: none; box-shadow: var(--sombra-tarjeta); }
.enlace-mapa-chile:hover { color: var(--cm-blanco); background: #24385F; }
.enlace-mapa-chile > .ico { width: 26px; height: 26px; color: var(--cm-lapiz); }
.enlace-mapa-chile > span:nth-child(2) { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.enlace-mapa-chile .chico { opacity: .85; }

/* Columna y filtro "Alumnos" (mixto, solo hombres, solo mujeres, en transición; 2-10-2026): cinco campos en la barra de filtros. */
@media (max-width: 759px) { .herramientas-comuna--5 .herramientas-comuna__campo:last-child { grid-column: auto; } }
@media (min-width: 760px) { .herramientas-comuna--5 { grid-template-columns: 2fr 1fr 1fr 1fr 1fr; } }
/* Columna y filtro "Religión" (orientación religiosa declarada; 2-10-2026): con "Alumnos" y "Religión" son seis campos. */
@media (min-width: 760px) { .herramientas-comuna--6 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1080px) { .herramientas-comuna--6 { grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr; } }
/* La tabla de colegios tiene ocho columnas: entre el corte de celular (760 px) y 1099 px no caben sin partir los nombres,
   así que en ese tramo también se muestra como tarjetas (el mismo manejo de celular de más arriba). Desde 1100 px,
   la columna del nombre conserva un ancho mínimo para que no se corte a mitad de palabra. */
@media (min-width: 1100px) { .tabla-comuna--ancha .tabla-comuna__nombre { min-width: 210px; } }
@media (min-width: 761px) and (max-width: 1099px) {
  .tabla-comuna--ancha, .tabla-comuna--ancha tbody, .tabla-comuna--ancha tr, .tabla-comuna--ancha td { display: block; width: 100%; }
  .tabla-comuna--ancha { border: 0; background: none; }
  .tabla-comuna--ancha thead { display: none; }
  .tabla-comuna--ancha tr { background: var(--cm-blanco); border: 1px solid var(--borde); border-radius: var(--radio-m); margin-bottom: 10px; padding: 6px 4px; }
  .tabla-comuna--ancha tr[hidden] { display: none; }
  .tabla-comuna--ancha td { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 10px; border: 0; padding: 6px 10px; }
  .tabla-comuna--ancha td::before { content: attr(data-t); font-size: 12px; font-weight: 600; color: var(--texto-suave); text-transform: uppercase; letter-spacing: .03em; }
  .tabla-comuna--ancha td.tabla-comuna__nombre { grid-template-columns: 1fr; font-size: 16.5px; }
  .tabla-comuna--ancha td.tabla-comuna__nombre::before { display: none; }
}

/* Páginas por colegio y preguntas frecuentes (17-10-2026) */
.ficha-estatica__cab { display: flex; gap: 18px; align-items: center; margin: 18px 0 10px; }
.ficha-estatica__cab h1 { margin: 0 0 4px; }
.ficha-estatica__logo { width: 72px; height: 72px; object-fit: contain; border-radius: var(--radio-m); background: var(--cm-blanco); border: 1px solid var(--borde); padding: 6px; flex: none; }
.ficha-estatica__acciones { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 24px; }
.ficha-estatica__seccion { margin: 28px 0; }
.ficha-estatica__seccion h2 { margin-bottom: 12px; }
.ficha-estatica__monto { font-size: 17px; }
.ficha-estatica__seccion .aviso { margin: 12px 0; }
.ficha-estatica__seccion .tabla-comuna__marco { margin-bottom: 8px; }
.ficha-estatica__datos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px 24px; margin: 0 0 8px; }
.ficha-estatica__datos dt { font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--texto-suave); }
.ficha-estatica__datos dd { margin: 2px 0 0; font-weight: 600; }
.ficha-estatica__resultado { padding: 14px 16px; border: 1px solid var(--borde); border-radius: var(--radio-m); background: var(--cm-blanco); margin-bottom: 12px; }
.ficha-estatica__resultado h3 { margin: 0 0 6px; font-size: 16px; }
.ficha-estatica__resultado p { margin: 0 0 4px; }
.faq-comuna { margin: 36px 0 28px; max-width: 820px; }
.faq-comuna h3 { font-size: 16.5px; margin: 20px 0 6px; }
.faq-comuna p { margin: 0; }
@media (max-width: 560px) { .ficha-estatica__cab { align-items: flex-start; } .ficha-estatica__logo { width: 56px; height: 56px; } }

/* Colegios por tipo dentro de la comuna (24-10-2026) */
.comuna__tipos { margin: 28px 0 8px; }
.comuna__tipos h2 { font-size: 18px; margin: 0 0 10px; }