/* ==========================================================================
   demo-gym.css — "Forma Studio"
   Loud and physical. Near-black ground, one electric orange, condensed
   uppercase headings, square corners. The opposite of the dental template.
   ========================================================================== */

:root {
  --d-bg:         #0B0B0C;
  --d-ink:        #F5F5F3;
  --d-muted:      rgba(245, 245, 243, .62);
  --d-accent:     #FF5A1F;
  --d-accent-ink: #0B0B0C;
  --d-surface:    #141416;
  --d-line:       rgba(245, 245, 243, .14);
  --d-line-strong:rgba(245, 245, 243, .32);

  --d-sans:    "Work Sans", system-ui, sans-serif;
  --d-display: "Oswald", "Arial Narrow", system-ui, sans-serif;
  --d-radius:  3px;
  --d-radius-btn: 2px;
  --d-max:     1140px;
}

/* Everything display-weight is condensed, uppercase and tightly tracked. */
.dnav__brand,
.dh2, .dh3, .dhero__title {
  text-transform: uppercase;
  letter-spacing: .005em;
  font-weight: 700;
}
.dhero__title { font-size: clamp(40px, 8.4vw, 88px); line-height: .94; }
.dh2 { font-size: clamp(30px, 5vw, 48px); }

.dnav__links { text-transform: uppercase; font-size: 13px; font-weight: 600; letter-spacing: .1em; }
.dbtn { text-transform: uppercase; letter-spacing: .1em; font-size: 13.5px; font-weight: 700; }

.dkicker { color: var(--d-accent); letter-spacing: .26em; }

/* Schedule table — the thing a gym site lives or dies on. */
.dsched { border-top: 1px solid var(--d-line); }
.dsched__row {
  display: grid;
  grid-template-columns: 7.5em 1fr auto;
  gap: 6px 20px;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid var(--d-line);
  transition: background-color .2s ease;
}
@media (hover: hover) { .dsched__row:hover { background: var(--d-surface); } }
.dsched__time {
  font-family: var(--d-display);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--d-accent);
  font-variant-numeric: tabular-nums;
}
.dsched__name { font-weight: 600; }
.dsched__name span { display: block; font-size: 14px; color: var(--d-muted); font-weight: 400; }
.dsched__tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--d-muted);
  border: 1px solid var(--d-line-strong);
  padding: 5px 10px;
  white-space: nowrap;
}
@media (max-width: 620px) {
  .dsched__row { grid-template-columns: 1fr auto; }
  .dsched__time { grid-column: 1 / -1; }
}

/* Membership tiers. */
.dtier { background: var(--d-surface); border: 1px solid var(--d-line); border-radius: var(--d-radius); padding: 28px; display: flex; flex-direction: column; }
.dtier--feature { border-color: var(--d-accent); }
.dtier__name { font-family: var(--d-display); text-transform: uppercase; font-size: 20px; font-weight: 700; letter-spacing: .06em; }
.dtier__price { font-family: var(--d-display); font-size: 52px; font-weight: 700; line-height: 1; margin: 14px 0 4px; }
.dtier__price span { font-family: var(--d-sans); font-size: 14px; font-weight: 400; color: var(--d-muted); letter-spacing: 0; }
.dtier ul { display: grid; gap: 10px; margin: 20px 0 26px; font-size: 15px; color: var(--d-muted); }
.dtier li { display: flex; gap: 10px; }
.dtier li::before { content: "—"; color: var(--d-accent); flex: none; }
.dtier .dbtn { margin-top: auto; }

/* Stat row. */
.dstats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--d-line); border: 1px solid var(--d-line); }
.dstat { background: var(--d-bg); padding: 22px 18px; }
.dstat__n { font-family: var(--d-display); font-size: 38px; font-weight: 700; line-height: 1; color: var(--d-accent); }
.dstat__l { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--d-muted); margin-top: 8px; }
@media (max-width: 780px) { .dstats { grid-template-columns: repeat(2, 1fr); } }

.dhero--bleed { --d-hero-scrim: linear-gradient(to top, rgba(11,11,12,.94) 8%, rgba(11,11,12,.5) 55%, rgba(11,11,12,.7)); }
.dband { background: var(--d-accent); color: var(--d-accent-ink); }
.dband .dbtn { background: var(--d-accent-ink); color: var(--d-ink); }