/* =============================================================================
   BODY FOR LIFE FITNESS — Shared stylesheet
   Soft & Organic register, built on the Body for Life / Genesis design tokens.
   No JavaScript. Mobile-first. WCAG AA.

   ── HOW TO RESKIN ──────────────────────────────────────────────────────────
   Every value you'd want to change lives in the :root block below. The base
   palette/type/spacing come from the linked design-system token files; this
   block re-aliases them into friendly names and adds the soft/organic layer
   (larger radii, gentle shadows, section washes). Swap any line here and the
   whole site updates.
   ========================================================================== */

:root {
  /* ---- COLORS ---- (sourced from the Body for Life brand palette) */
  /* Navy-teal theme — logo green + logo blue */
  --c-primary:        #88C14A;                    /* interactive: CTAs, links */
  --c-primary-hover:  #9BD15C;
  --c-primary-wash:   rgba(136,193,74,0.10);
  --c-primary-soft:   rgba(136,193,74,0.24);
  --c-on-primary:     #0E1F2B;                    /* text on green */

  --c-blue:           #1CA8DE;                    /* logo blue, secondary accent */
  --c-blue-bright:    #4FC3F0;
  --c-blue-wash:      rgba(28,168,222,0.14);

  --c-accent:         #88C14A;                    /* logo green */
  --c-accent-ink:     #88C14A;
  --c-accent-wash:    #132C33;                    /* green-tinted section */
  --c-accent-soft:    rgba(136,193,74,0.20);

  --c-ink:            #F3F6F4;                    /* primary text */
  --c-ink-soft:       #AEBBC2;                    /* secondary text */
  --c-muted:          #85939B;

  --c-page:           #12283A;                    /* page canvas */
  --c-surface:        #183247;                    /* cards */
  --c-line:           rgba(255,255,255,0.09);     /* borders */
  --c-line-strong:    rgba(255,255,255,0.22);

  --c-deep:           #0E1F2B;                    /* hero, stats, footer */
  --c-deep-2:         #163045;
  --c-deep-line:      rgba(255,255,255,0.12);
  --c-on-deep:        #FFFFFF;
  --c-on-deep-soft:   #AEBBC2;
  --c-accent-on-deep: #88C14A;

  --f-mono: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);

  /* ---- FONTS ---- */
  --f-display: var(--font-display, "General Sans", system-ui, sans-serif);
  --f-body:    var(--font-body, "DM Sans", system-ui, sans-serif);

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold:600;
  --fw-bold:    700;

  /* Fluid type scale — soft/organic prefers slightly softer display sizes */
  --t-display:  clamp(2.6rem, 6vw + 1rem, 4.5rem);
  --t-headline: clamp(2.1rem, 4vw + 1rem, 3.4rem);
  --t-section:  clamp(1.7rem, 2.4vw + 1rem, 2.4rem);
  --t-subhead:  clamp(1.2rem, 1vw + 0.9rem, 1.5rem);
  --t-lead:     clamp(1.05rem, 0.6vw + 0.95rem, 1.25rem);
  --t-body:     1.0625rem;   /* 17px — a touch larger than DS 15 for warmth */
  --t-small:    0.875rem;
  --t-overline: 0.6875rem;   /* 11px */

  /* ---- SPACING ---- (4px grid) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;
  --s-20: 80px; --s-24: 96px; --s-32: 128px;

  --container: 1200px;
  --gutter: clamp(20px, 5vw, 40px);
  --section-y: clamp(56px, 9vw, 112px);

  /* ---- RADIUS ---- (organic: pushed larger than the DS 12px ceiling) */
  --r-sm:   6px;
  --r-md:   10px;
  --r-lg:   14px;
  --r-xl:   18px;
  --r-pill: 9999px;

  /* ---- ELEVATION ---- (soft, diffuse — never hard) */
  --shadow-soft:  0 2px 8px rgba(16, 42, 67, 0.04), 0 8px 24px rgba(16, 42, 67, 0.05);
  --shadow-lift:  0 8px 20px rgba(16, 42, 67, 0.07), 0 20px 48px rgba(16, 42, 67, 0.09);
  --shadow-glow:  0 8px 24px rgba(136, 193, 74, 0.28);
  --ring:         0 0 0 3px rgba(136, 193, 74, 0.45);

  /* ---- MOTION ---- (subtle, no flashy animation) */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur:  220ms;
}

/* =============================================================================
   RESET / BASE
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--f-body);
  font-size: var(--t-body);
  line-height: 1.6;
  color: var(--c-ink);
  background: var(--c-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5 {
  font-family: var(--f-display);
  font-weight: var(--fw-bold);
  letter-spacing: -0.025em;
  line-height: 1.08;
  color: var(--c-ink);
  margin: 0;
  text-wrap: balance;
}

p { margin: 0; text-wrap: pretty; }

a { color: var(--c-primary); text-decoration: none; }

img { max-width: 100%; display: block; }

ul, ol { margin: 0; padding: 0; list-style: none; }

::selection { background: var(--c-primary-soft); }

:focus-visible {
  outline: none;
  box-shadow: var(--ring);
  border-radius: var(--r-sm);
}

.skip-link {
  position: absolute;
  left: var(--s-4);
  top: -64px;
  z-index: 200;
  background: var(--c-primary);
  color: #fff;
  padding: var(--s-3) var(--s-5);
  border-radius: var(--r-md);
  font-weight: var(--fw-semibold);
  transition: top var(--dur) var(--ease);
}
.skip-link:focus { top: var(--s-4); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* =============================================================================
   LAYOUT PRIMITIVES
   ========================================================================== */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.section { padding-block: var(--section-y); }
.section--tight { padding-block: clamp(40px, 6vw, 72px); }
.section--wash-green { background: var(--c-accent-wash); }
.section--wash-blue  { background: var(--c-primary-wash); }
.section--ink {
  background: var(--c-deep);
  color: #EAF4FA;
}
.section--ink .lead, .section--ink .check-list span { color: var(--c-on-deep-soft); }
.section--ink .chip--solid { background: rgba(159,212,95,0.14); color: var(--c-accent-on-deep); }
.section--ink h1, .section--ink h2, .section--ink h3 { color: #fff; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  font-size: var(--t-overline);
  font-weight: var(--fw-bold);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-accent-ink);
  margin: 0 0 var(--s-4);
}
.eyebrow::before {
  content: "";
  width: 22px; height: 2px;
  background: var(--c-accent);
  border-radius: var(--r-pill);
}
.section--ink .eyebrow { color: var(--c-accent); }

.section-head { max-width: 64ch; margin-bottom: clamp(32px, 5vw, 56px); }
.section-head h2 { font-size: var(--t-section); }
.section-head p {
  margin-top: var(--s-4);
  color: var(--c-ink-soft);
  font-size: var(--t-lead);
}
.section--ink .section-head p { color: #B9D2E0; }

.lead { font-size: var(--t-lead); color: var(--c-ink-soft); line-height: 1.65; }

/* =============================================================================
   BUTTONS  (rebuilt in CSS to match the design system spec)
   ========================================================================== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  font-family: var(--f-body);
  font-size: 1rem;
  font-weight: var(--fw-semibold);
  line-height: 1;
  padding: var(--s-4) var(--s-6);
  border-radius: var(--r-pill);
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: transform var(--dur) var(--ease),
              background var(--dur) var(--ease),
              box-shadow var(--dur) var(--ease),
              border-color var(--dur) var(--ease),
              color var(--dur) var(--ease);
  white-space: nowrap;
}
.btn svg { width: 18px; height: 18px; flex: none; }

.btn--primary {
  background: var(--c-primary);
  color: #fff;
}
.btn--primary:hover { background: var(--c-primary-hover); transform: translateY(-2px); box-shadow: var(--shadow-glow); }
.btn--primary:active { transform: translateY(0); }

.btn--ghost {
  background: var(--c-surface);
  color: var(--c-ink);
  border-color: var(--c-line);
}
.btn--ghost:hover { border-color: var(--c-primary); color: var(--c-primary); transform: translateY(-2px); }

.btn--on-ink {
  background: rgba(255,255,255,0.08);
  color: #fff;
  border-color: rgba(255,255,255,0.28);
}
.btn--on-ink:hover { background: rgba(255,255,255,0.16); transform: translateY(-2px); }

.btn--lg { padding: var(--s-5) var(--s-8); font-size: 1.0625rem; }
.btn--block { width: 100%; }

.text-link {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  font-weight: var(--fw-semibold);
  color: var(--c-primary);
}
.text-link svg { width: 16px; height: 16px; transition: transform var(--dur) var(--ease); }
.text-link:hover svg { transform: translateX(4px); }

/* =============================================================================
   HEADER / NAV  (no JS — sticky, blurred; mobile uses a checkbox-free wrap)
   ========================================================================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(250,250,250,0.82);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--c-line);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
  min-height: 76px;
  flex-wrap: wrap;
}
.brand { display: inline-flex; align-items: center; gap: var(--s-3); }
.brand img { height: 44px; width: auto; }

.main-nav ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--s-1);
}
.main-nav a {
  display: inline-block;
  padding: var(--s-2) var(--s-4);
  border-radius: var(--r-pill);
  color: var(--c-ink-soft);
  font-weight: var(--fw-medium);
  font-size: 0.95rem;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.main-nav a:hover { background: var(--c-surface); color: var(--c-ink); }
.main-nav a[aria-current="page"] { color: var(--c-primary); background: var(--c-primary-wash); }

.header-cta { display: inline-flex; align-items: center; gap: var(--s-3); }

@media (max-width: 1199px) { .header-cta .btn--ghost { display: none; } }
@media (max-width: 1000px) {
  .site-header__inner { min-height: 64px; }
  .main-nav { order: 3; width: 100%; padding-bottom: var(--s-3); }
  .main-nav ul { justify-content: center; }
  .header-cta .btn--ghost { display: none; }
}

/* =============================================================================
   HERO  (editorial — type + soft color blocks + one framed photo)
   ========================================================================== */
.hero { position: relative; overflow: hidden; background: var(--c-deep); color: var(--c-on-deep-soft); isolation: isolate; }
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(55% 75% at 100% 0%, rgba(28,168,222,0.28) 0%, transparent 60%),
    radial-gradient(45% 65% at 0% 100%, rgba(136,193,74,0.22) 0%, transparent 60%);
  z-index: -1;
}
.hero h1 { color: var(--c-on-deep); }
.hl { color: var(--c-accent-on-deep); }
.hero .eyebrow { color: var(--c-accent-on-deep); }
.hero .eyebrow::before { background: var(--c-accent-on-deep); }
.hero .lead { color: var(--c-on-deep-soft); }
.hero__assure { color: var(--c-on-deep-soft) !important; border-color: var(--c-deep-line); }
.hero__assure svg { color: var(--c-accent-on-deep) !important; }
.hero .btn--ghost, .page-hero .btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,0.32); }
.hero .btn--ghost:hover, .page-hero .btn--ghost:hover { border-color: var(--c-accent-on-deep); color: var(--c-accent-on-deep); }
.hero__grid {
  display: grid;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
  padding-block: clamp(48px, 8vw, 96px);
}
@media (min-width: 940px) {
  .hero__grid { grid-template-columns: 1.05fr 0.95fr; }
}
.hero h1 { font-size: var(--t-display); }
.hero__lead { margin-top: var(--s-6); max-width: 48ch; }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--s-4); margin-top: var(--s-8); }
.hero__assure {
  display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6);
  margin-top: var(--s-8); color: var(--c-ink-soft); font-size: var(--t-small);
}
.hero__assure span { display: inline-flex; align-items: center; gap: var(--s-2); }
.hero__assure svg { width: 18px; height: 18px; color: var(--c-accent-ink); }

.hero__media { position: relative; }
.hero__media img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-lift);
}
.hero__badge {
  position: absolute;
  left: clamp(-8px, -2vw, -24px);
  bottom: clamp(16px, 4vw, 40px);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-soft);
  padding: var(--s-4) var(--s-5);
  display: flex;
  align-items: center;
  gap: var(--s-4);
  max-width: 280px;
}
.hero__badge .num { font-family: var(--f-display); font-size: 2rem; font-weight: var(--fw-bold); color: var(--c-accent-ink); line-height: 1; }
.hero__badge .lbl { font-size: var(--t-small); color: var(--c-ink-soft); }

/* =============================================================================
   GENERIC PAGE HEADER (interior pages)
   ========================================================================== */
.page-hero { position: relative; overflow: hidden; background: var(--c-deep); color: var(--c-on-deep-soft); isolation: isolate; }
.page-hero::before {
  content: "";
  position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(55% 90% at 90% 0%, rgba(28,168,222,0.26) 0%, transparent 60%),
    radial-gradient(45% 70% at 5% 100%, rgba(136,193,74,0.20) 0%, transparent 60%);
}
.page-hero h1 { color: var(--c-on-deep); }
.page-hero .eyebrow { color: var(--c-accent-on-deep); }
.page-hero .eyebrow::before { background: var(--c-accent-on-deep); }
.page-hero .lead { color: var(--c-on-deep-soft); }
.page-hero .crumbs, .page-hero .crumbs a { color: var(--c-on-deep-soft); }
.page-hero .crumbs a:hover { color: #fff; }
.page-hero .chip { background: rgba(255,255,255,0.06); border-color: var(--c-deep-line); color: #fff; }
.page-hero .chip svg { color: var(--c-accent-on-deep); }
.page-hero a.chip:hover { border-color: var(--c-accent-on-deep); }
.page-hero__inner { padding-block: clamp(56px, 8vw, 96px); max-width: 60ch; }
.page-hero h1 { font-size: var(--t-headline); }
.page-hero p { margin-top: var(--s-5); }
.crumbs { font-size: var(--t-small); color: var(--c-muted); margin-bottom: var(--s-5); }
.crumbs a { color: var(--c-ink-soft); }
.crumbs a:hover { color: var(--c-primary); }

/* =============================================================================
   CARDS
   ========================================================================== */
.card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.card--lift:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); border-color: transparent; }
.card__media { aspect-ratio: 3 / 2; overflow: hidden; background: var(--c-accent-wash); }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease); }
.card--lift:hover .card__media img { transform: scale(1.04); }
.card__body { padding: var(--s-6); }
.card__body h3 { font-size: var(--t-subhead); margin-bottom: var(--s-3); }
.card__body p { color: var(--c-ink-soft); }
.card__meta { display:flex; gap: var(--s-3); align-items:center; margin-bottom: var(--s-4); font-size: var(--t-small); color: var(--c-muted); }

.grid { display: grid; gap: var(--s-6); }
.grid--2 { grid-template-columns: 1fr; }
.grid--3 { grid-template-columns: 1fr; }
.grid--4 { grid-template-columns: 1fr 1fr; }
@media (min-width: 640px) {
  .grid--2 { grid-template-columns: 1fr 1fr; }
  .grid--3 { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 940px) {
  .grid--3 { grid-template-columns: repeat(3, 1fr); }
  .grid--4 { grid-template-columns: repeat(4, 1fr); }
}

/* Icon feature tile */
.feature {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: var(--s-8);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.feature:hover { transform: translateY(-4px); box-shadow: var(--shadow-soft); }
.feature__icon {
  width: 56px; height: 56px;
  display: grid; place-items: center;
  border-radius: var(--r-md);
  background: var(--c-primary-wash);
  color: var(--c-primary);
  margin-bottom: var(--s-5);
}
.feature__icon svg { width: 28px; height: 28px; }
.feature--accent .feature__icon { background: var(--c-accent-wash); color: var(--c-accent-ink); }
.feature h3 { font-size: var(--t-subhead); margin-bottom: var(--s-3); }
.feature p { color: var(--c-ink-soft); }

/* =============================================================================
   STATS BAND  (standout section #1 support)
   ========================================================================== */
.stats {
  display: grid;
  gap: var(--s-6);
  grid-template-columns: 1fr 1fr;
}
@media (min-width: 880px) { .stats { grid-template-columns: repeat(4, 1fr); } }
.stat {
  text-align: center;
  padding: var(--s-6) var(--s-4);
}
.stat .n { font-family: var(--f-display); font-weight: var(--fw-bold); font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1; color: var(--c-accent-ink); }
.section--ink .stat .n { color: var(--c-accent-on-deep); }
.stat .l { margin-top: var(--s-3); color: var(--c-ink-soft); font-size: var(--t-small); }
.section--ink .stat .l { color: #B9D2E0; }

/* =============================================================================
   PROCESS TIMELINE  (standout section #2)
   ========================================================================== */
.timeline { display: grid; gap: var(--s-6); counter-reset: step; }
@media (min-width: 880px) { .timeline { grid-template-columns: repeat(4, 1fr); } }
.tl-step {
  position: relative;
  padding: var(--s-8) var(--s-6);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
}
.tl-step__num {
  counter-increment: step;
  width: 48px; height: 48px;
  display: grid; place-items: center;
  border-radius: var(--r-pill);
  background: var(--c-deep);
  color: var(--c-accent-on-deep);
  font-family: var(--f-display);
  font-weight: var(--fw-bold);
  font-size: 1.25rem;
  margin-bottom: var(--s-5);
}
.tl-step__num::before { content: counter(step, decimal-leading-zero); }
.tl-step h3 { font-size: 1.2rem; margin-bottom: var(--s-2); }
.tl-step p { color: var(--c-ink-soft); font-size: var(--t-small); }
@media (min-width: 880px) {
  .tl-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(var(--s-8) + 24px);
    right: calc(var(--s-6) * -1 - 3px);
    width: calc(var(--s-6) * 2);
    height: 2px;
    background: var(--c-accent-soft);
    z-index: 1;
  }
}

/* =============================================================================
   COMPARISON TABLE
   ========================================================================== */
.compare {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  overflow: hidden;
  font-size: var(--t-body);
}
.compare th, .compare td { padding: var(--s-5) var(--s-5); text-align: left; border-bottom: 1px solid var(--c-line); vertical-align: middle; }
.compare thead th { font-family: var(--f-display); font-size: 1.05rem; }
.compare thead th:not(:first-child) { text-align: center; }
.compare .col-bfl { background: var(--c-primary-wash); }
.compare thead .col-bfl { color: var(--c-primary); }
.compare tbody td:not(:first-child) { text-align: center; }
.compare tr:last-child th, .compare tr:last-child td { border-bottom: 0; }
.compare th[scope="row"] { font-weight: var(--fw-semibold); color: var(--c-ink); }
.compare .yes { color: var(--c-accent-ink); }
.compare .no  { color: var(--c-muted); }
.compare svg { width: 22px; height: 22px; }
.compare-wrap { overflow-x: auto; border-radius: var(--r-lg); }

/* =============================================================================
   FAQ ACCORDION  (pure CSS details/summary)
   ========================================================================== */
.faq { display: grid; gap: var(--s-3); max-width: 820px; }
.faq details {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.faq details[open] { border-color: var(--c-primary-soft); box-shadow: var(--shadow-soft); }
.faq summary {
  list-style: none;
  cursor: pointer;
  padding: var(--s-5) var(--s-6);
  font-family: var(--f-display);
  font-weight: var(--fw-semibold);
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary .ico {
  flex: none;
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border-radius: var(--r-pill);
  background: var(--c-primary-wash);
  color: var(--c-primary);
  transition: transform var(--dur) var(--ease), background var(--dur) var(--ease);
}
.faq details[open] summary .ico { transform: rotate(45deg); background: var(--c-primary); color: #fff; }
.faq summary .ico svg { width: 16px; height: 16px; }
.faq__body { padding: 0 var(--s-6) var(--s-5); color: var(--c-ink-soft); }

/* =============================================================================
   TESTIMONIALS
   ========================================================================== */
.quote {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: var(--s-8);
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
}
.quote__mark { font-family: var(--f-display); font-size: 3rem; line-height: 0.6; color: var(--c-accent-soft); }
.quote p { font-size: 1.1rem; color: var(--c-ink); }
.quote__who { display: flex; align-items: center; gap: var(--s-3); margin-top: auto; }
.quote__avatar {
  width: 44px; height: 44px; border-radius: var(--r-pill);
  background: var(--c-primary-wash); color: var(--c-primary);
  display: grid; place-items: center; font-family: var(--f-display); font-weight: var(--fw-bold);
  flex: none;
}
.quote__who b { display: block; font-size: 0.95rem; }
.quote__who span { font-size: var(--t-small); color: var(--c-muted); }

/* =============================================================================
   PRICING / SERVICE TIERS
   ========================================================================== */
.tiers { display: grid; gap: var(--s-6); grid-template-columns: 1fr; }
@media (min-width: 940px) { .tiers { grid-template-columns: repeat(3, 1fr); } }
.tier {
  position: relative;
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: var(--s-8);
  display: flex;
  flex-direction: column;
}
.tier--featured { background: var(--c-deep); border-color: var(--c-deep); box-shadow: var(--shadow-lift); color: var(--c-on-deep-soft); }
.tier--featured h3, .tier--featured .tier__price { color: #fff; }
.tier--featured .tier__price span, .tier--featured .tier__desc { color: var(--c-on-deep-soft); }
.tier--featured li svg { color: var(--c-accent-on-deep); }
.tier--featured .tier__flag { background: var(--c-accent-on-deep); color: var(--c-deep); }
.tier__flag {
  position: absolute; top: var(--s-5); right: var(--s-5);
  font-size: var(--t-overline); font-weight: var(--fw-bold); letter-spacing: 0.12em; text-transform: uppercase;
  color: #fff; background: var(--c-primary); padding: var(--s-1) var(--s-3); border-radius: var(--r-pill);
}
.tier h3 { font-size: var(--t-subhead); }
.tier__price { font-family: var(--f-display); font-weight: var(--fw-bold); font-size: 2.4rem; margin: var(--s-4) 0 var(--s-2); }
.tier__price span { font-size: 1rem; font-weight: var(--fw-medium); color: var(--c-muted); }
.tier__desc { color: var(--c-ink-soft); font-size: var(--t-small); margin-bottom: var(--s-6); }
.tier ul { display: grid; gap: var(--s-3); margin-bottom: var(--s-8); }
.tier li { display: flex; gap: var(--s-3); align-items: flex-start; font-size: 0.95rem; }
.tier li svg { width: 20px; height: 20px; color: var(--c-accent-ink); flex: none; margin-top: 2px; }
.tier .btn { margin-top: auto; }

/* =============================================================================
   SPLIT / MEDIA SECTIONS
   ========================================================================== */
.split { display: grid; gap: clamp(32px, 5vw, 64px); align-items: center; }
@media (min-width: 880px) { .split { grid-template-columns: 1fr 1fr; } .split--reverse > .split__media { order: -1; } }
.split__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-xl); box-shadow: var(--shadow-soft); }
.split h2 { font-size: var(--t-section); }
.split p + p { margin-top: var(--s-4); }
.split .lead { margin-top: var(--s-5); }

.check-list { display: grid; gap: var(--s-4); margin-top: var(--s-6); }
.check-list li { display: flex; gap: var(--s-3); align-items: flex-start; }
.check-list svg { width: 22px; height: 22px; color: var(--c-accent-ink); flex: none; margin-top: 2px; }
.check-list b { font-weight: var(--fw-semibold); }
.check-list span { color: var(--c-ink-soft); }

/* Pill / chip lists */
.chips { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.chip {
  display: inline-flex; align-items: center; gap: var(--s-2);
  padding: var(--s-2) var(--s-4);
  border-radius: var(--r-pill);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  font-size: var(--t-small);
  font-weight: var(--fw-medium);
  color: var(--c-ink-soft);
}
.chip svg { width: 15px; height: 15px; color: var(--c-accent-ink); }
.chip--solid { background: var(--c-accent-wash); border-color: transparent; color: var(--c-accent-ink); }

/* Accreditation row */
.accred { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4) var(--s-8); }
.accred span {
  font-family: var(--f-display); font-weight: var(--fw-bold); font-size: 1.1rem;
  color: var(--c-ink-soft); letter-spacing: 0.02em;
}

/* =============================================================================
   CTA BANNER
   ========================================================================== */
.cta-band {
  background: var(--c-deep);
  color: #fff;
  border-radius: var(--r-xl);
  padding: clamp(40px, 6vw, 72px);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-band::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(60% 120% at 100% 0%, rgba(136,193,74,0.30) 0%, transparent 55%),
    radial-gradient(50% 110% at 0% 100%, rgba(28,168,222,0.30) 0%, transparent 55%);
}
.cta-band h2 .hl, .cta-band .hl { color: var(--c-accent-on-deep); }
.cta-band > * { position: relative; }
.cta-band h2 { color: #fff; font-size: var(--t-section); }
.cta-band p { color: rgba(255,255,255,0.85); margin: var(--s-4) auto 0; max-width: 52ch; font-size: var(--t-lead); }
.cta-band .hero__actions { justify-content: center; }

/* =============================================================================
   BLOG ARTICLE
   ========================================================================== */
.article { max-width: 760px; margin-inline: auto; }
.article h2 { font-size: var(--t-section); margin-top: var(--s-12); margin-bottom: var(--s-4); }
.article h3 { font-size: var(--t-subhead); margin-top: var(--s-8); margin-bottom: var(--s-3); }
.article p { margin-bottom: var(--s-5); color: #24323B; }
.article p:first-of-type { font-size: var(--t-lead); color: var(--c-ink); }
.article ul { display: grid; gap: var(--s-3); margin: 0 0 var(--s-6); padding-left: var(--s-2); }
.article ul li { display: flex; gap: var(--s-3); align-items: flex-start; color: #24323B; }
.article ul li::before { content: ""; width: 8px; height: 8px; border-radius: var(--r-pill); background: var(--c-accent); flex: none; margin-top: 10px; }
.article__hero img { width: 100%; aspect-ratio: 16 / 7; object-fit: cover; border-radius: var(--r-xl); box-shadow: var(--shadow-soft); margin-bottom: var(--s-8); }
.article__meta { display: flex; flex-wrap: wrap; gap: var(--s-4); color: var(--c-muted); font-size: var(--t-small); margin-bottom: var(--s-6); }
.callout {
  background: var(--c-accent-wash);
  border-left: 4px solid var(--c-accent);
  border-radius: var(--r-md);
  padding: var(--s-6);
  margin: var(--s-8) 0;
}
.callout p { margin: 0; color: #2C3A22; }
.article-nav { display: flex; gap: var(--s-3); flex-wrap: wrap; margin-top: var(--s-10); padding-top: var(--s-8); border-top: 1px solid var(--c-line); }

.toc {
  display: flex; flex-wrap: wrap; gap: var(--s-3);
  margin-bottom: var(--s-12);
  padding: var(--s-5) var(--s-6);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
}
.toc span { font-size: var(--t-overline); font-weight: var(--fw-bold); letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-muted); width: 100%; }
.toc a { font-weight: var(--fw-medium); padding: var(--s-2) var(--s-4); border-radius: var(--r-pill); background: var(--c-primary-wash); font-size: 0.9rem; }
.toc a:hover { background: var(--c-primary-soft); }

/* =============================================================================
   GALLERY  (CSS columns masonry — no JS)
   ========================================================================== */
.masonry { columns: 1; column-gap: var(--s-5); }
@media (min-width: 560px) { .masonry { columns: 2; } }
@media (min-width: 940px) { .masonry { columns: 3; } }
.masonry figure {
  break-inside: avoid;
  margin: 0 0 var(--s-5);
  border-radius: var(--r-lg);
  overflow: hidden;
  position: relative;
  border: 1px solid var(--c-line);
  background: var(--c-accent-wash);
}
.masonry img { width: 100%; height: auto; display: block; transition: transform 600ms var(--ease); }
.masonry figure:hover img { transform: scale(1.05); }
.masonry figcaption {
  position: absolute; inset: auto 0 0 0;
  padding: var(--s-8) var(--s-5) var(--s-4);
  background: linear-gradient(to top, rgba(8,22,31,0.78), transparent);
  color: #fff;
  font-size: var(--t-small);
  font-weight: var(--fw-medium);
  opacity: 0;
  transition: opacity var(--dur) var(--ease);
}
.masonry figure:hover figcaption, .masonry figure:focus-within figcaption { opacity: 1; }

.gallery-filter { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-bottom: var(--s-8); }

/* =============================================================================
   CONTACT
   ========================================================================== */
.contact-grid { display: grid; gap: clamp(32px, 5vw, 56px); }
@media (min-width: 940px) { .contact-grid { grid-template-columns: 1fr 1fr; } }

.form { display: grid; gap: var(--s-5); }
.field { display: grid; gap: var(--s-2); }
.field label { font-weight: var(--fw-semibold); font-size: 0.95rem; }
.field .req { color: var(--c-primary); }
.field input, .field select, .field textarea {
  font-family: var(--f-body);
  font-size: 1rem;
  color: var(--c-ink);
  background: var(--c-surface);
  border: 1.5px solid var(--c-line);
  border-radius: var(--r-md);
  padding: var(--s-4) var(--s-4);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  width: 100%;
}
.field textarea { resize: vertical; min-height: 130px; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none;
  border-color: var(--c-primary);
  box-shadow: var(--ring);
}
.field input::placeholder, .field textarea::placeholder { color: var(--c-muted); }
.field--row { display: grid; gap: var(--s-5); }
@media (min-width: 560px) { .field--row { grid-template-columns: 1fr 1fr; } }
.form__consent { display: flex; gap: var(--s-3); align-items: flex-start; font-size: var(--t-small); color: var(--c-ink-soft); }
.form__consent input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--c-primary); flex: none; }

.contact-card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  padding: var(--s-8);
}
.contact-list { display: grid; gap: var(--s-6); }
.contact-list li { display: flex; gap: var(--s-4); align-items: flex-start; }
.contact-list .ico {
  width: 46px; height: 46px; flex: none;
  display: grid; place-items: center; border-radius: var(--r-md);
  background: var(--c-primary-wash); color: var(--c-primary);
}
.contact-list .ico svg { width: 22px; height: 22px; }
.contact-list b { display: block; font-family: var(--f-display); font-size: 1.05rem; margin-bottom: 2px; }
.contact-list a, .contact-list p { color: var(--c-ink-soft); }
.contact-list a:hover { color: var(--c-primary); }

.map-frame {
  margin-top: var(--s-6);
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--c-line);
  aspect-ratio: 16 / 9;
  background: var(--c-accent-wash);
}
.map-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.hours { display: grid; gap: var(--s-2); margin-top: var(--s-4); }
.hours li { display: flex; justify-content: space-between; gap: var(--s-4); padding: var(--s-2) 0; border-bottom: 1px dashed var(--c-line); font-size: 0.95rem; }
.hours li span:last-child { color: var(--c-ink-soft); }
.hours li:last-child { border-bottom: 0; }

/* =============================================================================
   FOOTER
   ========================================================================== */
.site-footer { background: var(--c-deep); color: #C7DAE6; padding-block: var(--s-20) var(--s-10); margin-top: var(--section-y); }
.site-footer h4 { color: #fff; font-size: 1rem; margin-bottom: var(--s-5); letter-spacing: 0; }
.footer-grid { display: grid; gap: var(--s-10); grid-template-columns: 1fr; }
@media (min-width: 720px) { .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; } }
@media (min-width: 980px) { .footer-grid { grid-template-columns: 1.6fr 1fr 1fr 1.2fr; } }
.footer-brand img { height: 56px; width: auto; }
.footer-brand p { margin-top: var(--s-5); color: #9FB6C4; max-width: 34ch; font-size: 0.95rem; }
.footer-links { display: grid; gap: var(--s-3); }
.footer-links a { color: #C7DAE6; font-size: 0.95rem; }
.footer-links a:hover { color: #fff; }
.footer-contact { display: grid; gap: var(--s-3); font-size: 0.95rem; }
.footer-contact a { color: #C7DAE6; }
.footer-contact a:hover { color: #fff; }
.socials { display: flex; gap: var(--s-3); margin-top: var(--s-5); }
.socials a {
  width: 42px; height: 42px; border-radius: var(--r-pill);
  display: grid; place-items: center;
  background: rgba(255,255,255,0.07);
  color: #fff;
  transition: background var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.socials a:hover { background: var(--c-primary); transform: translateY(-2px); }
.socials svg { width: 20px; height: 20px; }
.footer-bottom {
  margin-top: var(--s-16);
  padding-top: var(--s-6);
  border-top: 1px solid rgba(255,255,255,0.1);
  display: flex; flex-wrap: wrap; gap: var(--s-4);
  justify-content: space-between; align-items: center;
  font-size: var(--t-small); color: #8AA3B2;
}
.footer-bottom a { color: #8AA3B2; }
.footer-bottom a:hover { color: #fff; }

/* =============================================================================
   UTILITIES + MOTION PREFERENCE
   ========================================================================== */
/* =============================================================================
   DARK ATHLETIC THEME OVERRIDES (matches BFL campaign creative)
   ========================================================================== */
:root{color-scheme:dark}
.site-header{background:rgba(14,31,43,.85)}
.brand img{height:56px;width:auto}
.eyebrow{font-family:var(--f-mono);font-weight:700;letter-spacing:.22em;font-size:.75rem}
.eyebrow::before{display:none}
.hero .eyebrow{background:var(--c-accent);color:var(--c-on-primary);padding:10px 16px;border-radius:var(--r-sm);letter-spacing:.14em}
.hero h1,.page-hero h1,.cta-band h2{text-transform:uppercase;letter-spacing:-.035em;line-height:.95}
.hero h1{font-size:clamp(2.6rem,5vw,4.25rem)}
.btn--primary,.btn--primary:hover{color:var(--c-on-primary)}
.skip-link,.skip-link:focus{color:var(--c-on-primary)}
.faq details[open] summary .ico{color:var(--c-on-primary)}
.tier__flag{color:var(--c-on-primary)}
.feature__icon{background:var(--c-blue-wash);color:var(--c-blue-bright)}
.feature--accent .feature__icon{background:var(--c-accent-soft);color:var(--c-accent)}
.section--wash-blue{background:#11293B}
.section--ink{background:var(--c-deep)}
.article p,.article ul li{color:#CDD6DA}
.article p:first-of-type{color:var(--c-ink)}
.callout{border:1px solid var(--c-accent-soft);background:var(--c-accent-wash)}
.callout p{color:var(--c-ink)}
.tier--featured{background:var(--c-surface);border-color:var(--c-accent)}
.tier--featured h3,.tier--featured .tier__price{color:var(--c-ink)}
.compare thead th{background:transparent}
.timeline{gap:var(--s-10)}
.tl-step{background:none;border:0;padding:0}
.timeline .tl-step::after{content:none}
.tl-step__num{width:auto;height:auto;display:block;border-radius:0;background:linear-gradient(var(--c-line-strong),var(--c-line-strong)) left bottom/28px 2px no-repeat;color:var(--c-accent);font-size:1.75rem;padding-bottom:var(--s-4);margin-bottom:var(--s-5)}
.tl-step h3{font-size:1.3rem}
.tl-step p{font-size:var(--t-body)}
.cta-band{background:var(--c-accent);color:var(--c-on-primary)}
.cta-band::before{content:none}
.cta-band h2{color:var(--c-on-primary)}
.cta-band p{color:rgba(14,31,43,.8)}
.cta-band .btn--primary{background:var(--c-on-primary);color:#fff}
.cta-band .btn--primary:hover{background:#000;color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.cta-band .btn--on-ink{background:transparent;color:var(--c-on-primary);border-color:rgba(14,31,43,.35)}
.cta-band .btn--on-ink:hover{background:rgba(14,31,43,.08)}
.page-hero::before{background:radial-gradient(55% 90% at 90% 0%,rgba(28,168,222,.18) 0%,transparent 60%),radial-gradient(45% 70% at 5% 100%,rgba(136,193,74,.10) 0%,transparent 60%)}

/* Hero: photo faded into the dark ground */
.hero{background:var(--c-deep)}
.hero::before{background:radial-gradient(50% 70% at 0% 100%,rgba(136,193,74,.08) 0%,transparent 60%)}
.hero__copy{position:relative;z-index:2}
.hero__media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 45%)}
.hero__media img{border-radius:0;box-shadow:none}
.hero__badge{z-index:2;background:rgba(24,50,71,.9);border-color:var(--c-line);backdrop-filter:blur(8px)}
.hero__badge .num{color:var(--c-accent)}
@media (min-width:940px){
.hero__grid{grid-template-columns:minmax(0,1fr);min-height:min(86vh,760px);align-content:center}
.hero__copy{max-width:620px}
.hero__media{position:absolute;top:0;right:0;bottom:0;width:62%;z-index:0}
.hero__media img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center 30%}
.hero__media::after{background:linear-gradient(90deg,#0E1F2B 0%,rgba(14,31,43,.85) 22%,rgba(14,31,43,.2) 60%,rgba(14,31,43,0) 100%),linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 35%)}
.hero__badge{left:auto;right:var(--gutter);bottom:var(--s-10)}
}
@media (max-width:939px){
.hero__grid{padding-top:0}
.hero__media{order:-1;margin:0 calc(var(--gutter) * -1) -120px}
.hero__media img{aspect-ratio:4/3.4}
.hero__badge{display:none}
}

/* Accreditation logos — transparent marks on the page ground */
.accred-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--s-8) clamp(32px,6vw,72px);max-width:960px;margin-inline:auto}
.accred-logo{margin:0;display:flex;flex-direction:column;align-items:center;gap:var(--s-3)}
.accred-logo img{height:64px;width:auto;max-width:220px;object-fit:contain}
.accred-logo figcaption{font-family:var(--f-mono);font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted);text-align:center}
.accred-logo--main img{height:120px;max-width:none}
.accred-logo--main figcaption{color:var(--c-accent)}
.accred-logos--stack{justify-content:flex-start;margin:var(--s-8) 0 0}

/* Home services cards */
.svc{display:flex;flex-direction:column;position:relative;cursor:pointer}
.svc .text-link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.svc:hover{border-color:var(--c-accent)}
.svc:focus-within{box-shadow:var(--ring)}
.svc__top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-5)}
.svc__top .feature__icon{margin-bottom:0}
.svc__badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:var(--r-pill);background:var(--c-accent);color:var(--c-on-primary);font-family:var(--f-mono);font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.svc__badge svg{width:13px;height:13px}
.svc__badge--time{background:var(--c-blue-wash);color:var(--c-blue-bright);box-shadow:inset 0 0 0 1px rgba(79,195,240,.35)}
.svc--featured{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}
.svc__link{margin-top:auto;padding-top:var(--s-5)}
@media (min-width:940px) and (max-width:1180px){.svc-grid{grid-template-columns:repeat(2,1fr)}}

/* Services: scrolling chapters with faded background photos */
html:has(.chapters){scroll-snap-type:y proximity;scroll-padding-top:76px}
.chapters{position:relative}
.chapter{position:relative;isolation:isolate;overflow:hidden;background:var(--c-deep);min-height:calc(100vh - 76px);display:flex;flex-direction:column;justify-content:center;scroll-snap-align:start}
.chapter--green{background:#102730}
.chapter__media{position:absolute;inset:0 0 0 auto;width:64%;z-index:-1}
.chapter--flip .chapter__media{inset:0 auto 0 0}
.chapter__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--c-deep) 0%,rgba(14,31,43,.85) 22%,rgba(14,31,43,.2) 62%,rgba(14,31,43,0) 100%),linear-gradient(0deg,var(--c-deep) 0%,rgba(14,31,43,0) 32%),linear-gradient(180deg,var(--c-deep) 0%,rgba(14,31,43,0) 18%)}
.chapter--flip .chapter__media::after{background:linear-gradient(270deg,var(--c-deep) 0%,rgba(14,31,43,.85) 22%,rgba(14,31,43,.2) 62%,rgba(14,31,43,0) 100%),linear-gradient(0deg,var(--c-deep) 0%,rgba(14,31,43,0) 32%),linear-gradient(180deg,var(--c-deep) 0%,rgba(14,31,43,0) 18%)}
.chapter--green .chapter__media::after{background:linear-gradient(270deg,#102730 0%,rgba(16,39,48,.85) 22%,rgba(16,39,48,.2) 62%,rgba(16,39,48,0) 100%),linear-gradient(0deg,#102730 0%,rgba(16,39,48,0) 32%),linear-gradient(180deg,#102730 0%,rgba(16,39,48,0) 18%)}
.ph{position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.045) 0 2px,transparent 2px 16px),linear-gradient(160deg,#2A5470,#183247);display:flex;align-items:center;justify-content:center}
.chapter--green .ph{background:repeating-linear-gradient(135deg,rgba(255,255,255,.045) 0 2px,transparent 2px 16px),linear-gradient(160deg,#3F6A3A,#1B3B3A)}
.ph span{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);padding:8px 14px;border:1px dashed rgba(255,255,255,.3);border-radius:var(--r-sm);transform:translateX(18%)}
.chapter--flip .ph span{transform:translateX(-18%)}
.chapter__inner{padding-block:clamp(64px,10vh,112px)}
.chapter__inner>*{max-width:600px}
.chapter--flip .chapter__inner{display:flex;flex-direction:column;align-items:flex-end}
.chapter--flip .chapter__inner>*{width:100%}
.chapter__num{font-family:var(--f-mono);font-weight:700;font-size:1rem;letter-spacing:.12em;color:var(--c-accent);margin-bottom:var(--s-5);padding-bottom:var(--s-3);background:linear-gradient(var(--c-line-strong),var(--c-line-strong)) left bottom/28px 2px no-repeat}
.chapter__num span{color:var(--c-muted)}
.chapter__tag{display:inline-flex;align-items:center;gap:6px;width:auto!important;align-self:flex-start;padding:8px 14px;border-radius:var(--r-sm);background:var(--c-accent);color:var(--c-on-primary);font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:var(--s-5)}
.chapter--flip .chapter__tag{align-self:auto}
.chapter__tag svg{width:15px;height:15px}
.chapter__tag--blue{background:var(--c-blue-wash);color:var(--c-blue-bright);box-shadow:inset 0 0 0 1px rgba(79,195,240,.35)}
.chapter__title{font-size:clamp(2.6rem,5.6vw,4.75rem);text-transform:uppercase;letter-spacing:-.035em;line-height:.95;color:#fff}
.chapter__lead{margin-top:var(--s-6);color:var(--c-on-deep-soft)}
.chapter__points{display:grid;gap:var(--s-3);margin-top:var(--s-6)}
.chapter__points li{display:flex;gap:var(--s-3);align-items:flex-start;color:var(--c-on-deep-soft)}
.chapter__points b{color:#fff;font-weight:600}
.chapter__points svg{width:20px;height:20px;color:var(--c-accent);flex:none;margin-top:3px}
.chapter__chips{margin-top:var(--s-6)}
.chapter__chips .chip{background:rgba(255,255,255,.06);border-color:var(--c-deep-line);color:#fff}
.chapter__next{position:absolute;left:50%;bottom:var(--s-6);transform:translateX(-50%);display:inline-flex;align-items:center;gap:var(--s-2);font-family:var(--f-mono);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-on-deep-soft);white-space:nowrap}
.chapter__next svg{width:16px;height:16px;color:var(--c-accent)}
.chapter__next:hover{color:#fff}
.chapter-rail{position:sticky;top:50vh;height:0;z-index:5;display:none}
.chapter-rail ol{position:absolute;right:var(--s-6);transform:translateY(-50%);display:grid;gap:var(--s-2);padding:var(--s-3);border-radius:var(--r-md);background:rgba(14,31,43,.6);backdrop-filter:blur(8px);border:1px solid var(--c-deep-line)}
.chapter-rail a{display:flex;gap:var(--s-2);align-items:center;padding:6px 10px;border-radius:var(--r-sm);font-size:.8rem;color:var(--c-on-deep-soft)}
.chapter-rail a span{font-family:var(--f-mono);font-weight:700;color:var(--c-accent)}
.chapter-rail a:hover{background:rgba(255,255,255,.06);color:#fff}
@media (min-width:1280px){.chapter-rail{display:block}}
@media (max-width:879px){
.chapter{min-height:auto}
.chapter__media,.chapter--flip .chapter__media{position:relative;inset:auto;width:auto;height:46vh;min-height:280px;margin-bottom:-120px}
.chapter__media::after,.chapter--flip .chapter__media::after{background:linear-gradient(0deg,var(--c-deep) 0%,rgba(14,31,43,0) 60%)}
.chapter--green .chapter__media::after{background:linear-gradient(0deg,#102730 0%,rgba(16,39,48,0) 60%)}
.ph span,.chapter--flip .ph span{transform:translateY(-30%)}
.chapter--flip .chapter__inner{align-items:stretch}
.chapter__inner{padding-block:0 var(--s-20)}
}

/* About page */
.about-hero .hero__grid{padding-bottom:var(--s-10)}
@media (min-width:940px){.about-hero .hero__grid{min-height:min(72vh,640px)}}
.about-hero__intro{margin-top:var(--s-6);display:grid;gap:var(--s-3);max-width:52ch}
.about-hero__intro .lead{color:var(--c-on-deep-soft)}
.offer-strip{position:relative;z-index:2;display:grid;grid-template-columns:1fr;gap:var(--s-px,1px);background:var(--c-deep-line);border:1px solid var(--c-deep-line);border-radius:var(--r-lg);overflow:hidden;margin-bottom:var(--s-16)}
.offer-strip li{display:grid;gap:var(--s-2);align-content:start;padding:var(--s-6);background:rgba(14,31,43,.92);color:var(--c-on-deep-soft);font-size:.95rem;line-height:1.5}
.offer-strip__k{font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-accent)}
@media (min-width:640px){.offer-strip{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.offer-strip{grid-template-columns:repeat(4,1fr)}}
.founder{display:grid;gap:clamp(32px,5vw,72px);align-items:center}
@media (min-width:880px){.founder{grid-template-columns:7fr 5fr}}
.founder__media{position:relative;margin:0;border-radius:var(--r-xl);overflow:hidden;max-width:none}
.founder__media img{width:100%;height:auto;aspect-ratio:auto}
.founder__media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,40,58,.85) 0%,rgba(18,40,58,0) 45%)}
.founder__tag{position:absolute;left:var(--s-5);bottom:var(--s-5);z-index:1;padding:8px 14px;border-radius:var(--r-sm);background:var(--c-accent);color:var(--c-on-primary);font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.founder__copy h2{font-size:var(--t-section)}
.founder__pull{margin:var(--s-6) 0 var(--s-4);padding-left:var(--s-5);border-left:2px solid var(--c-accent);font-family:var(--f-display);font-size:clamp(1.2rem,1.4vw + .8rem,1.55rem);line-height:1.35;color:var(--c-ink)}
.values{display:grid;gap:var(--s-10)}
@media (min-width:880px){.values{grid-template-columns:repeat(3,1fr)}}
.value__n{font-family:var(--f-display);font-weight:700;font-size:1.75rem;color:var(--c-accent);padding-bottom:var(--s-4);margin-bottom:var(--s-5);background:linear-gradient(var(--c-line-strong),var(--c-line-strong)) left bottom/28px 2px no-repeat}
.value h3{font-size:1.3rem;margin-bottom:var(--s-3)}
.value p:last-child{color:var(--c-ink-soft)}
.photo-card{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;background:var(--c-surface);isolation:isolate}
.photo-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 600ms var(--ease)}
.photo-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,.85) 35%,rgba(14,31,43,0) 70%)}
.photo-card:hover img{transform:scale(1.04)}
.photo-card__body{position:absolute;inset:auto 0 0 0;padding:var(--s-6)}
.photo-card__body h3{font-size:var(--t-subhead);color:#fff;margin-bottom:var(--s-2)}
.photo-card__body p{color:var(--c-on-deep-soft);font-size:.95rem}
.stat-row{display:grid;grid-template-columns:1fr;margin-top:var(--s-16);border-top:1px solid var(--c-deep-line)}
.stat-row .stat{padding:var(--s-8) var(--s-4)}
@media (min-width:720px){.stat-row{grid-template-columns:repeat(3,1fr)}.stat-row .stat+.stat{border-left:1px solid var(--c-deep-line)}}

/* Home hero background video */
.hero__video{display:block;width:100%;height:100%;object-fit:cover;border-radius:0;transform:scale(1.36);transform-origin:center 47%}
.hero__media{overflow:hidden}
@media (min-width:940px){.hero__media{width:72%}.hero__media::after{background:linear-gradient(90deg,#0E1F2B 0%,rgba(14,31,43,.5) 16%,rgba(14,31,43,0) 42%),linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 18%),linear-gradient(180deg,rgba(14,31,43,.7) 0%,rgba(14,31,43,0) 10%)}}
@media (max-width:939px){.hero__video{aspect-ratio:4/3.4;height:auto}.hero__media::after{background:linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 30%),linear-gradient(180deg,rgba(14,31,43,.6) 0%,rgba(14,31,43,0) 10%)}}
.hero__copy h1,.hero__copy .lead{text-shadow:0 2px 18px rgba(14,31,43,.85)}

/* Centred layout: section intros and narrow blocks sit on the page axis */
:root{--container:1320px}
.section-head{margin-inline:auto;text-align:center}
.section-head .eyebrow{justify-content:center}
.section-head p{margin-inline:auto}
.faq{margin-inline:auto}
.compare-wrap{max-width:1000px;margin-inline:auto}
.grid--3,.values,.timeline{max-width:1200px;margin-inline:auto}

/* Home hero: full-bleed video, no solid band */
@media (min-width:940px){
.hero .hero__media{left:0;right:0;width:100%}
.hero .hero__media::after{background:linear-gradient(90deg,rgba(14,31,43,.72) 0%,rgba(14,31,43,.5) 40%,rgba(14,31,43,.12) 75%,rgba(14,31,43,0) 100%),linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 16%),linear-gradient(180deg,rgba(14,31,43,.6) 0%,rgba(14,31,43,0) 10%)}
.hero .hero__video{object-position:center 45%}
}

.chapter__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 30%}

.chapter__img--pt{object-position:55% 32%}

/* Services 04: accreditation logos above the title */
.chapter__logos{display:flex;align-items:center;gap:var(--s-6);margin-bottom:var(--s-6)}
.chapter__logos img{width:auto;height:auto}
.chapter__logos-main{max-height:96px}
.chapter__logos img:not(.chapter__logos-main){max-height:40px}

.chapter__img--classes{object-position:58% 40%}

.chapter__img--courses{object-position:62% 50%}
@media (min-width:880px){
#courses .chapter__media{width:70%}
#courses .chapter__media::after{background:linear-gradient(270deg,#102730 0%,rgba(16,39,48,.55) 12%,rgba(16,39,48,0) 30%),linear-gradient(0deg,#102730 0%,rgba(16,39,48,0) 18%),linear-gradient(180deg,#102730 0%,rgba(16,39,48,0) 12%)}
#courses .chapter__inner{text-shadow:0 2px 16px rgba(16,39,48,.9)}
}
@media (max-width:879px){#courses .chapter__img--courses{object-position:58% 45%}}

/* Home: sauna / recovery band */
.recovery{position:relative;isolation:isolate;overflow:hidden;background:var(--c-deep);min-height:clamp(420px,42vw,620px);display:flex;align-items:center}
.recovery__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:-2}
.recovery::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,31,43,.6) 0%,rgba(14,31,43,.35) 30%,rgba(14,31,43,0) 55%),linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 10%),linear-gradient(180deg,#0E1F2B 0%,rgba(14,31,43,0) 8%)}
.recovery__inner h2,.recovery__inner .lead,.recovery__inner .eyebrow{text-shadow:0 2px 16px rgba(14,31,43,.9)}
.recovery__inner{padding-block:var(--s-20)}
.recovery__inner>*{max-width:560px}
.recovery h2{font-size:clamp(2.2rem,4.4vw,3.75rem);text-transform:uppercase;letter-spacing:-.035em;line-height:.95;color:#fff}
.recovery .lead{margin-top:var(--s-5);color:var(--c-on-deep-soft)}
.recovery__steps{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-8)}
.recovery__steps li{display:flex;align-items:center;gap:var(--s-2);padding:10px 16px;border-radius:var(--r-pill);background:rgba(14,31,43,.6);border:1px solid var(--c-deep-line);color:#fff;font-weight:500;backdrop-filter:blur(6px)}
.recovery__steps span{font-family:var(--f-mono);font-weight:700;font-size:.75rem;color:var(--c-accent)}
@media (max-width:719px){.recovery{flex-direction:column;align-items:stretch}.recovery__img{position:relative;height:240px;object-position:55% 50%}.recovery::before{background:linear-gradient(0deg,#0E1F2B 0%,rgba(14,31,43,0) 40%) top/100% 240px no-repeat}.recovery__inner{padding-block:var(--s-6) var(--s-16)}}

.section--accred{padding-bottom:var(--s-4)}
.section--services{padding-top:var(--s-8)}

.founder__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4);margin:var(--s-8) 0 0;padding-top:var(--s-6);border-top:1px solid var(--c-line)}
.founder__stats dt{font-family:var(--f-display);font-weight:700;font-size:1.4rem;line-height:1.1;color:var(--c-accent)}
.founder__stats dd{margin:var(--s-1) 0 0;font-size:.8rem;line-height:1.4;color:var(--c-ink-soft)}
.founder__certs-label{margin-top:var(--s-8);font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted)}
.founder__certs{margin-top:var(--s-3);gap:var(--s-2)}
.founder__certs .chip{font-size:.8rem;padding:6px 12px}
@media (max-width:479px){.founder__stats{grid-template-columns:1fr}}

.founder__award{display:flex;gap:var(--s-4);align-items:flex-start;margin-top:var(--s-8);padding:var(--s-5) var(--s-6);border-radius:var(--r-lg);background:var(--c-accent-wash);border:1px solid var(--c-accent)}
.founder__award svg{width:28px;height:28px;flex:none;color:var(--c-accent)}
.founder__award p{color:var(--c-ink);line-height:1.45}
.founder__award b{color:var(--c-accent);font-weight:600}
.founder__highlights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3) var(--s-5);margin-top:var(--s-6)}
.founder__highlights li{display:flex;gap:var(--s-3);align-items:flex-start;font-family:var(--f-display);font-weight:600;font-size:1.05rem;line-height:1.3;color:var(--c-ink)}
.founder__highlights svg{width:20px;height:20px;flex:none;margin-top:2px;color:var(--c-accent)}
@media (max-width:479px){.founder__highlights{grid-template-columns:1fr}}

.quals{margin-top:var(--s-12)}
.quals .founder__certs-label{display:flex;align-items:center;gap:var(--s-3);font-family:var(--f-display);font-size:clamp(1.4rem,1.2vw + 1rem,1.85rem);font-weight:700;letter-spacing:-.02em;text-transform:none;color:var(--c-ink)}
.quals .founder__certs-label::before{content:"";width:28px;height:3px;border-radius:2px;background:var(--c-accent)}
.quals__grid{display:grid;grid-template-columns:1fr;gap:var(--s-2);margin-top:var(--s-4)}
.quals__grid li{display:flex;align-items:center;padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--c-surface);border:1px solid var(--c-line);font-size:.9rem;line-height:1.4;color:var(--c-ink-soft)}
@media (min-width:640px){.quals__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:940px){.quals__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* About: values with a photo per principle */
.values-band{background:var(--c-deep)}
.value__media{margin:0 0 var(--s-6);border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--c-line);aspect-ratio:4/3;background:var(--c-surface)}
.value__media img{display:block;width:100%;height:100%;object-fit:cover}
.value__media--ph{display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 2px,transparent 2px 14px),linear-gradient(160deg,#21445C,#183247)}
.value__media--ph span{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);padding:8px 14px;border:1px dashed rgba(255,255,255,.3);border-radius:var(--r-sm)}

/* Booking page */
.bk-facts{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-6);margin-top:var(--s-6)}
.bk-facts li{display:flex;gap:var(--s-2);align-items:center;color:var(--c-on-deep-soft);font-size:.95rem}
.bk-facts svg{width:18px;height:18px;color:var(--c-accent)}
.pkgs{display:grid;gap:var(--s-4);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:720px){.pkgs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1100px){.pkgs{grid-template-columns:repeat(5,minmax(0,1fr))}}
.pkg{position:relative;display:flex;flex-direction:column;padding:var(--s-6);border-radius:var(--r-lg);background:var(--c-surface);border:1px solid var(--c-line)}
.pkg--featured{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}
.pkg__flag{position:absolute;top:-11px;left:var(--s-6);padding:4px 10px;border-radius:var(--r-pill);background:var(--c-accent);color:var(--c-on-primary);font-family:var(--f-mono);font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.pkg__name{font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted)}
.pkg__n{display:flex;align-items:baseline;gap:var(--s-2);margin-top:var(--s-3);font-family:var(--f-display);font-weight:700;font-size:3rem;line-height:1;color:var(--c-ink)}
.pkg__n span{font-family:var(--f-body);font-size:.9rem;font-weight:500;color:var(--c-ink-soft)}
.pkg__price{margin-top:var(--s-3);font-family:var(--f-display);font-weight:600;font-size:1.25rem;color:var(--c-accent)}
.pkg__desc{margin:var(--s-2) 0 var(--s-6);font-size:.9rem;color:var(--c-ink-soft)}
.pkg .btn{margin-top:auto}
.bk-note{margin-top:var(--s-6);text-align:center;font-size:var(--t-small);color:var(--c-muted)}
.bk-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-6);padding:var(--s-5) var(--s-6);border-radius:var(--r-lg);background:var(--c-surface);border:1px solid var(--c-line)}
.bk-balance{display:flex;align-items:baseline;gap:var(--s-3)}
.bk-balance__n{font-family:var(--f-display);font-weight:700;font-size:2.4rem;line-height:1;color:var(--c-accent)}
.bk-balance__l{color:var(--c-ink-soft)}
.bk-legend{display:flex;flex-wrap:wrap;gap:var(--s-5);font-size:var(--t-small);color:var(--c-ink-soft)}
.bk-legend span{display:inline-flex;align-items:center;gap:var(--s-2)}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.dot--open{background:var(--c-accent)}.dot--low{background:#E8B54A}.dot--full{background:#E06464}
.bk-days{display:grid;grid-template-columns:repeat(7,minmax(64px,1fr));gap:var(--s-2);overflow-x:auto;margin-bottom:var(--s-6)}
.bk-day{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--s-3) var(--s-2);border-radius:var(--r-md);background:var(--c-surface);border:1px solid var(--c-line);color:var(--c-ink-soft);font-family:var(--f-body);font-size:.75rem;cursor:pointer;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease)}
.bk-day b{font-family:var(--f-display);font-size:1.4rem;color:var(--c-ink)}
.bk-day:hover{border-color:var(--c-line-strong)}
.bk-day.is-on{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-on-primary)}
.bk-day.is-on b{color:var(--c-on-primary)}
.bk-slots{display:grid;gap:var(--s-3)}
.bk-slot{display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,2fr) auto;align-items:center;gap:var(--s-5);padding:var(--s-4) var(--s-6);border-radius:var(--r-lg);background:var(--c-surface);border:1px solid var(--c-line)}
.bk-slot__time b{display:block;font-family:var(--f-display);font-size:1.25rem;color:var(--c-ink)}
.bk-slot__time span{font-size:var(--t-small);color:var(--c-muted)}
.bk-slot__cap{display:flex;align-items:center;gap:var(--s-4)}
.seats{display:flex;gap:6px}
.seat{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--c-line-strong)}
.seat.is-taken{background:var(--c-accent);border-color:var(--c-accent)}
.is-low .seat.is-taken{background:#E8B54A;border-color:#E8B54A}
.is-full .seat.is-taken{background:#E06464;border-color:#E06464}
.bk-slot__lbl{font-size:.9rem;color:var(--c-ink-soft)}
.is-low .bk-slot__lbl{color:#E8B54A}
.is-full .bk-slot__lbl{color:#E06464;font-weight:600}
.bk-slot.is-full,.bk-slot.is-past{opacity:.6}
.bk-slot.is-mine{border-color:var(--c-accent);box-shadow:0 0 0 1px var(--c-accent)}
.is-mine .bk-slot__lbl{color:var(--c-accent);font-weight:600}
.bk-slot__act .btn{padding:12px 22px;min-width:104px}
.bk-x{display:grid;place-items:center;width:44px;height:44px;margin-left:auto;border-radius:50%;background:rgba(224,100,100,.12);color:#E06464}
.is-past .bk-x{background:rgba(255,255,255,.05);color:var(--c-muted)}
.bk-x svg{width:20px;height:20px}
@media (max-width:640px){.bk-slot{grid-template-columns:1fr auto;gap:var(--s-3) var(--s-4)}.bk-slot__cap{grid-column:1/-1;order:3}}
.bk-toast{position:fixed;left:50%;bottom:var(--s-6);z-index:300;transform:translate(-50%,20px);max-width:min(92vw,520px);padding:var(--s-4) var(--s-6);border-radius:var(--r-md);background:var(--c-accent);color:var(--c-on-primary);font-weight:600;box-shadow:var(--shadow-lift);opacity:0;pointer-events:none;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.bk-toast.is-on{opacity:1;transform:translate(-50%,0)}
.bk-toast.is-bad{background:#E06464;color:#fff}
.bk-mine{margin-top:var(--s-10);padding:var(--s-6);border-radius:var(--r-lg);border:1px dashed var(--c-line-strong)}
.bk-mine h3{font-size:1.2rem;margin-bottom:var(--s-4)}
.bk-mine ul{display:grid;gap:var(--s-2)}
.bk-mine li{display:flex;justify-content:space-between;gap:var(--s-4);padding:var(--s-2) 0;border-bottom:1px solid var(--c-line);color:var(--c-ink-soft)}
.bk-mine li:last-child{border-bottom:0}
.bk-mine b{color:var(--c-ink)}
.bk-mine .text-link{background:none;border:0;padding:0;font:inherit;font-weight:600;cursor:pointer}

.bk-facts--big{gap:var(--s-3);margin-top:var(--s-8)}
.bk-facts--big li{padding:var(--s-3) var(--s-5);border-radius:var(--r-pill);background:rgba(136,193,74,.12);border:1px solid rgba(136,193,74,.35);color:#fff;font-family:var(--f-display);font-weight:600;font-size:clamp(1rem,.6vw + .85rem,1.2rem)}
.bk-facts--big svg{width:20px;height:20px}

.bk-account-wrap{padding-top:var(--s-10)}
.bk-account{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-5) var(--s-8);padding:var(--s-5) var(--s-6);border-radius:var(--r-lg);background:var(--c-surface);border:1px solid var(--c-line)}
.bk-account__who{display:flex;align-items:center;gap:var(--s-4);flex:1 1 320px;min-width:0}
.bk-account__who b{display:block;color:var(--c-ink);font-size:1.05rem}
.bk-account__who span{display:block;color:var(--c-ink-soft);font-size:.9rem}
.bk-avatar{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--c-accent);color:var(--c-on-primary)!important;font-family:var(--f-display);font-weight:700;font-size:1.2rem}
.bk-avatar--empty{background:rgba(255,255,255,.06);color:var(--c-ink-soft)!important;border:1px solid var(--c-line)}
.bk-avatar svg{width:22px;height:22px}
.bk-account__stat{display:flex;align-items:baseline;gap:var(--s-2)}
.bk-account__stat b{font-family:var(--f-display);font-size:1.8rem;line-height:1;color:var(--c-accent)}
.bk-account__stat span{color:var(--c-ink-soft);font-size:.9rem}
.bk-account__btns{display:flex;gap:var(--s-3);flex-wrap:wrap}
.bk-dialog{width:min(92vw,440px);padding:0;border:1px solid var(--c-line);border-radius:var(--r-xl);background:var(--c-surface);color:var(--c-ink);box-shadow:var(--shadow-lift)}
.bk-dialog::backdrop{background:rgba(8,18,26,.7);backdrop-filter:blur(4px)}
.bk-auth{position:relative;display:grid;gap:var(--s-4);padding:var(--s-8)}
.bk-auth h2{font-size:1.6rem}
.bk-auth__sub{color:var(--c-ink-soft);margin-top:calc(var(--s-3) * -1)}
.bk-auth__tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--r-pill);background:var(--c-page);border:1px solid var(--c-line);margin-right:var(--s-10)}
.bk-auth__tabs button{padding:10px;border:0;border-radius:var(--r-pill);background:none;color:var(--c-ink-soft);font:inherit;font-weight:600;font-size:.9rem;cursor:pointer}
.bk-auth__tabs button.is-on{background:var(--c-accent);color:var(--c-on-primary)}
.bk-dialog__close{position:absolute;top:var(--s-6);right:var(--s-6);width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--c-line);border-radius:50%;background:none;color:var(--c-ink-soft);cursor:pointer}
.bk-dialog__close svg{width:18px;height:18px}
.bk-dialog__close:hover{color:var(--c-ink);border-color:var(--c-line-strong)}

.pkg__per{margin-top:var(--s-1);font-size:.85rem;font-weight:600;color:var(--c-ink)}
.bk-lock{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border-radius:var(--r-pill);border:1px solid var(--c-line-strong);color:var(--c-ink-soft);font-size:.85rem;font-weight:600}
.bk-lock svg{width:16px;height:16px}
.bk-mine__lock{font-size:.85rem;color:var(--c-muted)}

/* Typeface: Barlow Condensed (display + labels) / Barlow (body) */
:root{--f-display:"Barlow Condensed","Arial Narrow",sans-serif;--f-body:"Barlow",system-ui,sans-serif;--f-mono:"Barlow Condensed","Arial Narrow",sans-serif}
body{font-family:var(--f-body);letter-spacing:.005em}
h1,h2,h3,h4,h5{font-family:var(--f-display);letter-spacing:-.005em;font-weight:700}
.hero h1,.page-hero h1,.cta-band h2,.chapter__title,.recovery h2{letter-spacing:-.01em;line-height:.9;font-weight:800}
.hero h1{font-size:clamp(3rem,6vw,5.25rem)}
.chapter__title{font-size:clamp(3rem,6.6vw,5.75rem)}
.section-head h2,.split h2,.founder__copy h2{font-size:clamp(2.1rem,3.4vw + 1rem,3.1rem);text-transform:uppercase;line-height:.95}
.eyebrow,.chapter__num,.chapter__tag,.svc__badge,.pkg__name,.pkg__flag,.founder__certs-label,.founder__tag,.offer-strip__k,.bk-legend,.chapter__next,.ph span,.value__media--ph span{font-family:var(--f-mono);font-weight:700;letter-spacing:.14em}
.eyebrow{font-size:.85rem}
.chapter__num{font-size:1.15rem}
.stat .n,.tl-step__num,.value__n,.pkg__n,.bk-balance__n,.bk-account__stat b,.founder__stats dt,.bk-slot__time b,.bk-day b{font-family:var(--f-display);font-weight:800;letter-spacing:0}
.btn{font-family:var(--f-display);font-weight:700;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase}
.main-nav a{font-family:var(--f-display);font-weight:600;font-size:1.02rem;letter-spacing:.05em;text-transform:uppercase}
.founder__pull{font-family:var(--f-display);font-weight:600;font-size:clamp(1.4rem,1.6vw + .9rem,1.9rem);line-height:1.15}
.founder__highlights li,.feature h3,.card__body h3,.value h3,.tl-step h3,.faq summary{font-family:var(--f-display);font-weight:700;letter-spacing:.01em}
.feature h3,.value h3,.tl-step h3{font-size:1.5rem}

.bk-google{gap:var(--s-3);text-transform:none;letter-spacing:.01em}
.bk-google svg{width:20px;height:20px}
.bk-auth__or{display:flex;align-items:center;gap:var(--s-3);color:var(--c-muted);font-size:var(--t-small)}
.bk-auth__or::before,.bk-auth__or::after{content:"";flex:1;height:1px;background:var(--c-line)}
.bk-forgot{justify-self:start;margin-top:calc(var(--s-2) * -1);padding:0;border:0;background:none;color:var(--c-primary);font:inherit;font-size:var(--t-small);font-weight:600;cursor:pointer}
.bk-forgot:hover{text-decoration:underline}
.bk-auth__err{padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:rgba(224,100,100,.12);border:1px solid rgba(224,100,100,.4);color:#F3A3A3;font-size:var(--t-small)}
.bk-auth button:disabled{opacity:.6;cursor:wait}

.mt-0 { margin-top: 0; }
.center { text-align: center; }
.measure { max-width: 60ch; }
.mx-auto { margin-inline: auto; }

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}