/* ============================================================
   WARM: members area (course portal, join, details, coach).
   Loaded after the page's own stylesheet. These pages were built
   on the original tokens, so most of the change is remapping
   them: the editorial serif and mono voices become Bricolage and
   Figtree, paper becomes cream, hairlines go warm. Component
   rules below add the rounded panels.
   ============================================================ */
.warm {
  --serif: var(--h-display);
  --mono:  var(--h-body);
  --ink:        #1A1612;
  --ink-2:      #26211B;
  --ink-line:   #33291F;
  --ink-line-2: #3A322A;
  --ink-line-3: #4A4036;
  --paper:      #F7F2EA;
  --paper-2:    #FFFFFF;
  --rule:       #E6DCCB;
  --ink-soft:   #4A433A;
  --ink-mute:   #6B6355;
  --ink-mute-2: #6B6355;
  --sand-text:  #CFC6B7;
  --sage:       #A99F8E;
  --sage-2:     #CFC6B7;
}
.warm h1, .warm h2, .warm h3 { font-family: var(--h-display); font-weight: 800; letter-spacing: -0.03em; }

/* ---------- Top bar: the site nav's cream bar ---------- */
.warm .cbar { background: var(--h-cream); color: var(--h-ink); border-bottom: 1px solid var(--h-line); min-height: 76px; padding-left: 24px; }
.warm .cbar .nav__mark { color: var(--h-ink); }
.warm .cbar__who { border-left: 0; padding: 0 24px; font-size: 14px; font-weight: 600; letter-spacing: 0; color: var(--h-mute); }
.warm .cbar__menu { align-self: center; margin-right: 16px; min-height: 44px; border-radius: 999px; background: var(--h-ember-d); font-size: 14px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.warm .cdemo { background: #FBE9E2; border-bottom: 0; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; }

/* ---------- Sign in: a white card on cream ---------- */
.warm .gate { background: var(--h-cream); color: var(--h-ink); min-height: calc(100vh - 76px); }
.warm .gate__inner { max-width: 560px; margin-top: 48px; padding: 48px 48px 52px; background: var(--h-card); border-radius: var(--h-radius); }
.warm .gate__title { font-size: clamp(34px, 4.6vw, 52px); letter-spacing: -0.03em; }
.warm .gate__body { color: var(--h-soft); }
.warm .gate__body a { color: var(--h-ember-d); text-decoration: underline; text-underline-offset: 3px; }
.warm .gate__body strong { color: var(--h-ink); font-weight: 700; }
.warm .gform__field span { font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--h-mute); }
.warm .gform input { padding: 14px 16px; border: 1.5px solid var(--h-line); border-radius: 14px; background: var(--h-cream); color: var(--h-ink); font-family: var(--h-body); }
.warm .gform input:focus { border-color: var(--h-ink); background: #fff; }
.warm .gform__link { font-family: var(--h-body); font-size: 15px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--h-ember-d); text-decoration: underline; text-underline-offset: 3px; }
.warm .gform__link:hover { color: var(--h-ink); }
.warm .gform__msg { color: var(--h-soft); }
.warm .gform__msg.is-err { color: var(--h-ember-d); }
.warm .gform__msg.is-ok { color: var(--h-ink); }

/* ---------- Portal shell: ink sidebar panel beside the content ---------- */
.warm .cshell { background: var(--h-cream); grid-template-columns: 320px minmax(0, 1fr); gap: 8px; padding: 16px 16px 24px; }
.warm .cside { top: 92px; height: calc(100vh - 108px); border: 0; border-radius: 28px; background: var(--h-ink); }
.warm .cside a, .warm .cside button, .warm .cside summary { padding: 8px 20px; border-bottom-color: #33291F; font-family: var(--h-body); font-size: 13px; line-height: 1.25; }
.warm .cside__group ul a { padding: 7px 20px 7px 48px; font-size: 12.5px; }
.warm .cside__num, .warm .cside__sub { font-size: 10.5px; font-weight: 600; letter-spacing: 0.02em; text-transform: none; }
/* No visible scrollbar: the rows are sized to fit a laptop screen, and on a
   shorter one the list still scrolls with the wheel or a swipe. */
.warm .cside { scrollbar-width: none; }
.warm .cside::-webkit-scrollbar { display: none; }
.warm .cside__num { margin-bottom: 0; }
.warm .cside__sub { margin-top: 2px; }
.warm .cside a:hover, .warm .cside button:hover, .warm .cside summary:hover { background: #26211B; }
.warm .cside a.is-current { background: #26211B; box-shadow: inset 3px 0 0 var(--ember); }
.warm .cbanner { margin: 0 0 16px; border: 0; border-radius: 20px; background: var(--h-ember-d); }
.warm .cbanner__tag { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; }

/* ---------- Chapter content ---------- */
.warm .chap { color: var(--h-ink); }
.warm .chap__title { letter-spacing: -0.03em; }
.warm .chap__dek { color: var(--h-soft); }
.warm .chap__note, .warm .md h4, .warm .vid__tag, .warm .minimum__tag, .warm .faqs__title, .warm .finish__tag, .warm .locked__tag, .warm .pbox__tag, .warm .dash-next__tag {
  font-family: var(--h-body); font-weight: 700; font-size: 13px; letter-spacing: 0.04em;
}
.warm .md code { border-radius: 6px; background: rgba(26, 22, 18, 0.07); }
.warm .md a { color: var(--h-ember-d); border-bottom-color: rgba(196, 60, 28, 0.4); }
.warm .md a:hover { color: var(--h-ink); border-bottom-color: var(--h-ink); }
.warm .vid, .warm .rec-start, .warm .rec-frame, .warm .rec-frame--demo { border: 0; border-radius: 24px; overflow: hidden; }
.warm .minimum { border: 0; border-radius: 24px; background: #fff; padding: 28px; }
.warm .minimum__tag { color: var(--h-ember-d); }
.warm .tick { border: 1.5px solid var(--h-ink); border-radius: 8px; background: #fff; }
.warm .tick:checked { background: var(--h-ember-d); border-color: var(--h-ember-d); }
.warm .master { border-radius: 20px; overflow: hidden; background: var(--h-ink); }
.warm .master .tick { background: transparent; }
.warm .master__count { font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.warm .master__bar { height: 5px; }
.warm .step { border: 0; border-radius: 24px; background: #fff; padding: 24px 24px 26px 0; }
.warm .step__num { border-right-color: var(--h-line); font-weight: 700; color: var(--h-mute); }
.warm .step__links a { font-family: var(--h-body); font-weight: 700; font-size: 14px; letter-spacing: 0; text-transform: none; color: var(--h-ember-d); border-bottom-color: rgba(196, 60, 28, 0.4); }
.warm .step__links a:hover { color: var(--h-ink); border-bottom-color: var(--h-ink); }
.warm .step__check { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; color: var(--h-mute); }
.warm .step.is-done { background: #fff; box-shadow: inset 0 0 0 2px var(--h-ember-d); }
.warm .step.is-done .step__num, .warm .step.is-done .step__check { color: var(--h-ember-d); }
.warm .step.is-done .step__num { border-right-color: var(--h-line); }
.warm .pbox { border: 0; border-radius: 20px; overflow: hidden; background: var(--h-ink); }
.warm .pbox__head { border-bottom-color: #33291F; }
.warm .pbox__copy { border-radius: 999px; }
.warm .pbox .prompt { background: var(--h-ink); }
.warm .pbox__note { background: #26211B; }
.warm .callout { border-radius: 24px; background: var(--h-ember-d); padding: 30px 32px; }
.warm .callout__title { letter-spacing: -0.03em; }
.warm .faqs { border-top-color: var(--h-line); }
.warm .faq { border-bottom-color: var(--h-line); }
.warm .faq summary { font-family: var(--h-display); font-weight: 700; font-size: 21px; letter-spacing: -0.02em; }
.warm .faq summary::after { font-family: var(--h-body); color: var(--h-ember-d); }
.warm .faq summary:hover { color: var(--h-ember-d); }
.warm .finish, .warm .locked { border-radius: 24px; }
.warm .finish { border: 0; background: #fff; padding: 28px; }
.warm .locked { border-color: #A99F8E; padding: 28px; }
.warm .finish .btn:disabled { background: var(--h-line); color: var(--h-mute); }
.warm .finish__next, .warm .locked__back, .warm .lib-back, .warm .dash-more {
  font-family: var(--h-body); font-weight: 700; font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--h-ember-d);
}
.warm .finish__next:hover, .warm .locked__back:hover, .warm .lib-back:hover, .warm .dash-more:hover { color: var(--h-ink); }
.warm .toast { border-radius: 999px; font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }

/* ---------- Lists: rounded rows keep the dark hover ---------- */
.warm .clist, .warm .dash-prog__list { border-top-color: var(--h-line); }
.warm .clist__row, .warm .dash-row, .warm .rec-row, .warm .lib-sk, .warm .lib-ev { border-radius: 16px; border-bottom-color: var(--h-line); }
.warm .clist__num, .warm .clist__state, .warm .dash-row__num, .warm .dash-row__state, .warm .rec-group__num, .warm .rec-group__count,
.warm .rec-row__date, .warm .rec-row__len, .warm .lib-group__count, .warm .lib-field span, .warm .lib-summary, .warm .dash-rec__meta, .warm .lib-sk__kicker, .warm .lib-ev__kicker {
  font-family: var(--h-body); font-weight: 600; font-size: 13px; letter-spacing: 0.02em; text-transform: none;
}
.warm .dash-next { border: 0; border-radius: 28px; }
.warm .dash-pair { border: 0; border-radius: 28px; overflow: hidden; gap: 8px; background: none; }
.warm .dash-rec, .warm .dash-ref { background: #fff; border: 0; border-radius: 28px; }
.warm .dash-ref__box { border: 1.5px solid var(--h-line); border-radius: 14px; background: var(--h-cream); }
.warm .lib-field input, .warm .lib-field select { border: 1.5px solid var(--h-line); border-radius: 14px; background: #fff; }
.warm .lib-field input:focus, .warm .lib-field select:focus { border-color: var(--h-ink); box-shadow: none; }

/* ---------- Phone ---------- */
@media (max-width: 899px) {
  .warm .cshell { grid-template-columns: minmax(0, 1fr); padding: 8px 12px 24px; }
  .warm .cside { top: 84px; max-height: calc(100vh - 92px); border-bottom: 0; border-radius: 24px; }
}
@media (max-width: 640px) {
  .warm .gate__inner { margin-top: 16px; padding: 32px 24px 36px; border-radius: 24px; }
  .warm .step { padding-right: 16px; }
}

/* ---------- Join, details and coach: cream page, white form card ----------
   These were dark split pages. Inside them the dark-ground tokens are
   flipped to their light equivalents, so every rule written for the dark
   page reads correctly on cream and white without being rewritten. */
.warm .join, .warm .details, .warm .coach {
  --paper:      #1A1612;
  --ink:        #F7F2EA;
  --ink-2:      #FFFFFF;
  --ink-line:   #E6DCCB;
  --ink-line-2: #E6DCCB;
  --ink-line-3: #D3C6B0;
  --sand-text:  #4A433A;
  --sage:       #6B6355;
  --sage-2:     #4A433A;
  --ember-lt:   #C43C1C;
  background: var(--h-cream); color: var(--h-ink); border-top: 0; min-height: 0;
}
.warm .join__grid, .warm .details__grid, .warm .coach__grid {
  max-width: var(--maxw); margin: 0 auto; padding: 24px 24px 48px; gap: 24px; min-height: 0;
  align-items: start;
}
.warm .join__col, .warm .details__col, .warm .coach__col { padding: 40px 16px; }
.warm .join__col--left, .warm .details__col--left, .warm .coach__col--left { border: 0; margin: 0; }
.warm .join__col--right, .warm .details__col--right, .warm .coach__col--right {
  padding: 48px; background: var(--h-card); border-radius: var(--h-radius); justify-content: flex-start;
}
.warm .join__title, .warm .details__title, .warm .coach__title { font-size: clamp(38px, 5vw, 64px); letter-spacing: -0.03em; }
.warm .join__body a, .warm .details__body a, .warm .coach__body a, .warm .tk + a { text-decoration: underline; text-underline-offset: 3px; }
.warm .join__who, .warm .join__ref, .warm .dstatus, .warm .jform__step, .warm .jform__restart, .warm .jopt__price, .warm .jform label, .warm .jform__legend,
.warm .dform label, .warm .dform__label, .warm .cform label, .warm .cform__legend {
  font-family: var(--h-body); font-weight: 700; font-size: 13px; letter-spacing: 0.04em; text-transform: none;
}
.warm .jform__opt, .warm .dform__opt { text-transform: none; letter-spacing: 0; font-weight: 500; }
.warm .join__steps li { font-family: var(--h-body); font-weight: 600; font-size: 14px; letter-spacing: 0; text-transform: none; }
.warm .jform input[type=text], .warm .jform input[type=email], .warm .jform input[type=tel], .warm .jform input[type=number], .warm .jform textarea,
.warm .dform input[type=text], .warm .dform input[type=email], .warm .dform input[type=tel], .warm .cform input {
  border: 1.5px solid var(--h-line); border-radius: 14px; padding: 14px 16px;
}
.warm .jform input:focus, .warm .jform textarea:focus, .warm .dform input:focus, .warm .cform input:focus { border-color: var(--h-ink); background: #fff; }
.warm .jform__check input, .warm .dform__check input { border-radius: 7px; border-width: 1.5px; background: #fff; }
.warm .jform__check input::after, .warm .dform__check input::after { background: var(--h-ember-d); border-radius: 3px; }
.warm .jform__check input:checked, .warm .dform__check input:checked { border-color: var(--h-ember-d); }
.warm .jform__error, .warm .dform__error { border-radius: 14px; border-color: var(--h-ember-d); color: var(--h-ember-d); }
.warm .jform__submit, .warm .dform__submit, .warm .cform__submit { justify-content: center; }
.warm .jform__submit:disabled, .warm .dform__submit:disabled, .warm .cform__submit:disabled { background: var(--h-line); color: var(--h-mute); opacity: 1; }
.warm .jopts { gap: 8px; background: none; border: 0; }
.warm .jform .jopt { border: 1.5px solid var(--h-line); border-radius: 18px; background: #fff; }
.warm .jform .jopt:hover { background: var(--h-cream); }
.warm .jopt:has(input:checked) { background: var(--h-cream); border-color: var(--h-ink); }
.warm .jopt:has(input:checked)::after { display: none; }
.warm .jopt::before { border-radius: 50%; border-width: 1.5px; background: #fff; }
.warm .jopt:has(input:checked)::before { background: var(--h-ember-d); border-color: var(--h-ember-d); }
.warm .jopt__name { font-weight: 700; font-size: 22px; letter-spacing: -0.02em; }
.warm .jopt__price { color: var(--h-ink); }
.warm .jopt:has(input:checked) .jopt__price { color: var(--h-ember-d); }
.warm .jseats { gap: 0; border: 1.5px solid var(--h-line); border-radius: 14px; overflow: hidden; background: #fff; }
.warm .jseats__btn { background: #fff; font-family: var(--h-body); }
.warm .jseats__btn:hover { background: var(--h-ember-d); }
.warm .jform .jseats input[type=number] { border-radius: 0; background: #fff; font-family: var(--h-body); font-weight: 700; }
.warm .jattendees { gap: 8px; background: none; border: 0; }
.warm .jattendee { border-radius: 18px; background: var(--h-cream); }
.warm .jprice { border: 0; border-radius: 18px; background: var(--h-cream); }
.warm .jprice__rows dd { font-family: var(--h-body); font-weight: 700; }
.warm .jterms__box { border: 1.5px solid var(--h-line); border-radius: 14px; }
.warm .jterms__list li::marker { font-family: var(--h-body); font-weight: 700; color: var(--h-ember-d); }
.warm .jterms__list b, .warm .jterms__agree b, .warm .jnext b { font-weight: 700; }
.warm .tk { border-radius: 6px; background: var(--h-ember-d); font-family: var(--h-body); font-weight: 700; letter-spacing: 0.02em; }
.warm .jnext li::before { font-family: var(--h-body); font-weight: 700; color: var(--h-ember-d); }
.warm .jdone__title, .warm .ddone__title, .warm .cform__done-title { font-weight: 800; letter-spacing: -0.03em; }
.warm .dform__fixed { font-family: var(--h-body); font-weight: 600; }
.warm .cform__scale-row { gap: 0; border: 1.5px solid var(--h-line); border-radius: 14px; overflow: hidden; background: #fff; }
.warm .cform__scale-row label { background: #fff; border-right: 1px solid var(--h-line); font-family: var(--h-body); font-weight: 700; text-transform: none; letter-spacing: 0; font-size: 16px; }
.warm .cform__scale-row label:last-child { border-right: 0; }
.warm .cform__scale-row label:hover { background: var(--h-cream); }
.warm .cform__scale-row label:has(input:checked) { background: var(--h-ember-d); color: #fff; }

@media (max-width: 860px) {
  .warm .join__grid, .warm .details__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .warm .join__grid, .warm .details__grid, .warm .coach__grid { padding: 8px 16px 32px; gap: 8px; }
  .warm .join__col, .warm .details__col, .warm .coach__col { padding: 28px 8px 20px; }
  .warm .join__col--right, .warm .details__col--right, .warm .coach__col--right { padding: 28px 20px; border-radius: 24px; }
}