/* Página /guia: el video completo a un lado y sus partes al otro. */
.guia { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; padding-bottom: clamp(56px, 9vw, 110px); }
.guia-video { position: sticky; top: 92px; display: grid; gap: 14px; }
.guia-video video { width: 100%; aspect-ratio: 9 / 16; height: auto; border-radius: 26px; background: var(--cacao); box-shadow: var(--sombra); display: block; }
.guia-ahora { font-weight: 700; color: var(--rosa-hondo); min-height: 1.5em; }
.guia-caps { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.guia-btn { font: inherit; font-size: 0.92rem; font-weight: 700; line-height: 1.2; color: var(--cacao); background: var(--blanco); border: 1.5px solid var(--rubor); border-radius: 999px; padding: 8px 14px; min-height: 40px; cursor: pointer; text-align: left; transition: border-color .15s, color .15s, background .15s; }
.guia-btn:hover { border-color: var(--rosa); color: var(--rosa-hondo); }
.guia-btn:focus-visible { outline: 3px solid var(--rosa-hondo); outline-offset: 2px; }
.guia-btn[aria-current="true"] { background: var(--rosa-hondo); border-color: var(--rosa-hondo); color: var(--blanco); }

.guia-parte { scroll-margin-top: 96px; }
.guia-parte + .guia-parte { margin-top: clamp(30px, 5vw, 46px); }
.guia-parte header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 12px; }
.guia-parte h2 { font-size: 1.5rem; color: var(--rosa-hondo); margin: 0; }
.guia-parte header span { color: var(--cacao-suave); font-size: 0.95rem; }
.guia-tabla { width: 100%; border-collapse: collapse; background: var(--blanco); border: 1px solid var(--rubor); border-radius: var(--radio); overflow: hidden; }
.guia-tabla th, .guia-tabla td { text-align: left; vertical-align: top; padding: 12px 14px; border-top: 1px solid var(--linea); }
.guia-tabla thead th { border-top: 0; font-size: 0.82rem; letter-spacing: .04em; text-transform: uppercase; color: var(--cacao-suave); background: var(--bruma); }
.guia-tabla td:first-child { white-space: nowrap; width: 1%; }
.guia-tabla td:nth-child(2) { font-weight: 800; color: var(--cacao); width: 30%; }
.guia-tabla td:nth-child(3) { color: #4A433C; }
.guia-tabla tr.es-actual td { background: var(--rosa-claro); }
.guia-fin { margin-top: clamp(36px, 6vw, 56px); display: grid; gap: 14px; justify-items: start; background: var(--blanco); border: 1px solid var(--rubor); border-radius: var(--radio); padding: 24px; box-shadow: var(--sombra); }
.guia-fin p { color: var(--cacao-suave); }

/* El enlace a la guía bajo el carrusel de la portada. */
.guia-llamado { margin-top: clamp(24px, 4vw, 36px); display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 18px; text-align: center; }
.guia-llamado p { color: var(--cacao-suave); }
.video-card p a { color: var(--rosa-hondo); font-weight: 700; }

@media (max-width: 820px) {
  .guia { grid-template-columns: minmax(0, 1fr); }
  .guia-video { position: static; max-width: 360px; margin-inline: auto; width: 100%; }
  .guia-tabla thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .guia-tabla, .guia-tabla tbody, .guia-tabla tr, .guia-tabla td { display: block; width: auto; }
  .guia-tabla tr { border-top: 1px solid var(--linea); padding: 12px 14px; }
  .guia-tabla tr:first-child { border-top: 0; }
  .guia-tabla td { border: 0; padding: 0; }
  .guia-tabla td:first-child, .guia-tabla td:nth-child(2) { width: auto; }
  .guia-tabla td + td { margin-top: 6px; }
}
@media (prefers-reduced-motion: reduce) { .guia-btn { transition: none; } }