:root{--ink:#141820;--ink2:#2E3542;--grey:#5C6675;--line:#D9DEE5;--paper:#F5F6F8;--sheet:#fff;--navy:#0B2A4F;--orange:#F26B21;--orange-dk:#D9531A;--sand:#FFF1E8;--blue:#1B5E8C;--flow:#F26B21;--flow-soft:#FFF1E8;--pulse:#1B5E8C;--pulse-soft:#E7EEF6;--mono:Poppins,Helvetica,Arial,sans-serif;--disp:"Nunito Sans",Helvetica,Arial,sans-serif;--head:Outfit,Helvetica,Arial,sans-serif;--mark:Poppins,Helvetica,sans-serif}
*{box-sizing:border-box}
html{color-scheme:light}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 var(--disp)}
a{color:inherit}
.top{display:flex;align-items:center;justify-content:space-between;padding:14px 32px;background:var(--sheet);border-bottom:1px solid var(--line)}
.wordmark{display:block;text-decoration:none;color:var(--navy)}
.wordmark svg{display:block;height:32px;width:auto}
nav{display:flex;gap:22px;font-size:13px;font-weight:600;font-family:var(--mark)}
nav a{text-decoration:none;color:var(--navy)}
nav a:hover{color:var(--orange)}
.hero{max-width:880px;margin:0 auto;padding:72px 32px 56px;display:flex;flex-direction:column;gap:22px}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
h1{font-family:var(--head);font-size:clamp(30px,4.6vw,46px);line-height:1.08;letter-spacing:-.025em;font-weight:700;margin:0;max-width:20ch;text-wrap:balance;color:var(--navy)}
.lede{font-size:18px;line-height:1.5;color:var(--ink2);max-width:62ch;margin:0}
.products{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:10px}
@media (max-width:640px){.products{grid-template-columns:1fr}}
.product{padding:20px;border-radius:12px;border:1px solid var(--line);background:var(--sheet);display:flex;flex-direction:column;gap:8px}
.product p{margin:0;color:var(--ink2);font-size:14px}
.mark{font-family:var(--mark);font-weight:700;font-size:18px}
.mark sup{font-size:8px;font-weight:400}
.flow .mark{color:var(--flow)}.pulse .mark{color:var(--pulse)}
.cta{display:flex;align-items:center;gap:14px;margin-top:8px}
.btn{display:inline-flex;align-items:center;padding:11px 18px;border-radius:8px;border:1px solid var(--line);background:var(--sheet);color:var(--ink2);font-weight:600;font-family:var(--mark);text-decoration:none}
.btn.primary{background:var(--orange);color:#fff;border-color:var(--orange)}
.btn.primary:hover{background:var(--orange-dk);border-color:var(--orange-dk)}
.hint{font-size:13px;color:var(--grey)}
.foot{max-width:880px;margin:0 auto;padding:18px 32px 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:11px;color:var(--grey)}
.foot a{color:var(--grey)}
.doc{max-width:760px;margin:0 auto;padding:48px 32px 56px;display:flex;flex-direction:column;gap:14px}
.doc h1{font-size:32px;max-width:none}
.doc h2{font-family:var(--head);font-size:18px;margin:18px 0 0;color:var(--navy)}
.doc p,.doc li{max-width:66ch;color:var(--ink2)}
.doc .draft{display:inline-block;padding:4px 10px;border-radius:999px;background:var(--sand);color:var(--orange-dk);font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;align-self:flex-start}

/* homepage sections, same frame and width as the hero */
.sec{max-width:880px;margin:0 auto;padding:12px 32px 56px;display:flex;flex-direction:column;gap:18px;border-top:1px solid var(--line);padding-top:48px}
h2{font-family:var(--head);font-size:clamp(24px,3.2vw,32px);line-height:1.12;letter-spacing:-.02em;font-weight:700;margin:0;max-width:24ch;text-wrap:balance;color:var(--navy)}
.lede.small{font-size:15px}
.product .tag{font-family:var(--mark);font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange)}
.product ul{margin:4px 0 0;padding-left:18px;color:var(--ink2);font-size:14px}
.product li{margin:3px 0}
.receipt{background:var(--navy);border-radius:16px;padding:20px 22px;color:#fff}
.receipt .rhead{display:flex;justify-content:space-between;align-items:center;font-family:var(--mark);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#9FB3CC;margin-bottom:8px}
.receipt .rhead b{color:#fff;font-weight:600}
.pill{display:inline-block;padding:3px 9px;border-radius:999px;font-family:var(--mark);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.08);color:#CFE0F5}
.pill.ok{background:rgba(255,140,58,.18);color:#FFB07A}
.touch{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid rgba(255,255,255,.1)}
.touch .ic{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.08)}
.touch .ic svg{width:20px;height:20px;fill:none;stroke:#FF8C3A;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.touch .t{font-size:14px;line-height:1.4}
.touch .t b{display:block;font-family:var(--mark);font-weight:600;font-size:13px;color:#fff;margin-bottom:2px}
.touch .t span{color:#C9D6E6}
.touch .when{font-family:var(--mark);font-weight:600;font-size:12px;color:#FFB07A;white-space:nowrap}
.bubble{margin-top:4px;display:inline-block;background:#1F4E7E;color:#fff;border-radius:14px 14px 14px 4px;padding:8px 12px;font-size:13.5px;line-height:1.35;max-width:40ch}
.receipt .rfoot{margin-top:12px;font-size:11px;color:#7F97B5}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){.steps{grid-template-columns:1fr}}
.step{padding:18px 20px;border-radius:12px;border:1px solid var(--line);background:var(--sheet);display:flex;flex-direction:column;gap:6px}
.step .n{font-family:var(--head);font-weight:700;font-size:30px;line-height:1;color:var(--orange)}
.step b{font-family:var(--head);font-weight:600;font-size:17px;color:var(--navy)}
.step p{margin:0;color:var(--ink2);font-size:14px}
.fails{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media (max-width:640px){.fails{grid-template-columns:1fr}}
.fail{padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:var(--sheet);font-size:13.5px;color:var(--ink2)}
.fail b{display:block;font-family:var(--mark);font-weight:600;font-size:12.5px;color:var(--navy);margin-bottom:3px}

/* homepage: the two animated product panels */
.panels{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.panel{background:var(--sheet);border:1px solid var(--line);border-radius:16px;padding:18px 20px 12px;display:flex;flex-direction:column;gap:10px}
.panel.flow{border-top:4px solid var(--orange)}.panel.pulse{border-top:4px solid var(--pulse)}
.panel .ph{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.panel .ph p{margin:4px 0 0;color:var(--ink2);font-size:14px;max-width:70ch}
.panel.flow .mark{color:var(--flow)}.panel.pulse .mark{color:var(--pulse)}
.panel .art svg{width:100%;height:auto;display:block}
.btn.small{padding:6px 12px;font-size:12.5px;border-radius:8px;white-space:nowrap;text-decoration:none}
@media (max-width:640px){.panel .ph{flex-direction:column}}
@keyframes lfride{0%{offset-distance:0%;opacity:1}38%{offset-distance:100%;opacity:1}42%{offset-distance:100%;opacity:0}100%{offset-distance:100%;opacity:0}}@keyframes lfout1{0%,42%{offset-distance:0%;opacity:0}43%{opacity:1}52%{offset-distance:100%;opacity:1}54%,100%{offset-distance:100%;opacity:0}}@keyframes lfout2{0%,54%{offset-distance:0%;opacity:0}55%{opacity:1}64%{offset-distance:100%;opacity:1}66%,100%{offset-distance:100%;opacity:0}}@keyframes lfout3{0%,66%{offset-distance:0%;opacity:0}67%{opacity:1}76%{offset-distance:100%;opacity:1}78%,100%{offset-distance:100%;opacity:0}}@keyframes lfrc1{0%,51%{opacity:0;transform:translateX(-8px)}55%,97%{opacity:1;transform:none}100%{opacity:0}}@keyframes lfrc2{0%,63%{opacity:0;transform:translateX(-8px)}67%,97%{opacity:1;transform:none}100%{opacity:0}}@keyframes lfrc3{0%,75%{opacity:0;transform:translateX(-8px)}79%,97%{opacity:1;transform:none}100%{opacity:0}}@keyframes lfglow{0%,50%{opacity:0}54%,97%{opacity:1}100%{opacity:0}}@keyframes lfring{0%,75%{transform:rotate(0)}78%{transform:rotate(-14deg)}81%{transform:rotate(14deg)}84%{transform:rotate(-10deg)}87%{transform:rotate(10deg)}90%,100%{transform:rotate(0)}}.rcpt{opacity:0}.rcpt.a{animation:lfrc1 7s linear infinite}.rcpt.b{animation:lfrc2 7s linear infinite}.rcpt.c{animation:lfrc3 7s linear infinite}.glow{opacity:0;animation:lfglow 7s linear infinite}.glow.b{animation-name:lfrc2}.glow.c{animation-name:lfrc3}.out1{offset-path:path("M 520 130 C 590 130, 610 42, 680 42");offset-rotate:0deg;animation:lfout1 7s ease-in-out infinite}.out2{offset-path:path("M 520 130 H 680");offset-rotate:0deg;animation:lfout2 7s ease-in-out infinite}.out3{offset-path:path("M 520 130 C 590 130, 610 218, 680 218");offset-rotate:0deg;animation:lfout3 7s ease-in-out infinite}.ringer{transform-box:fill-box;transform-origin:center;animation:lfring 7s ease-in-out infinite}
.rider{offset-path:path("M 40 130 C 100 40, 140 40, 200 110 S 300 190, 360 110 S 460 40, 520 130");offset-rotate:0deg;animation:lfride 7s ease-in-out infinite}
.rider2{offset-path:path("M 40 130 C 100 40, 140 40, 200 110 S 300 190, 360 110 S 460 40, 520 130");offset-rotate:0deg;animation:lfride 7s ease-in-out infinite;animation-delay:.3s}
@media (prefers-reduced-motion:reduce){.rider,.rider2{animation:none;offset-distance:62%}.out1,.out2,.out3{animation:none;offset-distance:100%;opacity:1}.rcpt,.glow{animation:none;opacity:1}.ringer{animation:none}}
@keyframes lpflow{0%{offset-distance:0%;opacity:0}6%{opacity:1}94%{opacity:1}100%{offset-distance:100%;opacity:0}}@keyframes stopA{0%,0.0%{opacity:1}1.0%,16.0%{opacity:0}17.0%,100%{opacity:1}}@keyframes badA{0%,0.0%{opacity:0}1.0%,16.0%{opacity:1}17.0%,100%{opacity:0}}@keyframes alertA{0%,1.0%{opacity:0;transform:translateY(-6px)}2.0%,16.0%{opacity:1;transform:none}17.0%,100%{opacity:0}}@keyframes stopB{0%,16.6%{opacity:1}17.6%,32.6%{opacity:0}33.6%,100%{opacity:1}}@keyframes badB{0%,16.6%{opacity:0}17.6%,32.6%{opacity:1}33.6%,100%{opacity:0}}@keyframes alertB{0%,17.6%{opacity:0;transform:translateY(-6px)}18.6%,32.6%{opacity:1;transform:none}33.6%,100%{opacity:0}}@keyframes stopC{0%,33.2%{opacity:1}34.2%,49.2%{opacity:0}50.2%,100%{opacity:1}}@keyframes badC{0%,33.2%{opacity:0}34.2%,49.2%{opacity:1}50.2%,100%{opacity:0}}@keyframes alertC{0%,34.2%{opacity:0;transform:translateY(-6px)}35.2%,49.2%{opacity:1;transform:none}50.2%,100%{opacity:0}}@keyframes stopD{0%,49.8%{opacity:1}50.8%,65.8%{opacity:0}66.8%,100%{opacity:1}}@keyframes badD{0%,49.8%{opacity:0}50.8%,65.8%{opacity:1}66.8%,100%{opacity:0}}@keyframes alertD{0%,50.8%{opacity:0;transform:translateY(-6px)}51.8%,65.8%{opacity:1;transform:none}66.8%,100%{opacity:0}}@keyframes stopE{0%,66.4%{opacity:1}67.4%,82.4%{opacity:0}83.4%,100%{opacity:1}}@keyframes badE{0%,66.4%{opacity:0}67.4%,82.4%{opacity:1}83.4%,100%{opacity:0}}@keyframes alertE{0%,67.4%{opacity:0;transform:translateY(-6px)}68.4%,82.4%{opacity:1;transform:none}83.4%,100%{opacity:0}}@keyframes stopF{0%,83.0%{opacity:1}84.0%,99.0%{opacity:0}100.0%,100%{opacity:1}}@keyframes badF{0%,83.0%{opacity:0}84.0%,99.0%{opacity:1}100.0%,100%{opacity:0}}@keyframes alertF{0%,84.0%{opacity:0;transform:translateY(-6px)}85.0%,99.0%{opacity:1;transform:none}100.0%,100%{opacity:0}}@keyframes lpfixed{0%,102.0%{opacity:0;transform:translateY(-6px)}104.0%,96%{opacity:1;transform:none}99%,100%{opacity:0}}@keyframes lpbeat{0%{stroke-dashoffset:260}100%{stroke-dashoffset:0}}.lpd2{offset-rotate:0deg;animation:lpflow 4s linear infinite}.lp2 .d0{offset-path:path("M 47 44 C 108.5 44, 108.5 62, 170 62")}.lp2 .d1{offset-path:path("M 47 82 C 108.5 82, 108.5 62, 170 62")}.lp2 .d2{offset-path:path("M 47 120 C 108.5 120, 108.5 158, 170 158")}.lp2 .d3{offset-path:path("M 47 158 C 108.5 158, 108.5 158, 170 158")}.lp2 .d4{offset-path:path("M 47 196 C 108.5 196, 108.5 158, 170 158")}.lp2 .d5{offset-path:path("M 47 234 C 108.5 234, 108.5 234, 170 234")}.lp2 .d6{offset-path:path("M 202 62 C 263.0 62, 263.0 108, 324 108")}.lp2 .d7{offset-path:path("M 202 158 C 263.0 158, 263.0 108, 324 108")}.lp2 .d8{offset-path:path("M 202 234 C 263.0 234, 263.0 234, 324 234")}.lp2 .d9{offset-path:path("M 356 108 C 414.0 108, 414.0 166, 472 166")}.lp2 .d10{offset-path:path("M 356 234 C 414.0 234, 414.0 166, 472 166")}.lp2 .d11{offset-path:path("M 299 286 C 350 262, 420 200, 476 178")}.lp2 .d12{offset-path:path("M 389 286 C 440 262, 420 200, 476 178")}.lp2 .d13{offset-path:path("M 479 286 C 530 262, 420 200, 476 178")}.lp2 .d14{offset-path:path("M 508 166 C 564.0 166, 564.0 166, 620 166")}.lp2 .d15{offset-path:path("M 660 166 C 720.0 166, 720.0 104, 780 104")}.lp2 .d16{offset-path:path("M 660 166 C 720.0 166, 720.0 166, 780 166")}.lp2 .d17{offset-path:path("M 660 166 C 720.0 166, 720.0 228, 780 228")}.lp2 .d18{offset-path:path("M 812 104 C 865.0 104, 865.0 166, 918 166")}.lp2 .d19{offset-path:path("M 812 166 C 865.0 166, 865.0 166, 918 166")}.lp2 .d20{offset-path:path("M 812 228 C 865.0 228, 865.0 166, 918 166")}.lp2 .segA{opacity:0}.lp2 .badA{opacity:1}.lp2 .alertA{opacity:0;animation:alertA 36s linear infinite}.lp2 .segB{opacity:0}.lp2 .badB{opacity:1}.lp2 .alertB{opacity:0;animation:alertB 36s linear infinite}.lp2 .segC{opacity:0}.lp2 .badC{opacity:1}.lp2 .alertC{opacity:0;animation:alertC 36s linear infinite}.lp2 .segD{opacity:0}.lp2 .badD{opacity:1}.lp2 .alertD{opacity:0;animation:alertD 36s linear infinite}.lp2 .segE{opacity:0}.lp2 .badE{opacity:1}.lp2 .alertE{opacity:0;animation:alertE 36s linear infinite}.lp2 .segF{opacity:0}.lp2 .badF{opacity:1}.lp2 .alertF{opacity:0;animation:alertF 36s linear infinite}.lp2 .lpfixed{opacity:0;animation:lpfixed 36s linear infinite}.lppulse path{stroke-dasharray:130 130;animation:lpbeat 2.4s linear infinite}@media (prefers-reduced-motion:reduce){.lpd2{animation:none;offset-distance:50%;opacity:1}.lp2 [class^=alert]{animation:none;opacity:0}.lp2 .alertB{opacity:1}.lppulse path{animation:none}}

/* the two deep-dive bands · always the designed marks, never the names in body type */
.mki{font-family:var(--mark);font-weight:700;color:inherit}.mki.flow{color:var(--flow)}.mki.pulse{color:var(--pulse)}.mki sup{font-size:.55em;font-weight:400}
.mark.flow{color:var(--flow)}.mark.pulse{color:var(--pulse)}
.band{padding:56px 32px 64px}
.band.flow{background:var(--sand)}
.band.pulse{background:var(--pulse-soft)}
.band .inner{max-width:880px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.bhead{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.markbig{font-family:var(--mark);font-weight:700;font-size:34px;letter-spacing:-.02em;line-height:1}
.markbig.flow{color:var(--flow)}.markbig.pulse{color:var(--pulse)}
.markbig sup{font-size:11px;font-weight:400}
.band h2{max-width:26ch}
.band .lede{font-size:16.5px}
.bgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:6px}
@media (max-width:760px){.bgrid{grid-template-columns:1fr}}
.bcard{background:var(--sheet);border:1px solid var(--line);border-radius:14px;padding:16px 16px 14px;display:flex;flex-direction:column;gap:8px}
.band.flow .bcard{border-top:3px solid var(--orange)}.band.pulse .bcard{border-top:3px solid var(--pulse)}
.bcard b{font-family:var(--head);font-weight:700;font-size:15.5px;color:var(--navy);line-height:1.2}
.bcard p{margin:0;font-size:13px;color:var(--ink2);line-height:1.45}
.bi{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--paper)}
.band.flow .bi{background:#FFE3D0}.band.pulse .bi{background:#D6E3F1}
.bi svg{width:19px;height:19px;fill:none;stroke:var(--navy);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.band.flow .bi svg{stroke:var(--orange-dk)}.band.pulse .bi svg{stroke:var(--pulse)}
.rstrip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media (max-width:760px){.rstrip{grid-template-columns:1fr 1fr}}
.rs{background:var(--navy);color:#fff;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;font-size:12px}
.rs .rt{font-family:var(--mark);font-weight:700;font-size:12px;color:#FFB07A}
.rs b{font-family:var(--head);font-size:14px;color:#fff}
.rs span:last-child{color:#C9D6E6}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media (max-width:760px){.steps4{grid-template-columns:1fr 1fr}}
.steps4 div{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--line);font-family:var(--head);font-weight:600;font-size:13.5px;color:var(--navy)}
.steps4 i{font-style:normal;font-family:var(--head);font-weight:700;font-size:20px;color:var(--orange)}

.btn .mki{margin:0 .28em;color:inherit}.btn.primary .mki{color:#fff}.btn:not(.primary) .mki.flow{color:var(--flow)}.btn:not(.primary) .mki.pulse{color:var(--pulse)}

.panel .ph p b{font-family:var(--head);font-weight:700;color:var(--navy);font-size:15px}

.lede.bold{font-family:var(--head);font-weight:800;font-size:clamp(19px,2.4vw,24px);line-height:1.3;color:var(--navy);max-width:56ch}
.rstrip{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:center}
.rarr{font-size:22px;color:var(--orange);line-height:1;padding:0 2px}
@media (max-width:760px){.rstrip{grid-template-columns:1fr 1fr}.rarr{display:none}}
