/* NeuroInclusive.UK — parent site (Oct 2026). "Lilac calm" scheme (from the Design canvas, palette 1d).
   Used by the marketing pages only; dashboards keep global.css. */

:root {
  --paper: #F7F6FB;
  --paper-2: #ECEAF5;
  --line: #DCD9EA;
  --ink: #23213A;
  --ink-2: #4C4965;
  --ink-3: #6A6783;
  --orange: #5646BA;
  --orange-dk: #42359A;
  --teal: #2C7169;
  --teal-bg: #DCEEEA;
  --white: #FFFFFF;
  --display: 'Bricolage Grotesque', 'Figtree', system-ui, sans-serif;
  --body: 'Figtree', system-ui, sans-serif;
  --wrap: 1120px;
  --prose: 40rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--body); font-size: 1.0625rem; line-height: 1.65;
}
img { max-width: 100%; display: block; }
a { color: var(--teal); text-underline-offset: 3px; }
a:hover { color: var(--ink); }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; border-radius: 4px; }

h1, h2, h3 { font-family: var(--display); font-weight: 600; line-height: 1.12; margin: 0 0 0.5em; letter-spacing: -0.015em; font-variation-settings: "opsz" 144; }
h1 { font-size: clamp(2.3rem, 5.2vw, 3.7rem); }
h2 { font-size: clamp(1.75rem, 3.4vw, 2.45rem); }
h3 { font-size: 1.3rem; font-variation-settings: "opsz" 36; letter-spacing: -0.005em; }
p { margin: 0 0 1em; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.prose { max-width: var(--prose); }
.lede { font-size: 1.22rem; line-height: 1.55; color: var(--ink-2); }
.muted { color: var(--ink-3); }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 12px; top: 12px; z-index: 50; background: var(--ink); color: var(--white); padding: 10px 16px; border-radius: 8px; }

/* ── Buttons ── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 600 1rem/1 var(--body); padding: 16px 26px; border-radius: 999px; border: 2px solid transparent; text-decoration: none; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.btn-primary { background: var(--orange); color: var(--white); }
.btn-primary:hover { background: var(--orange-dk); color: var(--white); }
.btn-quiet { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn-quiet:hover { background: var(--ink); color: var(--paper); }
.btn[aria-busy="true"] { opacity: .7; pointer-events: none; }
.btn-block { width: 100%; }

/* ── Header ── */
.site-head { border-bottom: 1px solid var(--line); background: var(--paper); position: sticky; top: 0; z-index: 20; }
.site-head .wrap { display: flex; align-items: center; justify-content: space-between; height: 68px; gap: 16px; }
.brand { font-family: var(--display); font-size: 1.25rem; color: var(--ink); text-decoration: none; letter-spacing: -0.01em; white-space: nowrap; }
.brand b { font-weight: 600; color: var(--teal); }
.nav { display: flex; align-items: center; gap: 28px; }
.nav a { color: var(--ink); text-decoration: none; font-size: 0.97rem; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--teal); }
.nav .btn { padding: 11px 18px; font-size: 0.94rem; }
.nav .btn-primary { color: var(--white); }
.menu { display: none; }
@media (max-width: 860px) {
  .nav { display: none; }
  .menu { display: block; position: relative; }
  .menu summary { list-style: none; cursor: pointer; padding: 10px 14px; border: 1.5px solid var(--ink); border-radius: 8px; font-weight: 600; font-size: 0.95rem; }
  .menu summary::-webkit-details-marker { display: none; }
  .menu[open] .menu-panel { display: flex; }
  .menu-panel { display: none; position: absolute; right: 0; top: 52px; flex-direction: column; gap: 4px; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: 10px; min-width: 230px; }
  .menu-panel a { padding: 10px 12px; color: var(--ink); text-decoration: none; border-radius: 8px; }
  .menu-panel a:hover { background: var(--paper-2); }
}

/* ── Sections ── */
.band { padding: 88px 0; }
.band-tight { padding: 56px 0; }
.band-sand { background: var(--paper-2); }
.band-ink { background: var(--ink); color: #DFDDEC; }
.band-ink h2, .band-ink h3 { color: var(--white); }
.band-ink a:not(.btn) { color: #A8DCD3; }
.rule { border: 0; border-top: 1px solid var(--line); margin: 0; }

/* ── Hero (home) ── */
.hero { padding: 72px 0 88px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 64px; align-items: center; }
.hero h1 { margin-bottom: 20px; }
.hero .lede { max-width: 33rem; margin-bottom: 28px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.hero-note { font-size: 0.92rem; color: var(--ink-3); margin-top: 16px; }
@media (max-width: 900px) { .hero-grid { grid-template-columns: 1fr; gap: 44px; } .hero { padding: 44px 0 64px; } }

/* The one bold element: a real assessment question, live on the page */
.try { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 28px; position: relative; }
.try-tag { display: inline-block; font-size: 0.82rem; font-weight: 600; color: var(--teal); background: var(--teal-bg); padding: 5px 10px; border-radius: 999px; margin-bottom: 16px; }
.try-q { font-family: var(--display); font-size: 1.35rem; line-height: 1.3; margin: 0 0 18px; font-variation-settings: "opsz" 36; }
.try-opts { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; }
.try-opts legend { position: absolute; left: -9999px; }
.try-opt { display: flex; gap: 12px; align-items: flex-start; text-align: left; width: 100%; font: inherit; font-size: 0.97rem; line-height: 1.45; color: var(--ink); background: var(--paper); border: 1.5px solid var(--line); border-radius: 10px; padding: 12px 14px; cursor: pointer; transition: border-color .15s, background .15s; }
.try-opt:hover { border-color: var(--teal); }
.try-opt[aria-pressed="true"] { border-color: var(--teal); background: var(--teal-bg); }
.try-dot { flex: 0 0 18px; height: 18px; border-radius: 50%; border: 2px solid var(--ink-3); margin-top: 2px; }
.try-opt[aria-pressed="true"] .try-dot { border-color: var(--teal); background: radial-gradient(var(--teal) 45%, transparent 50%); }
.try-out { margin-top: 18px; padding-top: 18px; border-top: 1px dashed var(--line); }
.try-out[hidden] { display: none; }
.try-out p { font-size: 0.98rem; color: var(--ink-2); }
.try-foot { font-size: 0.85rem; color: var(--ink-3); margin: 14px 0 0; }

/* ── Lists and blocks ── */
.familiar { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; }
.familiar li { padding: 18px 0 18px 30px; border-top: 1px solid var(--line); position: relative; font-size: 1.05rem; }
.familiar li::before { content: ""; position: absolute; left: 0; top: 27px; width: 12px; height: 2px; background: var(--orange); }
@media (max-width: 760px) { .familiar { grid-template-columns: 1fr; } }

.split { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 64px; align-items: start; }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; gap: 28px; } }

.steps { list-style: none; counter-reset: s; margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.steps li { counter-increment: s; }
.steps li::before { content: counter(s); display: block; font-family: var(--display); font-size: 2.6rem; line-height: 1; color: var(--orange); margin-bottom: 14px; }
.steps h3 { margin-bottom: 8px; }
.steps p { color: var(--ink-2); margin: 0; }
.steps-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px; }
.steps-5 li::before { font-size: 2rem; }
@media (max-width: 900px) { .steps, .steps-5 { grid-template-columns: 1fr; gap: 28px; } }

.tonight { background: var(--teal-bg); border-radius: 16px; padding: 32px 36px; }
.tonight h3 { color: var(--teal); }
.tonight p { margin: 0; font-size: 1.08rem; }

.ticks { list-style: none; margin: 0; padding: 0; }
.ticks li { padding: 10px 0 10px 32px; position: relative; border-bottom: 1px solid var(--line); }
.ticks li::before { content: ""; position: absolute; left: 4px; top: 18px; width: 12px; height: 7px; border-left: 2px solid var(--teal); border-bottom: 2px solid var(--teal); transform: rotate(-45deg); }

/* ── Units (catalogue) ── */
.units { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin-top: 36px; }
.unit { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 0 18px; padding: 24px 0; border-top: 1px solid var(--line); text-decoration: none; color: var(--ink); align-items: start; }
.unit:hover h3 { color: var(--teal); }
.unit-n { font-family: var(--display); font-size: 1.9rem; line-height: 1; color: var(--orange); }
.unit h3 { margin: 0 0 6px; font-size: 1.22rem; transition: color .15s; }
.unit p { margin: 0; font-size: 0.97rem; color: var(--ink-2); }
.unit-price { font-weight: 600; white-space: nowrap; padding-top: 2px; }
@media (max-width: 860px) { .units { grid-template-columns: 1fr; } }

.programme { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr); gap: 48px; align-items: center; background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 44px; }
.programme .price-big { font-family: var(--display); font-size: 3.2rem; line-height: 1; margin-bottom: 8px; }
@media (max-width: 860px) { .programme { grid-template-columns: 1fr; padding: 28px; gap: 24px; } }

/* ── Product page ── */
.crumbs { font-size: 0.92rem; color: var(--ink-3); margin-bottom: 22px; }
.crumbs a { color: var(--ink-3); }
.p-hero { padding: 56px 0 72px; }
.p-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr); gap: 56px; align-items: start; }
@media (max-width: 900px) { .p-grid { grid-template-columns: 1fr; gap: 32px; } }
.buybox { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 28px; position: sticky; top: 92px; }
.buybox .price-big { font-family: var(--display); font-size: 3rem; line-height: 1; }
.buybox .price-note { color: var(--ink-3); font-size: 0.92rem; margin: 6px 0 20px; }
.buybox .ticks li { font-size: 0.95rem; padding-top: 8px; padding-bottom: 8px; }
.buybox .ticks { margin-bottom: 22px; }
.buybox .alt { font-size: 0.93rem; color: var(--ink-2); margin: 16px 0 0; }
.buybox .msg { font-size: 0.92rem; color: var(--orange-dk); margin: 12px 0 0; }
.buybox .msg:empty { display: none; }
@media (max-width: 900px) { .buybox { position: static; } }

.two-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; margin-top: 28px; }
@media (max-width: 760px) { .two-lists { grid-template-columns: 1fr; gap: 28px; } }

.zoe { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 40px; align-items: start; }
.zoe-mark { width: 160px; height: 160px; border-radius: 50%; background: var(--paper-2); border: 1px solid var(--line); display: grid; place-items: center; font-family: var(--display); font-size: 3.4rem; color: var(--teal); }
.zoe blockquote { margin: 0 0 18px; font-family: var(--display); font-size: 1.45rem; line-height: 1.35; font-variation-settings: "opsz" 36; }
@media (max-width: 700px) { .zoe { grid-template-columns: 1fr; gap: 20px; } .zoe-mark { width: 96px; height: 96px; font-size: 2rem; } }

.faq { max-width: 46rem; margin-top: 24px; }
.faq details { border-top: 1px solid var(--line); padding: 4px 0; }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; padding: 16px 32px 16px 0; font-weight: 600; list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 4px; top: 12px; font-size: 1.4rem; color: var(--teal); }
.faq details[open] summary::after { content: "\2013"; }
.faq details p { color: var(--ink-2); padding-right: 32px; }

.guarantee { display: flex; gap: 20px; align-items: flex-start; max-width: 46rem; }
.guarantee-seal { flex: 0 0 64px; height: 64px; border-radius: 50%; border: 2px solid var(--teal); color: var(--teal); display: grid; place-items: center; font-family: var(--display); font-size: 1.3rem; }

.cta-end { text-align: left; }
.cta-end .hero-actions { margin-top: 28px; }

/* ── Footer ── */
.site-foot { padding: 48px 0 56px; font-size: 0.93rem; color: var(--ink-3); border-top: 1px solid var(--line); }
.site-foot .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; }
.site-foot nav { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.site-foot a { color: var(--ink-2); text-decoration: none; }
.site-foot a:hover { color: var(--teal); }

/* ── Forms (welcome page) ── */
.field { display: grid; gap: 8px; margin: 18px 0; max-width: 26rem; }
.field label { font-weight: 600; }
.field input { font: inherit; padding: 14px 16px; border-radius: 10px; border: 1.5px solid var(--line); background: var(--white); color: var(--ink); }
.field input:focus { border-color: var(--teal); outline: none; box-shadow: 0 0 0 3px var(--teal-bg); }
.notice { background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 22px 24px; max-width: 34rem; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
.steps-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
@media (max-width: 900px) { .steps-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .steps-4 { grid-template-columns: 1fr; } }
.launch { font-size: 0.93rem; font-weight: 600; color: var(--orange-dk); margin: 0 0 18px; }
.launch[hidden], [data-launch][hidden], [data-compare][hidden] { display: none !important; }

/* Global pricing: hide printed fallback prices until the visitor's currency is painted */
.ni-pricing [data-price], .ni-pricing [data-money], .ni-pricing [data-units-total], .ni-pricing [data-units-saving] { visibility: hidden; }
.currency-switch { font-size: .85rem; display: flex; align-items: center; gap: 6px; }
.currency-switch select { font: inherit; padding: 4px 8px; border: 1px solid rgba(35,33,58,.25); border-radius: 6px; background: #F7F6FB; color: #23213A; }

/* ── Unit cards (each card opens that unit's own funnel) ── */
.ucards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; margin-top: 36px; }
.ucard { background: var(--white); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; transition: transform .15s, box-shadow .15s; }
.ucard:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(35,33,58,.09); }
.ucard-art { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 10; color: var(--ink); }
.ucard-art svg { width: 58%; height: auto; }
.ucard-art .accent { color: var(--orange); stroke: var(--orange); }
.art-lamp, .art-moon { background: #F2E7D6; }
.art-clock, .art-school { background: var(--teal-bg); }
.art-talk, .art-people { background: #E6E1F6; }
.art-wave { background: #DCE6F3; }
.art-cup { background: #ECE9F2; }
.ucard-n { position: absolute; top: 12px; left: 12px; font: 600 .74rem/1 var(--body); letter-spacing: .06em; text-transform: uppercase; background: var(--paper); color: var(--ink); padding: 6px 9px; border-radius: 999px; }
.ucard-body { padding: 18px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.ucard h3 { font-size: 1.15rem; margin: 0 0 8px; line-height: 1.25; }
.ucard h3 a { color: var(--ink); text-decoration: none; }
.ucard h3 a::after { content: ""; }
.ucard h3 a:hover { color: var(--teal); }
.ucard p { font-size: .93rem; color: var(--ink-2); margin: 0 0 16px; flex: 1; }
.ucard-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); padding-top: 14px; }
.ucard-check { font-weight: 600; font-size: .9rem; color: var(--orange); text-decoration: none; }
.ucard-check::after { content: " →"; }
.ucard-check:hover { color: var(--orange-dk); text-decoration: underline; }
.ucard-price { font-weight: 600; }
@media (max-width: 1020px) { .ucards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ucards { grid-template-columns: 1fr; } .ucard-art { aspect-ratio: 16 / 7; } .ucard-art svg { width: 34%; } }

/* ── Free-check entry on unit pages ── */
.check-entry { display: block; margin-top: 26px; padding: 16px 18px; border: 1.5px dashed var(--orange); border-radius: 12px; text-decoration: none; color: var(--ink); max-width: 34rem; }
.check-entry strong { display: block; color: var(--orange-dk); margin-bottom: 4px; }
.check-entry span { color: var(--ink-2); font-size: .95rem; }
.check-entry:hover { background: #FFF; }

/* ── Free check pages ── */
.eyebrow { font: 600 .78rem/1.2 var(--body); letter-spacing: .08em; text-transform: uppercase; color: var(--teal); margin: 0 0 10px; }
.check-intro { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.check-areas { background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 24px; }
.check-areas ul { list-style: none; margin: 0; padding: 0; counter-reset: a; }
.check-areas li { counter-increment: a; padding: 10px 0; border-top: 1px solid var(--line); display: flex; gap: 12px; }
.check-areas li:first-child { border-top: 0; }
.check-areas li::before { content: counter(a); font-family: var(--display); color: var(--orange); min-width: 1.2em; }
.check-run { padding: 56px 0 80px; min-height: 60vh; }
.check-narrow { max-width: 42rem; }
.ck-progress { height: 6px; background: var(--paper-2); border-radius: 99px; overflow: hidden; margin-bottom: 18px; }
.ck-progress span { display: block; height: 100%; width: 0; background: var(--teal); transition: width .3s; }
.ck-count { font-size: .88rem; color: var(--ink-3); margin: 0 0 10px; }
.ck-q { font-size: clamp(1.4rem, 3vw, 1.9rem); line-height: 1.25; margin: 0 0 26px; outline: none; }
.ck-opts { display: grid; gap: 12px; }
.ck-opt { text-align: left; font: 500 1rem/1.4 var(--body); padding: 16px 18px; border: 1.5px solid var(--line); border-radius: 12px; background: var(--white); color: var(--ink); cursor: pointer; transition: border-color .15s, background .15s; }
.ck-opt:hover { border-color: var(--teal); }
.ck-opt[aria-pressed="true"] { border-color: var(--teal); background: var(--teal-bg); }
.ck-back { margin-top: 22px; background: none; border: 0; color: var(--ink-2); font: inherit; text-decoration: underline; cursor: pointer; padding: 0; }
.ck-form { display: grid; gap: 8px; margin-top: 18px; }
.ck-form label { font-weight: 600; font-size: .92rem; margin-top: 8px; }
.ck-form input[type=email], .ck-form input:not([type]) { font: inherit; padding: 13px 14px; border: 1.5px solid var(--line); border-radius: 10px; background: var(--white); }
.ck-form input:focus { outline: 2px solid var(--teal); outline-offset: 1px; }
.ck-consent { display: flex; gap: 10px; align-items: flex-start; font-weight: 400 !important; color: var(--ink-2); margin: 10px 0 8px; }
.ck-consent input { margin-top: 4px; }
.small { font-size: .85rem; }
.check-results { padding: 56px 0 90px; }
.check-results h2 { font-size: clamp(1.6rem, 3.4vw, 2.3rem); max-width: 40rem; outline: none; }
.ck-res-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 48px; align-items: start; margin-top: 30px; }
.ck-bars { list-style: none; margin: 0 0 34px; padding: 0; display: grid; gap: 12px; }
.ck-bars li { display: grid; grid-template-columns: 13rem minmax(0, 1fr) 4.5rem; gap: 14px; align-items: center; font-size: .95rem; }
.ck-bar-track { height: 12px; background: var(--paper-2); border-radius: 99px; overflow: hidden; }
.ck-bar-track span { display: block; height: 100%; background: var(--teal); border-radius: 99px; }
.ck-bars li.is-focus .ck-bar-track span { background: var(--orange); }
.ck-bars li.is-focus .ck-bar-label { font-weight: 600; }
.ck-bar-val { color: var(--ink-3); font-size: .85rem; text-align: right; }
.ck-focus h3 { margin: 0 0 14px; }
.ck-why { border-left: 3px solid var(--orange); padding: 2px 0 2px 16px; margin-bottom: 18px; }
.ck-why h4 { margin: 0 0 4px; font-size: 1.05rem; }
.ck-why p { margin: 0; color: var(--ink-2); }
.check-results .tonight { margin-top: 26px; }
@media (max-width: 860px) {
  .check-intro, .ck-res-grid { grid-template-columns: 1fr; gap: 32px; }
  .ck-bars li { grid-template-columns: 1fr 4rem; }
  .ck-bars .ck-bar-track { grid-column: 1 / -1; grid-row: 2; }
}
.ucard-pain { font-family: var(--body); font-weight: 600; font-style: italic; color: var(--orange-dk) !important; font-size: 1rem !important; margin: 0 0 6px !important; flex: 0 !important; }
.ucard-more { font-size: .88rem; color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; }
.ucard-more:hover { color: var(--teal); }
.notsure { margin-top: 36px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 26px; background: var(--paper-2); border-radius: 14px; }
.notsure p { margin: 0; max-width: 42rem; }
.ucard-check, .ucard-more, .ucard-price { white-space: nowrap; }
/* Programme names: outcome name, with the area as a small label */
.ucard-area { font: 600 .72rem/1.2 var(--body) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--teal) !important; margin: 0 0 8px !important; flex: 0 !important; }
.ucard h3 { font-size: 1.3rem; }
.eyebrow-area { color: var(--ink-3); font-weight: 500; }
.buy-name { font-family: var(--display); font-size: 1.3rem; margin: 0 0 6px; color: var(--ink); }
/* Phones: programmes straight after the opening buttons; the sample question is desktop-only */
@media (max-width: 900px) { .hero .try { display: none; } .hero-grid { gap: 0; } }
@media (max-width: 900px) { .hero { padding-bottom: 28px; } #units { padding-top: 28px; } }
/* Zoe's photo in place of the monogram */
picture.zoe-mark { overflow: hidden; padding: 0; background: none; border: 3px solid var(--white); box-shadow: 0 6px 18px rgba(35,33,58,.12); }
picture.zoe-mark img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zoe .creds { font-size: .85rem; letter-spacing: .02em; color: var(--ink-3); margin-top: -4px; }
/* Zoe's book: shown as credibility, deliberately not linked out of the site */
.zoe-book { display: flex; gap: 18px; align-items: center; margin: 22px 0 18px; padding: 14px 18px 14px 14px; background: var(--white); border: 1px solid var(--line); border-radius: 12px; max-width: 36rem; }
.zoe-book picture { flex: 0 0 64px; }
.zoe-book img { width: 64px; height: auto; display: block; border-radius: 3px; box-shadow: 0 4px 12px rgba(35,33,58,.22); }
.zoe-book p { margin: 0; font-size: .95rem; color: var(--ink-2); }
/* Homepage: "Made to be easy to follow" */
.easy { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 40px; }
.easy h2 { margin-top: 0; }
.easy-list { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.easy-list li { border-top: 3px solid var(--teal); padding-top: 16px; }
.easy-list h3 { font-size: 1.12rem; margin: 0 0 6px; }
.easy-list p { margin: 0; font-size: .95rem; color: var(--ink-2); }
.easy-guarantee { margin: 30px 0 0; padding-top: 20px; border-top: 1px solid var(--line); color: var(--ink-2); }
.easy-guarantee strong { color: var(--ink); }
@media (max-width: 960px) { .easy-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .easy { padding: 26px 22px; } .easy-list { grid-template-columns: 1fr; gap: 20px; } }

/* ── About Zoe ── */
.about-hero { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.6fr); gap: 56px; align-items: center; }
.about-photo img { width: 100%; max-width: 280px; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 4px solid var(--white); box-shadow: 0 10px 30px rgba(35,33,58,.14); margin-left: auto; }
.domains { list-style: none; margin: 32px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; counter-reset: d; }
.domains li { counter-increment: d; background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 22px; }
.domains li::before { content: counter(d); display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--teal-bg); color: var(--teal); font-weight: 700; margin-bottom: 12px; }
.domains h3 { font-size: 1.1rem; margin: 0 0 6px; }
.domains p { margin: 0; color: var(--ink-2); font-size: .95rem; }
.about-book { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 44px; align-items: center; }
.about-book img { width: 180px; height: auto; border-radius: 4px; box-shadow: 0 10px 28px rgba(35,33,58,.25); }
.beliefs { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.beliefs li { border-top: 3px solid var(--orange); padding-top: 16px; }
.beliefs h3 { font-size: 1.15rem; margin: 0 0 6px; }
.beliefs p { margin: 0; color: var(--ink-2); }
.creds { font-size: .9rem; color: var(--ink-3); }
.btn-ghost-light { background: transparent; color: var(--white); border-color: rgba(255,255,255,.6); }
.btn-ghost-light:hover { background: var(--white); color: var(--ink); }
/* ── Contact ── */
.contact-email { font-size: 1.5rem; font-weight: 600; margin-top: 18px; }
.contact-email a { color: var(--orange); }
.help-list { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.help-list li { background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 22px; }
.help-list h3 { font-size: 1.1rem; margin: 0 0 6px; }
.help-list p { margin: 0; color: var(--ink-2); }
@media (max-width: 900px) { .domains, .beliefs, .help-list { grid-template-columns: 1fr; } .about-hero { grid-template-columns: 1fr; gap: 28px; } .about-photo img { margin-left: 0; max-width: 200px; } .about-book { grid-template-columns: 1fr; gap: 24px; } .about-book img { width: 140px; } }

/* ── Homepage: credibility line on the first screen ── */
.hero-cred { display: flex; align-items: center; gap: 14px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); max-width: 34rem; }
.hero-cred img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: 0 0 56px; border: 2px solid var(--white); box-shadow: 0 2px 8px rgba(35,33,58,.12); }
.hero-cred p { margin: 0; font-size: .95rem; color: var(--ink-2); line-height: 1.45; }
.hero-cred strong { color: var(--ink); }
.notsure-top { margin: 14px 0 0; font-size: 1rem; }
.notsure-top a { font-weight: 600; color: var(--orange); }

/* ── Phones: programme cards become a compact list (icon left, name and problem line right) ── */
@media (max-width: 640px) {
  .ucards { gap: 12px; margin-top: 24px; }
  .ucard { display: grid; grid-template-columns: 76px minmax(0, 1fr); position: relative; }
  .ucard:hover { transform: none; }
  .ucard-art { aspect-ratio: auto; height: 100%; min-height: 100%; }
  .ucard-art svg { width: 52px; }
  .ucard-body { padding: 14px 16px 14px 14px; }
  .ucard-area { margin-bottom: 4px !important; font-size: .68rem !important; }
  .ucard h3 { font-size: 1.08rem; margin-bottom: 2px; }
  .ucard-pain { margin: 0 !important; font-size: .92rem !important; }
  .ucard-body > p:not(.ucard-area):not(.ucard-pain), .ucard-foot { display: none; }
  /* the whole card is the link to the programme */
  .ucard h3 a::after { content: ""; position: absolute; inset: 0; }
  .hero-cred { margin-top: 20px; }
}

/* ── Programme page: report section ── */
.report-split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; align-items: center; }
.report-steps { list-style: none; padding: 0; margin: 22px 0; counter-reset: rs; }
.report-steps li { counter-increment: rs; position: relative; padding: 0 0 14px 44px; }
.report-steps li::before { content: counter(rs); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--orange); color: #fff; font: 600 .95rem/30px var(--display); text-align: center; }
.report-sample { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 26px 26px 18px; box-shadow: 0 18px 40px -24px rgba(35,33,58,.35); position: relative; }
.rs-tag { position: absolute; top: 18px; right: 18px; margin: 0; font: 700 .68rem/1 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--orange-dk); background: #E6E1F6; padding: 6px 10px; border-radius: 99px; }
.rs-title { font: 600 1.15rem/1.2 var(--display); margin: 0 0 18px; padding-right: 90px; }
.rs-bars { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 10px; }
.rs-bars li { display: grid; grid-template-columns: 11rem 1fr; gap: 12px; align-items: center; font-size: .9rem; color: var(--ink-2); }
.rs-bars li.is-focus span:first-child { color: var(--orange-dk); font-weight: 700; }
.rs-track { height: 9px; background: var(--paper-2); border-radius: 99px; overflow: hidden; }
.rs-track span { display: block; height: 100%; background: var(--teal); border-radius: 99px; }
.rs-bars li.is-focus .rs-track span { background: var(--orange); }
.rs-start, .rs-plan { font-size: .93rem; margin: 0 0 8px; }
.report-sample figcaption { font-size: .78rem; color: var(--ink-3); border-top: 1px solid var(--line); padding-top: 10px; margin-top: 12px; }
@media (max-width: 860px) { .report-split { grid-template-columns: 1fr; gap: 32px; } .rs-bars li { grid-template-columns: 9rem 1fr; } }

/* ── Programme page: what you get ── */
.get-grid { list-style: none; padding: 0; margin: 32px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.get-grid img, .peek img { border-radius: 10px; border: 1px solid var(--line); box-shadow: 0 14px 30px -20px rgba(35,33,58,.45); background: #fff; width: 100%; height: auto; }
.get-grid h3 { font-size: 1.12rem; margin: 16px 0 6px; }
.get-grid p { font-size: .93rem; color: var(--ink-2); margin: 0; }
.peek { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--line); }
.peek figure { margin: 0; }
.peek figcaption { font-size: .85rem; color: var(--ink-3); margin-top: 10px; }
@media (max-width: 900px) { .get-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .get-grid { grid-template-columns: 1fr 1fr; gap: 16px; } .peek { grid-template-columns: 1fr 1fr; } .peek figure:nth-child(3) { display: none; } }

/* Programme book images on homepage cards (2 Nov 2026) */
.ucard-art img { height: 88%; width: auto; max-width: 86%; object-fit: contain; filter: drop-shadow(0 10px 14px rgba(35,33,58,.16)); transition: transform .2s; }
.ucard:hover .ucard-art img { transform: translateY(-2px) rotate(-1deg); }
@media (max-width: 560px) { .ucard-art img { height: 86%; } }

/* Hero background photo (2 Nov 2026) */
.hero-photo { position: relative; overflow: hidden; min-height: 640px; display: flex; align-items: center; background-color: var(--paper);
  background-image: linear-gradient(90deg, var(--paper) 0%, rgba(247,246,251,.97) 40%, rgba(247,246,251,.6) 50%, rgba(247,246,251,0) 58%), url("/images/hero-home.webp");
  background-repeat: no-repeat; background-size: 100% 100%, max(106vw, 1420px) auto; background-position: 0 0, calc(9.7vw + 40px) 30%; }
@media (max-width: 1300px) and (min-width: 901px) { .hero-photo { background-size: 100% 100%, auto 100%; background-position: 0 0, 60px 30%; } }
.hero-photo .hero-grid { grid-template-columns: minmax(0, 36rem); width: 100%; }
.hero-photo .hero-img { display: none; }
@media (max-width: 900px) {
  .hero-photo { display: block; min-height: 0; background: var(--paper); padding-top: 0; }
  .hero-photo .hero-img { display: block; aspect-ratio: 16 / 10; background: url("/images/hero-home-sm.webp") 40% center / cover no-repeat; margin-bottom: 32px; }
}

/* Lighter Load VSL + buy section (2 Nov 2026) */
.vsl-band { background: var(--white); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.vsl-head { text-align: center; max-width: 44rem; margin: 0 auto 36px; }
.vsl-eyebrow { font: 600 .8rem/1.2 var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--teal); margin: 0 0 12px; }
.vsl-head h2 { margin: 0 0 14px; }
.vsl-head .lede { margin: 0 auto; }
.vsl-frame { max-width: 880px; margin: 0 auto; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: #2A2340; box-shadow: 0 2px 6px rgba(35,33,58,.10), 0 24px 56px rgba(35,33,58,.18); }
.vsl-frame iframe, .vsl-frame video { width: 100%; height: 100%; border: 0; display: block; }
.vsl-placeholder { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; color: #F7F6FB;
  background: radial-gradient(120% 120% at 30% 20%, #5B3FC4 0%, #2A2340 70%); }
.vsl-play { width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center; background: rgba(247,246,251,.16); border: 2px solid rgba(247,246,251,.5); padding-left: 4px; }
.vsl-soon { font: 600 .95rem/1 var(--body); letter-spacing: .04em; opacity: .85; }
.vsl-buy { text-align: center; margin-top: 32px; }
.btn-lg { font-size: 1.1rem; padding: 20px 36px; }
.vsl-note { font-size: .92rem; color: var(--ink-3); margin: 14px 0 0; }
@media (max-width: 560px) { .vsl-frame { border-radius: 12px; } .btn-lg { width: 100%; } }

/* Assessment top bar + short training section (2 Nov 2026) */
.assess-bar { background: var(--ink); color: #E6E3F2; font-size: .92rem; }
.assess-bar p { margin: 0; padding: 10px 0; text-align: center; line-height: 1.4; }
.assess-bar strong { color: var(--white); }
.assess-bar a { color: #A8DCD3; font-weight: 600; margin-left: 6px; white-space: nowrap; }
.assess-bar a::after { content: " →"; }
.short-band { background: var(--paper-2); }
.short-next { text-align: center; margin: 28px 0 0; color: var(--ink-2); }
.short-next a { font-weight: 600; color: var(--orange); }
@media (max-width: 560px) { .assess-bar { font-size: .85rem; } }
.short-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 32px; }
.short-note { text-align: center; font-size: .92rem; color: var(--ink-3); margin: 14px 0 0; }
@media (max-width: 560px) { .short-actions .btn { width: 100%; } }
.zoe-card { max-width: 880px; margin: 48px auto 0; background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 36px; }
@media (max-width: 700px) { .zoe-card { padding: 24px 20px; margin-top: 36px; } }
.short-note a { font-weight: 600; color: var(--orange); }
.about-zoe .zoe { max-width: 880px; margin: 0 auto; }
.assess-band .vsl-eyebrow { color: #A8DCD3; }
.assess-band .cta-end { text-align: center; margin: 0 auto; }
.assess-band .hero-actions { justify-content: center; }

/* Training page + homepage training link (2 Nov 2026) */
.training-link { text-align: center; background: var(--white); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.training-link h2 { margin: 0 0 12px; }
.training-link .lede { max-width: 40rem; margin: 0 auto 24px; }
.training-page h1 { font-size: clamp(2.2rem, 4.5vw, 3.4rem); margin: 0 0 14px; }
.steps-wrap { max-width: 760px; margin: 0 auto; }
.steps-wrap h2 { text-align: center; margin: 0 0 28px; }
.steps-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.steps-list li { display: flex; gap: 16px; align-items: baseline; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: 16px 20px; font-size: 1.05rem; color: var(--ink-2); }
.steps-list strong { color: var(--ink); margin-right: 6px; }
.step-n { flex: 0 0 auto; font-family: var(--display); font-weight: 700; color: var(--orange); min-width: 1.4em; }

/* Join, replay, guide and readers pages (2 Nov 2026) */
.join-top { padding-top: 64px; }
.join-head { text-align: center; max-width: 44rem; margin: 0 auto 40px; }
.join-head h1 { margin: 0 0 14px; }
.join-main { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; align-items: start; max-width: 920px; margin: 0 auto; background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 36px 40px; box-shadow: 0 2px 6px rgba(35,33,58,.06), 0 18px 44px rgba(35,33,58,.10); }
.join-main-art img { width: 100%; height: auto; }
.join-name { margin: 0 0 12px; }
.join-main .price-big { font-family: var(--display); font-size: 3rem; line-height: 1; }
.join-main .price-note { color: var(--ink-3); font-size: .92rem; margin: 6px 0 14px; }
.join-main .launch { font-size: .95rem; color: var(--ink-2); margin: 0 0 18px; }
.join-main .ticks { margin: 0 0 24px; }
.join-main .ticks li { font-size: .97rem; }
.join-main .alt { font-size: .93rem; color: var(--ink-2); margin: 14px 0 0; }
.join-main .notice { margin: 0 0 18px; padding: 14px 16px; font-size: .95rem; }
.btn-block { width: 100%; }
.btn-sm { padding: 10px 18px; font-size: .92rem; }
.jcards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 32px; }
.jcard { background: var(--white); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.jcard-art { display: grid; place-items: center; background: #EEE8F7; aspect-ratio: 16 / 11; }
.jcard-art img { height: 88%; width: auto; max-width: 86%; object-fit: contain; filter: drop-shadow(0 8px 12px rgba(35,33,58,.16)); }
.jcard-body { padding: 16px 18px 18px; display: flex; flex-direction: column; flex: 1; }
.jcard h3 { font-size: 1.15rem; margin: 0 0 6px; }
.jcard h3 a { color: var(--ink); text-decoration: none; }
.jcard .ucard-pain { margin-bottom: 14px !important; font-size: .93rem !important; }
.jcard-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); padding-top: 12px; }
.jcard .msg { font-size: .85rem; margin: 8px 0 0; }
.join-help { text-align: center; margin: 32px 0 0; color: var(--ink-2); }
.replay-deadline { font-weight: 600; color: var(--orange-dk); margin: 16px 0 0; }
.guide-page { padding-top: 64px; }
.guide-page h1 { margin: 0 0 18px; }
.guide-points { margin: 0 0 24px; padding-left: 1.2em; color: var(--ink-2); }
.guide-points li { margin: 6px 0; }
.readers-grid { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 56px; align-items: center; }
.readers-book img { width: 100%; height: auto; border-radius: 4px; box-shadow: 0 10px 28px rgba(35,33,58,.25); }
.next-steps { list-style: none; margin: 0 auto; padding: 0; max-width: 760px; display: grid; gap: 16px; }
.next-steps li { display: flex; gap: 20px; background: var(--white); border: 1px solid var(--line); border-radius: 14px; padding: 24px; }
.next-steps h2 { font-size: 1.3rem; margin: 0 0 6px; }
.next-steps p { margin: 0 0 16px; color: var(--ink-2); }
.next-steps .step-n { font-size: 1.6rem; line-height: 1.2; }
@media (max-width: 1020px) { .jcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .join-main { grid-template-columns: 1fr; padding: 24px 20px; gap: 20px; } .join-main-art { max-width: 160px; } .readers-grid { grid-template-columns: 1fr; gap: 24px; } .readers-book { max-width: 160px; } }
@media (max-width: 480px) { .jcards { grid-template-columns: 1fr; } }
.nav .btn.nav-assess { margin-left: 4px; }
.work-with-zoe { border-top: 1px solid var(--line); }
.work-with-zoe h2 { font-size: 1.4rem; margin: 0 0 10px; }
.work-with-zoe p { color: var(--ink-2); }
.work-with-zoe a { font-weight: 600; }
.short-big { font-family: var(--display); font-weight: 700; font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height: 1.2; color: var(--orange); margin: 0 0 12px; }
.vsl-poster { width: 100%; height: 100%; display: grid; grid-template-columns: 38% 1fr; align-items: center; gap: 6%; padding: 6% 7%; box-sizing: border-box; color: #F7F6FB; background: radial-gradient(120% 120% at 20% 20%, #5B3FC4 0%, #2A2340 70%); }
.vsl-poster img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 6px solid rgba(247,246,251,.18); display: block; }
.vsl-poster-tag { font: 600 .8rem/1.2 var(--body); letter-spacing: .1em; text-transform: uppercase; color: #A8DCD3; margin: 0 0 14px; }
.vsl-poster ul { list-style: none; margin: 0 0 18px; padding: 0; }
.vsl-poster li { font-family: var(--display); font-size: clamp(1rem, 2.2vw, 1.5rem); line-height: 1.3; margin: 0 0 10px; padding-left: 22px; position: relative; }
.vsl-poster li::before { content: ""; position: absolute; left: 0; top: .5em; width: 9px; height: 9px; border-radius: 50%; background: #A8DCD3; }
.vsl-poster .vsl-soon { margin: 0; opacity: .75; font-size: .9rem; }
@media (max-width: 560px) { .vsl-poster { gap: 5%; padding: 6%; } .vsl-poster li { margin-bottom: 4px; padding-left: 16px; } .vsl-poster li::before { width: 7px; height: 7px; } .vsl-poster-tag { margin-bottom: 8px; font-size: .68rem; } .vsl-poster ul { margin-bottom: 8px; } .vsl-poster .vsl-soon { font-size: .75rem; } }
.easy-band { padding-top: 56px; padding-bottom: 56px; }
@media (max-width: 560px) { .vsl-frame:has(.vsl-poster) { aspect-ratio: auto; } .vsl-poster { height: auto; padding: 22px 20px; grid-template-columns: 30% 1fr; } .vsl-poster li { font-size: 1rem; } }
/* /join/ tightened for ready buyers (3 Nov 2026) */
.join-top { padding-top: 32px; padding-bottom: 56px; }
.join-head { margin-bottom: 24px; }
.join-head h1 { font-size: clamp(1.8rem, 3.4vw, 2.5rem); margin: 0 0 8px; }
.join-sub { margin: 0; color: var(--ink-2); }
.join-sub a { font-weight: 600; color: var(--orange); white-space: nowrap; }
.join-main { padding: 28px 36px; }
.join-main .launch { margin-bottom: 16px; }
.join-signin { font-size: .93rem; color: var(--ink-2); margin: 12px 0 18px; }
.join-signin a { font-weight: 600; }
.join-main .ticks { margin-bottom: 8px; }
@media (max-width: 700px) { .join-main-art { display: none; } .join-top { padding-top: 20px; } .join-main { padding: 22px 20px; } .join-main .price-big { font-size: 2.4rem; } }
/* Phone layouts: quick buy row on programme pages, guide and readers (3 Nov 2026) */
.p-quickbuy { display: none; }
@media (max-width: 900px) {
  .p-quickbuy { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 4px 0 20px; }
  .p-quickbuy-price { font-family: var(--display); font-size: 1.8rem; line-height: 1; }
  .p-quickbuy .msg { flex-basis: 100%; margin: 0; font-size: .9rem; color: var(--orange-dk); }
  .p-quickbuy .msg:empty { display: none; }
}
.readers-top { padding-top: 48px; padding-bottom: 48px; }
.readers-top .hero-actions { margin-top: 20px; }
@media (max-width: 700px) {
  .guide-page { padding-top: 24px; }
  .guide-page .guide-grid { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; align-items: start; }
  .guide-page .guide-cover { max-width: 96px; }
  .guide-page .guide-grid > div:last-child { grid-column: 1 / -1; }
  .guide-page .guide-grid > .guide-cover { grid-column: 1; }
  .guide-page h1 { font-size: 1.7rem; }
  .guide-page .guide-points { margin-bottom: 16px; font-size: .95rem; }
  .readers-top { padding-top: 24px; }
  .readers-book { display: none; }
}
@media (max-width: 700px) { .guide-page h1 { font-size: 1.45rem; margin-bottom: 10px; } .guide-page .guide-points { font-size: .9rem; margin-bottom: 12px; } .guide-page .guide-points li { margin: 2px 0; } .guide-page .guide-eyebrow { margin-bottom: 6px; } }
.nav .btn-primary[aria-current="page"], .nav .btn-primary[aria-current="page"]:hover { color: var(--white); }
/* /webinar/ registration page (3 Nov 2026) */
.webinar-top { padding-top: 56px; }
.webinar-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr); gap: 56px; align-items: start; }
.webinar-grid h1 { margin: 0 0 16px; }
.webinar-points { margin: 0 0 24px; padding-left: 1.2em; color: var(--ink-2); }
.webinar-points li { margin: 8px 0; }
.webinar-host { display: flex; align-items: center; gap: 14px; padding-top: 20px; border-top: 1px solid var(--line); max-width: 34rem; }
.webinar-host img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: 0 0 56px; }
.webinar-host p { margin: 0; font-size: .95rem; color: var(--ink-2); }
.webinar-card { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 28px; box-shadow: 0 2px 6px rgba(35,33,58,.06), 0 18px 44px rgba(35,33,58,.10); }
.webinar-card h2 { margin: 0 0 16px; font-size: 1.5rem; }
.webinar-sessions { border: 0; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.webinar-sessions legend { font-weight: 600; margin-bottom: 8px; }
.webinar-session { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.webinar-session input { margin-top: 4px; }
.webinar-session small { display: block; color: var(--ink-3); font-size: .85rem; }
.webinar-card .field { margin-bottom: 12px; }
.webinar-card .field label { display: block; font-weight: 600; margin-bottom: 6px; }
.webinar-card .field input { width: 100%; box-sizing: border-box; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; font: inherit; }
.webinar-card .guide-consent { margin: 4px 0 16px; }
.webinar-done p { color: var(--ink-2); }
@media (max-width: 900px) { .webinar-grid { grid-template-columns: 1fr; gap: 28px; } .webinar-top { padding-top: 28px; } }
.webinar-grid { grid-template-areas: "intro card" "more card"; grid-template-rows: auto 1fr; row-gap: 0; }
.webinar-intro { grid-area: intro; } .webinar-more { grid-area: more; } .webinar-card { grid-area: card; }
@media (max-width: 900px) { .webinar-grid { grid-template-areas: "intro" "card" "more"; row-gap: 24px; } .webinar-intro .lede { margin-bottom: 0; } }

/* Programme pages: The Lighter Load upsell (3 Nov 2026) */
.p-upsell { background: linear-gradient(180deg, var(--white) 0%, #F3F0FC 100%); }
.p-upsell-head { max-width: 720px; margin: 0 auto 32px; text-align: center; }
.p-upsell-head .lede { margin: 12px auto 0; }
.p-upsell .join-name { font-size: 1.9rem; }
.p-upsell .alt a { font-weight: 600; white-space: nowrap; }
.ink-alt { margin: 14px 0 0; color: #E4E0F8; font-size: .97rem; }
.ink-alt a { color: #fff; font-weight: 600; }
@media (max-width: 700px) { .p-upsell .join-main-art { display: block; max-width: 120px; margin: 0 auto; } .p-upsell-head { text-align: left; } }
.p-upsell .ticks em { font-style: normal; font-weight: 600; color: var(--ink); }

/* One-click add-on offers after checkout (3 Nov 2026) */
.offer-head .wrap { justify-content: space-between; }
.offer-steps { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; font-size: .82rem; color: var(--ink-3); }
.offer-steps li { padding: 4px 10px; border-radius: 999px; background: var(--line); }
.offer-steps li.done { background: #DDF1EA; color: #1F6B55; }
.offer-steps li.done::before { content: '✓ '; }
.offer-steps li.now { background: var(--orange); color: #fff; font-weight: 600; }
.offer-band { padding-top: 32px; }
.offer-confirm { max-width: 920px; margin: 0 auto 18px; padding: 12px 16px; border-radius: 12px; background: #DDF1EA; color: #1F6B55; font-weight: 600; font-size: .95rem; }
.offer-card { max-width: 920px; margin: 0 auto; background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 36px 40px; box-shadow: 0 2px 6px rgba(35,33,58,.06), 0 18px 44px rgba(35,33,58,.10); }
.offer-grid { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 40px; align-items: start; }
.offer-art img { width: 100%; height: auto; }
.offer-card h1 { font-size: clamp(1.7rem, 3.2vw, 2.4rem); margin: 0 0 12px; }
.offer-card .ticks { margin: 18px 0 22px; }
.offer-card .ticks li { font-size: .97rem; }
.offer-price { font-family: var(--display); font-size: 2.6rem; line-height: 1; margin: 0 0 16px; }
.offer-once { font-family: var(--body, inherit); font-size: .92rem; color: var(--ink-3); }
.offer-total { font-weight: 600; color: var(--ink-2); margin: 0 0 16px; }
.offer-small { font-size: .88rem; color: var(--ink-3); margin: 10px 0 0; text-align: center; }
.offer-no { display: block; margin: 18px auto 0; background: none; border: 0; color: var(--ink-2); text-decoration: underline; font: inherit; font-size: .95rem; cursor: pointer; padding: 8px; }
@media (max-width: 700px) {
  .offer-steps li:not(.now) { display: none; }
  .offer-card { padding: 22px 20px; }
  .offer-grid { grid-template-columns: 1fr; gap: 16px; }
  .offer-art { max-width: 120px; }
  .offer-price { font-size: 2.1rem; }
}

/* Programme pages: the ladder (3 Nov 2026) */
.buy-addons { font-size: .9rem; color: var(--ink-2); margin: -6px 0 18px; }
.ladder { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 28px; }
.ladder-step { background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 24px 24px 18px; }
.ladder-step:first-child { border: 2px solid var(--orange); }
.ladder-tag { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--teal); margin: 0 0 6px; }
.ladder-price { font-family: var(--display); font-size: 1.9rem; line-height: 1; margin: 0 0 12px; }
.ladder-step h3 { font-size: 1.12rem; margin: 0 0 10px; }
.ladder-step .ticks li { font-size: .93rem; }
.ladder-total { margin: 22px 0 0; font-size: 1rem; color: var(--ink-2); max-width: 60rem; }
.ladder-total a { font-weight: 600; }
@media (max-width: 860px) { .ladder { grid-template-columns: 1fr; } }