/*!
  Template:  Pulsora | Gym & Fitness Club HTML Template
  Version:   1.0.0
  Author:    MOONSHOTS
  Website:   https://m00nshots.dev
  Contact:   build@m00nshots.dev
  Copyright: (c) 2026 m00nshots. All rights reserved.
*/
/* ==========================================================================
   PULSORA THEME — Gym & Fitness Club
   Design language: aggressive, athletic, dark-first. Jet black, volt yellow,
   signal red and steel grey. Zero / 2px radii, parallelogram buttons,
   diagonal clip-path section edges, racing stripes, huge outlined Anton type.
   --------------------------------------------------------------------------
   01. Tokens (light + dark)        09. Timetable & countdown
   02. Base & typography            10. BMI / calorie calculator
   03. Buttons, labels, stripes     11. Memberships & comparison
   04. Header, drawer               12. Trainers, transformations, quotes
   05. Sections: skew, dark, bands  13. WOD board & PR leaderboard
   06. Core component restyles      14. Home heroes (1–4)
   07. Stats, features, steps       15. Inner pages, map, gallery
   08. Programme tiles              16. CTA, footer, 404
   ========================================================================== */

/* 01. Tokens ------------------------------------------------------------- */
:root {
  --volt: #e6ff00; --red: #ff3b30; --jet: #0b0b0c; --steel: #1c1d20; --paper: #f2f2ee;
  --bg: #f2f2ee; --bg-2: #e6e6df; --surface: #ffffff; --surface-2: #e2e2da;
  --text: #0b0b0c; --muted: #55565b; --line: rgba(11, 11, 12, .14);
  --primary: #e6ff00; --primary-2: #e6ff00; --on-primary: #0b0b0c; --accent: #ff3b30;
  --ink: #0b0b0c;               /* text accent colour (volt in dark, black in light) */
  --stroke: #0b0b0c;            /* outlined type colour */
  --em-color: #0b0b0c; --em-bg: linear-gradient(transparent 60%, #e6ff00 60%, #e6ff00 90%, transparent 90%);
  --c-hiit: #ff3b30; --c-strength: #c9e000; --c-cycle: #ff9f0a; --c-yoga: #27c2cc;
  --font-head: "Anton", "Barlow", Impact, sans-serif;
  --font-body: "Barlow", system-ui, sans-serif;
  --font-logo: "Russo One", "Anton", sans-serif; --logo-weight: 400; --logo-size: 1.3rem; --logo-tracking: .04em; --logo-case: uppercase;
  --head-weight: 400; --head-tracking: .005em;
  --radius-sm: 0; --radius: 2px; --radius-lg: 2px; --radius-btn: 0;
  --header-h: 72px;
  --sk: clamp(28px, 4.5vw, 72px);
  --cut: 22px;
  --gradient: linear-gradient(90deg, #e6ff00, #e6ff00);
  --shadow: 0 24px 50px -28px rgba(11, 11, 12, .45); --shadow-lg: 0 40px 80px -36px rgba(11, 11, 12, .55);
}
[data-theme="dark"] {
  --bg: #0b0b0c; --bg-2: #141416; --surface: #1c1d20; --surface-2: #26272b;
  --text: #f2f2ee; --muted: #a3a49f; --line: rgba(242, 242, 238, .13);
  --ink: #e6ff00; --stroke: #f2f2ee;
  --em-color: #e6ff00; --em-bg: none;
  --c-strength: #e6ff00; --c-yoga: #5ce1e6;
  --shadow: 0 24px 50px -24px rgba(0, 0, 0, .9); --shadow-lg: 0 40px 80px -30px rgba(0, 0, 0, .95);
}
/* Forced-dark surfaces (heroes, page headers, stat bands, footer) */
.pl-dark, .pl-hero, .pl-hero2, .pl-hero3, .pl-ph, .pl-statband, .pl-foot, .pl-cta, .calc__out, .wod, .pl-next {
  --bg: #0b0b0c; --bg-2: #141416; --surface: #1c1d20; --surface-2: #2a2b30;
  --text: #f2f2ee; --muted: #a3a49f; --line: rgba(242, 242, 238, .14);
  --ink: #e6ff00; --stroke: #f2f2ee; --em-color: #e6ff00; --em-bg: none;
  --c-strength: #e6ff00; --c-yoga: #5ce1e6;
  color: var(--text);
}

/* 02. Base & typography -------------------------------------------------- */
body { font-size: 17px; line-height: 1.6; }
h1, h2, h3 { text-transform: uppercase; line-height: .96; color: var(--text); }
h4 { font-family: var(--font-body); font-weight: 700; text-transform: uppercase; letter-spacing: .12em; font-size: .85rem; }
h1 em, h2 em, h3 em, .pl-cta__title em {
  font-style: normal; color: var(--em-color); background: var(--em-bg); padding-inline: .04em;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.h2 { font-size: clamp(2.3rem, 5.4vw, 4.6rem); letter-spacing: .005em; }
.h3 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); }
.lead { font-size: clamp(1.05rem, 1.4vw, 1.2rem); color: var(--muted); font-weight: 500; }
:focus-visible { outline: 3px solid var(--volt); outline-offset: 3px; border-radius: 0; }
[data-theme="light"] :focus-visible, :root:not([data-theme="dark"]) :focus-visible { outline-color: var(--red); }
::selection { background: var(--volt); color: var(--jet); }
.eyebrow {
  font-family: var(--font-body); font-weight: 800; font-size: .78rem; letter-spacing: .22em; color: var(--ink); margin-bottom: 20px;
}
.eyebrow::before { width: 26px; height: 8px; border-radius: 0; background: var(--red); transform: skewX(-24deg); }
.section-head { margin-bottom: clamp(36px, 5vw, 64px); }
.section-head--row > div:last-child { flex: none; }
.muted { color: var(--muted); }
.stars { color: var(--volt); }

/* 03. Buttons, labels, stripes ------------------------------------------ */
/* Parallelogram buttons: a skewed ::before draws the shape (so borders stay
   crisp on the slanted edges) and a skewed ::after wipes in on hover. */
.btn {
  --btn-bg: var(--volt); --btn-fg: var(--jet); --btn-bd: transparent; --btn-hover: #ffffff; --btn-hover-fg: var(--jet);
  background: none; border: 0; border-radius: 0; overflow: visible; isolation: isolate;
  padding: 14px 32px; min-height: 52px; font-family: var(--font-body); font-weight: 800; font-size: .88rem;
  letter-spacing: .12em; text-transform: uppercase; margin-inline: 8px;
}
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -2; background: var(--btn-bg); border: 2px solid var(--btn-bd);
  transform: skewX(-14deg); transition: background .3s, border-color .3s;
}
.btn::after { inset: 0; z-index: -1; background: var(--btn-hover); transform: skewX(-14deg) scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.btn:hover::after { transform: skewX(-14deg) scaleX(1); }
.btn:hover { box-shadow: none; color: var(--btn-hover-fg); }
.btn--gradient, .btn--light { background: none; }
.btn--light { --btn-bg: var(--volt); --btn-fg: var(--jet); }
.btn--dark { --btn-bg: var(--jet); --btn-fg: var(--volt); --btn-hover: var(--volt); }
.btn--ghost { --btn-bg: transparent; --btn-fg: var(--text); --btn-bd: color-mix(in srgb, var(--text) 45%, transparent); --btn-hover: var(--volt); --btn-hover-fg: var(--jet); border: 0; }
.btn--ghost::after { background: var(--volt); }
.btn--sm { min-height: 42px; padding: 10px 22px; font-size: .78rem; }
.btn--lg { min-height: 58px; padding: 18px 36px; font-size: .92rem; }
.btn-group { gap: 14px 18px; margin-inline: -8px; }
.btn.w-full { width: calc(100% - 16px); }
.pl-label {
  display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink);
}
.pl-label::before { content: ""; width: 12px; height: 12px; background: var(--red); transform: skewX(-20deg); flex: none; }
.pl-label--volt, .pl-label--red { padding: 7px 18px; clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%); }
.pl-label--volt { background: var(--volt); color: var(--jet); }
.pl-label--red { background: var(--red); color: #fff; }
.pl-label--volt::before { background: var(--jet); width: 8px; height: 8px; }
.pl-label--red::before { background: #fff; width: 8px; height: 8px; }
.pl-stripes { display: grid; gap: 4px; padding-block: 0; }
.pl-stripes i { display: block; height: 6px; background: var(--volt); clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%); }
.pl-stripes i:nth-child(2) { height: 3px; width: 72%; background: var(--red); }
.pl-stripes i:nth-child(3) { height: 2px; width: 44%; background: var(--text); opacity: .6; }
.pl-live { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--red); }
.pl-live i { width: 8px; height: 8px; background: var(--red); animation: pl-blink 1.2s steps(2) infinite; }
@keyframes pl-blink { 50% { opacity: .2; } }
.pl-checks li { display: flex; gap: 14px; align-items: flex-start; padding: 9px 0; font-weight: 500; }
.pl-checks .ti { flex: none; display: grid; place-items: center; width: 24px; height: 24px; background: var(--volt); color: var(--jet); font-size: .85rem; margin-top: 1px; clip-path: polygon(4px 0, 100% 0, calc(100% - 4px) 100%, 0 100%); }
.pl-checks { margin-bottom: 32px; }

/* 04. Header & drawer ---------------------------------------------------- */
.site-header {
  --text: #f2f2ee; --line: rgba(242, 242, 238, .16); --muted: #a3a49f;
  background: var(--jet); color: var(--text); border-bottom: 1px solid rgba(242, 242, 238, .08);
}
.site-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 4px; pointer-events: none;
  background: linear-gradient(90deg, var(--volt) 0 38%, transparent 38% 39%, var(--red) 39% 46%, transparent 46%);
}
.site-header.is-scrolled { background: var(--jet); backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .8); height: 64px; }
.site-header .container, .site-header .nav, .nav__actions { height: 100%; }
.logo { color: var(--text); }
.logo__mark { width: 40px; height: 34px; border-radius: 0; background: var(--volt); color: var(--jet); clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); font-size: 1.25rem; }
.nav__link { font-weight: 700; font-size: .84rem; letter-spacing: .12em; text-transform: uppercase; border-radius: 0; padding: 10px 13px; position: relative; }
.nav__link:hover, .nav__link.is-active { color: var(--volt); }
.nav__link.is-active::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: 2px; height: 3px; background: var(--volt); transform: skewX(-30deg); }
.dropdown { border-radius: 0; background: var(--steel); color: #f2f2ee; border: 0; border-top: 3px solid var(--volt); padding: 8px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .8); }
.dropdown a { border-radius: 0; font-weight: 600; }
.dropdown a:hover { background: var(--volt); color: var(--jet); }
.icon-btn { border-radius: 0; border-color: var(--line); }
.icon-btn:hover { background: rgba(242, 242, 238, .08); }
.pl-hdr-cta.btn { height: 100%; min-height: 0; margin: 0 0 0 10px; padding: 0 30px; font-size: .84rem; }
.pl-hdr-cta.btn::before { transform: skewX(-18deg); }
.pl-hdr-cta.btn::after { transform: skewX(-18deg) scaleX(0); background: #fff; }
.pl-hdr-cta.btn:hover::after { transform: skewX(-18deg) scaleX(1); }
@media (min-width: 1280px) { .pl-hdr-cta.btn { padding: 0 40px; } }
.drawer__panel { background: var(--jet); color: #f2f2ee; --text: #f2f2ee; --line: rgba(242, 242, 238, .14); --muted: #a3a49f; border-left: 4px solid var(--volt); }
.drawer__nav a { font-family: var(--font-head); text-transform: uppercase; font-size: 1.5rem; letter-spacing: .02em; font-weight: 400; }
.drawer__nav a:hover { color: var(--volt); }
.drawer__nav .sub { font-family: var(--font-body); font-size: 1rem; text-transform: none; }
.drawer__panel > .btn { margin-inline: 8px; }

/* 05. Sections: skew, dark, bands --------------------------------------- */
.section { padding-block: clamp(72px, 9vw, 130px); }
.pl-alt { background: var(--bg-2); }
.pl-dark { background: var(--jet); }
[data-theme="dark"] .pl-dark { background: #121214; }
[data-theme="dark"] .pl-dark { background-image: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .018) 0 2px, transparent 2px 14px); }
.pl-skew { clip-path: polygon(0 var(--sk), 100% 0, 100% calc(100% - var(--sk)), 0 100%); padding-block: calc(clamp(72px, 9vw, 130px) + var(--sk) * .6); margin-block: calc(var(--sk) * -.35); }
.pl-skew--soft { --sk: clamp(16px, 2.2vw, 36px); }
.pl-line { border-block: 1px solid var(--line); }
.pl-band-wrap { overflow: hidden; padding-block: 26px; position: relative; z-index: 2; }
.pl-band { background: var(--volt); color: var(--jet); transform: rotate(-2deg); width: 106%; margin-left: -3%; padding-block: 14px; border-block: 3px solid var(--jet); }
.pl-band .marquee { -webkit-mask-image: none; mask-image: none; }
.pl-band .marquee__track { gap: 34px; padding-right: 34px; }
.pl-band span { font-family: var(--font-head); font-size: clamp(1.8rem, 3.6vw, 3rem); text-transform: uppercase; line-height: 1; white-space: nowrap; }
.pl-band span:nth-child(4n+3) { color: transparent; -webkit-text-stroke: 1.5px var(--jet); }
.pl-band__dot { width: 18px; height: 18px; background: var(--jet); transform: skewX(-20deg); flex: none; }
.pl-band--red { background: var(--red); color: #fff; transform: rotate(2deg); }
.pl-band--red span:nth-child(4n+3) { -webkit-text-stroke-color: #fff; }
.pl-band--red .pl-band__dot { background: #fff; }

/* 06. Core component restyles ------------------------------------------ */
.accordion { border-top: 2px solid var(--text); }
.accordion__btn { font-family: var(--font-body); font-weight: 700; font-size: clamp(1.05rem, 1.5vw, 1.2rem); letter-spacing: 0; }
.accordion__icon { border-radius: 0; border: 2px solid var(--line); clip-path: none; }
.accordion__item.is-open .accordion__icon { background: var(--volt); color: var(--jet); border-color: var(--volt); }
.billing-toggle { border-radius: 0; background: transparent; border: 0; padding: 0; gap: 10px; }
.billing-toggle button {
  border-radius: 0; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: .8rem; padding: 12px 26px;
  background: var(--surface-2); color: var(--text); clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
}
.billing-toggle button.is-active { background: var(--volt); color: var(--jet); box-shadow: none; }
.billing-toggle small { color: var(--red); font-weight: 800; margin-left: 4px; }
.billing-toggle button.is-active small { color: var(--jet); }
.pl-billing-wrap { text-align: center; }
.tabs__btn { border-radius: 0; border: 0; background: var(--surface-2); clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: .8rem; padding: 12px 24px; }
.tabs__btn.is-active, .tabs__btn:hover { background: var(--volt); color: var(--jet); border: 0; }
.input, .select, .textarea { border-radius: 0; border: 2px solid var(--line); background: var(--surface); min-height: 54px; }
.input:focus, .select:focus, .textarea:focus { border-color: var(--volt); box-shadow: 0 0 0 3px color-mix(in srgb, var(--volt) 30%, transparent); }
.field label { text-transform: uppercase; letter-spacing: .12em; font-size: .76rem; font-weight: 800; }
.form.card { border-radius: 0; border: 0; border-top: 6px solid var(--volt); background: var(--surface); }
.form-success { border-radius: 0; background: var(--volt); color: var(--jet); }
.form-note { font-size: .85rem; }
.contact-list .icon-box { width: 50px; height: 50px; border-radius: 0; background: var(--volt); color: var(--jet); clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
.contact-list strong { text-transform: uppercase; letter-spacing: .1em; font-size: .82rem; }
.newsletter { border-radius: 0; border: 2px solid var(--line); background: var(--surface); padding: 5px; }
.newsletter .btn { margin: 0 6px 0 8px; }
.breadcrumb { font-weight: 700; text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; }
.breadcrumb [aria-current] { color: var(--volt); }
.avatars img { border-radius: 0; border-color: var(--jet); }
.to-top { border-radius: 0; background: var(--volt); color: var(--jet); clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.preloader { background: var(--jet); }
.preloader__bar { border-radius: 0; height: 6px; transform: skewX(-20deg); background: rgba(255, 255, 255, .12); }
.cursor { border-radius: 0; background: var(--volt); }
.cursor.is-hover { background: var(--volt); mix-blend-mode: difference; }
.marquee { -webkit-mask-image: none; mask-image: none; }

/* 07. Stats, features, steps ------------------------------------------- */
.pl-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px 20px; }
@media (min-width: 1024px) { .pl-stats { grid-template-columns: repeat(4, 1fr); } }
.pl-stats--3 { grid-template-columns: repeat(3, 1fr); margin-top: 16px; }
.pl-stats--2 { grid-template-columns: repeat(2, 1fr) !important; margin-top: 16px; }
.pl-stat { position: relative; padding-left: 18px; border-left: 3px solid var(--red); min-width: 0; }
.pl-stat__num {
  font-family: var(--font-head); font-size: clamp(2.3rem, 4.8vw, 4.6rem); line-height: .95; color: transparent;
  -webkit-text-stroke: 1.6px var(--stroke); transition: color .35s; white-space: nowrap;
}
.pl-stats--3 .pl-stat__num, .pl-stats--2 .pl-stat__num { font-size: clamp(2.2rem, 4.4vw, 3.8rem); }
.pl-stat:hover .pl-stat__num { color: var(--ink); -webkit-text-stroke-color: var(--ink); }
.pl-stat__label { margin-top: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; font-size: .76rem; color: var(--muted); }
.pl-statband { background: var(--jet); padding-bottom: clamp(56px, 7vw, 96px); }
.pl-statband .pl-stats { padding-top: clamp(48px, 6vw, 80px); }
.pl-statband .pl-stat__num { -webkit-text-stroke-color: var(--volt); }
.pl-feats { display: grid; gap: 2px; grid-template-columns: 1fr; background: var(--line); border: 2px solid var(--line); }
@media (min-width: 640px) { .pl-feats { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pl-feats { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1280px) { .pl-feats--4 { grid-template-columns: repeat(4, 1fr); } }
.pl-feat { padding: clamp(26px, 3vw, 40px); background: var(--bg); position: relative; transition: background .35s; min-width: 0; }
.pl-dark .pl-feat { background: var(--surface); }
.pl-feat::after { content: ""; position: absolute; left: 0; bottom: 0; height: 4px; width: 0; background: var(--volt); transition: width .5s var(--ease); }
.pl-feat:hover::after { width: 100%; }
.pl-feat__ic { display: grid; place-items: center; width: 58px; height: 50px; background: var(--volt); color: var(--jet); font-size: 1.6rem; clip-path: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%); }
.pl-feat h3 { font-size: 1.7rem; margin: 26px 0 10px; }
.pl-feat p { color: var(--muted); margin: 0; }
.pl-feats--soft { gap: 0; background: none; border: 0; }
.pl-feats--soft .pl-feat { background: transparent; border-top: 2px solid var(--text); }
.pl-steps { display: grid; gap: 20px; grid-template-columns: 1fr; counter-reset: s; }
@media (min-width: 640px) { .pl-steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1280px) { .pl-steps { grid-template-columns: repeat(4, 1fr); } }
.pl-step { position: relative; padding: 30px 26px 30px; background: var(--surface); border-top: 4px solid var(--volt); min-width: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%); }
.pl-step__n { display: block; font-family: var(--font-head); font-size: 4.4rem; line-height: .9; color: transparent; -webkit-text-stroke: 1.5px var(--stroke); margin-bottom: 18px; }
.pl-step > .ti { position: absolute; top: 30px; right: 26px; font-size: 1.8rem; color: var(--ink); }
.pl-step h3 { font-size: 1.6rem; margin-bottom: 10px; }
.pl-step p { margin: 0; color: var(--muted); }

/* 08. Programme tiles --------------------------------------------------- */
.pl-progs { display: grid; gap: 18px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pl-progs { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .pl-progs { grid-template-columns: repeat(4, 1fr); } .pl-prog:nth-child(even) { margin-top: 48px; } }
.pl-prog {
  position: relative; display: block; min-height: 440px; overflow: hidden; color: #f2f2ee; background: var(--jet); min-width: 0;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 34px), calc(100% - 34px) 100%, 0 100%);
}
.pl-prog__img { position: absolute; inset: 0; }
.pl-prog__img img { width: 100%; height: 100%; filter: grayscale(1) contrast(1.1); transition: transform 1s var(--ease), filter .6s; }
.pl-prog::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(11, 11, 12, .1) 20%, rgba(11, 11, 12, .92) 88%); }
.pl-prog:hover .pl-prog__img img { transform: scale(1.06); filter: none; }
.pl-prog__no { position: absolute; top: 18px; left: 20px; z-index: 2; font-family: var(--font-head); font-size: 3.6rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px var(--volt); }
.pl-prog__body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 26px 24px 30px; }
.pl-prog__ic { display: inline-grid; place-items: center; width: 44px; height: 38px; background: var(--volt); color: var(--jet); font-size: 1.3rem; clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.pl-prog h3 { font-size: 2.2rem; margin: 16px 0 8px; color: #f2f2ee; }
.pl-prog p { color: rgba(242, 242, 238, .78); margin: 0 0 14px; font-size: .98rem; }
.pl-prog__go { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--volt); }
.pl-prog__go .ti { transition: transform .35s var(--ease); }
.pl-prog:hover .pl-prog__go .ti { transform: translate(3px, -3px); }

/* 09. Timetable & countdown -------------------------------------------- */
.tt { min-width: 0; }
.tt__days { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; margin-bottom: 18px; }
.tt__days::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .tt__days { display: grid; grid-template-columns: repeat(7, 1fr); overflow: visible; } }
.tt__day {
  flex: 0 0 auto; min-width: 84px; padding: 14px 14px 12px; text-align: left; background: var(--surface); border-bottom: 4px solid transparent;
  transition: background .3s, color .3s, border-color .3s;
}
.tt__day b { display: block; font-family: var(--font-head); font-size: 1.7rem; font-weight: 400; text-transform: uppercase; line-height: 1; }
.tt__day small { display: block; margin-top: 6px; font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.tt__day:hover { border-bottom-color: var(--red); }
.tt__day.is-active { background: var(--volt); color: var(--jet); border-bottom-color: var(--jet); }
.tt__day.is-active small { color: rgba(11, 11, 12, .7); }
.tt__day.is-today b::after { content: "•"; color: var(--red); margin-left: 6px; }
.tt__bar-top { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.tt__filters { display: flex; flex-wrap: wrap; gap: 8px; }
.tt__cat-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; font-weight: 800; font-size: .76rem; letter-spacing: .12em; text-transform: uppercase;
  background: var(--surface-2); clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); transition: background .3s, color .3s;
}
.tt__cat-btn:hover { background: color-mix(in srgb, var(--volt) 40%, var(--surface-2)); }
.tt__cat-btn.is-active { background: var(--jet); color: var(--volt); }
[data-theme="dark"] .tt__cat-btn.is-active { background: var(--volt); color: var(--jet); }
.tt__legend { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 600; color: var(--muted); }
.tt__legend i { width: 14px; height: 6px; background: var(--c-strength); margin-left: 6px; }
.tt__legend i.ok { background: var(--volt); } .tt__legend i.low { background: var(--red); } .tt__legend i.full { background: var(--muted); }
.tt__list { display: grid; gap: 8px; }
.tt__row {
  display: grid; grid-template-columns: 72px 1fr; gap: 12px 16px; align-items: center; padding: 16px 16px 16px 18px;
  background: var(--surface); border-left: 5px solid var(--cat, var(--volt)); position: relative; transition: transform .35s var(--ease), background .3s;
}
.tt__row[hidden] { display: none; }
.tt__row:hover { transform: translateX(6px); }
.tt__row[data-cat="hiit"] { --cat: var(--c-hiit); } .tt__row[data-cat="strength"] { --cat: var(--c-strength); }
.tt__row[data-cat="cycle"] { --cat: var(--c-cycle); } .tt__row[data-cat="yoga"] { --cat: var(--c-yoga); }
.tt__row[data-cat="vinyasa"] { --cat: var(--c-strength); } .tt__row[data-cat="pilates"] { --cat: var(--c-yoga); }
.tt__row[data-cat="yin"] { --cat: #8f7cff; } .tt__row[data-cat="breath"] { --cat: var(--c-cycle); }
.tt__time b { display: block; font-family: var(--font-head); font-size: 1.7rem; font-weight: 400; line-height: 1; }
.tt__time small { display: block; margin-top: 4px; font-size: .78rem; color: var(--muted); font-weight: 600; }
.tt__name { min-width: 0; }
.tt__name h3 { font-size: 1.5rem; margin: 6px 0 2px; }
.tt__name small { color: var(--muted); font-size: .9rem; }
.tt__tag { display: inline-flex; align-items: center; gap: 5px; font-weight: 800; font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; padding: 3px 9px; background: color-mix(in srgb, var(--cat) 22%, transparent); color: var(--text); }
.tt__tag .ti { color: var(--text); }
.tt__spots { grid-column: 1 / -1; min-width: 0; }
.tt__bar { display: block; height: 8px; background: var(--surface-2); overflow: hidden; transform: skewX(-20deg); }
.tt__bar i { display: block; height: 100%; background: var(--volt); }
[data-theme="light"] .tt__bar i, :root:not([data-theme="dark"]) .tt__bar i { background: var(--jet); }
.tt__row[data-state="low"] .tt__bar i { background: var(--red); }
.tt__row[data-state="full"] .tt__bar i { background: repeating-linear-gradient(-45deg, var(--muted) 0 4px, transparent 4px 8px); }
.tt__spots small { display: block; margin-top: 6px; font-size: .82rem; color: var(--muted); font-weight: 600; }
.tt__spots small b { color: var(--text); }
.tt__row[data-state="low"] .tt__spots small b { color: var(--red); }
.tt__book {
  grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; font-weight: 800; font-size: .76rem;
  letter-spacing: .14em; text-transform: uppercase; background: var(--volt); color: var(--jet); clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); transition: background .3s;
}
.tt__book:hover { background: var(--text); color: var(--bg); }
.tt__row[data-state="full"] .tt__book { background: var(--surface-2); color: var(--text); }
@media (min-width: 768px) {
  .tt__row { grid-template-columns: 90px minmax(0, 1.5fr) minmax(0, 1fr) auto; padding: 18px 22px; }
  .tt__spots, .tt__book { grid-column: auto; }
  .tt__book { justify-self: end; }
}
.tt__empty { display: flex; align-items: center; gap: 10px; padding: 26px; background: var(--surface); font-weight: 600; color: var(--muted); }
.tt__empty[hidden] { display: none; }
.pl-next { position: relative; background: var(--steel); padding: 26px 26px 24px; border-top: 5px solid var(--volt); clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%); min-width: 0; }
.pl-next__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.pl-next__clock { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pl-next__clock div { background: var(--jet); padding: 12px 8px 10px; text-align: center; }
.pl-next__clock b { display: block; font-family: var(--font-head); font-size: clamp(2.4rem, 5vw, 3.4rem); font-weight: 400; line-height: 1; color: var(--volt); font-variant-numeric: tabular-nums; }
.pl-next__clock small { display: block; margin-top: 4px; font-size: .7rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.pl-next__what { margin: 18px 0 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; align-items: baseline; }
.pl-next__what strong { font-family: var(--font-head); font-weight: 400; font-size: 1.6rem; text-transform: uppercase; }
.pl-next__what span { color: var(--muted); font-size: .9rem; font-weight: 600; }
.pl-next--inline { margin-top: 8px; max-width: 460px; }
.section-head--row .pl-next--inline { margin-top: 0; min-width: min(100%, 380px); }
.pl-tt-top { display: grid; gap: 32px; margin-bottom: 36px; align-items: end; }
.pl-tt-top .section-head { margin-bottom: 0; }
@media (min-width: 1024px) { .pl-tt-top { grid-template-columns: minmax(0, 420px) 1fr; } .pl-tt-top > :first-child { order: 2; } }

/* 10. BMI / calorie calculator ----------------------------------------- */
.calc { display: grid; min-width: 0; background: var(--surface); border-top: 6px solid var(--volt); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), calc(100% - 30px) 100%, 0 100%); }
.calc__form { display: grid; gap: 20px; padding: clamp(22px, 3vw, 34px); }
.calc__sex, .calc__goal { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.calc__goal { grid-template-columns: repeat(3, 1fr); }
.calc__sex label, .calc__goal label { position: relative; cursor: pointer; }
.calc__sex input, .calc__goal input { position: absolute; opacity: 0; pointer-events: none; }
.calc__sex span, .calc__goal span {
  display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 46px; padding: 8px 10px; text-align: center; line-height: 1.15;
  font-weight: 800; font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; background: var(--surface-2); transition: background .3s, color .3s;
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
}
.calc__sex input:checked + span, .calc__goal input:checked + span { background: var(--jet); color: var(--volt); }
[data-theme="dark"] .calc__sex input:checked + span, [data-theme="dark"] .calc__goal input:checked + span { background: var(--volt); color: var(--jet); }
.calc__sex input:focus-visible + span, .calc__goal input:focus-visible + span { outline: 3px solid var(--red); outline-offset: 2px; }
.calc__field label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 10px; font-weight: 800; font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; }
.calc__field output { font-family: var(--font-head); font-size: 1.5rem; letter-spacing: .02em; font-weight: 400; text-transform: none; }
.calc input[type="range"] {
  -webkit-appearance: none; appearance: none; width: 100%; height: 10px; margin: 0; cursor: pointer;
  background: linear-gradient(90deg, var(--text) var(--p, 50%), var(--surface-2) var(--p, 50%));
}
[data-theme="dark"] .calc input[type="range"] { background: linear-gradient(90deg, var(--volt) var(--p, 50%), var(--surface-2) var(--p, 50%)); }
.calc input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 30px; background: var(--red); border: 3px solid var(--surface); transform: skewX(-14deg); }
.calc input[type="range"]::-moz-range-thumb { width: 18px; height: 26px; border-radius: 0; background: var(--red); border: 3px solid var(--surface); }
.calc__out { background: var(--jet); padding: clamp(22px, 3vw, 34px); display: grid; gap: 22px; }
.calc__bmi { display: grid; gap: 8px; justify-items: center; text-align: center; }
.calc__gauge { width: 100%; max-width: 320px; overflow: visible; }
.g-seg { fill: none; stroke-width: 16; }
.g-seg--under { stroke: #7d7f86; } .g-seg--ok { stroke: var(--volt); } .g-seg--over { stroke: #ff9f0a; } .g-seg--obese { stroke: var(--red); }
.g-ticks text { fill: var(--muted); font-family: var(--font-body); font-size: 8px; font-weight: 700; text-anchor: middle; }
.g-needle { transform-origin: 100px 100px; transform-box: view-box; transition: transform .8s cubic-bezier(.34, 1.56, .64, 1); }
.g-needle path { fill: #f2f2ee; }
.g-hub { fill: var(--red); stroke: var(--jet); stroke-width: 3; }
.calc__read small { display: block; font-weight: 800; font-size: .74rem; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.calc__read b { display: block; font-family: var(--font-head); font-weight: 400; font-size: clamp(3.4rem, 7vw, 4.8rem); line-height: 1; color: var(--volt); }
.calc__cat { display: inline-block; margin-top: 8px; padding: 5px 14px; font-weight: 800; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; background: var(--volt); color: var(--jet); clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
.calc__cat[data-state="under"] { background: #7d7f86; color: #fff; }
.calc__cat[data-state="over"] { background: #ff9f0a; }
.calc__cat[data-state="obese"] { background: var(--red); color: #fff; }
.calc__kcal { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: rgba(242, 242, 238, .12); }
.calc__kcal > div { background: var(--jet); padding: 14px 16px; }
.calc__kcal small { display: block; font-weight: 800; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.calc__kcal b { font-family: var(--font-head); font-weight: 400; font-size: 2.1rem; line-height: 1.1; color: var(--volt); }
.calc__kcal b.muted-b { color: #f2f2ee; }
.calc__kcal em { font-style: normal; font-family: var(--font-body); font-size: .85rem; font-weight: 700; color: var(--muted); }
.calc__macros { display: grid; gap: 10px; }
.calc__macros li { display: grid; grid-template-columns: 64px 1fr 60px; gap: 12px; align-items: center; font-weight: 700; font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; }
.calc__macros b { text-align: right; font-family: var(--font-head); font-weight: 400; font-size: 1.1rem; letter-spacing: .02em; }
.calc__mbar { height: 10px; background: var(--surface-2); transform: skewX(-20deg); overflow: hidden; }
.calc__mbar i { display: block; height: 100%; background: var(--volt); transition: width .6s var(--ease); }
.calc__macros li:nth-child(2) .calc__mbar i { background: #f2f2ee; }
.calc__macros li:nth-child(3) .calc__mbar i { background: var(--red); }
.calc__note { display: flex; gap: 8px; margin: 0; font-size: .84rem; color: var(--muted); }
.calc__note .ti { flex: none; margin-top: 3px; color: var(--volt); }
@media (min-width: 768px) and (max-width: 1023px) { .calc { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .pl-split-calc { grid-template-columns: .9fr 1.1fr; } }

/* 11. Memberships & comparison ----------------------------------------- */
.pl-plans { display: grid; gap: 22px; grid-template-columns: 1fr; align-items: stretch; }
@media (min-width: 1024px) { .pl-plans { grid-template-columns: repeat(3, 1fr); padding-top: 18px; } .pl-plan--featured { transform: translateY(-18px); } }
.pl-plan {
  position: relative; display: flex; flex-direction: column; padding: clamp(28px, 3vw, 40px); background: var(--surface); min-width: 0;
  border-top: 4px solid var(--text); clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 40px, 100% 100%, 0 100%);
}
.pl-plan__name { font-size: 2.4rem; margin-bottom: 6px; }
.pl-plan__desc { color: var(--muted); margin-bottom: 22px; }
.pl-plan__price { display: flex; align-items: flex-start; gap: 4px; font-family: var(--font-head); line-height: .9; padding-bottom: 22px; border-bottom: 2px solid var(--line); margin-bottom: 20px; }
.pl-plan__price sup { font-size: 1.8rem; top: 0; line-height: 1; margin-top: 6px; }
.pl-plan__price > span { font-size: clamp(4.4rem, 7vw, 5.8rem); }
.pl-plan__price small { align-self: flex-end; font-family: var(--font-body); font-weight: 700; font-size: .9rem; color: var(--muted); margin-left: 6px; margin-bottom: 8px; }
.pl-plan__list { display: grid; gap: 10px; margin-bottom: 30px; }
.pl-plan__list li { display: flex; gap: 12px; align-items: flex-start; font-weight: 500; }
.pl-plan__list .ti { flex: none; color: var(--jet); background: var(--volt); width: 22px; height: 22px; display: grid; place-items: center; font-size: .8rem; margin-top: 2px; }
.pl-plan .btn { margin-top: auto; }
.pl-plan--featured { background: var(--volt); color: var(--jet); --text: #0b0b0c; --muted: rgba(11, 11, 12, .7); --line: rgba(11, 11, 12, .2); border-top-color: var(--jet); }
.pl-plan--featured h3 { color: var(--jet); }
.pl-plan--featured .pl-plan__list .ti { background: var(--jet); color: var(--volt); }
.pl-plan--featured .btn { --btn-bg: var(--jet); --btn-fg: var(--volt); --btn-hover: var(--red); --btn-hover-fg: #fff; }
.pl-plan__tag { position: absolute; top: 26px; right: 42px; padding: 6px 16px; background: var(--red); color: #fff; font-weight: 800; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.pl-compare { margin-top: clamp(40px, 5vw, 64px); overflow-x: auto; background: var(--surface); border-top: 4px solid var(--text); }
.pl-compare table { width: 100%; min-width: 560px; border-collapse: collapse; }
.pl-compare th, .pl-compare td { padding: 16px 18px; text-align: center; border-bottom: 1px solid var(--line); font-weight: 600; }
.pl-compare thead th { font-family: var(--font-head); font-weight: 400; font-size: 1.3rem; text-transform: uppercase; letter-spacing: .02em; }
.pl-compare th[scope="row"], .pl-compare thead th:first-child { text-align: left; }
.pl-compare thead th:first-child { font-family: var(--font-body); font-weight: 800; font-size: .76rem; letter-spacing: .16em; color: var(--muted); }
.pl-compare .is-hot, .pl-compare td:nth-child(3) { background: color-mix(in srgb, var(--volt) 16%, transparent); }
.pl-compare thead .is-hot { background: var(--volt); color: var(--jet); }
.pl-yes { display: inline-grid; place-items: center; width: 26px; height: 26px; background: var(--volt); color: var(--jet); }
.pl-no { color: var(--muted); }

/* 12. Trainers, transformations, quotes -------------------------------- */
.pl-trainers { gap: 20px; }
.pl-trainer { position: relative; background: var(--surface); min-width: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), calc(100% - 30px) 100%, 0 100%); transition: transform .5s var(--ease); }
.pl-trainer:hover { transform: translateY(-6px); }
.pl-trainer__img { position: relative; overflow: hidden; background: var(--jet); }
.pl-trainer__img img { width: 100%; aspect-ratio: 4/5; filter: grayscale(1) contrast(1.08); transition: transform 1s var(--ease), filter .6s; }
.pl-trainer:hover .pl-trainer__img img { filter: none; transform: scale(1.05); }
.pl-trainer__img::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: var(--volt); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
.pl-trainer:hover .pl-trainer__img::after { transform: scaleX(1); }
.pl-trainer__no { position: absolute; top: 12px; left: 16px; font-family: var(--font-head); font-size: 3rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px var(--volt); }
.pl-trainer__social { position: absolute; right: 12px; top: 12px; display: grid; gap: 6px; transform: translateX(60px); transition: transform .5s var(--ease); }
.pl-trainer:hover .pl-trainer__social, .pl-trainer:focus-within .pl-trainer__social { transform: none; }
.pl-trainer__social a { display: grid; place-items: center; width: 38px; height: 38px; background: var(--volt); color: var(--jet); }
.pl-trainer__body { padding: 20px 22px 34px; }
.pl-trainer h3 { font-size: 1.8rem; margin-bottom: 2px; }
.pl-trainer__body > p { color: var(--muted); font-weight: 600; margin-bottom: 14px; }
.pl-trainer__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.pl-trainer__tags li { padding: 4px 11px; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; background: var(--surface-2); clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); }
.pl-trainer__meta { display: flex; gap: 18px; padding-top: 14px; border-top: 1px solid var(--line); font-size: .82rem; color: var(--muted); font-weight: 600; }
.pl-trainer__meta b { font-family: var(--font-head); font-weight: 400; font-size: 1.3rem; color: var(--text); margin-right: 3px; }
.pl-tf { background: var(--surface); padding: clamp(24px, 3vw, 34px); border-top: 5px solid var(--volt); min-width: 0; }
.pl-tf__big { display: flex; align-items: flex-end; gap: 6px; font-family: var(--font-head); line-height: .85; }
.pl-tf__big span { font-size: clamp(4.6rem, 9vw, 7rem); color: transparent; -webkit-text-stroke: 2px var(--volt); }
.pl-tf__big small { font-size: 2rem; color: var(--volt); padding-bottom: 6px; }
.pl-tf__who { margin: 18px 0 20px; }
.pl-tf__who strong { display: block; font-family: var(--font-head); font-weight: 400; font-size: 1.5rem; text-transform: uppercase; }
.pl-tf__who span { color: var(--muted); font-size: .9rem; font-weight: 600; }
.pl-tf__bars { display: grid; gap: 14px; }
.pl-tf__lab { display: block; font-weight: 800; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.pl-tf__pair { display: grid; gap: 4px; }
.pl-tf__pair i { display: flex; align-items: center; height: 24px; padding-left: 8px; min-width: 64px; font-style: normal; }
.pl-tf__pair i b { font-size: .78rem; font-weight: 800; white-space: nowrap; }
.pl-tf__pair .was, .pl-tf__key .was { background: var(--surface-2); color: var(--text); }
.pl-tf__pair .now, .pl-tf__key .now { background: var(--volt); color: var(--jet); }
.pl-tf__key { display: flex; align-items: center; gap: 8px; margin: 18px 0 0; font-size: .78rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .1em; }
.pl-tf__key i { width: 14px; height: 8px; }
.pl-tf__key .now { margin-left: 10px; }
.pl-quote { position: relative; display: flex; flex-direction: column; gap: 22px; height: 100%; padding: clamp(28px, 3vw, 38px); background: var(--surface); border-left: 5px solid var(--volt); min-width: 0; }
.pl-quote__mark { font-family: var(--font-head); font-size: 6rem; line-height: .6; height: 42px; color: var(--red); }
.pl-quote blockquote { font-size: 1.1rem; font-weight: 500; line-height: 1.55; }
.pl-quote figcaption, .pl-bigquote figcaption { display: flex; align-items: center; gap: 14px; margin-top: auto; }
.pl-quote figcaption img, .pl-bigquote figcaption img { width: 54px; height: 54px; filter: grayscale(1); clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
.pl-quote strong, .pl-bigquote strong { display: block; font-family: var(--font-head); font-weight: 400; font-size: 1.25rem; text-transform: uppercase; letter-spacing: .02em; }
.pl-quote figcaption span, .pl-bigquote figcaption span { font-size: .88rem; color: var(--muted); font-weight: 600; }
.pl-bigquote { max-width: 1000px; margin-inline: auto; text-align: center; }
.pl-bigquote .pl-quote__mark { display: block; font-size: 9rem; height: 70px; }
.pl-bigquote blockquote { font-size: clamp(1.4rem, 3vw, 2.3rem); font-weight: 600; line-height: 1.3; margin-bottom: 32px; }
.pl-bigquote figcaption { justify-content: center; text-align: left; }

/* 13. WOD board & PR leaderboard --------------------------------------- */
.wod { background: var(--steel); padding: clamp(22px, 3vw, 34px); border-top: 6px solid var(--red); min-width: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), calc(100% - 30px) 100%, 0 100%); }
.wod__head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; flex-wrap: wrap; }
.wod__head h3 { font-size: clamp(2.2rem, 4vw, 3.2rem); margin: 14px 0 0; }
.wod__cap { display: grid; justify-items: end; text-align: right; color: var(--volt); }
.wod__cap .ti { font-size: 1.4rem; }
.wod__cap b { font-family: var(--font-head); font-weight: 400; font-size: 2.6rem; line-height: 1; }
.wod__cap small { font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.wod__meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 18px 0 22px; padding-block: 12px; border-block: 1px solid var(--line); font-size: .86rem; font-weight: 600; color: var(--muted); }
.wod__meta span { display: inline-flex; align-items: center; gap: 6px; }
.wod__meta .ti { color: var(--volt); }
.wod .tabs__list { margin-bottom: 18px; }
.wod .tabs__btn { background: var(--jet); color: var(--text); }
.wod .tabs__btn.is-active, .wod .tabs__btn:hover { background: var(--volt); color: var(--jet); }
.wod__list { list-style: none; display: grid; gap: 2px; }
.wod__list li { display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: center; padding: 14px 16px; background: var(--jet); }
.wod__reps { font-family: var(--font-head); font-size: 1.5rem; color: var(--volt); line-height: 1; }
.wod__list b { display: block; font-size: 1.08rem; font-weight: 700; }
.wod__list small { color: var(--muted); font-size: .86rem; }
.lb { background: var(--surface); border-top: 5px solid var(--volt); min-width: 0; }
.lb__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; padding: 16px 20px; border-bottom: 1px solid var(--line); font-weight: 800; font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.lb__head span:first-child { color: var(--text); display: inline-flex; gap: 8px; align-items: center; }
.lb__list { list-style: none; }
.lb__list li { display: grid; grid-template-columns: 40px 1fr 70px; grid-template-areas: "r w k" "r b p"; gap: 6px 14px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.lb__rank { grid-area: r; font-family: var(--font-head); font-size: 1.8rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.2px var(--stroke); }
.lb__list li:first-child .lb__rank { color: var(--red); -webkit-text-stroke-color: var(--red); }
.lb__who { grid-area: w; min-width: 0; }
.lb__who b { display: block; font-weight: 700; }
.lb__who small { color: var(--muted); font-weight: 600; font-size: .82rem; }
.lb__bar { grid-area: b; height: 8px; background: var(--surface-2); transform: skewX(-20deg); overflow: hidden; }
.lb__bar i { display: block; height: 100%; background: var(--text); }
[data-theme="dark"] .lb__bar i { background: var(--volt); }
.lb__kg { grid-area: k; text-align: right; font-family: var(--font-head); font-weight: 400; font-size: 1.6rem; line-height: 1; }
.lb__kg small { font-family: var(--font-body); font-size: .72rem; font-weight: 700; color: var(--muted); margin-left: 2px; }
.lb__pr { grid-area: p; justify-self: end; font-size: .7rem; font-weight: 800; letter-spacing: .1em; color: var(--red); white-space: nowrap; }
@media (min-width: 640px) {
  .lb__list li { grid-template-columns: 44px minmax(0, 1.2fr) minmax(0, 1fr) 76px 64px; grid-template-areas: "r w b k p"; }
}

/* 14. Home heroes ------------------------------------------------------- */
/* Hero 1 — full-bleed diagonal photo */
.pl-hero { min-height: min(100svh, 980px); display: flex; align-items: flex-end; background: var(--jet); padding-top: calc(var(--header-h) + 72px); padding-bottom: clamp(90px, 10vw, 150px); clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--sk)), 0 100%); }
.pl-hero__bg { position: absolute; inset: 0; z-index: 0; }
.pl-hero__bg img { width: 100%; height: 100%; filter: grayscale(.85) contrast(1.15); }
.pl-hero__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 11, 12, .94) 0%, rgba(11, 11, 12, .7) 50%, rgba(11, 11, 12, .35) 100%), linear-gradient(0deg, rgba(11, 11, 12, .85), transparent 45%); }
.pl-hero__word { position: absolute; right: -2vw; top: 50%; z-index: 0; transform: translateY(-50%) rotate(90deg); transform-origin: center; font-family: var(--font-head); font-size: clamp(8rem, 20vw, 20rem); line-height: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(230, 255, 0, .22); pointer-events: none; white-space: nowrap; display: none; }
@media (min-width: 1280px) { .pl-hero__word { display: block; right: -6vw; } }
.pl-hero__grid { position: relative; z-index: 1; display: grid; gap: 40px; align-items: end; }
@media (min-width: 1024px) { .pl-hero__grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, .8fr); gap: 56px; } }
.pl-hero__title, .pl-hero2__title, .pl-hero4__title { font-size: clamp(3.6rem, 12vw, 9.6rem); line-height: .86; margin: 22px 0 26px; }
.pl-l { display: block; }
.pl-l--outline { color: transparent; -webkit-text-stroke: 2px var(--stroke); }
.pl-l--volt { color: var(--volt); }
.pl-hero .lead, .pl-hero2 .lead { max-width: 52ch; margin-bottom: 34px; color: rgba(242, 242, 238, .82); }
.pl-statband { margin-top: calc(var(--sk) * -1); padding-top: var(--sk); }

/* Hero 2 — split with parallelogram media */
.pl-hero2 { background: var(--jet); padding-top: calc(var(--header-h) + clamp(44px, 6vw, 90px)); padding-bottom: clamp(56px, 7vw, 100px); background-image: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 16px); }
.pl-hero2__grid { display: grid; gap: 48px; align-items: center; }
@media (min-width: 1024px) { .pl-hero2__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; } }
.pl-hero2__title { font-size: clamp(4rem, 13vw, 10rem); }
.pl-hero2__facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--line); }
.pl-hero2__facts b { display: block; font-family: var(--font-head); font-weight: 400; font-size: clamp(1.8rem, 3.6vw, 2.6rem); line-height: 1; color: var(--volt); }
.pl-hero2__facts span { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.pl-hero2__media { position: relative; padding: 0 0 60px 0; min-width: 0; }
.pl-hero2__img { clip-path: polygon(14% 0, 100% 0, 86% 100%, 0 100%); background: var(--steel); }
.pl-hero2__img img { width: 100%; aspect-ratio: 4/5; filter: grayscale(.4) contrast(1.1); }
.pl-hero2__img2 { position: absolute; left: 0; bottom: 0; width: 42%; border: 5px solid var(--volt); background: var(--jet); }
.pl-hero2__img2 img { width: 100%; aspect-ratio: 1; }
.pl-hero2__stamp { position: absolute; right: 6%; bottom: 20px; display: grid; justify-items: center; padding: 14px 20px; background: var(--red); color: #fff; transform: rotate(-8deg); font-weight: 800; letter-spacing: .16em; font-size: .72rem; text-transform: uppercase; }
.pl-hero2__stamp b { font-family: var(--font-head); font-weight: 400; font-size: 2.4rem; letter-spacing: .02em; line-height: 1; }

/* Hero 3 — coach portrait with outlined name */
.pl-hero3 { background: var(--jet); padding-top: calc(var(--header-h) + clamp(40px, 6vw, 90px)); padding-bottom: clamp(64px, 8vw, 110px); }
.pl-hero3__name { position: absolute; inset: auto 0 2% 0; z-index: 0; display: grid; font-family: var(--font-head); font-size: clamp(6rem, 24vw, 22rem); line-height: .82; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1.5px rgba(242, 242, 238, .07); pointer-events: none; padding-left: 2vw; white-space: nowrap; }
.pl-hero3__name span:last-child { padding-left: 18vw; -webkit-text-stroke-color: rgba(230, 255, 0, .1); }
.pl-hero3__grid { position: relative; z-index: 1; display: grid; gap: 48px; align-items: center; }
@media (min-width: 1024px) { .pl-hero3__grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 72px; } }
.pl-hero3__media { position: relative; padding: 0 18px 18px 0; max-width: 560px; }
.pl-hero3__media::before { content: ""; position: absolute; inset: 18px 0 0 18px; background: var(--volt); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0 100%); }
.pl-hero3__img { position: relative; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0 100%); }
.pl-hero3__img img { width: 100%; aspect-ratio: 9/11; filter: grayscale(.3) contrast(1.08); }
.pl-hero3__badge { position: absolute; left: -8px; bottom: 44px; display: flex; gap: 12px; align-items: center; padding: 14px 18px; background: var(--jet); border-left: 5px solid var(--red); color: #f2f2ee; }
.pl-hero3__badge .ti { font-size: 1.8rem; color: var(--volt); }
.pl-hero3__badge b { display: block; font-family: var(--font-head); font-weight: 400; font-size: 1.4rem; line-height: 1; text-transform: uppercase; }
.pl-hero3__badge span { font-size: .8rem; color: var(--muted); font-weight: 600; }
.pl-hero3__title { font-size: clamp(2.9rem, 6.2vw, 5.6rem); line-height: .92; margin: 22px 0 24px; }
.pl-hero3 .lead { color: rgba(242, 242, 238, .82); margin-bottom: 32px; }
.pl-hero3__proof { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 36px; font-size: .92rem; color: var(--muted); line-height: 1.4; }
.pl-hero3__proof b { color: var(--volt); }

/* Hero 4 — calm studio (theme-aware, default light) */
.pl-hero4 { padding-top: calc(var(--header-h) + clamp(44px, 6vw, 90px)); padding-bottom: clamp(40px, 5vw, 70px); }
.pl-hero4__top { display: grid; gap: 20px 56px; align-items: end; }
@media (min-width: 1024px) { .pl-hero4__top { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); } .pl-hero4__top > :first-child { grid-column: 1 / -1; } }
.pl-hero4__title { margin-bottom: 0; }
.pl-hero4 .pl-l--outline { -webkit-text-stroke-width: 1.5px; }
.pl-hero4__side .lead { margin-bottom: 28px; }
.pl-hero4__gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: clamp(40px, 6vw, 80px); align-items: start; }
.pl-hero4__gallery > div { overflow: hidden; clip-path: polygon(0 5%, 100% 0, 100% 100%, 0 100%); min-width: 0; }
.pl-hero4__gallery > div:nth-child(2) { margin-top: clamp(24px, 6vw, 80px); }
.pl-hero4__gallery img { width: 100%; aspect-ratio: 7/9; }
@media (min-width: 768px) { .pl-hero4__gallery { gap: 20px; } }

/* 15. Inner pages, map, gallery ---------------------------------------- */
.pl-ph { background: var(--jet); padding-top: calc(var(--header-h) + clamp(64px, 9vw, 130px)); padding-bottom: calc(clamp(64px, 8vw, 110px) + var(--sk)); clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--sk)), 0 100%); border: 0; }
.pl-ph__bg { position: absolute; inset: 0; }
.pl-ph__bg img { width: 100%; height: 100%; filter: grayscale(1) contrast(1.15); }
.pl-ph__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 11, 12, .95), rgba(11, 11, 12, .6)); }
.pl-ph__word { position: absolute; right: -1vw; bottom: calc(var(--sk) - 1vw); font-family: var(--font-head); font-size: clamp(5rem, 17vw, 16rem); line-height: .8; color: transparent; -webkit-text-stroke: 1.5px rgba(230, 255, 0, .28); pointer-events: none; white-space: nowrap; }
.pl-ph .container { position: relative; }
.pl-ph h1 { font-size: clamp(3.2rem, 9vw, 7.4rem); letter-spacing: .005em; line-height: .9; max-width: 14ch; }
.pl-ph .lead { color: rgba(242, 242, 238, .82); }
.pl-ph .breadcrumb { color: rgba(242, 242, 238, .7); }
.pl-photo-stack, .pl-about3__img, .pl-yoga-img { position: relative; padding: 0 18px 18px 0; min-width: 0; }
.pl-photo-stack::before, .pl-about3__img::before, .pl-yoga-img::before { content: ""; position: absolute; inset: 18px 0 0 18px; background: var(--red); }
.pl-yoga-img::before { background: var(--volt); }
.pl-photo-stack img, .pl-about3__img img, .pl-yoga-img img { position: relative; width: 100%; aspect-ratio: 9/10; filter: grayscale(.2); }
.pl-about3__tag { position: absolute; top: 20px; left: -6px; padding: 8px 18px; background: var(--volt); color: var(--jet); font-weight: 800; letter-spacing: .16em; text-transform: uppercase; font-size: .74rem; }
.pl-gal { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 1024px) { .pl-gal { grid-template-columns: repeat(4, 1fr); gap: 18px; } .pl-gal__i:nth-child(even) { transform: translateY(40px); } }
.pl-gal__i { overflow: hidden; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%); }
.pl-gal__i img { width: 100%; aspect-ratio: 1; filter: grayscale(1); transition: filter .6s, transform 1s var(--ease); }
.pl-gal__i:hover img { filter: none; transform: scale(1.05); }
.pl-visit { display: grid; gap: 24px; }
@media (min-width: 1024px) { .pl-visit { grid-template-columns: 1.4fr 1fr; } }
.pl-map { position: relative; min-height: 360px; overflow: hidden; background: var(--steel); }
.pl-map__grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(242, 242, 238, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(242, 242, 238, .06) 1px, transparent 1px); background-size: 40px 40px; }
.pl-map__road { position: absolute; height: 14px; background: #2e3036; }
.pl-map__road.r1 { left: -10%; right: -10%; top: 58%; transform: rotate(-12deg); }
.pl-map__road.r2 { top: -10%; bottom: -10%; left: 38%; width: 12px; height: auto; transform: rotate(18deg); }
.pl-map__river { position: absolute; left: -10%; right: -10%; top: 12%; height: 40px; background: rgba(92, 225, 230, .18); transform: rotate(6deg); }
.pl-map__pin { position: absolute; left: 44%; top: 42%; z-index: 1; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 10px 12px; background: var(--volt); color: var(--jet); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: .8rem; clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.pl-map__pin .ti { font-size: 1.3rem; }
.pl-hours { background: var(--surface); padding: clamp(24px, 3vw, 36px); border-top: 5px solid var(--volt); }
.pl-hours h3 { display: flex; gap: 10px; align-items: center; font-size: 1.9rem; }
.pl-hours ul { margin: 12px 0 20px; }
.pl-hours li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); font-weight: 600; }
.pl-hours li b { font-family: var(--font-head); font-weight: 400; font-size: 1.2rem; letter-spacing: .03em; }
.pl-form { padding: clamp(24px, 3vw, 40px); background: var(--surface); border-top: 6px solid var(--volt); }

/* 16. CTA, footer, 404 --------------------------------------------------- */
.pl-cta { position: relative; overflow: hidden; background: var(--jet); padding-block: calc(clamp(90px, 11vw, 160px) + var(--sk) * .5); clip-path: polygon(0 var(--sk), 100% 0, 100% 100%, 0 100%); margin-top: clamp(20px, 3vw, 40px); }
.pl-cta__bg { position: absolute; inset: 0; }
.pl-cta__bg img { width: 100%; height: 100%; filter: grayscale(1) contrast(1.2); }
.pl-cta__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(11, 11, 12, .96) 30%, rgba(11, 11, 12, .55)); }
.pl-cta::after { content: ""; position: absolute; right: -8%; top: 0; bottom: 0; width: 36%; background: var(--volt); clip-path: polygon(40% 0, 100% 0, 100% 100%, 0 100%); opacity: .95; display: none; }
@media (min-width: 1024px) { .pl-cta::after { display: block; } }
.pl-cta .container { position: relative; z-index: 1; }
.pl-cta__inner { max-width: 820px; }
.pl-cta__title { font-size: clamp(3rem, 8vw, 7rem); line-height: .9; margin-bottom: 20px; }
.pl-cta .lead { color: rgba(242, 242, 238, .82); margin-bottom: 34px; }
.pl-foot { background: var(--jet); padding-top: 0; }
.pl-stripes--foot { margin-bottom: clamp(56px, 7vw, 96px); }
.pl-foot__top { display: grid; gap: 36px; padding-bottom: 48px; border-bottom: 1px solid var(--line); }
@media (min-width: 1024px) { .pl-foot__top { grid-template-columns: 1.2fr 1fr; gap: 72px; align-items: start; } }
.pl-foot__brand p { color: var(--muted); max-width: 44ch; margin: 18px 0 0; }
.pl-foot__news h4, .pl-foot__col h4 { color: var(--volt); margin-bottom: 14px; }
.pl-foot__news h4 { font-family: var(--font-head); font-weight: 400; font-size: 2rem; letter-spacing: .01em; color: var(--text); margin-bottom: 6px; }
.pl-foot__news p { color: var(--muted); }
.pl-foot__news .newsletter { max-width: none; }
.pl-foot__grid { display: grid; gap: 36px 24px; grid-template-columns: repeat(2, 1fr); padding-block: 48px; }
@media (min-width: 1024px) { .pl-foot__grid { grid-template-columns: repeat(4, 1fr); } }
.pl-foot .footer-links a:hover { color: var(--volt); }
.pl-foot__hours li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; color: var(--muted); max-width: 240px; }
.pl-foot__hours b { color: var(--text); font-weight: 700; }
.pl-foot__hours a { display: inline-flex; align-items: center; gap: 8px; color: var(--volt); font-weight: 700; margin-top: 8px; }
.pl-foot .socials a { border-radius: 0; border-color: var(--line); }
.pl-foot .socials a:hover { background: var(--volt); color: var(--jet); }
.pl-foot .footer-bottom { border-top-color: var(--line); }
.pl-foot__mega { font-family: var(--font-head); font-weight: 400; letter-spacing: .01em; opacity: 1; color: transparent; -webkit-text-stroke: 1.5px rgba(230, 255, 0, .35); font-size: clamp(4rem, 20vw, 19rem); line-height: .8; padding-top: 10px; margin-bottom: -.08em; }
.error-page { background: var(--jet); color: #f2f2ee; --text: #f2f2ee; --muted: #a3a49f; background-image: repeating-linear-gradient(-45deg, rgba(230, 255, 0, .04) 0 2px, transparent 2px 18px); }
.error-page .code { font-family: var(--font-head); font-weight: 400; letter-spacing: .01em; font-size: clamp(7rem, 34vw, 22rem); }
.error-page .code.text-gradient { background: none; color: transparent; -webkit-text-stroke: 3px var(--volt); }
.error-page h1 { color: #f2f2ee; }
.error-page h1::before { content: "Out of bounds"; display: block; width: max-content; margin: 18px auto 18px; padding: 6px 16px; background: var(--red); color: #fff; font-family: var(--font-body); font-weight: 800; font-size: .76rem; letter-spacing: .2em; }
.error-page .lead { color: #a3a49f; }

/* Reduced motion: show everything, stop the blinking and marquee motion. */
@media (prefers-reduced-motion: reduce) {
  .pl-live i { animation: none; }
  .tt__row:hover, .pl-trainer:hover { transform: none; }
}
.lb__list, .wod__list { padding: 0; margin: 0; }
@media (max-width: 1023px) { .pl-hero3__name { display: none; } .pl-prog { min-height: 360px; } }