/* ==========================================================================
   GELB Coaching — página coaching.html
   Visor del deck (6 páginas, proporción 2:3) + vista ampliada.
   Usa los tokens de styles.css. Sin dependencias.
   ========================================================================== */

.coaching { padding-block: var(--space-6); }

.coaching__grid { display: grid; gap: var(--space-4); }
.coaching__intro h1 { max-width: 34rem; }
.coaching__intro .lede { margin-top: var(--space-3); }

.coaching__actions { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); }
.coaching__contact-note { font-size: 0.9rem; color: var(--color-ink-soft); max-width: 24rem; }

@media (min-width: 64em) {
  .coaching__grid {
    grid-template-columns: 1fr minmax(0, 26rem);
    grid-template-areas: "intro deck" "actions deck";
    grid-template-rows: auto 1fr;
    column-gap: var(--space-12);
    align-items: start;
  }
  .coaching__intro { grid-area: intro; padding-top: var(--space-6); }
  .coaching__actions { grid-area: actions; }
  .deck { grid-area: deck; }
}

/* --- Visor --- */
.deck { width: min(100%, 26rem, calc((100svh - 11rem) * 2 / 3)); margin-inline: auto; }
@media (min-width: 64em) { .deck { margin-inline: 0; } }

.deck__stage { border-radius: var(--radius); box-shadow: 0 0 0 1px var(--color-border); overflow: hidden; background: var(--color-warm-white); }

.deck__track {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;   /* no arrastra la página ni dispara «atrás» del navegador */
  scrollbar-width: none;
  cursor: grab;
}
.deck__track::-webkit-scrollbar { display: none; }
.deck__track.is-dragging { scroll-snap-type: none; cursor: grabbing; user-select: none; }
.deck__track[data-hover="prev"] { cursor: w-resize; }
.deck__track[data-hover="next"] { cursor: e-resize; }
.deck__track:focus-visible { outline-offset: -3px; }

.deck__slide { flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always; aspect-ratio: 2 / 3; }
.deck__slide img { width: 100%; height: 100%; display: block; -webkit-user-drag: none; }

.deck__controls { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); margin-top: var(--space-2); }
.deck__controls[hidden] { display: none; }
.deck__counter { font-family: var(--font-heading); font-weight: 500; font-size: 0.9rem; min-width: 4.5rem; text-align: center; }

.deck__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.75rem; height: 2.75rem; padding-inline: 0.9em;
  background: transparent; color: var(--color-ink);
  border: 1px solid var(--color-ink); border-radius: var(--radius);
  font-family: var(--font-heading); font-weight: 500; font-size: 1rem; line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.deck__btn:hover { background: var(--color-ink); color: var(--color-bg); }
.deck__btn[aria-disabled="true"] { opacity: 0.35; cursor: default; }
.deck__btn[aria-disabled="true"]:hover { background: transparent; color: var(--color-ink); }
.deck__btn--text { font-size: 0.85rem; margin-left: auto; }

/* --- Texto del deck --- */
.deck-text { margin-top: var(--space-8); max-width: 42rem; border-top: 1px solid var(--color-border); padding-top: var(--space-3); }
.deck-text summary { font-family: var(--font-heading); font-weight: 500; cursor: pointer; }
.deck-text__body { margin-top: var(--space-3); }
.deck-text__body h2 { font-size: 1.1rem; margin-top: var(--space-4); margin-bottom: var(--space-1); }
.deck-text__body p, .deck-text__body ul, .deck-text__body ol { margin-top: var(--space-1); }
.deck-text__body ul { list-style: disc; padding-left: 1.25rem; }
.deck-text__body ol { list-style: decimal; padding-left: 1.25rem; }
.deck-text__body li + li { margin-top: 0.4em; }

/* --- Vista ampliada --- */
.deck-zoom { border: 0; padding: 0; width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; background: var(--color-bg); color: var(--color-ink); }
.deck-zoom::backdrop { background: rgba(31, 31, 31, 0.6); }
.deck-zoom[open] { display: flex; flex-direction: column; }
.deck-zoom__bar { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-1) var(--space-2); border-bottom: 1px solid var(--color-border); background: var(--color-bg); }
.deck-zoom__close { margin-left: auto; }
.deck-zoom__body { flex: 1; overflow: auto; -webkit-overflow-scrolling: touch; }
/* En móvil la página se muestra más ancha que la pantalla y se desplaza para leer los textos pequeños */
.deck-zoom__img { width: max(100%, 640px); max-width: 1024px; height: auto; margin-inline: auto; }
body:has(dialog[open]) { overflow: hidden; }