/* Catálogo de Cursos y Rutas (cursos.html): tarjetas de Rutas, pestañas, descuentos, estimador y cursos. Usa los mismos colores del sitio
   (variables --cat-* de styles.css, claro y oscuro) y todo queda dentro de #catalogo para no chocar con las clases de Tailwind. */
:root { --ct-ok: 45 106 79; --ct-ok-bg: 237 245 240; --ct-strike: 140 135 125; }
html.dark { --ct-ok: 120 214 160; --ct-ok-bg: 20 44 33; --ct-strike: 130 140 158; }
#catalogo { font: 400 15px/24px Inter, system-ui, sans-serif; }
#catalogo .ct-serif, #catalogo h2, #catalogo h3 { font-family: Domine, Georgia, serif; }
#catalogo, #catalogo * { box-sizing: border-box; }
#catalogo a { text-decoration: none; }
/* encabezado de la página: fichas bajo el título */
.ct-hero-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.ct-hero-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: rgb(var(--cat-card)); border: 1px solid rgb(var(--cat-line)); font-size: 13px; font-weight: 600; }
.ct-hero-chip[hidden] { display: none; }
.ct-hero-chip .material-symbols-outlined { font-size: 18px; color: rgb(var(--cat-amber-strong)); }
.ct-hero-chip.ct-destacado { background: rgb(var(--cat-amber-soft)); border-color: rgb(var(--cat-amber) / .4); color: rgb(var(--cat-amber-strong)); }
  #catalogo .muted { color: rgb(var(--cat-muted)); }
  #catalogo .icon-btn { width: 40px; height: 40px; border-radius: 999px; border: 0; background: transparent; color: rgb(var(--cat-ink)); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
  #catalogo .icon-btn:hover { background: rgb(var(--cat-alt)); }
  #catalogo .btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: 10px 22px; border-radius: 999px; font: 600 14px/20px Inter, sans-serif; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: filter .15s, transform .15s, background .15s; white-space: nowrap; }
  #catalogo .btn-amber { background: rgb(var(--cat-amber)); color: rgb(var(--cat-on-amber)); }
  #catalogo .btn-amber:hover { filter: brightness(1.08); transform: translateY(-1px); }
  #catalogo .btn-line { background: transparent; border-color: rgb(var(--cat-line)); color: rgb(var(--cat-ink)); }
  #catalogo .btn-line:hover { background: rgb(var(--cat-alt)); }
  #catalogo .btn-sm { padding: 9px 14px; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; border-radius: 12px; }
  #catalogo .ct-bloque { padding: 56px 0 8px; scroll-margin-top: 84px; }
  #catalogo .eyebrow { font-size: 11px; line-height: 16px; letter-spacing: .12em; font-weight: 700; text-transform: uppercase; color: rgb(var(--cat-amber-strong)); }
  #catalogo .bloque h2 { margin: 6px 0 0; font-size: clamp(24px, 3vw, 32px); line-height: 1.25; letter-spacing: -.01em; }
  #catalogo .bloque .sub { margin: 8px 0 0; max-width: 46rem; color: rgb(var(--cat-muted)); }
  /* Rutas */
  #catalogo .rutas { display: grid; gap: 24px; margin-top: 28px; grid-template-columns: 1fr; }
  @media (min-width: 900px) { #catalogo .rutas { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 1240px) { #catalogo .rutas { grid-template-columns: repeat(3, 1fr); } }
  #catalogo .ruta { background: rgb(var(--cat-card)); border: 1px solid rgb(var(--cat-line)); border-radius: 20px; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .25s, transform .25s, border-color .25s; }
  #catalogo .ruta:hover { box-shadow: 0 12px 34px rgb(0 0 0 / .09); transform: translateY(-2px); border-color: rgb(var(--cat-amber) / .5); }
  #catalogo .ruta-top { position: relative; padding: 20px 22px 18px; background: linear-gradient(135deg, rgb(var(--cat-amber-soft)), rgb(var(--cat-alt))); border-bottom: 1px solid rgb(var(--cat-line)); }
  #catalogo .ruta-top .tag { display: inline-flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 4px 10px; border-radius: 6px; background: rgb(var(--cat-card) / .9); border: 1px solid rgb(var(--cat-line)); }
  #catalogo .ruta-top .tag .material-symbols-outlined { font-size: 15px; color: rgb(var(--cat-amber-strong)); }
  #catalogo .ruta-top h3 { margin: 12px 0 0; font-size: 21px; line-height: 1.3; padding-right: 76px; }
  #catalogo .ruta-top .desc { margin: 8px 0 0; font-size: 13.5px; line-height: 21px; color: rgb(var(--cat-muted)); }
  #catalogo .descuento-sello { position: absolute; top: 16px; right: 16px; width: 68px; height: 68px; border-radius: 50%; background: rgb(var(--cat-amber)); color: rgb(var(--cat-on-amber)); display: flex; flex-direction: column; align-items: center; justify-content: center; font-weight: 700; line-height: 1; box-shadow: 0 6px 16px rgb(var(--cat-amber) / .35); transform: rotate(6deg); }
  #catalogo .descuento-sello b { font-size: 22px; letter-spacing: -.02em; } .descuento-sello span { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; margin-top: 3px; }
  #catalogo .ruta-body { padding: 18px 22px 22px; display: flex; flex-direction: column; gap: 16px; flex: 1; }
  #catalogo .ruta-stats { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: rgb(var(--cat-muted)); }
  #catalogo .ruta-stats span { display: inline-flex; align-items: center; gap: 5px; } .ruta-stats .material-symbols-outlined { font-size: 16px; color: rgb(var(--cat-amber-strong)); }
  #catalogo ol.pasos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
  #catalogo ol.pasos li { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: start; padding: 9px 0; border-top: 1px dashed rgb(var(--cat-line)); font-size: 13.5px; line-height: 19px; }
  #catalogo ol.pasos li:first-child { border-top: 0; }
  #catalogo ol.pasos .n { width: 24px; height: 24px; border-radius: 50%; background: rgb(var(--cat-alt)); border: 1px solid rgb(var(--cat-line)); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; margin-top: 0; }
  #catalogo ol.pasos .p { color: rgb(var(--cat-muted)); font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 12.5px; }
  #catalogo .ruta-precio { margin-top: auto; border-radius: 14px; background: rgb(var(--cat-alt)); border: 1px solid rgb(var(--cat-line)); padding: 14px 16px; }
  #catalogo .ruta-precio .fila { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; color: rgb(var(--cat-muted)); }
  #catalogo .tachado { text-decoration: line-through; text-decoration-thickness: 1.5px; color: rgb(var(--ct-strike)); font-variant-numeric: tabular-nums; }
  #catalogo .ruta-precio .final { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; margin-top: 4px; }
  #catalogo .monto { font-family: Domine, Georgia, serif; font-weight: 700; font-size: 32px; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
  #catalogo .ahorro { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; background: rgb(var(--ct-ok-bg)); color: rgb(var(--ct-ok)); font-size: 12px; font-weight: 700; white-space: nowrap; }
  #catalogo .ahorro .material-symbols-outlined { font-size: 15px; }
  #catalogo .nota-iva { margin-top: 6px; font-size: 11.5px; color: rgb(var(--cat-muted)); }
  #catalogo .ruta-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  @media (max-width: 420px) { #catalogo .ruta-cta { grid-template-columns: 1fr; } }
  /* Descuentos */
  #catalogo .desc-grid { display: grid; gap: 20px; margin-top: 24px; grid-template-columns: 1fr; }
  @media (min-width: 800px) { #catalogo .desc-grid { grid-template-columns: 1fr 1fr; } }
  #catalogo .panel { background: rgb(var(--cat-card)); border: 1px solid rgb(var(--cat-line)); border-radius: 18px; padding: 22px; }
  #catalogo .panel h3 { margin: 0; font-size: 18px; display: flex; align-items: center; gap: 10px; }
  #catalogo .panel h3 .material-symbols-outlined { color: rgb(var(--cat-amber-strong)); font-size: 24px; }
  #catalogo .panel p.s { margin: 6px 0 14px; font-size: 13.5px; color: rgb(var(--cat-muted)); }
  #catalogo table.tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
  #catalogo table.tabla td, #catalogo table.tabla th { padding: 10px 4px; border-top: 1px solid rgb(var(--cat-line)); text-align: left; }
  #catalogo table.tabla th { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: rgb(var(--cat-muted)); border-top: 0; }
  #catalogo table.tabla td:last-child, #catalogo table.tabla th:last-child { text-align: right; }
  #catalogo .pct { display: inline-block; min-width: 54px; text-align: center; padding: 3px 10px; border-radius: 999px; background: rgb(var(--cat-amber-soft)); border: 1px solid rgb(var(--cat-amber) / .35); color: rgb(var(--cat-amber-strong)); font-weight: 700; font-size: 13px; }
  #catalogo .aviso { margin-top: 16px; display: flex; gap: 10px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: rgb(var(--cat-amber-soft)); border: 1px solid rgb(var(--cat-amber) / .3); font-size: 13.5px; color: rgb(var(--cat-ink)); }
  #catalogo .aviso .material-symbols-outlined { color: rgb(var(--cat-amber-strong)); font-size: 22px; margin-top: 1px; }
  /* Estimador */
  #catalogo .est { display: grid; gap: 24px; margin-top: 24px; grid-template-columns: 1fr; align-items: start; }
  @media (min-width: 960px) { #catalogo .est { grid-template-columns: 1.35fr 1fr; } }
  #catalogo .est-lista { max-height: 460px; overflow: auto; padding-right: 6px; }
  #catalogo .est-grupo { font-size: 11px; letter-spacing: .1em; font-weight: 700; text-transform: uppercase; color: rgb(var(--cat-muted)); margin: 14px 0 4px; }
  #catalogo .est-grupo:first-child { margin-top: 0; }
  #catalogo label.cur { display: grid; grid-template-columns: 20px 1fr auto; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 10px; cursor: pointer; font-size: 14px; line-height: 19px; }
  #catalogo label.cur:hover { background: rgb(var(--cat-alt)); }
  #catalogo label.cur input { width: 17px; height: 17px; accent-color: rgb(var(--cat-amber)); }
  #catalogo label.cur .p { color: rgb(var(--cat-muted)); font-variant-numeric: tabular-nums; font-size: 13px; }
  #catalogo .cargar { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
  #catalogo .chip { padding: 7px 14px; border-radius: 999px; border: 1px solid rgb(var(--cat-line)); background: rgb(var(--cat-bg)); color: rgb(var(--cat-ink)); font: 600 12.5px/16px Inter, sans-serif; cursor: pointer; white-space: nowrap; }
  #catalogo .chip:hover { border-color: rgb(var(--cat-amber)); color: rgb(var(--cat-amber-strong)); }
  #catalogo .chip.on { background: rgb(var(--cat-chip)); color: rgb(var(--cat-chip-text)); border-color: rgb(var(--cat-chip)); }
  #catalogo .stepper { display: inline-flex; align-items: center; border: 1px solid rgb(var(--cat-line)); border-radius: 12px; overflow: hidden; background: rgb(var(--cat-bg)); }
  #catalogo .stepper button { width: 40px; height: 40px; border: 0; background: transparent; color: rgb(var(--cat-ink)); font-size: 20px; cursor: pointer; }
  #catalogo .stepper button:hover { background: rgb(var(--cat-alt)); }
  #catalogo .stepper output { min-width: 48px; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; }
  #catalogo .resumen { position: sticky; top: 92px; }
  #catalogo .resumen .linea { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; font-size: 14px; border-top: 1px solid rgb(var(--cat-line)); }
  #catalogo .resumen .linea:first-of-type { border-top: 0; }
  #catalogo .resumen .total { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 8px; padding-top: 14px; border-top: 2px solid rgb(var(--cat-ink)); }
  #catalogo .resumen .total .monto { font-size: 34px; }
  #catalogo .vacio { color: rgb(var(--cat-muted)); font-size: 14px; padding: 18px 0 6px; }
  /* Cursos */
  #catalogo .toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
  #catalogo .grid { display: grid; gap: 24px; margin-top: 22px; grid-template-columns: 1fr; }
  @media (min-width: 760px) { #catalogo .grid { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 1180px) { #catalogo .grid { grid-template-columns: repeat(3, 1fr); } }
  #catalogo .curso { background: rgb(var(--cat-card)); border: 1px solid rgb(var(--cat-line)); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .25s, transform .25s, border-color .25s; }
  #catalogo .curso:hover { box-shadow: 0 10px 28px rgb(0 0 0 / .08); transform: translateY(-2px); border-color: rgb(var(--cat-amber) / .5); }
  #catalogo .curso .img { position: relative; height: 112px; background: linear-gradient(135deg, rgb(var(--cat-amber-soft)), rgb(var(--cat-alt))); display: flex; align-items: center; justify-content: center; }
  #catalogo .curso .cat { position: absolute; top: 12px; left: 12px; padding: 4px 10px; border-radius: 6px; background: rgb(var(--cat-card) / .9); border: 1px solid rgb(var(--cat-line)); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
  #catalogo .curso .ico { width: 56px; height: 56px; border-radius: 16px; background: rgb(var(--cat-card)); border: 1px solid rgb(var(--cat-line)); display: flex; align-items: center; justify-content: center; }
  #catalogo .curso .ico .material-symbols-outlined { font-size: 30px; color: rgb(var(--cat-amber-strong)); }
  #catalogo .curso .en-ruta { position: absolute; top: 12px; right: 12px; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 4px 9px; border-radius: 6px; background: rgb(var(--cat-amber-soft)); color: rgb(var(--cat-amber-strong)); border: 1px solid rgb(var(--cat-amber) / .35); }
  #catalogo .curso .cuerpo { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
  #catalogo .curso h3 { margin: 0; font-size: 18px; line-height: 1.32; }
  #catalogo .curso p.d { margin: 0; font-size: 13.5px; line-height: 21px; color: rgb(var(--cat-muted)); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  #catalogo .curso .meta { margin-top: auto; padding-top: 12px; border-top: 1px solid rgb(var(--cat-line)); display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: rgb(var(--cat-muted)); }
  #catalogo .curso .meta span { display: inline-flex; align-items: center; gap: 5px; } .curso .meta .material-symbols-outlined { font-size: 15px; color: rgb(var(--cat-amber-strong)); }
  #catalogo .curso .precio { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
  #catalogo .curso .precio .monto { font-size: 26px; }
  #catalogo .curso .precio small { font-size: 11.5px; color: rgb(var(--cat-muted)); text-align: right; line-height: 15px; }
  #catalogo .curso .btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  #catalogo .cta-final { margin: 56px 0 8px; border-radius: 20px; border: 1px solid rgb(var(--cat-line)); background: rgb(var(--cat-card)); padding: 28px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
  #catalogo .cta-final p { margin: 4px 0 0; color: rgb(var(--cat-muted)); font-size: 14px; }
  #catalogo footer.pie { margin-top: 64px; background: rgb(var(--cat-alt)); border-top: 1px solid rgb(var(--cat-line)); padding: 48px 0 32px; font-size: 14px; }
  #catalogo footer .cols { display: grid; gap: 28px; grid-template-columns: 1fr; }
  @media (min-width: 800px) { #catalogo footer .cols { grid-template-columns: 5fr 3fr 4fr; } }
  #catalogo footer .col { display: flex; flex-direction: column; gap: 8px; color: rgb(var(--cat-muted)); }
  #catalogo footer .col b { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
  #catalogo footer a { text-decoration: none; } footer a:hover { color: rgb(var(--cat-amber-strong)); }
  #catalogo footer .copy { margin-top: 28px; padding-top: 16px; border-top: 1px solid rgb(var(--cat-line)); font-size: 12px; color: rgb(var(--cat-muted)); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
  /* Catálogo unificado: pestañas + áreas + paginación */
  #catalogo .tabs-wrap { position: sticky; top: 80px; z-index: 40; margin: 26px -2rem 0; padding: 12px 2rem; background: rgb(var(--cat-bg) / .94); backdrop-filter: blur(12px); border-bottom: 1px solid rgb(var(--cat-line)); scroll-margin-top: 80px; }
  
  #catalogo .tabs { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
  #catalogo .tabs::-webkit-scrollbar { display: none; }
  #catalogo .tab { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; border: 1px solid rgb(var(--cat-line)); background: rgb(var(--cat-card)); color: rgb(var(--cat-ink)); font: 600 14px/20px Inter, sans-serif; cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s; }
  #catalogo .tab .material-symbols-outlined { font-size: 19px; color: rgb(var(--cat-amber-strong)); }
  #catalogo .tab .n { font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: rgb(var(--cat-alt)); color: rgb(var(--cat-muted)); }
  #catalogo .tab:hover { border-color: rgb(var(--cat-amber)); }
  #catalogo .tab[aria-selected="true"] { background: rgb(var(--cat-chip)); color: rgb(var(--cat-chip-text)); border-color: rgb(var(--cat-chip)); }
  #catalogo .tab[aria-selected="true"] .material-symbols-outlined { color: rgb(var(--cat-amber)); }
  #catalogo .tab[aria-selected="true"] .n { background: rgb(var(--cat-chip-text) / .18); color: inherit; }
  #catalogo .desc-strip { margin-top: 18px; border: 1px solid rgb(var(--cat-amber) / .35); background: rgb(var(--cat-amber-soft)); border-radius: 16px; padding: 12px 16px; }
  #catalogo .desc-strip summary { list-style: none; cursor: pointer; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; font-size: 13.5px; }
  #catalogo .desc-strip summary::-webkit-details-marker { display: none; }
  #catalogo .desc-strip .t { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: rgb(var(--cat-amber-strong)); }
  #catalogo .desc-strip .t .material-symbols-outlined { font-size: 20px; }
  #catalogo .desc-strip .resumen-d { display: flex; flex-wrap: wrap; gap: 6px 16px; color: rgb(var(--cat-ink)); }
  #catalogo .desc-strip .resumen-d b { color: rgb(var(--cat-amber-strong)); }
  #catalogo .desc-strip .mas { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: rgb(var(--cat-amber-strong)); font-size: 13px; }
  #catalogo .desc-strip[open] .mas .material-symbols-outlined { transform: rotate(180deg); }
  #catalogo .desc-strip .cuerpo-d { margin-top: 14px; }
  #catalogo .areas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 20px; }
  #catalogo .areas .lbl { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgb(var(--cat-muted)); margin-right: 4px; }
  #catalogo .cuenta-linea { margin: 14px 0 0; font-size: 13.5px; color: rgb(var(--cat-muted)); }
  #catalogo .pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px; margin: 30px 0 4px; }
  #catalogo .pager button { min-width: 40px; height: 40px; padding: 0 12px; border-radius: 12px; border: 1px solid rgb(var(--cat-line)); background: rgb(var(--cat-card)); color: rgb(var(--cat-ink)); font: 600 14px/20px Inter, sans-serif; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
  #catalogo .pager button:hover:not([disabled]) { border-color: rgb(var(--cat-amber)); color: rgb(var(--cat-amber-strong)); }
  #catalogo .pager button[aria-current="page"] { background: rgb(var(--cat-chip)); color: rgb(var(--cat-chip-text)); border-color: rgb(var(--cat-chip)); }
  #catalogo .pager button[disabled] { opacity: .4; cursor: default; }
  #catalogo .pager .info { width: 100%; text-align: center; font-size: 12.5px; color: rgb(var(--cat-muted)); margin-top: 6px; }
  #catalogo .resumen { top: 160px !important; }
  #catalogo [hidden] { display: none !important; }
  /* Rutas v3: tarjeta compacta (descripción + precio + 1 botón); los cursos van dentro de un desplegable */
  #catalogo .rutas { align-items: start; }
  #catalogo .ruta-top { padding: 18px 22px 16px; }
  #catalogo .ruta-top .tag { font-size: 10px; }
  #catalogo .ruta-top h3 { font-size: 20px; margin-top: 10px; }
  #catalogo .ruta-top .desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  #catalogo .ruta-top .ruta-stats { margin-top: 12px; }
  #catalogo .ruta-mid { padding: 16px 22px 8px; display: flex; flex-direction: column; gap: 14px; }
  #catalogo .precio-c { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
  #catalogo .precio-c .antes { font-size: 13px; color: rgb(var(--cat-muted)); }
  #catalogo .precio-c .antes .tachado { margin-left: 4px; }
  #catalogo .precio-c .monto { font-size: 34px; }
  #catalogo .precio-c small { display: block; margin-top: 2px; font-size: 11.5px; color: rgb(var(--cat-muted)); }
  #catalogo .ruta-mid .btn { width: 100%; }
  #catalogo .ruta-det { border-top: 1px solid rgb(var(--cat-line)); margin-top: 8px; }
  #catalogo .ruta-det summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 22px; font-size: 13.5px; font-weight: 600; color: rgb(var(--cat-amber-strong)); }
  #catalogo .ruta-det summary::-webkit-details-marker { display: none; }
  #catalogo .ruta-det summary:hover { background: rgb(var(--cat-alt)); }
  #catalogo .ruta-det summary .material-symbols-outlined { font-size: 22px; transition: transform .2s; }
  #catalogo .ruta-det[open] summary .material-symbols-outlined { transform: rotate(180deg); }
  #catalogo .ruta-det .abierto { padding: 0 22px 20px; display: flex; flex-direction: column; gap: 14px; }
  #catalogo .ruta-det .abierto .btn { align-self: flex-start; }
  #catalogo .enlace-cot { background: none; border: 0; padding: 0; font: 600 13px/18px Inter, sans-serif; color: rgb(var(--cat-amber-strong)); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
  #catalogo .enlace-cot:hover { text-decoration: underline; }