/* IN THE RING FITNESS — Programs page (Programs.dc.html) */

/* Alternating discipline blocks */
.discipline-block { padding: var(--section-gap) var(--gutter-x) 0; }
.split {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: clamp(24px, 3vw, 80px); align-items: start;
}
.split--flip { direction: rtl; }
.split--flip > * { direction: ltr; }
.photo-frame { position: relative; aspect-ratio: 4 / 5; max-height: clamp(420px, 27vw, 720px); background: var(--photo-fallback); }
.photo-frame img { width: 100%; height: 100%; object-fit: cover; }
.photo-frame__num {
  position: absolute; left: 20px; bottom: 20px;
  font-family: var(--font-display); font-weight: 700; font-size: clamp(48px, 5.2vw, 140px); line-height: 0.85; color: #fff;
}
.discipline-block__title {
  margin: 20px 0 22px;
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(40px, 3.9vw, 104px); line-height: 0.88; letter-spacing: -0.02em;
  text-transform: uppercase; color: var(--ink-800); text-wrap: balance;
}
.discipline-block__body { margin-bottom: 28px; font-size: clamp(16px, 0.67vw, 18px); line-height: 1.6; color: var(--text-body); max-width: 520px; text-wrap: pretty; }
.spec { border-top: 1px solid var(--ink-800); }
.spec__row { display: grid; grid-template-columns: 150px 1fr; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--paper-200); }
.spec dt { padding-top: 3px; font-family: var(--font-heading); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--steel-500); }
.spec dd { font-size: 16px; line-height: 1.55; color: var(--ink-800); text-wrap: pretty; }
.discipline-block__actions { margin-top: 28px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }

/* Every service */
.services { position: relative; overflow: hidden; margin-top: var(--section-gap); }
.services__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.35; }
.services__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12, 14, 18, 0.7), rgba(12, 14, 18, 0.96)); }
.services__inner { position: relative; padding: var(--section-gap) var(--gutter-x); }
.services__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.services__title {
  margin-top: 18px;
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(44px, 5.2vw, 140px); line-height: 0.84; letter-spacing: -0.02em;
  text-transform: uppercase; color: #fff; text-wrap: balance;
}
.services__lede { max-width: 380px; font-size: 17px; line-height: 1.55; color: var(--text-on-dark-soft); text-wrap: pretty; }
.services__grid {
  margin-top: clamp(40px, 5vw, 72px);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 14px;
}
.service, .service:hover { display: block; padding: clamp(18px, 0.97vw, 26px) clamp(16px, 0.9vw, 24px); color: inherit; }
.service__inner { display: flex; flex-direction: column; justify-content: space-between; gap: clamp(16px, 0.9vw, 24px); min-height: clamp(100px, 5.2vw, 140px); }
.service__meta {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--font-heading); font-weight: 700; font-size: 11px; letter-spacing: 0.34em; text-transform: uppercase; color: var(--red-500);
}
.service__tag { color: var(--slate-500); }
.service__name {
  display: block;
  font-family: var(--font-display); font-weight: 700; font-size: clamp(20px, 1.27vw, 34px); line-height: 0.95;
  letter-spacing: -0.01em; text-transform: uppercase; color: #fff; text-wrap: balance;
}
.service__desc { display: block; margin-top: 10px; font-size: 14px; line-height: 1.5; color: var(--text-on-dark-muted); text-wrap: pretty; }

/* Where we train */
.where { padding: var(--section-gap) var(--gutter-x); }
.where__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); column-gap: clamp(20px, 2.4vw, 64px); }
.where__item { padding: clamp(18px, 1.05vw, 28px) 0; border-bottom: 1px solid var(--paper-200); }
.where__item h3 { font-family: var(--font-display); font-weight: 700; font-size: clamp(26px, 1.5vw, 40px); line-height: 1; text-transform: uppercase; color: var(--ink-800); }
.where__item p { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--text-body); }
.where__foot { margin-top: 32px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; align-items: center; }
.where__serving { color: var(--text-body); }

@media (max-width: 639.98px) {
  .spec__row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .photo-frame__num { font-size: 48px; }
}
