/* Connected-life rebuild: retained identity, concrete demonstration, one clear next step. */
.alongside-rebuild {--demo-shadow:0 20px 42px -22px rgb(23 35 61 / 36%)}
.alongside-rebuild .site-header {min-height:96px}
.alongside-rebuild .previewbar {font-size:.75rem}
.alongside-rebuild .connected-hero {grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);gap:3.25rem;padding-top:3.5rem;padding-bottom:4.5rem;align-items:center}
.alongside-rebuild .connected-hero h1 {font-size:clamp(3.25rem,5.2vw,4.75rem);line-height:1.06;letter-spacing:-.04em;max-width:590px;margin-bottom:1.75rem}
.alongside-rebuild .connected-hero h1 span {color:var(--blue)}
.alongside-rebuild .connected-hero .intro {display:flex;align-items:center;gap:.6rem;font-size:.8125rem;margin-bottom:1.5rem}
.intro-dot {flex-shrink:0;width:9px;height:9px;border-radius:50%;background:var(--orange)}
.alongside-rebuild .connected-hero .hero-body {font-size:1rem;line-height:1.8;max-width:30rem;margin-bottom:1.5rem}
.alongside-rebuild .connected-hero .hero-note {font-size:.75rem;color:var(--muted);margin-top:1rem}
.alongside-rebuild .connected-hero .actions {gap:1rem 1.25rem}
.ripple-demo {margin:0;min-width:0;position:relative;padding:1.25rem 0 0}
.ripple-demo::before {content:'';position:absolute;inset:5.75rem -.75rem 2.4rem 1.25rem;background:#E4ECFE;border-radius:42% 44% 35% 40%;z-index:-1}
.ripple-demo figcaption {display:flex;justify-content:space-between;gap:.75rem;font-size:.6875rem;margin-bottom:1rem;align-items:center;color:var(--muted)}
.demo-label {color:var(--navy);font-weight:700}
.ripple-stage-controls {display:flex;gap:.35rem;margin-bottom:1.4rem;padding:.3rem;background:#E9E7E1;border-radius:10px}
.ripple-stage-controls[hidden] {display:none}
.ripple-stage-controls button {flex:1;font-size:.75rem;min-height:38px;padding:.45rem .25rem;border:0;border-radius:7px;background:none;font-weight:600;transition:background-color .2s,color .2s}
.ripple-stage-controls button[aria-pressed=true] {background:var(--navy);color:var(--cream)}
.ripple-stage-controls button:hover:not([aria-pressed=true]) {background:#FFF9F2}
.ripple-composition {position:relative;padding:0 .5rem 0 0;isolation:isolate}
.ripple-connectors {position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;color:#8A9DBE}
.change-note {position:relative;display:flex;align-items:center;gap:.8rem;background:var(--orange);color:var(--navy);padding:1.15rem 1.25rem;border-radius:12px;margin:0 1.5rem 2rem;transform:rotate(-2deg);box-shadow:var(--demo-shadow);transition:transform .35s var(--ease)}
.change-signal {display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#FFD6B8;font-size:1.25rem;flex-shrink:0}
.change-note div {flex:1;min-width:0}
.change-note div span {display:block;font-size:.6875rem;font-weight:600;margin-bottom:.15rem}
.change-note strong {display:block;font-size:.9375rem;line-height:1.4;letter-spacing:-.02em}
.change-time {font-size:.6875rem;font-weight:700;white-space:nowrap}
.ripple-responsibilities {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;margin-bottom:2rem}
.ripple-responsibilities>div {display:flex;flex-direction:column;background:var(--depth-paper);padding:1rem .65rem .85rem;border-radius:12px;box-shadow:0 10px 20px -14px rgb(23 35 61 / 35%);transition:transform .35s var(--ease),background-color .35s;text-align:center;min-width:0}
.responsibility-symbol {font-size:1.4rem;color:var(--blue);line-height:1.2;margin-bottom:.5rem}
.ripple-responsibilities strong {font-size:.75rem;line-height:1.4}
.ripple-responsibilities div>span:last-child {font-size:.625rem;color:var(--muted);line-height:1.5;margin-top:.3rem}
.ripple-responsibilities .personal-responsibility {background:#FFF0D9}
.ripple-responsibilities .personal-responsibility .responsibility-symbol {color:#93441F}
.ripple-plan {position:relative;margin-left:1.25rem;background:var(--navy);color:var(--cream);padding:1.35rem 1.4rem 1rem;border-radius:14px;box-shadow:8px 9px 0 #9DB8FF,0 22px 40px -20px rgb(23 35 61 / 45%);transition:transform .35s var(--ease)}
.ripple-plan::after {display:none}
.plan-heading {display:flex;gap:.7rem;align-items:center}
.plan-mark {background:var(--cream);border-radius:10px;display:grid;place-items:center;width:34px;height:38px;font-size:1.4rem;font-weight:700;flex-shrink:0}
.plan-heading div {flex:1}
.plan-heading div>span {font-size:.625rem;color:#BBCBE5}
.ripple-plan h2 {font-size:1.0625rem;line-height:1.4;letter-spacing:-.025em;margin:.1rem 0 0;text-wrap:initial}
.review-label {font-size:.5625rem;line-height:1.4;background:#334460;color:#F5D3AA;padding:.4rem .5rem;border-radius:5px;max-width:65px;text-align:center}
.ripple-plan ol {list-style:none;padding:0;margin:1rem 0 .85rem}
.ripple-plan li {display:flex;gap:.7rem;align-items:flex-start;margin-top:.65rem}
.plan-order {width:19px;height:19px;display:grid;place-items:center;border:1px solid #627390;border-radius:50%;font-size:.625rem;flex-shrink:0;margin-top:1px}
.ripple-plan li p {margin:0;font-size:.75rem;line-height:1.65;color:#EDF1F9}
.plan-question {font-size:.6875rem;line-height:1.65;color:#FFD5B4;margin:0;padding:.8rem 0;border-block:1px solid #44516A}
.plan-footer {display:flex;align-items:center;gap:.45rem;font-size:.625rem;color:#C7D3E7;padding-top:.75rem}
.approval-dot {width:6px;height:6px;border-radius:50%;background:var(--orange);flex-shrink:0}
.demo-disclosure {font-size:.625rem;line-height:1.7;color:var(--muted);margin:1.25rem 0 0 1.25rem;max-width:48rem}
[data-stage=change] .change-note {transform:translateY(-5px) rotate(-2deg)}
[data-stage=connections] .ripple-responsibilities>div {transform:translateY(-5px);background:#DCE7FF}
[data-stage=connections] .ripple-responsibilities>.personal-responsibility {background:#FFE1B5}
[data-stage=plan] .ripple-plan {transform:translateY(-4px)}
.life-strip {display:flex;align-items:center;gap:3rem;padding-block:2rem;border-top:1px solid var(--line);margin-bottom:3rem}
.life-strip>p {font-size:.875rem;line-height:1.65;margin:0;flex-shrink:0}
.life-strip ul {list-style:none;display:flex;justify-content:space-between;flex:1;gap:1rem;flex-wrap:wrap;margin:0;padding:0;font-size:.9375rem;color:var(--muted)}
.life-strip li:last-child {color:var(--blue);font-weight:700}
.context-difference {background:var(--blue);color:var(--cream);padding:5rem 0}
.context-layout {display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center}
.context-layout h2 {font-size:clamp(2.3rem,3.6vw,3.4rem);line-height:1.13}
.context-layout>div>p:not(.intro) {font-size:1rem;color:#E1E9FF;line-height:1.8;max-width:28rem;margin-top:1.75rem}
.context-comparison article {padding:1.5rem 0}
.context-comparison article:first-child {border-bottom:1px solid #9AB3FF;padding-top:0}
.context-comparison article>span {font-size:.6875rem;color:#D5E1FF;font-weight:600}
.context-comparison h3 {font-size:1.5rem;line-height:1.4;margin:.65rem 0}
.context-comparison article p {font-size:.875rem;line-height:1.7;color:#E1E9FF;margin:0;max-width:25rem}
.context-disclosure {font-size:.625rem!important;line-height:1.7!important;color:#D5E1FF!important;margin:1rem 0 0!important}
.alongside-rebuild .setup-strip {padding-block:5rem 3rem}
.whole-life {display:grid;grid-template-columns:1.1fr 1fr;gap:5rem;align-items:center;padding-block:4rem 4.5rem}
.whole-life h2 {font-size:clamp(2.3rem,3.5vw,3.3rem);max-width:8em}
.whole-life>div>p:not(.intro) {font-size:1rem;color:var(--muted);max-width:29rem;line-height:1.8}
.life-note {padding:2rem 2.25rem 1.5rem;background:#F6D1B1;box-shadow:var(--demo-shadow);transform:rotate(2deg);border-radius:12px;max-width:420px;justify-self:center;width:100%}
.life-note>p {font-size:1.75rem!important;line-height:1.5!important;color:var(--navy)!important;letter-spacing:-.025em;font-weight:500;margin:1.5rem 0}
.life-note-bottom {display:flex;justify-content:space-between;align-items:center;gap:1rem;border-top:1px solid #C7A587;padding-top:1rem;font-size:.75rem;line-height:1.7}
.alongside-rebuild .possibilities {padding-top:3rem}
.alongside-rebuild .fit-heading>.depth-backdrop {background:#E7ECF8}
.alongside-rebuild .fit-heading>.depth-backdrop img {opacity:.4}
.alongside-rebuild .fit-copy.depth-panel::before,.alongside-rebuild .fit-copy.depth-panel::after {display:none}
.alongside-rebuild .fit-copy.depth-panel {padding-left:0}
.alongside-rebuild .closing {background:#F4D7BD}
.alongside-rebuild .closing .depth-backdrop {display:none}
@media(min-width:1440px){.alongside-rebuild .connected-hero {gap:4.5rem}.ripple-demo {padding-left:.5rem}}
@media(max-width:1080px){.alongside-rebuild .connected-hero {gap:2rem}.alongside-rebuild .connected-hero h1 {font-size:clamp(2.8rem,5vw,4.1rem)}.ripple-plan {padding:1.2rem}.change-note {margin-inline:.5rem;padding:1rem}.change-time{display:none}.context-layout,.whole-life {gap:3rem}.life-strip {gap:2rem}.life-strip ul {justify-content:flex-start;gap:.75rem 1.5rem}.ripple-demo figcaption {font-size:.625rem}}
@media(max-width:800px){.alongside-rebuild .connected-hero {grid-template-columns:1fr;gap:2rem;padding-top:2rem;padding-bottom:3rem}.alongside-rebuild .connected-hero h1 {font-size:clamp(3.5rem,9.5vw,4.75rem);max-width:650px}.alongside-rebuild .connected-hero .hero-body {max-width:36rem}.ripple-demo {max-width:580px;width:100%;justify-self:center;padding-top:.5rem}.ripple-demo figcaption{font-size:.6875rem}.ripple-responsibilities strong{font-size:.8125rem}.ripple-responsibilities div>span:last-child{font-size:.6875rem}.ripple-plan h2{font-size:1.25rem}.ripple-plan li p {font-size:.8125rem}.plan-heading div>span,.review-label,.plan-footer{font-size:.6875rem}.plan-question{font-size:.75rem}.context-layout,.whole-life{grid-template-columns:1fr;gap:2.5rem}.context-layout h2,.whole-life h2{font-size:2.5rem}.context-layout>div>p:not(.intro),.whole-life>div>p:not(.intro){max-width:36rem}.whole-life h2{max-width:14em}.context-comparison{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem}.context-comparison article:first-child{border:0}.context-comparison article{padding:0}.context-disclosure{grid-column:1/-1}.life-note{max-width:500px}.life-strip{align-items:flex-start;margin-bottom:2rem}.life-strip>p{font-size:.8125rem}.life-strip ul{font-size:.8125rem}.context-difference{padding-block:3.5rem}}
@media(max-width:500px){.alongside-rebuild .connected-hero{padding-inline:1.375rem}.alongside-rebuild .connected-hero h1{font-size:clamp(2.9rem,11.5vw,3.7rem);letter-spacing:-.04em}.alongside-rebuild .connected-hero .intro{font-size:.6875rem}.ripple-demo figcaption{font-size:.5625rem}.ripple-stage-controls{margin-bottom:1rem}.ripple-stage-controls button{font-size:.6875rem;min-height:40px}.change-note{padding:.85rem;gap:.6rem;margin-bottom:1.75rem}.change-note strong{font-size:.8125rem}.change-note div span{font-size:.625rem}.change-signal{width:28px;height:28px}.ripple-responsibilities{gap:.35rem;margin-bottom:1.75rem}.ripple-responsibilities>div{padding:.8rem .3rem;border-radius:9px}.ripple-responsibilities strong{font-size:.6875rem}.ripple-responsibilities div>span:last-child{font-size:.5625rem}.ripple-plan{margin-left:.5rem;padding:1rem}.ripple-plan h2{font-size:.95rem}.plan-mark{width:29px;height:34px}.plan-heading{gap:.5rem}.review-label{font-size:.5rem;max-width:56px}.plan-heading div>span{font-size:.5625rem}.ripple-plan li p{font-size:.6875rem}.plan-question{font-size:.625rem}.plan-footer{font-size:.5625rem}.demo-disclosure{font-size:.5625rem;margin-left:.5rem}.life-strip{display:block;padding-block:1.5rem}.life-strip>p{margin-bottom:1rem}.life-strip>p br{display:none}.life-strip>p strong{margin-left:.4rem}.life-strip ul{gap:.6rem 1.2rem}.context-comparison{display:block}.context-comparison article+article{margin-top:1.75rem}.context-comparison h3{font-size:1.4rem}.whole-life{padding-block:3rem;gap:2rem}.life-note{padding:1.5rem 1.75rem;max-width:calc(100% - .75rem)}.life-note>p{font-size:1.5rem!important}.alongside-rebuild .fit-copy.depth-panel{padding:1rem}.alongside-rebuild .setup-strip{padding-block:3rem 1rem}.context-layout h2,.whole-life h2{font-size:2.25rem}}
@media(prefers-reduced-motion:reduce){.change-note,.ripple-responsibilities>div,.ripple-plan,.ripple-stage-controls button{transition:none}.change-note,.life-note,[data-stage] .change-note,[data-stage] .ripple-responsibilities>div,[data-stage] .ripple-plan{transform:none}}
@media(forced-colors:active){.ripple-demo::before,.ripple-connectors,.ripple-plan::after{display:none}.change-note,.ripple-responsibilities>div,.ripple-plan,.life-note{border:1px solid CanvasText;box-shadow:none}.ripple-stage-controls button[aria-pressed=true]{outline:2px solid Highlight}.ripple-demo p,.ripple-demo span,.ripple-demo h2{color:CanvasText}}

/* Keep the detailed demonstration readable on smaller phones. */
@media(max-width:500px){.ripple-demo figcaption,.change-note div span,.ripple-responsibilities div>span:last-child,.plan-heading div>span,.plan-footer,.demo-disclosure{font-size:.625rem}.ripple-responsibilities strong{font-size:.75rem}.ripple-plan li p,.plan-question{font-size:.75rem}.review-label{font-size:.5625rem}}
