@font-face{font-family:'Be Vietnam Pro';font-weight:400;font-display:swap;src:url(/assets/fonts/bvp-400.woff2) format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-weight:500;font-display:swap;src:url(/assets/fonts/bvp-500.woff2) format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-weight:600;font-display:swap;src:url(/assets/fonts/bvp-600.woff2) format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-weight:700;font-display:swap;src:url(/assets/fonts/bvp-700.woff2) format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-weight:800;font-display:swap;src:url(/assets/fonts/bvp-800.woff2) format('woff2')}
:root{--ink:#070018;--indigo:#3F3BF2;--violet:#895BF5;--peri:#9590ED;--lilac:#EEEAFF;--lilac2:#F6F4FF;--magenta:#E20074;--paper:#fff;--slate:#655B77;--ink2:#241a3d;--line:#E9E4F5;--coral:#FF6B5C;--gold:#F0B94D;--maxw:1200px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink2);font-family:'Be Vietnam Pro',system-ui,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;color:var(--ink);text-wrap:balance;line-height:1.1;letter-spacing:-.02em}
h1{font-size:clamp(36px,5vw,58px);font-weight:800;letter-spacing:-.03em}h2{font-size:clamp(26px,3.4vw,40px);font-weight:800}h3{font-size:20px;font-weight:700}
p{margin:0;text-wrap:pretty}a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--indigo)}
.lede{font-size:19px;color:var(--slate);max-width:64ch}
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15.5px;padding:14px 24px;border-radius:999px;cursor:pointer;border:1px solid transparent;transition:.18s;min-height:48px}
.btn-primary{background:var(--indigo);color:#fff;box-shadow:0 10px 26px -12px rgba(63,59,242,.7)}.btn-primary:hover{background:#332ee0;transform:translateY(-2px)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}.btn-ghost:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
.btn-out{background:#fff;color:var(--ink);border-color:var(--line)}.btn-out:hover{border-color:var(--indigo);color:var(--indigo);transform:translateY(-2px)}
.sec-pad{padding:88px 0}.sec-head{max-width:760px}.sec-head h2{margin-top:14px}.sec-head p{margin-top:16px;color:var(--slate)}
.lilac{background:var(--lilac2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
header.nav{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:74px;gap:16px}
.brand svg{height:34px;width:auto;display:block}
.nav-links{display:flex;gap:2px;align-items:center}.navitem{position:relative}
/* white-space:nowrap keeps the caret on the same line as its label. Without it the
   label and the caret are separate flex items and the caret drops to its own line
   as soon as the nav row gets tight. */
.navitem>a{display:flex;align-items:center;gap:5px;font-size:15px;font-weight:600;color:var(--ink2);padding:10px 13px;border-radius:10px;transition:.15s;white-space:nowrap}
.navitem>a .caret{font-size:10px;opacity:.6;flex:0 0 auto}
.navitem>a:hover{color:var(--indigo);background:var(--lilac)}.navitem>a .caret{font-size:10px;opacity:.6}
.mega{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%) translateY(6px);background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 70px -30px rgba(20,10,60,.4);padding:14px;min-width:280px;opacity:0;visibility:hidden;transition:.16s;z-index:90}
.navitem:hover .mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.mega .mlab{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--peri);padding:6px 12px 8px}
.mega a.mrow{display:block;padding:9px 12px;border-radius:10px;font-size:14.5px;font-weight:500;color:var(--ink2);transition:.13s}.mega a.mrow:hover{background:var(--lilac);color:var(--indigo);transform:translateX(3px)}
.mega .msep{margin:10px 12px 4px;padding-top:10px;border-top:1px solid var(--line);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--peri)}
/* the buy path, lifted out of the service list so it reads as the way in */
.mega a.mrow.hot,.mobnav .msub a.hot{color:var(--indigo);font-weight:700;background:var(--lilac2);border:1px solid var(--line)}
.mega a.mrow.hot{margin-bottom:2px}
.mega a.mrow.hot:hover{background:var(--indigo);color:#fff;border-color:var(--indigo)}
.mobnav .msub a.hot{border-radius:10px;padding:11px 13px;margin-bottom:4px}
/* --- mobile navigation (below 1140px the mega menu is hidden) --- */
.navtog{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;padding:0;flex:0 0 auto}
.navtog svg{width:22px;height:22px;stroke:var(--ink2);fill:none;stroke-width:2;stroke-linecap:round}
.navtog .xc{display:none}.navtog[aria-expanded="true"] .bc{display:none}.navtog[aria-expanded="true"] .xc{display:block}
.mobnav{display:none;position:fixed;left:0;right:0;top:74px;bottom:0;background:#fff;z-index:79;overflow-y:auto;padding:14px 26px 48px;border-top:1px solid var(--line)}
.mobnav.open{display:block}
.mobnav .mgrp{border-bottom:1px solid var(--line)}
.mobnav .mgrp>button{display:flex;width:100%;align-items:center;justify-content:space-between;background:none;border:0;padding:16px 2px;font:inherit;font-weight:700;font-size:16.5px;color:var(--ink);cursor:pointer;text-align:left}
.mobnav .mgrp>button .x{color:var(--peri);font-size:20px;line-height:1;transition:transform .2s}
.mobnav .mgrp.open>button .x{transform:rotate(45deg)}
.mobnav .msub{display:none;padding:0 2px 14px}
.mobnav .mgrp.open .msub{display:block}
.mobnav .msub a{display:block;padding:10px 0;font-size:15px;color:var(--slate)}
.mobnav .msub a:hover{color:var(--indigo)}
.mobnav .msub .msep{margin:14px 0 2px;padding-top:12px;border-top:1px solid var(--line);font-size:10.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri)}
.mobnav .msub .msep:first-child{margin-top:4px;padding-top:0;border-top:0}
.mobnav .mcta{display:block;margin-top:24px;text-align:center}
@media(max-width:1140px){.nav-links{display:none}.navtog{display:flex}}
@media(min-width:1141px){.mobnav{display:none!important}}
@media(max-width:640px){.hide-sm{display:none}}
body.navopen{overflow:hidden}
.phero{background:radial-gradient(1000px 560px at 84% -12%,rgba(137,91,245,.45),transparent 60%),radial-gradient(680px 460px at 4% 30%,rgba(63,59,242,.3),transparent 62%),linear-gradient(180deg,#0a0126,#0c0330);color:#EDE9FB}
/* Two-column page header: copy left, visual right. The grid engages only when a figure
   (.hviz or .secfig) is actually present as a direct child. A hero without one keeps the
   single-column stack instead of scattering its children across empty grid cells, which
   is what broke 59 pages when this rule was unconditional. */
.phero .in{padding:46px 0 50px;max-width:1180px}
.phero .in:has(>.hviz),.phero .in:has(>.secfig){display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:46px;align-items:center}
.phero .in>.pcopy{max-width:620px}
.phero .crumb{margin:0}
.phero h1{color:#fff;margin-top:10px;font-size:clamp(30px,3.5vw,43px);line-height:1.08}
.phero .kick{color:var(--peri);margin-top:9px}
.phero p{font-size:18px;color:#C9C0E8;max-width:56ch;margin-top:15px}
.phero .cta{display:flex;gap:14px;margin-top:27px;flex-wrap:wrap}
/* hero visual frame */
.hviz{border:1px solid rgba(160,140,255,.28);border-radius:18px;background:linear-gradient(180deg,rgba(23,10,58,.78),rgba(12,3,48,.72));padding:20px;box-shadow:0 24px 60px -30px rgba(0,0,0,.85)}
.hviz .hvlab{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--peri);margin:0 0 13px}
.hvnode{background:rgba(255,255,255,.05);border:1px solid rgba(160,140,255,.22);border-radius:13px;padding:13px 15px}
.hvnode.mid{background:linear-gradient(135deg,rgba(63,59,242,.34),rgba(137,91,245,.26));border-color:rgba(160,140,255,.5)}
.hvnode .t{font-size:14.5px;font-weight:700;color:#fff;letter-spacing:-.01em}
.hvnode .d{font-size:12.5px;color:#b3a6db;margin-top:5px;line-height:1.45}
.hvnode .k{font-size:10.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri);margin-bottom:5px}
.hvarw{text-align:center;color:var(--peri);font-size:15px;line-height:1;margin:8px 0}
.hvchips{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.hvchip{font-size:11.5px;font-weight:600;color:#cfc4f2;background:rgba(255,255,255,.06);border:1px solid rgba(160,140,255,.2);border-radius:999px;padding:5px 11px}
.hvstat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:13px}
@media(max-width:430px){.hvstat{grid-template-columns:1fr}}
.hvstat .s{background:rgba(255,255,255,.05);border:1px solid rgba(160,140,255,.2);border-radius:12px;padding:12px 13px}
.hvstat .s b{display:block;font-size:19px;color:#fff;font-weight:800;letter-spacing:-.02em}
.hvstat .s span{display:block;font-size:11.5px;color:#b3a6db;line-height:1.35;margin-top:3px}
.hvsplit{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:9px;align-items:center}
@media(max-width:430px){.hvsplit{grid-template-columns:1fr}.hvsplit .jn{padding:4px 0}}
.hvsplit .jn{color:var(--peri);font-size:16px;font-weight:800;text-align:center}
.hviz figcaption{font-size:11.5px;color:#a99cd8;margin-top:12px;text-align:center;letter-spacing:.2px}
@media(max-width:980px){
  .phero .in:has(>.hviz),.phero .in:has(>.secfig){grid-template-columns:minmax(0,1fr);gap:30px;padding:32px 0 36px}
  .phero .in>*{min-width:0}
  .phero .in>.pcopy{max-width:none}
  .hviz{order:2}
}
/* ---- Vimeo, loaded only when someone asks for it ----
   No iframe and no player.js until the viewer clicks, so no third-party request is made
   on page load and nothing is set in their browser before they choose to watch. dnt=1
   tells Vimeo not to track the session. The poster is our own markup, not a Vimeo
   thumbnail, so even the still image costs no external call. */
/* 404 "ambient reading" card. Deliberately styled like a Care Daily location report rather than an
   error box: the joke only lands if it looks like the real product output. */
.nfcard{border:1px solid var(--line);border-radius:20px;background:#fff;padding:22px 24px;
 box-shadow:0 30px 60px -34px rgba(20,10,60,.28)}
.nfhead{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:.14em;
 text-transform:uppercase;color:var(--slate);padding-bottom:14px;border-bottom:1px solid var(--line)}
.nfdot{width:8px;height:8px;border-radius:999px;background:#c8c2e4;box-shadow:0 0 0 4px rgba(200,194,228,.28)}
.nfrow{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:11px 0;
 border-bottom:1px solid var(--line);font-size:14.5px}
.nfrow span{color:var(--slate)}
/* min-width:0 is the load-bearing bit. A flex item will not shrink below its min-content width
   without it, so a long URL in the address row pushed the 404 page 32px wide on a phone even
   though overflow-wrap was already set. */
.nfrow b{color:var(--ink);font-weight:650;text-align:right;overflow-wrap:anywhere;max-width:62%;
 min-width:0}
.nfrow b.nfquiet{color:var(--slate);font-weight:600}
.nffoot{padding-top:14px;font-size:13px;color:var(--slate)}
@media(max-width:600px){.nfcard{padding:18px 18px}.nfrow{font-size:13.5px}}

.vwrap{position:relative;width:100%;padding-top:var(--ar,56.25%);border-radius:18px;overflow:hidden;
 background:radial-gradient(600px 340px at 74% 12%,rgba(137,91,245,.45),transparent 62%),linear-gradient(160deg,#0d0330,#1a0748);
 border:1px solid rgba(160,140,255,.3);box-shadow:0 34px 68px -34px rgba(0,0,0,.8)}
.vwrap iframe,.vwrap .vposter{position:absolute;inset:0;width:100%;height:100%;border:0}
.vposter{display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:24px;cursor:pointer;
 background:none;color:#fff;text-align:left;font:inherit}
/* A real frame from the film. Without this the panel is brand-violet on a brand-violet page and does
   not read as a video at all (David, 2026-08-11: "very blank and purple, and not like a video"). */
.vposter .vimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
 transition:transform .45s ease,filter .3s ease}
.vposter:hover .vimg{transform:scale(1.03)}
/* Scrim, so the title stays legible over any frame rather than only over dark ones. */
.vposter::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
 background:linear-gradient(to top,rgba(6,2,22,.88) 0%,rgba(6,2,22,.42) 38%,rgba(6,2,22,.06) 68%,transparent 100%)}
.vposter .vicon,.vposter .vlab,.vposter .vttl,.vposter .vnote,.vposter .vdur{position:relative;z-index:2}
.vposter:hover .vicon{transform:scale(1.07);background:var(--indigo)}
.vicon{width:58px;height:58px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);
 border:1px solid rgba(255,255,255,.34);display:grid;place-items:center;transition:.2s;flex:0 0 auto}
.vicon svg{width:22px;height:22px;fill:#fff;margin-left:3px}
.vposter .vlab{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#c9bcff;
 text-shadow:0 1px 10px rgba(0,0,0,.6)}
.vposter .vttl{font-size:17px;font-weight:700;color:#fff;line-height:1.25;max-width:34ch;letter-spacing:-.01em;
 text-shadow:0 2px 14px rgba(0,0,0,.7)}
.vposter .vnote{font-size:12px;color:#cfc6ee;text-shadow:0 1px 10px rgba(0,0,0,.6)}
/* Run time, top right, the way every video surface signals length before you commit to it. */
.vposter .vdur{position:absolute;top:16px;right:16px;font-size:11.5px;font-weight:700;color:#fff;
 background:rgba(6,2,22,.72);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:4px 10px;
 letter-spacing:.02em;backdrop-filter:blur(4px)}
@media(max-width:600px){.vposter .vttl{font-size:15px}.vicon{width:48px;height:48px}
 .vposter{padding:18px}.vposter .vdur{top:12px;right:12px}}

.crumb{font-size:13px;color:#b9ace6;font-weight:600;letter-spacing:.04em}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px}
/* even rows: take the column count from the card count rather than always 3, so four
   cards render 2 x 2 instead of 3 + 1. David likes symmetry (2026-08-11). */
.grid3:has(>:nth-child(2):last-child),.grid3:has(>:nth-child(4):last-child){grid-template-columns:repeat(2,1fr)}
@media(max-width:840px){.grid3,.grid3:has(>:nth-child(2):last-child),.grid3:has(>:nth-child(4):last-child){grid-template-columns:1fr}}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:46px}@media(max-width:1100px){.grid4{grid-template-columns:repeat(2,1fr)}}@media(max-width:840px){.grid4{grid-template-columns:1fr}}
.secfig{max-width:420px;margin:0 auto}.secfig img{width:100%;height:auto;display:block}
.card{padding:28px 24px;border:1px solid var(--line);border-radius:18px;background:#fff;transition:.22s}
.card:hover{border-color:var(--peri);box-shadow:0 26px 50px -26px rgba(63,59,242,.45);transform:translateY(-5px)}
.card .n{font-size:13px;font-weight:800;color:var(--peri);letter-spacing:.1em}.card h3{margin:8px 0 7px}.card p{font-size:14.5px;color:var(--slate)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}@media(max-width:820px){.split{grid-template-columns:1fr;gap:24px}}
.panel{background:linear-gradient(160deg,#12043a,#1b0847);color:#fff;border-radius:22px;padding:34px;border:1px solid rgba(137,91,245,.3)}
.panel .row{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:14.5px;color:#cfc5ec}.panel .row:last-child{border-bottom:0}.panel .row b{color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.chip{background:var(--lilac);color:var(--indigo);border-radius:999px;padding:8px 15px;font-size:13.5px;font-weight:600}
.related{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.rl{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:12px 18px;font-weight:600;font-size:14.5px;color:var(--ink2);transition:.18s;background:#fff}.rl:hover{border-color:var(--indigo);color:var(--indigo);transform:translateY(-2px)}
.cta-band{background:radial-gradient(700px 420px at 82% 10%,rgba(137,91,245,.5),transparent 60%),linear-gradient(160deg,#0b0128,#170438);color:#fff;text-align:center}
.cta-band h2{color:#fff}.cta-band p{max-width:54ch;margin:14px auto 0;color:#cabfe9}.cta-band .row2{display:flex;gap:14px;justify-content:center;margin-top:26px;flex-wrap:wrap}
/* ------------------------------------------------------------------------------
   Very narrow screens: every multi-column component collapses to a single column.
   This is a deliberate safety net, not a substitute for each component's own
   breakpoints. 21 of 72 pages once scrolled sideways at 390px because individual
   grids each forgot a breakpoint, and an inline grid-template-columns beat every
   media query. !important is here so an inline style cannot reintroduce that.
   ------------------------------------------------------------------------------ */
@media(max-width:430px){
  .apigrid,.ctrlgrid,.sigdom,.mfstack,.valrow,.frag,.ladder,.dim,.loop,.fuse,.adl,.sig,
  .ctrls,.rmap,.askgrid,.tports,.envs,.book,.croute,.scores,.hvstat,.hvsplit,.dcgrid,.dcgrid.dc5,
  .l3grid,.combos,.abgrid,.grid3,.grid4,.dlgrid,.rstat,.split,.pgrid,.dcgrid,.qf .row,
  .qform .qgrid,.foot-top{grid-template-columns:minmax(0,1fr)!important}
  .pill .pr,.reuse,.hier .lvl{grid-template-columns:minmax(0,1fr)!important}
  .pill .pr .why{border-left:0;padding-left:0}
  .wrap{padding:0 18px}
  /* logo and hamburger together did not fit a 320px nav row */
  .brand svg{height:28px}
  .nav-in{gap:8px}
  /* long unbroken figures in stat cards set a min-content wider than the column */
  .rstat .s .big,.rstat .s .l{overflow-wrap:anywhere}
}

footer{background:var(--ink);color:#9a8fc6;padding:52px 0 40px;margin-top:0}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:24px}@media(max-width:820px){.foot-top{grid-template-columns:1fr 1fr}}
footer .brand svg{height:30px}footer .fcol h4{color:#fff;font-size:12.5px;text-transform:uppercase;letter-spacing:.1em;margin:0 0 14px}
footer .fcol a{display:block;color:#c9bdf0;font-size:14px;margin-bottom:10px;transition:.13s}footer .fcol a:hover{color:#fff;transform:translateX(3px)}
.foot-fine{margin-top:34px;padding-top:22px;border-top:1px solid rgba(255,255,255,.09);font-size:13px;color:#7d729f;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ---- rich page components (research, integrations, deep pages) ---- */
.rstat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:44px}
@media(max-width:820px){.rstat{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* This MUST come after the 820px rule: both match at 390px and the later one wins. */
@media(max-width:560px){.rstat{grid-template-columns:1fr}}
.rstat .s{background:linear-gradient(160deg,#140b38,#20104c);color:#fff;border-radius:18px;padding:26px 22px}
.rstat .s{min-width:0}
.rstat .s .big{font-size:clamp(26px,2.6vw,40px);overflow-wrap:break-word;hyphens:auto;font-weight:800;letter-spacing:-.02em;line-height:1;background:linear-gradient(92deg,#fff,#b9a6ff 60%,#7d6bff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rstat .s .l{font-size:13.5px;color:#cabfe9;margin-top:10px;line-height:1.45}
.pubs{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:44px}@media(max-width:820px){.pubs{grid-template-columns:1fr}}
.pub{border:1px solid var(--line);border-radius:18px;background:#fff;padding:28px 26px;transition:.22s;display:flex;flex-direction:column}
.pub:hover{border-color:var(--peri);box-shadow:0 26px 52px -26px rgba(63,59,242,.45);transform:translateY(-4px)}
.pub .tag{display:inline-block;background:var(--lilac);color:var(--indigo);font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px;align-self:flex-start}
.pub h3{margin:16px 0 6px;font-size:20px}.pub .src{font-size:13.5px;color:var(--peri);font-weight:600}
.pub p{font-size:14.5px;color:var(--slate);margin-top:12px}
.pub .meta{margin-top:16px;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink2)}
.pub .meta b{color:var(--indigo)}
.pub .lnk{margin-top:18px;font-weight:600;font-size:14.5px;color:var(--indigo)}.pub:hover .lnk{text-decoration:underline}
.dlgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}@media(max-width:840px){.dlgrid{grid-template-columns:1fr}}
.dl{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:#fff;padding:24px 22px;transition:.2s}
.dl:hover{border-color:var(--indigo);box-shadow:0 22px 44px -24px rgba(63,59,242,.45);transform:translateY(-4px)}
.dl .kind{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--peri)}
.dl h3{font-size:18px;margin:9px 0 8px}.dl p{font-size:14px;color:var(--slate);flex:1}
.dl .go{margin-top:16px;font-weight:600;font-size:14px;color:var(--indigo);display:inline-flex;align-items:center;gap:7px}
.callout{background:radial-gradient(680px 420px at 12% 20%,rgba(137,91,245,.4),transparent 60%),linear-gradient(150deg,#0b0128,#180540);color:#fff;border-radius:24px;padding:44px 40px;margin-top:20px}
.callout h2,.callout h3{color:#fff}.callout p{color:#cabfe9;margin-top:14px;max-width:64ch}
.disc{font-size:12.5px;color:var(--slate);margin-top:22px;border-left:2px solid var(--line);padding-left:14px;line-height:1.6}

.catsec{padding:56px 0;border-bottom:1px solid var(--line)}
.catsec:nth-child(even){background:var(--lilac2)}
.cathd{display:flex;align-items:center;gap:14px;margin-bottom:6px}
.cathd .cic{width:44px;height:44px;border-radius:12px;background:var(--lilac);color:var(--indigo);display:grid;place-items:center;flex:none}
.cathd .cic svg{width:23px;height:23px}
.cathd h2{font-size:26px}
.catsec .clead{font-size:16px;color:var(--slate);max-width:70ch;margin:2px 0 0}
.catbanner{border-radius:20px;overflow:hidden;margin-bottom:26px;height:clamp(190px,28vh,320px);box-shadow:0 24px 50px -30px rgba(20,8,60,.5)}
.catbanner img{width:100%;height:100%;object-fit:cover;display:block}
.cathero{position:relative;border-radius:20px;overflow:hidden;height:clamp(220px,30vh,340px);margin-bottom:28px;display:flex;align-items:flex-end;box-shadow:0 24px 50px -30px rgba(20,8,60,.5)}
.cathero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cathero .chscrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,1,40,.1),rgba(11,1,40,.74))}
.cathero .chtxt{position:relative;padding:30px 32px}
.cathero .chtxt h2{color:#fff;font-size:clamp(24px,3.4vw,32px);letter-spacing:-.02em}
.cathero .chtxt p{color:rgba(255,255,255,.87);max-width:62ch;margin-top:8px;font-size:15px}
.cathero .cic.light{width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.18);color:#fff;display:grid;place-items:center;margin-bottom:12px}
.cathero .cic.light svg{width:23px;height:23px}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
@media(max-width:900px){.pgrid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.pgrid{grid-template-columns:1fr}}
.ptile{border:1px solid var(--line);border-radius:16px;background:#fff;padding:22px 20px;transition:.2s;display:flex;flex-direction:column}
.ptile:hover{border-color:var(--indigo);box-shadow:0 20px 40px -24px rgba(63,59,242,.4);transform:translateY(-4px)}
.ptile .pn{font-size:17px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.ptile .pq{font-size:12px;font-weight:700;color:var(--violet);margin-top:3px;letter-spacing:.01em}
.ptile .pd{font-size:13.5px;color:var(--slate);margin-top:8px;line-height:1.5;flex:1}
.ptile .pw{font-size:12.5px;color:var(--indigo);font-weight:600;margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.catsec{scroll-margin-top:84px}.grouphd{scroll-margin-top:84px;padding:52px 0 4px;background:#fff}
.grouphd .gl{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--indigo);border-bottom:2px solid var(--violet);padding-bottom:6px}
.grouphd h3{font-size:clamp(24px,3.2vw,32px);margin-top:12px;letter-spacing:-.02em;color:var(--ink)}
.pw .pwl{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--violet);margin-bottom:4px}
a.ptl{text-decoration:none;cursor:pointer}
a.ptl:hover{border-color:var(--indigo)}
a.ptl .pmore{font-size:12.5px;font-weight:700;color:var(--violet);margin-top:12px;letter-spacing:.01em}
a.ptl:hover .pmore{text-decoration:underline}
.abgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:26px}
/* even rows: pick the column count from the tile count instead of always using 4 */
.abgrid:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
.abgrid:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,1fr)}
.abgrid:has(>:nth-child(5):last-child),.abgrid:has(>:nth-child(6):last-child),
.abgrid:has(>:nth-child(9):last-child){grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.abgrid,.abgrid:has(>:nth-child(3):last-child),.abgrid:has(>:nth-child(5):last-child),.abgrid:has(>:nth-child(6):last-child),.abgrid:has(>:nth-child(9):last-child){grid-template-columns:1fr 1fr}}
@media(max-width:520px){.abgrid,.abgrid:has(>:nth-child(2):last-child),.abgrid:has(>:nth-child(3):last-child),.abgrid:has(>:nth-child(5):last-child),.abgrid:has(>:nth-child(6):last-child),.abgrid:has(>:nth-child(9):last-child){grid-template-columns:1fr}}
/* breathing room for a full-width scene sitting between the hero and the next heading */
.iband-sec{padding:46px 0 44px}
/* ---- reseller program ---- */
.paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:32px}
@media(max-width:860px){.paths{grid-template-columns:1fr}}
.path{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.path .top{padding:26px 26px 22px;background:var(--lilac2);border-bottom:1px solid var(--line)}
.path .top .tag{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--peri)}
.path .top h3{font-size:20px;margin:9px 0 8px}
.path .top p{font-size:14.5px;color:var(--slate);line-height:1.6}
.path .rows{padding:8px 26px 24px}
.path .r{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.path .r:last-child{border-bottom:0}
.path .r span{color:var(--slate)}
.path .r b{color:var(--ink);text-align:right;white-space:nowrap}
.path .r.hi b{color:var(--indigo);font-size:17px}
.steps5{counter-reset:st;margin-top:30px}
.steps5 .st{display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;padding:18px 0;border-top:1px solid var(--line)}
.steps5 .st:first-child{border-top:0}
.steps5 .st .n{width:38px;height:38px;border-radius:11px;background:var(--lilac);color:var(--indigo);
 display:grid;place-items:center;font-weight:800;font-size:15px}
.steps5 .st h4{font-size:16.5px;margin-bottom:5px}
.steps5 .st p{font-size:14.5px;color:var(--slate);line-height:1.65}
.need{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:26px}
@media(max-width:760px){.need{grid-template-columns:1fr}}
.need .n{border:1px solid var(--line);border-radius:14px;padding:18px 20px;background:#fff}
.need .n b{display:block;font-size:14.5px;margin-bottom:5px}
.need .n span{font-size:13.5px;color:var(--slate);line-height:1.55}

/* ---- legal documents: long-form, readable, anchored ---- */
.legalwrap{display:grid;grid-template-columns:250px minmax(0,1fr);gap:52px;align-items:start}
/* minmax(0,1fr) not 1fr: a bare 1fr track floors at MIN-CONTENT, so the 520px-wide privacy
   tables widened the whole document at 320px even though they sit in an overflow-x container. */
@media(max-width:940px){.legalwrap{grid-template-columns:minmax(0,1fr);gap:26px}}
.legalnav{position:sticky;top:96px;border:1px solid var(--line);border-radius:16px;padding:20px 18px;background:var(--lilac2)}
@media(max-width:940px){.legalnav{position:static}}
.legalnav b{display:block;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri);margin-bottom:12px}
.legalnav a{display:block;font-size:13.5px;color:var(--slate);padding:5px 0;line-height:1.4}
.legalnav a:hover{color:var(--indigo)}
.legaldoc{max-width:74ch}
.legaldoc h2{font-size:22px;margin:42px 0 12px;scroll-margin-top:100px;padding-top:8px;border-top:1px solid var(--line)}
.legaldoc h2:first-of-type{margin-top:6px;border-top:0}
.legaldoc h3{font-size:16.5px;margin:24px 0 8px;color:var(--ink2)}
.legaldoc p{font-size:15.5px;line-height:1.75;color:var(--ink2);margin-bottom:14px}
.legaldoc ul,.legaldoc ol{margin:0 0 16px 22px}
.legaldoc li{font-size:15.5px;line-height:1.7;color:var(--ink2);margin-bottom:7px}
.legaldoc strong{color:var(--ink)}
/* A wide data table must scroll inside its own box rather than widen the document. The privacy
   policy tables pushed /privacy to 384px inside a 320px viewport until this was added. */
.legaldoc .tw{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:16px 0 22px;max-width:100%}
.legaldoc table{width:100%;min-width:520px;border-collapse:collapse;font-size:13.5px}
.legaldoc th,.legaldoc td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top;line-height:1.55}
.legaldoc th{background:var(--lilac2);font-weight:700;color:var(--ink)}
.legaldoc .plain{background:var(--lilac2);border:1px solid var(--line);border-left:3px solid var(--violet);
 border-radius:12px;padding:18px 20px;margin-bottom:24px;font-size:15px;line-height:1.7;color:var(--ink2)}
.legaldoc .glance{border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin:0 0 28px;background:#fff}
.legaldoc .glance b.hd{display:block;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--magenta);margin-bottom:10px}
.legaldoc .updated{font-size:13.5px;color:var(--slate);margin-bottom:22px}
/* ---- /legal hub: one column per relationship, nothing side by side by accident ---- */
.whoami{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:34px}
@media(max-width:900px){.whoami{grid-template-columns:1fr}}
.who{border:1px solid var(--line);border-radius:18px;padding:26px 24px;background:#fff;display:flex;flex-direction:column}
.who .tag{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--peri);margin-bottom:9px}
.who h3{font-size:18px;margin-bottom:8px}
.who p.d{font-size:14px;color:var(--slate);line-height:1.6;margin-bottom:16px;flex:1}
.who a.doc{display:block;border-top:1px solid var(--line);padding:11px 0 3px;font-size:14.5px;font-weight:600;color:var(--indigo)}
.who a.doc span{display:block;font-size:12.5px;font-weight:400;color:var(--slate);margin-top:2px;line-height:1.45}
.who .soon{border-top:1px solid var(--line);padding:11px 0 3px;font-size:14px;color:var(--slate)}

/* ---- brand package page ---- */
.spec{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
.spec .stage{display:grid;place-items:center;padding:54px 30px;min-height:190px}
.spec .stage.lt{background:var(--lilac2)}
.spec .stage.dk{background:linear-gradient(160deg,#0d0330,#1d054f)}
.spec .stage img{max-width:100%;max-height:104px;display:block}
.spec .stage.sm img{max-height:74px}
.spec .meta{border-top:1px solid var(--line);padding:18px 22px}
.spec .meta h3{font-size:16.5px;margin-bottom:5px}
.spec .meta p{font-size:13.5px;color:var(--slate);line-height:1.55;margin-bottom:12px}
.dl2{display:flex;gap:8px;flex-wrap:wrap}
.dl2 a{font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
 border:1px solid var(--line);border-radius:999px;padding:6px 13px;color:var(--indigo);background:var(--lilac2)}
.dl2 a:hover{border-color:var(--violet);background:#fff}
.specgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:30px}
@media(max-width:820px){.specgrid{grid-template-columns:1fr}}
.swatches{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:28px}
@media(max-width:900px){.swatches{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:460px){.swatches{grid-template-columns:1fr}}
.sw{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.sw .chip{height:78px}
.sw .lbl{padding:12px 14px}
.sw .lbl b{display:block;font-size:14px}
.sw .lbl code{font-size:12px;color:var(--slate);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sw .lbl span{display:block;font-size:12px;color:var(--slate);margin-top:5px;line-height:1.45}
.rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:28px}
@media(max-width:820px){.rules{grid-template-columns:1fr}}
.rules .col{border:1px solid var(--line);border-radius:18px;padding:24px 24px 8px;background:#fff}
.rules .col.no{background:#FFF7F6;border-color:#F6D9D5}
.rules h3{font-size:16px;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.rules ul{list-style:none;margin:0 0 16px;padding:0}
.rules li{font-size:14.5px;color:var(--slate);line-height:1.6;padding:7px 0 7px 22px;position:relative}
.rules li:before{position:absolute;left:0;top:7px;font-weight:800}
.rules .col:not(.no) li:before{content:"¹3";color:#2E9E6B}
.rules .col.no li:before{content:"¹5";color:#C4483A}
.clearbox{border:1px dashed var(--violet);border-radius:16px;padding:26px;background:var(--lilac2);
 display:grid;place-items:center;margin-top:8px}
.clearbox .inner{border:1px solid rgba(137,91,245,.45);padding:26px;background:#fff;border-radius:10px}
.clearbox img{max-height:60px;display:block}

/* ---- pfig: large premium body figure with a statement over the image ---- */
.pfig{position:relative;margin:0;border-radius:24px;overflow:hidden;background:#0d0330;
 box-shadow:0 46px 90px -40px rgba(13,3,48,.62)}
.pfig>img{display:block;width:100%;height:clamp(300px,38vw,460px);object-fit:cover}
.pfig.tall>img{height:clamp(340px,44vw,540px)}
.pfig figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 40px 32px;color:#fff;
 background:linear-gradient(180deg,rgba(10,2,38,0) 0%,rgba(10,2,38,.46) 26%,rgba(10,2,38,.84) 56%,rgba(10,2,38,.97) 100%)}
@media(max-width:640px){.pfig figcaption{padding:26px 22px 22px}}
.pfig figcaption .eyebrow{color:#c3bcfa;margin-bottom:9px;text-shadow:0 1px 12px rgba(10,2,38,.85)}
.pfig figcaption b{display:block;font-family:var(--serif),Georgia,serif;font-weight:600;
 font-size:clamp(21px,2.5vw,30px);line-height:1.2;letter-spacing:-.015em;color:#fff}
.pfig figcaption span{display:block;margin-top:11px;max-width:62ch;font-size:15px;line-height:1.6;color:#d6cdf2}
.pfigwrap{padding:10px 0 6px}

@media(max-width:820px){.iband-sec{padding:30px 0 28px}}
.combos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}@media(max-width:900px){.combos{grid-template-columns:1fr}}
.combo{border:1px solid var(--line);border-radius:16px;background:#fff;padding:22px 20px;transition:.2s}
.combo:hover{border-color:var(--violet);box-shadow:0 18px 38px -24px rgba(137,91,245,.5)}
.combo .recipe{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:14px}
.combo .recipe span{background:var(--lilac);color:var(--indigo);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700}
.combo .recipe em{color:var(--peri);font-weight:800;font-style:normal;font-size:13px}
.combo h4{font-size:16.5px;letter-spacing:-.01em;margin-bottom:6px}
.combo p{font-size:13.5px;color:var(--slate);line-height:1.55}
.spectrum{background:linear-gradient(160deg,#12043a,#1b0847);color:#fff;border-radius:22px;padding:38px 34px;margin-top:8px}
.spectrum h2{color:#fff}.spectrum p{color:#cabfe9;margin-top:12px;max-width:66ch}
.spectrum .tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.spectrum .tags span{background:rgba(255,255,255,.08);border:1px solid rgba(137,91,245,.35);border-radius:999px;padding:8px 15px;font-size:13px;font-weight:600;color:#e7e0fb}
/* ---- smart home page ---- */
.protorow{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.protorow .chip{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:700;color:var(--ink);transition:.18s}
.protorow .chip:hover{border-color:var(--indigo);box-shadow:0 12px 26px -18px rgba(63,59,242,.5)}
.protorow .chip i{width:8px;height:8px;border-radius:50%;background:var(--violet);flex:none}
.dcgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:26px}
.dcgrid.dc5{grid-template-columns:repeat(5,minmax(0,1fr))}
.l3grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:26px}
@media(max-width:900px){.l3grid{grid-template-columns:1fr}}
@media(max-width:1000px){.dcgrid.dc5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.dcgrid.dc5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:460px){.dcgrid,.dcgrid.dc5{grid-template-columns:1fr}}
@media(max-width:1000px){.dcgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.dcgrid{grid-template-columns:1fr 1fr}}
.dcard{display:block;color:inherit;text-decoration:none;border:1px solid var(--line);border-radius:16px;background:#fff;padding:20px 18px;transition:.2s}
.dcard:hover{border-color:var(--indigo);box-shadow:0 20px 40px -24px rgba(63,59,242,.4);transform:translateY(-4px)}
.dcard .di{width:40px;height:40px;border-radius:11px;background:var(--lilac);color:var(--indigo);display:grid;place-items:center;margin-bottom:12px}
.dcard .di svg{width:21px;height:21px}
.dcard h3{font-size:15.5px;letter-spacing:-.01em}
.dcard .br{font-size:12.5px;color:var(--slate);margin-top:6px;line-height:1.5}
.connect{margin-top:8px;border-radius:24px;overflow:hidden;background:radial-gradient(900px 460px at 50% -10%,rgba(137,91,245,.5),transparent 62%),linear-gradient(160deg,#0b0128,#180540);padding:30px}
.connect svg{width:100%;height:auto;display:block}
.tier2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px}@media(max-width:760px){.tier2{grid-template-columns:1fr}}
.tier{border:1px solid var(--line);border-radius:18px;background:#fff;padding:28px 26px}
.tier .tg{display:inline-block;background:var(--lilac);color:var(--indigo);font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px}
.tier h3{margin:14px 0 6px;font-size:20px}.tier p{font-size:14.5px;color:var(--slate)}

/* scroll-reveal motion (progressive enhancement; content shows if JS off) */
.js .reveal{opacity:0;transform:translateY(18px)}
.reveal{transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none}}
.imgband{border-radius:22px;overflow:hidden;margin:6px 0 2px;height:clamp(220px,32vh,380px);box-shadow:0 26px 54px -30px rgba(20,8,60,.5)}
.imgband img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s ease}
.imgband:hover img{transform:scale(1.03)}
.prodshot{background:radial-gradient(720px 420px at 50% 25%,rgba(137,91,245,.14),transparent 70%);border:1px solid var(--line);border-radius:24px;padding:34px;display:grid;place-items:center;margin-top:6px}
.prodshot img{max-height:340px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 28px 40px rgba(20,8,60,.18))}
/* interactive tabbed panels */
.ctabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.ctab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:11px 20px;font-size:14.5px;font-weight:700;color:var(--slate);cursor:pointer;transition:.18s;font-family:inherit}
.ctab:hover{border-color:var(--indigo);color:var(--ink)}
.ctab.is-active{background:var(--indigo);border-color:var(--indigo);color:#fff;box-shadow:0 12px 26px -14px rgba(63,59,242,.6)}
.cpanels{margin-top:22px}
.cpanel{display:none;border:1px solid var(--line);border-radius:20px;background:#fff;padding:34px 32px;gap:24px}
.cpanel.is-active{display:flex;animation:cfade .4s ease}
@keyframes cfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.cpanel .cpi{width:56px;height:56px;border-radius:15px;background:var(--lilac);color:var(--indigo);display:grid;place-items:center;flex:none}
.cpanel .cpi svg{width:28px;height:28px}
.cpanel .tag{display:inline-block;background:var(--lilac);color:var(--indigo);font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px}
.cpanel h3{font-size:22px;margin:10px 0 8px;letter-spacing:-.01em}
.cpanel p{color:var(--slate);max-width:64ch;font-size:15px;line-height:1.6}
@media(max-width:600px){.cpanel{flex-direction:column}}
/* how-it-comes-together band */
.flowsec{background:radial-gradient(920px 460px at 84% 0%,rgba(137,91,245,.08),transparent 62%),linear-gradient(180deg,#fbfaff,#f4f1ff)}
.flowsec .sec-head{max-width:820px}
.flowsec .ctabs{justify-content:flex-start}
.flowsec .cpanel{align-items:flex-start;box-shadow:0 24px 48px -30px rgba(20,8,60,.4)}
.flowsec .cpanel .cpi{width:60px;height:60px;background:linear-gradient(150deg,var(--indigo),var(--violet));color:#fff}
.ctabwrap{margin-top:6px}

.pkbanner{background:#FFF6E0;border:1px solid #E7CE7C;color:#5b4a00;border-radius:10px;padding:10px 14px;font-size:13px;margin:12px 0;max-width:70ch}
.pricecall{display:inline-flex;gap:10px;align-items:baseline;flex-wrap:wrap;background:#F6F4FF;border:1px solid #EEEAFF;border-radius:12px;padding:12px 18px;margin:6px 0 18px;font-size:15px;color:#1d054f}
.pricecall b{font-size:22px;color:#3F3BF2}
.pkprice{max-width:520px;margin:0 auto;background:#fff;border:1px solid #EEEAFF;border-radius:20px;padding:28px;box-shadow:0 30px 60px -40px rgba(63,59,242,.35);text-align:center}
.pkprice .amt{font-size:42px;font-weight:800;color:#3F3BF2;line-height:1}.pkprice .per{color:#655B77}
.pkprice ul{text-align:left;max-width:340px;margin:18px auto;padding-left:20px;color:#33294d;line-height:1.9}
.pkband{background:#F6F4FF}
details.faq{border-bottom:1px solid #EEEAFF;padding:14px 4px}
details.faq summary{cursor:pointer;font-weight:700;color:#1d054f;list-style:none}
details.faq summary::-webkit-details-marker{display:none}
details.faq .fa{margin-top:10px;color:#655B77;line-height:1.6}
.pknotice{background:#1d054f;color:#EDE9FB;border-radius:16px;padding:22px 24px;line-height:1.6;font-size:14px}
.pktrial{max-width:520px;margin:16px 0;background:#fff;border:2px solid #3F3BF2;border-radius:20px;padding:26px;box-shadow:0 30px 60px -40px rgba(63,59,242,.35)}
.pktrial .amt{font-weight:700;color:#1d054f;letter-spacing:.02em}
.pktrial .big{font-size:clamp(24px,2.4vw,34px);overflow-wrap:break-word;font-weight:800;color:#3F3BF2;line-height:1;margin:4px 0 4px;min-width:0}
.pktrial ul{margin:14px 0;padding-left:20px;color:#33294d;line-height:1.9}
.pktrial .btn{margin:6px 8px 0 0}
.pkhi{background:#EEEAFF;border-left:4px solid #3F3BF2;border-radius:8px;padding:12px 14px;margin:10px 0}
.pkhero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center;padding:56px 0 52px}
.pkhero-grid h1{color:#fff;margin-top:12px}.pkhero-grid .sub{color:#C9C0E8;font-size:18px;max-width:52ch;margin-top:16px}
.homewrap{position:relative;width:100%;max-width:560px;margin:0 auto}
.homewrap img{width:100%;height:auto;display:block;filter:drop-shadow(0 34px 54px rgba(0,0,0,.5))}
.cbub{position:absolute;transform:translate(-50%,-50%);background:rgba(255,255,255,.95);color:#1d054f;border:1px solid rgba(137,91,245,.4);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:700;white-space:nowrap;box-shadow:0 12px 26px -12px rgba(0,0,0,.55);display:flex;align-items:center;gap:6px}
.cbub::before{content:"";width:7px;height:7px;border-radius:50%;background:#3F3BF2;flex:none}
.cbub.alert::before{background:#E20074}
@media(max-width:900px){.pkhero-grid{grid-template-columns:1fr;gap:26px;padding:40px 0 36px}.cbub{font-size:10.5px;padding:4px 8px}}
/* The bubbles are positioned by percentage over the render, so on a narrow screen the
   outermost ones hang off the edge. The image reads fine without them. */
@media(max-width:760px){.cbub{display:none}}
.cardicon{width:38px;height:38px;border-radius:10px;background:#EEEAFF;display:flex;align-items:center;justify-content:center;margin-bottom:10px;color:#3F3BF2}
.cardicon svg{width:20px;height:20px}
.pkpanel{background:#1d054f;color:#EDE9FB;border-radius:18px;padding:24px 26px;margin-top:20px}
.pkpanel .pt{color:#fff;font-weight:800;font-size:19px;margin-bottom:6px}.pkpanel p{color:#C9C0E8;margin:0;max-width:70ch}
.pkpage .wrap{max-width:1160px}
.pkpage h1,.pkpage h2,.pkpage .kick,.pkpage .sub{text-align:center}
.pkpage section>.wrap>p{max-width:720px;margin-left:auto;margin-right:auto;text-align:center}
.pkpage .pkhero-grid{text-align:center}
.pkpage .cta{justify-content:center}
.pkpage .abgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:26px}
.pkpage .abgrid .ptile{flex:0 1 260px}
.pkpage .ptile{text-align:left}
.pkpage .cardicon{margin-left:0;margin-right:auto}
.pkpage .pricecall,.pkpage .pktrial,.pkpage .pkprice{margin-left:auto;margin-right:auto}
/* The pricing card is centered by design. This rule used to left-align the whole card
   in order to fix the feature list, which also dragged the price, the button and the
   footnote to the left edge (David 2026-08-11). Only the list needs it. */
.pkpage .pkprice ul,.pkpage .pktrial ul{text-align:left}
.pkpage .pkprice{text-align:center}
.pkpage .pkprice .amt,.pkpage .pkprice .per{display:block;text-align:center}
.pkpage .pkprice .btn{margin-left:auto;margin-right:auto}
.pkpage .pkprice>p{text-align:center;max-width:44ch;margin-left:auto;margin-right:auto}
.pkpage .homewrap{margin-left:auto;margin-right:auto}
.pkpage .related{justify-content:center}
.pkpage details.faq,.pkpage details.faq summary,.pkpage details.faq .fa,.pkpage .pknotice,.pkpage .pkpanel{text-align:left}
.pkpage section.sec-pad{padding-top:96px;padding-bottom:96px}
.pkpage .kick{margin-bottom:14px}
.pkpage h2{margin-top:0}
.pkpage .sub{margin-top:24px}
.pkpage section>.wrap>h2+p{margin-top:24px}
.pkpage .abgrid{gap:28px;margin-top:48px}
.pkpage .pkpanel{margin-top:32px}
@media(max-width:1024px){.pkpage section.sec-pad{padding-top:68px;padding-bottom:68px}}
@media(max-width:640px){.pkpage section.sec-pad{padding-top:52px;padding-bottom:52px}}

.cform{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:0 30px 60px -42px rgba(63,59,242,.35)}
.cform .fr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:640px){.cform .fr{grid-template-columns:minmax(0,1fr)}}
@media(max-width:420px){.cform{padding:20px 16px}}
.cform label{display:block;font-size:13px;font-weight:700;color:var(--ink);margin:16px 0 6px}
.cform label .opt{font-weight:500;color:var(--slate);letter-spacing:0}
.cform input,.cform select,.cform textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;
 font-family:inherit;font-size:15px;color:var(--ink);background:#fff;transition:.15s;
 /* min-width:0 matters: a select takes its intrinsic width from its longest option,
    which pushed the document's scrollWidth past a 320px viewport. */
 min-width:0;max-width:100%;box-sizing:border-box;text-overflow:ellipsis}
.cform textarea{min-height:120px;resize:vertical;line-height:1.55}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:0;border-color:var(--indigo);box-shadow:0 0 0 3px rgba(63,59,242,.13)}
.cform .hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.cform button{margin-top:22px;width:100%;justify-content:center}
.cform .fine{font-size:12.5px;color:var(--slate);margin-top:14px;line-height:1.5}
.cform .err{display:none;background:#FFF1F6;border:1px solid #F3C9DC;color:#9B0B4C;border-radius:12px;padding:12px 14px;font-size:14px;margin-top:16px}
.cform.is-error .err{display:block}
.cdone{display:none;text-align:center;padding:34px 8px}
.cform.is-done .cdone{display:block}.cform.is-done .cbody{display:none}
.cdone .tick{width:56px;height:56px;border-radius:999px;background:var(--lilac);color:var(--indigo);display:grid;place-items:center;margin:0 auto 16px;font-size:26px;font-weight:800}
.cdone h3{font-size:22px}.cdone p{color:var(--slate);margin-top:10px;max-width:42ch;margin-left:auto;margin-right:auto}
.croute{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
@media(max-width:900px){.croute{grid-template-columns:1fr}}
.croute .r{border:1px solid var(--line);border-radius:16px;padding:24px;background:#fff}
.croute .r h3{font-size:17px}.croute .r p{font-size:14.5px;color:var(--slate);margin-top:8px}
.croute .r a{display:inline-block;margin-top:12px;color:var(--indigo);font-weight:700;font-size:14.5px}

/* ---- newsroom: article archive ---- */
.arts{display:grid;gap:16px;margin-top:32px}
.art{display:grid;grid-template-columns:132px 1fr auto;gap:24px;align-items:start;
 border:1px solid var(--line);border-radius:18px;padding:24px 26px;background:#fff;transition:.2s}
.art:hover{border-color:var(--peri);box-shadow:0 22px 44px -26px rgba(63,59,242,.32)}
@media(max-width:820px){.art{grid-template-columns:1fr;gap:10px}}
.art .when{font-size:12.5px;font-weight:700;color:var(--peri);letter-spacing:.02em;padding-top:3px}
.art h3{font-size:18px;margin-bottom:8px;line-height:1.28}
.art p{font-size:14.5px;color:var(--slate);line-height:1.6}
.art .q{margin-top:11px;padding-left:14px;border-left:2px solid var(--lilac);font-size:14px;
 color:var(--ink2);font-style:italic}
.art .go{white-space:nowrap;font-size:14px;font-weight:700;color:var(--indigo);padding-top:3px}
@media(max-width:820px){.art .go{padding-top:6px}}
.art .kind{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.12em;
 text-transform:uppercase;color:var(--indigo);background:var(--lilac2);border:1px solid var(--line);
 border-radius:999px;padding:3px 10px;margin-bottom:9px}

/* ---- Alexa+ for Senior Living: the two-way exchange ---- */
.xchg{margin-top:36px;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff}
.xchg .row2x{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch}
@media(max-width:860px){.xchg .row2x{grid-template-columns:1fr}}
.xchg .col{padding:28px 26px}
.xchg .col .who{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri)}
.xchg .col h3{font-size:18px;margin:9px 0 12px}
.xchg .col .it{padding:9px 0;border-top:1px solid var(--line);font-size:14.5px;color:var(--slate)}
.xchg .col .it:first-of-type{border-top:0}
.xchg .col .it b{color:var(--ink);font-weight:600}
/* The middle column of the exchange. It said "Both ways" in words with nothing pointing anywhere,
   which is why it read as a stray label (David, 2026-08-11). It now draws the two arrows. */
.xchg .arrows{display:grid;justify-items:center;align-content:center;gap:14px;padding:0 20px;
 background:linear-gradient(180deg,#0d0330,#1d054f);color:#9590ED;
 font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;text-align:center;line-height:1.6}
.xchg .arrows svg{width:26px;height:26px;fill:none;stroke:#b9b2ff;stroke-width:1.8;
 stroke-linecap:round;stroke-linejoin:round;display:block}
/* Stacked vertically on desktop the arrows read up/down, which is wrong for a left/right exchange,
   so they are rotated to match whichever axis the layout is actually using. */
@media(max-width:860px){.xchg .arrows{padding:16px 0;grid-auto-flow:column}
 .xchg .arrows svg{transform:rotate(90deg)}}
.xchg .foot2{padding:22px 26px;border-top:1px solid var(--line);background:var(--lilac2);font-size:14.5px;color:var(--slate)}
.privq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:32px}
@media(max-width:760px){.privq{grid-template-columns:1fr}}
.privq .p{border:1px solid var(--line);border-radius:16px;padding:22px 20px;background:#fff}
.privq .p b{display:block;font-size:15px;color:var(--ink);margin-bottom:7px}
.privq .p span{font-size:14px;color:var(--slate);line-height:1.55}

/* ---- LTC: the deferral arithmetic and the channels ---- */
.defer{margin-top:36px;border-radius:22px;overflow:hidden;border:1px solid rgba(160,140,255,.28);
 background:linear-gradient(165deg,#0b0128,#1d054f);color:#EDE9FB}
.defer .top{padding:32px 30px 26px}
.defer h3{color:#fff;font-size:21px}
.defer .top p{color:#b8abdf;font-size:15px;margin-top:10px;max-width:64ch}
.defer .maths{display:grid;grid-template-columns:1fr auto 1fr;gap:0;border-top:1px solid rgba(255,255,255,.1)}
@media(max-width:760px){.defer .maths{grid-template-columns:1fr}}
.defer .side{padding:26px 30px}
.defer .side .lab{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#9590ED}
.defer .side .fig{font-size:32px;font-weight:800;color:#fff;letter-spacing:-.02em;margin-top:8px;line-height:1.05}
.defer .side .sub{font-size:13.5px;color:#b8abdf;margin-top:8px;line-height:1.5}
.defer .vs{display:grid;place-items:center;padding:0 20px;color:#9590ED;font-weight:800;font-size:13px;
 letter-spacing:.12em;text-transform:uppercase;border-left:1px solid rgba(255,255,255,.1);
 border-right:1px solid rgba(255,255,255,.1)}
@media(max-width:760px){.defer .vs{border:0;border-top:1px solid rgba(255,255,255,.1);
  border-bottom:1px solid rgba(255,255,255,.1);padding:12px 0}}
.defer .foot{padding:22px 30px;border-top:1px solid rgba(255,255,255,.1);font-size:15px;color:#cfc4f2}
.chan{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:34px}
@media(max-width:820px){.chan{grid-template-columns:1fr}}
.chan .c{border:1px solid var(--line);border-radius:18px;padding:28px 26px;background:#fff;transition:.2s}
.chan .c:hover{border-color:var(--peri);box-shadow:0 24px 48px -26px rgba(63,59,242,.34);transform:translateY(-4px)}
.chan .c .who{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri)}
.chan .c h3{font-size:19px;margin:9px 0 9px}
.chan .c p{font-size:14.5px;color:var(--slate)}
.chan .c .win{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
 font-size:13.5px;font-weight:600;color:var(--indigo)}

/* ---- protect: the four stages ---- */
.stage4{display:grid;gap:18px;margin-top:36px}
.stage4 .st4{display:grid;grid-template-columns:96px 1fr;gap:24px;border:1px solid var(--line);
 border-radius:20px;padding:28px 26px;background:#fff;transition:.2s;align-items:start}
.stage4 .st4:hover{border-color:var(--peri);box-shadow:0 26px 50px -28px rgba(63,59,242,.34)}
@media(max-width:700px){.stage4 .st4{grid-template-columns:1fr;gap:14px}}
.stage4 .num{width:76px;height:76px;border-radius:20px;display:grid;place-items:center;
 background:linear-gradient(140deg,var(--indigo),var(--violet));color:#fff;font-size:12px;
 font-weight:800;letter-spacing:.1em;text-transform:uppercase;text-align:center;line-height:1.2}
.stage4 .st4:nth-child(3) .num{background:linear-gradient(140deg,#7358f5,#9590ED)}
.stage4 .st4:nth-child(4) .num{background:linear-gradient(140deg,#E20074,#ff5ba8)}
.stage4 h3{font-size:21px;margin-bottom:8px}
.stage4 .lead{font-size:15px;color:var(--slate);line-height:1.62}
.stage4 ul{margin:14px 0 0;padding-left:20px}
.stage4 li{font-size:14.5px;color:var(--slate);margin-bottom:7px;line-height:1.55}
.stage4 .note{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
 font-size:13.5px;color:var(--indigo);font-weight:600}
.assess{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:28px}
@media(max-width:900px){.assess{grid-template-columns:repeat(2,minmax(0,1fr))}}
.assess .t{border:1px solid rgba(160,140,255,.26);border-radius:14px;padding:16px 17px;
 background:linear-gradient(135deg,rgba(63,59,242,.11),rgba(137,91,245,.07))}
.assess .t b{display:block;font-size:14.5px;color:var(--ink)}
.assess .t span{display:block;font-size:12.5px;color:var(--slate);margin-top:5px;line-height:1.45}

/* ---- insights: multi-score panel and the ADL grid ---- */
.scores{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:430px){.scores{grid-template-columns:1fr}}
.scores .sc{background:rgba(255,255,255,.055);border:1px solid rgba(160,140,255,.24);border-radius:13px;padding:14px 15px}
.scores .sc .nm{font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#9590ED}
.scores .sc .vw{display:flex;align-items:baseline;gap:7px;margin-top:6px}
.scores .sc .v{font-size:25px;font-weight:800;color:#fff;letter-spacing:-.02em;line-height:1}
.scores .sc .d{font-size:11.5px;font-weight:700}
.scores .sc .d.up{color:#6ee7a8}.scores .sc .d.dn{color:#ff9ecb}.scores .sc .d.fl{color:#a99cd8}
.scores .sc .bar{height:5px;border-radius:99px;background:rgba(255,255,255,.12);margin-top:9px;overflow:hidden}
.scores .sc .bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--indigo),var(--violet))}
.scores .sc.alert .bar i{background:linear-gradient(90deg,#E20074,#ff5ba8)}
.adl{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
@media(max-width:900px){.adl{grid-template-columns:1fr 1fr}}@media(max-width:600px){.adl{grid-template-columns:1fr}}
.adl .a{border:1px solid var(--line);border-radius:18px;padding:24px 22px;background:#fff;transition:.2s}
.adl .a:hover{border-color:var(--peri);box-shadow:0 24px 46px -26px rgba(63,59,242,.36);transform:translateY(-4px)}
.adl .a .rm{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri)}
.adl .a h3{font-size:17px;margin:8px 0 8px}
.adl .a p{font-size:14.5px;color:var(--slate)}
.adl .a .sig{margin-top:12px;padding-top:11px;border-top:1px solid var(--line);font-size:13px;color:var(--indigo);font-weight:600}

/* ---- check-in: the two bookends, and the night timeline ---- */
.book{display:grid;grid-template-columns:1fr auto 1fr;gap:0;margin-top:36px;align-items:stretch}
@media(max-width:820px){.book{grid-template-columns:1fr}}
.book .end{border:1px solid var(--line);border-radius:20px;padding:28px 26px;background:#fff}
.book .end .lab{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--peri)}
.book .end h3{font-size:19px;margin:9px 0 8px}
.book .end p{font-size:14.5px;color:var(--slate)}
.book .end .q{margin-top:14px;padding-top:13px;border-top:1px solid var(--line);font-size:14.5px;font-weight:600;color:var(--indigo)}
.book .mid{display:grid;place-items:center;padding:0 22px;color:var(--peri);font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
@media(max-width:820px){.book .mid{padding:16px 0}}
.night{margin-top:34px;border:1px solid rgba(160,140,255,.26);border-radius:20px;background:linear-gradient(180deg,#0b0128,#170540);padding:30px 28px;color:#EDE9FB}
.night h3{color:#fff;font-size:19px}
.night .sub{color:#b8abdf;font-size:14.5px;margin-top:8px;max-width:62ch}
.night .tl{margin-top:24px}
.night .ev{display:grid;grid-template-columns:88px 1fr;gap:16px;padding:12px 0;border-top:1px solid rgba(255,255,255,.09);align-items:start}
.night .ev:first-child{border-top:0}
.night .ev b{color:#fff;font-variant-numeric:tabular-nums;font-size:14.5px}
.night .ev span{color:#b8abdf;font-size:14.5px;line-height:1.5}
.night .ev.flag{background:rgba(226,0,116,.12);border-radius:10px;padding:13px 12px;margin:5px -12px}
.night .ev.flag b,.night .ev.flag span{color:#fff}
.night .out{margin-top:20px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:15px;color:#cfc4f2}
.sig{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}
@media(max-width:900px){.sig{grid-template-columns:1fr 1fr}}@media(max-width:600px){.sig{grid-template-columns:1fr}}
.sig .s{border:1px solid var(--line);border-radius:16px;padding:22px 20px;background:#fff;transition:.2s}
.sig .s:hover{border-color:var(--peri);box-shadow:0 22px 44px -26px rgba(63,59,242,.38);transform:translateY(-4px)}
.sig .s h3{font-size:16px;margin-bottom:8px}
.sig .s p{font-size:14px;color:var(--slate)}
.cite{margin-top:26px;font-size:13px;color:var(--slate);line-height:1.65;border-left:2px solid var(--line);padding-left:16px}
.cite a{color:var(--indigo)}

/* ---- developers: endpoint groups, transports, code ---- */
.apigrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px}
@media(max-width:1000px){.apigrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.apigrid{grid-template-columns:1fr 1fr}}
.apigrid .g{border:1px solid var(--line);border-radius:13px;padding:14px 15px;background:#fff;transition:.18s}
.apigrid .g:hover{border-color:var(--indigo);transform:translateY(-3px)}
.apigrid .g b{display:block;font-size:14.5px;color:var(--ink);font-weight:700}
.apigrid .g span{display:block;font-size:12px;color:var(--peri);font-weight:700;margin-top:4px;letter-spacing:.05em}
.tports{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:34px}
@media(max-width:860px){.tports{grid-template-columns:1fr}}
.tport{border:1px solid var(--line);border-radius:18px;padding:26px 24px;background:#fff}
.tport .th{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.tport .th .ic{width:36px;height:36px;border-radius:10px;background:var(--lilac);color:var(--indigo);display:grid;place-items:center;font-size:13px;font-weight:800;flex:0 0 auto}
.tport h3{font-size:17px}
.tport p{font-size:14.5px;color:var(--slate)}
.tport .meta{margin-top:13px;padding-top:12px;border-top:1px solid var(--line);font-size:13px;color:var(--slate)}
.tport .meta b{color:var(--ink)}
pre.code{background:#0d0330;color:#d8cff5;border:1px solid rgba(160,140,255,.26);border-radius:14px;
 padding:18px 20px;overflow-x:auto;font-size:13px;line-height:1.65;margin-top:20px;
 font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 /* overflow-x:auto alone does not save you: a grid or flex parent floors at the child's
    min-content width, so the code block pushed the whole PAGE sideways by 256px at 360px
    even though the block itself was set to scroll. min-width:0 is what actually lets it shrink. */
 min-width:0;max-width:100%}
pre.code .k{color:#9590ED}pre.code .s{color:#8ee6b8}pre.code .c{color:#7d729f}
.envs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:26px}
@media(max-width:760px){.envs{grid-template-columns:1fr}}
.envs .e{border:1px solid rgba(160,140,255,.26);border-radius:14px;padding:16px 18px;background:linear-gradient(135deg,rgba(63,59,242,.12),rgba(137,91,245,.08))}
.envs .e b{display:block;color:#fff;font-size:14px}
.envs .e code{display:block;margin-top:6px;font-size:12.5px;color:#b3a6db;font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all}

/* ---- energy: load shaping diagram and control surfaces ---- */
.shape{margin-top:36px;border:1px solid rgba(160,140,255,.26);border-radius:20px;background:linear-gradient(180deg,#0d0330,#170540);padding:30px 28px;color:#EDE9FB}
.shape h3{color:#fff;font-size:19px}
.shape .lead{color:#b8abdf;font-size:14.5px;margin-top:8px;max-width:62ch}
.shape .bars{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;align-items:end;margin-top:26px;height:150px}
.shape .b{border-radius:8px 8px 4px 4px;position:relative;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;font-size:10.5px;font-weight:700;color:#fff}
.shape .b.h1{background:linear-gradient(180deg,rgba(63,59,242,.85),rgba(63,59,242,.4))}
.shape .b.h2{background:linear-gradient(180deg,rgba(137,91,245,.85),rgba(137,91,245,.4))}
.shape .cap{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
@media(max-width:760px){.shape .cap{grid-template-columns:1fr}}
.shape .cap div{border-top:2px solid rgba(160,140,255,.4);padding-top:13px}
.shape .cap b{display:block;color:#fff;font-size:15px}
.shape .cap span{display:block;color:#b8abdf;font-size:13.5px;margin-top:5px;line-height:1.5}
.ctrls{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
@media(max-width:1000px){.ctrls{grid-template-columns:1fr 1fr}}@media(max-width:560px){.ctrls{grid-template-columns:1fr}}
.ctrls .c{border:1px solid var(--line);border-radius:16px;padding:22px 20px;background:#fff;transition:.2s}
.ctrls .c:hover{border-color:var(--peri);box-shadow:0 22px 44px -26px rgba(63,59,242,.38);transform:translateY(-4px)}
.ctrls .c h3{font-size:16px;margin-bottom:8px}
.ctrls .c p{font-size:14px;color:var(--slate)}

/* ---- security: signal reuse table and roadmap comparison ---- */
.reuse{display:grid;grid-template-columns:1fr auto 1fr;gap:0;margin-top:36px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
@media(max-width:860px){.reuse{grid-template-columns:1fr}}
.reuse .col{padding:26px 24px}
.reuse .col.mid{background:linear-gradient(170deg,#0b0128,#1d054f);color:#fff;display:flex;flex-direction:column;justify-content:center;min-width:210px}
@media(max-width:860px){.reuse .col.mid{min-width:0}}
.reuse .col h3{font-size:16px;margin-bottom:14px}
.reuse .col.mid h3{color:#fff}
.reuse .col.mid p{color:#c9c0e8;font-size:13.5px;line-height:1.55}
.reuse .col .r{padding:9px 0;border-top:1px solid var(--line);font-size:14px;color:var(--slate)}
.reuse .col .r:first-of-type{border-top:0}
.reuse .col .r b{color:var(--ink);font-weight:600}
.rmap{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:34px}
@media(max-width:820px){.rmap{grid-template-columns:1fr}}
.rmap .o{border-radius:18px;padding:28px 24px}
.rmap .alone{background:#fff;border:1px solid var(--line)}
.rmap .withus{background:linear-gradient(165deg,#12043a,#1d054f);color:#fff;border:1px solid rgba(137,91,245,.4)}
.rmap .o h3{font-size:18px;margin-bottom:6px}
.rmap .withus h3{color:#fff}
.rmap .o .yrs{font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--peri)}
.rmap .o ul{margin:14px 0 0;padding-left:20px}
.rmap .o li{font-size:14.5px;color:var(--slate);margin-bottom:8px;line-height:1.55}
.rmap .withus li{color:#c9c0e8}

/* ---- the five pillars, given room ---- */
.pill{margin-top:38px;display:grid;gap:20px}
.pill .pr{display:grid;grid-template-columns:64px 1fr 1fr;gap:26px;align-items:start;
 border:1px solid var(--line);border-radius:20px;padding:28px 26px;background:#fff;transition:.2s}
.pill .pr:hover{border-color:var(--peri);box-shadow:0 26px 52px -28px rgba(63,59,242,.35)}
@media(max-width:900px){.pill .pr{grid-template-columns:52px 1fr;gap:18px}.pill .pr .why{grid-column:2}}
.pill .pn{width:56px;height:56px;border-radius:16px;background:linear-gradient(140deg,var(--indigo),var(--violet));
 color:#fff;display:grid;place-items:center;font-size:15px;font-weight:800}
.pill .pr h3{font-size:20px;margin-bottom:8px}
.pill .pr .lead{font-size:14.5px;color:var(--slate);line-height:1.6}
.pill .pr .sig{margin-top:14px;display:flex;flex-wrap:wrap;gap:7px}
.pill .pr .sig span{font-size:12px;font-weight:600;color:var(--indigo);background:var(--lilac2);
 border:1px solid var(--line);border-radius:999px;padding:5px 11px}
.pill .pr .why{border-left:2px solid var(--lilac);padding-left:20px}
.pill .pr .why b{display:block;font-size:12px;font-weight:800;letter-spacing:.12em;
 text-transform:uppercase;color:var(--peri);margin-bottom:7px}
.pill .pr .why p{font-size:14.5px;color:var(--slate);line-height:1.6}
@media(max-width:900px){.pill .pr .why{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:14px;margin-top:14px}}

.hier{margin-top:36px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
.hier .lvl{display:grid;grid-template-columns:190px 1fr;gap:0;border-top:1px solid var(--line)}
.hier .lvl:first-child{border-top:0}
.hier .lvl .nm{padding:18px 22px;font-weight:700;font-size:15px;color:#fff;display:flex;align-items:center;gap:10px}
.hier .lvl .ds{padding:18px 22px;font-size:14.5px;color:var(--slate);background:#fff}
.hier .l1 .nm{background:linear-gradient(135deg,#0b0128,#1d054f)}
.hier .l2 .nm{background:linear-gradient(135deg,#1d054f,#2d0a6b)}
.hier .l3 .nm{background:linear-gradient(135deg,#3F3BF2,#5a4df5)}
.hier .l4 .nm{background:linear-gradient(135deg,#7358f5,#895BF5)}
.hier .l5 .nm{background:linear-gradient(135deg,#9590ED,#a9a4f2)}
@media(max-width:640px){.hier .lvl{grid-template-columns:1fr}.hier .lvl .nm{padding-bottom:6px}}
.mfstack{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
@media(max-width:960px){.mfstack{grid-template-columns:1fr 1fr}}@media(max-width:600px){.mfstack{grid-template-columns:1fr}}
.mfstack .c{border:1px solid var(--line);border-radius:18px;padding:26px 22px;background:#fff;transition:.2s}
.mfstack .c:hover{border-color:var(--peri);box-shadow:0 26px 50px -26px rgba(63,59,242,.4);transform:translateY(-4px)}
.mfstack .c .ic{width:42px;height:42px;border-radius:12px;background:var(--lilac);color:var(--indigo);display:grid;place-items:center;margin-bottom:14px}
.mfstack .c .ic svg{width:21px;height:21px}
.mfstack .c h3{font-size:17px;margin-bottom:8px}
.mfstack .c p{font-size:14.5px;color:var(--slate)}
.mfstack .c .adds{margin-top:12px;padding-top:11px;border-top:1px solid var(--line);font-size:13px;color:var(--indigo);font-weight:600}
.valrow{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:36px}
@media(max-width:860px){.valrow{grid-template-columns:1fr}}
.valrow .v{border-top:3px solid var(--indigo);padding-top:18px}
.valrow .v b{display:block;font-size:19px;color:var(--ink);letter-spacing:-.01em}
.valrow .v span{display:block;font-size:14.5px;color:var(--slate);margin-top:9px;line-height:1.6}

/* ---- senior living: offer ladder + tier comparison ---- */
.ladder{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:38px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
@media(max-width:1000px){.ladder{grid-template-columns:1fr 1fr}}@media(max-width:620px){.ladder{grid-template-columns:1fr}}
.ladder .st{padding:28px 24px;border-left:1px solid var(--line);display:flex;flex-direction:column;transition:.2s}
.ladder .st:first-child{border-left:0}
@media(max-width:1000px){.ladder .st:nth-child(3){border-left:0}}
@media(max-width:620px){.ladder .st{border-left:0;border-top:1px solid var(--line)}.ladder .st:first-child{border-top:0}}
.ladder .st:hover{background:var(--lilac2)}
.ladder .st .step{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--peri)}
.ladder .st h3{font-size:19px;margin:9px 0 4px}
.ladder .st .role{font-size:13px;font-weight:700;color:var(--indigo);margin-bottom:10px}
.ladder .st p{font-size:14.5px;color:var(--slate);flex:1}
.ladder .st .go{margin-top:16px;font-size:14px;font-weight:700;color:var(--indigo)}
.ladder .st.top{background:linear-gradient(170deg,#12043a,#1d054f);color:#fff}
.ladder .st.top h3{color:#fff}.ladder .st.top p{color:#c9c0e8}.ladder .st.top .role{color:var(--peri)}
.ladder .st.top:hover{background:linear-gradient(170deg,#170549,#24086a)}
.matrix-wrap{margin-top:34px;overflow-x:auto;border:1px solid var(--line);border-radius:18px}
table.matrix{width:100%;border-collapse:collapse;min-width:700px;font-size:14.5px}
table.matrix th,table.matrix td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--line)}
table.matrix thead th{background:var(--lilac2);color:var(--ink);font-weight:800;font-size:15px}
table.matrix tbody th{font-weight:600;color:var(--ink2)}
table.matrix td{text-align:center;color:var(--slate)}
table.matrix .yes{color:var(--indigo);font-weight:800;font-size:16px}
table.matrix .no{color:#c9c2dc}
table.matrix tr:last-child td,table.matrix tr:last-child th{border-bottom:0}
.frag{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
@media(max-width:900px){.frag{grid-template-columns:1fr}}
.frag .f{border-radius:16px;padding:24px 22px;background:#fff;border:1px solid var(--line)}
.frag .f .hd{font-size:15px;font-weight:800;color:var(--ink);margin-bottom:12px}
.frag .f ul{margin:0;padding-left:20px}
.frag .f li{font-size:14px;color:var(--slate);margin-bottom:7px;line-height:1.5}

/* ---- short inline capture form ---- */
.qform{background:radial-gradient(700px 420px at 82% 8%,rgba(137,91,245,.42),transparent 62%),linear-gradient(160deg,#0b0128,#170438);color:#fff;border-radius:24px;padding:44px 40px;margin-top:0}
@media(max-width:700px){.qform{padding:32px 24px;border-radius:20px}}
.qform .qgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
@media(max-width:900px){.qform .qgrid{grid-template-columns:1fr;gap:28px}}
.qform h2{color:#fff;max-width:24ch}
.qform .qlede{color:#cabfe9;margin-top:14px;max-width:46ch;font-size:16.5px}
.qform .qwhy{margin-top:20px;padding-left:0;list-style:none}
.qform .qwhy li{color:#c9c0e8;font-size:14.5px;padding:5px 0 5px 26px;position:relative}
.qform .qwhy li::before{content:"";position:absolute;left:0;top:13px;width:11px;height:11px;border-radius:50%;border:2px solid var(--peri)}
.qf{display:grid;gap:12px}
.qf .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.qf .row{grid-template-columns:1fr}}
.qf input,.qf textarea{width:100%;padding:13px 15px;border-radius:12px;border:1px solid rgba(160,140,255,.34);
 background:rgba(255,255,255,.07);color:#fff;font-family:inherit;font-size:15px;transition:.15s}
.qf textarea{min-height:84px;resize:vertical;line-height:1.5}
.qf input::placeholder,.qf textarea::placeholder{color:#a99cd8}
.qf input:focus,.qf textarea:focus{outline:0;border-color:var(--peri);background:rgba(255,255,255,.11);box-shadow:0 0 0 3px rgba(137,91,245,.22)}
.cf-turnstile{max-width:100%;overflow-x:auto}
.qf .hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.qf button{margin-top:4px;justify-content:center;width:100%}
.qf .fine{font-size:12px;color:#a99cd8;line-height:1.5}
.qf .fine a{color:var(--peri);text-decoration:underline}
.qf .err{display:none;background:rgba(226,0,116,.16);border:1px solid rgba(226,0,116,.5);color:#ffd7ec;border-radius:12px;padding:11px 14px;font-size:14px}
.qform.is-error .qf .err{display:block}
.qdone{display:none;text-align:center;padding:18px 4px}
.qform.is-done .qdone{display:block}.qform.is-done .qf{display:none}
.qdone .tick{width:52px;height:52px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);color:#fff;display:grid;place-items:center;margin:0 auto 14px;font-size:24px;font-weight:800}
.qdone h3{color:#fff;font-size:20px}.qdone p{color:#cabfe9;margin-top:9px;font-size:15px}

/* ---- home health: the agency program flow ---- */
.hhflow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:36px;
 border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
@media(max-width:820px){.hhflow{grid-template-columns:1fr}}
.hhflow .fs{padding:30px 26px;border-left:1px solid var(--line);position:relative}
.hhflow .fs:first-child{border-left:0}
@media(max-width:820px){.hhflow .fs{border-left:0;border-top:1px solid var(--line)}
  .hhflow .fs:first-child{border-top:0}}
.hhflow .fs .n{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
 background:linear-gradient(140deg,var(--indigo),var(--violet));color:#fff;font-weight:800;font-size:14px}
.hhflow .fs h3{font-size:18px;margin:14px 0 8px}
.hhflow .fs p{font-size:14.5px;color:var(--slate)}
.hhflow .fs .then{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);
 font-size:13.5px;font-weight:600;color:var(--indigo)}
.staffgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:32px}
@media(max-width:820px){.staffgrid{grid-template-columns:1fr}}
.staffgrid .sg{border-radius:18px;padding:26px 24px}
.staffgrid .before{background:#fff;border:1px solid var(--line)}
.staffgrid .after{background:linear-gradient(165deg,#12043a,#1d054f);color:#fff;border:1px solid rgba(137,91,245,.4)}
.staffgrid .sg h3{font-size:17px;margin-bottom:12px}
.staffgrid .after h3{color:#fff}
.staffgrid .sg ul{margin:0;padding-left:20px}
.staffgrid .sg li{font-size:14.5px;color:var(--slate);margin-bottom:8px;line-height:1.55}
.staffgrid .after li{color:#c9c0e8}

.dim{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:38px}
@media(max-width:1000px){.dim{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.dim{grid-template-columns:1fr}}
.dim .d{border:1px solid var(--line);border-radius:16px;padding:22px 20px;background:#fff;transition:.2s}
.dim .d:hover{border-color:var(--peri);box-shadow:0 22px 44px -26px rgba(63,59,242,.4);transform:translateY(-4px)}
.dim .d .n{font-size:11.5px;font-weight:800;letter-spacing:.13em;color:var(--peri)}
.dim .d h3{font-size:17px;margin:8px 0 7px}
.dim .d p{font-size:14px;color:var(--slate)}
.loop{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:40px;counter-reset:l}
@media(max-width:960px){.loop{grid-template-columns:1fr}}
.loop .st{counter-increment:l;position:relative;padding:26px 22px;border:1px solid var(--line);background:#fff}
.loop .st:first-child{border-radius:18px 0 0 18px}.loop .st:last-child{border-radius:0 18px 18px 0}
.loop .st+.st{border-left:0}
@media(max-width:960px){.loop .st,.loop .st:first-child,.loop .st:last-child{border-radius:14px}.loop .st+.st{border-left:1px solid var(--line);margin-top:10px}}
.loop .st::before{content:"0" counter(l);font-size:11.5px;font-weight:800;letter-spacing:.12em;color:var(--peri)}
.loop .st h3{font-size:16px;margin:9px 0 8px}
.loop .st p{font-size:13.5px;color:var(--slate);line-height:1.5}
.fuse{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:32px}
@media(max-width:900px){.fuse{grid-template-columns:1fr 1fr}}@media(max-width:560px){.fuse{grid-template-columns:1fr}}
.fuse .f{border:1px solid rgba(160,140,255,.26);border-radius:14px;padding:16px 18px;background:linear-gradient(135deg,rgba(63,59,242,.13),rgba(137,91,245,.09))}
.fuse .f b{display:block;color:#fff;font-size:15px}
.fuse .f span{display:block;font-size:12.5px;color:#b3a6db;margin-top:4px;line-height:1.45}
.bigclaim{margin-top:40px;border-radius:22px;padding:44px 40px;background:radial-gradient(700px 380px at 84% 8%,rgba(137,91,245,.5),transparent 62%),linear-gradient(160deg,#0b0128,#170438);color:#fff}
.bigclaim h2{color:#fff;max-width:22ch}
.bigclaim p{color:#cabfe9;max-width:60ch;margin-top:16px;font-size:16.5px}
.bigclaim .two{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:32px}
@media(max-width:760px){.bigclaim .two{grid-template-columns:1fr}}
.bigclaim .two div{border-top:2px solid rgba(160,140,255,.4);padding-top:16px}
.bigclaim .two b{display:block;font-size:19px;color:#fff;letter-spacing:-.01em}
.bigclaim .two span{display:block;font-size:14px;color:#b8abdf;margin-top:7px;line-height:1.55}

.oemstack{display:grid;gap:10px}
.oeml{border:1px solid rgba(160,140,255,.26);border-radius:14px;padding:15px 17px;background:linear-gradient(135deg,rgba(63,59,242,.16),rgba(137,91,245,.10))}
.oeml .lt{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#9590ED}
.oeml .lv{font-size:15.5px;font-weight:700;color:#fff;margin-top:5px}
.oeml .ld{font-size:12.5px;color:#b3a6db;margin-top:4px;line-height:1.45}
.oeml.you{background:linear-gradient(135deg,rgba(226,0,116,.14),rgba(137,91,245,.12));border-color:rgba(226,0,116,.3)}
.ctrlgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
@media(max-width:1000px){.ctrlgrid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.ctrlgrid{grid-template-columns:1fr}}
.ctrl{border:1px solid var(--line);border-radius:18px;padding:26px 22px;background:#fff;display:flex;flex-direction:column}
.ctrl h3{font-size:17px;margin-bottom:12px}
.ctrl ol{margin:0;padding:0;list-style:none;counter-reset:c}
.ctrl ol li{counter-increment:c;position:relative;padding:9px 0 9px 30px;font-size:14.5px;color:var(--slate);border-bottom:1px solid var(--line)}
.ctrl ol li:last-child{border-bottom:0}
.ctrl ol li::before{content:counter(c);position:absolute;left:0;top:9px;width:20px;height:20px;border-radius:6px;background:var(--lilac);color:var(--indigo);font-size:11px;font-weight:800;display:grid;place-items:center}
.ctrl ol li:last-child{color:var(--ink);font-weight:600}
.sigdom{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:36px}
@media(max-width:1100px){.sigdom{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){.sigdom{grid-template-columns:1fr}}
.sigdom .d{border:1px solid var(--line);border-radius:16px;padding:22px 18px;background:#fff}
.sigdom .d h3{font-size:16px;margin-bottom:10px}
.sigdom .d span{display:block;font-size:13.5px;color:var(--slate);padding:5px 0;border-top:1px solid var(--line)}
.sigdom .d span:first-of-type{border-top:0}
.tl{margin-top:34px;border:1px solid rgba(160,140,255,.24);border-radius:20px;background:linear-gradient(180deg,#0d0330,#12043a);padding:30px;color:#EDE9FB}
.tl h3{color:#fff;font-size:19px}
.tlrow{display:grid;grid-template-columns:130px 1fr;gap:14px;align-items:start;padding:11px 0;border-top:1px solid rgba(255,255,255,.09);font-size:14.5px}
.tlrow:first-of-type{border-top:0}
.tlrow b{color:#fff;font-variant-numeric:tabular-nums}
.tlrow span{color:#b8abdf}
.tlrow.hit{background:rgba(226,0,116,.12);border-radius:10px;padding:12px;margin:6px -12px}
.tlrow.hit b,.tlrow.hit span{color:#fff}
.tlnote{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:14.5px;color:#cfc4f2}
.askgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
@media(max-width:820px){.askgrid{grid-template-columns:1fr}}
.ask .q{font-size:clamp(26px,3.6vw,38px);font-weight:800;letter-spacing:-.03em;color:var(--indigo);line-height:1}
.ask h3{font-size:16px;margin:14px 0 10px}
.ask span{display:block;font-size:14px;color:var(--slate);padding:4px 0}