:root{--cream:#f7f3ea;--line:#e3dccb;--navy:#0f2a5c;--ink:#1f2a3d;--muted:#55627a;--green:#18482d;--green2:#123a24;--sage:#e9ece4;--blue:#3d6fd6}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:400 16px/1.6 Poppins,system-ui,sans-serif;overflow-x:hidden}
a{color:var(--green)}:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
h1,h2{font-family:Lora,Georgia,serif;font-weight:400;color:var(--navy);line-height:1.2;margin:0 0 .45em}
p{margin:0 0 .8em}
.bwrap{max-width:560px;margin:0 auto;padding:0 24px 56px;position:relative;min-height:100svh}
.bfun .bwrap:after{content:"";position:absolute;right:-150px;bottom:-60px;width:380px;height:380px;border-radius:50%;pointer-events:none;
 background:repeating-radial-gradient(circle,transparent 0 46px,rgba(15,42,92,.06) 46px 47px);z-index:-1}
.bfun{position:relative}
.bh{display:flex;align-items:center;justify-content:space-between;height:68px;border-bottom:1px solid var(--line);margin-bottom:30px;position:relative}
.bbrand{font:600 .95rem/1 Poppins,sans-serif;letter-spacing:.3em;color:var(--navy);text-decoration:none}.bbrand i{font-style:normal;color:var(--blue);margin-left:1.1em;letter-spacing:.05em}
.beye{font:600 .68rem/1.3 Poppins,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--green);margin-bottom:18px}
.bfun h1{font-size:clamp(2rem,8vw,2.5rem)}
.blead{color:var(--muted);font-size:1.02rem;line-height:1.75}
.bfun hr{border:0;border-top:1px solid var(--line);margin:24px 0}
.bbig{font-size:1.08rem;color:var(--ink);line-height:1.6}.bbig.bserif{font-family:Lora,serif;font-size:1.7rem;color:var(--navy);margin-bottom:.2em}
.bgreen{font-weight:600;color:var(--green)}
.bsmall{color:var(--muted);font-size:.95rem}
.bp{color:var(--muted);font-size:.95rem}
.bwhen{font-weight:600;color:var(--navy);font-size:1.02rem}
.bbtns{display:flex;flex-direction:column;gap:12px;margin-top:28px}
.bbtn{display:block;width:100%;text-align:center;background:var(--green);color:#fff;text-decoration:none;font:600 1rem/1.2 Poppins,sans-serif;padding:17px 22px;border-radius:999px;border:2px solid var(--green);cursor:pointer}
.bbtn:hover{background:var(--green2);border-color:var(--green2)}
.bbtn.ghost{background:transparent;color:var(--green)}.bbtn.ghost:hover{background:var(--sage)}
.bslots{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0 16px}
.bslots div{background:var(--sage);border-radius:12px;padding:12px 14px}
.bslots small{display:block;font-weight:600;color:var(--navy);font-size:.78rem;line-height:1.35;min-height:2.7em}
.bslots b{display:block;font:400 1.35rem/1.3 Lora,serif;color:var(--navy);margin-top:6px}.bslots span{font-size:.78rem;color:var(--muted)}
.bq{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--line)}
.bq blockquote{margin:0;font:400 1.12rem/1.5 Lora,serif;color:var(--navy)}
.bq figcaption{font-size:.78rem;color:var(--muted);margin-top:8px}
.bform label{display:block;font-weight:600;color:var(--navy);font-size:.82rem;margin:14px 0 6px}
.bform input{width:100%;font:400 1rem Poppins,sans-serif;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.bform .bbtn{margin-top:26px}
.bbook{background:var(--sage);border-radius:14px;padding:22px 22px 30px;margin:24px 0 20px}
.bbook small{display:block;font:600 .66rem/1 Poppins,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:14px}
.bbook b{font:400 1.9rem/1.25 Lora,serif;color:var(--navy)}
/* landing */
.bl .bwrap{max-width:900px;padding-bottom:0;display:flex;flex-direction:column}
.bl main{flex:1}
.bnav{display:none}.bnav a{color:var(--ink);text-decoration:none;font-size:.88rem}
.bmenu{background:none;border:0;font:600 .9rem Poppins,sans-serif;color:var(--navy);cursor:pointer;padding:10px 4px}
.bnav.open{display:flex;flex-direction:column;position:absolute;top:68px;right:0;left:0;background:var(--cream);border-bottom:1px solid var(--line);padding:6px 0 14px;z-index:5}
.bnav.open a{padding:12px 0;border-bottom:1px solid var(--line)}
.lhero h1{font-size:clamp(2.1rem,7vw,2.6rem)}
.llead{color:var(--muted);font-size:1.05rem}
.lhero h2{font-size:clamp(1.6rem,5vw,1.9rem);margin:26px 0 .25em}
.lsub{color:var(--muted);font-size:.95rem}
.lcards{display:grid;gap:14px;margin:22px 0 30px}
.bcard{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 20px;text-decoration:none;color:var(--ink);min-height:96px;transition:border-color .15s,box-shadow .15s}
.bcard:hover{border-color:#c9c0aa;box-shadow:0 8px 24px rgba(15,42,92,.06)}
.bcard>span:first-child{flex:1}.bcard b{display:block;font:600 1.1rem/1.3 Poppins,sans-serif;color:var(--green);margin-bottom:6px}.bcard>span>span{color:var(--muted);font-size:.92rem;line-height:1.5}
.arr{flex:0 0 32px;height:32px;border-radius:50%;background:var(--sage);color:var(--green);display:grid;place-items:center}.arr svg{width:16px;height:16px}
.lmore{border-top:1px solid var(--line);padding:26px 0 24px;display:grid;gap:20px}
.lh{font-size:clamp(1.5rem,5vw,1.75rem)}.lh span{color:var(--green)}
.lmore p{color:var(--muted);font-size:.92rem}
.lser{font:400 1.15rem/1.5 Lora,serif;color:var(--navy)!important}
.bf{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:16px 0 22px;font-size:.72rem;color:var(--muted)}.bf a{color:var(--muted);text-decoration:none}
@media(min-width:760px){
 .bmenu{display:none}.bnav{display:flex;gap:48px}
 .lhero{text-align:center}.lhero h1{font-size:2.6rem}
 .lcards{grid-template-columns:1fr 1fr;padding:0 24px}
 .lmore{grid-template-columns:1fr 1fr;gap:64px;margin:0 24px}
 .bfun .bwrap{padding-top:10px}
}
@media(max-width:759px){.bfun .bwrap{overflow:clip}}
.bfun h1{font-size:clamp(1.7rem,7vw,2.4rem)}
.lmore .beye{color:var(--green)}
@media(max-width:420px){.bp br,.bbig br{display:none}}
/* landing restyle (23:06 UK, 19 Oct 2026): funnel look on / - same values as the /bob/* steps */
.bl .bwrap{position:relative}
.bl .bwrap:before,.bl .bwrap:after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:-1;
 background:repeating-radial-gradient(circle,transparent 0 46px,rgba(15,42,92,.06) 46px 47px)}
.bl .bwrap:before{width:380px;height:380px;right:-150px;top:-60px}
.bl .bwrap:after{width:380px;height:380px;left:-170px;bottom:40px}
.bl .bh{margin-bottom:34px}
.bl .bnav a{color:var(--navy);font-weight:500}
.lhero h1{color:var(--navy)}
.lhero h2{color:var(--navy)}
.bcard{background:var(--sage);border:0;box-shadow:0 8px 24px rgba(15,42,92,.06)}
.bcard:hover{box-shadow:0 12px 30px rgba(15,42,92,.10);border-color:transparent}
.bcard b{color:var(--green)}
.arr{background:var(--green);color:#fff}
.bcard:hover .arr{background:var(--green2)}
.lmore{border-top-color:var(--line)}
.lmore .beye{color:var(--green);font-size:.68rem;margin-bottom:18px}
.lh{color:var(--navy)}
.lser{font-size:1.2rem}
@media(max-width:759px){.bl .bwrap{overflow:clip}}
/* white comparison (Gareth 23:09 UK, 19 Oct 2026): landing page only, crisp white background */
body.bl{background:#fff}
.bl .bh,.bl .bf,.lmore{border-color:var(--line)}
.bl .bnav.open{background:#fff}
.bcard{box-shadow:0 10px 28px rgba(15,42,92,.10)}
.bcard:hover{box-shadow:0 14px 34px rgba(15,42,92,.14)}
/* landing Reset Breath player + mini player (23:15 UK, 19 Oct 2026) */
.lrb{background:var(--sage);border-radius:14px;box-shadow:0 8px 24px rgba(15,42,92,.06);padding:22px 20px;margin:0 0 30px}
.lrb-h{font:400 1.35rem/1.3 Lora,serif;color:var(--navy);margin:0 0 12px}.lrb-h span{font:500 .85rem Poppins,sans-serif;color:var(--muted);margin-left:8px}
.lrb audio{width:100%;display:block}
@media(min-width:760px){.lrb{margin:0 24px 30px}}
/* app style (welcome journey, members.mindful12.com/breath/welcome): icon badge + day/item pairs (Gareth 23:26 UK, 19 Oct 2026) */
:root{--a-accent:#6fa99b;--a-deep:#4f8b7d}
.abadge{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--a-accent);box-shadow:0 0 0 6px rgba(111,169,155,.18)}
.abadge svg{width:21px;height:21px;stroke:var(--a-deep);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* step 2 Tuesday / Thursday cards: same words, app look (day label sage uppercase over navy item) */
.bslots.aps div{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 14px 14px;box-shadow:0 8px 24px rgba(15,42,92,.06)}
.bslots.aps .abadge{margin:4px 0 14px 4px}
.bslots.aps b{order:1;font:600 .72rem/1.2 Poppins,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--a-deep);margin:0 0 4px}
.bslots.aps small{order:2;font:600 .98rem/1.3 Poppins,sans-serif;color:var(--navy);min-height:0}
.bslots.aps span:not(.abadge){order:3;margin-top:6px}
.bslots.aps .abadge{order:0}
/* landing How it works strip */
.lhow{border-top:1px solid var(--line);padding:26px 0 30px}
.lhow-g{display:grid;gap:14px}
.acard{background:var(--sage);border-radius:14px;box-shadow:0 8px 24px rgba(15,42,92,.06);padding:22px 20px}
.acard .abadge{margin:4px 0 16px 4px}
.acard h3{font:600 1.15rem/1.25 Poppins,sans-serif;color:var(--navy);margin:0}
.asub{font:500 .74rem/1.3 Poppins,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--a-deep);margin:6px 0 14px}
.ait{margin:0 0 10px}.ad{display:block;font:600 .78rem/1.3 Poppins,sans-serif;color:var(--a-deep)}.at{display:block;font:600 .98rem/1.35 Poppins,sans-serif;color:var(--navy)}
.aclose{font-size:.88rem;color:var(--muted);margin:12px 0 0}
@media(min-width:760px){.lhow{margin:0 24px}.lhow-g{grid-template-columns:repeat(3,1fr)}}
/* landing Start here button back to the four options (Bob via Gareth, 20 Oct 2026) */
#options{scroll-margin-top:16px}
.lstart{text-align:center;padding:8px 0 40px}
.lstart .bbtn{display:inline-block;width:auto;min-width:220px}
@media(prefers-reduced-motion:no-preference){html:has(body.bl){scroll-behavior:smooth}}
/* HR step 2 split into two slides (Bob, 20 Oct 2026) */
.bease{margin:30px 0 8px;display:flex;flex-direction:column;gap:30px}
.bease p{margin:0}.bease b{display:block;font:600 1.25rem/1.3 Poppins,sans-serif;color:var(--navy)}.bease span{display:block;font-size:1.02rem;color:var(--muted);margin-top:4px}
.bfun h1+.bslots{margin-top:22px}
.bmeet{color:var(--muted);font-size:1.02rem;margin:22px 0 0}.bmeet b{color:var(--navy);font-weight:600}
.bqcard{margin:24px 0 0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 20px 18px;box-shadow:0 8px 24px rgba(15,42,92,.06)}
.bqcard blockquote{margin:0;font:400 1.12rem/1.5 Lora,serif;color:var(--navy)}.bqcard blockquote span{color:var(--green)}
.bqcard figcaption{margin-top:12px;font-size:.85rem}.bqcard figcaption b{display:block;color:var(--navy);font-weight:600}.bqcard figcaption span{display:block;color:var(--muted);font-size:.78rem}
/* HR step 2 slides: calmer, tighter rhythm so each slide fits one phone screen (Gareth 23:17 UK, 20 Oct 2026; 8px steps like the member app) */
.bfun:is(:has(.bease),:has(.bmeet)) .bh{height:56px;margin-bottom:24px}
.bfun:is(:has(.bease),:has(.bmeet)) .beye{margin-bottom:12px}
.bfun:is(:has(.bease),:has(.bmeet)) h1{font-size:clamp(1.6rem,6.6vw,2.2rem);margin-bottom:0}
.bfun .bease{margin:32px 0 0;gap:24px}
.bfun .bease span{margin-top:2px}
.bfun h1+.bslots.aps{margin-top:20px;gap:12px}
.bfun:has(.bmeet) .bslots.aps div{padding:14px 14px 12px}
.bfun:has(.bmeet) .bslots.aps .abadge{margin:2px 0 10px 4px}
.bfun:has(.bmeet) .bslots.aps span:not(.abadge){margin-top:4px;font-size:.9rem}
.bfun .bmeet{margin:20px 0 0;line-height:1.55}
.bfun .bqcard{margin-top:16px;padding:16px 18px}
.bfun .bqcard blockquote{font-size:1.05rem;line-height:1.5}
.bfun .bqcard blockquote{text-wrap:balance}
.bfun .bqcard figcaption{margin-top:8px}
.bfun:is(:has(.bease),:has(.bmeet)) .bbtns{margin-top:24px}
.bfun:is(:has(.bease),:has(.bmeet)) .bbtn{padding:15px 22px}
@media(min-width:760px){.bfun:is(:has(.bease),:has(.bmeet)) .bwrap{padding-top:24px}}
.bfun:is(:has(.bease),:has(.bmeet)) h1{text-wrap:balance}
@media(max-width:380px){.bfun .bmeet{font-size:.94rem}}
@media(max-height:700px) and (max-width:759px){.bfun:is(:has(.bease),:has(.bmeet)) .bh{margin-bottom:16px}.bfun:is(:has(.bease),:has(.bmeet)) .bbtns{margin-top:20px}.bfun h1+.bslots.aps{margin-top:16px}}
/* white comparison: HR step 2 slides 1 and 2 on the same white as the white landing (Gareth 20 Oct, white branch only) */
body.bfun:has(.bease),body.bfun:has(.bmeet){background:#fff}
/* bob-funnels-blue (Bob 21 Oct 2026): live mindful12.com palette from its styles.css (--m12-accent #2D67FF, --m12-accent-hover #1F55E6, --m12-accent-soft #EAF0FF, --m12-text #0D2158, --m12-muted #5B6B8F, --m12-border #D6DEF0, --m12-bg #FFFFFF); same background on every page */
:root{--cream:#ffffff;--line:#d6def0;--navy:#0d2158;--ink:#0d2158;--muted:#5b6b8f;--green:#2d67ff;--green2:#1f55e6;--sage:#eaf0ff;--blue:#2d67ff;--a-accent:#2d67ff;--a-deep:#2d67ff}
.abadge{box-shadow:0 0 0 6px rgba(45,103,255,.14)}
.bcard:hover{border-color:#9aa6c2}
.bfun .bmeet b{color:var(--green)}
.bl .mp{--mp-cream:#ffffff;--mp-line:#d6def0;--mp-green:#2d67ff;--mp-green2:#1f55e6;--mp-sage:#eaf0ff;--mp-muted:#5b6b8f}
/* blue text on the soft blue panels uses the live hover blue #1F55E6 for WCAG AA */
.bcard b,.asub,.ad,.bbook small,.bbtn.ghost:hover{color:var(--green2)}
/* all funnel steps: same calm rhythm as the HR slides so the main button sits in the first screen (Gareth 21 Oct 13:10 BST) */
.bfun .bh{height:56px;margin-bottom:24px}
.bfun .beye{margin-bottom:12px}
.bfun h1{font-size:clamp(1.6rem,6.6vw,2.2rem);margin-bottom:.4em}
.bfun .blead{line-height:1.65}
.bfun .bslots.aps div{padding:14px 14px 12px}
.bfun .bslots.aps .abadge{margin:2px 0 10px 4px}
.bfun .bslots.aps span:not(.abadge){margin-top:4px;font-size:.9rem}
.bfun .bq{margin-top:18px;padding-top:16px}
.bfun .bbtns{margin-top:24px}
@media(min-width:760px){.bfun .bwrap,.bfun:is(:has(.bease),:has(.bmeet)) .bwrap{padding-top:0}}
/* landing: shared site header sits above the page box; same gap below it as before */
.bl .sh{margin-bottom:34px}
/* funnel steps keep the logo only header; on desktop it spans the same 1076px box as the site header so the logo sits in the same place */
@media(min-width:760px){.bfun .bh{width:min(1076px,calc(100vw - 48px));margin-left:calc(50% - min(538px,50vw - 24px))}}
/* landing: the faint rings never cause side scroll at any width */
html:has(body.bl){overflow-x:clip}
/* step 3 (Option A): one short line above the button; name and email are asked once, in the app */
.bform .bnext{color:var(--muted);font-size:.95rem;margin:0}
.bform input+.bnext{margin-top:16px}.bform .bnext+.bbtn{margin-top:16px}
/* landing How it works: two cards since Bob removed 'Always there for you' (21 Oct 14:55 BST); two even columns on desktop, no empty third column */
@media(min-width:760px){.lhow-g{grid-template-columns:repeat(2,1fr)}}