/* =========================================================================
   lwc-core.css — the LiveWell Coaching design system, SITE-WIDE.

   WHY THIS EXISTS
   The 2026 homepage shipped its design system inside lwc-home.css, which is
   loaded by sections/lwc_hero.liquid — a homepage section. Two consequences:
     1. Every page without that hero (blog, library, login, store, page,
        member directory, 404 ...) rendered in the PURCHASED BASE THEME.
     2. The 37 tokens were scoped to .lwhp-root, so even where the file did
        load, nothing cascaded past the homepage wrapper.
   This file promotes the tokens to :root and dresses the structures Kajabi
   actually emits, so the design language reaches every page type.

   LOAD ORDER (snippets/global_head.liquid): kajabi core.css -> styles.css
   (base theme) -> THIS FILE -> lwc-home.css. Last wins; homepage sections
   keep their own more-specific rules and are unaffected.

   SCOPE DISCIPLINE — this file may style:
     typography, colour, borders, radii, shadows, spacing, form controls,
     buttons, and named page-type components.
   It must NOT touch layout primitives (.row, .col-*, flex/grid on the
   Bootstrap grid). Those come from Kajabi's core.css and are load-bearing on
   pages we cannot see, let alone test, before the event.
   ========================================================================= */

/* ============ TOKENS — mirrors .lwhp-root in lwc-home.css, values identical ============ */
:root {
  /* canvas (warm-paper family) */
  --lwhp-paper:      #F7F4EE;
  --lwhp-cream:      #FBF7EF;
  --lwhp-white:      #FFFFFF;
  /* field colors (full-bleed sections) */
  --lwhp-field-sky:  #BFDCF2;
  --lwhp-field-ink:  #16334C;
  --lwhp-field-ink2: #0F2537;
  /* ink scale */
  --lwhp-ink:        #16334C;   /* 11.87:1 on paper */
  --lwhp-body:       #3D5468;   /* 7.17:1 on paper */
  --lwhp-muted:      #5C7183;   /* 5.07:1 on white */
  --lwhp-on-dark:       rgba(255,255,255,.95);
  --lwhp-on-dark-body:  rgba(255,255,255,.80);
  --lwhp-on-dark-muted: rgba(255,255,255,.62);
  /* action blue (AA verified) */
  --lwhp-action:        #2E5F8A;   /* white text = 6.73:1 */
  --lwhp-action-hover:  #274F75;   /* 8.53:1 */
  --lwhp-action-active: #16334C;   /* 13.03:1 */
  --lwhp-link:          #35638F;   /* 6.30:1 white / 5.74:1 paper */
  /* the one warm accent */
  --lwhp-gold:       #F2C864;   /* ink on gold = 8.20:1 */
  --lwhp-gold-deep:  #D9A441;   /* strokes/sparkles only, never a text surface */
  /* helpers */
  --lwhp-sky:        #8FC6EE;
  --lwhp-mist:       #EAF1F7;
  --lwhp-mist-deep:  #DCE8F2;
  /* lines */
  --lwhp-line:        rgba(22,51,76,.10);
  --lwhp-line-strong: rgba(22,51,76,.22);
  /* radii */
  --lwhp-r-chip:  12px;
  --lwhp-r-card:  20px;
  --lwhp-r-panel: 28px;
  --lwhp-r-pill:  999px;
  /* shadows (the only three) */
  --lwhp-sh-ambient: 0 12px 32px rgba(22,51,76,.10);
  --lwhp-sh-card:    0 2px 8px rgba(22,51,76,.05);
  --lwhp-sh-press:   0 2px 0 rgba(22,51,76,.25);
  /* fonts */
  --lwhp-font-display: 'Poppins', 'Quicksand', sans-serif;
  --lwhp-font-body: 'Manrope', 'Poppins', sans-serif;
  /* spacing system v4 — 8px grid (4 allowed only inside components) */
  --sp-1: 8px;   --sp-2: 16px;  --sp-3: 24px;  --sp-4: 32px;
  --sp-5: 40px;  --sp-6: 48px;  --sp-8: 64px;  --sp-10: 80px;
  --sp-12: 96px; --sp-14: 112px;
  --lwhp-sec-pad:    clamp(3.5rem, 2.5rem + 4vw, 6rem);
  --lwhp-sec-pad-lg: clamp(4rem, 2.75rem + 5vw, 7rem);
  --lwhp-head-gap:   clamp(2.5rem, 2rem + 1.5vw, 3rem);
  --lwhp-cap: 48px;
  --lwhp-nav-h: 60px;
  /* motion — one easing across the whole site */
  --lwhp-ease: cubic-bezier(.22,.61,.36,1);
}
@media (min-width: 640px) { :root { --lwhp-nav-h: 64px; } }
@media (min-width: 900px) { :root { --lwhp-nav-h: 72px; } }

/* ============ BASE ============
   Element-level rules use :where() so they carry (0,0,0) specificity and any
   base-theme or section rule beats them. Intentional: this is a floor, not a
   fight. The homepage is untouched — its rules are all (0,1,0) or higher. */

*, *::before, *::after { box-sizing: border-box; }

body#encore-theme,
body {
  font-family: var(--lwhp-font-body);
  font-size: 16px;
  line-height: 1.65;
  color: var(--lwhp-body);
  background: var(--lwhp-paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
  line-height: 1.2;
  letter-spacing: -0.01em;
}
:where(h1) { font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem); }
:where(h2) { font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem); }
:where(h3) { font-size: clamp(1.3rem, 1.1rem + 1vw, 1.65rem); }
:where(h4) { font-size: 1.15rem; }
:where(h5, h6) { font-size: 1rem; letter-spacing: .02em; }

:where(p, li) { color: var(--lwhp-body); }
:where(a) { color: var(--lwhp-link); text-decoration: none; transition: color .3s var(--lwhp-ease); }
:where(a:hover) { color: var(--lwhp-action-hover); text-decoration: underline; text-underline-offset: 3px; }
:where(strong, b) { color: var(--lwhp-ink); font-weight: 600; }
:where(small) { color: var(--lwhp-muted); }
:where(hr) { border: 0; border-top: 1px solid var(--lwhp-line); margin: var(--sp-6) 0; }
:where(img, svg, video) { max-width: 100%; height: auto; }
:where(blockquote) {
  margin: var(--sp-4) 0;
  padding: var(--sp-3) var(--sp-4);
  border-left: 3px solid var(--lwhp-gold);
  background: var(--lwhp-cream);
  border-radius: 0 var(--lwhp-r-chip) var(--lwhp-r-chip) 0;
  color: var(--lwhp-ink);
  font-size: 1.05rem;
}
:where(code, kbd, samp) {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .9em;
  background: var(--lwhp-mist);
  color: var(--lwhp-ink);
  padding: .15em .4em;
  border-radius: 6px;
}
:where(pre) {
  background: var(--lwhp-field-ink);
  color: var(--lwhp-on-dark);
  padding: var(--sp-3);
  border-radius: var(--lwhp-r-card);
  overflow-x: auto;
}
:where(pre) code { background: none; color: inherit; padding: 0; }
:where(table) { width: 100%; border-collapse: collapse; margin: var(--sp-4) 0; }
:where(th) {
  text-align: left;
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
  border-bottom: 2px solid var(--lwhp-line-strong);
  padding: var(--sp-1) var(--sp-2);
}
:where(td) { border-bottom: 1px solid var(--lwhp-line); padding: var(--sp-1) var(--sp-2); }

::selection { background: var(--lwhp-gold); color: var(--lwhp-ink); }

/* Focus ring — one ring, everywhere, never removed. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--lwhp-action);
  outline-offset: 2px;
  border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============ BUTTONS ============
   Confirmed from snippets/element_button.liquid, which emits:
     class="btn btn--{style} btn--{size} btn--{width}"
   The schema allows exactly two styles — solid and outline. Sizes are
   small|medium|large, widths block|full. There is no .btn-primary in this
   theme; targeting one would be dead CSS. Skin only, never layout. */
.btn {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: .01em;
  border-radius: var(--lwhp-r-pill);
  padding: .85em 1.9em;
  border: 1px solid transparent;
  line-height: 1.25;
  cursor: pointer;
  text-decoration: none;
  transition: background-color .3s var(--lwhp-ease),
              color .3s var(--lwhp-ease),
              border-color .3s var(--lwhp-ease),
              box-shadow .3s var(--lwhp-ease),
              transform .12s var(--lwhp-ease);
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }

/* Solid — the action blue, with the homepage's press shadow. */
.btn--solid {
  background: var(--lwhp-action);
  color: #fff;
  box-shadow: var(--lwhp-sh-press);
}
.btn--solid:hover { background: var(--lwhp-action-hover); color: #fff; }
.btn--solid:active { background: var(--lwhp-action-active); box-shadow: none; }

/* Outline */
.btn--outline {
  background: transparent;
  color: var(--lwhp-action);
  border-color: var(--lwhp-line-strong);
}
.btn--outline:hover {
  background: var(--lwhp-mist);
  border-color: var(--lwhp-action);
  color: var(--lwhp-action-hover);
}

/* Light — used on dark fields by the base theme. */
.btn--light { background: var(--lwhp-white); color: var(--lwhp-ink); box-shadow: var(--lwhp-sh-press); }
.btn--light:hover { background: var(--lwhp-cream); color: var(--lwhp-ink); }

/* Sizes */
.btn--small  { font-size: .88rem; padding: .7em 1.5em; }
.btn--medium { font-size: 1rem; }
.btn--large  { font-size: 1.08rem; padding: 1em 2.3em; }
.btn--block, .btn--full { width: 100%; justify-content: center; }

/* On a dark field an outline button must invert or it disappears. */
.background-dark .btn--outline { color: var(--lwhp-on-dark); border-color: rgba(255,255,255,.35); }
.background-dark .btn--outline:hover { background: rgba(255,255,255,.10); color: #fff; border-color: rgba(255,255,255,.6); }

/* Submit inputs get the solid treatment — they carry no modifier class. */
input[type="submit"] {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  border-radius: var(--lwhp-r-pill);
  padding: .85em 1.9em;
  border: 1px solid transparent;
  background: var(--lwhp-action);
  color: #fff;
  box-shadow: var(--lwhp-sh-press);
  cursor: pointer;
  width: auto;
  transition: background-color .3s var(--lwhp-ease);
}
input[type="submit"]:hover { background: var(--lwhp-action-hover); }

/* ============ FORMS ============ */
:where(input[type="text"], input[type="email"], input[type="password"],
       input[type="tel"], input[type="url"], input[type="number"],
       input[type="search"], input[type="date"], select, textarea) {
  font-family: var(--lwhp-font-body);
  font-size: 1rem;
  color: var(--lwhp-ink);
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-chip);
  padding: .8em 1em;
  width: 100%;
  transition: border-color .3s var(--lwhp-ease), box-shadow .3s var(--lwhp-ease);
}
:where(input, select, textarea):focus {
  border-color: var(--lwhp-action);
  box-shadow: 0 0 0 3px rgba(46,95,138,.15);
  outline: none;
}
:where(input, textarea)::placeholder { color: var(--lwhp-muted); opacity: 1; }
:where(label) {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .9rem;
  color: var(--lwhp-ink);
  display: inline-block;
  margin-bottom: .4em;
}
:where(textarea) { min-height: 8em; resize: vertical; }
:where(fieldset) { border: 1px solid var(--lwhp-line); border-radius: var(--lwhp-r-card); padding: var(--sp-3); }
:where(legend) { font-family: var(--lwhp-font-display); font-weight: 600; color: var(--lwhp-ink); padding: 0 .5em; }

/* ============ KAJABI STRUCTURAL CHROME ============
   Typography and rhythm only. No grid properties. */
.section-title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
  letter-spacing: -0.01em;
}
.section-description { color: var(--lwhp-body); font-size: 1.05rem; }

/* Kajabi's .blank empty-state */
.blank {
  background: var(--lwhp-cream);
  border: 1px dashed var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-card);
  color: var(--lwhp-muted);
  padding: var(--sp-6) var(--sp-3);
  text-align: center;
}

/* Colour-scheme fields the base theme applies per section. */
.background-light  { background: var(--lwhp-paper); color: var(--lwhp-body); }
.background-dark   { background: var(--lwhp-field-ink); color: var(--lwhp-on-dark-body); }
.background-dark :where(h1,h2,h3,h4,h5,h6) { color: var(--lwhp-on-dark); }
.background-dark :where(p, li) { color: var(--lwhp-on-dark-body); }
.background-dark .section-title { color: var(--lwhp-on-dark); }
.background-dark .section-description { color: var(--lwhp-on-dark-body); }
.background-dark :where(a) { color: var(--lwhp-sky); }

/* =========================================================================
   COMPONENTS — targeted at the class names the base sections ACTUALLY emit.
   Vocabulary confirmed by reading sections/*.liquid and snippets/*.liquid;
   it is BEM with `__` element separators (.blog-listing__title, .pag__link).
   Do not guess selectors here — grep the section first, or the rule is dead
   CSS that silently does nothing.
   ========================================================================= */

/* ---- Kajabi's .sizer: the padding wrapper every section body sits in ---- */
.sizer { padding-block: var(--lwhp-sec-pad); }

/* ---- Section headers shared by products / directory / announcements ---- */
.products__header,
.member-directory__header,
.announcements__header { margin-bottom: var(--lwhp-head-gap); text-align: center; }
.products__title,
.member-directory__title,
.announcements__title,
.page__title,
.sales-page-body__title,
.blog-post-body__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.page__title,
.blog-post-body__title { font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); margin-bottom: var(--sp-2); }

/* ---- Empty states ---- */
.member-directory__no-results,
.announcements__no-results {
  background: var(--lwhp-cream);
  border: 1px dashed var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-card);
  color: var(--lwhp-muted);
  padding: var(--sp-6) var(--sp-3);
  text-align: center;
}

/* ---- BLOG LISTING CARD (snippets/blog_listing.liquid) ---- */
.blog-listing {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  overflow: hidden;
  height: 100%;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.blog-listing:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.blog-listing__media img { display: block; width: 100%; object-fit: cover; }
.blog-listing__content { padding: var(--sp-3); }
.blog-listing__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: 1.2rem;
  line-height: 1.3;
  color: var(--lwhp-ink);
  margin: 0 0 .5em;
}
.blog-listing__title a { color: inherit; }
.blog-listing__title a:hover { color: var(--lwhp-action); text-decoration: none; }
.blog-listing__data,
.blog-listing__date,
.blog-listing__comment-count {
  font-size: .8rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lwhp-muted);
}
.blog-listing__data { margin-bottom: .6em; }
.blog-listing__more {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  margin-top: var(--sp-2);
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .95rem;
  color: var(--lwhp-action);
}
.blog-listing__more:hover { color: var(--lwhp-action-hover); text-decoration: none; gap: .65em; }

/* ---- TAGS (blog listing + post body) ---- */
.blog-listing__tags,
.blog-post-body__tags { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: var(--sp-2); }
.tag {
  display: inline-flex;
  align-items: center;
  padding: .3em .85em;
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-mist);
  border: 1px solid var(--lwhp-mist-deep);
  color: var(--lwhp-action);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .02em;
  transition: background-color .3s var(--lwhp-ease);
}
.tag:hover { background: var(--lwhp-mist-deep); color: var(--lwhp-action-hover); text-decoration: none; }

/* ---- BLOG POST BODY (long-form prose) ---- */
.blog-post-body__info {
  display: flex; flex-wrap: wrap; gap: var(--sp-2);
  font-size: .85rem; letter-spacing: .06em; text-transform: uppercase;
  color: var(--lwhp-muted);
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--lwhp-line);
  margin-bottom: var(--sp-4);
}
.blog-post-body__content,
.page__content,
.sales-page-body__body,
.thank-you__text {
  color: var(--lwhp-body);
  font-size: 1.06rem;
  line-height: 1.75;
}
.blog-post-body__content > * + *,
.page__content > * + * { margin-top: var(--sp-3); }
.blog-post-body__content :where(h2),
.page__content :where(h2) { margin-top: var(--sp-6); }
.blog-post-body__content :where(h3),
.page__content :where(h3) { margin-top: var(--sp-4); }
.blog-post-body__content :where(ul, ol),
.page__content :where(ul, ol) { padding-left: 1.4em; }
.blog-post-body__content :where(li) + :where(li),
.page__content :where(li) + :where(li) { margin-top: .5em; }
.blog-post-body__content :where(img),
.page__content :where(img) { border-radius: var(--lwhp-r-card); box-shadow: var(--lwhp-sh-card); }

/* ---- PRODUCT CARD (snippets/product.liquid — the member library) ---- */
.product {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.product:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.product__image img { display: block; width: 100%; object-fit: cover; }
.product__body,
.product__content { padding: var(--sp-3); flex: 1 1 auto; }
.product__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: 1.12rem;
  line-height: 1.3;
  color: var(--lwhp-ink);
  margin: 0 0 .4em;
}
.product__info { color: var(--lwhp-body); font-size: .95rem; }
.product__button { padding: 0 var(--sp-3) var(--sp-3); }

/* ---- STORE / OFFER CARD (snippets/offer_card.liquid) ---- */
.store-card {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  overflow: hidden;
  height: 100%;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.store-card:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.store-card__body { padding: var(--sp-3); }
.store-card__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600; font-size: 1.12rem; color: var(--lwhp-ink);
  margin: 0 0 .4em; line-height: 1.3;
}
.store-card__description { color: var(--lwhp-body); font-size: .95rem; }
.store-card__price {
  font-family: var(--lwhp-font-display);
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--lwhp-action);
  margin-top: var(--sp-2);
}

/* ---- MEMBER CARD (snippets/member.liquid) ---- */
.member {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-3);
  text-align: center;
  height: 100%;
}
.member img { border-radius: var(--lwhp-r-pill); }
.member__name {
  font-family: var(--lwhp-font-display);
  font-weight: 600; font-size: 1.05rem; color: var(--lwhp-ink);
  margin: var(--sp-2) 0 .2em;
}
.member__location { color: var(--lwhp-muted); font-size: .88rem; }
.member__socials { display: flex; justify-content: center; gap: .6rem; margin-top: var(--sp-2); }
.member__social { color: var(--lwhp-action); }
.member__social:hover { color: var(--lwhp-action-hover); }
.member-directory__opt-in {
  background: var(--lwhp-cream);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  padding: var(--sp-3);
}

/* ---- SALES PAGE ---- */
.sales-page-body__video { border-radius: var(--lwhp-r-card); overflow: hidden; box-shadow: var(--lwhp-sh-ambient); }
.sales-page-body__title { font-size: clamp(1.8rem, 1.3rem + 2vw, 2.6rem); margin-bottom: var(--sp-3); }

/* ---- SIDEBAR (blog + newsletter) ---- */
.sidebar__block {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-3);
  margin-bottom: var(--sp-3);
}
.sidebar__block :where(h3, h4) {
  font-family: var(--lwhp-font-display);
  font-size: .82rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--lwhp-action);
  margin: 0 0 var(--sp-2);
}
.sidebar__block :where(ul) { list-style: none; padding: 0; margin: 0; }
.sidebar__block :where(li) + :where(li) { border-top: 1px solid var(--lwhp-line); }
.sidebar__block :where(li a) { display: block; padding: .55em 0; color: var(--lwhp-body); }
.sidebar__block :where(li a):hover { color: var(--lwhp-action); text-decoration: none; }

/* ---- PAGINATION (snippets/pagination.liquid — .pag, not .pagination) ---- */
.pag { display: flex; gap: .4rem; justify-content: center; align-items: center; list-style: none; padding: 0; margin: var(--sp-6) 0 0; flex-wrap: wrap; }
.pag__link {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 42px; height: 42px; padding: 0 .7em;
  border-radius: var(--lwhp-r-chip);
  border: 1px solid var(--lwhp-line);
  background: var(--lwhp-white);
  color: var(--lwhp-ink);
  font-weight: 600;
  transition: background-color .3s var(--lwhp-ease), border-color .3s var(--lwhp-ease), color .3s var(--lwhp-ease);
}
.pag__link:hover { background: var(--lwhp-mist); border-color: var(--lwhp-action); color: var(--lwhp-action); text-decoration: none; }
.pag__link--current { background: var(--lwhp-action); border-color: var(--lwhp-action); color: #fff; }
.pag__link--current:hover { background: var(--lwhp-action); color: #fff; }
.pag__link--disabled { opacity: .4; pointer-events: none; }

/* ---- AUTH PANELS — login, password reset, thank you ---- */
.section__overlay { background: var(--lwhp-paper); }
.thank-you__text { text-align: center; max-width: 60ch; margin-inline: auto; }

/* ---- FLASH MESSAGES (snippets/alert_messages.liquid) ----
   Real vocabulary is .flash-messages + .flash--success|--error + .flash-text.
   There is no .alert-* in this theme. */
.flash-messages {
  border-radius: var(--lwhp-r-chip);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--lwhp-line-strong);
  background: var(--lwhp-cream);
  color: var(--lwhp-ink);
  font-size: .96rem;
  margin-block: var(--sp-2);
}
.flash--success { background: #E8F3EC; border-color: #A8CDB6; }
.flash--error   { background: #FBECEC; border-color: #E0A9A9; }
.flash-text { color: inherit; }

/* ---- SHARED HELPERS (for the custom sections we author) ---- */
.lwc-wrap { width: min(1160px, 100% - 2.5rem); margin-inline: auto; }
.lwc-wrap--narrow { width: min(760px, 100% - 2.5rem); margin-inline: auto; }
.lwc-section { padding-block: var(--lwhp-sec-pad); }
.lwc-sechead { text-align: center; margin-bottom: var(--lwhp-head-gap); }
.lwc-eyebrow {
  font-family: var(--lwhp-font-display);
  font-weight: 600; font-size: .78rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--lwhp-action);
  margin: 0 0 .6em;
}
.lwc-lede { font-size: 1.12rem; color: var(--lwhp-body); max-width: 62ch; margin-inline: auto; }
.lwc-panel {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-panel);
  box-shadow: var(--lwhp-sh-ambient);
  padding: clamp(1.75rem, 1.25rem + 2vw, 2.75rem);
}
.lwc-visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* =========================================================================
   GLOBAL CHROME — buttons + navigation + mobile drawer.

   Ported from the .lwhp-root-scoped rules in lwc-home.css and unscoped, so
   the site header (which renders in layouts/theme.liquid, OUTSIDE the
   homepage's .lwhp-root wrapper) can use them on every page type.

   Values are byte-for-byte the homepage's. The homepage's own .lwhp-root
   copies are more specific and identical, so nothing shifts there.
   ========================================================================= */

/* ---- Buttons (the homepage pill family) ---- */
.lwhp-btn, .lwhp-btn:visited {
  background: var(--lwhp-action);
  color: #fff;
  font-family: var(--lwhp-font-body);
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  border-radius: var(--lwhp-r-pill);
  height: 52px;
  padding: 0 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--lwhp-sh-press);
  text-decoration: none;
  transition: background .3s ease-out,
              transform .15s cubic-bezier(.32,.94,.6,1),
              box-shadow .15s cubic-bezier(.32,.94,.6,1);
}
.lwhp-btn:hover { background: var(--lwhp-action-hover); color: #fff; text-decoration: none; }
.lwhp-btn:active { background: var(--lwhp-action-active); color: #fff; transform: translateY(2px); box-shadow: none; }
.lwhp-btn--ink, .lwhp-btn--ink:visited { background: var(--lwhp-field-ink); color: #fff; }
.lwhp-btn--ink:hover, .lwhp-btn--ink:active { background: var(--lwhp-field-ink2); color: #fff; }
.lwhp-btn--light, .lwhp-btn--light:visited { background: #fff; color: var(--lwhp-ink); }
.lwhp-btn--light:hover { background: var(--lwhp-mist); color: var(--lwhp-ink); }
.lwhp-btn--light:active { background: var(--lwhp-mist-deep); color: var(--lwhp-ink); }
.lwhp-btn--gold, .lwhp-btn--gold:visited { background: var(--lwhp-gold); color: var(--lwhp-ink); }
.lwhp-btn--gold:hover { background: #EFB63F; color: var(--lwhp-ink); }
.lwhp-btn--gold:active { background: var(--lwhp-gold-deep); color: var(--lwhp-ink); }
.lwhp-btn--sm { height: 40px; padding: 0 22px; font-size: 14px; }

/* ---- Sticky nav ---- */
.lwhp-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(247,244,238,.92);
  background: color-mix(in srgb, var(--lwhp-paper) 92%, transparent);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.lwhp-nav--scrolled { border-bottom: 1px solid var(--lwhp-line); box-shadow: var(--lwhp-sh-card); }
.lwhp-nav-wrap {
  max-width: 1200px;
  margin: 0 auto;
  height: var(--lwhp-nav-h);
  padding-inline: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.lwhp-nav-logo { display: inline-flex; align-items: center; min-height: 44px; }
.lwhp-nav-logoimg {
  height: 30px; width: auto; display: block;
  /* The Kajabi wordmark PNG has a baked WHITE background. Without this it
     renders as a white slab on the paper ground. Interim fix, carried over
     from lwc-home.css — the real fix is re-exporting a transparent PNG. */
  mix-blend-mode: multiply;
}
.lwhp-nav-logotext {
  font-family: var(--lwhp-font-display);
  font-weight: 700;
  font-size: 19px;
  color: var(--lwhp-ink);
  margin: 0;
  letter-spacing: -.01em;
}
.lwhp-nav-links { display: none; }
.lwhp-nav-link, .lwhp-nav-link:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 10px;
  font-weight: 600;
  font-size: 15px;
  color: var(--lwhp-ink);
  text-decoration: none;
}
.lwhp-nav-link:hover { color: var(--lwhp-ink); text-decoration: underline; text-underline-offset: 3px; }
.lwhp-nav-right { display: flex; align-items: center; gap: 16px; }
.lwhp-nav-login, .lwhp-nav-login:visited {
  display: none;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
  font-size: 15px;
  color: var(--lwhp-link);
  text-decoration: none;
}
.lwhp-nav-login:hover { color: var(--lwhp-link); text-decoration: underline; text-underline-offset: 3px; }
.lwhp-nav-right .lwhp-btn--sm { display: none; }
.lwhp-nav-burger {
  width: 44px; height: 44px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border-radius: 8px;
  background: none;
  border: 0;
  cursor: pointer;
  padding: 0;
}
.lwhp-nav-burger :where(span) {
  display: block;
  width: 22px; height: 2px;
  border-radius: 2px;
  background: var(--lwhp-ink);
}
@media (min-width: 480px) { .lwhp-nav-right .lwhp-btn--sm { display: inline-flex; } }
@media (min-width: 640px) {
  .lwhp-nav-wrap { padding-inline: 32px; }
  .lwhp-nav-logoimg { height: 36px; }
}
@media (min-width: 900px) {
  .lwhp-nav-wrap { padding-inline: 48px; }
  .lwhp-nav-logoimg { height: 44px; }
  .lwhp-nav-login { display: inline-flex; }
}
@media (min-width: 1140px) {
  .lwhp-nav-links { display: flex; align-items: center; gap: 4px; }
  .lwhp-nav-burger { display: none; }
}

/* ---- Mobile drawer + scrim ---- */
.lwhp-scrim {
  position: fixed;
  inset: 0;
  z-index: 55;
  background: rgba(15,37,55,.5);
  opacity: 0;
  visibility: hidden;
  border: 0;
  transition: opacity .3s ease-out, visibility 0s linear .3s;
}
.lwhp-scrim.lwhp-open { opacity: 1; visibility: visible; transition: opacity .3s ease-out; }
.lwhp-drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  z-index: 60;
  width: min(360px, 88vw);
  background: var(--lwhp-field-ink);
  padding: 72px 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow-y: auto;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform .35s var(--lwhp-ease), visibility 0s linear .35s;
}
.lwhp-drawer.lwhp-open { transform: none; visibility: visible; transition: transform .35s var(--lwhp-ease); }
.lwhp-drawer-close {
  position: absolute;
  top: 12px; right: 12px;
  width: 44px; height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--lwhp-on-dark);
  background: none;
  border: 0;
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
}
.lwhp-drawer-link, .lwhp-drawer-link:visited {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
  font-size: 18px;
  color: var(--lwhp-on-dark);
  text-decoration: none;
}
.lwhp-drawer-link:hover { color: var(--lwhp-on-dark); text-decoration: underline; text-underline-offset: 3px; }
.lwhp-drawer-div { height: 1px; background: rgba(255,255,255,.16); }
.lwhp-drawer .lwhp-btn--gold { width: 100%; }
body.lwhp-noscroll { overflow: hidden; }
@media (min-width: 1140px) { .lwhp-drawer, .lwhp-scrim { display: none; } }

/* =========================================================================
   CUSTOM PAGE-TYPE SECTIONS
   Markup authored in sections/lwc_page, lwc_blog_listings, lwc_blog_post,
   lwc_library. CSS grid throughout — no Bootstrap row/col dependency.
   ========================================================================= */

/* ---- Generic page body ---- */
.lwc-pagebody__head { margin-bottom: var(--lwhp-head-gap); }
.lwc-pagebody__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
  color: var(--lwhp-ink);
  line-height: 1.15;
  margin: 0 0 .35em;
}

/* ---- Blog index ---- */
.lwc-bloglist__heading,
.lwc-library__heading {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(1.9rem, 1.4rem + 2.2vw, 2.9rem);
  color: var(--lwhp-ink);
  line-height: 1.15;
  margin: 0 0 .35em;
}
.lwc-postgrid {
  display: grid;
  gap: var(--sp-3);
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.lwc-post {
  display: flex;
  flex-direction: column;
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  overflow: hidden;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.lwc-post:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.lwc-post__media { display: block; overflow: hidden; }
.lwc-post__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .5s var(--lwhp-ease); }
.lwc-post:hover .lwc-post__media img { transform: scale(1.03); }
.lwc-post__body { padding: var(--sp-3); display: flex; flex-direction: column; flex: 1 1 auto; }
.lwc-post__date {
  font-size: .78rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--lwhp-muted); margin: 0 0 .5em;
}
.lwc-post__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600; font-size: 1.2rem; line-height: 1.3;
  margin: 0 0 .5em;
}
.lwc-post__title a { color: var(--lwhp-ink); }
.lwc-post__title a:hover { color: var(--lwhp-action); text-decoration: none; }
.lwc-post__excerpt { color: var(--lwhp-body); font-size: .95rem; margin: 0 0 var(--sp-2); }
.lwc-post__tags { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 var(--sp-2); }
.lwc-post__more {
  margin-top: auto;
  font-family: var(--lwhp-font-display);
  font-weight: 600; font-size: .95rem;
  color: var(--lwhp-action);
}
.lwc-post__more:hover { color: var(--lwhp-action-hover); text-decoration: none; }

/* ---- Single post ---- */
.lwc-article__head { margin-bottom: var(--lwhp-head-gap); text-align: center; }
.lwc-article__date {
  font-size: .8rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--lwhp-muted); margin: 0 0 .8em;
}
.lwc-article__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(2rem, 1.4rem + 2.6vw, 3rem);
  color: var(--lwhp-ink);
  line-height: 1.15;
  margin: 0 0 .5em;
}
.lwc-article__tags { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin: 0; }
.lwc-article__media { margin: 0 0 var(--sp-5); }
.lwc-article__media img { display: block; width: 100%; border-radius: var(--lwhp-r-card); box-shadow: var(--lwhp-sh-ambient); }
.lwc-article__back { margin-top: var(--sp-6); padding-top: var(--sp-3); border-top: 1px solid var(--lwhp-line); }
.lwc-article__back a { font-family: var(--lwhp-font-display); font-weight: 600; color: var(--lwhp-action); }

/* ---- Member library ---- */
.lwc-libgrid {
  display: grid;
  gap: var(--sp-3);
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.lwc-lib {
  display: flex;
  flex-direction: column;
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  overflow: hidden;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.lwc-lib:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.lwc-lib__media { display: block; overflow: hidden; }
.lwc-lib__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.lwc-lib__body { padding: var(--sp-3); display: flex; flex-direction: column; flex: 1 1 auto; gap: .5rem; }
.lwc-lib__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600; font-size: 1.08rem; line-height: 1.3; margin: 0;
}
.lwc-lib__title a { color: var(--lwhp-ink); }
.lwc-lib__title a:hover { color: var(--lwhp-action); text-decoration: none; }
.lwc-lib__desc { color: var(--lwhp-body); font-size: .92rem; margin: 0; }
.lwc-lib__progress {
  height: 6px;
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-mist-deep);
  overflow: hidden;
}
.lwc-lib__progressfill {
  display: block; height: 100%;
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-action);
  transition: width .6s var(--lwhp-ease);
}
.lwc-lib__progresstext {
  font-size: .76rem; letter-spacing: .06em; text-transform: uppercase;
  color: var(--lwhp-muted); margin: 0;
}
.lwc-lib__cta { margin-top: auto; align-self: flex-start; }

/* ---- Announcements ---- */
.lwc-annlist__heading, .lwc-directory__heading {
  font-family: var(--lwhp-font-display); font-weight: 600;
  font-size: clamp(1.9rem, 1.4rem + 2.2vw, 2.9rem);
  color: var(--lwhp-ink); line-height: 1.15; margin: 0 0 .35em;
}
.lwc-anngrid { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.lwc-ann {
  background: var(--lwhp-white); border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card); box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-3); display: flex; flex-direction: column;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.lwc-ann:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.lwc-ann__product {
  font-family: var(--lwhp-font-display); font-weight: 600; font-size: .74rem;
  letter-spacing: .12em; text-transform: uppercase; color: var(--lwhp-action); margin: 0 0 .5em;
}
.lwc-ann__title { font-family: var(--lwhp-font-display); font-weight: 600; font-size: 1.15rem; line-height: 1.3; margin: 0 0 .35em; }
.lwc-ann__title a { color: var(--lwhp-ink); }
.lwc-ann__title a:hover { color: var(--lwhp-action); text-decoration: none; }
.lwc-ann__date { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--lwhp-muted); margin: 0 0 var(--sp-2); }
.lwc-ann__body { color: var(--lwhp-body); font-size: .95rem; margin-bottom: var(--sp-2); }
.lwc-ann__link { margin-top: auto; font-family: var(--lwhp-font-display); font-weight: 600; font-size: .95rem; color: var(--lwhp-action); }
.lwc-ann__link:hover { text-decoration: none; color: var(--lwhp-action-hover); }

/* ---- Blog search ---- */
.lwc-search__head { text-align: center; margin-bottom: var(--lwhp-head-gap); }
.lwc-search__terms {
  font-family: var(--lwhp-font-display); font-weight: 600;
  font-size: clamp(1.7rem, 1.3rem + 1.8vw, 2.4rem);
  color: var(--lwhp-ink); margin: 0 0 .3em;
}
.lwc-search__count { color: var(--lwhp-muted); font-size: .95rem; margin: 0; }
.lwc-searchlist { display: flex; flex-direction: column; gap: var(--sp-2); }
.lwc-searchitem {
  background: var(--lwhp-white); border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card); box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-3);
  transition: box-shadow .3s var(--lwhp-ease);
}
.lwc-searchitem:hover { box-shadow: var(--lwhp-sh-ambient); }
.lwc-searchitem__title { font-family: var(--lwhp-font-display); font-weight: 600; font-size: 1.15rem; margin: 0 0 .4em; }
.lwc-searchitem__title a { color: var(--lwhp-ink); }
.lwc-searchitem__title a:hover { color: var(--lwhp-action); text-decoration: none; }
.lwc-searchitem__body { color: var(--lwhp-body); font-size: .95rem; margin: 0 0 .6em; }
.lwc-searchitem__more { font-family: var(--lwhp-font-display); font-weight: 600; font-size: .92rem; color: var(--lwhp-action); }
.lwc-searchitem__more:hover { text-decoration: none; color: var(--lwhp-action-hover); }

/* ---- Member directory ---- */
.lwc-directory__optin {
  background: var(--lwhp-cream); border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card); padding: var(--sp-2) var(--sp-3);
  color: var(--lwhp-body); font-size: .95rem; margin-bottom: var(--sp-4); text-align: center;
}
.lwc-memgrid { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.lwc-mem {
  background: var(--lwhp-white); border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card); box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-3); text-align: center;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.lwc-mem:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.lwc-mem__avatar { width: 84px; height: 84px; border-radius: var(--lwhp-r-pill); object-fit: cover; margin: 0 auto var(--sp-2); display: block; }
.lwc-mem__name { font-family: var(--lwhp-font-display); font-weight: 600; font-size: 1rem; color: var(--lwhp-ink); margin: 0 0 .2em; }
.lwc-mem__location { color: var(--lwhp-muted); font-size: .85rem; margin: 0; }
.lwc-mem__socials { display: flex; justify-content: center; gap: .6rem; margin-top: var(--sp-2); }
.lwc-mem__social { color: var(--lwhp-action); }
.lwc-mem__social:hover { color: var(--lwhp-action-hover); }

/* ---- Thank you ---- */
.lwc-thanks__inner { text-align: center; }
.lwc-thanks__mark {
  width: 68px; height: 68px; border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-gold); color: var(--lwhp-ink);
  display: inline-flex; align-items: center; justify-content: center;
  margin-bottom: var(--sp-3); box-shadow: var(--lwhp-sh-ambient);
}
.lwc-thanks__body { margin-bottom: var(--sp-4); }
.lwc-thanks__body :where(h1) { margin-bottom: .3em; }
.lwc-thanks__cta { margin-inline: auto; }

/* ---- Shared empty state ---- */
.lwc-empty {
  grid-column: 1 / -1;
  background: var(--lwhp-cream); border: 1px dashed var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-card); color: var(--lwhp-muted);
  padding: var(--sp-6) var(--sp-3); text-align: center; margin: 0;
}

/* =========================================================================
   NEWSLETTER MASTHEAD — sections/lwc_newsletter_hero.liquid
   Owned by the lwc_newsletter_hero section. Everything is scoped under
   .lwc-nlhero, including the rules that dress the Kajabi form emitted by
   snippets/newsletter_form.liquid (.newsletter-form / .fields-wrapper /
   .form-group / .form-control / .form-btn). Scoping keeps the base theme's
   forms on every other page exactly as they are.
   ========================================================================= */

.lwc-nlhero { position: relative; }
.lwc-nlhero__inner { text-align: center; }

/* ---- Tones ---- */
.lwc-nlhero--paper { background: var(--lwhp-paper); }
.lwc-nlhero--mist  { background: var(--lwhp-mist); }
.lwc-nlhero--ink   { background: var(--lwhp-field-ink); }

/* ---- Logo art ---- */
.lwc-nlhero__logo { display: block; margin: 0 auto var(--sp-3); }
.lwc-nlhero__logo img {
  display: block;
  width: 88px;
  height: auto;
  margin: 0 auto;
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
}
.lwc-nlhero__logo--inline {
  display: inline-block;
  vertical-align: middle;
  margin: 0 .5rem 0 0;
}
.lwc-nlhero__logo--inline img {
  width: 44px;
  border-radius: var(--lwhp-r-chip);
}

/* ---- Type ---- */
.lwc-nlhero__eyebrow { margin-bottom: .7em; }
.lwc-nlhero__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(2rem, 1.4rem + 2.6vw, 3.1rem);
  color: var(--lwhp-ink);
  line-height: 1.15;
  margin: 0 0 .35em;
}
.lwc-nlhero__desc {
  font-size: 1.12rem;
  color: var(--lwhp-body);
  max-width: 56ch;
  margin: 0 auto;
}
.lwc-nlhero__desc :where(p) { margin: 0 0 .8em; }
.lwc-nlhero__desc :where(p:last-child) { margin-bottom: 0; }
.lwc-nlhero__custom :where(h1, h2, h3) { margin: 0 0 .35em; }

/* ---- The subscribe form ---- */
.lwc-nlhero__form {
  width: min(560px, 100%);
  margin: var(--sp-5) auto 0;
}
.lwc-nlhero__form .newsletter-form { margin: 0; }
.lwc-nlhero__form .fields-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-1);
}
.lwc-nlhero__form .fields-wrapper > * {
  flex: 1 1 220px;
  min-width: 0;
  margin: 0;
}
.lwc-nlhero__form .form-group { text-align: left; }
.lwc-nlhero__form .form-control {
  width: 100%;
  height: 52px;
  padding: 0 1.1em;
  border-radius: var(--lwhp-r-pill);
  border: 1px solid var(--lwhp-line-strong);
  background: var(--lwhp-white);
  color: var(--lwhp-ink);
  font-family: var(--lwhp-font-body);
  font-size: 1rem;
}
.lwc-nlhero__form .form-control:focus {
  border-color: var(--lwhp-action);
  box-shadow: 0 0 0 3px rgba(46,95,138,.15);
  outline: none;
}
.lwc-nlhero__form .form-btn {
  width: 100%;
  height: 52px;
  padding: 0 32px;
  border: 0;
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-action);
  color: #fff;
  font-family: var(--lwhp-font-body);
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  box-shadow: var(--lwhp-sh-press);
  transition: background .3s ease-out,
              transform .15s cubic-bezier(.32,.94,.6,1),
              box-shadow .15s cubic-bezier(.32,.94,.6,1);
}
.lwc-nlhero__form .form-btn:hover { background: var(--lwhp-action-hover); color: #fff; }
.lwc-nlhero__form .form-btn:active {
  background: var(--lwhp-action-active);
  transform: translateY(2px);
  box-shadow: none;
}
.lwc-nlhero__form .form-btn:focus-visible {
  outline: 3px solid var(--lwhp-action);  /* gold on paper is ~1.45:1 — invisible as a focus ring */
  outline-offset: 2px;
}

.lwc-nlhero__note {
  margin: var(--sp-2) 0 0;
  font-size: .88rem;
  color: var(--lwhp-muted);
}

/* ---- Deep blue tone: flip the text colours ---- */
.lwc-nlhero--ink .lwc-nlhero__eyebrow { color: var(--lwhp-gold); }
.lwc-nlhero--ink .lwc-nlhero__title { color: var(--lwhp-on-dark); }
.lwc-nlhero--ink .lwc-nlhero__desc,
.lwc-nlhero--ink .lwc-nlhero__desc :where(p, li) { color: var(--lwhp-on-dark-body); }
.lwc-nlhero--ink .lwc-nlhero__custom :where(h1, h2, h3) { color: var(--lwhp-on-dark); }
.lwc-nlhero--ink .lwc-nlhero__note { color: var(--lwhp-on-dark-muted); }
.lwc-nlhero--ink .lwc-nlhero__form :where(label) { color: var(--lwhp-on-dark); }
.lwc-nlhero--ink .lwc-nlhero__form .form-control { border-color: transparent; }
.lwc-nlhero--ink .lwc-nlhero__form .form-control:focus {
  border-color: var(--lwhp-gold);
  box-shadow: 0 0 0 3px rgba(242,200,100,.28);
}
.lwc-nlhero--ink .lwc-nlhero__form .form-btn {
  background: var(--lwhp-gold);
  color: var(--lwhp-ink);
}
.lwc-nlhero--ink .lwc-nlhero__form .form-btn:hover { background: #EFB63F; color: var(--lwhp-ink); }
.lwc-nlhero--ink .lwc-nlhero__form .form-btn:active { background: var(--lwhp-gold-deep); color: var(--lwhp-ink); }

/* ---- Wide enough for one line: field + button side by side ---- */
@media (min-width: 620px) {
  .lwc-nlhero__form .fields-wrapper { align-items: flex-end; }
  .lwc-nlhero__form .fields-wrapper > *:last-child { flex: 0 0 auto; }
  .lwc-nlhero__form .form-btn { width: auto; }
}

/* =========================================================================
   lwc_newsletter_post — single newsletter issue.
   Owned by sections/lwc_newsletter_post.liquid. Touches .lwc-nlpost* only.
   ========================================================================= */
.lwc-nlpost { overflow-wrap: break-word; }

.lwc-nlpost__back { margin: 0 0 var(--sp-4); }
.lwc-nlpost__back a {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .92rem;
  color: var(--lwhp-action);
}
.lwc-nlpost__back a:hover { color: var(--lwhp-action-hover); text-decoration: none; }

.lwc-nlpost__head { margin-bottom: var(--sp-5); }
.lwc-nlpost__rule {
  display: block;
  width: 44px;
  height: 3px;
  margin: 0 0 var(--sp-3);
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-gold);
}
.lwc-nlpost__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .35rem .5rem;
  margin: 0 0 var(--sp-2);
  font-size: .8rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lwhp-muted);
}
.lwc-nlpost__meta > * + *::before {
  content: "\00B7";
  margin-right: .5rem;
  color: var(--lwhp-line-strong);
}
.lwc-nlpost__title {
  font-family: var(--lwhp-font-display);
  font-weight: 700;
  font-size: clamp(1.9rem, 1.35rem + 2.2vw, 2.75rem);
  line-height: 1.15;
  color: var(--lwhp-ink);
  margin: 0;
}
.lwc-nlpost__tags {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: var(--sp-3) 0 0;
}

.lwc-nlpost__media { margin: 0 0 var(--sp-5); }
.lwc-nlpost__media img {
  display: block;
  width: 100%;
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-ambient);
}

.lwc-nlpost__body {
  color: var(--lwhp-body);
  font-size: 1.06rem;
  line-height: 1.75;
}
.lwc-nlpost__body > * + * { margin-top: var(--sp-3); }
.lwc-nlpost__body :where(h2) { margin-top: var(--sp-6); }
.lwc-nlpost__body :where(h3) { margin-top: var(--sp-4); }
.lwc-nlpost__body :where(ul, ol) { padding-left: 1.4em; }
.lwc-nlpost__body :where(li) + :where(li) { margin-top: .5em; }
.lwc-nlpost__body :where(img) {
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
}

.lwc-nlpost__foot {
  margin-top: var(--sp-8);
  padding: var(--sp-4);
  background: var(--lwhp-cream);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  text-align: center;
}
.lwc-nlpost__foothead {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.25;
  color: var(--lwhp-ink);
  margin: 0 0 .4em;
}
.lwc-nlpost__signoff {
  color: var(--lwhp-body);
  font-size: 1rem;
  max-width: 46ch;
  margin: 0 auto var(--sp-3);
}
.lwc-nlpost__cta { margin-inline: auto; }

.lwc-nlpost__comments {
  margin-top: var(--sp-8);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--lwhp-line);
}

@media (max-width: 599px) {
  .lwc-nlpost__foot { padding: var(--sp-3); }
}

/* =========================================================================
   LWC 404 — sections/lwc_404.liquid                        [block: lwc_404]

   Centred not-found page on the warm paper ground. One soft mist glow sits
   behind the copy so the page reads as a quiet dead end rather than an
   error dump. Own appended block; no rule above this line is touched.
   ========================================================================= */

.lwc-404 {
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  min-height: 60vh;
  background: var(--lwhp-paper);
  padding-block: calc(var(--lwhp-sec-pad-lg) + var(--sp-4));
  padding-inline: var(--sp-3);
}
.lwc-404::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(760px, 130%);
  aspect-ratio: 1;
  transform: translate(-50%, -56%);
  background: radial-gradient(circle, var(--lwhp-mist) 0%, transparent 68%);
  opacity: .8;
  pointer-events: none;
  z-index: 0;
}

.lwc-404__inner {
  position: relative;
  z-index: 1;
  width: min(620px, 100%);
  margin-inline: auto;
  text-align: center;
}

.lwc-404__code {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .95rem;
  letter-spacing: .34em;
  text-indent: .34em;
  text-transform: uppercase;
  color: var(--lwhp-muted);
  margin: 0 0 var(--sp-2);
}
.lwc-404__rule {
  display: block;
  width: 44px;
  height: 3px;
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-gold);
  margin: 0 auto var(--sp-4);
}

.lwc-404__heading {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(1.9rem, 1.4rem + 2.2vw, 2.9rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--lwhp-ink);
  margin: 0 0 var(--sp-2);
  text-wrap: balance;
}
.lwc-404__message {
  font-size: 1.08rem;
  line-height: 1.7;
  color: var(--lwhp-body);
  max-width: 46ch;
  margin: 0 auto;
}

.lwc-404__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2) var(--sp-3);
  margin-top: var(--sp-5);
}
.lwc-404__cta { flex: 0 0 auto; }
.lwc-404__link {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .98rem;
  color: var(--lwhp-action);
  padding-block: .35em;
}
.lwc-404__link:hover {
  color: var(--lwhp-action-hover);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.lwc-404__cta:focus-visible,
.lwc-404__link:focus-visible {
  outline: 2px solid var(--lwhp-action);
  outline-offset: 3px;
  border-radius: var(--lwhp-r-pill);
}

@media (max-width: 599px) {
  .lwc-404 {
    min-height: 0;
    padding-block: var(--lwhp-sec-pad);
  }
  .lwc-404__actions {
    flex-direction: column;
    gap: var(--sp-2);
  }
  .lwc-404__cta {
    width: 100%;
    max-width: 320px;
  }
}

/* =========================================================================
   BLOCK: lwc_newsletter_recent — compact "recent issues" strip
   Owner: sections/lwc_newsletter_recent.liquid. Appended block; do not edit
   rules above this comment.

   Sits directly under a newsletter post, so it must read as a footnote to
   that post rather than a second archive: a hairline top rule instead of a
   band, rows instead of cards, and no shadow anywhere. The optional grid
   variant gets a flat outlined card (border only) so it still sits below the
   real archive cards in the visual hierarchy.
   ========================================================================= */

.lwc-recent { padding-block: 0 var(--lwhp-sec-pad); }
.lwc-recent__inner {
  border-top: 1px solid var(--lwhp-line);
  padding-top: var(--sp-6);
}

.lwc-recent__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--sp-1) var(--sp-3);
  margin-bottom: var(--sp-3);
}
.lwc-recent__headtext { min-width: 0; }
.lwc-recent__heading {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(1.25rem, 1.05rem + .8vw, 1.6rem);
  line-height: 1.25;
  color: var(--lwhp-ink);
  margin: 0;
}
.lwc-recent__all {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .92rem;
  color: var(--lwhp-action);
  white-space: nowrap;
}
.lwc-recent__all:hover { color: var(--lwhp-action-hover); text-decoration: none; }

.lwc-recentlist { list-style: none; margin: 0; padding: 0; }
.lwc-recentlist--list { display: flex; flex-direction: column; }
.lwc-recentlist--list .lwc-recentitem + .lwc-recentitem { border-top: 1px solid var(--lwhp-line); }
.lwc-recentlist--grid {
  display: grid;
  gap: var(--sp-2);
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

.lwc-recentitem { margin: 0; }
.lwc-recentitem__link {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) 0;
  color: inherit;
  text-decoration: none;
}
.lwc-recentitem__link:hover { text-decoration: none; }
.lwc-recentitem__link:focus-visible {
  outline: 2px solid var(--lwhp-action);
  outline-offset: 3px;
  border-radius: var(--lwhp-r-chip);
}
.lwc-recentlist--grid .lwc-recentitem__link {
  flex-direction: column;
  align-items: stretch;
  gap: var(--sp-1);
  height: 100%;
  padding: var(--sp-2);
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  transition: border-color .3s var(--lwhp-ease);
}
.lwc-recentlist--grid .lwc-recentitem__link:hover { border-color: var(--lwhp-line-strong); }

.lwc-recentitem__media {
  display: block;
  flex: 0 0 auto;
  width: 64px;
  height: 64px;
  overflow: hidden;
  border-radius: var(--lwhp-r-chip);
  background: var(--lwhp-mist);
}
.lwc-recentitem__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lwc-recentlist--grid .lwc-recentitem__media { width: 100%; height: 120px; }

.lwc-recentitem__text {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  flex: 1 1 auto;
  min-width: 0;
}
.lwc-recentitem__date {
  font-size: .74rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lwhp-muted);
}
.lwc-recentitem__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: 1.02rem;
  line-height: 1.35;
  color: var(--lwhp-ink);
  transition: color .3s var(--lwhp-ease);
}
.lwc-recentitem__link:hover .lwc-recentitem__title { color: var(--lwhp-action); }
.lwc-recentitem__excerpt { font-size: .9rem; line-height: 1.5; color: var(--lwhp-body); }

.lwc-recentitem__arrow {
  flex: 0 0 auto;
  color: var(--lwhp-action);
  font-size: 1.05rem;
  line-height: 1;
  transition: transform .3s var(--lwhp-ease);
}
.lwc-recentitem__link:hover .lwc-recentitem__arrow { transform: translateX(3px); }

@media (max-width: 599px) {
  .lwc-recentitem__media { width: 52px; height: 52px; }
  .lwc-recentitem__arrow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .lwc-recentitem__link,
  .lwc-recentitem__title,
  .lwc-recentitem__arrow { transition: none; }
  .lwc-recentitem__link:hover .lwc-recentitem__arrow { transform: none; }
}
/* ===================== end lwc_newsletter_recent block ==================== */

/* =========================================================================
   LWC NEWSLETTER LISTINGS — sections/lwc_newsletter_listings.liquid
   Appended block. The cards themselves reuse .lwc-postgrid / .lwc-post
   defined above; only the archive chrome is new here — page heading, the
   search + topics row, the active-filter bar, and the card byline.
   Nothing above this comment is modified.
   ========================================================================= */
.lwc-nletter__heading {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(1.9rem, 1.4rem + 2.2vw, 2.9rem);
  color: var(--lwhp-ink);
  line-height: 1.15;
  margin: 0 0 .35em;
}

/* search + topics row */
.lwc-nletter__tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-4);
}
.lwc-nletter__search {
  display: flex;
  gap: .5rem;
  width: min(420px, 100%);
}
.lwc-nletter__input { flex: 1 1 auto; min-width: 0; }
.lwc-nletter__submit { flex: 0 0 auto; height: auto; min-height: 44px; }
.lwc-nletter__topics {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  margin: 0;
}
.lwc-nletter__topics-label {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lwhp-muted);
  margin-right: .2rem;
}

/* active search / tag filter bar */
.lwc-nletter__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-1) var(--sp-2);
  background: var(--lwhp-cream);
  border: 1px solid var(--lwhp-line);
  border-left: 3px solid var(--lwhp-gold);
  border-radius: var(--lwhp-r-card);
  padding: var(--sp-2) var(--sp-3);
  margin-bottom: var(--sp-4);
}
.lwc-nletter__filters-text {
  margin: 0;
  color: var(--lwhp-ink);
  font-size: .95rem;
}
.lwc-nletter__clear {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .9rem;
  color: var(--lwhp-action);
  white-space: nowrap;
}
.lwc-nletter__clear:hover { color: var(--lwhp-action-hover); text-decoration: none; }

/* archive grid — issue titles run long, so a wider minimum than .lwc-postgrid */
.lwc-nletter__grid { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.lwc-nletter__byline {
  font-size: .88rem;
  color: var(--lwhp-muted);
  margin: 0 0 var(--sp-1);
}

@media (max-width: 600px) {
  .lwc-nletter__search { width: 100%; }
  .lwc-nletter__filters { justify-content: flex-start; }
}

/* =========================================================================
   LWC LOGIN  —  sections/lwc_login.liquid            [block owner: lwc_login]

   The card, the ground and the copy are ours. The form inside it is NOT:
   snippets/block_login.liquid emits Kajabi's own auth markup and cannot be
   rewritten, so the rules below re-skin that markup SCOPED under
   .lwc-login__panel / .lwc-login__form. Nothing here leaks to other pages.

   One layout override is unavoidable: block_login opens with `.col-6`, which
   the base theme pins to width:50% above 768px. Inside a 460px card that
   halves the form, so it is reset — scoped to this section only.
   ========================================================================= */

.lwc-login {
  background: var(--lwhp-paper);
  display: flex;
  align-items: center;
  min-height: 58vh;
}
.lwc-login__inner { width: min(460px, 100% - 2.5rem); margin-inline: auto; }

.lwc-login__panel {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-panel);
  box-shadow: var(--lwhp-sh-ambient);
  padding: clamp(1.75rem, 1.25rem + 2vw, 2.5rem);
}

.lwc-login__head { text-align: center; margin-bottom: var(--sp-3); }
.lwc-login__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.1rem);
  line-height: 1.15;
  color: var(--lwhp-ink);
  margin: 0 0 .3em;
}
.lwc-login__sub { color: var(--lwhp-body); font-size: .98rem; margin: 0; }

/* ---- reset the base grid column the include opens with ---- */
.lwc-login__form > .col-6 {
  flex: none;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* ---- Kajabi auth markup, re-skinned in place ---- */
.lwc-login__panel .auth__content { text-align: left; }
.lwc-login__panel .auth__image { margin-bottom: var(--sp-3); text-align: center; }
.lwc-login__panel .auth__image .image { border-radius: var(--lwhp-r-card); }

.lwc-login__panel .auth__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.1rem);
  line-height: 1.15;
  color: var(--lwhp-ink);
  text-align: center;
  margin: 0 0 var(--sp-3);
}
/* our own heading is rendered above the form, so hide the include's */
.lwc-login__panel--titled .auth__title { display: none; }

.lwc-login__panel .auth__message {
  border-radius: var(--lwhp-r-chip);
  padding: var(--sp-2);
  margin: 0 0 var(--sp-2);
  font-size: .93rem;
}
.lwc-login__panel .alert--danger {
  color: #8A2020;
  background: #FBECEC;
  border: 1px solid #E0A9A9;
}

.lwc-login__panel .form-group { margin-bottom: var(--sp-2); }
.lwc-login__panel .auth__label {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .88rem;
  color: var(--lwhp-ink);
  display: inline-block;
  margin-bottom: .4em;
  text-align: left;
}
.lwc-login__panel .auth__field {
  font-family: var(--lwhp-font-body);
  font-size: 1rem;
  line-height: 1.4;
  display: block;
  width: 100%;
  padding: .8em 1em;
  color: var(--lwhp-ink);
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-chip);
  transition: border-color .3s var(--lwhp-ease), box-shadow .3s var(--lwhp-ease);
}
.lwc-login__panel .auth__field:focus {
  border-color: var(--lwhp-action);
  box-shadow: 0 0 0 3px rgba(46,95,138,.15);
  outline: none;
}

/* remember-me row: checkbox and its label sit on one line */
.lwc-login__panel input.boolean {
  width: auto;
  margin: 0 .55rem 0 0;
  accent-color: var(--lwhp-action);
  vertical-align: middle;
}
.lwc-login__panel input.boolean + .auth__label {
  margin-bottom: 0;
  font-family: var(--lwhp-font-body);
  font-weight: 500;
  font-size: .92rem;
  color: var(--lwhp-body);
  vertical-align: middle;
}

/* submit — the LiveWell pill, full width inside the card */
.lwc-login__panel .form-btn {
  font-family: var(--lwhp-font-body);
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  margin: var(--sp-1) 0 0;
  padding: 0 32px;
  color: #fff;
  border: 0;
  border-radius: var(--lwhp-r-pill);
  background: var(--lwhp-action);
  box-shadow: var(--lwhp-sh-press);
  transition: background .3s var(--lwhp-ease),
              transform .15s var(--lwhp-ease),
              box-shadow .15s var(--lwhp-ease);
}
.lwc-login__panel .form-btn:hover {
  background: var(--lwhp-action-hover);
  color: #fff;
  filter: none;
}
.lwc-login__panel .form-btn:active {
  background: var(--lwhp-action-active);
  transform: translateY(2px);
  box-shadow: none;
}
.lwc-login__panel .form-btn:focus-visible {
  outline: 2px solid var(--lwhp-ink);
  outline-offset: 3px;
}

.lwc-login__panel .auth__link { margin-top: var(--sp-3); text-align: center; }
.lwc-login__panel .auth__link a {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .92rem;
  color: var(--lwhp-action);
}
.lwc-login__panel .auth__link a:hover { color: var(--lwhp-action-hover); }

.lwc-login__foot {
  margin: var(--sp-3) 0 0;
  text-align: center;
  font-size: .93rem;
  color: var(--lwhp-muted);
}
.lwc-login__foot-link { font-weight: 600; color: var(--lwhp-action); }
.lwc-login__foot-link:hover { color: var(--lwhp-action-hover); }

@media (max-width: 480px) {
  .lwc-login__panel {
    padding: var(--sp-3) var(--sp-2);
    border-radius: var(--lwhp-r-card);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lwc-login__panel .form-btn { transition: none; }
  .lwc-login__panel .form-btn:active { transform: none; }
}

/* =========================================================================
   KAJABI BLOCK COMPONENTS
   Kajabi's generic `section` type drives about, contact, store, journal,
   corporate_wellness and ai_chat_test. It holds real content the client built
   in the editor, so the SECTION is never replaced — but the block_* snippets
   it renders had no design-system coverage at all, which is why those pages
   still read as the purchased theme.

   Class names verified against snippets/block_*.liquid. Skin only — never
   layout, never the Bootstrap grid those blocks position themselves with.
   ========================================================================= */

/* ---- auth (block_login, block_password_reset, block_password_edit) ---- */
.auth__content {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-panel);
  box-shadow: var(--lwhp-sh-ambient);
  padding: clamp(1.75rem, 1.25rem + 2vw, 2.75rem);
}
.auth__title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
  text-align: center;
  margin-bottom: var(--sp-3);
}
.auth__group { margin-bottom: var(--sp-2); }
.auth__label {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: .9rem;
  color: var(--lwhp-ink);
}
.auth__field {
  border: 1px solid var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-chip);
  background: var(--lwhp-white);
  color: var(--lwhp-ink);
}
.auth__field:focus { border-color: var(--lwhp-action); box-shadow: 0 0 0 3px rgba(46,95,138,.15); outline: none; }
.auth__link { color: var(--lwhp-link); font-weight: 600; }
.auth__message { color: var(--lwhp-muted); font-size: .92rem; }
.auth__image img { border-radius: var(--lwhp-r-card); }

/* ---- card (block_card) ---- */
.card {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  overflow: hidden;
  transition: box-shadow .3s var(--lwhp-ease), transform .3s var(--lwhp-ease);
}
.card:hover { box-shadow: var(--lwhp-sh-ambient); transform: translateY(-2px); }
.card__body { padding: var(--sp-3); }
.card__text { color: var(--lwhp-body); }
.card__price {
  font-family: var(--lwhp-font-display);
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--lwhp-action);
}
.card__footer { padding: 0 var(--sp-3) var(--sp-3); }

/* ---- pricing (block_pricing) ---- */
.pricing {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-panel);
  box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-4) var(--sp-3);
  text-align: center;
}
.pricing__heading, .pricing__name {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
}
.pricing__price {
  font-family: var(--lwhp-font-display);
  font-weight: 700;
  font-size: clamp(2rem, 1.6rem + 1.6vw, 2.75rem);
  color: var(--lwhp-action);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.pricing__info { color: var(--lwhp-muted); font-size: .92rem; }
.pricing__content { color: var(--lwhp-body); }

/* ---- feature (block_feature) ---- */
.feature__text { color: var(--lwhp-body); }
.feature :where(h2, h3, h4) { font-family: var(--lwhp-font-display); color: var(--lwhp-ink); }

/* ---- accordion (block_accordion) ---- */
.accordion {
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  background: var(--lwhp-white);
  overflow: hidden;
}
.accordion-title {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-ink);
  cursor: pointer;
}
.accordion-body { color: var(--lwhp-body); }

/* ---- image (block_image) ---- */
.image img { border-radius: var(--lwhp-r-card); }
.image__overlay-text {
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  color: var(--lwhp-on-dark);
  text-shadow: 0 2px 12px rgba(15,37,55,.45);
}

/* ---- event (block_event) ---- */
.event {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  box-shadow: var(--lwhp-sh-card);
  padding: var(--sp-3);
}
.event__title { font-family: var(--lwhp-font-display); font-weight: 600; color: var(--lwhp-ink); }
.event__date {
  font-size: .8rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--lwhp-action); font-weight: 600;
}
.event__description { color: var(--lwhp-body); }

/* ---- countdown (block_countdown) ---- */
.countdown__item {
  background: var(--lwhp-white);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-chip);
  padding: var(--sp-2);
  min-width: 72px;
  text-align: center;
}
.countdown__number {
  font-family: var(--lwhp-font-display);
  font-weight: 700;
  font-size: 1.9rem;
  color: var(--lwhp-ink);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.countdown__label {
  font-size: .72rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--lwhp-muted);
}

/* ---- media / audio (block_audio, block_multi_video) ---- */
.media__body { color: var(--lwhp-body); }
.audio {
  background: var(--lwhp-cream);
  border: 1px solid var(--lwhp-line);
  border-radius: var(--lwhp-r-card);
  padding: var(--sp-2);
}

/* ---- alert (block_form validation) ---- */
.alert {
  border-radius: var(--lwhp-r-chip);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--lwhp-line-strong);
  background: var(--lwhp-cream);
  color: var(--lwhp-ink);
  font-size: .95rem;
}
.alert--danger { background: #FBECEC; border-color: #E0A9A9; }
.disclaimer-text { color: var(--lwhp-muted); font-size: .82rem; }

/* =========================================================================
   RESTORED STOCK AFFORDANCES
   The first cut of the replacement sections dropped features the stock
   sections had — blog sidebar, member search, announcement search, and the
   resume-course action. Found by cross-check 24 Aug. These carry the layout
   for the restored markup.
   ========================================================================= */
.lwc-withside { display: grid; gap: var(--sp-4); align-items: start; }
/* The section header is a THIRD grid child. Without an explicit span it takes
   the 1fr column and pushes the post grid into the 300px sidebar track, which
   is what shipped on 24 Aug. It must span the full row. */
.lwc-withside > .lwc-sechead { grid-column: 1 / -1; }
@media (min-width: 900px) { .lwc-withside { grid-template-columns: minmax(0,1fr) 300px; } }
.lwc-main { min-width: 0; }
.lwc-side { min-width: 0; }
.lwc-directory__search,
.lwc-annlist__search { max-width: 460px; margin: 0 auto var(--sp-4); }
.lwc-library__resume { margin-bottom: var(--sp-4); display: flex; justify-content: center; }

/* ---- Advisor entry in the header (signed-in members) ----
   Wiring is lwc-page.js's site-wide click delegation on .lwhp-start-advisor;
   this is skin only. Sits left of "My library" and reads as an action, not a
   nav destination, without competing with the filled Log out button. */
.lwhp-nav-advisor, .lwhp-nav-advisor:visited {
  display: none;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--lwhp-line-strong);
  border-radius: var(--lwhp-r-pill);
  font-family: var(--lwhp-font-display);
  font-weight: 600;
  font-size: 14px;
  color: var(--lwhp-action);
  background: var(--lwhp-white);
  text-decoration: none;
  cursor: pointer;
  transition: background-color .3s var(--lwhp-ease), border-color .3s var(--lwhp-ease), color .3s var(--lwhp-ease);
}
.lwhp-nav-advisor:hover {
  background: var(--lwhp-mist);
  border-color: var(--lwhp-action);
  color: var(--lwhp-action-hover);
  text-decoration: none;
}
.lwhp-nav-advisor-icon { flex: 0 0 auto; }
@media (min-width: 900px) { .lwhp-nav-advisor { display: inline-flex; } }
