/* Lazar Upper Cervical — site stylesheet
   Tokens from docs/brand-system/styles.css (prefix --mucc-), mapped onto page roles in docs/design-package.md §2. */

:root{
  --mucc-blue:#21328A;--mucc-blue-deep:#131E52;--mucc-blue-soft:#3B4780;--mucc-blue-mid:#2E43A8;--mucc-blue-lift:#4E5FC9;
  --mucc-blue-mist:#8E9BCB;--mucc-blue-pale:#A8B4E0;--mucc-blue-tint:#EAECF7;
  --mucc-bone:#F4F3EF;--mucc-bone-deep:#E7E5DE;--mucc-white:#FFFFFF;
  --mucc-gray-700:#5C6570;--mucc-gray-500:#8A929C;--mucc-gray-300:#B0B6BD;--mucc-line:#E5E5E0;

  --canvas:var(--mucc-bone);--panel:var(--mucc-white);--canvas-quiet:var(--mucc-blue-tint);
  --canvas-field:var(--mucc-blue);--canvas-deep:var(--mucc-blue-deep);
  --accent:var(--mucc-blue);--accent-hover:var(--mucc-blue-mid);--accent-muted:var(--mucc-blue-tint);
  --text-primary:var(--mucc-blue-deep);--text-secondary:var(--mucc-gray-700);
  --text-on-field:var(--mucc-white);--text-pale-on-field:var(--mucc-blue-pale);
  --rule:var(--mucc-line);--rule-strong:var(--mucc-gray-700);--strand:var(--mucc-blue-deep);--held-point:var(--mucc-blue-deep);
  --focus-ring:var(--mucc-blue-lift);
  --tshadow:0 1px 2px rgba(19,30,82,.55),0 3px 12px rgba(19,30,82,.35),0 10px 44px rgba(19,30,82,.30);

  --font-core:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-read:'Source Serif 4',Georgia,'Times New Roman',serif;

  --step--1:0.8125rem;--step-0:1rem;--step-1:1.25rem;--step-2:1.5625rem;--step-3:1.9531rem;--step-4:2.4414rem;--step-5:3.0518rem;--step-6:3.8147rem;
  --ease-out:cubic-bezier(.22,.61,.36,1);--ease-inout:cubic-bezier(.65,0,.35,1);
  --radius-card:16px;--radius-img:18px;--radius-pill:999px;
  --shadow-3:0 18px 44px rgba(19,30,82,.14),0 3px 10px rgba(19,30,82,.06);
  --pad-x:48px;--section-y:104px;--wrap:1240px;
}
@media (max-width:900px){:root{--pad-x:24px;--section-y:64px}}
@media (max-width:480px){:root{--pad-x:20px;--section-y:56px}}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;overflow-x:clip}
body{overflow-x:clip}   /* clip, never hidden, on body: hidden there would stop the sticky hero pinning in older Safari */
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--text-primary);font-family:var(--font-core);font-size:var(--step-0);line-height:1.55;-webkit-font-smoothing:antialiased;position:relative}
.js body{opacity:0;transition:opacity .5s var(--ease-out)}
.js body.ready{opacity:1}
@keyframes lucshow{to{opacity:1}}
.js body{animation:lucshow .01s 3s forwards}   /* if a script never arrives, the page still shows */
h1,h2,h3,h4{margin:0;font-family:var(--font-core);font-weight:600;line-height:1.12;letter-spacing:-.015em;text-wrap:pretty}
h1{font-size:var(--step-5);font-weight:700;letter-spacing:-.02em}
h2{font-size:var(--step-4)}
h3{font-size:var(--step-2)}
p{margin:0 0 1em;text-wrap:pretty}
a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--mucc-blue-pale);transition:color .15s,border-color .15s}
a:hover{color:var(--text-primary);border-bottom-color:var(--accent)}
img,svg,video{max-width:100%;display:block}
button{font:inherit}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.skip{position:absolute;left:-999px;top:12px;background:var(--panel);color:var(--text-primary);padding:10px 16px;border-radius:var(--radius-pill);z-index:100;border:1px solid var(--rule-strong)}
.skip:focus{left:12px}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--pad-x);padding-right:var(--pad-x)}
.eyebrow{font-family:var(--font-core);font-weight:600;font-size:.6875rem;letter-spacing:.28em;text-transform:uppercase;color:var(--accent);margin:0 0 18px}
.g-field .eyebrow,.g-deep .eyebrow{color:var(--text-pale-on-field)}
.read{font-family:var(--font-read);font-size:1.0625rem;line-height:1.62;max-width:64ch}
.lead{font-family:var(--font-read);font-weight:600;font-size:var(--step-1);line-height:1.5;max-width:46ch;color:var(--mucc-blue-soft)}
.small{font-size:var(--step--1);color:var(--text-secondary)}
.num{font-variant-numeric:tabular-nums;font-weight:600}

/* the one environment behind everything: paper grain, whisper level */
body::before{content:"";position:fixed;inset:-10%;z-index:0;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .07 0 0 0 0 .12 0 0 0 0 .32 0 0 0 .6 0'/></filter><rect width='240' height='240' filter='url(%23n)'/></svg>");
  animation:grain 90s linear infinite -30s}
@keyframes grain{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(-2%,1%,0)}100%{transform:translate3d(0,0,0)}}
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-pill);border:1px solid transparent;padding:16px 30px;font-weight:600;font-size:15px;line-height:1;cursor:pointer;text-decoration:none;transition:background-color .15s,color .15s,border-color .15s,transform .15s;text-shadow:none;white-space:nowrap}
.btn-primary{background:var(--accent);color:var(--text-on-field);border-color:var(--accent)}
.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--text-on-field)}
.btn-outline{background:transparent;color:var(--text-primary);border-color:var(--text-primary)}
.btn-outline:hover{background:var(--canvas)}
.g-field .btn-primary{background:var(--mucc-white);color:var(--accent);border-color:var(--mucc-white)}
.g-field .btn-primary:hover{background:var(--mucc-bone)}
.g-field .btn-outline{color:var(--mucc-white);border-color:rgba(255,255,255,.7)}
.g-field .btn-outline:hover{background:rgba(255,255,255,.1)}
.btn-sm{padding:11px 22px;font-size:13.5px}
/* two buttons side by side: a real gap, and they wrap cleanly instead of touching on a phone */
.btn-pair{display:flex;flex-wrap:wrap;gap:12px}
@media (pointer:coarse){.btn{min-height:44px}}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rule)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-top:14px;padding-bottom:14px}
.nav .brand{border:0;display:inline-flex;align-items:center}
.nav .brand{flex:none}
.nav .brand img{height:44px;width:auto;flex:none}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links .book-m{display:none}
.nav-links a{border:0;font-weight:500;font-size:14px;color:var(--mucc-blue-soft);padding:6px 0;position:relative}
.nav-links a:hover{color:var(--text-primary)}
.nav-links a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--accent)}
.nav .phone{border:0;font-weight:500;font-size:14px;color:var(--mucc-blue-soft)}
.nav-links .phone-m{display:none}
.nav-toggle{display:none;background:none;border:1px solid var(--rule);border-radius:var(--radius-pill);padding:10px 14px;font-weight:600;font-size:13px;color:var(--text-primary);cursor:pointer}
@media (max-width:900px){
  .nav-links{display:none;position:absolute;left:0;right:0;top:100%;background:rgba(255,255,255,.98);border-bottom:1px solid var(--rule);flex-direction:column;align-items:stretch;gap:0;padding:8px var(--pad-x) 16px}
  .nav-links a{padding:12px 0;border-bottom:1px solid var(--rule)}
  .nav.open .nav-links{display:flex}
  .nav-links .phone-m{display:block;font-weight:600;color:var(--accent)}
  .nav-toggle{display:inline-flex}
  .nav .phone{display:none}
  .nav-links .book-m{display:block}
}

@media (max-width:520px){.nav .brand img{height:34px}.nav .wrap{gap:10px}.nav .btn-sm{padding:10px 14px;font-size:12.5px}.xs-hide{display:none}.nav-toggle{padding:9px 12px}}

/* ---------- hero: pinned scrub ---------- */
.hero{position:relative;height:680vh;background:var(--canvas);z-index:1}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--canvas)}
.poster{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat}
.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s var(--ease-out);will-change:transform;transform-origin:50% 22%;transform:translate3d(0,calc(var(--q,0)*-3.2%),0) scale(calc(1 + .22*var(--q,0)))}
.stage.video-ready video{opacity:1}
.stage.video-failed video{display:none}
.scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(19,30,82,0) 45%,rgba(19,30,82,.10) 100%);opacity:calc(1 - var(--settle,0))}
.ring{position:absolute;right:28px;bottom:28px;width:36px;height:36px;color:var(--mucc-blue-soft);transform:rotate(-90deg);opacity:.9;transition:opacity .4s}
.ring circle{transition:stroke-dashoffset .12s linear}
.stage.video-ready .ring{opacity:0}
.chevron{position:absolute;right:28px;bottom:28px;width:36px;height:36px;color:var(--mucc-blue-soft);opacity:.8}

/* caption bands */
.band{position:absolute;opacity:0;pointer-events:none;translate:0 calc((.5 - var(--d,.5))*6vh);color:var(--text-primary);text-shadow:0 0 14px rgba(244,243,239,.80),0 0 2px rgba(244,243,239,.60);--k:0}
.band.left{left:6vw;width:min(40vw,560px)}
.band.right{right:6vw;width:min(40vw,560px);text-align:right}
.band.mid{top:50%;transform:translateY(-50%)}
.band.low{top:58%}
.band h2{font-family:var(--font-core);font-weight:700;font-size:clamp(28px,4.2vw,58px);line-height:1.06;letter-spacing:-.02em;margin:0 0 .35em}
.band .sub{font-family:var(--font-read);font-style:italic;font-weight:400;font-size:clamp(17px,1.55vw,23px);line-height:1.45;margin:0;color:var(--mucc-blue-soft)}
.band::before{content:"";position:absolute;inset:-14% -12%;pointer-events:none;z-index:-1;opacity:calc(.25 + .75*var(--k,1));background:radial-gradient(ellipse 74% 66% at 50% 50%,rgba(244,243,239,var(--scrim,.5)) 0%,rgba(244,243,239,calc(var(--scrim,.5)*.62)) 46%,rgba(244,243,239,0) 76%)}
.band.settle{left:50%;top:50%;transform:translate(-50%,-50%);width:min(84vw,760px);text-align:center;color:var(--text-primary);text-shadow:none;pointer-events:none;background:rgba(244,243,239,.97);border-radius:var(--radius-card);padding:44px 44px 34px;box-shadow:var(--shadow-3)}
.band.settle.live{pointer-events:auto}
.band.settle::before{display:none}
.band.settle .held{position:absolute;left:50%;top:-4px;margin:0;transform:translateX(-50%)}
.band.settle .guard{font-family:var(--font-read);font-style:italic;font-size:clamp(18px,1.7vw,24px);color:var(--mucc-blue-soft);margin:0 0 .5em}
.band.settle h2{font-size:clamp(30px,4.4vw,60px)}
.band.settle .cta-row{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:22px}
.band.settle .trust{font-weight:500;font-size:13px;color:var(--mucc-blue-soft);margin:0}
.band.settle .alt{font-size:14px;color:var(--mucc-blue-soft);margin:6px 0 0}
.band.settle .alt a{border-bottom-color:var(--mucc-blue-pale)}
.held{display:block;width:8px;height:8px;border-radius:50%;background:var(--held-point);margin:0 auto 18px;position:relative;opacity:var(--kb,0)}
.held::after{content:"";position:absolute;inset:-6px;border-radius:50%;background:var(--held-point);opacity:.18;animation:pulse 6s ease-in-out infinite -1.2s}
@keyframes pulse{0%,100%{transform:scale(1);opacity:.14}50%{transform:scale(1.7);opacity:.05}}
/* the strand's own vertical reference behind the settle copy, drawn by CSS, not the video */

/* entrances: transform and opacity only, scrubbed off --k, reversible */
.w{display:inline-block;white-space:pre}
.c{display:inline-block}
.e-grid .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);transform:translateX(calc((1 - var(--kc))*var(--jx,0px)))}
.e-drift .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*-4.2vh))}
.e-weave .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*var(--jy,0px)))}
.e-punch .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);--ks:clamp(0,(var(--k,0) - var(--th,0) - var(--sd,.1))*var(--ss,3.2),1);opacity:var(--kc);transform:scale(calc(0.45 + (0.55 + var(--ov,.16))*var(--kc) - var(--ov,.16)*var(--ks)))}
.e-punch .w.em{--ov:.3;--sd:.16;--ss:2.6}
.e-rise .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*4vh))}
.e-rise .guard{--ks:clamp(0,var(--k,0)*4,1);opacity:var(--ks)}
.e-rise .cta-row{--kb:clamp(0,(var(--k,0) - .62)*4,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb))*3vh))}
.e-rise .held{--kb:clamp(0,(var(--k,0) - .78)*5,1)}

/* static hero (phones, portrait tablets, coarse portrait, landscape phones, reduced motion) */
.static-hero{display:none;position:absolute;inset:0;align-items:center;justify-content:center;text-align:center;padding:96px var(--pad-x) 48px}
.static-hero .poster-still{position:absolute;inset:0;background-size:cover;background-position:center}
.static-hero .lane{position:relative;max-width:640px;padding:28px 22px;border-radius:var(--radius-card);background:rgba(244,243,239,.97);box-shadow:var(--shadow-3)}
.static-hero .display{font-weight:700;font-size:clamp(30px,6.5vw,44px);line-height:1.08;letter-spacing:-.02em;margin:12px 0 14px;text-wrap:pretty}
.static-hero .sub{font-family:var(--font-core);font-weight:400;font-size:17px;line-height:1.5;max-width:40ch;margin:0 auto 20px;color:var(--mucc-blue-soft)}
.static-hero .trust{font-weight:500;font-size:13px;color:var(--text-secondary);margin:12px 0 0}
.static-hero .alt{font-size:14px;color:var(--text-secondary);margin:6px 0 0}
@media (prefers-reduced-motion:reduce){
  .hero{height:calc(100vh - var(--nav-h,73px));height:calc(100svh - var(--nav-h,73px))}
  .stage .band,.stage .ring,.stage .chevron,.stage .scrim,.stage .cue{display:none}
  .static-hero{display:flex}
}
@media (max-height:560px){.ring,.chevron{display:none}}
/* the scroll cue: says what to do, then gets out of the way. The stage is 100vh but the 73px nav sits above it, so the cue is lifted to sit inside the visible part. */
.cue{position:absolute;left:50%;bottom:104px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:11px 20px 11px 22px;border-radius:var(--radius-pill);background:rgba(244,243,239,.94);box-shadow:0 6px 22px rgba(19,30,82,.12);color:var(--text-primary);opacity:0;animation:cuein .8s var(--ease-out) 1.4s forwards;transition:opacity .5s var(--ease-out);pointer-events:none}
.cue span{font-family:var(--font-core);font-weight:600;font-size:.6875rem;letter-spacing:.28em;text-transform:uppercase;padding-left:.28em}
.cue i{display:block;width:9px;height:9px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);animation:cuebob 1.9s var(--ease-inout) infinite}
@keyframes cuein{to{opacity:1}}
@keyframes cuebob{0%,100%{transform:rotate(45deg) translate(-2px,-2px)}50%{transform:rotate(45deg) translate(2px,2px)}}
.stage.cue-off .cue{animation:none;opacity:0}
@media (max-height:560px){.cue{display:none}}

@media (max-width:1180px){.nav .phone{display:none}.nav-links{gap:20px}}

/* ---------- sections ---------- */
.section{position:relative;padding-top:var(--section-y);padding-bottom:var(--section-y);z-index:1}
.g-white{background:var(--panel)}
.g-bone{background:var(--canvas)}
.g-tint{background:var(--canvas-quiet)}
.g-field{background:var(--canvas-field);color:var(--text-on-field)}
.g-deep{background:var(--canvas-deep);color:var(--mucc-blue-mist)}
.g-field h2,.g-deep h2,.g-field h3{color:var(--text-on-field)}
.g-field p{color:var(--text-pale-on-field)}
.g-field .lead{color:var(--text-pale-on-field)}
.g-field a:not(.btn){color:var(--mucc-white);border-bottom-color:rgba(255,255,255,.45)}
.g-field a:not(.btn):hover{color:var(--mucc-white);border-bottom-color:var(--mucc-white)}
.g-field .fit .not,.g-field .fit li{color:var(--text-on-field)}
.g-field .fit .not li{color:var(--text-pale-on-field)}
.g-field .fit h3{color:var(--text-on-field)}
.hair-top{border-top:1px solid var(--rule)}
.section h2{margin-bottom:22px;max-width:60ch}
@media (min-width:901px){.section .wrap:not(.split) > .rev-group > h2,.section .wrap.rev-group:not(.split) > h2{max-width:calc(50% - 40px)}}

/* page heads on the supporting pages */
.page-head{padding-top:88px;padding-bottom:72px}
.page-head h1{margin-bottom:22px;max-width:60ch}
@media (min-width:901px){.page-head .wrap:not(.split) > h1,.page-head .wrap:not(.split) > .rev-group > h1{max-width:calc(50% - 40px)}.page-head .split h1{max-width:none}}


/* two columns split by the line */
.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:start}
.split > *{min-width:0}
@media (max-width:900px){.split{grid-template-columns:1fr;gap:36px}}

/* two voices on one rule */
.pairs{margin-top:36px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:28px 0;position:relative}
.pair::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--rule-strong);opacity:.5;transform-origin:left;transition:transform .9s var(--ease-out)}
.js .pair::before{transform:scaleX(0)}
.js .pair.in::before{transform:scaleX(1)}
.pair .said{font-family:var(--font-read);font-style:italic;font-size:var(--step-1);line-height:1.45;color:var(--text-primary);text-align:right;padding-right:36px;margin:0}
.pair .reply{font-size:16px;line-height:1.6;color:var(--text-primary);padding-left:36px;margin:0}
@media (max-width:900px){.pair{grid-template-columns:1fr;gap:10px}.pair .said{text-align:left;padding:0}.pair .reply{padding:0 0 0 18px;border-left:1px solid var(--rule-strong)}}
.closing{font-family:var(--font-read);font-weight:600;font-size:var(--step-1);margin-top:32px;max-width:46ch}

/* atlas glyph */
.atlas{width:100%;max-width:360px;margin:0 auto;height:auto}
.atlas .tilt{transform-origin:100px 58px;transform:rotate(calc(-9deg * (1 - var(--settle,0))));transition:transform .2s linear}
.atlas .bob{opacity:clamp(0,(var(--settle,0) - .8)*5,1)}
.atlas .line{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--draw,0));transition:stroke-dashoffset .2s linear}
.tm{font-size:.55em;line-height:0;vertical-align:super;margin-left:.06em;font-weight:inherit;letter-spacing:0}
.cred{display:flex;align-items:center;gap:14px;max-width:46ch;margin:22px 0 0;font-size:15px;line-height:1.5;color:var(--text-primary)}
.cred-story{max-width:46ch;margin:10px 0 0}
.cred b{color:var(--text-primary);font-weight:600}
.cred-seal{flex:none;width:52px;height:52px;color:var(--strand)}
.pull{font-family:var(--font-core);font-weight:600;font-size:var(--step-2);line-height:1.2;margin:28px 0 12px;max-width:30ch}
.arrow-link{border:0;font-weight:500}

/* method cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.card{background:var(--panel);border-radius:var(--radius-card);padding:32px 28px;display:flex;flex-direction:column;gap:14px;box-shadow:0 1px 2px rgba(19,30,82,.06),0 1px 1px rgba(19,30,82,.04)}
.card h3{font-size:22px}
.card p{font-size:14.5px;line-height:1.6;color:var(--text-secondary);margin:0}
.card svg{width:36px;height:36px;stroke:var(--strand);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:900px){.cards{grid-template-columns:1fr}}
.measure-notes{margin-top:26px;max-width:64ch}

/* hold to measure: the one interactive moment */
.hold{position:relative;background:var(--panel);border-radius:var(--radius-card);padding:36px 28px;box-shadow:var(--shadow-3);user-select:none;-webkit-user-select:none;touch-action:none;cursor:pointer;min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;--p:0}
.hold:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px}
.hold .label{font-weight:500;font-size:15px;color:var(--text-primary);text-align:center;margin:0}
.hold .four{font-size:13px;color:var(--text-secondary);margin:6px 0 0;opacity:calc(min(1,var(--p)*4));transition:opacity .2s}
.hold .pend{width:140px;height:200px;margin:12px auto;position:relative}
.hold .pend svg{width:100%;height:100%;overflow:visible}
.hold .pend .arm{transform-origin:50% 0;transform:rotate(calc(8deg * (1 - var(--p))));animation:sway 3.2s ease-in-out infinite;animation-play-state:running}
.hold.active .pend .arm,.hold.done .pend .arm{animation:none}
@keyframes sway{0%,100%{transform:rotate(calc(8deg * (1 - var(--p))))}50%{transform:rotate(calc(-8deg * (1 - var(--p))))}}
.hold .track{position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--rule);transform:translateX(-50%)}
.hold .track i{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--accent);transform:scaleY(var(--p));transform-origin:top}
.hold .point{position:absolute;left:50%;bottom:-6px;width:10px;height:10px;border-radius:50%;background:var(--held-point);transform:translateX(-50%) scale(var(--p));opacity:var(--p)}
.hold .lines{list-style:none;padding:0;margin:0;text-align:center;min-height:120px}
.hold .lines li{font-weight:600;font-size:20px;line-height:1.3;opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
.hold.done .lines li{opacity:1;transform:none}
.hold.done .lines li:nth-child(1){transition-delay:0s}
.hold.done .lines li:nth-child(2){transition-delay:.35s}
.hold.done .lines li:nth-child(3){transition-delay:.7s}
.hold .lines .then{font-family:var(--font-read);font-weight:400;font-style:italic;font-size:17px;color:var(--mucc-blue-soft);margin-top:10px}
.hold.done .lines .then{transition-delay:1.1s}
.hold.done .lines li.settled{transition-delay:0s}

/* the five steps on the spine */
.steps{list-style:none;margin:48px 0 0;padding:0;display:grid;gap:18px}
.steps li{display:grid;grid-template-columns:1fr 1fr;column-gap:72px;align-items:baseline;position:relative}
.steps li::before{content:"";position:absolute;left:50%;top:.55em;width:9px;height:9px;margin-left:-4.5px;border-radius:50%;background:var(--rule-strong);transition:background-color .3s}
.steps li.in::before{background:var(--accent)}
.steps .name{font-weight:600;font-size:15px;color:var(--accent);text-align:right}
.steps .what{margin:0;color:var(--text-primary)}
.gate{font-weight:600;font-size:var(--step-1);line-height:1.35;margin:40px 0 10px;max-width:40ch}
@media (max-width:900px){.steps li{grid-template-columns:1fr;row-gap:4px}.steps li::before{display:none}.steps .name{text-align:left}}

/* care */
.photo{border-radius:var(--radius-img);overflow:hidden;background:var(--mucc-bone-deep);aspect-ratio:4/5}
.photo img{width:100%;height:100%;object-fit:cover}
.photo.wide{aspect-ratio:4/3}
.photo.wide img{object-position:42% center}
.commit{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:14px}
.commit li{padding-left:20px;position:relative}
.commit li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.commit b{font-weight:600}

/* proof */
.rating{display:inline-flex;align-items:baseline;gap:10px;background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius-pill);padding:10px 18px;color:var(--text-primary);border-bottom-color:var(--rule)}
.rating .num{font-size:22px}
.rating .of{font-size:14px;color:var(--text-secondary)}
.quotes{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:26px}
.quotes li{position:relative;padding:22px 0 0}
.quotes li::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:var(--rule-strong);opacity:.5;transform-origin:left;transition:transform .9s var(--ease-out)}
.js .quotes li::before{transform:scaleX(0)}
.js .quotes li.in::before{transform:scaleX(1)}
.quotes li:nth-child(2){margin-left:8%}
.quotes li:nth-child(3){margin-left:16%}
.quotes blockquote{margin:0;font-family:var(--font-read);font-style:italic;font-size:var(--step-1);line-height:1.45}
.quotes cite{display:block;font-style:normal;font-size:13px;color:var(--text-secondary);margin-top:10px}
.radio{display:flex;align-items:center;gap:14px;margin-top:36px;font-size:14px;color:var(--text-secondary)}
@media (max-width:900px){.quotes li:nth-child(2),.quotes li:nth-child(3){margin-left:0}}

/* fit */
.fit h3{font-size:18px;margin-bottom:14px}
.fit ul{margin:0;padding:0 0 0 20px;display:grid;gap:10px}
.fit li{padding-left:4px}
.fit .not{color:var(--text-secondary)}

/* cost */
.cost{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:22px}
.split .cost{margin-top:6px}
.cost li{display:grid;grid-template-columns:110px 1fr;gap:20px;align-items:baseline;padding-top:22px;border-top:1px solid var(--rule)}
.cost .price{font-weight:600;font-size:var(--step-2);letter-spacing:-.01em;color:var(--accent)}
.cost .price.small-cap{font-size:.9rem;color:var(--text-primary)}
.cost b{display:block;font-weight:600;margin-bottom:4px}
.cost p{margin:0;color:var(--text-primary)}
/* intensive prices: real tables and a definition list, two columns, no horizontal scroll */
.price-h{font-size:1.125rem;margin:28px 0 8px}
.unit-prices{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.unit-prices div{background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius-card);padding:16px 20px;display:grid;gap:6px;align-content:start}
.unit-prices dt{margin:0;color:var(--text-primary)}
.unit-prices dd{margin:0;font-weight:600;font-size:var(--step-2);color:var(--accent)}
.price-tables{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:32px;margin-top:32px;align-items:start}
.price-table{width:100%;border-collapse:collapse;table-layout:fixed}
.price-table caption{text-align:left;font-weight:600;font-size:1.125rem;padding-bottom:10px;color:var(--text-primary)}
.price-table th,.price-table td{padding:12px 0;border-top:1px solid var(--rule);text-align:left;vertical-align:baseline;overflow-wrap:anywhere}
.price-table thead th{font-size:.8125rem;font-weight:600;color:var(--text-secondary);border-top:0;padding-top:0}
.price-table tbody th,.price-table tfoot th{font-weight:400;padding-right:16px}
.price-table .amt{text-align:right;width:5.5em;font-variant-numeric:tabular-nums;white-space:nowrap}
.price-table .sub th,.price-table .sub td{font-weight:600;border-top:1px solid var(--rule-strong)}
.price-table tfoot th,.price-table tfoot td{font-weight:600;font-size:1.125rem;border-top:2px solid var(--rule-strong);color:var(--text-primary)}
.price-table tfoot .amt{color:var(--accent)}
.terms{margin-top:32px;max-width:64ch}
.terms h3{font-size:1.125rem;margin:0 0 8px}
.terms > p{margin:0 0 14px}
.terms ol{margin:0;padding:0 0 0 22px;display:grid;gap:14px}
.terms li{padding-left:4px}
.terms b{font-weight:600}
.price-note{margin-top:16px;max-width:64ch}
.good{margin-top:32px;background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius-card);padding:20px 24px;max-width:64ch}
.good b{font-weight:600}
@media (max-width:600px){.cost li{grid-template-columns:1fr;gap:6px}}

@media (min-width:901px){.section .wrap:not(.split) > .rev-group > .good,.section .wrap.rev-group:not(.split) > .good{max-width:calc(50% - 40px)}}

/* faq */
.faq{margin-top:28px;border-top:1px solid var(--rule)}
.split .faq{margin-top:6px}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;position:relative;font-family:var(--font-read);font-style:italic;font-size:var(--step-1);line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-family:var(--font-core);font-weight:400;font-size:26px;color:var(--accent);transition:transform .2s}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.faq .a{padding:0 0 26px;max-width:64ch;color:var(--text-primary);font-family:var(--font-read);font-size:1.0625rem;line-height:1.62}

/* call to action field */
.cta{text-align:center}
.cta .inner{max-width:720px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.cta h2{font-size:var(--step-4);margin-bottom:16px}
.cta .body{font-family:var(--font-core);font-weight:400;font-size:1.125rem;line-height:1.55;max-width:44ch;margin-bottom:26px}
.cta .prefer{margin:12px 0 10px;font-size:14px;color:var(--text-pale-on-field)}
.cta .row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-bottom:14px}
.cta .tel{color:var(--text-pale-on-field);font-size:15px;margin:4px 0 20px}
.cta .tel a{color:var(--mucc-white);border-bottom-color:rgba(255,255,255,.4)}
.cta .credit{font-family:var(--font-read);font-style:italic;font-size:13px;margin:0 0 6px}
.cta .speed{font-size:13px;margin:0}
.cta .held{background:var(--mucc-white)}
.cta .held::after{background:var(--mucc-white)}

/* footer */
.footer{padding:56px 0 40px}
.footer .brand img{height:33px;width:auto}
.footer .cols{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 1fr 1fr;gap:28px;margin-top:36px;font-size:13px;line-height:1.7}
.footer h4{color:var(--mucc-white);font-size:13px;font-weight:600;margin-bottom:8px}
.footer a{color:var(--mucc-blue-mist);border-bottom-color:rgba(142,155,203,.35)}
.footer a:hover{color:var(--mucc-white);border-bottom-color:var(--mucc-white)}
.footer .legal{margin-top:40px;padding-top:20px;border-top:1px solid rgba(142,155,203,.25);font-size:11px;line-height:1.7;color:var(--mucc-blue-mist)}
@media (max-width:1100px){.footer .cols{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.footer .cols{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.footer .cols{grid-template-columns:1fr}}

/* reveals: choreography with retired delays */
.js .rev{opacity:0;transform:translateY(30px);transition:opacity .85s var(--ease-out),transform .95s var(--ease-out)}
.js .in > .rev,.js .in.rev,.js .rev.in{opacity:1;transform:none}
.js .in > .rev:nth-child(2){transition-delay:.08s}
.js .in > .rev:nth-child(3){transition-delay:.16s}
.js .in > .rev:nth-child(4){transition-delay:.24s}
.js .in > .rev:nth-child(5){transition-delay:.32s}
.js .in > .rev:nth-child(6){transition-delay:.40s}
.js .in.settled > .rev:nth-child(n){transition-delay:0s}

/* ---------- reduced motion, honoured completely ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important}
  .js body{opacity:1}
  body::before{animation:none}
  .js .rev,.js .in > .rev{opacity:1;transform:none}
  .js .pair::before,.js .quotes li::before{transform:scaleX(1)}
  .atlas .tilt{transform:none}.atlas .line{stroke-dashoffset:0}
  .hold{--p:1}
  .hold .lines li{opacity:1;transform:none}
  .steps .name::before{background:var(--accent)}
  .held{opacity:1}
}
.js body.rm-pinned .rev,.js body.rm-pinned .in > .rev{opacity:1;transform:none}
.js body.rm-pinned .pair::before,.js body.rm-pinned .quotes li::before{transform:scaleX(1)}
body.rm-pinned .atlas .tilt{transform:none}body.rm-pinned .atlas .line{stroke-dashoffset:0}
body.rm-pinned .hold{--p:1}
body.rm-pinned .hold .lines li{opacity:1;transform:none}
body.rm-pinned .held{opacity:1}

/* 404 */
.notfound{min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center}

/* figures from the INSiGHT materials */
.figs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:0;margin-bottom:26px}
.figs.three .fig figcaption{font-size:12.5px;padding:10px 12px 14px}
.figs.two{grid-template-columns:1fr 1fr}
.figs.one{grid-template-columns:minmax(0,340px);margin-top:24px;margin-bottom:0}
.figs.wide{grid-template-columns:1fr;margin-top:0;margin-bottom:26px}
.fig{margin:0;background:#fff;border-radius:var(--radius-img);overflow:hidden;box-shadow:0 1px 2px rgba(19,30,82,.06)}
.fig img{width:100%;height:auto;display:block}
.fig figcaption{font-size:13.5px;line-height:1.5;color:var(--text-secondary);padding:12px 16px 16px}
.credit{margin-top:14px}
@media (max-width:900px){.figs{grid-template-columns:1fr 1fr}.figs.two{grid-template-columns:1fr}}
@media (max-width:560px){.figs,.figs.three{grid-template-columns:1fr}}

/* the gauge: a ruler on the right edge that fills as the page is read, the site's one measuring instrument */
.gauge{position:fixed;right:26px;top:50%;height:40vh;width:14px;transform:translateY(-50%);z-index:20;pointer-events:none;color:var(--strand);--g:0}
.gauge::before{content:"";position:absolute;right:0;top:0;bottom:0;width:1px;background:currentColor;opacity:.2}
.gauge i{position:absolute;right:0;top:0;bottom:0;width:1px;background:currentColor;transform-origin:top;transform:scaleY(var(--g))}
.gauge b{position:absolute;right:-3px;top:calc(var(--g)*100%);width:7px;height:7px;margin-top:-3px;border-radius:50%;background:currentColor}
.gauge u{position:absolute;right:0;width:7px;height:1px;background:currentColor;opacity:.32}
.gauge.dark{color:var(--mucc-white)}
@media (max-width:1099px),(max-height:560px){.gauge{display:none}}

/* ---------- the screening (/assessment) ---------- */
.sx{min-height:72vh}
.sx-wrap{max-width:760px}
.sx-step > h1{font-size:var(--step-4);margin-bottom:22px}
.sx-step > .sx-title{font-size:var(--step-4);font-weight:700;letter-spacing:-.02em;margin-bottom:22px;outline:none}
.sx-step .commit{margin:22px 0 30px}
.sx-actions{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 18px}
.sx-link{background:none;border:0;padding:6px 0;color:var(--accent);font-weight:500;cursor:pointer;border-bottom:1px solid var(--mucc-blue-pale)}
.sx-link:hover{color:var(--text-primary);border-bottom-color:var(--accent)}
.sx-progress{height:4px;border-radius:var(--radius-pill);background:var(--mucc-blue-tint);overflow:hidden;margin:0 0 18px}
.sx-bar{display:block;height:100%;width:0;background:var(--accent);border-radius:inherit;transition:width .35s var(--ease-out)}
.sx-count{font-variant-numeric:tabular-nums;margin:0 0 26px;letter-spacing:.02em}
.sx-q{border:0;margin:0;padding:0;min-width:0}
.sx-qstack{display:grid;margin:0 0 34px}
.sx-qstack > *{grid-area:1 / 1;margin:0}
.sx-ghost{visibility:hidden;pointer-events:none}
.sx-qtext{font-size:clamp(1.5rem,1.1rem + 1.6vw,2.25rem);font-weight:500;line-height:1.25;letter-spacing:-.015em;max-width:30ch;outline:none}
.sx-qtext b{font-weight:700}
.sx-choices{display:grid;gap:12px;max-width:440px}
.sx-choice{display:flex;align-items:center;gap:16px;width:100%;text-align:left;padding:16px 20px;border-radius:14px;border:1px solid var(--rule);background:var(--panel);color:var(--text-primary);font-weight:600;font-size:1.0625rem;cursor:pointer;transition:border-color .15s,background-color .15s,transform .1s}
.sx-choice[hidden]{display:none}
@media (hover:hover){.sx-choice:hover{border-color:var(--accent)}}
.sx-choice:active{transform:scale(.99)}
.sx-choice[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--text-on-field)}
.sx-key{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;border:1px solid var(--mucc-blue-pale);color:var(--accent);font-size:.75rem;font-weight:600;flex:none}
.sx-choice[aria-pressed="true"] .sx-key{border-color:rgba(255,255,255,.6);color:var(--text-on-field)}
@media (pointer:coarse){.sx-key{display:none}}
.sx-nav{margin-top:30px}
.sx-form{display:grid;gap:16px;max-width:480px;margin-top:8px}
.sx-form label{display:grid;gap:6px;font-weight:500;font-size:.9375rem}
.sx-form input{font:inherit;font-weight:400;padding:14px 16px;border-radius:12px;border:1px solid var(--mucc-gray-300);background:var(--panel);color:var(--text-primary);width:100%}
.sx-form input:focus{outline:2px solid var(--focus-ring);outline-offset:1px;border-color:var(--accent)}
.sx-pick{border:0;margin:6px 0 0;padding:0;display:grid;gap:10px;min-width:0}
.sx-pick legend{font-weight:500;font-size:.9375rem;padding:0;margin:0 0 4px}
.sx-pick label{display:flex;align-items:center;gap:12px;padding:13px 16px;border:1px solid var(--rule);border-radius:12px;background:var(--panel);cursor:pointer;font-weight:500;font-size:.9375rem;transition:border-color .15s,background-color .15s}
.sx-pick label:has(input:checked){border-color:var(--accent);background:var(--mucc-blue-tint)}
.sx-pick input{width:18px;height:18px;margin:0;padding:0;border:0;background:none;accent-color:var(--accent);flex:none}
@media (hover:hover){.sx-pick label:hover{border-color:var(--accent)}}
.sx-opt{font-weight:400;color:var(--text-secondary);font-size:var(--step--1)}
.sx-help{font-weight:400;display:block}
.sx-pick label.sx-plain{display:grid;gap:6px;padding:0;border:0;background:none;cursor:auto;margin-top:6px}
.sx-pick label.sx-plain[hidden]{display:none}
.sx-pick label.sx-plain input{width:100%;padding:14px 16px;border:1px solid var(--mucc-gray-300);border-radius:12px;background:var(--panel);font:inherit;font-weight:400;color:var(--text-primary)}
.sx-pick label.sx-plain input:focus{outline:2px solid var(--focus-ring);outline-offset:1px;border-color:var(--accent)}
.sx-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.sx-error{color:var(--mucc-blue-deep);background:var(--mucc-blue-tint);border-radius:10px;padding:10px 14px;margin:0}
.sx-score{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;margin:6px 0 40px}
.sx-dial{width:148px;height:148px;border-radius:50%;background:var(--accent);color:var(--text-on-field);display:grid;place-content:center;text-align:center;box-shadow:var(--shadow-3)}
.sx-num{font-size:3.25rem;line-height:1;font-weight:700;letter-spacing:-.02em}
.sx-of{font-size:var(--step--1);color:var(--text-pale-on-field);margin-top:6px;letter-spacing:.06em}
.sx-headline{font-size:var(--step-4);font-weight:700;letter-spacing:-.02em;margin-bottom:12px;outline:none}
.sx-message{max-width:44ch;margin:0}
.sx-message b{font-weight:700;color:var(--text-primary)}
.sx-systems{background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius-card);padding:28px 30px;margin-bottom:36px}
.sx-h3{font-size:var(--step-1);margin:0 0 18px}
.sx-sys{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.sx-sys li{display:grid;grid-template-columns:1fr auto;gap:6px 16px;align-items:baseline}
.sx-sys-name{font-weight:500}
.sx-sys-n{font-size:var(--step--1);color:var(--text-secondary)}
.sx-sys-bar{grid-column:1 / -1;height:6px;border-radius:var(--radius-pill);background:var(--mucc-blue-tint);overflow:hidden}
.sx-sys-bar span{display:block;height:100%;background:var(--accent);border-radius:inherit}
.sx-idio{margin:18px 0 0}
.sx-next .read{margin-bottom:6px}
.sx-sent{margin-top:28px;font-weight:500;color:var(--text-primary)}
.sx-disclaimer{margin-top:28px;max-width:64ch}
@media (max-width:600px){
  .sx-score{grid-template-columns:1fr;gap:22px}
  .sx-dial{width:120px;height:120px}
  .sx-num{font-size:2.6rem}
  .sx-systems{padding:22px 20px}
  .sx-actions .btn{white-space:normal;text-align:center;width:100%}
}

/* forms ported from Typeform (/intake, /silent-breakdown, /root-cause, /case-review): form.js, built on the .sx screening styles */
.fx-help{margin:-18px 0 26px;max-width:60ch}
.fx-choices{max-width:560px}
.fx-input{font:inherit;font-weight:400;padding:14px 16px;border-radius:12px;border:1px solid var(--mucc-gray-300);background:var(--panel);color:var(--text-primary);width:100%;max-width:560px}
textarea.fx-input{resize:vertical;min-height:140px;line-height:1.5}
.fx-input:focus{outline:2px solid var(--focus-ring);outline-offset:1px;border-color:var(--accent)}
.fx-other{margin-top:12px;max-width:560px}
.fx-hint{margin:14px 0 0}
.fx-scale{display:grid;grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:8px;max-width:640px}
.fx-num{justify-content:center;padding:14px 0;font-variant-numeric:tabular-nums}
.fx-ends{display:flex;justify-content:space-between;gap:16px;max-width:640px;margin:10px 0 0}

/* the hero figure: words on the left, the diagram on the right. The stage sits exactly below the sticky nav. */
.stage.fig-hero{top:var(--nav-h,73px);height:calc(100vh - var(--nav-h,73px));height:calc(100svh - var(--nav-h,73px))}
.figure{position:absolute;right:8vw;top:50%;transform:translateY(-50%);height:min(calc(100% - 40px),780px);aspect-ratio:480/780;pointer-events:none;opacity:0}
.figure svg{width:100%;height:100%;overflow:visible}
.figure .pulse{animation:ringpulse 4.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes ringpulse{0%,100%{opacity:.2;transform:scale(1)}50%{opacity:.7;transform:scale(1.35)}}
.fig-hero .band.left,.fig-hero .band.right{left:6vw;right:auto;width:min(40vw,560px);text-align:left}
.fig-hero .band.low{top:50%;transform:translateY(-50%)}
.fig-hero .band::before{inset:-10% -8%;background:radial-gradient(ellipse 70% 62% at 40% 50%,rgba(244,243,239,var(--scrim,.5)) 0%,rgba(244,243,239,0) 76%)}
.fig-hero .band.settle{left:6vw;top:50%;transform:translateY(-50%);width:min(42vw,560px);text-align:left;background:none;box-shadow:none;padding:0;border-radius:0}
.fig-hero .band.settle .held{display:none}
.fig-hero .band.settle .cta-row{align-items:flex-start}
.fig-hero .band.settle .guard{margin-bottom:.4em}
.fig-hero .cue{left:6vw;transform:none;bottom:34px}

/* the stills hero: photographs of a glass figure and the atlas, with the story drawn over them by the scroll */
.stills{position:absolute;inset:0;overflow:hidden;opacity:0;background:var(--canvas)}
.stills .plate{position:absolute;inset:0;will-change:transform,opacity}
.stills .plate img,.stills .plate svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.stills .plate img{object-fit:cover;object-position:var(--ox,100%) 0%}
.stills .plate-atlas{opacity:0}
.stills .plate-atlas img{object-position:var(--oxa,100%) var(--oya,50%)}
.stills .plate-body .on{opacity:0}
.fig-hero .stills ~ .band::before,.fig-hero .band::before{display:none}

.plate-note{position:absolute;right:56px;bottom:20px;margin:0;padding:4px 10px;border-radius:999px;background:rgba(244,243,239,.92);font-family:var(--font-core);font-weight:500;font-size:12px;letter-spacing:.02em;color:var(--text-primary);pointer-events:none}
@media (max-width:1099px){.plate-note{right:20px}}

/* the woman's portraits are on pure white, so multiply drops their background out and she stands on the same studio
   backdrop as the figure: an empty wall fitted to the figure still, positioned exactly as the plates are */
.stills{isolation:isolate;background:url(../img/hero-backdrop.jpg) var(--ox,100%) 0%/cover no-repeat var(--canvas)}
.stills .plate-person{mix-blend-mode:multiply;pointer-events:none}
.stills .plate-person img{opacity:0;object-position:var(--oxp,var(--ox,100%)) 0%}

/* the hero's static pose (reduced motion): the same left lane as the captions, no card */
.fig-hero .static-hero{justify-content:flex-start;text-align:left;padding:0 6vw}
.fig-hero .static-hero .lane{background:none;box-shadow:none;padding:0;max-width:min(42vw,560px)}
.fig-hero .static-hero .display{font-size:clamp(30px,4.4vw,60px)}
.fig-hero .static-hero .sub{margin-left:0}
.fig-hero .static-hero .held{display:none}
.symptoms{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* narrow screens: the picture is centred on the figure, the words sit in a panel at the foot of the screen */
@media (max-width:1179px),(max-aspect-ratio:31/20),(max-height:560px){
  .fig-hero .band.left,.fig-hero .band.right,.fig-hero .band.settle{left:14px;right:14px;width:auto;top:auto;bottom:14px;transform:none;translate:none;text-align:left;background:rgba(244,243,239,.94);border-radius:16px;padding:16px 18px 18px;box-shadow:var(--shadow-3);text-shadow:none}
  .fig-hero .band.mid,.fig-hero .band.low{top:auto;transform:none}
  .fig-hero .band h2{font-size:clamp(23px,6.8vw,30px);margin-bottom:.3em}
  .fig-hero .band .sub{font-size:15px;line-height:1.4}
  .fig-hero .band.settle h2{font-size:clamp(25px,7.2vw,32px)}
  .fig-hero .band.settle .cta-row{margin-top:14px;align-items:flex-start}
  .fig-hero .band.settle .guard{font-size:15px}
  .symptoms span{font-family:var(--font-read);font-style:italic;font-size:14px;color:var(--text-primary);border:1px solid var(--rule-strong);border-radius:999px;padding:3px 10px}
  .fig-hero .cue{left:auto;right:14px;top:12px;bottom:auto;transform:none}
  .plate-note{top:12px;left:14px;right:auto;bottom:auto;font-size:12px}
  .fig-hero .static-hero{align-items:flex-end;padding:0 14px 14px}
  .fig-hero .static-hero .lane{background:rgba(244,243,239,.94);padding:18px;border-radius:16px;max-width:none;box-shadow:var(--shadow-3)}
}

@media (min-width:721px) and (max-width:1179px){
  .fig-hero .band.left,.fig-hero .band.right,.fig-hero .band.settle{left:24px;right:auto;width:min(560px,calc(100% - 48px));bottom:24px;padding:20px 24px 22px}
  .fig-hero .band h2{font-size:clamp(26px,3.4vw,38px)}
  .fig-hero .band .sub{font-size:17px}
  .fig-hero .band.settle h2{font-size:clamp(28px,3.6vw,40px)}
}

/* no JavaScript: the hero rests on its final pose and the call to action, never an empty tall page */
html:not(.js) .hero{height:calc(100vh - var(--nav-h,73px));height:calc(100svh - var(--nav-h,73px))}
html:not(.js) .stills{opacity:1}
html:not(.js) .plate-person .calm{opacity:1}
html:not(.js) .plate-body{opacity:0}
html:not(.js) .stage .band,html:not(.js) .stage .cue{display:none}
html:not(.js) .static-hero{display:flex}

/* short screens (landscape phones, heavy zoom): panels shrink and scroll rather than being cut off */
@media (max-height:560px){
  .fig-hero .band.left,.fig-hero .band.right,.fig-hero .band.settle{max-height:calc(100% - 16px);overflow:auto;padding:10px 14px 12px;bottom:8px}
  .fig-hero .band h2{font-size:clamp(18px,5.4vh,24px)}
  .fig-hero .band .sub{font-size:13px}
  .fig-hero .band.settle .guard{display:none}
  .fig-hero .band.settle .cta-row{margin-top:8px;gap:6px}
  .fig-hero .static-hero{padding:0 12px 8px}
  .fig-hero .static-hero .lane{padding:10px 14px;max-height:calc(100% - 8px);overflow:auto}
  .fig-hero .static-hero .eyebrow,.fig-hero .static-hero .sub,.fig-hero .static-hero .trust,.fig-hero .static-hero .alt{display:none}
  .fig-hero .static-hero .display{font-size:clamp(20px,5.5vh,26px);margin:0 0 8px}
}

/* navigation and touch */
@media (min-width:901px) and (max-width:1100px){.nav-links{gap:14px}.nav-links a{font-size:14px;white-space:nowrap}}
@media (pointer:coarse){.nav-toggle{min-height:44px}}

/* the text message consent on the screening: optional, never pre-checked, the full disclosure beside the box */
.sx-form .sx-consent{display:flex;gap:12px;align-items:flex-start;margin:4px 0 18px;font-size:14px;line-height:1.5;color:var(--text-secondary);font-weight:400}
.sx-form .sx-consent input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--mucc-blue)}
.sx-form .sx-consent b{color:var(--text-primary)}

/* The Lazar Method brand graphic */
/* Drawn from the brand graphic (Claude Design, michigan/brand/LazarMethod.html): the trefoil built one stroke per step.
   On the page it is always finished, as the brand graphic shows it. "Watch it build" (assets/js/lazar-method.js) opens a
   copy in a pop-up (.lm-dialog, also .lm-live) and plays the build once. */
.lm{margin-top:44px}
.lm-card{background:var(--panel);border:1px solid var(--rule);border-radius:14px;padding:56px 48px 40px;position:relative}
.lm-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:48px}
.lm-eyebrow{font:600 11px/1 var(--font-core);letter-spacing:.3em;text-transform:uppercase;color:var(--mucc-blue);margin:0}
.lm-title{font:700 44px/1.05 var(--font-core);letter-spacing:-.03em;color:var(--text-primary);margin:14px 0 0}
.lm-note{font:500 12.5px/1.5 var(--font-core);color:var(--text-secondary);max-width:34ch;text-align:right;margin:0}
.lm-row{position:relative}
.lm-rail{position:absolute;left:10%;right:10%;top:52px;height:2px;background:var(--rule)}
.lm-rail i{position:absolute;left:0;top:-1px;width:100%;height:4px;border-radius:2px;background:var(--mucc-blue);transform-origin:left center;transform:scaleX(0)}
.lm-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.lm-step{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;z-index:1}
.lm-mark{background:var(--panel);padding:0 10px;flex:none}
.lm-mark svg{display:block;width:104px;height:104px;overflow:visible}
.lm-base circle{stroke:var(--mucc-blue-tint)}
.lm-arcs circle{stroke:var(--mucc-blue)}
.lm-dot{fill:var(--mucc-blue)}
.lm-fill{fill:var(--mucc-blue)}
.lm-step.last .lm-arcs circle{stroke:var(--mucc-white)}
.lm-step.last .lm-dot{fill:var(--mucc-white)}
.lm-dot,.lm-fill{transform-box:fill-box;transform-origin:center}
.lm-num{display:block;font:600 11px/1 var(--font-core);letter-spacing:.24em;color:var(--mucc-blue);margin-top:22px}
.lm-name{font:700 30px/1 var(--font-core);letter-spacing:-.025em;color:var(--text-primary);margin:10px 0 0}
.lm-short{font:400 13.5px/1.55 var(--font-core);color:var(--text-secondary);margin:12px auto 0;max-width:21ch;text-wrap:pretty}
.lm-more{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.lm-loop{position:relative;margin-top:30px}
.lm-loop-svg{display:block;width:80%;height:70px;margin:0 auto;overflow:visible}
.lm-loop-svg g{stroke:var(--mucc-blue-pale)}
.lm-loop-label{text-align:center;font:600 10.5px/1 var(--font-core);letter-spacing:.26em;text-transform:uppercase;color:var(--mucc-blue);margin:-38px 0 0;position:relative}
.lm-loop-label span{background:var(--panel);padding:0 14px}
.lm-detail{margin-top:28px;display:grid;gap:16px;max-width:76ch}
.lm-detail p{margin:0;font-size:16px;line-height:1.65;color:var(--text-primary)}
.lm-detail b{font-weight:600}

/* live (the pop-up): each step starts unbuilt and builds in turn */
.lm-live .lm-words{opacity:.32}
.lm-live .lm-step .lm-dot,.lm-live .lm-step .lm-fill{transform:scale(0)}
.lm-live .lm-arcs circle{stroke-dasharray:0 100}
.lm-live .lm-loop{opacity:0}
.lm-live .lm-loop-line{stroke-dashoffset:1}


/* stacked: narrow screens; the line runs down through the marks */
@media (max-width:899px){
  .lm-card{padding:32px 20px 28px}
  .lm-head{flex-direction:column;align-items:flex-start;margin-bottom:32px;gap:14px}
  .lm-title{font-size:32px}
  .lm-note{text-align:left}
  .lm-steps{grid-template-columns:1fr;gap:30px}
  .lm-step{flex-direction:row;align-items:flex-start;text-align:left;gap:16px}
  .lm-mark{padding:6px 0}
  .lm-mark svg{width:64px;height:64px}
  .lm-rail{display:none}
  /* stacked, each step draws the line down to the next mark; it turns blue once the next step is reached (the pop-up) */
  .lm-step:not(.last)::after{content:"";position:absolute;left:31px;top:38px;width:2px;height:calc(100% + 30px);background:var(--rule);z-index:-1;transition:background-color .4s}
  .lm-live .lm-step:has(+ .lm-step.on)::after{background:var(--mucc-blue)}
  .lm-num{margin-top:6px}
  .lm-name{font-size:24px;margin-top:8px}
  .lm-short{margin:8px 0 0;max-width:none}
  .lm-more{position:static;width:auto;height:auto;margin:10px 0 0;overflow:visible;clip:auto;white-space:normal;font-size:15px;line-height:1.6;color:var(--text-primary)}
  .lm-loop{margin-top:28px}
  .lm-loop-svg{display:none}
  .lm-loop-label{margin:0;text-align:left;padding-left:80px;line-height:1.6}
  .lm-loop-label span{padding:0}
  .lm-detail{display:none}
}
.lm-play-row{margin:20px 0 0}
.lm-play-row .btn{gap:8px}
.lm-play-row svg{width:14px;height:14px}

/* the pop-up */
html.lm-modal-open{overflow:hidden}
.lm-dialog{border:0;padding:0;background:transparent;width:min(1180px,calc(100vw - 32px));max-width:none;max-height:calc(100vh - 32px);overflow:visible}
.lm-dialog::backdrop{background:rgba(19,30,82,.62)}
.lm-dialog-in{position:relative;background:var(--panel);border-radius:16px;max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 24px 64px rgba(19,30,82,.28)}
.lm-dialog .lm-card{border:0;border-radius:16px}
.lm-dialog .lm-detail{display:none}
.lm-close{position:absolute;top:14px;right:14px;z-index:3;width:44px;height:44px;border-radius:50%;border:1px solid var(--rule);background:var(--panel);color:var(--text-primary);display:grid;place-items:center;cursor:pointer}
.lm-close svg{width:18px;height:18px}
.lm-close:hover{border-color:var(--accent);color:var(--accent)}
.lm-dialog-bar{display:flex;justify-content:flex-end;gap:10px;margin:0;padding:0 48px 32px}
@media (max-width:899px){
  .lm-dialog-bar{padding:4px 18px 20px}
  .lm-dialog .lm-card{padding:24px 18px 8px}
  .lm-dialog .lm-head{margin-bottom:18px;padding-right:44px}
  .lm-dialog .lm-title{font-size:26px}
  .lm-dialog .lm-note{display:none}
  .lm-dialog .lm-steps{gap:14px}
  .lm-dialog .lm-mark svg{width:52px;height:52px}
  .lm-dialog .lm-step:not(.last)::after{left:25px;top:32px;height:calc(100% + 14px)}
  .lm-dialog .lm-num{margin-top:2px}
  .lm-dialog .lm-name{font-size:20px;margin-top:4px}
  .lm-dialog .lm-short{font-size:13px;margin-top:4px}
  .lm-dialog .lm-loop{margin-top:16px}
  .lm-dialog .lm-loop-label{padding-left:68px}
}
/* end Lazar Method */

/* chat: GHL's floating launcher and greeting stay hidden while the chat is closed, so nothing covers the page;
   the "Text us" button in the top bar opens it (site.js shows the button once the chat has loaded) */
chat-widget:not([data-active="true"]){display:none !important}
.nav-chat{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;background:none;border:1px solid var(--rule);border-radius:var(--radius-pill);padding:8px 14px;font:600 13px/1 var(--font-core);color:var(--text-primary);cursor:pointer}
.nav-chat[hidden]{display:none}
.nav-chat:hover{border-color:var(--accent);color:var(--accent)}
.nav-chat:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.nav-chat svg{width:18px;height:18px;flex:none}
@media (max-width:1499px){.nav-chat{padding:8px 10px}.nav-chat-l{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}}
.nav-links a{white-space:nowrap}
@media (min-width:901px) and (max-width:1099px){.nav .xs-hide{display:none}}
.nav-right{display:flex;align-items:center;gap:18px}
@media (max-width:640px){.nav-right{gap:8px}.nav .xs-hide{display:none}}
@media (max-width:360px){.nav .brand img{height:28px}.nav .btn-sm{padding:9px 11px}.nav-toggle{padding:8px 10px}.nav-chat{padding:8px}}
@media (min-width:901px) and (max-width:990px){.nav-links{gap:10px}.nav-links a{font-size:13px}.nav .brand img{height:34px}}
@media (max-width:1260px){.nav .phone{display:none}}   /* with the chat button, the top bar fits only with the short "Start" here */
@media (pointer:coarse){.nav-chat{min-height:44px;min-width:44px;justify-content:center}}

/* consultation request (/consultation, assets/js/consultation.js) */
.cr{background:var(--panel);border-radius:var(--radius-card);padding:32px 28px;box-shadow:0 1px 2px rgba(19,30,82,.06),0 1px 1px rgba(19,30,82,.04)}
.cr .sx-form{max-width:none;margin:0}
.cr-h{font:600 20px/1.3 var(--font-core);color:var(--text-primary);margin:0 0 6px;padding:0}
.cr-step{border:0;margin:0 0 18px;padding:0;min-width:0;display:grid;gap:14px}
.cr-days,.cr-times{display:flex;flex-wrap:wrap;gap:8px}
.cr-chip{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:76px;min-height:48px;padding:9px 12px;border-radius:12px;border:1px solid var(--rule);background:var(--panel);color:var(--text-primary);font:inherit;cursor:pointer;transition:border-color .15s,background-color .15s}
.cr-chip b{font-weight:600;font-size:15px;line-height:1.2}
.cr-chip span{font-size:12.5px;line-height:1.2;color:var(--text-secondary)}
.cr-chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--text-on-field)}
.cr-chip[aria-pressed="true"] span{color:var(--text-on-field)}
@media (hover:hover){.cr-chip:hover{border-color:var(--accent)}}
.cr-chip:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.cr-picked{margin:0;color:var(--text-primary);font-weight:500;min-height:1.5em}
.cr-loading{margin:0;color:var(--text-secondary)}
.cr-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.cr-two{grid-template-columns:1fr}.cr{padding:24px 18px}}
.sx-form textarea,.sx-form select{font:inherit;font-weight:400;padding:14px 16px;border-radius:12px;border:1px solid var(--mucc-gray-300);background:var(--panel);color:var(--text-primary);width:100%}
.sx-form textarea{resize:vertical;min-height:96px}
.sx-form textarea:focus,.sx-form select:focus{outline:2px solid var(--focus-ring);outline-offset:1px;border-color:var(--accent)}
.cr-done{outline:none;scroll-margin-top:calc(var(--nav-h,73px) + 24px)}
.cr [hidden]{display:none!important}   /* .sx-form and the chips set display, which would otherwise beat [hidden] */
@media (pointer:coarse){.sx-form input,.sx-form textarea,.sx-form select{font-size:16px}}   /* below 16px, iPhone Safari zooms into the field */
.cr-done .cr-when{font-weight:600;color:var(--text-primary)}
.cr-form.cr-gated > .cr-after{display:none!important}   /* the request waits behind the three questions */
.cr-fit .cr-step{margin:0}
.cr-fit .sx-pick{margin-top:10px}
.cr-fit-intro{margin:0 0 4px;color:var(--text-secondary)}
.cr-fit-help{margin:0 0 4px;color:var(--text-secondary);font-weight:400}
.cr-notfit{background:var(--mucc-blue-tint);border-radius:12px;padding:20px 20px 8px;outline:none}
.cr-notfit .cr-notfit-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cr .sx-link{background:none;border:0;padding:6px 0;font:inherit;font-weight:500;color:var(--accent);text-decoration:underline;cursor:pointer}

/* remote care application, step by step (/remote-care #apply, assets/js/remote-care.js): built on .cr and the .sx form styles */
.rc-form .sx-progress{margin:0 0 10px}
.rc-count{margin:0 0 18px;color:var(--text-secondary)}
.rc-step > legend{outline:none;margin-bottom:4px}
.rc-child{display:grid;gap:14px}
.rc-form .cr-two{align-items:end}
.rc-help{margin:-4px 0 0;color:var(--text-secondary);font-weight:400}
.rc-vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.rc-actions{align-items:center}
.rc-back{order:-1;margin-right:auto}
.rc-next-steps{margin:14px 0 18px;padding-left:1.3em;display:grid;gap:10px}
.rc-next-steps b{font-weight:600;color:var(--text-primary)}

/* sample Medicare card (FAQ, fit check) */
.mc-card{margin:12px 0 4px;max-width:340px}
.mc-card img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--rule)}
.mc-card figcaption{margin-top:6px;color:var(--text-secondary)}

/* four cards in a row (remote care: who this is for) */
.cards.cards-4{grid-template-columns:repeat(4,1fr)}
.cards-4 h3{font-size:20px;text-wrap:balance}
@media (max-width:1100px){.cards.cards-4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cards.cards-4{grid-template-columns:1fr}}

/* ---------- listen, watch, read (home #listen, /media) ---------- */
/* video that loads only when asked: a poster button, swapped for a youtube-nocookie player on click (site.js) */
.vid{position:relative;aspect-ratio:16/9;border-radius:var(--radius-card);overflow:hidden;background:var(--mucc-blue-deep);box-shadow:var(--shadow-3)}
.vid button{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer;display:block}
.vid img{width:100%;height:100%;object-fit:cover;display:block}
.vid .play{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;background:var(--mucc-blue);display:grid;place-items:center;box-shadow:0 6px 24px rgba(19,30,82,.45);transition:transform .2s var(--ease-out),background-color .2s}
.vid .play svg{width:26px;height:26px;fill:#fff;margin-left:5px}
.vid button:hover .play,.vid button:focus-visible .play{transform:scale(1.06);background:var(--mucc-blue-mid)}
.vid button:focus-visible{outline:3px solid var(--focus-ring);outline-offset:-3px}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid-cap{font-size:14px;color:var(--text-secondary);margin:12px 0 0}
.media-cards .card{gap:12px}
.media-cards .card .tag{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);font-weight:500;margin:0}
.media-cards .card .cta{margin-top:auto;padding-top:8px;display:flex;flex-wrap:wrap;gap:8px 16px}
.media-cards .book{display:grid;grid-template-columns:84px 1fr;gap:16px;align-items:start}
.cover{width:100%;height:auto;border-radius:4px;box-shadow:0 2px 6px rgba(19,30,82,.18),0 10px 24px rgba(19,30,82,.14)}
.book-feature{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:44px;align-items:center}
@media (max-width:700px){.book-feature{grid-template-columns:1fr;gap:28px}.book-feature .cover{max-width:220px}}
/* the book as a credibility showcase on /intensives and /remote-care: the cover is a link to buy it */
.cover-link{display:block;border:0;border-bottom:0;background:none;text-decoration:none;border-radius:4px;transition:transform .18s ease}
.cover-link:hover,.cover-link:focus-visible{transform:translateY(-3px)}
.cover-link:focus-visible{outline:2px solid var(--mucc-blue);outline-offset:4px}
.book-showcase .cover{display:block}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){.cover-link{transition:none}.cover-link:hover,.cover-link:focus-visible{transform:none}}
/* a full-width blue banner inside a light section: the show's own website (home #listen, /media) */
.banner{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;margin-top:22px;padding:30px 34px;border-radius:var(--radius-card);background:var(--mucc-blue);color:var(--mucc-white)}
.banner h3{color:var(--mucc-white);font-size:22px;margin:0 0 6px}
.banner p{margin:0;color:var(--mucc-blue-pale);font-size:15px;line-height:1.55;max-width:60ch}
.banner .btn-primary{background:var(--mucc-white);color:var(--mucc-blue);border-color:var(--mucc-white)}
.banner .btn-primary:hover{background:var(--mucc-blue-tint);border-color:var(--mucc-blue-tint)}
@media (max-width:600px){.banner{padding:24px 22px}}
/* a step-to-step path graphic (consultation: two visits; intensives: one stay). Plain HTML so it reflows on a phone. */
.flow{list-style:none;padding:0;margin:32px 0 8px;display:flex;align-items:stretch;gap:52px}
.flow > li{position:relative;flex:1 1 0;background:var(--panel);border-radius:var(--radius-card);padding:22px 22px 20px;box-shadow:0 1px 2px rgba(19,30,82,.06),0 1px 1px rgba(19,30,82,.04)}
.flow > li.main{flex-grow:1.35;background:var(--mucc-blue);color:var(--mucc-white)}
.flow .tag{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;color:var(--text-secondary);margin-bottom:12px}
.flow .main .tag{color:var(--mucc-blue-pale)}
.flow ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.flow ul li{font-size:15px;line-height:1.4;font-weight:500;padding-left:18px;position:relative}
.flow ul li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.55}
.flow .note{display:block;font-size:13px;margin-top:12px;color:var(--text-secondary)}
.flow .main .note{color:var(--mucc-blue-pale)}
.flow > li:not(:last-child)::after{content:"";position:absolute;right:-38px;top:50%;width:24px;height:24px;margin-top:-12px;background:no-repeat center/24px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2321328A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.g-tint .flow > li:not(.main){background:var(--panel)}
@media (max-width:760px){.flow{flex-direction:column;gap:44px}.flow > li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-36px;margin:0 0 0 -12px;transform:rotate(90deg)}}
/* an image inside a text column: room above it (after text) and below it (before text) */
.rev-group > .photo{margin-top:28px}
.rev-group > .photo:first-child{margin-top:0}
.rev-group > .photo + *{margin-top:24px}

/* Remote care: "who this is for" cases. Photo cards that open into more detail (like the old site's condition cards). */
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;align-items:stretch;grid-auto-rows:1fr}
.case{background:var(--panel);border-radius:var(--radius-card);overflow:hidden;box-shadow:0 1px 2px rgba(19,30,82,.06),0 1px 1px rgba(19,30,82,.04);display:flex;flex-direction:column;height:100%}
.case summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;flex:1}
.case summary::-webkit-details-marker{display:none}
.case summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.case-photo{display:block;flex:none;aspect-ratio:4/3;overflow:hidden;background:var(--mucc-bone-deep)}
.case-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s var(--ease-out)}
.case summary:hover .case-photo img{transform:scale(1.03)}
.case-head{display:flex;flex-direction:column;gap:6px;padding:22px 24px 22px;flex:1}
.case-t{font-family:var(--font-core);font-weight:600;font-size:20px;line-height:1.25;color:var(--text-primary);text-wrap:balance}
.case-s{font-size:14.5px;line-height:1.5;color:var(--text-primary)}
.case-more{margin-top:auto;padding-top:8px;font-size:13.5px;font-weight:600;color:var(--accent);display:inline-flex;align-items:center;gap:8px}
.case-more::after{content:"+";font-weight:400;font-size:20px;line-height:1;transition:transform .2s}
.case[open] .case-more{font-size:0}
.case[open] .case-more::before{content:"Close";font-size:13.5px}
.case[open] .case-more::after{transform:rotate(45deg)}
.case-body{padding:0 24px 24px;border-top:1px solid var(--rule);margin:0 24px;padding-left:0;padding-right:0}
.case-body p{font-size:14.5px;line-height:1.6;color:var(--text-secondary);margin:16px 0 0}
.case-body p b{color:var(--text-primary)}
@media (max-width:1100px){.cases{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cases{grid-template-columns:1fr;grid-auto-rows:auto}.case{height:auto}.case-t{min-height:calc(3 * 1.25em)}.case-s{min-height:calc(3 * 1.5em)}}
/* uniform cards: same title zone and descriptor zone in every card (tablet and desktop) */
@media (min-width:561px){
  .case-t{min-height:calc(2 * 1.25em)}
  .case-s{min-height:calc(3 * 1.5em)}
  .case[open] .case-body{display:none}
  .case.on{box-shadow:0 0 0 2px var(--accent)}
  .case-panel{margin-top:22px;background:var(--panel);border-radius:var(--radius-card);padding:32px 36px 30px;box-shadow:0 1px 2px rgba(19,30,82,.06),0 1px 1px rgba(19,30,82,.04)}
  .case-panel h3{font-size:22px;margin:0}
  .case-cols{display:grid;grid-template-columns:1fr;gap:4px}
  .case-cols p{font-size:15px;line-height:1.65;color:var(--text-secondary);margin:16px 0 0}
  .case-cols p b{display:block;color:var(--text-primary);margin-bottom:4px}
}
@media (min-width:1101px){
  .case-cols{grid-template-columns:repeat(3,1fr);gap:28px}
  .case-cols p:last-child{grid-column:1/-1;margin-top:6px}
}

/* ===== /intensives visuals (2026-10-28): line icons, photo strip, week-at-a-glance, fit marks, link-card photos ===== */
.ico{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ico.ico-sm{display:inline-block;width:20px;height:20px;vertical-align:-4px;margin-right:8px}
.ico.ico-tag{display:inline-block;width:20px;height:20px;vertical-align:-5px;margin-right:8px}
.ico-chip{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:var(--accent-muted);color:var(--accent);flex:none}
.card .ico-chip svg{width:26px;height:26px;stroke:var(--accent);stroke-width:1.6}
.card-head{display:flex;align-items:center;gap:14px}
.card-head h3{margin:0}
.steps .name .ico{color:var(--accent)}
.cost.cost-icons li{grid-template-columns:150px 1fr}
.cost.cost-icons .price.small-cap{display:flex;align-items:center;gap:0}
.cost.cost-icons .price .ico{color:var(--accent);margin-right:8px;vertical-align:baseline}
@media (max-width:600px){.cost.cost-icons li{grid-template-columns:1fr}}
.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:32px 0 8px}
.strip figure{margin:0}
.strip img{height:auto;display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-img);background:var(--mucc-bone-deep)}
.strip .chart img{object-fit:contain;background:#fff;padding:10px;box-sizing:border-box}
.strip figcaption,.photo-row figcaption{font-size:13px;color:var(--text-secondary);margin-top:10px}
@media (max-width:760px){.strip{grid-template-columns:1fr}}
.head-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.head-split .rev-group h2{max-width:none}
.head-photo{margin:0}
.head-photo img{height:auto;display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-img);background:var(--mucc-bone-deep)}
@media (max-width:900px){.head-split{grid-template-columns:1fr;gap:24px}}
.weekfig{margin:32px 0 0}
.weekstrip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.weekstrip li{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:11.5px;line-height:1.25;color:var(--text-secondary);padding:10px 2px;border-radius:12px;background:var(--mucc-bone)}
.weekstrip b{font-weight:600;font-size:13px;color:var(--text-primary)}
.weekstrip .halves{display:flex;flex-direction:column;gap:4px;width:70%;max-width:44px;min-height:46px;justify-content:center;align-items:center}
.weekstrip .halves i{display:block;width:100%;height:20px;border-radius:5px;background:var(--accent)}
.weekstrip .halves i.off{background:transparent;border:1.5px dashed var(--rule-strong)}
.weekstrip .halves.rest{color:var(--accent)}
.weekstrip .halves.off{opacity:.9}
.weekstrip li.open span:last-child,.weekstrip li.part span:last-child{color:var(--text-primary);font-weight:500}
.weekfig figcaption{font-size:13px;color:var(--text-secondary);margin-top:12px;max-width:64ch}
@media (max-width:420px){.weekstrip{gap:3px}.weekstrip li{font-size:10.5px}}
.photo-row{margin:28px 0 0}
.photo-row img{height:auto;display:block;width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:var(--radius-img)}
ul.marks{list-style:none;padding:0;display:grid;gap:14px}
ul.marks li{display:flex;gap:12px;align-items:flex-start;padding-left:0}
ul.marks .ico-mark{width:22px;height:22px;margin-top:1px;padding:3px;box-sizing:content-box;border-radius:50%;border:1.5px solid currentColor}
.g-field ul.fitmarks .ico-mark{background:var(--mucc-white);color:var(--mucc-blue);border-color:var(--mucc-white)}
.g-field ul.notmarks li .ico-mark{color:var(--text-pale-on-field);border-style:dashed}
.g-field ul.notmarks li.urgent{border:1.5px solid rgba(255,255,255,.7);background:rgba(255,255,255,.1);border-radius:14px;padding:14px 16px;color:var(--text-on-field);font-weight:600;font-size:1.0625rem}
.g-field ul.notmarks li.urgent .ico-mark{color:var(--text-on-field);border:0;padding:0;width:26px;height:26px;border-radius:0;stroke-width:1.8}
.card.has-photo{overflow:hidden}
.card-photo{height:auto;display:block;width:calc(100% + 56px);max-width:none;margin:-32px -28px 8px;aspect-ratio:16/9;object-fit:cover}

/* The Lazar Method step pages (/method-measure ... /method-restore) */
.lms-head{display:flex;align-items:center;gap:36px}
.lms-mark{flex:none}
.lms-mark .lm-mark{background:none;padding:0}
.lms-mark .lm-mark svg{width:140px;height:140px}
.lms-steps{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.lms-steps a{font-weight:600;font-size:.875rem;color:var(--mucc-blue);background:var(--panel);border:1px solid var(--rule);border-radius:999px;padding:7px 14px;text-decoration:none}
.lms-steps a[aria-current="page"]{background:var(--mucc-blue);border-color:var(--mucc-blue);color:var(--mucc-white)}
.lms-body p{margin:0 0 18px}
.lms-nav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:40px;padding-top:24px;border-top:1px solid var(--rule)}
@media (max-width:699px){.lms-head{flex-direction:column;align-items:flex-start;gap:20px}.lms-mark .lm-mark svg{width:96px;height:96px}}
.road-fig{margin:28px 0 0}.road-fig img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--rule);background:#F4F3EF}.road-fig figcaption{font-size:13px;color:var(--text-secondary);margin-top:10px}