/* KINEPEAK G19 — Performance Editorial 2.0 visual overlay.
 * Staging-only. Uses existing markup, fonts, images and verified product facts.
 */
:root {
  --g19-ink: #12130f;
  --g19-graphite: #1a1c19;
  --g19-paper: #f3efe6;
  --g19-paper-bright: #fffdf8;
  --g19-orange: #ff5a1f;
  --g19-cyan: #9cc8c7;
  --g19-rule: rgba(18, 19, 15, .2);
  --g19-ease: cubic-bezier(.2, .72, .2, 1);
}

/* Shared type correction: signal numerals stay condensed; editorial statements breathe. */
:where(.workouts-g9, .learn-g9, .support-g11b) :is(.display, .title, .section-title),
:where(.workouts-g9, .learn-g9, .support-g11b) h1 {
  font-family: "Source Serif 4", Georgia, serif !important;
  font-weight: 560 !important;
  line-height: .94 !important;
  letter-spacing: -.045em !important;
  text-transform: none !important;
  text-wrap: balance;
}

:where(.workouts-g9, .learn-g9, .support-g11b) :is(.eyebrow, .filter-label, .session-stats, .kp-g11a-hero-supporting) {
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .12em;
}

:where(.workouts-g9, .learn-g9, .support-g11b) .btn,
.product-v54 .btn {
  border-radius: 4px;
  box-shadow: 4px 4px 0 rgba(18, 19, 15, .16);
  transition: transform 180ms var(--g19-ease), box-shadow 180ms var(--g19-ease), background-color 180ms ease;
}

:where(.workouts-g9, .learn-g9, .support-g11b) .btn:hover,
.product-v54 .btn:hover {
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0 rgba(18, 19, 15, .18);
}

:where(.workouts-g9, .learn-g9, .support-g11b) .btn:active,
.product-v54 .btn:active { transform: translate(1px, 1px); box-shadow: 2px 2px 0 rgba(18, 19, 15, .16); }

/* Home: make the existing product-led hero feel like a training surface. */
.home-v53 .v53-hero-media {
  position: relative;
  isolation: isolate;
  border: 1px solid rgba(18, 19, 15, .18);
  box-shadow: 18px 18px 0 rgba(18, 19, 15, .08);
}

.home-v53 .v53-hero-media::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 12%;
  bottom: 12%;
  left: 9%;
  width: 1px;
  background: linear-gradient(180deg, transparent, var(--g19-orange) 22%, var(--g19-orange) 78%, transparent);
  opacity: .8;
  pointer-events: none;
}

.home-v53 .v53-hero-media::after {
  content: "CUE / STRIKE / RESET";
  position: absolute;
  z-index: 3;
  right: 1rem;
  top: 1rem;
  padding: .4rem .55rem;
  border: 1px solid rgba(255,255,255,.42);
  background: rgba(18,19,15,.82);
  color: #fffdf8;
  font-family: "Barlow Condensed", sans-serif;
  font-size: .68rem;
  letter-spacing: .15em;
  pointer-events: none;
}

.home-v53 .v53-hero-media img {
  filter: brightness(1.28) contrast(1.04) saturate(1.05);
}

.home-v53 .v53-hero-media figcaption {
  background: rgba(18, 19, 15, .86);
  color: var(--g19-paper-bright);
}

/* Make the first decision happen immediately after the hero. */
.home-v53 #main {
  display: flex;
  flex-direction: column;
}
.home-v53 #main > .v53-hero { order: 1; }
.home-v53 #main > .v53-modes { order: 2; }
.home-v53 #main > .v53-music { order: 3; }
.home-v53 #main > .v53-people { order: 4; }
.home-v53 #main > .v53-product-proof { order: 5; }
.home-v53 #main > .v53-pathways { order: 6; }
.home-v53 #main > .v53-closing { order: 7; }

.home-v53 .v53-modes {
  position: relative;
  background: var(--g19-ink);
  color: var(--g19-paper-bright);
  border-block: 1px solid rgba(255,255,255,.15);
}

.home-v53 .v53-mode-grid {
  grid-template-columns: minmax(1.15fr, 1.35fr) minmax(.9fr, 1fr) minmax(.75fr, .88fr);
  align-items: stretch;
}

.home-v53 .v53-mode {
  min-height: 19rem;
  border-color: rgba(255,255,255,.18);
  background: transparent;
  transition: transform 220ms var(--g19-ease), background-color 220ms ease, opacity 220ms ease;
}

.home-v53 .v53-mode--train { background: rgba(255,255,255,.08); }
.home-v53 .v53-modes > .v53-section-heading > p { color: rgba(255,253,248,.72); }
.home-v53 .v53-mode--train,
.home-v53 .v53-mode--hiit { color: var(--g19-paper-bright); }
.home-v53 .v53-mode--train :is(h3, p, a, .v53-mode-label),
.home-v53 .v53-mode--hiit :is(h3, p, a, .v53-mode-label) { color: inherit; }
.home-v53 .v53-mode:is(:hover, :focus-within) { z-index: 1; transform: translateY(-8px); background: rgba(255,255,255,.13); }
.home-v53 .v53-mode-grid:has(.v53-mode:hover) .v53-mode:not(:hover) { opacity: .62; }
.home-v53 .v53-mode-number { color: var(--g19-orange); }
.home-v53 .v53-mode--hiit .v53-mode-number { color: var(--g19-cyan); }

.home-v53 .v53-facts {
  border-color: rgba(18,19,15,.3);
  box-shadow: 0 10px 0 rgba(18,19,15,.05);
}

/* Product: product first, readable headline, and a darker mechanism chapter. */
.product-v54 .product-v54-hero,
.product-g10 .product-g10-hero {
  background: var(--g19-ink);
  color: var(--g19-paper-bright);
  border-bottom: 0;
}

.product-v54 .product-v54-hero :is(h1, .display, .title),
.product-g10 .product-g10-hero :is(h1, .display, .title) {
  font-family: "Source Serif 4", Georgia, serif !important;
  font-weight: 560 !important;
  line-height: .94 !important;
  letter-spacing: -.045em !important;
  text-transform: none !important;
  text-wrap: balance;
}

.product-v54 .product-v54-hero .lede,
.product-g10 .product-g10-hero .lede,
.product-v54 .product-v54-hero .v53-lede,
.product-g10 .product-g10-hero .v53-lede { color: rgba(255,253,248,.82) !important; }

.product-v54 .product-v54-hero .product-g10-supporting,
.product-g10 .product-g10-hero .product-g10-supporting { color: rgba(255,253,248,.76) !important; }

.product-v54 .product-v54-hero .v53-text-link,
.product-g10 .product-g10-hero .v53-text-link,
.product-v54 .product-v54-hero a:not(.btn),
.product-g10 .product-g10-hero a:not(.btn) { color: rgba(255,253,248,.9); }

.product-v54 .product-v54-hero-media,
.product-g10 .product-g10-hero-media {
  min-height: clamp(31rem, 58vw, 45rem);
  background: radial-gradient(circle at 50% 42%, #4b5048 0, #242824 42%, #151714 78%);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 16px 16px 0 rgba(255,90,31,.22);
}

.product-v54 .product-v54-hero-media img,
.product-g10 .product-g10-hero-media img { transform: scale(1.08); filter: contrast(1.04) saturate(.92); }

.product-v54 .product-v54-modes,
.product-v54 .product-v54-cues { background: var(--g19-graphite); color: var(--g19-paper-bright); }

.product-v54 .product-v54-object-label {
  border-color: var(--g19-orange);
  background: rgba(18,19,15,.9);
  box-shadow: 4px 4px 0 rgba(255,90,31,.32);
}

.product-v54 .product-v54-install { border-top: 8px solid var(--g19-orange); }

/* Workouts: make the first decision visible before the library. */
.workouts-g9 .kp-g9-hero {
  background: var(--g19-ink);
  color: var(--g19-paper-bright);
  border-bottom: 0;
}

.workouts-g9 .kp-g9-hero :is(.display, .section-title) { color: var(--g19-paper-bright); }
.workouts-g9 .kp-g9-hero .lede,
.workouts-g9 .kp-g9-hero .kp-g11a-hero-supporting { color: rgba(255,253,248,.72); }
.workouts-g9 .kp-g9-hero__media { border-color: rgba(255,255,255,.22); box-shadow: 14px 14px 0 rgba(255,90,31,.26); }

.workouts-g9 .kp-g9-mode-rail {
  background: var(--g19-graphite);
  color: var(--g19-paper-bright);
  border-color: rgba(255,255,255,.2);
}

.workouts-g9 .kp-g9-mode-rail a { border-color: rgba(255,255,255,.2); }
.workouts-g9 .kp-g9-mode-rail a:is(:hover, :focus-visible, .is-active) { background: var(--g19-orange); color: var(--g19-ink); transform: translateY(-7px); }
.workouts-g9 .filter-bar { border: 1px solid var(--g19-rule); background: var(--g19-paper-bright); box-shadow: 8px 8px 0 rgba(18,19,15,.08); }
.workouts-g9 .workout-session--feature { border-left: 7px solid var(--g19-orange); }
.workouts-g9 .workout-session:not(.workout-session--feature):is(:hover, :focus-within) { background: rgba(255,90,31,.08); transform: translateX(10px); }

/* Learn: editorial reading hub, not an equal-weight article wall. */
.learn-g9 .kp-g9-hero {
  background: var(--g19-ink);
  color: var(--g19-paper-bright);
  border-bottom: 0;
}

.learn-g9 .kp-g9-hero :is(.display, .section-title) { color: var(--g19-paper-bright); }
.learn-g9 .kp-g9-hero .lede { color: rgba(255,253,248,.72); }
.learn-g9 .kp-g9-hero__aside > p:not(.lede) { color: rgba(255,253,248,.68); }
.learn-g9 .kp-g9-topic-rail { background: var(--g19-orange); color: var(--g19-ink); border: 0; }
.learn-g9 .kp-g9-topic-rail a { border-color: rgba(18,19,15,.24); font-weight: 700; }
.learn-g9 .kp-g9-article-card { background: var(--g19-paper-bright); border: 1px solid var(--g19-rule); transition: transform 220ms var(--g19-ease), box-shadow 220ms ease; }
.learn-g9 .kp-g9-article-card:is(:hover, :focus-within) { transform: translateY(-8px); box-shadow: 10px 10px 0 rgba(18,19,15,.1); }
.learn-g9 .kp-g9-article-card--feature { border-top: 8px solid var(--g19-orange); }
.learn-g9 .kp-g9-learn-group--dark { background: var(--g19-graphite); color: var(--g19-paper-bright); }
.learn-g9 .kp-g9-featured-guide > article { color: var(--g19-ink); }
.learn-g9 .kp-g9-featured-guide > article :is(h2, h3, a) { color: var(--g19-ink); }
.learn-g9 .kp-g9-featured-guide > article p { color: rgba(18,19,15,.72); }

/* G19-B: make the learning hub a routing surface, not a dead-end archive. */
.g19b-next-step {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-block: clamp(1.5rem, 4vw, 3rem) clamp(2.5rem, 6vw, 5rem);
  border: 1px solid var(--g19-rule);
  background: var(--g19-rule);
}
.g19b-next-step a {
  display: grid;
  gap: .55rem;
  min-height: 9.5rem;
  padding: clamp(1.15rem, 2.8vw, 2rem);
  background: var(--g19-paper-bright);
  color: var(--g19-ink);
  text-decoration: none;
  transition: transform 180ms var(--g19-ease), background-color 180ms ease, color 180ms ease;
}
.g19b-next-step a:is(:hover, :focus-visible) { transform: translateY(-5px); background: var(--g19-orange); color: var(--g19-ink); }
.g19b-next-step a .eyebrow { margin: 0; color: currentColor; opacity: .68; }
.g19b-next-step strong { font-family: "Source Serif 4", Georgia, serif; font-size: clamp(1.35rem, 2.4vw, 2rem); line-height: 1; }
.g19b-next-step small { max-width: 25ch; color: currentColor; opacity: .72; }

/* Support: task-first, with a clearer pre-purchase path. */
.support-g11b .kp-support-g11b__hero {
  background: var(--g19-ink);
  color: var(--g19-paper-bright);
  border-bottom: 0;
}

.support-g11b .kp-support-g11b__hero :is(h1, .display, .title) { color: var(--g19-paper-bright); }
.support-g11b .kp-support-g11b__hero .lede { color: rgba(255,253,248,.72); }
.support-g11b .kp-support-g11b__hero > .container p:not(.lede),
.support-g11b .kp-support-g11b__hero p:not(.lede) { color: rgba(255,253,248,.68); }
.support-g11b .kp-support-g11b__path { border-top: 4px solid var(--g19-orange); background: var(--g19-paper-bright); color: var(--g19-ink); transition: transform 220ms var(--g19-ease), box-shadow 220ms ease; }
.support-g11b .kp-support-g11b__path:is(:hover, :focus-within) { transform: translateY(-7px); box-shadow: 8px 8px 0 rgba(18,19,15,.1); }
.support-g11b .kp-support-g11b__search-panel { border: 1px solid var(--g19-rule); box-shadow: 8px 8px 0 rgba(18,19,15,.08); }
.support-g11b .kp-support-g11b__closing { background: var(--g19-graphite); color: var(--g19-paper-bright); }

/* G19-B: make the high-frequency support action stay close to the results. */
.support-g11b .kp-support-g11b__search-panel { align-self: start; }
@media (min-width: 901px) {
  .support-g11b .kp-support-g11b__search-panel { position: sticky; top: 5.5rem; }
}

/* G19-B: three clearly weighted entry sessions; the remaining library stays available. */
.workouts-g9 .workout-session--feature { background: var(--g19-paper-bright); box-shadow: 8px 8px 0 rgba(18,19,15,.08); }
.workouts-g9 .workout-session--feature .session-index { color: var(--g19-orange); }
.workouts-g9 .workout-session--feature .session-title h2 { font-size: clamp(1.55rem, 2.6vw, 2.45rem); }

/* Shared responsive rules. */
:where(.home-v53, .product-v54, .workouts-g9, .learn-g9, .support-g11b) :is(h1, h2, h3, p) { text-wrap: pretty; }
:where(.home-v53, .product-v54, .workouts-g9, .learn-g9, .support-g11b) .container { max-width: 1280px; }

@media (max-width: 900px) {
  .home-v53 .v53-mode-grid { grid-template-columns: 1fr 1fr; }
  .home-v53 .v53-mode--train { grid-column: 1 / -1; }
  .product-v54 .product-v54-hero-media,
  .product-g10 .product-g10-hero-media { min-height: 28rem; box-shadow: 10px 10px 0 rgba(255,90,31,.2); }
}

@media (max-width: 600px) {
  :where(.workouts-g9, .learn-g9, .support-g11b) :is(.display, .title, .section-title),
  :where(.workouts-g9, .learn-g9, .support-g11b) h1,
  .product-v54 .product-v54-hero :is(h1, .display, .title),
  .product-g10 .product-g10-hero :is(h1, .display, .title) {
    font-size: clamp(2.7rem, 12vw, 4.5rem) !important;
    line-height: .96 !important;
  }

  .home-v53 .v53-mode-grid { grid-template-columns: 1fr; }
  .home-v53 .v53-mode--train { grid-column: auto; }
  .home-v53 .v53-mode { min-height: 14rem; }
  .home-v53 .v53-hero-media::before { left: 6%; }
  .home-v53 .v53-hero-media::after { font-size: .58rem; }
  .product-v54 .product-v54-hero-media,
  .product-g10 .product-g10-hero-media { min-height: 23rem; }
  .workouts-g9 .kp-g9-mode-rail { overflow-x: auto; }
  .learn-g9 .kp-g9-topic-rail { overflow-x: auto; }
  .g19b-next-step { grid-template-columns: 1fr; }
  .g19b-next-step a { min-height: 7.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .home-v53 .v53-mode,
  .learn-g9 .kp-g9-article-card,
  .support-g11b .kp-support-g11b__path,
  :where(.workouts-g9, .learn-g9, .support-g11b) .btn,
  .product-v54 .btn { transition: none; }
  .g19b-next-step a { transition: none; }
}