@property --intro-progress{syntax:"";inherits:true;initial-value:0}.careflow-intro{position:relative;background-color:var(--color-bg);isolation:isolate;--intro-headline-top: 50vh;--intro-headline-rise: 50vh;--intro-scroll-length: 200vh;--careflow-stage-height: 44vh}.careflow-intro::before{content:"";position:absolute;inset-block-start:0;inset-inline:0;block-size:var(--gradient-hero-extent);background-image:var(--gradient-hero);opacity:var(--gradient-hero-opacity);pointer-events:none;z-index:-1}.careflow-intro__stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-16);min-height:100svh;padding:var(--space-16) var(--container-gutter);text-align:center}.careflow-intro__headline{white-space:pre-line;margin:0;max-inline-size:var(--container-max);color:var(--color-accent);font-size:var(--font-size-mobile-h1);font-weight:var(--font-weight-regular);line-height:var(--line-height-h1);letter-spacing:var(--tracking-h1);text-wrap:balance}@media(min-width: 1025px){.careflow-intro__headline{font-size:var(--font-size-large);line-height:var(--line-height-display);letter-spacing:var(--tracking-display)}}.careflow-intro__accent{color:var(--color-blue-mid)}.careflow-intro__handoff{display:flex;align-items:center;justify-content:center;gap:0;margin:0;color:var(--color-accent);font-size:min(1rem,4.1vw);text-align:center}@media(min-width: 1025px){.careflow-intro__handoff{font-size:var(--font-size-large-body)}}.careflow-intro__scroll-hint{position:absolute;inset-block-end:1.25rem;inset-inline:0;display:flex;justify-content:center;color:var(--color-accent);pointer-events:none}.careflow-intro__scroll-hint svg{inline-size:1.125rem;block-size:1.125rem}@media(min-width: 1025px){.careflow-intro__scroll-hint{display:none}}.careflow-scene--active .careflow-intro__scroll-hint{opacity:calc(1 - var(--p-fade))}.careflow-intro__logotype{display:inline-block;block-size:1.1em;inline-size:auto;margin-inline:.35em}.careflow-intro__tm{align-self:flex-start;margin-inline-start:-0.2em;font-size:.5em;opacity:.7}:root:has(.careflow-scene--active){scroll-snap-type:y proximity}:root:has(.careflow-scene--active).careflow-scene-settled{scroll-snap-type:none}@media(min-width: 1025px){:root:has(.careflow-scene--active){scroll-snap-type:y mandatory}:root:has(.careflow-scene--active).careflow-scene-settled{scroll-snap-type:none}}.careflow-scene{position:relative;background-color:var(--color-bg);--careflow-slides: 2}@media(min-width: 1025px){.careflow-scene{--careflow-slides: 3}}.careflow-scene{--careflow-vh: 100vh}@supports (block-size: 100svh){.careflow-scene{--careflow-vh: 100svh}}.careflow-scene{--intro-lockup-top: 6.75rem;--intro-lockup-top-a: 87svh;--intro-lockup-scale: 2;--intro-bar-height: 11.875rem;--intro-bar-fade: 4rem;--intro-lockup-travel: calc(var(--intro-lockup-top-a) - var(--intro-lockup-top))}@media(min-width: 1025px){.careflow-scene{--intro-lockup-top: calc(var(--header-block) + var(--space-20));--intro-lockup-top-a: 90vh;--intro-lockup-scale: 2.05}}.careflow-scene{--intro-lockup-height-b: 3.05rem;--careflow-pill-gap: 2rem;--stack-top: 8.6875rem;--stack-rise-b: 13.125rem}.careflow-scene--active{block-size:calc(var(--careflow-slides)*var(--careflow-vh))}@media(max-width: 1024px){.careflow-scene--active{block-size:auto;min-block-size:calc(var(--careflow-slides)*var(--careflow-vh))}}.careflow-scene--active .careflow-intro{position:sticky;inset-block-start:0;block-size:var(--careflow-vh);background-color:rgba(0,0,0,0);pointer-events:none;z-index:1}@media(max-width: 1024px)and (prefers-reduced-motion: no-preference){.careflow-scene--active .careflow-intro__handoff{transition:opacity var(--duration-base) var(--easing-standard),visibility 0s linear 0s}}@media(max-width: 1024px){:root[data-careflow-pill-stuck] .careflow-scene--active .careflow-intro__handoff,:root[data-careflow-pill-stuck] .careflow-scene--active .careflow-intro::after{opacity:0;visibility:hidden;pointer-events:none}}@media(max-width: 1024px)and (prefers-reduced-motion: no-preference){:root[data-careflow-pill-stuck] .careflow-scene--active .careflow-intro__handoff{transition:opacity var(--duration-base) var(--easing-standard),visibility 0s linear var(--duration-base)}}.careflow-scene--active .careflow-intro::after{content:"";position:absolute;inset-block-start:0;inset-inline:0;block-size:calc(var(--intro-bar-height) + var(--intro-bar-fade));background-image:linear-gradient(to bottom, var(--color-bg) 0, var(--color-bg) var(--intro-bar-height), transparent 100%);opacity:var(--p-move);pointer-events:none;z-index:-1}.careflow-scene--active .careflow-intro::before{opacity:calc(var(--gradient-hero-opacity)*(1 - var(--p-wash)))}.careflow-scene--active .careflow-explorer{padding-block-start:var(--intro-bar-height)}.careflow-scene--active .careflow-explorer__body{margin-block-start:0}.careflow-scene--active .careflow-intro__stage{min-block-size:0;block-size:100%;padding-block:0}.careflow-scene--active .careflow-intro__headline{position:absolute;inset-block-start:50%;inset-inline:var(--container-gutter);translate:0 -50%;opacity:calc(1 - var(--p-fade))}@media(min-width: 1025px){.careflow-scene--active .careflow-intro{position:absolute;block-size:auto}}.careflow-scene--active .careflow-scene__stage{display:contents}@media(min-width: 1025px){.careflow-scene--active .careflow-scene__stage{display:block;position:sticky;inset-block-start:0;block-size:var(--careflow-vh)}}.careflow-scene--active .careflow-scene__stage{z-index:1}.careflow-scene--active .careflow-scene__stage::before{content:"";position:absolute;inset-block-start:0;inset-inline:0;block-size:213vh;background-image:var(--gradient-hero);opacity:calc(var(--gradient-hero-opacity)*(1 - var(--p-wash)));pointer-events:none;z-index:0}.careflow-scene__slide{position:absolute;inset-inline:0;block-size:var(--careflow-vh);pointer-events:none}.careflow-scene--active .careflow-scene__slide{scroll-snap-align:start}.careflow-scene__slide[data-scene-slide=a]{inset-block-start:0}.careflow-scene__slide[data-scene-slide=b]{inset-block-start:var(--careflow-vh)}.careflow-scene__slide[data-scene-slide=c]{display:none}@media(min-width: 1025px){.careflow-scene__slide[data-scene-slide=c]{display:block;inset-block-start:calc(var(--careflow-vh)*2)}.careflow-scene--active .careflow-scene__slide[data-scene-slide=c]{scroll-snap-align:start}}.careflow-scene--active{--p: var(--careflow-scene-progress, 0);--p-move: var(--p);--p-fade: clamp(0, calc(var(--p) / 0.5), 1);--p-exit: 0;--p-wash: clamp(0, calc(var(--p) / 0.5), 1)}@media(min-width: 1025px){.careflow-scene--active{--p-move: clamp(0, calc(var(--p) / 0.4), 1);--p-fade: clamp(0, calc(var(--p) / 0.22), 1);--p-exit: clamp(0, calc((var(--p) - 0.55) / 0.25), 1);--p-wash: clamp(0, calc(var(--p) / 0.45), 1)}}.careflow-scene--active .careflow-intro__stage{justify-content:flex-start}.careflow-scene--active .careflow-intro__handoff{transform-origin:top center;margin-block-start:var(--intro-lockup-top-a);translate:0 calc((var(--intro-lockup-top) - var(--intro-lockup-top-a))*var(--p-move));scale:calc(1 + (var(--intro-lockup-scale) - 1)*var(--p-move));max-inline-size:calc(96%/var(--intro-lockup-scale));inline-size:auto;margin-inline:auto;flex-wrap:wrap;text-wrap:balance}.careflow-scene--active .careflow-intro__handoff>span:first-child{flex-basis:100%}.careflow-scene--active .careflow-intro__handoff{line-height:var(--line-height-h1)}@media(min-width: 1025px){.careflow-scene--active .careflow-intro__stage{justify-content:center}.careflow-scene--active .careflow-intro__handoff{margin-block-start:0;translate:none;scale:none;max-inline-size:none;inline-size:fit-content;flex-wrap:nowrap;line-height:var(--line-height-text)}.careflow-scene--active .careflow-intro__handoff>span:first-child{flex-basis:auto}}@media(min-width: 1025px){.careflow-scene--active .careflow-intro{position:absolute;inset:0;background-color:rgba(0,0,0,0);z-index:1;pointer-events:none}.careflow-scene--active .careflow-intro::before{display:none}.careflow-scene--active .careflow-intro__stage{display:block;block-size:100%;min-block-size:0;padding-block:0}.careflow-scene--active .careflow-intro__headline{position:absolute;inset-inline:var(--container-gutter);margin-inline:auto}.careflow-scene--active .careflow-intro__handoff{position:absolute;inset-inline:0;inline-size:fit-content;max-inline-size:100%;margin-inline:auto}.careflow-scene--active .careflow-intro__headline{inset-block-start:50%;translate:0 calc(-50% - var(--intro-headline-rise)*var(--p-move));opacity:calc(1 - var(--p-fade))}.careflow-scene--active .careflow-intro__handoff{transform-origin:top center;inset-block-start:var(--intro-lockup-top);translate:0 calc(var(--intro-lockup-travel)*(1 - var(--p-move)) - var(--intro-headline-rise)*var(--p-exit));scale:calc(1 + (var(--intro-lockup-scale) - 1)*var(--p-move));opacity:calc(1 - var(--p-exit))}} /* ADX-WHEEL-TRAP-2026-09-15:START */ /* P-A: "evaluate if the scroll mechanism works properly with a standard mouse". It did not. Measured at 1440x900, three single wheel notches from the top: scrollY 0 -> 99 -> 87 -> 64 -> 36 -> 6 -> 0 `scroll-snap-type: y mandatory` with 900px stops pulls back any scroll that rests before the 450px midpoint. A mouse wheel notch is about 100px, so every notch is undone and the page cannot be scrolled at all by wheel until the reader flings hard enough to cross the midpoint in one gesture. A trackpad flings; a mouse does not. ⚠ THIS IS THE BOARD'S ORIGINAL "I can't scroll down", and it survived an earlier pass because that pass tested with a fling and not with notches. FIRST ATTEMPT WAS `proximity` AND IT WAS NOT ENOUGH. Measured after shipping it: 0 -> 99 -> 87 -> 64 -> 36 -> 13 -> 1 -> 0 still trapped, because 99px is itself WITHIN proximity range of the stop at 0, so the notch is still undone. Proximity only helps when a stop is far away; the first stop is the one the reader starts on. `none` measured, same three notches: 100 -> 200 -> 300, each notch holding, progress advancing. Nothing needs the snap: the animation is scrubbed continuously off --careflow-scene-progress, the scene already sets `none` once settled, and `careflow:advance` uses scrollIntoView which is unaffected. Snap was only choosing where the scroll came to rest, and that preference is not worth a page a mouse cannot scroll. Same selector as the rule it overrides, later in the file. */ @media(min-width: 1025px){ :root:has(.careflow-scene--active){ scroll-snap-type: none } } /* ADX-WHEEL-TRAP-2026-09-15:END */ /* ADX-INTRO-2026-09-24:START */ /* Board recOy4IRLwkvJ6wgC - "more padding on the sides so the text sits more centered". The headline ran the full 1200px container at 60px, so its first sentence spanned 1152px - edge to edge on a 14" laptop. A 60rem measure breaks that sentence into two balanced lines (text-wrap:balance is already on it) and leaves ~400px either side at 1512. Size, colour and copy are unchanged. The auto-scroll half of the ticket is deliberately not built: it is the scroll trap removed on 2026-09-15. */ @media (min-width: 1025px){ .careflow-intro__headline{max-inline-size:min(var(--container-max), 60rem)} } /* Board reccDadTqr06HfE99 - phone, "smoothen it as it's a bit jittery". Two causes that can go without touching the choreography: (1) proximity scroll-snap on the scene slides, which on iOS takes the scroll away from the finger at the end of a flick so the scrubbed animation jumps with it - desktop already runs snap-free for the same reason (ADX-WHEEL-TRAP-2026-09-15); (2) the two moving layers are promoted up front, so a frame is a composite rather than a repaint. module.js also now publishes --careflow-scene-progress on the scene, not on , so a frame restyles the scene and not the whole document. */ @media (max-width: 1024px){ :root:has(.careflow-scene--active){scroll-snap-type:none} .careflow-scene--active .careflow-intro__headline, .careflow-scene--active .careflow-intro__handoff{will-change:transform,opacity} } /* ADX-INTRO-2026-09-24:END */ /* ADX-ER3-AUTO-REVEAL-2026-09-24:START */ /* The opening now plays on its own (module.js), so on desktop only the three floors need scroll: the scene drops from 3 screens to 2 and each floor keeps its ~330px. */ @media (min-width: 1025px) and (prefers-reduced-motion: no-preference){ .careflow-scene{--careflow-slides:2} } /* ADX-ER3-AUTO-REVEAL-2026-09-24:END */ /* ADX-PT-PLATFORM-2026-09-27:START */ /* P-A 2026-09-27 (fix round, platform page): show ER's H1 above the building and close the white space so the floor map aligns with the first floor name. Desktop (>=1025px, motion allowed) only. module.js measures and publishes --adx-art-drop / --adx-h1-* on the scene and --adx-pull on the section after it; this sheet consumes them. Phones and reduced motion keep the stacked layout, where the H1 is already the first screen. */ @media (min-width:1025px) and (prefers-reduced-motion:no-preference){ .careflow-scene--panel .careflow-intro__headline{ inset-block-start:var(--adx-h1-top,6.5rem); inset-inline:var(--adx-h1-left,9rem) auto; inline-size:var(--adx-h1-width,50rem); max-inline-size:none; margin:0; translate:none; white-space:normal; text-align:left; text-wrap:balance; font-size:clamp(1.375rem,1.95vw,1.75rem); line-height:1.2; letter-spacing:normal; opacity:1; transition:opacity 420ms ease-out; } .careflow-scene--panel .careflow-intro__headline>span{white-space:normal} .careflow-scene--panel .careflow-explorer__stack{margin-block-start:var(--adx-art-drop,0px)} .careflow-scene--active + .container-fluid{margin-block-start:calc(-1 * var(--adx-pull,0px));position:relative;z-index:2} } /* ADX-PT-PLATFORM-2026-09-27:END */ /* ADX-CAREFLOW-PHONE-2026-10-03:START - phone-only CareFlow page redesign (P-A approved 2026-10-03). Source: _mobile-audit-2026-10-02/careflow-redesign. */ .adx-cf-cta { display: none; } @media (max-width: 767px) { /* ---------- 1. INTRO: a real first screen instead of a full blue panel with one sentence ---------- */ body:has(.careflow-scene) .careflow-scene__slide { display: none !important; } body:has(.careflow-scene) .careflow-scene { height: auto !important; min-height: 0 !important; } body:has(.careflow-scene) .careflow-intro { position: relative !important; top: auto !important; height: auto !important; min-height: 0 !important; } body:has(.careflow-scene) .careflow-intro__stage { height: auto !important; min-height: 0 !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 0 !important; padding: 92px 16px 22px !important; position: relative !important; } body:has(.careflow-scene) .careflow-intro__headline { position: static !important; inset: auto !important; transform: none !important; translate: none !important; text-align: left !important; font-size: 30px !important; line-height: 1.14 !important; letter-spacing: -0.02em !important; margin: 0 !important; width: auto !important; opacity: 1 !important; } body:has(.careflow-scene) .careflow-intro__headline .adx-cf-sub { display: block; margin-top: 14px; font-size: 18px; line-height: 1.45; font-weight: 400; letter-spacing: 0; color: #42606F; } body:has(.careflow-scene) .adx-cf-cta { display: flex; align-items: center; justify-content: center; min-height: 52px; margin-top: 22px; border-radius: 12px; background: linear-gradient(180deg, #0071A2, #005896); color: #fff !important; font-size: 16px; font-weight: 600; text-decoration: none; } body:has(.careflow-scene) .careflow-intro__handoff { position: static !important; transform: none !important; translate: none !important; opacity: 1 !important; margin: 18px 0 0 !important; justify-content: flex-start !important; text-align: left !important; } body:has(.careflow-scene) .careflow-intro__handoff::after { content: " ↓"; margin-left: 4px; color: #0071A2; } body:has(.careflow-scene) .careflow-intro__scroll-hint { display: none !important; } /* ---------- 2. EXPLORER: readable feature labels ---------- */ body:has(.careflow-scene) .careflow-explorer [class*="__feature-name"], body:has(.careflow-scene) .careflow-explorer [class*="chip"] { font-size: 13px !important; } /* ---------- 5. PRACTICE TYPE: three tap rows (picture left, name + "View floor" right) ---------- */ body:has(.careflow-scene) .icp-floor-cards__inner { padding-top: 36px !important; padding-bottom: 24px !important; } body:has(.careflow-scene) .icp-floor-cards__heading { font-size: 27px !important; margin-bottom: 16px !important; } body:has(.careflow-scene) .icp-floor-cards__list { gap: 10px !important; } body:has(.careflow-scene) .icp-floor-cards__card { aspect-ratio: auto !important; display: grid !important; grid-template-columns: 92px 1fr; grid-template-rows: auto auto; align-items: center; column-gap: 14px; row-gap: 4px; padding: 12px 14px !important; min-height: 0 !important; height: auto !important; border-radius: 16px !important; } body:has(.careflow-scene) .icp-floor-cards__image { grid-column: 1; grid-row: 1 / span 2; width: 92px !important; height: 76px !important; object-fit: contain; margin: 0 !important; position: static !important; transform: none !important; } body:has(.careflow-scene) .icp-floor-cards__title { grid-column: 2; grid-row: 1; font-size: 16.5px !important; line-height: 1.25 !important; margin: 0 !important; align-self: end; } body:has(.careflow-scene) .icp-floor-cards__link { grid-column: 2; grid-row: 2; align-self: start; margin: 0 !important; } body:has(.careflow-scene) .icp-floor-cards__link-label::after { content: " →"; } /* ---------- 6-8. TESTIMONIALS: same three customers, about half the scroll ---------- */ body:has(.careflow-scene) .icp-testimonial__inner { gap: 10px !important; padding-top: 12px !important; padding-bottom: 12px !important; } body:has(.careflow-scene) .icp-testimonial__card { display: block !important; padding: 14px 14px 18px !important; min-height: 0 !important; height: auto !important; } body:has(.careflow-scene) .icp-testimonial__attribution { position: static !important; inset: auto !important; margin-top: 10px !important; color: #5A7285 !important; background: none !important; text-shadow: none !important; padding: 0 !important; transform: none !important; } body:has(.careflow-scene) .icp-testimonial__name { color: #002844 !important; font-weight: 600; font-size: 14px !important; } body:has(.careflow-scene) .icp-testimonial__role { color: #5A7285 !important; font-size: 13px !important; } body:has(.careflow-scene) .icp-testimonial__inner { display: block !important; } body:has(.careflow-scene) .icp-testimonial__inner > * + * { margin-top: 10px !important; } body:has(.careflow-scene) .icp-testimonial__media { width: 100% !important; height: auto !important; aspect-ratio: auto !important; overflow: visible !important; } body:has(.careflow-scene) .icp-testimonial__poster { width: 100% !important; height: auto !important; aspect-ratio: 16 / 10 !important; object-fit: cover; object-position: 50% 22%; border-radius: 14px; } body:has(.careflow-scene) .icp-testimonial__play { left: 12px !important; right: auto !important; top: 12px !important; bottom: auto !important; transform: none !important; translate: none !important; margin: 0 !important; width: auto !important; padding: 8px 14px !important; min-height: 40px; font-size: 14px !important; } body:has(.careflow-scene) .icp-testimonial__story { display: inline-flex; margin-top: 10px !important; } body:has(.careflow-scene) .icp-testimonial__headline { font-size: 23px !important; line-height: 1.2 !important; margin: 14px 0 10px !important; } body:has(.careflow-scene) .icp-testimonial__quote, body:has(.careflow-scene) .icp-testimonial__quote p { font-size: 15px !important; line-height: 1.5 !important; } body:has(.careflow-scene) .icp-testimonial__stats { padding: 16px !important; min-height: 0 !important; gap: 10px !important; border-radius: 14px !important; } body:has(.careflow-scene) .icp-testimonial__logo { height: 40px !important; width: auto !important; } body:has(.careflow-scene) .icp-testimonial__stat-list { grid-template-columns: 1fr 1fr !important; gap: 12px !important; } body:has(.careflow-scene) .icp-testimonial__stat-value { font-size: 24px !important; line-height: 1.1 !important; } body:has(.careflow-scene) .icp-testimonial__stat-label { font-size: 12.5px !important; line-height: 1.35 !important; } /* ---------- 9. CLOSING CTA: tighter, full-width button ---------- */ body:has(.careflow-scene) .icp-cta { padding-top: 40px !important; padding-bottom: 40px !important; } body:has(.careflow-scene) .icp-cta__headline { font-size: 26px !important; } body:has(.careflow-scene) .icp-cta__button { width: 100% !important; min-height: 52px; } body:has(.careflow-scene) section.careflow-explorer { padding-top: 8px !important; } /* proof card on this page: the portrait is a 120x128 file - keep it small (64px circle), never upscale it. .icp-testimonial__media is display:contents here, so its children are the grid items. */ body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__card { display: grid !important; grid-template-columns: 64px 1fr; grid-template-rows: auto auto auto auto; column-gap: 12px; row-gap: 0; align-items: center; } body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__headline { grid-column: 1 / -1; grid-row: 1; } body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__quote { grid-column: 1 / -1; grid-row: 2; margin-bottom: 14px !important; } body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__poster { grid-column: 1; grid-row: 3; width: 64px !important; height: 64px !important; aspect-ratio: 1 / 1 !important; border-radius: 50% !important; object-position: 50% 30%; } body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__attribution { grid-column: 2; grid-row: 3; margin: 0 !important; } body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__chip { display: none !important; } body:has(.careflow-scene) .icp-testimonial:not(.icp-testimonial--stacked) .icp-testimonial__play { position: static !important; grid-column: 1 / -1; grid-row: 4; justify-self: start; margin-top: 16px !important; width: auto !important; } } /* ADX-CAREFLOW-PHONE-2026-10-03:END */ /* ADX-H1-TAIL-2026-10-03:START SE Ranking audit: sentences 3+ of the headline field render here, outside the H1's text. */ .careflow-intro__headline .adx-cf-sub[data-adx-tail]::after{content:attr(data-adx-tail)} /* ADX-H1-TAIL-2026-10-03:END */