/* Recorrido sonoro / Sound journey. Estilos del componente de /assets/recorrido.js.
   Pensado para fondo oscuro (var(--ink)). Lo usa el aula (pilar Cultura de la facultad de música).
   Variables que espera del documento: --ink --cream --green --orange. */
/* recorrido sonoro: tour cultural por zoom (datos y SVG en /assets/recorrido.js) */
.rc{margin-top:34px}
.rc-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.rc-tabs::-webkit-scrollbar{display:none}
.rc-tab{flex:0 0 auto;font:inherit;font-size:14.5px;font-weight:600;padding:12px 20px;border-radius:100px;border:1.5px solid rgba(250,246,239,.25);background:transparent;color:var(--cream);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.rc-tab.on{background:var(--green);border-color:var(--green);color:var(--ink)}
.rc-tab:focus-visible,.rc-chip:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.rc-ctrl{margin-top:18px;display:flex;flex-direction:column;gap:10px}
.rc-row{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.rc-lab{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(250,246,239,.5);margin-right:4px}
.rc-chip{font:inherit;font-size:13px;font-weight:500;padding:7px 14px;border-radius:100px;border:1px solid rgba(250,246,239,.18);background:rgba(250,246,239,.05);color:rgba(250,246,239,.82);cursor:pointer}
.rc-chip.on{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.rc-thinfo{font-size:14.5px;line-height:1.55;color:rgba(250,246,239,.72);max-width:720px;border-left:2px solid var(--green);padding-left:14px}
.rc-count{margin-top:16px;font-size:12px;color:rgba(250,246,239,.5)}
.rc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:10px}
.rc-card{background:rgba(250,246,239,.05);border:1px solid rgba(250,246,239,.14);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.rc-ph{border-style:dashed}
.rc-art{background:var(--cream);aspect-ratio:16/10;display:grid;place-items:center}
.rc-art svg{width:78%;height:auto;display:block}
.rc-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.rc-place{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
.rc-body h3{font-family:'Fraunces',serif;font-size:23px;font-weight:600;line-height:1.12}
.rc-body dl{display:grid;gap:2px;font-size:13.5px;line-height:1.5}
.rc-body dt{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(250,246,239,.45);margin-top:6px}
.rc-body dd{color:rgba(250,246,239,.88)}
.rc-pend{color:rgba(250,246,239,.45);font-style:italic}
.rc-note{font-size:14px;line-height:1.55;color:rgba(250,246,239,.7)}
.rc-facts{list-style:none;display:flex;flex-direction:column;gap:7px;font-size:14px;line-height:1.5;color:rgba(250,246,239,.78)}
.rc-facts li{padding-left:16px;position:relative}
.rc-facts li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:2px;background:var(--orange)}
.rc-tags{display:flex;flex-wrap:wrap;gap:5px}
.rc-tags span{font-size:11px;font-weight:600;padding:3px 9px;border-radius:100px;background:rgba(250,246,239,.08);color:rgba(250,246,239,.6)}
.rc-tags span.on{background:var(--green);color:var(--ink)}
.rc-tags span.arts{background:rgba(255,135,82,.18);color:var(--orange)}
.rc-paid{margin-top:auto;padding-top:12px;border-top:1px dashed rgba(250,246,239,.18);font-size:14px;line-height:1.5;color:rgba(250,246,239,.85)}
.rc-paid b{display:block;font-family:'Fraunces',serif;font-size:17px;color:var(--green);margin-bottom:2px}
.rc-listen{font-size:13px;font-weight:700;color:var(--green)}
.rc-empty{grid-column:1/-1;font-size:15px;color:rgba(250,246,239,.6)}
.rc-foot{display:grid;grid-template-columns:1fr;gap:10px;margin-top:26px}
.rc-spine{font-family:'Fraunces',serif;font-size:clamp(18px,2.2vw,23px);line-height:1.4;color:var(--cream)}
.rc-spine b{color:var(--green)}
.rc-arts{font-size:13px;color:rgba(250,246,239,.55)}
@media(max-width:900px){.rc-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.rc-grid{grid-template-columns:1fr}.rc-body{padding:18px}.rc-art{aspect-ratio:16/8}.rc-art svg{width:62%}}
