/* ==========================================================================
   Patch Fitness: the skin over the shared funnel styles (base.css).
   From patchfitness.co.uk's own theme (research/BRAND.md): ink navy #1B1F2A
   carries most of the page, ice blue #ADCDDB is the one accent (and the
   button on dark sections, with dark text), off-white #F6F6F6 and stone
   #D6D1C7 for the light rooms. Poppins throughout, buttons in sentence case
   with a 6.4px corner, as on their site. The photography supplies the rest:
   matt black walls and warm amber light.
   ========================================================================== */
:root {
  --olive: #1b1f2a;        /* primary: ink navy */
  --olive-deep: #11141c;
  --olive-soft: #4a5263;
  --ink: #1b1f2a;
  --ink-deep: #11141c;
  --sage: #adcddb;         /* accent on dark: ice blue */
  --gold: #1b1f2a;         /* review stars, on white cards */
  --sand: #e7e3dc;         /* stone, lifted a little for big rooms */
  --mist: #eceae5;
  --paper: #f6f6f6;
  --body: #2a2f3b;
  --muted: #5d6472;
  --line: #d9d6cf;
  --ice: #adcddb;
  --ice-deep: #7fb0c6;
  --coal: #242a38;
  --font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --r: 6.4px;
  --r-lg: 10px;
  --shadow: 0 4px 14px 0 rgba(17, 20, 28, .18);
  --shadow-lg: 0 18px 44px -14px rgba(17, 20, 28, .38);
}
body { background: var(--paper); font-weight: 400; }
h1, h2 { font-weight: 600; letter-spacing: -.025em; }
h1 { font-size: clamp(2.3rem, 5.4vw, 3.8rem); line-height: 1.08; }
h3 { font-weight: 600; }
.hero h1 .hl, .hero h1 .mo-w__i.hl { color: var(--ice-deep); }
.eyebrow, .kicker { font-weight: 600; letter-spacing: .14em; }

/* buttons: ink on light, ice blue on dark (dark text), sentence case */
.btn { font-weight: 600; letter-spacing: .02em; text-transform: none; border-radius: var(--r); }
.btn.big { font-size: 1.02rem; }
.on-dark .btn:not(.ghost):not(.light), .tone-ink .btn:not(.ghost):not(.light), .dark .btn:not(.ghost):not(.light),
.fx__panel .btn:not(.ghost), .cta-strip:not(.sand) .btn, .tone-olive .btn:not(.ghost) {
  background: var(--ice); color: var(--ink);
}
.btn.light { background: var(--ice); color: var(--ink); }
.cta-strip.sand .btn { background: var(--ink); color: #fff; }
@keyframes ctcGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(27, 31, 42, 0); }
  50%      { box-shadow: 0 0 0 7px rgba(27, 31, 42, .13); }
}
@keyframes ctcGlowLight {
  0%, 100% { box-shadow: 0 0 0 0 rgba(173, 205, 219, 0); }
  50%      { box-shadow: 0 0 0 8px rgba(173, 205, 219, .28); }
}
.on-dark .btn.glow, .tone-ink .btn.glow, .fx__panel .btn.glow, .cta-strip:not(.sand) .btn.glow,
.btn.light.glow { animation-name: ctcGlowLight; }
.on-dark .btn.glow:hover, .tone-ink .btn.glow:hover, .fx__panel .btn.glow:hover,
.cta-strip:not(.sand) .btn.glow:hover { box-shadow: 0 0 32px 2px rgba(173, 205, 219, .45); }

/* header: the navy mark and the wordmark, on off-white */
.top { background: rgba(246, 246, 246, .94); }
.top .logo { height: 40px; width: auto; }
.top .brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.top .brand .word { height: 22px; width: auto; }
.foot .logo { height: 54px; width: auto; }

/* dark rooms: navy, and a lifted navy for the "olive" ones */
.tone-ink { background: var(--ink); }
.tone-olive { background: var(--coal); }
.tone-olive .kicker, .tone-olive .eyebrow { color: var(--ice); }
.tone-olive .kicker .n { background: var(--ice); color: var(--ink); }
.foot { background: var(--ink-deep); }
.fx__panel { background: var(--ink); }
.fx__back { background: rgba(17, 20, 28, .78); }
.cta-strip { background: var(--ink); }
.cta-strip.olive { background: var(--coal); }

/* the trust strip and the spec panel */
.trust i { background: var(--ice-deep); }
.spec__row dt { color: var(--muted); }

/* booking card and quiz */
.book__steps li.done { background: #e4eef2; color: var(--ink); }
.book__time[aria-pressed="true"] { background: var(--ink); color: #fff; }
.fx__slot .book__steps li.done { background: rgba(173, 205, 219, .16); color: var(--paper); }
.form-card label.opt:has(input:checked) { background: #e4eef2; }
.heard li, .form-card .q__reply { background: #eef4f7; border-left-color: var(--ice-deep); }
.nsquiz__bar i.now { background: var(--ice-deep); }

/* films: navy behind the poster */
.films3 .film, .wall .film { background: var(--coal); }

/* the coaches strip */
.coaches { display: grid; gap: 14px; grid-template-columns: repeat(2, 1fr); margin-top: 34px; }
@media (min-width: 640px) { .coaches { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 980px) { .coaches { grid-template-columns: repeat(5, 1fr); } }
.coaches figure { margin: 0; }
.coaches img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 18%; border-radius: var(--r); display: block; }
.coaches figcaption { margin-top: 10px; font-size: .92rem; line-height: 1.35; }
.coaches figcaption b { display: block; color: #fff; font-weight: 600; }
.coaches figcaption span { color: rgba(255, 255, 255, .6); font-size: .8rem; }
.tone-paper .coaches figcaption b, .tone-sand .coaches figcaption b { color: var(--ink); }
.tone-paper .coaches figcaption span, .tone-sand .coaches figcaption span { color: var(--muted); }
