
/* ==========================================================================
   Consistency Is Key — book page, design option A "Book Up Front" (Oct 2026)
   Comparison build. The canonical page lives in content/book-landing/.
   Book-forward split: the real paperback fills the left half of the first
   screen on the night-purple field; the title, free-chapter action, two
   choices (turquoise resources, yellow buying) and the Chris Lear quote
   stack beside it. Anton display, Hind body, ink outlines, offset shadows.
   "Get the free chapters" glides to the signup in ~500ms (option-a.js).
   ========================================================================== */

:root {
  --ink: #230a3b;
  --purple: #46166b;
  --purple-deep: #331050;
  --purple-vivid: #6d28b8;
  --night: #24093b;
  --teal: #07696f;          /* accessible teal for text/links on light */
  --teal-bright: #35dfe4;   /* Book resources */
  --yellow: #ffe81a;        /* Buy the book */
  --orange: #ff571f;        /* shared accent */
  --text: #241a2e;
  --text-soft: #554b62;
  --paper: #ffffff;
  --paper-tint: #f7f3fb;
  --lav: #efe7f8;
  --line: #e2dbec;
  --bar-height: 62px;
  --hero-field:
    radial-gradient(60% 80% at 0% 0%, rgba(53,223,228,.2) 0%, rgba(53,223,228,0) 62%),
    radial-gradient(55% 75% at 100% 100%, rgba(255,87,31,.26) 0%, rgba(255,87,31,0) 64%),
    linear-gradient(135deg, #2a0b45 0%, var(--purple) 58%, #5d1f91 100%);
  --font-display: "Anton", "Arial Narrow", system-ui, sans-serif;
  --font-body: "Hind", "Helvetica Neue", system-ui, sans-serif;
  --focus: var(--ink);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

/* Contain the document as well as the body. Reviews scroll inside their rail. */
html { overflow-x: hidden; scroll-behavior: auto; }

body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--paper);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

/* Generated builds add intrinsic width/height attributes. Width-driven sizing
   plus height:auto keeps every image at its true proportions. */
img { display: block; max-width: 100%; height: auto; }
.book-img { aspect-ratio: auto 774 / 900; height: auto; }

h1, h2, h3 {
  font-family: var(--font-display);
  font-weight: 400;               /* Anton has a single weight */
  text-transform: uppercase;
  letter-spacing: .01em;
  line-height: 1.02;
}

cite { font-style: italic; }

.wrap { max-width: 1160px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 640px) { .wrap { padding: 0 28px; } }

[id] { scroll-margin-top: calc(var(--bar-height) + 14px); }
.anchor-alias { display: block; height: 0; }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  padding: 10px 18px;
  background: var(--yellow); color: var(--ink);
  font-weight: 700;
}
.skip-link:focus { left: 8px; top: 8px; }

/* Focus color follows the background it sits on. */
:where(a, button, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.hero, .path-bar, .res-postrun, .coach-strip, .kit, .closing, .site-footer { --focus: #fff; }

/* ---------- Shared type ---------- */
.kicker {
  margin-bottom: 10px;
  color: var(--purple);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.section { padding: clamp(56px, 8vw, 88px) 0; }
.section-title { font-size: clamp(1.9rem, 4.4vw, 3rem); }
.section-lead { max-width: 44em; margin-top: 14px; color: var(--text-soft); font-size: 1.1rem; }
.text-link { color: var(--teal); font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.text-link:hover { color: var(--ink); }

/* ---------- The real book, sized by what you can actually see ----------
   The supplied 774x900 image has transparent margins around the paperback
   (visible art: x 118-613, y 53-838). The frame is the visible book's
   495:785 box; the image overflows it at its true proportions, so widths
   below describe the book a reader sees, not the empty canvas. */
.cover-frame {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 495 / 785;
}
.cover-frame > img {
  position: absolute;
  top: -6.75%;
  left: -23.84%;
  width: 156.36%;
  max-width: none;
  height: auto;
  pointer-events: none;
}

/* ---------- Hero header ---------- */
.hero-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 12px;
  padding-bottom: 4px;
}
.brand {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: inherit;
  font-family: var(--font-display);
  font-size: 1.08rem;
  letter-spacing: .04em;
  text-decoration: none;
  text-transform: uppercase;
}
.hero-header-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 16px 6px;
  border: 2px solid currentColor;
  border-radius: 999px;
  color: inherit;
  font-size: .95rem;
  font-weight: 700;
  text-decoration: none;
}

/* ---------- Title type shared by all three heroes ---------- */
.hero-title { min-width: 0; }
.hero-eyebrow {
  margin-bottom: 8px;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.3;
  text-transform: uppercase;
}
.hero h1 { line-height: .9; }
.h1-line { display: block; }
.hero-subtitle { margin-top: 10px; font-weight: 600; line-height: 1.3; }
.hero-subtitle-num { font-weight: 700; }

/* ---------- Free chapters action ---------- */
.hero-sample { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.hero-sample-ask { font-size: 1.02rem; font-weight: 600; line-height: 1.3; }
.sample-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 8px 10px 6px 18px;
  border: 2px solid currentColor;
  border-radius: 999px;
  color: inherit;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease;
}
.sample-btn-arrow {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--orange);
  color: var(--ink);
  line-height: 1;
}

/* ---------- The two choices (hero + closing) ---------- */
.doors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(10px, 2.4vw, 16px); }
.door {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  min-width: 0;
  padding: clamp(12px, 2.8vw, 18px);
  border: 3px solid var(--ink);
  border-radius: 14px;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 5px 5px 0 var(--orange);
  transition: transform .18s ease, box-shadow .18s ease;
}
.door:hover { transform: translate(-2px, -3px); box-shadow: 8px 9px 0 var(--orange); }
.door-resources { background: var(--teal-bright); }
.door-buy { background: var(--yellow); }
.door-eyebrow {
  font-size: clamp(.68rem, 2.4vw, .76rem);
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.2;
  text-transform: uppercase;
}
.door-title {
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 4.6vw, 1.7rem);
  letter-spacing: .01em;
  line-height: .95;
  text-transform: uppercase;
}
.door-text { font-size: clamp(.84rem, 2.6vw, .96rem); font-weight: 500; line-height: 1.35; }
.door-cue {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding-top: 4px;
  font-size: clamp(.86rem, 2.6vw, .96rem);
  font-weight: 700;
  line-height: 1.2;
}
.door-arrow {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ink);
  color: #fff;
  font-size: .95rem;
  line-height: 1;
  transition: transform .18s ease;
}
.door:hover .door-arrow { transform: translateY(3px); }
.doors-closing .door:hover .door-arrow { transform: translateY(-3px); }

/* ---------- Chris Lear, below the title and subtitle ---------- */
.hero-quote blockquote p { font-weight: 600; line-height: 1.35; }
.hero-quote figcaption { margin-top: 8px; font-size: clamp(.92rem, 2.4vw, 1.02rem); line-height: 1.35; }
.hero-quote figcaption strong { font-weight: 700; }

@keyframes book-settle {
  from { opacity: 0; transform: translateY(18px) rotate(-2deg); }
  to { opacity: 1; transform: none; }
}
@keyframes door-rise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

/* ==========================================================================
   HERO — Book Up Front
   The real paperback is the biggest thing on the first screen. It stands on
   its own on the night-purple field (no block or shape behind it) and the
   title, subtitle, Chris Lear quote, two choices, and sample action stack beside it.
   ========================================================================== */
.hero {
  --cover-h: clamp(460px, calc(100vh - 150px), 680px);
  position: relative;
  overflow: hidden;
  padding-bottom: 10px;
  background: var(--hero-field);
  color: #fff;
}
@supports (height: 100svh) {
  .hero { --cover-h: clamp(460px, calc(100svh - 150px), 680px); }
}
/* Cover-style color bar along the bottom edge. */
.hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 10px;
  background: linear-gradient(90deg, var(--teal-bright) 0 46%, var(--orange) 46% 54%, var(--yellow) 54% 100%);
}
.hero-header-link { border-color: rgba(255,255,255,.6); }
.hero-header-link:hover { background: rgba(255,255,255,.14); border-color: #fff; }

/* Phones: book and title side by side (book first, as on desktop), then the
   sample action, the two choices, and the quote. */
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
  grid-template-areas:
    "art title"
    "quote quote"
    "doors doors"
    "sample sample";
  column-gap: clamp(12px, 3vw, 24px);
  row-gap: 20px;
  align-items: center;
  padding-top: 8px;
  padding-bottom: 32px;
}
.hero-title { grid-area: title; }
.hero-eyebrow { color: var(--yellow); }
/* Sized from the column it sits in so "Consistency" fits at 320px. */
.hero h1 { font-size: 7.4vw; }
.hero-subtitle { color: #fff; font-size: clamp(1rem, 3.8vw, 1.5rem); line-height: 1.35; margin-top: 16px; }
.hero-subtitle-lead { display: block; color: var(--teal-bright); font-weight: 700; }
.hero-subtitle-audience { display: block; }
.hero-subtitle-num { color: var(--teal-bright); }

.hero-art { grid-area: art; display: flex; justify-content: center; min-width: 0; }
.hero-book { filter: drop-shadow(0 22px 24px rgba(10, 2, 20, .55)); }

.hero-sample { grid-area: sample; }
.sample-btn:hover { background: #fff; color: var(--ink); }

.doors { grid-area: doors; }

.hero-quote {
  grid-area: quote;
  max-width: 36em;
  padding: 2px 0 2px 16px;
  border-left: 5px solid var(--orange);
}
.hero-quote blockquote p { color: #fff; font-size: clamp(1.08rem, 3.2vw, 1.35rem); }
.hero-quote figcaption { color: rgba(255,255,255,.88); }
.hero-quote figcaption strong { color: var(--yellow); }

@media (min-width: 720px) {
  .hero-grid {
    grid-template-columns: minmax(0, 40fr) minmax(0, 60fr);
    grid-template-areas:
      "art title"
      "art quote"
      "doors doors"
      "sample sample";
    row-gap: 22px;
  }
  .hero-title { align-self: end; }
  .hero-sample { align-self: start; }
  .hero h1 { font-size: clamp(2.8rem, 7vw, 4.2rem); }
}

/* Desktop: the book takes the left half at nearly full screen height.
   Spacer rows above and below keep the right column together however tall
   the book is. */
@media (min-width: 960px) {
  .hero-grid {
    grid-template-columns: minmax(0, 46fr) minmax(0, 54fr);
    grid-template-rows: 1fr auto auto auto auto 1fr;
    grid-template-areas:
      "art ."
      "art title"
      "art quote"
      "art doors"
      "art sample"
      "art .";
    column-gap: clamp(36px, 4.5vw, 72px);
    row-gap: 22px;
    padding-top: 12px;
    padding-bottom: 44px;
  }
  .hero-title, .hero-sample { align-self: auto; }
  .hero-art { align-self: center; }
  .hero-art .cover-frame { width: min(100%, calc(var(--cover-h) * .6306)); }
  .hero h1 { font-size: clamp(3rem, 4.6vw, 4.5rem); }
  .hero-subtitle { max-width: 26em; }
}

/* Entrance: the book settles first, then both choices rise together. */
@media (prefers-reduced-motion: no-preference) {
  .hero-book { animation: book-settle .8s cubic-bezier(.2,.8,.2,1) .05s backwards; }
  .hero .door { animation: door-rise .6s cubic-bezier(.2,.8,.2,1) .25s backwards; }
}

/* ==========================================================================
   TWO-PATH BAR (JS reveals it after the hero doors leave the screen)
   ========================================================================== */
.path-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 60;
  border-bottom: 3px solid var(--orange);
  background: rgba(36, 9, 59, .97);
  color: #fff;
  transform: translateY(-110%);
  visibility: hidden;
  transition: transform .28s ease, visibility 0s linear .28s;
}
.path-bar[hidden] { display: none; }
.path-bar.is-shown { transform: none; visibility: visible; transition: transform .28s ease; }
.path-bar-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: calc(var(--bar-height) - 3px);
  padding-top: 8px;
  padding-bottom: 8px;
}
.path-bar-brand {
  margin-right: auto;
  color: #fff;
  font-family: var(--font-display);
  font-size: 1.1rem;
  letter-spacing: .03em;
  text-decoration: none;
  text-transform: uppercase;
}
/* Quiet text link to the signup; only where the bar has room. */
.path-bar-sample {
  display: none;
  align-items: center;
  min-height: 44px;
  padding: 0 8px;
  color: #fff;
  font-size: .95rem;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--orange);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}
.path-bar-sample:hover { color: var(--yellow); }
@media (min-width: 760px) { .path-bar-sample { display: inline-flex; } }
.path-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 8px 18px 6px;
  border: 2px solid var(--ink);
  border-radius: 10px;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: .03em;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform .15s ease, box-shadow .15s ease;
}
.path-link-resources { background: var(--teal-bright); }
.path-link-buy { background: var(--yellow); }
.path-link:hover { transform: translateY(-1px); }
.path-link[aria-current] {
  box-shadow: 3px 3px 0 var(--orange);
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}
@media (max-width: 599px) {
  .path-bar-brand { display: none; }
  .path-link { flex: 1 1 0; padding-left: 10px; padding-right: 10px; }
}

/* ==========================================================================
   PART HEADERS (shared by both paths)
   ========================================================================== */
.part-head {
  position: relative;
  overflow: hidden;
  padding: clamp(36px, 6vw, 64px) 0 clamp(28px, 4vw, 44px);
  border-bottom: 3px solid var(--ink);
  color: var(--ink);
}
/* Faint track-lane lines, a nod to the oval. */
.part-head::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(180deg, transparent 0 38px, rgba(35,10,59,.07) 38px 40px);
  pointer-events: none;
}
.part-head-resources { background-color: var(--teal-bright); }
.part-head-buy { background-color: var(--yellow); }
.part-head-inner {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(14px, 3vw, 34px);
  align-items: start;
}
.part-num {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: clamp(3.4rem, 14vw, 8.5rem);
  line-height: .8;
}
@supports (-webkit-text-stroke: 2px black) {
  .part-num { color: transparent; -webkit-text-stroke: 3px var(--ink); }
}
.part-kicker {
  margin-bottom: 8px;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.3;
  text-transform: uppercase;
}
.part-copy h2 { font-size: clamp(2.3rem, 7vw, 4.4rem); line-height: .92; }
.part-lead { max-width: 40em; margin-top: 12px; font-size: clamp(1.02rem, 2vw, 1.15rem); font-weight: 500; }
.jump-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.jump-list a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 16px 6px;
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  font-size: .95rem;
  font-weight: 700;
  text-decoration: none;
}
.jump-list a:hover { background: var(--ink); color: #fff; }

/* ==========================================================================
   PATH 1 — BOOK RESOURCES
   ========================================================================== */
.path-resources { padding-bottom: clamp(56px, 8vw, 88px); background: var(--paper); }
.res-grid { display: grid; gap: 20px; margin-top: 36px; }

.res {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
  padding: clamp(20px, 3vw, 30px);
  border: 3px solid var(--ink);
  border-radius: 18px;
  background: #fff;
  color: var(--ink);
  box-shadow: 6px 6px 0 var(--teal-bright);
}
.res h3 { font-size: clamp(1.6rem, 3.2vw, 2.3rem); }
.res-body { color: var(--text); font-size: 1.06rem; line-height: 1.55; }
.res-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag {
  display: inline-block;
  padding: 5px 10px 3px;
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.25;
  text-transform: uppercase;
}
.tag-key { background: var(--yellow); }

.res-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  margin-top: auto;
  padding: 12px 18px 10px;
  border: 3px solid var(--ink);
  border-radius: 12px;
  background: var(--teal-bright);
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1.12rem;
  letter-spacing: .02em;
  line-height: 1.05;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 4px 4px 0 var(--ink);
  transition: transform .15s ease, box-shadow .15s ease;
}
.res-cta:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ink); }

/* Feature: Post-run app. A compact full-width band: what it is on the left,
   the four routines you'll find inside on the right. Content sets the height. */
.res-postrun {
  display: grid;
  gap: 22px;
  align-items: center;
  background: linear-gradient(150deg, var(--purple-deep) 0%, var(--purple) 70%, #5d1f91 100%);
  color: #fff;
  box-shadow: 8px 8px 0 var(--teal-bright);
}
.postrun-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-width: 0; }
.res-postrun h3 { font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: .92; }
.res-postrun .res-body { max-width: 32em; color: rgba(255,255,255,.93); font-size: clamp(1.05rem, 1.8vw, 1.15rem); }
.res-postrun .tag { border-color: #fff; background: transparent; color: #fff; }
.res-postrun .tag-key { border-color: var(--orange); background: var(--orange); color: var(--ink); }
.res-postrun .res-cta { min-height: 56px; margin-top: 6px; font-size: 1.25rem; box-shadow: 5px 5px 0 var(--orange); }
.res-postrun .res-cta:hover { box-shadow: 8px 8px 0 var(--orange); }

.postrun-routines {
  min-width: 0;
  padding: clamp(16px, 3vw, 22px);
  border: 2px solid rgba(255,255,255,.5);
  border-radius: 14px;
  background: rgba(20, 4, 36, .35);
}
.postrun-routines-label {
  margin-bottom: 12px;
  color: var(--teal-bright);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.2;
  text-transform: uppercase;
}
.routine-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; list-style: none; }
.routine-list a { text-decoration: none; }
.routine-list a:hover { background: var(--lav); }
.routine {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 10px 12px 8px;
  border: 2px solid var(--ink);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 3.4vw, 1.4rem);
  line-height: 1;
  text-transform: uppercase;
}
.routine-level {
  align-self: flex-start;
  padding: 3px 8px 1px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.3;
}
.routine-red .routine-level { background: #e8352b; color: #fff; }
.routine-orange .routine-level { background: var(--orange); color: var(--ink); }
.postrun-routines-note { margin-top: 12px; color: rgba(255,255,255,.88); font-size: .98rem; line-height: 1.4; }

/* Mental skills: intro + two interview links */
.interviews { display: grid; gap: 14px; width: 100%; list-style: none; }
.interview {
  display: flex;
  flex-direction: column;
  gap: 6px;
  height: 100%;
  padding: 16px 18px 14px;
  border: 2px solid var(--ink);
  border-radius: 14px;
  background: var(--paper-tint);
  color: var(--ink);
  text-decoration: none;
  box-shadow: 4px 4px 0 var(--orange);
  transition: transform .15s ease, box-shadow .15s ease;
}
.interview:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--orange); }
.interview-event {
  color: var(--teal);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.interview strong {
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1;
  text-transform: uppercase;
}
.interview-text { color: var(--text); font-size: .98rem; line-height: 1.45; }
.interview-cue {
  margin-top: auto;
  padding-top: 4px;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: var(--orange);
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

/* Library + optional course */
.res-more-row { display: grid; gap: 16px; }
.res-more {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 18px 20px 16px;
  border: 3px solid var(--ink);
  border-radius: 16px;
  background: var(--paper-tint);
  color: var(--ink);
  text-decoration: none;
  transition: transform .15s ease, background-color .15s ease;
}
.res-more:hover { transform: translateY(-2px); background: #fff; }
.res-more-label {
  color: var(--text-soft);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.res-more strong {
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2.6vw, 1.7rem);
  font-weight: 400;
  line-height: 1.05;
  text-transform: uppercase;
}
.res-more > span:last-child { color: var(--text); font-size: 1rem; line-height: 1.45; }
.res-course { border-style: dashed; background: #fff; }
.res-course:hover { background: var(--paper-tint); }

@media (min-width: 640px) {
  .interviews { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .res-more-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 760px) {
  .res-postrun { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 32px; }
}
@media (min-width: 900px) {
  .res-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .res-postrun { grid-column: 1 / -1; }
  .res-mental {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    gap: 24px;
    align-items: start;
  }
  .res-mental-intro { display: flex; flex-direction: column; gap: 12px; }
  .res-more-row { grid-column: 1 / -1; }
}
@media (max-width: 899px) {
  .res-mental-intro { display: flex; flex-direction: column; gap: 12px; }
}

/* ==========================================================================
   PATH 2 — BUY THE BOOK
   ========================================================================== */
.path-buy { background: var(--paper); }
.buy-grid { display: grid; gap: 24px; margin-top: 36px; }
@media (min-width: 720px) { .buy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; } }

.buy-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 3px solid var(--ink);
  border-radius: 22px;
  background: #fff;
  color: var(--ink);
  box-shadow: 8px 8px 0 var(--yellow);
}
/* Books stand on a yellow shelf inside their own panel. Sized by width only. */
.buy-art {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  min-height: clamp(190px, 22vw, 240px);
  padding: 26px 20px 12px;
  border-bottom: 3px solid var(--ink);
  border-radius: 19px 19px 0 0;
  background:
    linear-gradient(to top, var(--yellow) 0 12px, var(--ink) 12px 15px, transparent 15px),
    var(--hero-field);
}
.buy-book-single { flex: none; width: 46%; max-width: 160px; filter: drop-shadow(0 12px 12px rgba(16,3,28,.4)); }

/* Seven real covers overlap as one centered fan. The cutout frames size
   visible artwork instead of the image's transparent margins. */
.fan {
  position: relative;
  flex: none;
  width: 100%;
  max-width: 460px;
  aspect-ratio: 1.7;
}
.fan-book {
  position: absolute;
  top: 50%;
  left: var(--fan-x);
  width: 30%;
  transform: translate(-50%, -50%) rotate(var(--fan-angle));
  transform-origin: 50% 70%;
  filter: drop-shadow(0 7px 7px rgba(16,3,28,.35));
}
.fan-outer-left { --fan-x: 26%; --fan-angle: -18deg; z-index: 1; }
.fan-middle-left { --fan-x: 34%; --fan-angle: -12deg; z-index: 2; }
.fan-inner-left { --fan-x: 42%; --fan-angle: -6deg; z-index: 3; }
.fan-center { --fan-x: 50%; --fan-angle: 0deg; z-index: 4; }
.fan-inner-right { --fan-x: 58%; --fan-angle: 6deg; z-index: 3; }
.fan-middle-right { --fan-x: 66%; --fan-angle: 12deg; z-index: 2; }
.fan-outer-right { --fan-x: 74%; --fan-angle: 18deg; z-index: 1; }

.buy-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: clamp(20px, 3vw, 30px);
}
.buy-eyebrow {
  padding: 5px 10px 3px;
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--yellow);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.buy-copy h3 { font-size: clamp(2rem, 4vw, 3rem); line-height: .95; }
.buy-copy p:not(.buy-eyebrow) { color: var(--text); font-size: 1.06rem; line-height: 1.55; }
.buy-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12px;
  row-gap: 2px;
  width: 100%;
  min-height: 66px;
  margin-top: auto;
  padding: 14px 14px 12px 18px;
  border: 3px solid var(--ink);
  border-radius: 14px;
  background: var(--yellow);
  color: var(--ink);
  text-decoration: none;
  box-shadow: 5px 5px 0 var(--ink);
  transition: transform .15s ease, box-shadow .15s ease;
}
.buy-copy p + .buy-cta { margin-top: auto; }
.buy-cta:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--ink); }
.buy-cta-label {
  grid-column: 1;
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.4vw, 1.5rem);
  letter-spacing: .02em;
  line-height: 1.05;
  text-transform: uppercase;
}
.buy-cta-save { grid-column: 1; font-size: .92rem; font-weight: 700; line-height: 1.25; }
.buy-cta-arrow {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--ink);
  color: var(--yellow);
  font-size: 1.4rem;
  line-height: 1;
}

.buy-sample {
  margin-top: 28px;
  color: var(--text);
  font-size: 1.06rem;
  font-weight: 600;
  text-align: center;
}
.buy-sample a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--teal);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.buy-sample a:hover { color: var(--ink); }

.coach-strip {
  margin-top: clamp(40px, 6vw, 60px);
  padding: clamp(40px, 6vw, 56px) 0;
  background: linear-gradient(115deg, #2c0c4a 0%, var(--purple) 60%, var(--purple-vivid) 100%);
  color: #fff;
}
.coach-strip-title { max-width: 18em; font-size: clamp(1.6rem, 3.6vw, 2.5rem); }
.coach-points { display: grid; gap: 20px; margin-top: 24px; list-style: none; }
.coach-points li {
  padding-top: 14px;
  border-top: 4px solid var(--yellow);
  color: rgba(255,255,255,.9);
  font-size: 1rem;
  line-height: 1.5;
}
.coach-points strong { display: block; margin-bottom: 4px; color: #fff; font-size: 1.08rem; }
@media (min-width: 680px) { .coach-points { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 28px; } }
@media (min-width: 1040px) { .coach-points { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ==========================================================================
   REVIEWS
   ========================================================================== */
.reviews { background: var(--lav); }

.reviews-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.rail-controls { display: flex; gap: 10px; }
.rail-controls[hidden] { display: none; }
.rail-btn {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 3px solid var(--ink);
  border-radius: 50%;
  background: #fff;
  color: var(--ink);
  font: 700 1.3rem/1 var(--font-body);
  cursor: pointer;
  box-shadow: 3px 3px 0 var(--ink);
  transition: background-color .15s ease, transform .15s ease;
}
.cik-kajabi-page .rail-btn { font: 700 1.3rem/1 var(--font-body); }
.rail-btn:hover:not(:disabled) { background: var(--yellow); transform: translate(-1px, -1px); }
.rail-btn:disabled { opacity: .4; cursor: default; box-shadow: none; }

.review-rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(258px, 84%);
  gap: 16px;
  margin: 0 -4px;
  padding: 4px 4px 22px;
  list-style: none;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 4px;
  scrollbar-color: var(--purple) transparent;
  scrollbar-width: thin;
}
@media (min-width: 700px) { .review-rail { grid-auto-columns: calc((100% - 16px) / 2); } }
@media (min-width: 1040px) { .review-rail { grid-auto-columns: calc((100% - 32px) / 3); } }
.review-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px 20px 18px;
  border: 2px solid var(--ink);
  border-radius: 16px;
  background: #fff;
  box-shadow: 4px 4px 0 var(--purple-vivid);
  scroll-snap-align: start;
}
.review-card:nth-child(3n+2) { box-shadow: 4px 4px 0 var(--orange); }
.review-card:nth-child(3n) { box-shadow: 4px 4px 0 var(--teal); }
.review-title { color: var(--purple); font-size: 1.02rem; font-weight: 700; line-height: 1.3; }
.stars { display: block; margin-bottom: 4px; color: var(--orange); letter-spacing: .12em; }
.review-card blockquote { color: var(--text); font-size: 1rem; line-height: 1.55; }
.review-by { margin-top: auto; color: var(--text-soft); font-size: .9rem; font-weight: 600; line-height: 1.35; }
.reviews-footnote { color: var(--text-soft); font-size: .95rem; }

/* ==========================================================================
   INSIDE THE BOOK
   ========================================================================== */
.inside { background: var(--paper); }
.keys-grid, .extras-grid { display: grid; gap: 24px; align-items: start; }
.keys-grid { margin-top: 34px; }
.extras-grid { margin-top: 24px; }
@media (min-width: 900px) {
  .keys-grid, .extras-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.keys-group,
.extra-card {
  --accent: var(--teal-bright);
  min-width: 0;
  border: 3px solid var(--ink);
  border-radius: 18px;
  background: #fff;
  color: var(--ink);
  box-shadow: 6px 6px 0 var(--accent);
}
.keys-group[data-accent="orange"], .extra-card { --accent: var(--orange); }
.keys-group[data-accent="purple"] { --accent: var(--purple); }
.keys-group[data-accent="yellow"] { --accent: var(--yellow); }
.extra-card-teams { --accent: var(--teal-bright); }

.keys-group h3,
.extra-card h3 {
  padding: 16px 18px 14px;
  border-bottom: 3px solid var(--ink);
  border-radius: 15px 15px 0 0;
  background: var(--accent);
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
}
/* The Kajabi layer forces heading color to inherit, so the purple band
   needs an equally specific override for white text. */
.cik-kajabi-page .keys-group[data-accent="purple"] h3 { color: #fff !important; }
.keys-range {
  display: block;
  margin-bottom: 4px;
  font-family: var(--font-body);
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.2;
}
.extra-card > p { padding: 16px 20px 0; color: var(--text); line-height: 1.55; }

.key-list { display: grid; gap: 2px; padding: 10px 10px 12px; list-style: none; }
.key summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 8px 8px;
  border-radius: 10px;
  cursor: pointer;
  list-style: none;
  transition: background-color .15s ease;
}
.key summary::-webkit-details-marker { display: none; }
.key summary:hover { background: var(--paper-tint); }
.key-num {
  display: grid;
  place-items: center;
  min-width: 44px;
  padding: 6px 6px 3px;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: var(--accent);
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1.15rem;
  line-height: 1;
}
.keys-group[data-accent="purple"] .key-num { color: #fff; }
.key-title {
  min-width: 0;
  font-family: var(--font-display);
  font-size: clamp(1.02rem, 1.6vw, 1.18rem);
  letter-spacing: .015em;
  line-height: 1.15;
  text-transform: uppercase;
}
.key-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px 4px;
  border: 2px solid var(--ink);
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}
.key-toggle::after { content: "+"; font-size: 1.1rem; line-height: .6; }
.key[open] .key-toggle { background: var(--ink); color: #fff; }
.key[open] .key-toggle::after { content: "−"; }
.key p {
  margin: 4px 8px 14px;
  padding: 14px 16px;
  border-left: 5px solid var(--accent);
  border-radius: 0 10px 10px 0;
  background: var(--paper-tint);
  color: var(--text);
  font-size: 1rem;
  line-height: 1.6;
}
@media (max-width: 479px) {
  .key summary { gap: 10px; padding: 8px 4px; }
  .key-toggle { width: 32px; height: 32px; justify-content: center; padding: 0; font-size: 0; letter-spacing: 0; }
  .key-toggle::after { font-size: 1.2rem; }
  .key p { margin-left: 2px; margin-right: 2px; }
}

/* ==========================================================================
   FREE SAMPLE (Kit, optional, 18+)
   ========================================================================== */
.kit {
  background: linear-gradient(125deg, var(--purple-deep), var(--purple) 62%, #6b2aa1);
  color: #fff;
}
/* #newsletter takes focus on arrival (tabindex="-1") so the next Tab goes
   into the form. The section itself needs no ring. */
.kit:focus, .kit:focus-visible { outline: none; }
.kit-copy { width: 100%; }
.kit .kicker { color: var(--teal-bright); }
.kit .section-lead { max-width: 52em; color: rgba(255,255,255,.9); }
.kit-alt { margin-top: 14px; color: #fff; font-size: 1.04rem; font-weight: 600; }
.kit-alt a { color: var(--yellow); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.kit-alt a:hover { color: #fff; }
.signup-age-notice {
  display: inline-block;
  margin-top: 20px;
  padding: 6px 14px 4px;
  border: 2px solid rgba(255,255,255,.75);
  border-radius: 999px;
  color: #fff;
  font-size: .92rem;
  font-weight: 700;
}
.kit-embed {
  margin-top: 16px;
  border: 3px solid var(--ink);
  border-radius: 18px;
  background: #fff;
  color: var(--text);
  box-shadow: 9px 9px 0 var(--orange);
}
.kit-embed noscript { display: block; padding: 18px; }
.kit-quote { margin-top: 28px; padding: 10px 0 4px 20px; border-left: 6px solid var(--teal-bright); }
.kit-quote blockquote { color: #fff; font-size: 1.24rem; line-height: 1.45; }
.kit-quote figcaption { margin-top: 8px; color: var(--teal-bright); font-size: 1rem; font-weight: 700; }

/* The live Kit embed keeps Kit's real fields, tags, validation, and submit
   behavior. These overrides only bring its presentation into the page system. */
.kit-embed-live {
  padding: 8px;
  background: #fff;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  overflow: hidden !important;
  font-family: var(--font-body) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] > div:first-child {
  grid-template-columns: minmax(0, 1fr) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] > div:first-child > .formkit-column:first-child {
  display: none !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] > div:first-child > .formkit-column:last-child {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 11px 14px !important;
  align-items: stretch !important;
  align-content: start !important;
  padding: 26px !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-fields {
  display: contents !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-alert,
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-field:has(fieldset.formkit-2033) {
  grid-column: 1 / -1 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-field,
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-submit {
  margin-bottom: 0 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-field:has(fieldset.formkit-2515) {
  display: none !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-background {
  background-color: var(--paper-tint) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-header h2 {
  color: var(--purple-deep) !important;
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  line-height: 1.02 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-subheader,
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-field,
.kit-embed-live .formkit-form[data-uid="5397103733"] label,
.kit-embed-live .formkit-form[data-uid="5397103733"] legend {
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-input {
  min-height: 56px !important;
  border: 3px solid var(--purple-deep) !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: var(--ink) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-input:focus {
  outline: 3px solid var(--teal-bright) !important;
  outline-offset: 2px !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] input[type="checkbox"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-submit {
  grid-column: 1 !important;
  display: grid !important;
  place-items: center !important;
  min-height: 92px !important;
  border: 3px solid var(--purple-deep) !important;
  border-radius: 14px !important;
  background: var(--yellow) !important;
  color: var(--purple-deep) !important;
  box-shadow: 6px 6px 0 var(--teal-bright) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(1.7rem, 2.4vw, 2rem) !important;
  font-weight: 400 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  transform: rotate(-.4deg) !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-submit > span {
  padding: 8px 16px !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  line-height: 1 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-submit:hover {
  background: #fff36a !important;
  box-shadow: 9px 9px 0 var(--teal-bright) !important;
  transform: translate(-2px, -2px) rotate(.1deg) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-image img {
  filter: drop-shadow(0 14px 14px rgba(51,16,80,.2)) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-image {
  background: transparent !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] fieldset.formkit-2033 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] fieldset.formkit-2033 legend {
  display: inline-block !important;
  width: auto !important;
  margin: 0 0 7px !important;
  padding: 8px 12px 7px !important;
  border: 2px solid var(--purple-deep) !important;
  border-radius: 7px !important;
  background: var(--teal-bright) !important;
  color: var(--purple-deep) !important;
  box-shadow: 3px 3px 0 var(--yellow) !important;
  font-family: var(--font-display) !important;
  font-size: 1.08rem !important;
  font-weight: 400 !important;
  letter-spacing: .025em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  transform: rotate(-.5deg) !important;
  grid-column: 1 / -1 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes {
  display: block !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid var(--purple-deep) !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--purple-deep) !important;
  box-shadow: 3px 3px 0 rgba(255,228,73,.82) !important;
  cursor: pointer !important;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes:hover {
  background: #fffdf0 !important;
  box-shadow: 5px 5px 0 var(--teal-bright) !important;
  transform: translate(-1px, -1px) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes:has(input:checked) {
  background: var(--teal-bright) !important;
  box-shadow: 5px 5px 0 var(--yellow) !important;
  transform: translate(-1px, -1px) scale(1.025) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  color: var(--purple-deep) !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  cursor: pointer !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes label::before {
  content: "" !important;
  position: static !important;
  box-sizing: border-box !important;
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  border: 3px solid var(--purple-deep) !important;
  border-radius: 5px !important;
  background: #fff !important;
  color: var(--yellow) !important;
  box-shadow: 2px 2px 0 var(--yellow) !important;
  font-family: var(--font-display) !important;
  font-size: 1rem !important;
  line-height: 18px !important;
  text-align: center !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes:has(input:checked) label::before {
  content: "✓" !important;
  background: var(--purple-deep) !important;
  box-shadow: 2px 2px 0 #fff !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes label:focus-visible {
  outline: 3px solid var(--orange) !important;
  outline-offset: 2px !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto !important;
  align-items: center !important;
  gap: 18px !important;
  grid-column: 2 !important;
  min-height: 92px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 14px 18px !important;
  border: 3px solid var(--purple-deep) !important;
  border-radius: 11px !important;
  background: var(--yellow) !important;
  color: var(--purple-deep) !important;
  box-shadow: 6px 6px 0 var(--teal-bright) !important;
  transform: rotate(.35deg) !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-card p {
  margin: 0 !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-title {
  grid-column: 1 !important;
  grid-row: 1 !important;
  color: var(--purple-deep) !important;
  font-family: var(--font-display) !important;
  font-size: 1.32rem !important;
  font-weight: 400 !important;
  letter-spacing: .025em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-go {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  padding-left: 0 !important;
  border-left: 0 !important;
  color: var(--purple-deep) !important;
  font-family: var(--font-display) !important;
  font-size: 1.5rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  transform: none !important;
}

@media (max-width: 640px) {
  .kit-embed-live .formkit-form[data-uid="5397103733"] fieldset.formkit-2033 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] > div:first-child > .formkit-column:last-child {
    grid-template-columns: 1fr !important;
    padding: 18px !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-submit,
  .kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-card {
    grid-column: 1 !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-card {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto !important;
    gap: 10px !important;
    padding: 14px 15px !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-title {
    grid-column: 1 !important;
    grid-row: 1 !important;
    font-size: 1.2rem !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] .kit-trust-go {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    display: block !important;
    padding-left: 0 !important;
    border-left: 0 !important;
    font-size: 1.35rem !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] fieldset.formkit-2033 legend {
    grid-column: 1 / -1 !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes label {
    gap: 7px !important;
    padding: 8px !important;
    font-size: .84rem !important;
  }
  .kit-embed-live .formkit-form[data-uid="5397103733"] .formkit-checkboxes label::before {
    flex-basis: 20px !important;
    width: 20px !important;
    height: 20px !important;
  }
  .kit-embed { margin-right: 6px; box-shadow: 6px 6px 0 var(--orange); }
}

/* ==========================================================================
   AUTHOR
   ========================================================================== */
.author { background: var(--paper); }
.author-grid { display: grid; gap: 40px; align-items: center; }
@media (min-width: 860px) { .author-grid { grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 56px; } }
.author-art { display: flex; justify-content: center; padding: 0 22px 22px 0; }
.author-photo {
  width: min(320px, 100%);
  height: auto;
  aspect-ratio: 4 / 5;
  border: 3px solid var(--ink);
  border-radius: 20px;
  object-fit: cover;
  object-position: center top;
  box-shadow: 10px 10px 0 var(--teal-bright), 20px 20px 0 var(--yellow);
  transform: rotate(-1.5deg);
}
.author-copy { color: var(--ink); }
.author-copy p { margin-top: 14px; color: var(--text); font-size: 1.06rem; }
.btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  margin-top: 22px;
  padding: 12px 20px 10px;
  border: 3px solid var(--ink);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1.1rem;
  letter-spacing: .02em;
  line-height: 1.05;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 4px 4px 0 var(--orange);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.btn-outline:hover { background: var(--paper-tint); transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--orange); }

/* ==========================================================================
   CLOSING — the same two paths
   ========================================================================== */
.closing {
  position: relative;
  padding: clamp(52px, 7vw, 76px) 0 clamp(60px, 8vw, 84px);
  background: var(--hero-field);
  color: #fff;
}
.closing::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 10px;
  background: linear-gradient(90deg, var(--teal-bright) 0 46%, var(--orange) 46% 54%, var(--yellow) 54% 100%);
}
.closing-title { margin-bottom: 24px; font-size: clamp(2rem, 5vw, 3.2rem); text-align: center; }
.doors-closing { max-width: 760px; margin: 0 auto; }

/* ---------- Footer ---------- */
.site-footer { padding: 32px 0; background: var(--night); color: rgba(255,255,255,.82); }
.footer-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 24px; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.site-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  color: rgba(255,255,255,.9);
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
}
.site-footer a:hover { color: var(--teal-bright); text-decoration: underline; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
  .door:hover, .res-cta:hover, .buy-cta:hover, .interview:hover, .res-more:hover,
  .btn-outline:hover, .path-link:hover, .rail-btn:hover:not(:disabled) { transform: none; }
  .door:hover .door-arrow { transform: none; }
}


/* Kajabi compatibility and reversible takeover. */
html, body { margin: 0 !important; padding: 0 !important; }
body > main { padding: 0 !important; margin: 0 !important; max-width: none !important; }
body > main > [data-content-for-index] { padding: 0 !important; margin: 0 !important; max-width: none !important; }
#section-header, #section-footer { display: none !important; }
.cik-kajabi-page { width: 100%; max-width: none; overflow: hidden; background: #fff; }
.cik-kajabi-page h1,
.cik-kajabi-page h2,
.cik-kajabi-page h3,
.cik-kajabi-page h4,
.cik-kajabi-page h5,
.cik-kajabi-page h6 { color: inherit !important; }
.cik-kajabi-page button, .cik-kajabi-page input, .cik-kajabi-page textarea, .cik-kajabi-page select { font: inherit; }
main [data-section-id]:has(.cik-kajabi-page) > .section,
main [data-section-id]:has(.cik-kajabi-page) .sizer { padding: 0 !important; margin: 0 !important; }
main [data-section-id]:has(.cik-kajabi-page) .container,
main [data-section-id]:has(.cik-kajabi-page) .row,
main [data-section-id]:has(.cik-kajabi-page) [id^="block-"],
main [data-section-id]:has(.cik-kajabi-page) .block { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; }
main [data-section-id]:has(.cik-kajabi-page) [id^="block-"] { flex: 0 0 100% !important; }


#site-footer{padding:20px;text-align:center;font:16px/1.6 Hind,sans-serif}#site-footer nav{display:flex;justify-content:center;gap:24px;flex-wrap:wrap}

/* ==========================================================================
   Bigger books in the buying panels
   ========================================================================== */
.buy-art { min-height: clamp(260px, 28vw, 320px); align-items: center; padding: 26px 24px 38px; }
.buy-book-single { width: 54%; max-width: 230px; }
