/* Las notas de compañía: una lectura propia, separada de la consola de radio. */
.al-ra-voces { background:#130c1b; color:#f4efe9; border-top:1px solid #d9b8ef24; }
.al-ra-voces-cab { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,6vw,90px); align-items:end; margin-bottom:65px; }
.al-ra-voces .al-kicker { color:#cfa8ef; }
.al-ra-voces h2 { margin:0; font-family:var(--display,Outfit,sans-serif); font-size:clamp(38px,4.3vw,65px); letter-spacing:-.045em; font-weight:500; line-height:1.04; color:#f4efe9; }
.al-ra-voces h2 em { display:block; font-family:var(--serif,"Instrument Serif",serif); color:#cfa8ef; font-weight:400; }
.al-ra-voces-intro p { margin:0 0 16px; max-width:52ch; color:#e0d4e8; font-size:16px; line-height:1.75; }
.al-ra-voces-intro p:last-child { margin-bottom:0; color:#baa9c6; font-size:14px; }
.al-ra-voces-lista { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 clamp(28px,5vw,72px); }
.al-ra-voz { display:grid; grid-template-columns:76px minmax(0,1fr); gap:23px; padding:34px 0 37px; border-top:1px solid #cfafe92e; }
.al-ra-voz-silueta { align-self:start; display:flex; flex-direction:column; align-items:center; gap:17px; padding:3px 0 0; }
.al-ra-voz-silueta span { font-size:10px; letter-spacing:.16em; color:#a58cb5; font-variant-numeric:tabular-nums; }
.al-ra-voz-silueta svg { width:74px; height:72px; fill:#cfa8ef; opacity:.8; transition:transform .4s,opacity .4s; }
.al-ra-voz:hover .al-ra-voz-silueta svg { transform:translateY(-3px); opacity:1; }
.al-ra-voz h3 { margin:0; font-family:var(--display,Outfit,sans-serif); color:#faf6fc; font-size:24px; font-weight:500; letter-spacing:-.025em; line-height:1.2; }
.al-ra-voz .al-ra-voz-tema { margin:7px 0 16px; color:#d5b0ed; font-family:var(--serif,"Instrument Serif",serif); font-style:italic; font-size:23px; line-height:1.15; }
.al-ra-voz-texto>p:not(.al-ra-voz-tema) { margin:0; color:#cdbfd7; font-size:14px; line-height:1.8; }
.al-ra-voz dl { display:flex; flex-wrap:wrap; gap:9px 16px; padding:15px 0 0; margin:0; }
.al-ra-voz dl>div { display:flex; flex-direction:column; gap:3px; }
.al-ra-voz dt { font-size:8px; text-transform:uppercase; letter-spacing:.09em; color:#a998b6; }
.al-ra-voz dd { margin:0; font-size:11px; font-weight:500; color:#ead8f6; }
.al-ra-voces-nota { margin:38px 0 0; padding-top:26px; border-top:1px solid #cfafe92e; max-width:85ch; color:#baa9c6; font-size:13px; line-height:1.8; }
/* El calendario sigue su curso aunque ya se hayan reunido los 16 animales. */
.al-ra-col-camino { margin-top:35px; padding-top:26px; border-top:1px solid #d4b9e633; }
.al-ra-camino-cab { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:12px; }
.al-ra-camino-cab h3 { font-family:var(--serif,"Instrument Serif",serif); font-weight:400; font-size:27px; color:#ead9f3; margin:0; }
.al-ra-camino-cab>span { color:#b9a3c8; font-size:11px; }
.al-ra-col-camino ol { list-style:none; margin:20px 0 15px; padding:0; display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:7px; }
.al-ra-col-camino li { display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; padding:13px 4px; border:1px solid #cfafe925; border-radius:12px; text-align:center; background:#ffffff03; }
.al-ra-col-camino time { display:flex; flex-direction:column; gap:3px; color:#b7a5c2; font-size:10px; line-height:1.4; }
.al-ra-col-camino time span { color:#d6c1e2; }
.al-ra-col-camino svg { width:35px; height:35px; fill:#a18aad; opacity:.55; }
.al-ra-col-camino b { font-size:10px; line-height:1.4; color:#d7c6e1; font-weight:500; }
.al-ra-col-camino small { font-size:8px; color:#a18aad; }
.al-ra-col-camino .al-actual { border-color:#e8c99780; background:#e8c9970a; }
.al-ra-col-camino .al-actual svg { fill:#e8c997; opacity:1; }
.al-ra-col-camino>p { color:#bca8c9; font-size:12px; line-height:1.8; margin:0; max-width:80ch; }
@media(max-width:760px) {
 .al-ra-voces-cab { grid-template-columns:1fr; gap:27px; margin-bottom:35px; }
 .al-ra-voces-lista { grid-template-columns:1fr; }
 .al-ra-voz { grid-template-columns:55px minmax(0,1fr); gap:18px; padding:27px 0 30px; }
 .al-ra-voz-silueta svg { width:53px; height:60px; }
 .al-ra-voz h3 { font-size:23px; }
 .al-ra-voz .al-ra-voz-tema { font-size:22px; }
 .al-ra-voces-intro p { font-size:15px; }
 .al-ra-col-camino ol { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(prefers-reduced-motion:reduce) { .al-ra-voz-silueta svg { transition:none; } .al-ra-voz:hover .al-ra-voz-silueta svg { transform:none; } }
