/* ==========================================================================
   Páginas interiores A (clases · horarios · tarifas · semana de prueba)
   Piezas compartidas: cabecera de página, etiquetas, secciones y cierre.
   Solo se carga en esas cuatro páginas (pages_a.styles).
   ========================================================================== */

/* --- Cabecera de página (negro, como el hero de la home) ----------------- */
.ph { position: relative; isolation: isolate; overflow: hidden; background: #0a0a0a; color: var(--bone);
  padding: var(--s4) 0 0; }
.ph__in { row-gap: var(--s3); }
.ph__crumbs ol { display: flex; flex-wrap: wrap; gap: 6px 10px; color: var(--muted-dark); }
.ph__crumbs li { display: flex; align-items: center; gap: 10px; }
.ph__crumbs li + li::before { content: ""; width: 16px; height: 1px; background: var(--bronze); }
.ph__crumbs a { display: inline-flex; align-items: center; min-height: 44px; margin-block: -14px; text-decoration: none; transition: color .3s; }
.ph__crumbs a:hover { color: var(--bone); }
.ph__crumbs [aria-current] { color: var(--bone); }
.ph__copy .eyebrow { margin-bottom: var(--s2); }
.ph__title { font-size: clamp(2rem, 9.4vw, 5.6rem); font-stretch: 112%; font-weight: 750; line-height: .9; letter-spacing: -.03em; }
.ph__title .ln, .pcta__title .ln { padding-top: .14em; margin-top: -.14em; }
.ph__bar { display: block; height: 6px; width: calc(100% + 2 * var(--gutter)); margin: .12em calc(-1 * var(--gutter)) .14em; background: var(--bronze); }
.ph__lead { margin-top: var(--s3); max-width: 44ch; font-size: var(--fs-lead); line-height: 1.5; color: rgba(245, 242, 236, .84); }
.ph__actions { display: flex; flex-wrap: wrap; gap: var(--s1); margin-top: var(--s3); }
.ph__actions .btn { flex: 1 1 auto; }
/* Foto: B/N, esquina cortada, a sangre en móvil */
.ph__media { position: relative; margin-inline: calc(-1 * var(--gutter)); }
.ph__frame { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: var(--ink-2);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut-lg)), calc(100% - var(--cut-lg)) 100%, 0 100%); }
.ph__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.08) brightness(.86); }
.ph__stats { margin-top: var(--s5); }
.ph__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: var(--rule-dark); }
.ph__facts li { display: flex; flex-direction: column; gap: 6px; padding: var(--s2) var(--s1) var(--s2) 0; border-bottom: var(--rule-dark); }
.ph__facts li:nth-child(even) { padding-left: var(--s2); border-left: var(--rule-dark); }
.ph__facts b { font: 700 clamp(1.25rem, 5.6vw, 2.4rem)/1 var(--display); font-stretch: 112%; letter-spacing: -.02em; white-space: nowrap; }
.ph__facts span { font: 500 .75rem/1.3 var(--text); letter-spacing: .02em; color: var(--muted-dark); }
@media (max-width: 899px) {
  .ph__media { order: 3; margin-top: var(--s1); }
  .ph__copy { order: 2; }
  .ph__crumbs { order: 1; }
}
@media (min-width: 900px) {
  .ph { padding-top: var(--s8); }
  .ph__in { row-gap: var(--s5); align-items: start; }
  .ph__crumbs { grid-column: 1 / -1; grid-row: 1; }
  .ph__copy { grid-column: 1 / span 8; grid-row: 2; position: relative; z-index: 1; }
  .ph__title { font-size: clamp(3.4rem, 5.4vw, 5.6rem); }
  .ph__bar { width: calc(100% + var(--edge) + 24px); margin-left: calc(-1 * var(--edge)); margin-right: -24px; }
  .ph__lead { max-width: 40ch; }
  .ph__actions .btn { flex: 0 0 auto; }
  .ph__media { grid-column: 9 / span 4; grid-row: 1 / span 2; margin: 0 calc(-1 * var(--edge)) 0 0; }
  .ph__frame { aspect-ratio: 4 / 5; max-height: 620px; width: 100%;
    clip-path: polygon(var(--cut-lg) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut-lg)); }
  .ph__stats { margin-top: var(--s6); }
  .ph__facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ph__facts li { flex-direction: row; align-items: baseline; gap: var(--s2); padding: var(--s3) 0 var(--s4); border-bottom: 0; }
  .ph__facts li + li { padding-left: var(--s3); border-left: var(--rule-dark); }
  .ph__facts span { font: 600 var(--fs-micro)/1.3 var(--text); letter-spacing: .16em; text-transform: uppercase; }
}
/* Entrada: la foto se descubre con una cortina negra (solo con JS y movimiento permitido) */
@media (prefers-reduced-motion: no-preference) {
  .js .ph__media[data-reveal] { opacity: 1; transform: none; }
  .js .ph__frame::after { content: ""; position: absolute; inset: 0; background: #0a0a0a; transform-origin: 50% 0;
    transition: transform 1.3s var(--ease-out) .15s; }
  .js .ph__media.is-in .ph__frame::after { transform: scaleY(0); }
  .js .ph__img { transform: scale(1.14); transition: transform 1.8s var(--ease-out) .15s; }
  .js .ph__media.is-in .ph__img { transform: none; }
}
.reveal-all .ph__frame::after { transform: scaleY(0) !important; }
.reveal-all .ph__img { transform: none !important; }

/* --- Etiquetas (nivel, objetivo, días) ---------------------------------- */
.tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; white-space: nowrap;
  font: 600 .6875rem/1 var(--text); letter-spacing: .14em; text-transform: uppercase; box-shadow: inset 0 0 0 1px var(--line-light); color: var(--ink); }
.tag--bronze { background: var(--bronze); color: var(--ink); box-shadow: none; }
.tag--dark { box-shadow: inset 0 0 0 1px var(--line-dark); color: var(--bone); }

/* --- Secciones de las páginas A ----------------------------------------- */
.psec { padding: var(--section-y) 0; background: var(--bone); }
.psec--paper { background: var(--paper); }
.psec--ink { background: var(--ink-2); color: var(--bone); }
.psec__head { margin-bottom: var(--s5); }
.psec__title { font-size: var(--fs-h2); }
.psec__intro { margin-top: var(--s2); max-width: 52ch; color: var(--muted); }
.psec--ink .psec__intro { color: var(--muted-dark); }
@media (min-width: 900px) {
  .psec__head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col-gap); align-items: end; margin-bottom: var(--s8); }
  .psec__head > :first-child { grid-column: 1 / span 7; }
  .psec__head > .psec__side { grid-column: 9 / span 4; }
}

/* --- Cierre: semana de prueba gratis (negro) ---------------------------- */
.pcta { position: relative; isolation: isolate; overflow: hidden; background: #0a0a0a; color: var(--bone); padding: var(--section-y) 0; }
.pcta__bg { position: absolute; inset: 0; z-index: -2; opacity: .26; }
.pcta__bg img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.pcta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #0a0a0a 0%, rgba(10, 10, 10, .6) 40%, rgba(10, 10, 10, .88) 100%); }
.pcta__in { row-gap: var(--s3); }
.pcta__title { font-size: clamp(2.4rem, 11.6vw, 8.5rem); font-stretch: 115%; line-height: .9; letter-spacing: -.035em; }
.pcta__bar { display: block; height: 6px; width: calc(100% + 2 * var(--gutter)); margin: .1em calc(-1 * var(--gutter)) .12em; background: var(--bronze); }
.pcta__text { max-width: 46ch; font-size: var(--fs-lead); line-height: 1.5; color: rgba(245, 242, 236, .84); }
.pcta__actions { display: flex; flex-wrap: wrap; gap: var(--s1); }
.pcta__actions .btn:first-child { flex: 1 1 100%; }
.pcta__actions .btn--ghost { flex: 1 1 0; padding: 0 12px; }
@media (min-width: 900px) {
  .pcta__title { grid-column: 1 / span 11; }
  .pcta__bar { width: calc(100% + 2 * var(--edge)); margin-inline: calc(-1 * var(--edge)); }
  .pcta__text { grid-column: 1 / span 5; margin-top: var(--s3); }
  .pcta__actions { grid-column: 6 / span 7; align-self: end; justify-content: flex-end; flex-wrap: nowrap; }
  .pcta__actions .btn:first-child, .pcta__actions .btn--ghost { flex: 0 0 auto; padding: 0 24px; }
}
@media (max-width: 359px) {
  .ph__title { font-size: 1.9rem; }
  .ph__facts b { font-size: 1.15rem; }
  .pcta__title { font-size: 2.3rem; }
}