/* Why Max: one customer conversation, played out twice — without data and with Max. */
.why-max{margin:0 20px;padding:0;border-radius:24px;background:#0b223b;color:#fff;overflow:hidden}
.why-top{max-width:1340px;margin:auto;padding:84px 50px 48px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.why-eyebrow{margin:0 0 24px;font-size:12px;letter-spacing:.065em;color:#bdd5e9}
.why-top h2{font-family:Satoshi,system-ui,sans-serif;font-size:clamp(38px,4.2vw,62px);line-height:1.08;font-weight:400;letter-spacing:-.04em;margin:0}
.why-top h2 span{display:block;color:#a6cbea}
.why-lead{font-size:18px;line-height:1.6;color:#e0eaf3;margin:0 0 16px}
.why-philosophy{font-size:15px;line-height:1.7;color:#acbfd1;margin:0}
.why-promise{border-top:1px solid #ffffff25;padding-top:20px;margin:24px 0 0;font-size:15px;line-height:1.7;color:#b7cee0}.why-promise strong{color:#fff;font-weight:500}
.why-top h2 span{display:inline}

/* ---------- scenario ---------- */
.why-sim{max-width:1340px;margin:auto;padding:0 50px 56px;--scene:8s}
.wm-rail{display:flex;align-items:center;gap:18px;margin-bottom:18px}
.wm-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;flex:1}
.wm-step{width:100%;background:none;border:0;padding:8px 0 0;color:#8ea8bf;cursor:pointer;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;font-size:14px;text-align:left;transition:color .15s}
.wm-step:hover,.wm-step.is-on{color:#fff}
.wm-num{font-size:11px;color:#6f8ca6;font-variant-numeric:tabular-nums}.wm-step.is-on .wm-num{color:#a6cbea}
.wm-bar{order:-1;flex-basis:100%;height:2px;border-radius:2px;background:#ffffff1f;overflow:hidden;margin-bottom:10px;display:block}
.wm-fill{display:block;height:100%;width:0;background:#a6cbea}
.wm-step.is-past .wm-fill{width:100%;background:#ffffff59}
.wm-step.is-on .wm-fill{animation:wm-progress var(--scene) linear both}
.wm-toggle{flex:none;width:36px;height:36px;border-radius:50%;border:1px solid #ffffff33;background:none;color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .15s}
.wm-toggle:hover{background:#ffffff14}
.wm-toggle span{width:8px;height:10px;border-left:2px solid currentColor;border-right:2px solid currentColor}
.why-sim.is-paused .wm-toggle span{width:0;height:0;border:0;border-left:9px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
.why-sim.is-paused *{animation-play-state:paused!important}

.wm-panels{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.wm-panel{border-radius:20px;min-width:0;display:flex;flex-direction:column}
.wm-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 24px;font-size:13px}
.wm-tag{display:flex;align-items:center;gap:9px;font-weight:500}
.wm-tag img{display:block;width:18px;height:18px;object-fit:contain}
.wm-dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.wm-mode{font-size:12px}
.wm-stage{display:grid;flex:1;margin:0 24px 24px}
.wm-scene{grid-area:1/1;min-width:0;display:flex;flex-direction:column;gap:14px;visibility:hidden;opacity:0;transition:opacity .35s,visibility 0s .35s}
.wm-scene.is-on{visibility:visible;opacity:1;transition:opacity .35s}
.wm-caption{margin:auto 0 0;padding-top:16px;font-size:14px;line-height:1.5}
.wm-caption strong{font-weight:500}

/* shared pieces */
.wm-quote,.wm-record,.wm-pipe,.wm-msg,.wm-insight,.wm-week{border-radius:12px}
.wm-quote{padding:16px 18px}
.wm-src{display:flex;align-items:center;gap:9px;font-size:11px}
.wm-wave{height:16px;display:flex;align-items:center;gap:2px}.wm-wave i{width:2px;height:16px;border-radius:2px;background:currentColor;transform:scaleY(.4)}
.wm-quote p{margin:10px 0 0;font-size:17px;line-height:1.6;letter-spacing:-.015em}
.wm-quote mark{background:none;color:inherit;border-radius:3px;padding:0}
.wm-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.wm-chips-label{flex-basis:100%;font-size:11px;margin-bottom:2px}
.wm-chip{display:inline-flex;align-items:baseline;gap:7px;font-size:13px;padding:7px 11px;border-radius:8px}
.wm-chip b{font-size:10px;font-weight:500;letter-spacing:.02em}
.wm-record{position:relative;overflow:visible}
.wm-record-head,.wm-pipe-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-size:13px;font-weight:500}
.wm-pill{font-size:10px;font-weight:500;padding:3px 8px;border-radius:20px}
.wm-record dl{margin:0;padding:0 16px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wm-record dl>div{padding:12px 0 14px}
.wm-record dt{font-size:11px;margin-bottom:6px}
.wm-record dd{margin:0;font-size:16px;font-weight:500;min-height:22px;white-space:nowrap}
.wm-note{position:absolute;right:18px;bottom:-24px;transform:rotate(3deg);padding:7px 11px;font-size:12px;border-radius:4px;background:#e9dcb0;color:#4a3f22;box-shadow:0 6px 16px #0003}
.wm-toast{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:10px;font-size:13px}
.wm-toast .material-symbols-rounded{font-size:18px}
.wm-saved{display:flex;align-items:center;gap:6px;font-size:11px;padding:10px 16px}
.wm-saved .material-symbols-rounded{font-size:15px}
.wm-week{display:grid;grid-template-columns:repeat(4,.6fr) 2fr;gap:6px;padding:8px}
.wm-day{min-height:92px;border-radius:8px;padding:9px 10px;display:flex;flex-direction:column;gap:8px;font-size:11px;position:relative}
.wm-day em{font-style:normal;font-size:13px;line-height:1.35;padding:7px 9px;border-radius:6px}
.wm-done{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:500}
.wm-done .material-symbols-rounded{font-size:14px}
.wm-msg{display:flex;gap:12px;padding:14px 16px;align-items:flex-start}
.wm-avatar{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:500;object-fit:contain}
.wm-msg-meta{font-size:11px;display:flex;gap:8px}
.wm-msg-meta time{opacity:.7}
.wm-msg p{margin:5px 0 0;font-size:15px;line-height:1.5}
.wm-pipe ul{list-style:none;margin:0;padding:0 16px 6px}
.wm-pipe li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;font-size:14px}
.wm-status{font-size:11px;padding:4px 9px;border-radius:20px;white-space:nowrap}
.wm-forecast{font-size:11px;font-weight:400}
.wm-dialog{display:flex;flex-direction:column;gap:8px}
.wm-bubble{margin:0;max-width:78%;padding:10px 14px;border-radius:12px 12px 12px 4px;font-size:14px;line-height:1.45}
.wm-bubble b{display:block;font-size:10px;font-weight:500;margin-bottom:3px}
.wm-reply{align-self:flex-end;border-radius:12px 12px 4px 12px}
.wm-insight{display:flex;gap:12px;align-items:flex-start;padding:14px 16px}
.wm-insight img{flex:none;display:block;object-fit:contain}
.wm-insight p{margin:0;font-size:14px;line-height:1.5}
.wm-insight b{display:block;font-size:11px;font-weight:500;margin-bottom:3px}
.wm-note-line{margin:14px 0 0;font-size:11px;color:#7f99b1;text-align:right}

/* deeper framework pieces */
.wm-record-head img{width:16px;height:16px;vertical-align:-3px;margin-right:7px}
.wm-freeform{margin:0;padding:14px 16px 4px;font-size:15px;font-style:italic}
.wm-meter{padding:12px 16px 14px}
.wm-meter-head{display:flex;justify-content:space-between;gap:10px;font-size:11px;margin-bottom:8px}
.wm-meter-bar{height:4px;border-radius:4px;overflow:hidden}.wm-meter-bar i{display:block;height:100%;width:var(--to);border-radius:4px}
.wm-pillars{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.wm-pillars li{font-size:11px;padding:4px 8px;border-radius:6px}
.wm-ask{list-style:none;margin:0;padding:4px 16px}
.wm-ask li{padding:9px 0;display:grid;gap:3px}.wm-ask li+li{border-top:1px solid #edf2f6}
.wm-ask span{font-size:12px;color:#3d6e9a}.wm-ask b{font-size:15px;font-weight:500;color:#142e47}
.wm-check{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.wm-check li{display:flex;align-items:center;gap:10px;font-size:14px;padding:10px 14px;border-radius:10px;background:#fff;border:1px solid #dfe8ef}
.wm-check .material-symbols-rounded{font-size:16px;color:#fff;background:#3d6e9a;border-radius:50%;width:20px;height:20px;display:grid;place-items:center}
.wm-avatar-me{font-size:10px!important}

/* ---------- without data: muted, dashed, things slip ---------- */
.wm-without{background:#ffffff08;border:1px solid #ffffff1a;color:#c2d1de}
.wm-without .wm-head{color:#e3aa9a}.wm-without .wm-mode{color:#8ea8bf}
.wm-without .wm-quote,.wm-without .wm-record,.wm-without .wm-pipe,.wm-without .wm-week{background:#ffffff0a;border:1px solid #ffffff14}
.wm-without .wm-src{color:#8ea8bf}
.wm-without .wm-quote p{color:#e6eef5}
.wm-without .wm-chips-label{color:#8ea8bf}
.wm-without .wm-chip{border:1px dashed #ffffff40;color:#c2d1de}
.wm-without .wm-record-head,.wm-without .wm-pipe-head{border-bottom:1px solid #ffffff14}
.wm-without .wm-pill{background:#ffffff14;color:#aebfcf}
.wm-without dt{color:#8ea8bf}
.wm-without .wm-empty{color:#6f8ca6;font-weight:400}
.wm-without .wm-toast{background:#1c3653;color:#e6eef5;box-shadow:0 10px 28px #0005}
.wm-without .wm-day{background:#ffffff08;color:#7f99b1}
.wm-without .wm-today{border:1px dashed #e3aa9a66;color:#e3aa9a}
.wm-without .wm-day em{border:1px dashed #ffffff33;color:#8ea8bf}
.wm-without .wm-msg{background:#1c3653}
.wm-without .wm-avatar{background:#e3aa9a;color:#3a1f18}
.wm-without .wm-msg-meta{color:#aebfcf}
.wm-without .wm-msg p{color:#fff}
.wm-without .wm-pipe li+li{border-top:1px solid #ffffff10}
.wm-without .wm-status{background:#ffffff10;color:#8ea8bf}
.wm-without .wm-warn{background:#e3aa9a1f;color:#e3aa9a}
.wm-without .wm-forecast{color:#8ea8bf}
.wm-without .wm-bubble{background:#1c3653;color:#e6eef5}
.wm-without .wm-bubble b{color:#8ea8bf}
.wm-without .wm-reply{background:#ffffff14}
.wm-without .wm-freeform{color:#e6eef5}
.wm-without .wm-meter-head{color:#8ea8bf}.wm-without .wm-meter-bar{background:#ffffff14}.wm-without .wm-meter-bar i{background:#e3aa9a}
.wm-without .wm-pillars li{border:1px dashed #ffffff33;color:#7f99b1}.wm-without .wm-pillars li.is-done{border-style:solid;color:#c2d1de}
.wm-without .wm-mail{background:#ffffff0a;border:1px solid #ffffff14}.wm-without .wm-avatar-me{background:#ffffff1f;color:#c2d1de}
.wm-without .wm-caption{color:#aebfcf;border-top:1px solid #ffffff14}
.wm-without .wm-caption strong{color:#fff}

.wm-without .wm-record+.wm-toast{margin-top:14px}

/* ---------- with data: light, solid, everything lands ---------- */
.wm-with{background:#f3f7fb;border:1px solid #d7e4ef;color:#142e47}
.wm-with .wm-head{color:#142e47}.wm-with .wm-mode{color:#3d6e9a}
.wm-with .wm-quote,.wm-with .wm-record,.wm-with .wm-pipe,.wm-with .wm-msg,.wm-with .wm-week{background:#fff;border:1px solid #dfe8ef;box-shadow:0 8px 24px #244b7010}
.wm-with .wm-src{color:#3d6e9a}
.wm-with .wm-chips-label{color:#3d6e9a}
.wm-with .wm-chip{background:#fff;border:1px solid #a7c5df;color:#142e47}
.wm-with .wm-chip b{color:#3d6e9a}
.wm-with .wm-record-head,.wm-with .wm-pipe-head{border-bottom:1px solid #e4edf4}
.wm-with .wm-pill{background:#e9f2fa;color:#3d6e9a}
.wm-with dt{color:#667b8e}
.wm-with dd{color:#244c70}
.wm-with .wm-toast{background:#fff;border:1px solid #dfe8ef;color:#244c70}.wm-with .wm-toast .material-symbols-rounded{color:#3d6e9a}
.wm-with .wm-saved{border-top:1px solid #e4edf4;color:#3d6e9a;background:#f5f9fc;border-radius:0 0 12px 12px}
.wm-with .wm-day{background:#f3f7fb;color:#667b8e}
.wm-with .wm-today{background:#e9f2fa;border:1px solid #a7c5df;color:#3d6e9a}
.wm-with .wm-day em{background:#fff;color:#142e47;border:1px solid #d7e4ef}
.wm-with .wm-done{color:#3d6e9a}
.wm-with .wm-msg-meta{color:#3d6e9a}
.wm-with .wm-pipe li+li{border-top:1px solid #edf2f6}
.wm-with .wm-status{background:#e9f2fa;color:#3d6e9a}
.wm-with .wm-flag{background:#fdf0e8;color:#9a5a3c}
.wm-with .wm-forecast{color:#3d6e9a}
.wm-with .wm-insight{background:#0b223b;color:#e0eaf3}
.wm-with .wm-insight b{color:#a6cbea}
.wm-with .wm-meter{border-top:1px solid #e4edf4}.wm-with .wm-meter-head{color:#3d6e9a}.wm-with .wm-meter-bar{background:#e9f2fa}.wm-with .wm-meter-bar i{background:#3d6e9a}
.wm-with .wm-caption{color:#4d6880;border-top:1px solid #dce7f0}
.wm-with .wm-caption strong{color:#142e47}

/* ---------- motion: only while a scene is on ---------- */
.wm-scene.is-on .a{animation:wm-in .5s cubic-bezier(.2,.7,.2,1) var(--d,0s) both}
.wm-scene.is-on .wm-toast{animation-name:wm-drop}
.wm-scene.is-on .wm-note{animation-name:wm-stick}
.wm-scene.is-on .wm-chip.a,.wm-scene.is-on .wm-flag,.wm-scene.is-on .wm-done{animation-name:wm-pop}
.wm-scene.is-on .wm-wave i{animation:wm-wave 1s ease-in-out infinite}
.wm-wave i:nth-child(2){animation-delay:-.2s!important}.wm-wave i:nth-child(3){animation-delay:-.5s!important}.wm-wave i:nth-child(4){animation-delay:-.1s!important}.wm-wave i:nth-child(5){animation-delay:-.7s!important}.wm-wave i:nth-child(6){animation-delay:-.3s!important}.wm-wave i:nth-child(7){animation-delay:-.6s!important}
.wm-with .wm-quote mark.wm-hl{background:#eaf3fc;color:#315f87;box-shadow:0 0 0 2px #eaf3fc}
.wm-scene.is-on .wm-hl{animation:wm-mark .6s ease var(--d) both}
.wm-scene.is-on .wm-type{animation:wm-type .7s steps(10,end) var(--d) both}
.wm-fading{opacity:.22;filter:blur(2.5px)}
.wm-scene.is-on .wm-fading{animation:wm-fade 1.6s ease 2s both}
.wm-scene.is-on .wm-today{animation:wm-ring 1.4s ease .6s both}

@keyframes wm-in{from{opacity:0;transform:translateY(10px)}}
@keyframes wm-drop{from{opacity:0;transform:translateY(-12px)}}
@keyframes wm-stick{from{opacity:0;transform:rotate(-4deg) scale(.85)}}
@keyframes wm-pop{from{opacity:0;transform:scale(.85)}}
@keyframes wm-wave{50%{transform:scaleY(1)}}
@keyframes wm-mark{from{background:transparent;color:inherit;box-shadow:0 0 0 2px transparent}}
@keyframes wm-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes wm-fade{from{opacity:1;filter:blur(0)}}
@keyframes wm-ring{0%{box-shadow:0 0 0 0 #7ba7d466}60%{box-shadow:0 0 0 8px #7ba7d400}}
.wm-scene.is-on .wm-meter-bar i{animation:wm-grow 1.6s ease 1s both}
@keyframes wm-grow{from{width:0}}
@keyframes wm-progress{from{width:0}to{width:100%}}

/* ---------- evidence strip ---------- */
.why-evidence{max-width:1240px;margin:0 auto;padding:28px 0 38px;border-top:1px solid #ffffff24;display:grid;grid-template-columns:.85fr 1fr 1fr;gap:40px;align-items:start}
.why-evidence-heading>span{font-size:13px;color:#d8e6f1;display:block;margin:4px 0 10px}.why-evidence-heading a{font-size:11px;color:#9fbbd2;text-underline-offset:4px}
.why-fact{display:flex;gap:18px;align-items:center}.why-number{font-size:42px;line-height:1;letter-spacing:-.04em;color:#bdd9ef;white-space:nowrap;font-weight:400}.why-number small{font-size:.45em}
.why-fact p{font-size:12px;line-height:1.6;color:#acbfd1;margin:0;max-width:240px}

@media(max-width:1340px){.why-evidence{margin:0 50px}}
@media(max-width:1100px){.why-top{padding:64px 32px 40px;gap:40px}.why-sim{padding:0 32px 44px}.why-evidence{margin:0 32px}.wm-panels{gap:14px}.wm-head{padding:16px 18px}.wm-stage{margin:0 18px 18px}.wm-quote p{font-size:15px}.wm-record dl{grid-template-columns:1fr 1fr}.wm-record dl>div:last-child{grid-column:1/-1;padding-top:0}.wm-mode{display:none}.wm-step{font-size:13px}}
@media(max-width:800px){.why-max{margin:0 12px;border-radius:18px}.why-top{grid-template-columns:1fr;padding:44px 22px 30px;gap:22px}.why-top h2{font-size:38px}.why-lead{font-size:17px}.why-sim{padding:0 16px 32px}.wm-panels{grid-template-columns:1fr}.wm-mode{display:inline}.wm-steps{gap:8px}.wm-step{font-size:12px;gap:4px}.wm-step>span:not(.wm-num){display:none}.wm-step.is-on>span{display:inline}.wm-steps{grid-template-columns:1fr 1fr 1fr 1fr}.why-evidence{margin:0 22px;grid-template-columns:1fr 1fr;gap:22px;padding:24px 0 32px}.why-evidence-heading{grid-column:1/-1}.why-number{font-size:38px}.why-fact{display:block}.why-fact p{margin-top:10px}}
@media(max-width:430px){.wm-head{padding:14px 14px}.wm-stage{margin:0 14px 14px}.wm-quote{padding:14px}.wm-quote p{font-size:15px}.wm-chip{font-size:12px;padding:6px 9px}.wm-record dd{font-size:14px}.wm-msg p{font-size:14px}.wm-bubble{max-width:88%}.wm-week{grid-template-columns:repeat(4,.5fr) 2.2fr}.wm-day{padding:8px 6px}.wm-mode{font-size:11px}}
@media(prefers-reduced-motion:reduce){.wm-scene,.wm-scene.is-on{transition:none}}

/* Give the main message space before the scenario. */
.why-top{display:flex;flex-direction:column;align-items:center;text-align:center;gap:28px;padding:76px 50px 55px}.why-top>div:first-child{width:100%;max-width:1040px}.why-top h2{font-size:clamp(38px,4.7vw,66px);line-height:1.1}.why-top h2 span{display:block}.why-intro{max-width:740px}.why-lead{margin:0;font-size:17px;line-height:1.7;color:#b8ccdd}
@media(max-width:760px){.why-top{padding:44px 24px 34px;gap:23px}.why-top h2{font-size:38px}.why-lead{font-size:15px}.why-eyebrow{margin-bottom:20px}}
