@font-face{font-family:"Urbanist";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/urbanist-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* ==========================================================================
   Vanilla Cloud Plus: site styles
   Brand: navy #0B1430 · green #74C22D · lime #92D63C · spark #B8EB4F
          emerald #1E9C6B · ice #A9C2EE · Urbanist (display + text)
   ========================================================================== */

:root{
  --ink-0:#050914; --ink-1:#070C1F; --ink-2:#0B1430; --ink-3:#111D40; --ink-4:#1A2A57;
  --pearl:#F5F7FB; --pearl-2:#EBEFF7; --white:#FFFFFF;
  --green:#74C22D; --lime:#92D63C; --spark:#B8EB4F; --emerald:#1E9C6B; --ice:#A9C2EE;
  --amber:#F4B740; --rose:#F2768B;

  --t-hi:#F2F6FD; --t-mid:#A7B4D3; --t-lo:#7383A9;
  --d-hi:#0B1430; --d-mid:#46557A; --d-lo:#5B6889;

  --line-d:rgba(169,194,238,.14); --line-d2:rgba(169,194,238,.24);
  --line-l:rgba(11,20,48,.09); --line-l2:rgba(11,20,48,.16);

  --grad-brand:linear-gradient(100deg,#C6F25A 0%,#7AD634 45%,#2DBB86 100%);
  --grad-btn:linear-gradient(180deg,#9BDE45 0%,#74C22D 100%);

  --f-display:"Urbanist",system-ui,sans-serif;
  --f-text:"Urbanist",system-ui,-apple-system,"Segoe UI",sans-serif;

  --fs-xs:clamp(.75rem,.72rem + .15vw,.8125rem);
  --fs-sm:clamp(.875rem,.85rem + .15vw,.9375rem);
  --fs-md:clamp(1rem,.97rem + .2vw,1.0625rem);
  --fs-lg:clamp(1.125rem,1.05rem + .4vw,1.3125rem);
  --fs-xl:clamp(1.375rem,1.2rem + .9vw,1.875rem);
  --fs-2xl:clamp(1.875rem,1.4rem + 2vw,3rem);
  --fs-3xl:clamp(2.375rem,1.6rem + 3.4vw,4.5rem);
  --fs-hero:clamp(2.75rem,1.6rem + 5vw,5.75rem);

  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px; --r-pill:999px;
  --wrap:1200px; --gutter:clamp(20px,4vw,48px);
  --sec:clamp(84px,9vw,140px);
  --ease:cubic-bezier(.22,.9,.3,1);
  --shadow-l:0 1px 2px rgba(11,20,48,.04),0 8px 24px -8px rgba(11,20,48,.10),0 24px 60px -24px rgba(11,20,48,.14);
  --shadow-d:0 1px 0 rgba(255,255,255,.04) inset,0 20px 60px -20px rgba(0,0,0,.6);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:var(--f-text);font-size:var(--fs-md);font-weight:500;line-height:1.6;color:var(--t-hi);background:var(--ink-1);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg,video{display:block;max-width:100%}
img,video{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:600;line-height:1.08;letter-spacing:-.025em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--spark);outline-offset:3px;border-radius:6px}
::selection{background:rgba(146,214,60,.35);color:#fff}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:200;padding:10px 16px;border-radius:10px;background:var(--lime);color:var(--ink-2);font-weight:600}
.skip:focus{top:12px}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.sec{position:relative;padding:var(--sec) 0}
.sec.tight{padding:calc(var(--sec)*.6) 0}
.light{background:var(--pearl);color:var(--d-hi)}
.light .muted,.light .lede{color:var(--d-mid)}
.white{background:#fff;color:var(--d-hi)}
.white .lede{color:var(--d-mid)}

/* ---------- type helpers ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-display);font-size:var(--fs-xs);font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--lime)}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--grad-brand)}
.light .eyebrow,.white .eyebrow{color:var(--emerald)}
.h-display{font-size:var(--fs-hero);font-weight:600;letter-spacing:-.04em;line-height:1}
.h-1{font-size:var(--fs-3xl);font-weight:600;letter-spacing:-.035em}
.h-2{font-size:var(--fs-2xl);letter-spacing:-.025em}
.h-3{font-size:var(--fs-xl);letter-spacing:-.015em;line-height:1.15}
.lede{font-size:var(--fs-lg);font-weight:400;line-height:1.55;color:var(--t-mid);max-width:62ch}
.muted{color:var(--t-mid)}
.grad{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-head{display:grid;gap:18px;max-width:760px;margin-bottom:clamp(40px,5vw,64px)}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center;justify-items:center}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:600;font-size:15px;letter-spacing:.01em;white-space:nowrap;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s,color .3s,border-color .3s}
.btn svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-primary{color:var(--ink-2);background:var(--grad-btn);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 10px 30px -10px rgba(116,194,45,.8)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 16px 40px -12px rgba(146,214,60,.95)}
.btn-ghost{color:var(--t-hi);border:1px solid var(--line-d2);background:rgba(255,255,255,.03);backdrop-filter:blur(8px)}
.btn-ghost:hover{border-color:rgba(169,194,238,.5);background:rgba(255,255,255,.07)}
.light .btn-ghost,.white .btn-ghost{color:var(--d-hi);border-color:var(--line-l2);background:#fff}
.light .btn-ghost:hover,.white .btn-ghost:hover{border-color:var(--d-hi)}
.btn-sm{min-height:42px;padding:0 18px;font-size:14px}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-display);font-weight:600;color:var(--lime)}
.link-arrow svg{width:16px;height:16px;transition:transform .3s var(--ease)}
.link-arrow:hover svg{transform:translateX(4px)}
.light .link-arrow,.white .link-arrow{color:var(--emerald)}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:100;transition:background .4s,box-shadow .4s,backdrop-filter .4s}
.hdr-in{display:flex;align-items:center;gap:28px;height:76px}
.hdr.is-scrolled{background:rgba(7,12,31,.72);backdrop-filter:saturate(160%) blur(18px);-webkit-backdrop-filter:saturate(160%) blur(18px);box-shadow:0 1px 0 var(--line-d)}
.brand{display:flex;align-items:center;flex-shrink:0}
.brand img{height:38px;width:auto}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{position:relative;padding:9px 14px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:700;font-size:15px;color:var(--t-mid);transition:color .25s,background .25s}
.nav a:hover{color:var(--t-hi);background:rgba(255,255,255,.05)}
.nav a[aria-current="page"]{color:var(--t-hi)}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:3px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--lime)}
.hdr-cta{display:flex;align-items:center;gap:14px}
.hdr-tel{font-family:var(--f-display);font-weight:600;font-size:14px;color:var(--t-mid)}
.hdr-tel:hover{color:var(--t-hi)}
.burger{display:none;width:44px;height:44px;margin-left:auto;border-radius:12px;border:1px solid var(--line-d2);align-items:center;justify-content:center}
.burger span{position:relative;width:18px;height:2px;border-radius:2px;background:currentColor;transition:background .2s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;border-radius:2px;background:currentColor;transition:transform .3s var(--ease)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.menu-open .burger span{background:transparent}
.menu-open .burger span::before{transform:translateY(6px) rotate(45deg)}
.menu-open .burger span::after{transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:99;padding:100px var(--gutter) 40px;background:rgba(5,9,20,.97);backdrop-filter:blur(14px);display:flex;flex-direction:column;gap:6px;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s .35s}
.menu-open .drawer{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
.drawer a{font-family:var(--f-display);font-weight:600;font-size:30px;padding:10px 0;border-bottom:1px solid var(--line-d);color:var(--t-hi)}
.drawer .btn{margin-top:24px;font-size:17px;color:var(--ink-2);border-bottom:0}
.drawer .drawer-tel{border:0;font-size:16px;color:var(--t-mid);margin-top:8px}
@media (max-width:960px){.nav,.hdr-tel,.hdr-cta .btn{display:none}.burger{display:inline-flex}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:min(100svh,980px);padding:150px 0 90px;overflow:hidden;isolation:isolate;background:radial-gradient(90% 70% at 70% 15%,#1A2C63 0%,transparent 60%),radial-gradient(70% 60% at 10% 100%,rgba(30,156,107,.20) 0%,transparent 60%),var(--ink-1)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(169,194,238,.10) 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(60% 60% at 65% 40%,#000,transparent 75%);-webkit-mask-image:radial-gradient(60% 60% at 65% 40%,#000,transparent 75%)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,64px);align-items:center}
.hero-copy{display:grid;gap:26px;max-width:640px}
.pill{display:inline-flex;align-items:center;gap:10px;justify-self:start;padding:7px 14px 7px 8px;border-radius:var(--r-pill);border:1px solid var(--line-d2);background:rgba(255,255,255,.04);font-family:var(--f-display);font-weight:700;font-size:13px;color:var(--t-mid)}
.pill b{padding:3px 9px;border-radius:var(--r-pill);background:var(--grad-brand);color:var(--ink-2);font-weight:700;font-size:11px;letter-spacing:.08em}
.hero h1 .grad{display:inline-block;padding-bottom:.06em}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.hero-ticks{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:8px;font-size:var(--fs-sm);color:var(--t-mid)}
.hero-ticks li{display:flex;align-items:center;gap:8px}
.hero-ticks svg{width:16px;height:16px;color:var(--lime)}

/* hero stage */
.stage{position:relative;aspect-ratio:1/1.08;width:100%;max-width:580px;justify-self:center}
.stage-orb{position:absolute;left:50%;top:52%;width:78%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 50% 40%,rgba(146,214,60,.28),rgba(30,156,107,.10) 45%,transparent 70%)}
.stage-ring{position:absolute;left:50%;top:52%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(169,194,238,.16);transform:translate(-50%,-50%)}
.stage-ring.r1{width:62%}.stage-ring.r2{width:86%;border-style:dashed;border-color:rgba(169,194,238,.10);animation:spin 80s linear infinite}
.stage-ring.r3{width:110%;border-color:rgba(169,194,238,.06)}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.stage-bot{position:absolute;left:50%;bottom:3%;width:84%;transform:translateX(-50%);filter:drop-shadow(0 40px 50px rgba(0,0,0,.5));animation:float 7s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-12px)}}
.stage-floor{position:absolute;left:50%;bottom:2%;width:52%;height:34px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(146,214,60,.45),transparent);filter:blur(6px)}

/* glass ui chips */
.glass{background:linear-gradient(180deg,rgba(26,42,87,.78),rgba(13,22,52,.78));border:1px solid var(--line-d2);border-radius:var(--r-md);box-shadow:var(--shadow-d);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.float-card{position:absolute;z-index:2;padding:14px 16px;font-size:13px;line-height:1.4;color:var(--t-hi)}
.float-card .k{font-family:var(--f-display);font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo)}
.fc-call{left:-8%;top:8%;width:236px;display:grid;gap:10px;animation:bob 6s ease-in-out infinite}
.fc-call .row{display:flex;align-items:center;gap:10px}
.fc-call .av{position:relative;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(146,214,60,.16);color:var(--spark)}
.fc-call .av svg{width:16px;height:16px}
.fc-call .av::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(146,214,60,.5);animation:ping 1.8s var(--ease) infinite}
@keyframes ping{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.35);opacity:0}}
.fc-call .who{font-weight:600;font-family:var(--f-display);font-size:14px}
.fc-call .sub{color:var(--t-mid);font-size:12px}
.wave{display:flex;align-items:center;gap:3px;height:26px}
.wave i{flex:1;max-width:4px;height:100%;border-radius:3px;background:var(--grad-brand);animation:wv 1.1s ease-in-out infinite;transform-origin:center}
@keyframes wv{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
.fc-sum{right:-8%;top:56%;width:250px;display:grid;gap:8px;animation:bob 7s ease-in-out -2s infinite}
.fc-sum p{color:var(--t-hi)}
.tag-row{display:flex;flex-wrap:wrap;gap:6px}
.tag{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:600;font-size:11px;background:rgba(169,194,238,.10);color:var(--ice)}
.tag.g{background:rgba(146,214,60,.14);color:var(--spark)}
.tag.a{background:rgba(244,183,64,.14);color:var(--amber)}
.tag.r{background:rgba(242,118,139,.14);color:var(--rose)}
.fc-xfer{left:-4%;bottom:12%;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;animation:bob 6.5s ease-in-out -4s infinite}
.fc-xfer .dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--emerald);color:#fff}
.fc-xfer .dot svg{width:14px;height:14px}
.fc-xfer b{font-family:var(--f-display);font-weight:600}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

@media (max-width:960px){
  .hero{padding:120px 0 70px;min-height:auto}
  .hero-grid{grid-template-columns:1fr}
  .stage{max-width:440px;margin-top:10px}
  .fc-call{left:0;top:6%;width:210px}
  .fc-sum{right:0;top:44%;width:210px}
  .fc-xfer{left:0;bottom:10%}
}
@media (max-width:560px){.fc-sum{display:none}.fc-call{width:200px;left:-2%;top:4%}.fc-xfer{left:auto;right:-2%;bottom:14%}.stage-bot{width:78%}}

/* ---------- logo / trust strip ---------- */
.strip{border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);background:var(--ink-0)}
.strip-in{display:flex;align-items:center;gap:clamp(18px,4vw,48px);padding:26px 0;flex-wrap:wrap;justify-content:space-between}
.strip-label{font-family:var(--f-display);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo);max-width:200px;line-height:1.5}
.strip-items{display:flex;align-items:center;gap:clamp(18px,3.4vw,44px);flex-wrap:wrap}
.strip-items span{font-family:var(--f-display);font-weight:600;font-size:clamp(15px,1.3vw,18px);color:var(--t-mid);opacity:.85;letter-spacing:-.01em}

/* ---------- bento ---------- */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.tile{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:14px;padding:clamp(22px,2.4vw,32px);border-radius:var(--r-lg);background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.tile:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(11,20,48,.04),0 18px 40px -14px rgba(11,20,48,.18)}
.tile h3{font-size:var(--fs-xl)}
.tile p{color:var(--d-mid);font-size:var(--fs-sm);line-height:1.6}
.tile .ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(160deg,#EAF7D9,#D6F0E4);color:var(--emerald)}
.tile .ic svg{width:22px;height:22px}
.tile.dark{background:linear-gradient(165deg,var(--ink-3),var(--ink-2));border-color:transparent;color:var(--t-hi)}
.tile.dark p{color:var(--t-mid)}
.tile.dark .ic{background:rgba(146,214,60,.12);color:var(--spark)}
.t-a{grid-column:span 4;grid-row:span 2}
.t-b,.t-c{grid-column:span 2}
.t-d,.t-e,.t-f{grid-column:span 2}
.tile .mock{margin-top:auto}
@media (max-width:1000px){.bento{grid-template-columns:repeat(2,1fr)}.t-a{grid-column:span 2;grid-row:auto}.t-b,.t-c,.t-d,.t-e,.t-f{grid-column:span 1}}
@media (max-width:640px){.bento{grid-template-columns:1fr}.t-a,.t-b,.t-c,.t-d,.t-e,.t-f{grid-column:auto}}

/* mock UI parts */
.mock{border-radius:var(--r-md);border:1px solid var(--line-l);background:var(--pearl);padding:14px;font-size:13px;color:var(--d-hi)}
.tile.dark .mock,.dark-mock{border-color:var(--line-d);background:rgba(5,9,20,.45);color:var(--t-hi)}
.chat{display:grid;gap:10px}
.bub{max-width:82%;padding:10px 13px;border-radius:14px;line-height:1.45;font-size:13px}
.bub.in{background:rgba(169,194,238,.12);border-bottom-left-radius:4px}
.bub.out{justify-self:end;background:linear-gradient(160deg,rgba(146,214,60,.22),rgba(30,156,107,.18));border-bottom-right-radius:4px}
.bub .who{display:block;margin-bottom:3px;font-family:var(--f-display);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--t-lo)}
.mock-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line-d);font-family:var(--f-display);font-weight:600;font-size:12px}
.light .mock-head,.tile:not(.dark) .mock-head{border-color:var(--line-l)}
.live{display:inline-flex;align-items:center;gap:6px;color:var(--spark);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--spark);box-shadow:0 0 0 0 rgba(184,235,79,.7);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(184,235,79,.6)}100%{box-shadow:0 0 0 9px rgba(184,235,79,0)}}
.typing{display:inline-flex;gap:4px;padding:12px 14px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--t-mid);animation:ty 1.2s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes ty{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.flow{display:grid;gap:8px}
.flow-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border-radius:10px;background:#fff;border:1px solid var(--line-l);font-weight:700;font-size:12.5px}
.flow-row span:last-child{color:var(--d-lo);font-weight:600}
.flow-row .tag{background:#EAF7D9;color:#3E7D12}
.meter{height:8px;border-radius:8px;background:var(--pearl-2);overflow:hidden}
.meter i{display:block;height:100%;border-radius:8px;background:var(--grad-brand)}
.kv{display:grid;gap:9px}
.kv div{display:flex;justify-content:space-between;gap:12px;font-size:12.5px}
.kv span{color:var(--d-lo)}
.kv b{font-weight:600}
.ch-list{display:grid;gap:8px}
.ch{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;background:#fff;border:1px solid var(--line-l);font-size:12.5px}
.ch i{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;flex-shrink:0;color:#fff;font-style:normal;font-family:var(--f-display);font-weight:700;font-size:11px}
.ch .n{font-weight:600}
.ch .m{color:var(--d-lo);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0}
.ch .c{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:10px;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:600;font-size:11px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:8px 12px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line-l);font-family:var(--f-display);font-weight:600;font-size:12.5px;color:var(--d-hi)}
.screen-call{display:grid;gap:10px}
.screen-call .q{padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line-l);font-size:12.5px;line-height:1.45}
.screen-call .acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.screen-call .acts span{padding:9px;border-radius:10px;text-align:center;font-family:var(--f-display);font-weight:600;font-size:12px}
.screen-call .acts .y{background:var(--green);color:#fff}
.screen-call .acts .n{background:var(--pearl-2);color:var(--d-mid)}

/* ---------- picker section ---------- */
.picker-sec{position:relative;background:var(--ink-1)}
.picker-head{padding:var(--sec) 0 0;text-align:center}
.picker-frame{position:relative;max-width:1280px;margin:clamp(24px,3vw,40px) auto 0;padding:0 var(--gutter) var(--sec)}
.picker-frame .vpap{min-height:800px;border-radius:var(--r-xl);border:1px solid var(--line-d);box-shadow:0 40px 120px -40px rgba(0,0,0,.8)}
.picker-frame .vpap-top{display:none}
.picker-frame .vpap-screen{padding-top:56px}
@media (max-width:640px){.picker-frame{padding:0 10px var(--sec)}.picker-frame .vpap{min-height:760px;border-radius:var(--r-lg)}}

/* ---------- video ---------- */
.video-card{position:relative;overflow:hidden;border-radius:var(--r-xl);aspect-ratio:16/9;background:#000;border:1px solid var(--line-d2);box-shadow:0 50px 120px -40px rgba(0,0,0,.85)}
.video-card video{width:100%;height:100%;object-fit:cover}
.video-play{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,rgba(7,12,31,0) 40%,rgba(7,12,31,.6));transition:opacity .4s}
.video-play span{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:var(--grad-btn);color:var(--ink-2);box-shadow:0 0 0 12px rgba(146,214,60,.18),0 20px 50px -10px rgba(116,194,45,.8);transition:transform .35s var(--ease)}
.video-play:hover span{transform:scale(1.06)}
.video-play svg{width:30px;height:30px;margin-left:4px}
.video-card.is-playing .video-play{opacity:0;pointer-events:none}

/* ---------- steps ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:s}
.step{position:relative;padding:28px 24px 26px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l)}
.step::before{counter-increment:s;content:"0" counter(s);display:block;margin-bottom:28px;font-family:var(--f-display);font-weight:700;font-size:15px;letter-spacing:.06em;color:var(--emerald)}
.step h3{font-size:var(--fs-lg);margin-bottom:8px}
.step p{font-size:var(--fs-sm);color:var(--d-mid)}
.step .bar{position:absolute;left:24px;right:24px;top:58px;height:2px;border-radius:2px;background:var(--pearl-2);overflow:hidden}
.step .bar i{display:block;height:100%;width:0;background:var(--grad-brand);transition:width 1.2s var(--ease)}
.is-in .step .bar i{width:100%}
.is-in .step:nth-child(2) .bar i{transition-delay:.25s}.is-in .step:nth-child(3) .bar i{transition-delay:.5s}.is-in .step:nth-child(4) .bar i{transition-delay:.75s}
@media (max-width:960px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* ---------- plans ---------- */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;gap:22px;padding:clamp(28px,3vw,42px);border-radius:var(--r-xl);background:linear-gradient(170deg,var(--ink-3),var(--ink-2));border:1px solid var(--line-d)}
.plan.pro{background:radial-gradient(120% 80% at 100% 0%,rgba(146,214,60,.20),transparent 55%),linear-gradient(170deg,#16275A,#0C1636);border-color:rgba(146,214,60,.38);box-shadow:0 40px 100px -40px rgba(116,194,45,.45)}
.plan-top{display:flex;flex-wrap:wrap-reverse;align-items:flex-start;justify-content:space-between;gap:12px 16px}
.plan h3{font-size:var(--fs-2xl)}
.plan .for{color:var(--t-mid);font-size:var(--fs-sm);margin-top:8px;max-width:36ch}
.badge{flex-shrink:0;padding:6px 12px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-d2);color:var(--t-mid)}
.plan.pro .badge{border:0;background:var(--grad-brand);color:var(--ink-2)}
.plan ul{display:grid;gap:13px}
.plan li{display:flex;align-items:flex-start;gap:12px;font-size:var(--fs-md)}
.plan li svg{width:20px;height:20px;flex-shrink:0;margin-top:2px;color:var(--lime)}
.plan li.inh{color:var(--t-mid)}
.plan li .soon{margin-left:6px;padding:2px 8px;border-radius:var(--r-pill);background:rgba(169,194,238,.12);color:var(--ice);font-family:var(--f-display);font-weight:600;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;vertical-align:2px}
.plan .btn{margin-top:auto;align-self:flex-start}
.plan-bot{position:absolute;right:-10px;bottom:-6px;width:150px;opacity:.95;pointer-events:none;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
@media (max-width:860px){.plans{grid-template-columns:1fr}.plan-bot{width:110px}}

/* ---------- proof ---------- */
.proof-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,64px);align-items:center}
.quote{position:relative;padding:clamp(28px,3.4vw,48px);border-radius:var(--r-xl);background:linear-gradient(170deg,var(--ink-3),var(--ink-2));border:1px solid var(--line-d)}
.quote blockquote{margin:0;font-family:var(--f-display);font-weight:700;font-size:clamp(1.25rem,1rem + 1vw,1.75rem);line-height:1.35;letter-spacing:-.01em}
.quote blockquote::before{content:"\201C";display:block;height:.55em;font-size:4em;line-height:1;color:var(--lime);font-family:Georgia,serif}
.quote figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:26px;font-size:var(--fs-sm);color:var(--t-mid)}
.quote figcaption b{display:block;color:var(--t-hi);font-family:var(--f-display);font-weight:600}
.quote figcaption img{height:34px;width:auto;opacity:.9;margin-left:auto}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.stat{padding:24px;border-radius:var(--r-lg);border:1px solid var(--line-d);background:rgba(255,255,255,.02)}
.stat b{display:block;font-family:var(--f-display);font-weight:700;font-size:var(--fs-2xl);letter-spacing:-.03em;line-height:1}
.stat span{display:block;margin-top:10px;font-size:var(--fs-sm);color:var(--t-mid);line-height:1.45}
.logos{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(22px,4vw,48px);margin-top:clamp(40px,5vw,60px);padding-top:32px;border-top:1px solid var(--line-d)}
.logos img{height:34px;width:auto;opacity:.7;transition:opacity .3s}
.logos img:hover{opacity:1}
@media (max-width:900px){.proof-grid{grid-template-columns:1fr}}
@media (max-width:560px){.quote figcaption img{margin-left:0}}

/* ---------- faq ---------- */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
.faq details{border-radius:var(--r-md);background:#fff;border:1px solid var(--line-l);transition:box-shadow .3s}
.faq details[open]{box-shadow:var(--shadow-l)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;cursor:pointer;list-style:none;font-family:var(--f-display);font-weight:600;font-size:var(--fs-lg);color:var(--d-hi)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{position:relative;width:28px;height:28px;flex-shrink:0;border-radius:50%;background:var(--pearl-2)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;border-radius:2px;background:var(--d-hi);transition:transform .3s var(--ease)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq .a{padding:0 24px 22px;color:var(--d-mid);max-width:70ch}

/* ---------- cta band ---------- */
.cta-band{position:relative;overflow:hidden;padding:clamp(48px,6vw,88px);border-radius:var(--r-xl);background:radial-gradient(80% 120% at 85% 10%,rgba(146,214,60,.28),transparent 55%),radial-gradient(60% 90% at 0% 100%,rgba(30,156,107,.25),transparent 60%),linear-gradient(160deg,#16275A,#0A1330);border:1px solid var(--line-d2)}
.cta-band .in{position:relative;z-index:1;display:grid;gap:22px;max-width:620px}
@media (min-width:901px){.cta-band .in{max-width:min(620px,56%)}}
.cta-band .bots{position:absolute;right:clamp(-40px,-2vw,0px);bottom:-20px;display:flex;align-items:flex-end;pointer-events:none}
.cta-band .bots img{width:clamp(120px,14vw,200px);margin-left:-50px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
.cta-band .bots img:nth-child(2){width:clamp(150px,17vw,240px);position:relative;z-index:2}
@media (max-width:900px){.cta-band .bots{position:relative;right:auto;bottom:-56px;margin-top:20px;justify-content:center}}

/* ---------- footer ---------- */
.ftr{padding:clamp(64px,7vw,96px) 0 36px;background:var(--ink-0);border-top:1px solid var(--line-d);color:var(--t-mid);font-size:var(--fs-sm)}
.ftr-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:clamp(28px,4vw,56px)}
.ftr-brand img{height:42px;width:auto;margin-bottom:18px}
.ftr-brand p{max-width:34ch;line-height:1.6}
.ftr h4{margin-bottom:16px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo)}
.ftr ul{display:grid;gap:10px}
.ftr a:hover{color:var(--t-hi)}
.ftr-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 28px;margin-top:clamp(40px,5vw,64px);padding-top:26px;border-top:1px solid var(--line-d);font-size:12.5px;color:var(--t-lo);line-height:1.6}
.ftr-legal p{max-width:80ch}
@media (max-width:860px){.ftr-grid{grid-template-columns:1fr 1fr}.ftr-brand{grid-column:1/-1}}

/* ---------- page hero (inner pages) ---------- */
.phero{position:relative;padding:clamp(150px,16vw,200px) 0 clamp(70px,8vw,110px);overflow:hidden;isolation:isolate;background:radial-gradient(80% 90% at 80% 0%,#1A2C63 0%,transparent 60%),radial-gradient(60% 70% at 0% 100%,rgba(30,156,107,.18),transparent 60%),var(--ink-1)}
.phero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(169,194,238,.09) 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(60% 70% at 70% 30%,#000,transparent 75%);-webkit-mask-image:radial-gradient(60% 70% at 70% 30%,#000,transparent 75%)}
.phero .in{display:grid;gap:22px;max-width:820px}
.phero-bots{position:absolute;right:clamp(-60px,-3vw,0px);bottom:-30px;display:flex;align-items:flex-end;z-index:-1;opacity:.95}
.phero-bots img{width:clamp(110px,12vw,180px);margin-left:-40px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
@media (max-width:900px){.phero-bots{display:none}}

/* ---------- agents grid ---------- */
.agents{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.agent{position:relative;overflow:hidden;display:flex;flex-direction:column;border-radius:var(--r-xl);background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.agent:hover{transform:translateY(-6px);box-shadow:0 30px 60px -24px rgba(11,20,48,.3)}
.agent-art{position:relative;height:300px;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(80% 70% at 50% 85%,rgba(146,214,60,.28),transparent 65%),linear-gradient(180deg,#14234B,#0B1430);overflow:hidden}
.agent-art::after{content:"";position:absolute;left:50%;bottom:10px;width:60%;height:24px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(146,214,60,.5),transparent);filter:blur(4px)}
.agent-art img{position:relative;z-index:1;height:280px;width:auto;transition:transform .6s var(--ease)}
.agent:hover .agent-art img{transform:translateY(-6px) scale(1.03)}
.agent-body{display:flex;flex-direction:column;gap:12px;padding:26px 26px 28px;flex:1}
.agent-body .ind{font-family:var(--f-display);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--emerald)}
.agent-body h3{font-size:var(--fs-xl)}
.agent-body p{color:var(--d-mid);font-size:var(--fs-sm)}
.agent-body ul{display:grid;gap:8px;margin-top:4px}
.agent-body li{display:flex;gap:10px;font-size:var(--fs-sm);color:var(--d-hi)}
.agent-body li svg{width:18px;height:18px;flex-shrink:0;margin-top:2px;color:var(--green)}
@media (max-width:1000px){.agents{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.agents{grid-template-columns:1fr}}

/* ---------- feature rows (platform) ---------- */
.feat{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.feat + .feat{margin-top:clamp(84px,9vw,140px)}
.feat.flip .feat-copy{order:2}
.feat > *{min-width:0}
.feat-copy{display:grid;gap:18px;align-content:start}
.feat-copy ul{display:grid;gap:12px;margin-top:6px}
.feat-copy li{display:flex;gap:12px;color:var(--d-hi)}
.dark-sec .feat-copy li{color:var(--t-hi)}
.feat-copy li svg{width:20px;height:20px;flex-shrink:0;margin-top:3px;color:var(--green)}
.feat-num{font-family:var(--f-display);font-weight:700;font-size:13px;letter-spacing:.14em;color:var(--emerald)}
.dark-sec .feat-num{color:var(--lime)}
.feat-vis{position:relative;padding:clamp(20px,3vw,34px);border-radius:var(--r-xl);background:radial-gradient(90% 80% at 80% 0%,rgba(146,214,60,.16),transparent 60%),linear-gradient(165deg,#14234B,#0A1330);border:1px solid var(--line-d);box-shadow:0 40px 90px -40px rgba(11,20,48,.55);color:var(--t-hi)}
.feat-vis .panel{border-radius:var(--r-md);border:1px solid var(--line-d);background:rgba(5,9,20,.5);padding:16px}
.feat-vis .panel + .panel{margin-top:12px}
.feat-vis .flow-row,.feat-vis .ch,.feat-vis .q,.feat-vis .chip{background:rgba(255,255,255,.04);border-color:var(--line-d);color:var(--t-hi)}
.feat-vis .flow-row span:last-child,.feat-vis .ch .m,.feat-vis .kv span{color:var(--t-mid)}
.feat-vis .flow-row .tag{background:rgba(146,214,60,.14);color:var(--spark)}
.feat-vis .meter{background:rgba(169,194,238,.12)}
.feat-vis .screen-call .acts .n{background:rgba(169,194,238,.12);color:var(--t-mid)}
.bars{display:flex;align-items:flex-end;gap:8px;height:120px;padding-top:10px}
.bars i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--lime),rgba(30,156,107,.5));transform-origin:bottom;transform:scaleY(.1);transition:transform 1s var(--ease)}
.is-in .bars i{transform:scaleY(1)}
.bars-x{display:flex;justify-content:space-between;margin-top:8px;font-size:11px;color:var(--t-lo);font-family:var(--f-display);font-weight:700}
.wb{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.wb div{padding:12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.wb b{display:block;font-family:var(--f-display);font-weight:700;font-size:24px;letter-spacing:-.02em}
.wb span{font-size:11px;color:var(--t-mid)}
@media (max-width:900px){.feat{grid-template-columns:1fr}.feat.flip .feat-copy{order:0}}

/* ---------- comparison table ---------- */
.cmp{width:100%;border-collapse:separate;border-spacing:0;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);font-size:var(--fs-sm)}
.cmp th,.cmp td{padding:16px 20px;text-align:left;border-bottom:1px solid var(--line-l)}
.cmp thead th{font-family:var(--f-display);font-weight:700;font-size:var(--fs-md);background:var(--pearl);color:var(--d-hi)}
.cmp thead th:not(:first-child),.cmp td:not(:first-child){text-align:center;width:22%}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp .grp td{background:var(--pearl);font-family:var(--f-display);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--emerald)}
.cmp svg{width:20px;height:20px;margin:0 auto;color:var(--green)}
.cmp .no{color:var(--d-lo)}
.cmp .pro-col{background:linear-gradient(180deg,rgba(146,214,60,.08),rgba(146,214,60,.04))}
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r-lg)}
.cmp-wrap .cmp{min-width:620px}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,4vw,48px);align-items:start}
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:clamp(24px,3vw,40px);border-radius:var(--r-xl);background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);color:var(--d-hi)}
.form .full{grid-column:1/-1}
.field{display:grid;gap:7px}
.field label,.field legend{font-family:var(--f-display);font-weight:600;font-size:13.5px}
.field input,.field select,.field textarea{width:100%;min-height:50px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-l2);background:var(--pearl);font:inherit;font-size:15px;color:var(--d-hi);transition:border-color .2s,box-shadow .2s,background .2s}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--green);background:#fff;box-shadow:0 0 0 4px rgba(116,194,45,.18)}
.field input[aria-invalid="true"]{border-color:var(--rose)}
.seg{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0;margin:0}
.seg label{position:relative}
.seg input{position:absolute;opacity:0}
.seg span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--line-l2);background:var(--pearl);font-family:var(--f-display);font-weight:600;font-size:13.5px;cursor:pointer;transition:all .2s}
.seg input:checked + span{background:var(--d-hi);border-color:var(--d-hi);color:#fff}
.seg input:focus-visible + span{outline:2px solid var(--green);outline-offset:2px}
.hp{position:absolute;left:-9999px}
.form .fine{font-size:12.5px;color:var(--d-lo)}
.form-ok{grid-column:1/-1;display:none;padding:40px 10px;text-align:center}
.form.is-sent > *:not(.form-ok){display:none}
.form.is-sent .form-ok{display:grid;gap:12px;justify-items:center}
.form-ok .tick{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--grad-btn);color:var(--ink-2)}
.form-ok .tick svg{width:28px;height:28px}
.side{display:grid;gap:16px}
.side-card{padding:26px;border-radius:var(--r-lg);background:linear-gradient(170deg,var(--ink-3),var(--ink-2));border:1px solid var(--line-d);color:var(--t-hi)}
.side-card h3{font-size:var(--fs-lg);margin-bottom:12px}
.side-card p,.side-card li{color:var(--t-mid);font-size:var(--fs-sm)}
.side-card a.big{display:block;margin-top:6px;font-family:var(--f-display);font-weight:700;font-size:var(--fs-xl);color:var(--t-hi)}
.side-card ol{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:n}
.side-card ol li{display:flex;gap:12px}
.side-card ol li::before{counter-increment:n;content:counter(n);width:24px;height:24px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:rgba(146,214,60,.15);color:var(--spark);font-family:var(--f-display);font-weight:700;font-size:12px}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
@media (max-width:560px){.form{grid-template-columns:1fr}}

/* ---------- misc ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.center-cta{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:40px}
.note{margin-top:18px;font-size:12.5px;color:var(--d-lo);text-align:center}
.int-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.int{display:flex;align-items:center;gap:12px;padding:16px 18px;border-radius:var(--r-md);background:#fff;border:1px solid var(--line-l);font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--d-hi)}
.int i{width:34px;height:34px;flex-shrink:0;border-radius:10px;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:13px;color:#fff}
@media (max-width:900px){.int-grid{grid-template-columns:repeat(2,1fr)}}
.nf{min-height:80vh;display:grid;place-items:center;text-align:center}
.nf .in{display:grid;gap:20px;justify-items:center}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.is-in{opacity:1;transform:none}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}.js .rv.d3{transition-delay:.24s}.js .rv.d4{transition-delay:.32s}.js .rv.d5{transition-delay:.4s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
}

.mock-note{margin-top:16px;font-size:12px;color:var(--d-lo);text-align:center}
.mock-note.on-dark{color:var(--t-lo)}
.cmp.vs th,.cmp.vs td{text-align:left!important;vertical-align:top}
.cmp.vs td:first-child{width:24%;font-weight:600;color:var(--d-hi)}
.cmp.vs th:not(:first-child),.cmp.vs td:not(:first-child){width:38%}
.cmp.vs td:nth-child(2){color:var(--d-mid)}
.cmp.vs td.pro-col{color:var(--d-hi);font-weight:600}
.badge-mini{display:inline-block;margin-left:8px;padding:3px 9px;border-radius:999px;background:var(--grad-brand);color:var(--ink-2);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;vertical-align:2px}
.cmp-wrap .cmp.vs{min-width:680px}

/* ---- integration chips (official logos) ---- */
.strip-items{gap:12px}
.strip-items .chip{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 18px;border-radius:14px;background:#fff;box-shadow:0 10px 30px -14px rgba(0,0,0,.6),inset 0 0 0 1px rgba(11,20,48,.06);transition:transform .35s var(--ease)}
.strip-items .chip:hover{transform:translateY(-2px)}
.strip-items .chip img{height:26px;width:auto;display:block}
.strip-items .chip b{font-family:var(--f-display);font-weight:600;font-size:14.5px;color:#1B2442;letter-spacing:-.005em;white-space:nowrap}
@media (max-width:640px){.strip-items .chip{height:44px;padding:0 13px}.strip-items .chip img{height:22px}.strip-items .chip b{font-size:13px}}

/* ---- live transcript ---- */
.t-a .live-tx{flex:1;display:flex;flex-direction:column;min-height:420px;margin-top:8px}
.live-tx .tx-body{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;overflow:hidden;mask-image:linear-gradient(to bottom,transparent 0,#000 56px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 56px)}
.live-tx .bub{animation:bubIn .5s var(--ease) both}
.live-tx .bub.out{align-self:flex-end}
.live-tx .bub.in{align-self:flex-start}
.live-tx .bub.sys{align-self:center;max-width:none;background:rgba(146,214,60,.12);color:var(--spark);font-size:12px;font-weight:600;padding:7px 12px;border-radius:999px;display:inline-flex;gap:6px;align-items:center}
.live-tx .bub.sys svg{width:14px;height:14px}
.live-tx .tx-clock{font-style:normal;margin-left:6px;color:var(--t-mid);font-variant-numeric:tabular-nums;letter-spacing:0}
@keyframes bubIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media (max-width:1000px){.t-a .live-tx{min-height:380px}}
@media (prefers-reduced-motion:reduce){.live-tx .bub{animation:none}}

/* ---- comparison with logos ---- */
.cmp.vs{border:0;box-shadow:0 30px 80px -40px rgba(11,20,48,.35),0 0 0 1px var(--line-l);overflow:visible}
.cmp.vs thead th{background:#fff;vertical-align:bottom;padding:26px 22px 20px;border-bottom:1px solid var(--line-l)}
.cmp.vs thead th:first-child{border-top-left-radius:var(--r-lg)}
.cmp.vs .vs-h img{display:block;height:30px;width:auto;margin-bottom:14px}
.cmp.vs .vs-h.pro-col img{height:40px}
.cmp.vs .vs-h span:not(.badge-mini){display:block;font-family:var(--f-display);font-weight:700;font-size:17px;color:var(--d-hi)}
.cmp.vs .vs-h small{display:block;margin-top:4px;font-family:var(--f-text);font-weight:500;font-size:13px;color:var(--d-mid)}
.cmp.vs th.pro-col,.cmp.vs td.pro-col{position:relative;background:linear-gradient(180deg,rgba(146,214,60,.10),rgba(30,156,107,.05))}
.cmp.vs thead th.pro-col{border-top-right-radius:var(--r-lg);box-shadow:inset 0 3px 0 var(--green)}
.cmp.vs tbody tr:last-child td:first-child{border-bottom-left-radius:var(--r-lg)}
.cmp.vs tbody tr:last-child td:last-child{border-bottom-right-radius:var(--r-lg)}
.cmp.vs td{padding:18px 22px;font-size:14.5px;line-height:1.5}
.cmp.vs tbody tr{transition:background .25s}
.cmp.vs tbody tr:hover td:not(.pro-col){background:var(--pearl)}
.cmp.vs .badge-mini{position:absolute;top:-12px;left:22px;margin:0}
.cmp.vs .tick{display:inline-grid;place-items:center;width:20px;height:20px;margin-right:8px;border-radius:50%;background:var(--green);color:#0A1A06;vertical-align:-4px}
.cmp.vs .tick svg{width:12px;height:12px;margin:0;color:#0A1A06;stroke-width:3}
.cmp.vs .dash{color:var(--d-lo);font-weight:700}
.cmp-wrap:has(.vs){padding-top:14px;overflow-x:auto}

/* ---- picker without the box ---- */
.picker-sec{background:#0B1430}
.picker-frame{max-width:none;margin:0;padding:0}
.picker-frame .vpap{min-height:780px;border:0;border-radius:0;box-shadow:none;background:radial-gradient(70% 70% at 50% 40%,#1F3368 0%,#0B1430 62%,#0B1430 100%)}
.picker-frame .vpap-screen{padding-top:30px}
.picker-head{padding-bottom:0}
@media (max-width:640px){.picker-frame{padding:0}.picker-frame .vpap{min-height:740px;border-radius:0}}

/* ---- client logos on cards ---- */
.logos.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;border-top:0;padding-top:0}
.logos.cards .lc{display:grid;place-items:center;height:104px;padding:18px 26px;border-radius:var(--r-md);background:#fff;box-shadow:0 18px 40px -24px rgba(0,0,0,.7)}
.logos.cards img{height:auto;width:auto;max-height:56px;max-width:100%;opacity:1;object-fit:contain}
.logos.cards .lc:nth-child(2) img,.logos.cards .lc:nth-child(3) img{max-height:38px}
@media (max-width:800px){.logos.cards{grid-template-columns:repeat(2,1fr)}.logos.cards .lc{height:88px}}
.strip-items span.chip{opacity:1;color:inherit;font-size:inherit}
.strip-items .chip img[src*="salesforce"]{height:36px}
.strip-items .chip img[src*="3cx"]{height:24px}
.logos.cards .lc:first-child img{max-height:68px}
@media (max-width:720px){
  .cmp-wrap:has(.vs){overflow:visible}
  .cmp-wrap .cmp.vs{min-width:0}
  .cmp.vs,.cmp.vs thead,.cmp.vs tbody,.cmp.vs tr{display:block;width:100%}
  .cmp.vs tr{display:grid;grid-template-columns:1fr 1fr}
  .cmp.vs th,.cmp.vs td{display:block;width:auto!important}
  .cmp.vs thead th:first-child{display:none}
  .cmp.vs thead th{padding:22px 14px 16px}
  .cmp.vs thead th:nth-child(2){border-top-left-radius:var(--r-lg)}
  .cmp.vs .vs-h img{height:22px;margin-bottom:10px}
  .cmp.vs .vs-h.pro-col img{height:30px}
  .cmp.vs .vs-h span:not(.badge-mini){font-size:14.5px}
  .cmp.vs .vs-h small{font-size:11.5px}
  .cmp.vs .badge-mini{left:14px;font-size:9.5px}
  .cmp.vs td{padding:12px 14px;font-size:13px}
  .cmp.vs td:first-child{grid-column:1/-1;padding:14px 14px 4px;border-bottom:0;background:#fff!important;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--emerald)}
  .cmp.vs tbody tr:last-child td:first-child{border-bottom-left-radius:0}
  .cmp.vs tbody tr:last-child td:nth-child(2){border-bottom-left-radius:var(--r-lg)}
  .cmp.vs tbody tr:hover td:not(.pro-col){background:transparent}
  .cmp.vs .tick{width:16px;height:16px;margin-right:6px}
}
@media (max-width:800px){.logos.cards .lc{padding:12px 14px}.logos.cards img{max-height:48px}.logos.cards .lc:first-child img{max-height:58px}}
/* ---- works-with strip: white band, logos sit on the page ---- */
.strip{background:#fff;border-top:1px solid var(--line-l);border-bottom:1px solid var(--line-l)}
.strip-in{padding:34px 0;gap:clamp(24px,4vw,56px)}
.strip-label{color:var(--d-mid)}
.strip-items{gap:clamp(26px,3.6vw,52px);flex:1;justify-content:space-between}
.strip-items span.chip{height:auto;padding:0;background:none;box-shadow:none;border-radius:0;gap:12px}
.strip-items .chip:hover{transform:none}
.strip-items .chip img{height:40px}
.strip-items .chip img[src*="3cx"]{height:38px}
.strip-items .chip img[src*="hubspot"]{height:38px}
.strip-items .chip img[src*="salesforce"]{height:56px}
.strip-items .chip b{font-size:clamp(16px,1.35vw,19px);color:#1B2442}
@media (max-width:1100px){.strip-in{flex-direction:column;align-items:flex-start}.strip-label{max-width:none}.strip-items{width:100%}}
@media (max-width:640px){.strip-items{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px}.strip-items .chip img{height:32px}.strip-items .chip img[src*="salesforce"]{height:44px}.strip-items .chip b{font-size:14.5px}}
.strip-items span.chip{border:0}
.strip-in{flex-direction:column;align-items:center;text-align:center;gap:26px;padding:40px 0 44px}
.strip-label{max-width:none}
.strip-items{width:100%;justify-content:space-between;flex-wrap:nowrap}
@media (max-width:1100px){.strip-in{align-items:center}.strip-items{flex-wrap:wrap;justify-content:center;gap:28px 44px}}
@media (max-width:640px){.strip-items{display:grid;grid-template-columns:1fr 1fr;gap:26px 16px;justify-items:center}}
.strip-in{padding:40px var(--gutter) 44px}

/* =========================================================
   v3: white nav on scroll, section rhythm, clean transitions
   ========================================================= */
/* header: transparent over the dark hero, white once you scroll */
.hdr{transition:background-color .5s var(--ease),box-shadow .5s var(--ease),backdrop-filter .5s var(--ease)}
.brand{position:relative;display:block}
.brand img{transition:opacity .45s var(--ease)}
.brand .logo-l{position:absolute;inset:0;opacity:0}
.hdr-in{transition:height .45s var(--ease)}
.nav a,.hdr-tel,.burger{transition:color .4s var(--ease),background-color .3s,border-color .4s}
.hdr.is-scrolled{background:rgba(255,255,255,.96);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);box-shadow:0 1px 0 rgba(11,20,48,.07),0 12px 34px -22px rgba(11,20,48,.35)}
.hdr.is-scrolled .hdr-in{height:68px}
.hdr.is-scrolled .logo-d{opacity:0}
.hdr.is-scrolled .logo-l{opacity:1}
.hdr.is-scrolled .nav a{color:var(--d-mid)}
.hdr.is-scrolled .nav a:hover,.hdr.is-scrolled .nav a[aria-current="page"]{color:var(--d-hi);background:rgba(11,20,48,.05)}
.hdr.is-scrolled .nav a[aria-current="page"]::after{background:var(--green)}
.hdr.is-scrolled .hdr-tel{color:var(--d-mid)}
.hdr.is-scrolled .hdr-tel:hover{color:var(--d-hi)}
.hdr.is-scrolled .burger{color:var(--d-hi);border-color:rgba(11,20,48,.14)}
/* menu open: keep the header dark to match the drawer */
.menu-open .hdr{background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}
.menu-open .hdr .logo-d{opacity:1!important}.menu-open .hdr .logo-l{opacity:0!important}
.menu-open .hdr .burger{color:var(--t-hi);border-color:var(--line-d2)}

/* plans on a light section: cards stay dark for contrast */
.plans-sec .plan{color:var(--t-hi);box-shadow:0 40px 90px -50px rgba(11,20,48,.6)}
.plans-sec .plan.pro{box-shadow:0 40px 100px -40px rgba(30,156,107,.55)}
.plans-sec .note,.plans-sec .center-cta{color:var(--d-mid)}

/* client logos: white band, logos sit straight on the page */
.clients{background:#fff;padding:clamp(48px,6vw,72px) 0;border-bottom:1px solid var(--line-l)}
.clients .strip-label{text-align:center;color:var(--d-mid);margin:0 auto 30px;max-width:none}
.client-row{display:flex;align-items:center;justify-content:space-between;gap:clamp(28px,5vw,72px);flex-wrap:wrap}
.client-row img{height:auto;width:auto;max-height:58px;max-width:22%;object-fit:contain}
.client-row img[alt^="The Leading"]{max-height:76px}
.client-row img[alt^="Mortlake"]{max-height:44px}
@media (max-width:760px){.client-row{display:grid;grid-template-columns:1fr 1fr;gap:34px 24px;justify-items:center}.client-row img{max-width:100%;max-height:46px}.client-row img[alt^="The Leading"]{max-height:64px}.client-row img[alt^="Mortlake"]{max-height:34px}}

/* strip logos: reserve exact space so nothing jumps */
.strip-items .chip img{width:auto;aspect-ratio:auto}

/* smooth image arrival (no layout shift: every image has width/height) */
.js img.fade{opacity:0;transition:opacity .7s var(--ease)}
.js img.fade.ok{opacity:1}

/* refined scroll reveals: shorter travel, quicker, GPU-only properties */
.js .rv{opacity:0;transform:translate3d(0,18px,0);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.is-in{opacity:1;transform:none}

/* page-to-page transitions (cross-document View Transitions, zero JS) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .28s var(--ease) both}
::view-transition-new(root){animation:vtIn .42s var(--ease) both}
.hdr{view-transition-name:site-header}
::view-transition-group(site-header){animation:none}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0;transform:translateY(8px)}}

/* hover polish */
.btn{transition:transform .35s var(--ease),box-shadow .35s var(--ease),background-color .3s,color .3s}
.btn:hover{transform:translateY(-2px)}
.tile:hover,.agent-card:hover{transform:translateY(-4px)}

@media (prefers-reduced-motion:reduce){
  .js .rv,.js img.fade{opacity:1!important;transform:none!important}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}

/* integrations with official logos */
.int-grid{grid-template-columns:repeat(4,1fr);gap:14px}
.int-grid .int{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:18px;min-height:132px;padding:24px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line-l);box-shadow:0 14px 34px -26px rgba(11,20,48,.4);transition:opacity .8s var(--ease),transform .6s var(--ease),box-shadow .45s var(--ease)}
.int-grid .int:hover{transform:translateY(-3px);box-shadow:0 24px 50px -28px rgba(11,20,48,.45)}
.int-logo{display:flex;align-items:center;gap:10px;height:48px}
.int-logo img{height:38px;width:auto;max-width:150px;object-fit:contain}
.int-logo img[src*="salesforce"]{height:48px}
.int-logo img[src*="pipedrive"]{height:30px}
.int-logo img[src*="dynamics"]{height:42px}
.int-logo b{font-family:var(--f-display);font-weight:600;font-size:17px;color:var(--d-hi)}
.int-grid .int small{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--d-lo)}
@media (max-width:900px){.int-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:420px){.int-grid .int{padding:18px;min-height:116px}.int-logo img{max-width:120px}}
.live-tx .mock-head .live{white-space:nowrap;flex-shrink:0}
.live-tx .mock-head>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- audit fixes ---- */
.light,.white,.plans-sec,.clients,.strip,.cmp{--emerald:#147A52}
.screen-call .acts .y,.ch .c{color:#0A1A06}
.ftr .ftr-h{margin-bottom:16px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo);font-weight:600}
.link-arrow{padding-block:10px;margin-block:-10px}
.fine a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@media (max-width:400px){
  .feat-vis .mock-head{flex-wrap:wrap;row-gap:6px}
  .feat-vis .mock-head .live{white-space:nowrap}
  .feat-vis .ch{min-width:0}
  .feat-vis .mock{overflow:hidden}
}
.side-card .side-h{font-size:var(--fs-lg);margin-bottom:12px}

/* ===== v4: de-template pass, mobile hero unit, marquee, wide screens ===== */
.hl{color:var(--lime)}
.light .hl,.white .hl{color:var(--emerald)}
.num{color:var(--lime)}
.light .num,.white .num,.clients .num{color:var(--emerald)}
.eyebrow::before{display:none}
.eyebrow{letter-spacing:.18em}
.hero .eyebrow{color:var(--t-mid);letter-spacing:.06em;text-transform:none;font-size:var(--fs-sm);justify-self:start}
.btn-primary{box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 6px 18px -10px rgba(116,194,45,.55)}
.btn-primary:hover{box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 10px 24px -12px rgba(146,214,60,.7)}

/* strip: desktop = static row, duplicate hidden */
.strip-track{display:contents}
.strip-dup{display:none}

@media (max-width:760px){
  .strip-in{padding:30px 0 32px;display:block}
  .strip-label{max-width:none;text-align:center;padding:0 var(--gutter);margin-bottom:18px}
  .strip-items{display:block;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
  .strip-track{display:flex;align-items:center;width:max-content;gap:0;animation:marquee 32s linear infinite}
  .strip-dup{display:flex;align-items:center}
  .strip-track>.chip,.strip-dup>.chip{margin-right:40px;flex:none}
  .strip-items .chip img{height:26px}
  .strip-items .chip img[src*="salesforce"]{height:34px}
}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.strip-track{animation:none}.strip-items{overflow-x:auto}}

/* hero: on tablet/phone the robot and cards become one framed unit */
@media (max-width:1000px){
  .hero{padding:118px 0 56px}
  .hero-copy{gap:22px}
  .stage{aspect-ratio:auto;height:clamp(400px,92vw,600px);max-width:640px;width:100%;margin-top:18px;border-radius:28px;overflow:hidden;
    background:radial-gradient(70% 60% at 50% 62%,rgba(146,214,60,.20),transparent 70%),linear-gradient(180deg,#0E1A3D,#081029);
    border:1px solid var(--line-d2);box-shadow:0 30px 60px -30px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06)}
  .stage-orb{top:64%;width:80%}
  .stage-ring{top:64%}.stage-ring.r1{width:58%}.stage-ring.r2{width:84%}.stage-ring.r3{display:none}
  .stage-bot{width:58%;bottom:-9%;animation:none}
  .stage-floor{display:none}
  .float-card{animation:none}
  .fc-call{left:16px;right:16px;top:16px;width:auto;grid-template-columns:auto 1fr;align-items:center;gap:14px}
  .fc-call .row{grid-column:1}
  .fc-call .wave,.fc-call .bars{grid-column:2;justify-self:end;max-width:46%}
  .fc-xfer{left:50%;right:auto;bottom:18px;transform:translateX(-50%);white-space:nowrap;box-shadow:0 14px 30px -12px rgba(0,0,0,.7)}
  .fc-sum{right:16px;top:auto;bottom:74px;width:min(260px,42%)}
}
@media (max-width:560px){
  .fc-sum{display:none}
  .stage-bot{width:66%;bottom:-8%}
  .fc-call .wave,.fc-call .bars{max-width:40%}
}

/* wide screens: use the extra width instead of floating in the middle */
@media (min-width:1600px){
  :root{--wrap:1440px;--fs-hero:6.25rem;--fs-3xl:4.75rem}
  .stage{max-width:660px}
  .hero-copy{max-width:720px}
  .fc-call{width:256px}.fc-sum{width:276px}
}
@media (min-width:2200px){
  html{font-size:112.5%}
  :root{--wrap:1680px;--fs-hero:6.75rem}
  .stage{max-width:760px}
  .picker-frame{max-width:1560px}
  .fc-call{width:290px}.fc-sum{width:310px}.float-card{font-size:14.5px}
}
@media (max-width:1000px){
  .stage{height:clamp(460px,78vw,580px)}
  .fc-call .wave{width:100%;min-width:120px;justify-self:end}
  .stage-bot{width:min(50%,330px);bottom:0}
  .stage-orb,.stage-ring{top:60%}
}
@media (max-width:560px){
  .stage{height:470px}
  .stage-bot{width:68%;bottom:2%}
  .fc-xfer{bottom:16px}
  .fc-call .wave{min-width:96px;max-width:44%}
}
@media (max-width:380px){
  .int-grid{grid-template-columns:1fr 1fr;gap:10px}
  .int-grid .int{padding:16px;min-width:0;min-height:112px}
  .int-grid .int img{max-width:100%}
  .ch{min-width:0}.ch .m{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ch .n{flex:none}
}
.cmp-wrap:focus-visible{outline:2px solid var(--emerald);outline-offset:4px;border-radius:12px}
/* mobile comparison: one continuous green column, including the label strips */
@media (max-width:760px){
  .cmp.vs thead tr,.cmp.vs tbody tr{background:linear-gradient(90deg,#fff 50%,#F1F8E9 50%)}
  .cmp.vs th.pro-col,.cmp.vs td.pro-col{background:transparent}
  .cmp.vs thead th{background:transparent}
  .cmp.vs td:first-child{background:transparent!important}
  .cmp.vs thead tr{border-radius:var(--r-lg) var(--r-lg) 0 0}
  .cmp.vs tbody tr:last-child{border-radius:0 0 var(--r-lg) var(--r-lg)}
  .cmp.vs td:nth-child(2){padding-bottom:16px}
  .cmp.vs td.pro-col{padding-bottom:16px}
}
/* mobile/tablet: header scrolls away with the page instead of staying fixed */
@media (max-width:960px){
  .hdr{position:absolute}
  .hdr.is-scrolled{background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .hdr.is-scrolled .hdr-in{height:76px}
  .hdr.is-scrolled .logo-d{opacity:1}.hdr.is-scrolled .logo-l{opacity:0}
  .hdr.is-scrolled .burger{color:inherit;border-color:var(--line-d2)}
}
/* plans comparison fits on phones: no sideways scroll */
@media (max-width:760px){
  .cmp-wrap .cmp:not(.vs){min-width:0;table-layout:fixed}
  .cmp:not(.vs) th,.cmp:not(.vs) td{padding:13px 12px}
  .cmp:not(.vs) th:first-child,.cmp:not(.vs) td:first-child{width:auto}
  .cmp:not(.vs) th:not(:first-child),.cmp:not(.vs) td:not(:first-child){width:74px;text-align:center}
  .cmp:not(.vs) td{font-size:13.5px;line-height:1.4}
  .cmp:not(.vs) td svg{margin:0 auto}
  .cmp:not(.vs) .grp td{width:auto;text-align:left}
}

/* ===== v5: omnichannel inbox, logo chips, also-included visuals ===== */
.inbox{display:grid;gap:6px;padding:8px}
.ib-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line-l);min-width:0}
.ib-av{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:inset 0 0 0 1px rgba(11,20,48,.10);overflow:hidden}
.ib-av img{width:22px;height:22px;display:block}
.ib-av.sms{background:#1E9C6B;color:#fff;box-shadow:none}
.ib-av.sms svg,.ib-av.call svg{width:18px;height:18px}
.ib-av.chat{box-shadow:none}.ib-av.chat img{width:36px;height:36px}
.ib-av.call{background:var(--grad-btn);color:#0A1A06;box-shadow:none}
.ib-main{flex:1;min-width:0}
.ib-top{display:flex;align-items:baseline;gap:8px;min-width:0}
.ib-top b{font-family:var(--f-display);font-weight:700;font-size:13.5px;color:var(--d-hi);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.ib-via{font-size:11px;font-weight:600;color:var(--d-lo);white-space:nowrap}
.ib-top time{margin-left:auto;font-size:11px;color:var(--d-lo);white-space:nowrap}
.ib-main p{margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--d-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib-n{flex:none;min-width:20px;height:20px;padding:0 6px;border-radius:10px;display:grid;place-items:center;background:#147A52;color:#fff;font-weight:700;font-size:11px}
.tile .mock.inbox{background:var(--pearl);border:1px solid var(--line-l);border-radius:16px}
/* dark version on the platform page */
.dark-ib{padding:16px}
.dark-ib .ib-row{background:rgba(255,255,255,.04);border-color:var(--line-d)}
.dark-ib .ib-row.is-call{background:linear-gradient(90deg,rgba(146,214,60,.14),rgba(146,214,60,.03));border-color:rgba(146,214,60,.32)}
.dark-ib .ib-top b{color:var(--t-hi)}
.dark-ib .ib-via,.dark-ib .ib-top time{color:var(--t-lo)}
.dark-ib .ib-main p{color:var(--t-mid)}
.dark-ib .ib-row.is-call p{white-space:normal}
.dark-ib .ib-n{background:var(--lime);color:#0A1A06}
.ib-tabs{display:flex;gap:6px;margin:0 0 10px;overflow:hidden}
.ib-tabs span{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--line-d);font-size:11.5px;font-weight:600;color:var(--t-mid);white-space:nowrap}
.ib-tabs span.on{background:#fff;color:var(--ink-2);border-color:#fff}
.ib-tabs img{width:14px;height:14px}
/* CRM logo chips */
.lchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.lchip{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 14px;border-radius:12px;background:#fff;border:1px solid var(--line-l)}
.lchip img{height:22px;width:auto;max-width:96px;object-fit:contain}
.lchip img[src*="salesforce"]{height:28px}.lchip img[src*="dynamics"]{height:24px}
/* logo row under feature lists */
.brand-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin-top:6px}
.brand-row .br-k{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--t-lo);margin-right:4px}
.brand-row img{height:24px;width:auto;padding:8px 12px;box-sizing:content-box;border-radius:10px;background:#fff}

/* also included: each card leads with a small product visual */
.also-grid{grid-template-columns:repeat(3,1fr)}
.tile.also{padding:0;gap:0}
.tile.also h3{padding:22px 24px 0}
.tile.also p{padding:8px 24px 24px}
.also-vis{height:168px;padding:20px 22px;display:flex;flex-direction:column;justify-content:center;gap:12px;background:radial-gradient(80% 90% at 50% 0%,rgba(146,214,60,.10),transparent 70%),rgba(5,9,20,.35);border-bottom:1px solid var(--line-d)}
@media (max-width:1000px){.also-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.also-grid{grid-template-columns:1fr}}
/* video */
.vid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.vid span{aspect-ratio:4/3;border-radius:10px;display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:13px;color:#fff;background:linear-gradient(150deg,hsl(var(--h) 45% 42%),hsl(var(--h) 50% 26%))}
.vid .share{background:#fff;display:flex;flex-direction:column;gap:4px;padding:8px;align-items:stretch;justify-content:center}
.vid .share i{height:4px;border-radius:2px;background:#C9D3E6}.vid .share i:first-child{width:60%;background:var(--green)}
.vid-bar{display:flex;align-items:center;gap:8px}
.vid-bar i{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.1)}
.vid-bar i.end{background:#D9534F}
.vid-bar em{margin-left:auto;font-style:normal;font-size:12px;font-weight:600;color:var(--t-mid)}
/* apps */
.apps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;text-align:center}
.apps span{display:grid;justify-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--t-mid)}
.apps b{width:52px;height:52px;border-radius:14px;background:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -12px rgba(0,0,0,.6)}
.apps img{width:24px;height:24px;object-fit:contain}
/* recording */
.rec{display:flex;align-items:center;gap:12px}
.rec-play{width:38px;height:38px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--grad-btn);color:#0A1A06}
.rec-play svg{width:16px;height:16px;margin-left:2px}
.rec-wave{flex:1;display:flex;align-items:center;gap:3px;height:40px}
.rec-wave i{flex:1;border-radius:2px;background:rgba(169,194,238,.35)}
.rec-wave i:nth-child(-n+10){background:var(--lime)}
.rec-t{font-size:12px;font-weight:600;color:var(--t-mid);font-variant-numeric:tabular-nums}
.rec-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--t-mid)}
.rdot{width:8px;height:8px;border-radius:50%;background:#E5534B;box-shadow:0 0 0 4px rgba(229,83,75,.18)}
/* reporting */
.rep{display:flex;align-items:flex-end;gap:16px}
.rep-bars{flex:1;display:flex;align-items:flex-end;gap:6px;height:76px}
.rep-bars i{flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,var(--lime),rgba(30,156,107,.55))}
.rep-side{display:grid;text-align:right}
.rep-side b{font-family:var(--f-display);font-size:26px;font-weight:700;color:var(--t-hi);line-height:1}
.rep-side span{font-size:11.5px;color:var(--t-mid)}
.rep-logos{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--t-mid)}
.rep-logos img{width:18px;height:18px;padding:5px;box-sizing:content-box;border-radius:7px;background:#fff}
.rep-logos img+img,.rep-logos img:nth-of-type(2){margin-left:8px}
/* failover */
.fo{display:grid;gap:6px}
.fo-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--line-d);background:rgba(255,255,255,.03);font-size:13px}
.fo-row b{font-family:var(--f-display);font-weight:600;color:var(--t-hi)}
.fo-row em{margin-left:auto;font-style:normal;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px}
.fo-dot{width:9px;height:9px;border-radius:50%}
.fo-row.off{opacity:.7}.fo-row.off .fo-dot{background:#7A869E}.fo-row.off em{background:rgba(255,255,255,.07);color:var(--t-mid)}
.fo-row.on{border-color:rgba(146,214,60,.35);background:rgba(146,214,60,.08)}.fo-row.on .fo-dot{background:var(--lime);box-shadow:0 0 0 4px rgba(146,214,60,.2)}.fo-row.on em{background:rgba(146,214,60,.18);color:var(--spark)}
.fo-arrow{display:grid;place-items:center;height:14px;color:var(--t-lo)}.fo-arrow svg{width:14px;height:14px}
/* voicemail */
.vm{display:grid;gap:8px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.vm-head{display:flex;align-items:center;gap:8px;font-size:12.5px}
.vm-head b{font-family:var(--f-display);font-weight:600;color:var(--t-hi)}
.vm-ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(146,214,60,.14);color:var(--spark)}.vm-ic svg{width:16px;height:16px}
.vm p{font-size:12.5px;line-height:1.45;color:var(--t-mid)}
.vm-sent{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--spark)}.vm-sent svg{width:12px;height:12px}
@media (prefers-reduced-motion:no-preference){
  .tile.also:hover .rec-wave i:nth-child(n+11):nth-child(-n+14){background:var(--lime);transition:background .4s}
}
.vid-bar i{display:grid;place-items:center;color:var(--t-hi)}.vid-bar i svg{width:13px;height:13px}
@media (max-width:640px){
  .brand-row .br-k{flex-basis:100%}
  .brand-row img{height:20px;padding:7px 10px}
}
@media (max-width:420px){.ib-via{display:none}.ib-tabs span:nth-child(n+4){display:none}}
.brand-row .br-k{color:var(--d-mid)}.brand-row img{box-shadow:inset 0 0 0 1px var(--line-l);border:1px solid var(--line-l)}

/* ===== v6: comparison polish (same layout), mobile button pairs, no sideways scroll ===== */
html,body{overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}

/* comparison: frame the managed column as one highlighted card */
.cmp.vs{border-radius:var(--r-lg);box-shadow:0 40px 90px -50px rgba(11,20,48,.45),0 0 0 1px var(--line-l)}
.cmp.vs thead th.vs-h:not(.pro-col){background:linear-gradient(180deg,#FAFBFD,#fff)}
.cmp.vs thead th.pro-col{background:linear-gradient(180deg,#E6F5D6,#F2F9EA);box-shadow:inset 0 3px 0 var(--green),inset 2px 0 0 var(--green),inset -2px 0 0 var(--green)}
.cmp.vs td.pro-col{background:#F3FAEB;box-shadow:inset 2px 0 0 var(--green),inset -2px 0 0 var(--green)}
.cmp.vs tbody tr:last-child td.pro-col{box-shadow:inset 2px 0 0 var(--green),inset -2px 0 0 var(--green),inset 0 -2px 0 var(--green)}
.cmp.vs td:nth-child(2){color:#5B6889}
.cmp.vs td:first-child{font-family:var(--f-display)}
.cmp.vs .vs-h.pro-col img{filter:drop-shadow(0 6px 14px rgba(116,194,45,.25))}
.cmp.vs .tick{box-shadow:0 0 0 4px rgba(116,194,45,.18)}
.cmp.vs .badge-mini{box-shadow:0 8px 18px -8px rgba(116,194,45,.8)}
.cmp.vs tbody tr:hover td.pro-col{background:#EBF6DF}
@media (max-width:760px){
  .cmp.vs thead tr,.cmp.vs tbody tr{position:relative;background:linear-gradient(90deg,#fff 50%,#F3FAEB 50%)}
  .cmp.vs thead tr{background:linear-gradient(90deg,#FAFBFD 50%,#E9F6DB 50%)}
  .cmp.vs thead th.pro-col,.cmp.vs td.pro-col,.cmp.vs tbody tr:last-child td.pro-col{box-shadow:none;background:transparent}
  .cmp.vs thead th.pro-col{box-shadow:inset 0 3px 0 var(--green)}
  .cmp.vs thead tr::after,.cmp.vs tbody tr::after{content:"";position:absolute;top:0;bottom:0;left:50%;right:0;border-left:2px solid var(--green);border-right:2px solid var(--green);pointer-events:none}
  .cmp.vs thead tr::after{border-top-right-radius:var(--r-lg)}
  .cmp.vs tbody tr:last-child::after{border-bottom:2px solid var(--green);border-bottom-right-radius:var(--r-lg)}
  .cmp.vs tbody tr:hover td.pro-col{background:transparent}
}

/* button pairs sit side by side on phones */
@media (max-width:560px){
  .hero-ctas{flex-wrap:nowrap;gap:10px}
  .hero-ctas .btn{flex:1 1 0;min-width:0;min-height:50px;padding:0 12px;font-size:14px;gap:6px;white-space:normal;text-align:center;line-height:1.2}
  .hero-ctas .btn svg{display:none}
}
@media (max-width:760px){.cmp.vs td:first-child{padding-right:calc(50% + 12px)}}
/* inbox avatars: logos sit directly on the row, all the same size */
.ib-av{width:36px;height:36px;background:none;box-shadow:none;border-radius:0;overflow:visible}
.ib-av img{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(11,20,48,.14))}
.dark-ib .ib-av img{filter:drop-shadow(0 4px 10px rgba(0,0,0,.35))}
.ib-av.call{border-radius:50%;background:var(--grad-btn)}
.ib-av img[src*="whatsapp"]{transform:scale(1.14)}

/* ===== v7: white branded mobile menu + seamless top edge ===== */
html{background:var(--ink-1)}
html.menu-open{background:#fff}
/* hero/page-hero top edge is exactly the status-bar colour, glow starts just below */
.hero{background:linear-gradient(180deg,var(--ink-1) 0,rgba(7,12,31,0) 160px),radial-gradient(90% 70% at 70% 15%,#1A2C63 0%,transparent 60%),radial-gradient(70% 60% at 10% 100%,rgba(30,156,107,.20) 0%,transparent 60%),var(--ink-1)}
.phero{background:linear-gradient(180deg,var(--ink-1) 0,rgba(7,12,31,0) 160px),radial-gradient(80% 90% at 80% 0%,#1A2C63 0%,transparent 60%),radial-gradient(60% 70% at 0% 100%,rgba(30,156,107,.18),transparent 60%),var(--ink-1)}

.drawer{z-index:120;inset:0;padding:0;gap:0;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;color:var(--d-hi);
  display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;
  padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);
  transform:translateY(-8px);transition:opacity .3s var(--ease),transform .4s var(--ease),visibility 0s .4s}
.menu-open .drawer{transform:none;transition:opacity .3s var(--ease),transform .4s var(--ease)}
.drawer a{border:0;padding:0;font-size:inherit;color:inherit}
.dr-head{display:flex;align-items:center;justify-content:space-between;height:76px;padding:0 var(--gutter);border-bottom:1px solid var(--line-l);flex:none}
.dr-head .brand img{display:block;width:122px;height:auto}
.dr-close{width:44px;height:44px;border-radius:12px;border:1px solid rgba(11,20,48,.14);display:grid;place-items:center;color:var(--d-hi);background:#fff}
.dr-close svg{width:20px;height:20px}
.dr-close:focus-visible,.dr-nav a:focus-visible{outline:2px solid var(--emerald);outline-offset:2px}
.dr-nav{display:flex;flex-direction:column;padding:12px var(--gutter) 8px}
.dr-nav a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line-l);font-family:var(--f-display);font-weight:600;font-size:26px;letter-spacing:-.02em;color:var(--d-hi);
  opacity:0;transform:translateY(8px);transition:opacity .35s var(--ease),transform .45s var(--ease),color .2s}
.dr-nav a:last-child{border-bottom:0}
.menu-open .dr-nav a{opacity:1;transform:none}
.menu-open .dr-nav a:nth-child(2){transition-delay:.04s}.menu-open .dr-nav a:nth-child(3){transition-delay:.08s}
.menu-open .dr-nav a:nth-child(4){transition-delay:.12s}.menu-open .dr-nav a:nth-child(5){transition-delay:.16s}
.dr-chev{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--pearl);color:var(--d-mid);flex:none;transition:background .2s,color .2s,transform .3s var(--ease)}
.dr-nav a:active .dr-chev,.dr-nav a:hover .dr-chev{background:var(--grad-btn);color:#0A1A06;transform:translateX(2px)}
.dr-nav a[aria-current="page"] span{position:relative;padding-left:18px}
.dr-nav a[aria-current="page"] span::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(116,194,45,.18)}
.dr-nav a[aria-current="page"] .dr-chev{background:#EAF6DC;color:#147A52}
.dr-foot{margin-top:auto;display:grid;gap:10px;padding:20px var(--gutter) 28px;background:linear-gradient(180deg,#fff,var(--pearl))}
.dr-foot .btn{width:100%;margin:0;font-size:16px}
.drawer .btn-primary{color:var(--ink-2)}
.dr-call{border:1px solid rgba(11,20,48,.14);background:#fff;color:var(--d-hi)!important}
.dr-meta{display:grid;gap:4px;margin-top:8px;text-align:center;font-size:13px;color:var(--d-mid)}
.dr-meta a{font-weight:600;color:var(--d-hi)!important}
@media (min-width:961px){.drawer{display:none}}
@media (prefers-reduced-motion:reduce){.drawer,.dr-nav a{transition:none;transform:none}}
.dr-nav a[aria-current="page"] span{padding-left:0;display:inline-flex;align-items:center;gap:14px}
.dr-nav a[aria-current="page"] span::before{position:static;margin:0;order:2}
.dr-call{box-shadow:inset 0 0 0 1px rgba(11,20,48,.16)}

/* ===== v8: industries, sector pages, blog ===== */
@media (min-width:1101px){.ftr-grid{grid-template-columns:1.3fr repeat(4,1fr)}}
@media (min-width:861px) and (max-width:1100px){.ftr-grid{grid-template-columns:repeat(4,1fr)}.ftr-brand{grid-column:1/-1}}
@media (max-width:1180px) and (min-width:961px){.hdr-tel{display:none}.nav a{padding:9px 11px}}

/* page hero with art */
.phero.art .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:end;gap:40px}
.phero-art{position:relative;justify-self:center;width:min(380px,100%);margin-bottom:-6px}
.phero-art img{position:relative;z-index:1;display:block;width:100%;height:auto;filter:drop-shadow(0 30px 40px rgba(0,0,0,.5))}
.phero-art::before{content:"";position:absolute;left:50%;top:52%;width:118%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 50% 42%,rgba(146,214,60,.28),rgba(30,156,107,.08) 45%,transparent 70%)}
.phero-art .pa-card{position:absolute;z-index:2;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:14px;background:rgba(17,29,64,.82);border:1px solid var(--line-d2);box-shadow:0 18px 40px -18px rgba(0,0,0,.7);backdrop-filter:blur(8px);font-size:13px;color:var(--t-hi);white-space:nowrap}
.phero-art .pa-card b{font-weight:600}
.phero-art .pa-card .d{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(146,214,60,.16);color:var(--spark);flex:none}
.phero-art .pa-card .d svg{width:15px;height:15px}
.phero-art .pa-1{left:-12%;top:18%}.phero-art .pa-2{right:-8%;bottom:20%}
@media (max-width:900px){.phero.art .wrap{grid-template-columns:1fr}.phero-art{width:min(300px,78%);margin-top:8px}.phero-art .pa-1{left:-14%}.phero-art .pa-2{right:-14%}}
@media (max-width:420px){.phero-art .pa-card{font-size:12px}.phero-art .pa-1{left:-6%;top:8%}.phero-art .pa-2{right:-6%}}

/* breadcrumb */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:22px;font-size:13px;font-weight:600;color:var(--t-lo)}
.crumbs a{color:var(--t-mid)}.crumbs a:hover{color:var(--t-hi)}
.crumbs span[aria-hidden]{opacity:.5}

/* industry finder grid */
.ind-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.ind-tile{position:relative;display:flex;flex-direction:column;gap:10px;padding:20px 20px 18px;border-radius:var(--r-md);background:#fff;border:1px solid var(--line-l);box-shadow:0 1px 2px rgba(11,20,48,.04);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}
.ind-tile:hover{transform:translateY(-3px);border-color:rgba(30,156,107,.35);box-shadow:var(--shadow-l)}
.ind-tile .ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(160deg,#EAF7D9,#D6F0E4);color:#147A52}
.ind-tile .ic svg{width:21px;height:21px}
.ind-tile b{font-family:var(--f-display);font-size:17px;font-weight:600;line-height:1.2;color:var(--d-hi)}
.ind-tile span.s{font-size:13.5px;line-height:1.5;color:var(--d-mid)}
.ind-tile .go{position:absolute;right:16px;top:20px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--pearl);color:var(--d-mid);transition:background .25s,color .25s,transform .3s var(--ease)}
.ind-tile .go svg{width:14px;height:14px}
.ind-tile:hover .go{background:var(--grad-btn);color:#0A1A06;transform:translateX(2px)}
.ind-tile.feat-t{background:linear-gradient(165deg,var(--ink-3),var(--ink-2));border-color:transparent}
.ind-tile.feat-t b{color:var(--t-hi)}.ind-tile.feat-t span.s{color:var(--t-mid)}
.ind-tile.feat-t .ic{background:rgba(146,214,60,.14);color:var(--spark)}
.ind-tile.feat-t .go{background:rgba(255,255,255,.08);color:var(--t-hi)}
.ind-tile .pill{align-self:flex-start;margin-top:auto;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(146,214,60,.16);color:var(--spark)}
@media (max-width:1000px){.ind-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.ind-grid{gap:10px}.ind-tile{padding:16px 14px}.ind-tile .go{display:none}.ind-tile b{font-size:15.5px}.ind-tile span.s{font-size:12.5px}}

/* industry jump bar */
.ind-jump{position:sticky;top:0;z-index:20;margin:0 0 34px;padding:10px 0;background:rgba(245,247,251,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line-l)}
@media (min-width:961px){.ind-jump{top:72px}}
.ind-jump .wrap{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent);mask-image:linear-gradient(90deg,#000 92%,transparent)}
.ind-jump .wrap::-webkit-scrollbar{display:none}
.ind-jump a{flex:none;padding:8px 14px;border-radius:999px;border:1px solid var(--line-l2);background:#fff;font-family:var(--f-display);font-weight:600;font-size:13.5px;color:var(--d-hi);transition:background .25s,border-color .25s,color .25s}
.ind-jump a:hover,.ind-jump a.on{background:var(--d-hi);border-color:var(--d-hi);color:#fff}

/* industry detail card */
.ind-list-wrap{display:grid;gap:22px}
.ind-d{scroll-margin-top:150px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);overflow:hidden}
.ind-d-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:clamp(22px,2.6vw,34px) clamp(22px,2.6vw,36px) 0}
.ind-d-head .ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(160deg,var(--ink-3),var(--ink-2));color:var(--spark);box-shadow:0 10px 24px -12px rgba(11,20,48,.6)}
.ind-d-head .ic svg{width:26px;height:26px}
.ind-d-head .k{display:block;margin-bottom:4px;font-family:var(--f-display);font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#147A52}
.ind-d-head h2{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.125rem);letter-spacing:-.025em;line-height:1.1}
.ind-intro{padding:16px clamp(22px,2.6vw,36px) 0;max-width:78ch;font-size:var(--fs-md);line-height:1.65;color:var(--d-mid)}
.ind-cols{display:grid;grid-template-columns:1fr 1.1fr 1.2fr;margin-top:24px;border-top:1px solid var(--line-l)}
.ind-col{padding:24px clamp(22px,2.6vw,36px) 28px}
.ind-col+.ind-col{border-left:1px solid var(--line-l)}
.ind-col h3{margin-bottom:14px;font-family:var(--f-display);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--d-lo)}
.ind-who{display:flex;flex-wrap:wrap;gap:6px}
.ind-who li{padding:6px 11px;border-radius:999px;background:var(--pearl);border:1px solid var(--line-l);font-size:13px;font-weight:600;color:var(--d-hi)}
.ind-q{position:relative;margin-top:18px;padding:14px 15px;border-radius:14px 14px 14px 4px;background:linear-gradient(165deg,var(--ink-3),var(--ink-2));color:var(--t-hi);font-size:13.5px;line-height:1.5}
.ind-q .who{display:block;margin-bottom:4px;font-family:var(--f-display);font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--spark)}
.ind-q.out{margin-top:8px;margin-left:18px;border-radius:14px 14px 4px 14px;background:linear-gradient(160deg,#EAF7D9,#D6F0E4);color:var(--d-hi)}
.ind-q.out .who{color:#147A52}
.ind-ul{display:grid;gap:10px}
.ind-ul li{display:grid;grid-template-columns:20px 1fr;gap:10px;font-size:14.5px;line-height:1.5;color:var(--d-hi)}
.ind-ul li svg{width:18px;height:18px;margin-top:2px;color:#147A52}
.ind-ben{display:grid;gap:14px}
.ind-ben li{font-size:14.5px;line-height:1.55;color:var(--d-mid)}
.ind-ben li b{display:block;margin-bottom:2px;font-family:var(--f-display);font-weight:600;font-size:15.5px;color:var(--d-hi)}
.ind-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:16px clamp(22px,2.6vw,36px);background:var(--pearl);border-top:1px solid var(--line-l)}
.ind-foot .t{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:#fff;border:1px solid var(--line-l);font-size:12.5px;font-weight:600;color:var(--d-hi)}
.ind-foot .t i{font-style:normal;color:var(--d-lo);font-weight:500}
.ind-foot .link-arrow{margin-left:auto;font-size:14px}
@media (max-width:1000px){.ind-cols{grid-template-columns:1fr 1fr}.ind-col:first-child{grid-column:1/-1;border-bottom:1px solid var(--line-l)}.ind-col:nth-child(2){border-left:0}}
@media (max-width:680px){.ind-cols{grid-template-columns:1fr}.ind-col+.ind-col{border-left:0;border-top:1px solid var(--line-l)}.ind-col:first-child{border-bottom:0}.ind-d-head{grid-template-columns:auto 1fr}.ind-d-head>.link-arrow{display:none}.ind-d-head .ic{width:48px;height:48px}.ind-foot .link-arrow{margin-left:0;width:100%}}

/* sector page: day timeline */
.tl{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;counter-reset:tl}
.tl::before{content:"";position:absolute;left:0;right:0;top:27px;height:2px;background:linear-gradient(90deg,transparent,rgba(30,156,107,.45) 8%,rgba(30,156,107,.45) 92%,transparent)}
.tl li{position:relative;display:grid;gap:10px;align-content:start}
.tl .time{position:relative;z-index:1;justify-self:start;padding:6px 12px;border-radius:999px;background:var(--d-hi);color:#fff;font-family:var(--f-display);font-weight:700;font-size:13.5px;letter-spacing:.02em;box-shadow:0 0 0 6px var(--pearl)}
.tl b{font-family:var(--f-display);font-size:17px;font-weight:600;line-height:1.25;color:var(--d-hi)}
.tl p{font-size:14px;line-height:1.55;color:var(--d-mid)}
@media (max-width:1000px){.tl{grid-template-columns:1fr;gap:22px;padding-left:4px}.tl::before{left:30px;right:auto;top:10px;bottom:10px;width:2px;height:auto;background:linear-gradient(180deg,rgba(30,156,107,.45),rgba(30,156,107,.15))}.tl li{grid-template-columns:auto 1fr;column-gap:16px}.tl li>b,.tl li>p{grid-column:2}.tl .time{grid-row:1/3;align-self:start;min-width:62px;text-align:center}}

/* source-backed stats */
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.fact{display:grid;gap:8px;align-content:start;padding:24px;border-radius:var(--r-md);background:#fff;border:1px solid var(--line-l)}
.fact .n{font-family:var(--f-display);font-size:clamp(2rem,1.5rem + 1.8vw,3rem);font-weight:600;letter-spacing:-.04em;line-height:1;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
.fact p{font-size:14.5px;line-height:1.55;color:var(--d-hi)}
.fact a.src{font-size:12.5px;font-weight:600;color:#147A52;text-decoration:underline;text-decoration-color:rgba(20,122,82,.3);text-underline-offset:3px}
@media (max-width:860px){.facts{grid-template-columns:1fr}}

/* tiles grid utility */
.tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tgrid .tile .pro{align-self:flex-start;margin-top:auto;padding:3px 9px;border-radius:999px;background:#EAF6DC;color:#147A52;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
@media (max-width:960px){.tgrid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.tgrid{grid-template-columns:1fr}}

/* call mock (dark card on light) */
.callcard{display:grid;gap:10px;padding:18px;border-radius:var(--r-lg);background:linear-gradient(165deg,var(--ink-3),var(--ink-2));color:var(--t-hi);box-shadow:0 30px 60px -30px rgba(11,20,48,.7)}
.callcard .mock-head{border-color:var(--line-d);margin-bottom:4px}
.callcard .bub{font-size:13.5px}
.callcard .sum{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px;padding:11px 13px;border-radius:12px;background:rgba(5,9,20,.45);border:1px solid var(--line-d);font-size:13px}
.callcard .sum b{font-weight:600}

/* blog index */
.blog-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.blog-filter button{padding:9px 16px;border-radius:999px;border:1px solid var(--line-l2);background:#fff;font-family:var(--f-display);font-weight:600;font-size:14px;color:var(--d-hi);transition:background .25s,color .25s,border-color .25s}
.blog-filter button[aria-pressed="true"]{background:var(--d-hi);border-color:var(--d-hi);color:#fff}
.post-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.post-card{display:flex;flex-direction:column;border-radius:var(--r-lg);overflow:hidden;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.post-card:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(11,20,48,.04),0 22px 50px -18px rgba(11,20,48,.22)}
.post-card .th{aspect-ratio:1200/630;background:var(--ink-2);overflow:hidden}
.post-card .th img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.post-card:hover .th img{transform:scale(1.03)}
.post-card .bd{display:grid;gap:10px;padding:22px 24px 24px;flex:1;align-content:start}
.post-card .meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:14px;font-weight:600;color:var(--d-lo)}
.post-card .cat{padding:3px 10px;border-radius:999px;background:#EAF6DC;color:#147A52;font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.post-card h2,.post-card h3{font-size:clamp(1.25rem,1.1rem + .6vw,1.5rem);line-height:1.2;letter-spacing:-.02em;color:var(--d-hi)}
.post-card p{font-size:15px;line-height:1.6;color:var(--d-mid)}
.post-card .link-arrow{margin-top:auto;font-size:14px}
.post-card[hidden]{display:none}
@media (max-width:760px){.post-grid{grid-template-columns:1fr}}

/* article */
.read-bar{position:fixed;left:0;top:0;z-index:130;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--grad-brand);pointer-events:none;display:none}
@supports (animation-timeline:scroll()){.read-bar{display:block;animation:readbar linear both;animation-timeline:scroll(root)}@keyframes readbar{to{transform:scaleX(1)}}}
.post-hero .in{max-width:860px}
.post-hero h1{font-size:clamp(2.25rem,1.5rem + 3vw,4rem);font-weight:600;letter-spacing:-.035em;line-height:1.05}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:26px;font-size:14px;font-weight:600;color:var(--t-mid)}
.post-meta .au{display:inline-flex;align-items:center;gap:10px;color:var(--t-hi)}
.post-meta .au img{width:34px;height:34px;border-radius:50%;background:var(--ink-3);border:1px solid var(--line-d2);object-fit:contain;padding:3px}
.post-meta .dot{width:4px;height:4px;border-radius:50%;background:var(--t-lo)}
.post-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.post-tags span{padding:5px 12px;border-radius:999px;background:rgba(146,214,60,.14);color:var(--spark);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.post-layout{display:grid;grid-template-columns:220px minmax(0,720px);justify-content:center;gap:clamp(40px,5vw,80px)}
.post-toc{position:sticky;top:110px;align-self:start;display:grid;gap:4px;font-size:14px}
.post-toc b{margin-bottom:8px;font-family:var(--f-display);font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--d-lo)}
.post-toc a{padding:7px 0 7px 14px;border-left:2px solid var(--line-l);line-height:1.35;color:var(--d-mid);transition:color .2s,border-color .2s}
.post-toc a:hover,.post-toc a.on{color:var(--d-hi);border-left-color:var(--green)}
@media (max-width:1000px){.post-layout{grid-template-columns:minmax(0,720px)}.post-toc{display:none}}
.prose{font-size:clamp(1.0625rem,1rem + .2vw,1.15rem);line-height:1.75;color:#2A3656}
.prose>*+*{margin-top:1.15em}
.prose h2{margin-top:2.1em;scroll-margin-top:110px;font-size:clamp(1.6rem,1.3rem + 1.1vw,2.1rem);line-height:1.15;letter-spacing:-.025em;color:var(--d-hi)}
.prose h3{margin-top:1.7em;font-size:clamp(1.2rem,1.1rem + .5vw,1.4rem);line-height:1.25;letter-spacing:-.015em;color:var(--d-hi)}
.prose h2+*,.prose h3+*{margin-top:.6em}
.prose a:not(.btn){color:#147A52;font-weight:600;text-decoration:underline;text-decoration-color:rgba(20,122,82,.35);text-underline-offset:3px;transition:text-decoration-color .2s}
.prose a:not(.btn):hover{text-decoration-color:#147A52}
.prose strong{color:var(--d-hi);font-weight:700}
.prose ul.dots,.prose ol.nums{display:grid;gap:.55em;padding-left:0;list-style:none}
.prose ul.dots li{position:relative;padding-left:26px}
.prose ul.dots li::before{content:"";position:absolute;left:4px;top:.68em;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(116,194,45,.16)}
.prose ol.nums{counter-reset:n}
.prose ol.nums li{position:relative;padding-left:44px;counter-increment:n}
.prose ol.nums li::before{content:counter(n);position:absolute;left:0;top:.1em;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--d-hi);color:#fff;font-family:var(--f-display);font-size:14px;font-weight:700;line-height:1}
.prose .lead{font-size:1.2em;line-height:1.6;color:var(--d-hi)}
.prose .key{padding:24px 26px;border-radius:var(--r-md);background:linear-gradient(160deg,#F1F9E8,#E8F5EF);border:1px solid rgba(30,156,107,.18)}
.prose .key b.h{display:block;margin-bottom:10px;font-family:var(--f-display);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#147A52}
.prose .key ul{display:grid;gap:8px}
.prose .key li{position:relative;padding-left:26px;font-size:.96em;line-height:1.6;color:var(--d-hi)}
.prose .key li svg{position:absolute;left:0;top:.3em;width:17px;height:17px;color:#147A52}
.prose blockquote{padding:4px 0 4px 22px;border-left:3px solid var(--green);font-family:var(--f-display);font-size:1.25em;font-weight:600;line-height:1.45;letter-spacing:-.01em;color:var(--d-hi)}
.prose blockquote cite{display:block;margin-top:8px;font-family:var(--f-text);font-size:.65em;font-weight:600;font-style:normal;color:var(--d-lo)}
.prose figure{margin-top:1.8em;margin-bottom:1.8em}
.prose figcaption{margin-top:10px;font-size:13.5px;line-height:1.5;color:var(--d-lo)}
.prose .callcard{font-size:1rem;line-height:1.5}
.ptable-wrap{overflow-x:auto;border-radius:var(--r-md);border:1px solid var(--line-l)}
.ptable{width:100%;border-collapse:collapse;font-size:.92em;line-height:1.5}
.ptable th,.ptable td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-l)}
.ptable thead th{background:var(--d-hi);color:#fff;font-family:var(--f-display);font-weight:600;font-size:.92em}
.ptable tbody tr:nth-child(even){background:var(--pearl)}
.ptable tbody tr:last-child td{border-bottom:0}
.ptable td:first-child{font-weight:600;color:var(--d-hi)}
.ptable tr.tot td{background:#EAF6DC;font-weight:700;color:var(--d-hi)}
.post-cta{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:22px;padding:24px 26px;border-radius:var(--r-lg);background:radial-gradient(80% 120% at 90% 0%,rgba(146,214,60,.25),transparent 55%),linear-gradient(160deg,#16275A,#0A1330);color:var(--t-hi)}
.post-cta img{width:92px;height:auto;filter:drop-shadow(0 12px 18px rgba(0,0,0,.45))}
.post-cta b{display:block;font-family:var(--f-display);font-size:1.2em;font-weight:600;line-height:1.25;letter-spacing:-.01em}
.post-cta p{margin:6px 0 14px;font-size:.92em;line-height:1.55;color:var(--t-mid)}
.post-cta .btn{min-height:46px;font-size:14.5px}
@media (max-width:560px){.post-cta{grid-template-columns:1fr;text-align:left}.post-cta img{width:72px}}
.prose .sources{margin-top:2.4em;padding-top:1.4em;border-top:1px solid var(--line-l);font-size:.85em;line-height:1.6;color:var(--d-mid)}
.prose .sources b{display:block;margin-bottom:8px;font-family:var(--f-display);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--d-lo)}
.prose .sources ol{display:grid;gap:6px;padding-left:18px;list-style:decimal}
.prose .note-ill{padding:12px 14px;border-radius:12px;background:var(--pearl);border:1px dashed var(--line-l2);font-size:.88em;line-height:1.55;color:var(--d-mid)}
.post-faq{margin-top:2.6em}
.post-faq h2{margin-bottom:.8em}
.post-faq .faq{max-width:none}
.post-faq .faq summary{font-size:1.02rem;padding:18px 20px}
.post-faq .faq .a{padding:0 20px 20px;font-size:.98rem;line-height:1.65}
.post-card .th{display:block}
.post-card .link-arrow{margin-top:4px}
.post-card[hidden]{display:none}
.post-card:focus-visible{outline:3px solid var(--g-2,#92D63C);outline-offset:3px}
.cta-band .h-1,.cta-band h2{color:var(--t-hi)}
.cta-band .lede{color:var(--t-mid)}
.cta-band .eyebrow{color:var(--lime)}
.cta-band .bots img:only-child{width:clamp(170px,18vw,250px);margin-left:0}
.callcard .sum .tag{white-space:nowrap;flex:none}
/* No grey tap flash on mobile; focus ring only for keyboard users */
html{-webkit-tap-highlight-color:transparent}
a,button,summary,label,[role=button]{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
:focus:not(:focus-visible){outline:none}
summary::-webkit-details-marker{display:none}
.btn:active{transform:scale(.98)}
/* v9 EdTechPro Portal partner section (schools) */
.etp{background:radial-gradient(70% 60% at 85% 10%,rgba(30,156,107,.16),transparent 60%),radial-gradient(60% 60% at 0% 100%,rgba(26,44,99,.9),transparent 70%),var(--ink-0);color:var(--t-mid);overflow:hidden}
.etp .h-1{color:var(--t-hi)}.etp .lede{color:var(--t-mid)}
.etp-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,5vw,72px);align-items:center}
.etp-copy{display:grid;gap:20px;align-content:start}
.etp-brand{display:flex;align-items:center;gap:12px}
.etp-logo{display:inline-flex;align-items:center;padding:10px 16px;border-radius:14px;background:#fff;box-shadow:0 14px 34px -16px rgba(0,0,0,.6)}
.etp-logo img{width:160px;height:auto;display:block}
.etp-x{font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--t-hi);padding:7px 14px;border-radius:999px;border:1px solid var(--line-d2);background:rgba(255,255,255,.04)}
.etp-feats{list-style:none;padding:0;margin:4px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:16px 22px}
.etp-feats li{display:flex;gap:10px;font-size:14.5px;line-height:1.5}
.etp-feats li svg{flex:none;width:18px;height:18px;margin-top:2px;color:var(--lime)}
.etp-feats b{display:block;font-family:var(--f-display);font-weight:600;color:var(--t-hi);font-size:15px;margin-bottom:2px}
.etp-vis{position:relative;padding:0 0 40px 0}
.etp-screen{border-radius:18px;background:#fff;color:var(--d-hi);box-shadow:0 40px 80px -30px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.06);overflow:hidden;transform:perspective(1400px) rotateY(-6deg) rotateX(2deg);transform-origin:left center;transition:transform .8s var(--ease)}
.etp-vis:hover .etp-screen{transform:perspective(1400px) rotateY(-2deg) rotateX(0)}
.etp-bar{display:flex;align-items:center;gap:12px;padding:11px 16px;background:#F3F5FA;border-bottom:1px solid #E4E8F1;font-family:var(--f-display);font-weight:600;font-size:13px}
.etp-bar .dots{display:flex;gap:5px}.etp-bar .dots i{width:9px;height:9px;border-radius:50%;background:#D5DAE6}
.etp-bar .live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:#147A52;letter-spacing:.06em;text-transform:uppercase}
.etp-bar .live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(116,194,45,.6);animation:etpPulse 1.8s infinite}
@keyframes etpPulse{70%{box-shadow:0 0 0 8px rgba(116,194,45,0)}100%{box-shadow:0 0 0 0 rgba(116,194,45,0)}}
.etp-body{padding:16px;display:grid;gap:10px}
.etp-caller{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;background:linear-gradient(135deg,#0F1C45,#16275A);color:#fff}
.etp-caller .av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--grad-brand);color:#0B1430;font-weight:700;font-size:14px;flex:none}
.etp-caller b{display:block;font-family:var(--f-display);font-size:15px}.etp-caller small{font-size:12px;color:#A9B6D6}
.etp-caller .mis{margin-left:auto;font-size:11.5px;font-weight:600;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);white-space:nowrap}
.etp-note{display:flex;gap:9px;align-items:flex-start;padding:9px 12px;border-radius:10px;background:#FFF7E6;border:1px solid #F5DFAE;font-size:12.5px;color:#6B4E12}
.etp-note svg{width:16px;height:16px;flex:none;margin-top:1px;color:#B7791F}.etp-note b{margin-right:4px}
.etp-h{margin-top:4px;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--d-lo)}
.etp-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;border:1px solid #E7EBF3}
.etp-row .pic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#E6EEFF;color:#1A2C63;font-size:11px;font-weight:700;flex:none}
.etp-row .pic.g{background:#EAF6DC;color:#147A52}
.etp-row b{display:block;font-size:13.5px;font-family:var(--f-display)}.etp-row small{font-size:11.5px;color:var(--d-lo)}
.etp-row .btn-log{margin-left:auto;font-size:11.5px;font-weight:700;padding:6px 10px;border-radius:8px;background:var(--grad-brand);color:#0B1430;white-space:nowrap}
.etp-hist{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;padding:7px 10px;border-radius:8px;background:#F6F8FC;font-size:12px;color:var(--d-mid)}
.etp-phone{position:absolute;right:-14px;bottom:0;width:200px;padding:12px;border-radius:18px;background:linear-gradient(160deg,#1B2B5E,#0B1430);border:1px solid var(--line-d2);box-shadow:0 30px 60px -24px rgba(0,0,0,.8)}
.etp-phone .scr{display:block;padding:12px;border-radius:10px;background:linear-gradient(135deg,#1E9C6B,#74C22D);color:#06140C}
.etp-phone b{display:block;font-family:var(--f-display);font-size:14px}.etp-phone small{font-size:11.5px;opacity:.85}
.etp-cap{margin-top:14px;font-size:12px;color:var(--t-lo)}
.etp-mis{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:1px solid var(--line-d)}
.etp-mis .lbl{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo);margin-right:6px}
.etp-plans{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:18px;margin-top:32px}
.etp-plan,.etp-plus{border-radius:var(--r-lg);padding:26px;border:1px solid var(--line-d2);background:rgba(255,255,255,.03)}
.etp-plan .hd b{display:block;font-family:var(--f-display);font-size:21px;font-weight:600;color:var(--t-hi)}
.etp-plan .hd span{display:block;margin-top:6px;font-size:13.5px;line-height:1.5;color:var(--t-lo)}
.etp-plan ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.etp-plan li{display:flex;gap:9px;font-size:14px;line-height:1.45;color:var(--t-mid)}
.etp-plan li svg{width:16px;height:16px;flex:none;margin-top:2px;color:var(--lime)}
.etp-plan.pro{border-color:rgba(146,214,60,.4);background:linear-gradient(180deg,rgba(146,214,60,.07),rgba(255,255,255,.02))}
.etp-plus{background:linear-gradient(160deg,#16275A,#0D1838);display:grid;gap:12px;align-content:start}
.etp-plus .k{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--lime)}
.etp-plus h3{font-family:var(--f-display);font-size:22px;font-weight:600;color:var(--t-hi);letter-spacing:-.01em}
.etp-plus ol{list-style:none;padding:0;margin:0;display:grid;gap:12px;counter-reset:e}
.etp-plus li{position:relative;padding-left:34px;font-size:13.5px;line-height:1.5;color:var(--t-mid);counter-increment:e}
.etp-plus li::before{content:counter(e);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:rgba(146,214,60,.16);color:var(--lime);font-size:12px;font-weight:700}
.etp-plus li b{display:block;color:var(--t-hi);font-family:var(--f-display);font-weight:600}
.etp-plus .btn{justify-self:start;margin-top:6px}
.etp-src{margin-top:22px;font-size:12.5px;color:var(--t-lo)}.etp-src a{color:var(--t-mid);text-decoration:underline;text-underline-offset:3px}
@media (max-width:1100px){.etp-plans{grid-template-columns:1fr 1fr}.etp-plus{grid-column:1/-1}}
@media (max-width:900px){.etp-grid{grid-template-columns:1fr}.etp-screen{transform:none}.etp-vis:hover .etp-screen{transform:none}.etp-phone{right:-6px;width:180px}}
@media (max-width:640px){.etp-feats{grid-template-columns:1fr}.etp-plans{grid-template-columns:1fr}.etp-hist{grid-template-columns:1fr 1fr auto}.etp-hist span:nth-child(2){display:none}.etp-caller .mis{display:none}.etp-phone{position:relative;right:auto;margin:-28px 0 0 auto}}
@media (prefers-reduced-motion:reduce){.etp-bar .live::before{animation:none}}
.etp .h-1{font-size:clamp(34px,3.6vw,50px);line-height:1.06}
.etp-vis{padding-bottom:96px}
.etp-phone{bottom:6px}
.etp-cap{max-width:52%}
@media (max-width:640px){.etp-vis{padding-bottom:0}.etp-cap{max-width:none}}
@media (max-width:640px){.etp-phone{margin:14px 0 0 auto}.etp-cap{margin-top:10px}}
.etp-mis{display:grid;gap:16px}
.etp-logos{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}
.etp-lg{display:grid;place-items:center;height:76px;padding:12px 14px;border-radius:14px;background:#fff;box-shadow:0 14px 30px -18px rgba(0,0,0,.6);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.etp-lg:hover{transform:translateY(-3px);box-shadow:0 20px 36px -18px rgba(0,0,0,.7)}
.etp-lg img{width:auto;max-width:100%;object-fit:contain;display:block}
@media (max-width:1100px){.etp-logos{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:520px){.etp-logos{grid-template-columns:repeat(2,minmax(0,1fr))}.etp-lg{height:68px}}
.etp-mis .etp-lg{padding:12px 14px;border-radius:14px;border:0;background:#fff;font-size:0}
.agent-body .agent-pro{margin-top:auto;padding:12px 14px;border-radius:14px;background:linear-gradient(160deg,rgba(146,214,60,.14),rgba(146,214,60,.04));border:1px solid rgba(116,194,45,.28);color:var(--d-hi);font-size:var(--fs-xs,13.5px);line-height:1.5}
.agent-body .agent-pro b{display:block;margin-bottom:2px;font-family:var(--f-display);font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--emerald)}

/* ==========================================================================
   Robot motion rig (bot-rig.js). Every robot image is wrapped in .bot-rig.
   ========================================================================== */
:where(.bot-rig){position:relative;display:block;line-height:0}
.bot-rig .bot-lean,.bot-rig .bot-idle{position:relative;display:block;width:100%;height:100%}
.bot-rig .bot-img{display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;margin:0!important;position:static!important;transform:none!important;animation:none!important;filter:none!important;object-fit:contain}
.bot-rig .bot-lean{transform-origin:50% 92%;transform:rotate(var(--lean,0deg));transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.bot-rig .bot-idle{transform-origin:50% 92%;animation:botIdle var(--id,6.5s) ease-in-out var(--idl,0s) infinite}
.bot-fx{position:absolute;inset:0;margin:auto;width:100%;height:auto;max-height:100%;pointer-events:none}
.bot-fx i{position:absolute;display:block}
/* antenna halo */
.bot-ant{border-radius:50%;background:radial-gradient(closest-side,rgba(206,255,120,.55),rgba(146,214,60,.22) 55%,transparent 75%);mix-blend-mode:screen;animation:botAnt var(--gd,3.4s) ease-in-out infinite}
/* eyes: glow + lids */
.bot-eye{border-radius:46%/40%}
.bot-eye::before{content:"";position:absolute;inset:-55% -70%;border-radius:50%;background:radial-gradient(closest-side,rgba(196,255,110,.42),rgba(146,214,60,.12) 60%,transparent 80%);mix-blend-mode:screen;opacity:.45;animation:botGlow var(--gd,3.4s) ease-in-out infinite;transition:opacity .4s}
.bot-eye::after{content:"";position:absolute;inset:-8%;border-radius:inherit;background:var(--visor);opacity:0}
.bot-eye .lid{position:absolute;left:-14%;right:-14%;height:56%;background:var(--visor);box-shadow:0 0 6px 4px var(--visor);transform:scaleY(0);animation:botBlink var(--bd,5.5s) linear var(--bdl,0s) infinite}
.bot-eye .lid.t{top:-6%;transform-origin:50% 0;border-radius:40% 40% 10% 10%/60% 60% 10% 10%}
.bot-eye .lid.b{bottom:-6%;transform-origin:50% 100%;border-radius:10% 10% 40% 40%/10% 10% 60% 60%}
.bot-rig.dbl .bot-eye .lid{animation-name:botBlink2}
.bot-eye .lid.t::after{content:"";position:absolute;left:22%;right:22%;bottom:-7%;height:14%;border-radius:99px;background:#a8ec52;box-shadow:0 0 8px 2px rgba(146,214,60,.6)}
/* mouth (used when talking) */
.bot-mouth{border-radius:40%;opacity:0}
.bot-rig.is-talking .bot-mouth{opacity:1;background:radial-gradient(closest-side,#d8ff8a,#9be04a 70%,rgba(146,214,60,0));box-shadow:0 0 10px 2px rgba(146,214,60,.45);transform-origin:50% 30%;animation:botTalk .32s ease-in-out infinite alternate}
/* boot: eyes flicker on the first time a robot comes into view */
.bot-rig.boot .bot-eye::after{animation:botBoot 1s ease-out both}
.bot-rig.boot .bot-ant{animation:botBoot 1s ease-out reverse both}
/* hover / select hop, brighter eyes */
.bot-rig.hop .bot-lean{animation:botHop .7s cubic-bezier(.3,1.6,.5,1)}
.bot-rig:hover .bot-eye::before,.vpap-item.is-center .bot-eye::before{opacity:.9}
.bot-rig .bot-lean{transform:rotate(var(--lean,0deg)) perspective(800px) rotateX(var(--look,0deg))}
/* only animate robots that are on screen */
.bot-rig:not(.is-live) *,.bot-rig:not(.is-live) *::before,.bot-rig:not(.is-live) *::after{animation-play-state:paused!important}
@keyframes botIdle{0%,100%{transform:translateY(0) rotate(-.9deg)}50%{transform:translateY(-1.4%) rotate(.9deg)}}
@keyframes botAnt{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.18)}}
@keyframes botGlow{0%,100%{opacity:.35}50%{opacity:.75}}
@keyframes botBlink{0%,91%,97%,100%{transform:scaleY(0)}94%{transform:scaleY(1)}}
@keyframes botBlink2{0%,86%,90.5%,92%,96.5%,100%{transform:scaleY(0)}88.2%,94.2%{transform:scaleY(1)}}
@keyframes botTalk{0%{transform:scale(.7,.35)}100%{transform:scale(.85,1.5)}}
@keyframes botBoot{0%{opacity:1}35%{opacity:1}45%{opacity:.2}55%{opacity:.9}70%{opacity:0}80%{opacity:.5}100%{opacity:0}}
@keyframes botHop{0%{transform:rotate(var(--lean,0deg)) translateY(0) scale(1)}35%{transform:rotate(var(--lean,0deg)) translateY(-5%) scale(1.03,.98)}65%{transform:rotate(var(--lean,0deg)) translateY(0) scale(.98,1.02)}100%{transform:rotate(var(--lean,0deg)) translateY(0) scale(1)}}
@media (prefers-reduced-motion:reduce){.bot-rig *,.bot-rig *::before,.bot-rig *::after{animation:none!important;transition:none!important}.bot-rig .bot-lean{transform:none!important}}
/* context sizing: the wrapper takes over from the image */
.bot-rig.stage-bot{aspect-ratio:4/5}
.bot-rig.plan-bot{aspect-ratio:4/5}
.cta-band .bots .bot-rig{width:clamp(120px,14vw,200px);aspect-ratio:4/5;margin-left:-50px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
.cta-band .bots .bot-rig:nth-child(2){width:clamp(150px,17vw,240px);position:relative;z-index:2}
.cta-band .bots .bot-rig:only-child{width:clamp(170px,18vw,250px);margin-left:0}
.phero-bots .bot-rig{width:clamp(110px,12vw,180px);aspect-ratio:4/5;margin-left:-40px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
.agent-art .bot-rig{position:relative;z-index:1;height:280px;aspect-ratio:4/5;width:auto;transition:transform .6s var(--ease)}
.agent:hover .agent-art .bot-rig{transform:translateY(-6px) scale(1.03)}
.phero-art .bot-rig{position:relative;z-index:1;width:100%;aspect-ratio:4/5;filter:drop-shadow(0 30px 40px rgba(0,0,0,.5))}
.vpap-item .bot-rig{width:100%;height:100%;filter:drop-shadow(0 24px 30px rgba(0,0,0,.45));transition:filter .6s}
.vpap-item.is-center .bot-rig{filter:drop-shadow(0 24px 30px rgba(0,0,0,.45)) drop-shadow(0 0 28px rgba(146,214,60,.18))}
.vpap-hero .bot-rig{position:relative;z-index:2;width:100%;height:100%;filter:drop-shadow(0 26px 34px rgba(0,0,0,.5));animation:vpap-bob 4s ease-in-out infinite}
/* Main robot: separate moving parts (head, body, arms) */
.mainbot .mb-rig{position:absolute;top:0;bottom:0;left:50%;height:100%;transform:translateX(-50%);animation:mbBob 5.6s ease-in-out infinite}
.mainbot .mb-p{position:absolute;display:block;max-width:none}
.mainbot img.mb-p,.mainbot .mb-head>img{width:100%;height:100%}
.mainbot .mb-head .bot-fx{inset:0;width:100%;height:100%;margin:0}
.mainbot .mb-arm-l,.mainbot .mb-arm-r{transform-origin:50% 5.3%;transition:transform .9s cubic-bezier(.3,1.3,.5,1)}
.mainbot .mb-arm-l{transform:rotate(6deg);animation:mbArmL 5.6s ease-in-out infinite}
.mainbot .mb-arm-r{transform:rotate(-6deg);animation:mbArmR 5.6s ease-in-out infinite}
.mainbot .mb-head{transform-origin:50% 92%;animation:mbHead 7s ease-in-out infinite}
.mainbot.mb-wave .mb-arm-r{animation:mbWave 2.8s cubic-bezier(.45,0,.3,1) both}
.mainbot.mb-wave .mb-head{animation:mbHeadWave 2.8s ease-in-out both}
.mainbot.is-talking .mb-head{animation:mbNod 1.5s ease-in-out infinite}
.mainbot.is-talking .mb-arm-l{animation:mbGesture 3s ease-in-out infinite}
.mainbot.mb-listen .mb-head{animation:mbListen 3.2s ease-in-out both}
@keyframes mbBob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-1.2%)}}
@keyframes mbArmL{0%,100%{transform:rotate(6deg)}50%{transform:rotate(9deg)}}
@keyframes mbArmR{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(-9deg)}}
@keyframes mbHead{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.6deg)}}
@keyframes mbWave{0%{transform:rotate(-6deg)}20%{transform:rotate(-148deg)}31%{transform:rotate(-126deg)}42%{transform:rotate(-150deg)}53%{transform:rotate(-126deg)}64%{transform:rotate(-148deg)}84%,100%{transform:rotate(-6deg)}}
@keyframes mbHeadWave{0%,100%{transform:rotate(0)}20%,70%{transform:rotate(4deg) translateY(-1%)}}
@keyframes mbNod{0%,100%{transform:rotate(-1deg) translateY(0)}30%{transform:rotate(1.2deg) translateY(1.2%)}60%{transform:rotate(-.6deg) translateY(-.4%)}}
@keyframes mbGesture{0%,100%{transform:rotate(6deg)}40%{transform:rotate(26deg)}60%{transform:rotate(18deg)}}
@keyframes mbListen{0%,100%{transform:rotate(0)}25%,75%{transform:rotate(-5deg)}}
@media (prefers-reduced-motion:reduce){.mainbot .mb-rig,.mainbot .mb-p{animation:none!important}}

/* ==========================================================================
   v3: "More than a phone system" components (Oct 2026)
   ========================================================================== */
:root{--sky:#3C63B8;--sky-2:#A9C2EE;--grad-sky:linear-gradient(100deg,#A9C2EE 0%,#3C63B8 45%,#74C22D 100%)}

/* ---------- nav dropdowns ---------- */
.nav{align-items:center}
.nav a,.nav-t{padding:9px 12px}
.nav-dd{position:relative}
.nav-t{position:relative;display:inline-flex;align-items:center;gap:5px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:700;font-size:15px;color:var(--t-mid);transition:color .25s,background .25s}
.nav-t:hover,.nav-dd:focus-within .nav-t,.nav-dd.open .nav-t{color:var(--t-hi);background:rgba(255,255,255,.05)}
.nav-t[aria-current="page"]{color:var(--t-hi)}
.nav-t[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:3px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--lime)}
.nav-chev{width:14px;height:14px;transition:transform .35s var(--ease)}
.nav-dd.open .nav-chev{transform:rotate(180deg)}
.hdr.is-scrolled .nav-t{color:var(--d-mid)}
.hdr.is-scrolled .nav-t:hover,.hdr.is-scrolled .nav-dd.open .nav-t,.hdr.is-scrolled .nav-t[aria-current="page"]{color:var(--d-hi);background:rgba(11,20,48,.05)}
.dd-panel{position:absolute;top:calc(100% + 14px);left:-14px;z-index:5;width:min(760px,92vw);display:grid;grid-template-columns:1fr 230px;gap:8px;padding:8px;border-radius:22px;background:#fff;color:var(--d-hi);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 30px 80px -24px rgba(5,9,20,.55),0 0 0 1px rgba(11,20,48,.06);opacity:0;visibility:hidden;transform:translateY(10px) scale(.985);transform-origin:20% 0;transition:opacity .28s var(--ease),transform .38s var(--ease),visibility 0s .38s}
.dd-panel::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.dd-panel.sm{width:340px;grid-template-columns:1fr}
.nav-dd.open .dd-panel{opacity:1;visibility:visible;transform:none;transition:opacity .28s var(--ease),transform .38s var(--ease),visibility 0s}
.dd-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.dd-grid.one{grid-template-columns:1fr}
.nav .dd-i{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:14px;color:var(--d-hi);font-weight:500;font-size:14px;transition:background .25s}
.nav .dd-i:hover,.nav .dd-i:focus-visible{background:var(--pearl);color:var(--d-hi)}
.dd-ic{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--ink-2);color:var(--spark);transition:transform .35s var(--ease)}
.dd-i:hover .dd-ic{transform:scale(1.06)}
.dd-ic svg{width:18px;height:18px}
.dd-i b{display:block;font-family:var(--f-display);font-weight:700;font-size:14.5px;line-height:1.3}
.dd-i small{display:block;font-size:12.5px;line-height:1.4;color:var(--d-lo);margin-top:2px}
.nav .dd-side{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:20px;border-radius:16px;background:radial-gradient(120% 90% at 100% 0%,rgba(60,99,184,.35),transparent 60%),radial-gradient(90% 80% at 0% 100%,rgba(146,214,60,.25),transparent 60%),var(--ink-2);color:var(--t-hi);font-weight:500}
.nav .dd-side:hover{background:radial-gradient(120% 90% at 100% 0%,rgba(60,99,184,.45),transparent 60%),radial-gradient(90% 80% at 0% 100%,rgba(146,214,60,.32),transparent 60%),var(--ink-2);color:var(--t-hi)}
.dd-k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-mid);font-weight:600}
.dd-side b{font-family:var(--f-display);font-size:19px;line-height:1.2;letter-spacing:-.01em}
.dd-side .link-arrow{font-size:13.5px;margin-top:8px}
.dd-side .link-arrow svg{width:15px;height:15px}
@media (max-width:1280px){.hdr-tel{display:none}}
@media (max-width:1100px){.nav a,.nav-t{padding:9px 9px;font-size:14px}.hdr-in{gap:18px}}

/* footer titanium */
.ftr-ti{display:inline-flex;align-items:center;gap:12px;margin-top:22px;padding:8px 16px 8px 8px;border-radius:16px;border:1px solid var(--line-d);background:rgba(255,255,255,.03)}
.ftr-ti img{width:52px;height:52px;border-radius:10px}
.ftr-ti span{font-size:12.5px;line-height:1.35;color:var(--t-mid)}
.ftr-ti b{display:block;font-family:var(--f-display);font-size:14px;color:var(--t-hi)}

/* ---------- shared bits ---------- */
.ti-pill{display:inline-flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border-radius:var(--r-pill);border:1px solid var(--line-d2);background:rgba(255,255,255,.04);font-family:var(--f-display);font-weight:600;font-size:13px;color:var(--t-mid)}
.ti-pill img{width:30px;height:30px;border-radius:7px}
.ti-pill b{color:var(--t-hi)}
.sec.dark{background:var(--ink-1);color:var(--t-hi)}
.sec.deep{background:var(--ink-0);color:var(--t-hi)}
.glow-bg{position:relative;overflow:hidden;isolation:isolate}
.glow-bg::before{content:"";position:absolute;inset:-20% -10% auto auto;width:60vw;max-width:820px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(60,99,184,.16),transparent);z-index:-1;pointer-events:none}
.glow-bg::after{content:"";position:absolute;left:-15%;bottom:-30%;width:50vw;max-width:700px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(146,214,60,.12),transparent);z-index:-1;pointer-events:none}
.ic-sq{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(160deg,var(--ink-3),var(--ink-2));color:var(--spark);box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 10px 24px -12px rgba(5,9,20,.6)}
.ic-sq svg{width:21px;height:21px}
.ic-sq.sky{color:var(--sky-2)}
.kicker{font-family:var(--f-display);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--t-lo)}
.light .kicker,.white .kicker{color:var(--d-lo)}
.grad-sky{background:var(--grad-sky);-webkit-background-clip:text;background-clip:text;color:transparent}

/* hero v3 */
.hero-ti{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:6px}
.hero-ti .yrs{display:flex;gap:22px}
.hero-ti .yrs span{font-size:13px;line-height:1.3;color:var(--t-mid)}
.hero-ti .yrs b{display:block;font-family:var(--f-display);font-size:24px;letter-spacing:-.02em;color:var(--t-hi);line-height:1.05}
.fc-sol{right:-8%;top:50%;width:244px;display:grid;gap:10px;animation:bob 7s ease-in-out -2s infinite}
.fc-sol ul{display:grid;gap:7px}
.fc-sol li{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--t-hi);opacity:.35;transform:translateX(-4px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.fc-sol li.on{opacity:1;transform:none}
.fc-sol li i{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:rgba(146,214,60,.16);color:var(--spark)}
.fc-sol li i svg{width:12px;height:12px}
.fc-sol .base{display:flex;align-items:center;justify-content:space-between;padding-top:9px;border-top:1px solid var(--line-d);font-size:11.5px;color:var(--t-lo)}
.fc-ext{left:-4%;bottom:12%;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;animation:bob 6.5s ease-in-out -4s infinite;font-size:13px}
.fc-ext .x{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--grad-btn);color:var(--ink-2);font-family:var(--f-display);font-weight:800;font-size:11px}
.fc-ext b{display:block;font-family:var(--f-display)}
.fc-ext small{color:var(--t-mid)}
@media (max-width:960px){.fc-sol{right:0;top:44%;width:214px}.fc-ext{left:0;bottom:10%}}
@media (max-width:560px){.fc-sol{display:none}.fc-ext{left:auto;right:-2%;bottom:14%}}

/* trust strip */
.trust{border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);background:var(--ink-0)}
.trust-in{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(20px,4vw,56px);padding:26px 0}
.trust-logos{display:flex;align-items:center;justify-content:center;gap:clamp(22px,3.4vw,52px);flex-wrap:nowrap;min-width:0}
.trust .strip-label{max-width:150px}
.trust-logos img{flex:none}
.trust-logos img{height:auto;opacity:.86;transition:opacity .3s}
.trust-logos img:hover{opacity:1}
/* Customer-approved technology partner wall. Static, readable and locally served. */
.company-proof{margin:0;max-width:390px;font-size:14px;line-height:1.55;color:var(--t-mid)}
.company-proof b{display:block;font-size:16px;font-weight:600;color:var(--t-hi)}
.company-proof span{display:block;margin-top:4px}
.technology-partners .trust-in{display:block;padding:32px 0}
.technology-intro{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:22px}
.trust.technology-partners .strip-label{max-width:none;margin:0;flex:none}
.technology-intro>p:last-child{margin:0;color:var(--d-mid);font-size:14px}
.technology-logos{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0}
.technology-logos li{display:flex;align-items:center;justify-content:center;min-width:0;min-height:74px;padding:14px 0}
.technology-logos img{display:block;object-fit:contain;width:100%;height:38px;max-width:125px;filter:none!important;opacity:1!important}
@media(max-width:1100px){.technology-logos{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:600px){.technology-intro{display:block}.technology-intro>p:last-child{margin-top:10px;line-height:1.5}.technology-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.technology-logos li{min-height:66px}.company-proof{max-width:100%}.hero-ti .ti-lock{margin-top:4px}}
@media (max-width:900px){.trust-in{grid-template-columns:1fr;justify-items:center;text-align:center}.trust .strip-label{max-width:none}.trust-logos{flex-wrap:wrap}}

/* vanilla story */
.vstory{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(36px,6vw,96px);align-items:center}
.vstory .prose-l p{font-size:var(--fs-lg);line-height:1.6;color:var(--d-mid);font-weight:400}
.vstory .prose-l p+p{margin-top:16px}
.vstory .prose-l strong{color:var(--d-hi);font-weight:600}
.orbit{position:relative;width:100%;max-width:520px;aspect-ratio:1;justify-self:center}
.orbit-ring{position:absolute;inset:7%;border-radius:50%;border:1px dashed rgba(11,20,48,.14)}
.orbit-ring.r2{inset:22%;border-style:solid;border-color:rgba(11,20,48,.07)}
.orbit-core{position:absolute;left:50%;top:50%;width:38%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 35% 30%,#22336A,var(--ink-2) 62%);box-shadow:0 30px 70px -24px rgba(11,20,48,.55),0 0 0 10px rgba(255,255,255,.7),0 0 0 11px rgba(11,20,48,.06)}
.orbit-core img{width:58%;height:auto;margin:0 auto 4px}
.orbit-core span{display:block;font-family:var(--f-display);font-weight:700;font-size:clamp(11px,1vw,13px);color:var(--t-hi);letter-spacing:.02em}
.orbit-core small{display:block;font-size:11px;color:var(--t-mid)}
.orbit-spin{position:absolute;inset:7%;border-radius:50%;animation:orbitSpin 60s linear infinite}
@keyframes orbitSpin{to{transform:rotate(360deg)}}@keyframes orbitRev{to{transform:rotate(-360deg)}}
.orbit-chip{position:absolute;left:50%;top:50%;width:0;height:0}
.orbit-chip>span{position:absolute;left:0;top:0;translate:-50% -50%;display:inline-flex;align-items:center;gap:8px;padding:8px 13px 8px 8px;border-radius:var(--r-pill);background:#fff;box-shadow:0 12px 30px -14px rgba(11,20,48,.4),0 0 0 1px rgba(11,20,48,.06);font-family:var(--f-display);font-weight:700;font-size:13px;color:var(--d-hi);white-space:nowrap;animation:orbitRev 60s linear infinite}
.orbit-chip i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--ink-2);color:var(--spark)}
.orbit-chip i svg{width:14px;height:14px}
@media (max-width:900px){.vstory{grid-template-columns:1fr}.orbit{max-width:420px}}
.orbit-chip b{font-weight:inherit}.orbit-chip .ls{display:none}
@media (max-width:560px){.orbit-spin,.orbit-ring{inset:16%}.orbit-ring.r2{inset:30%}.orbit-core{width:31%;box-shadow:0 20px 50px -20px rgba(11,20,48,.55),0 0 0 6px rgba(255,255,255,.7)}.orbit-core small{display:none}.orbit-chip>span{font-size:11.5px;padding:6px 10px 6px 6px}.orbit-chip i{width:22px;height:22px}.orbit-chip .lf{display:none}.orbit-chip .ls{display:inline}.trust-logos img{transform:scale(.82)}.trust-logos{gap:14px}}

/* ---------- build your solution ---------- */
.builder{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(20px,3vw,40px);align-items:start}
.bd-presets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.bd-presets span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo);font-weight:700;align-self:center;margin-right:6px}
.bd-preset{padding:8px 14px;border-radius:var(--r-pill);border:1px solid var(--line-d2);font-family:var(--f-display);font-weight:600;font-size:13px;color:var(--t-mid);transition:all .3s var(--ease)}
.bd-preset:hover{color:var(--t-hi);border-color:rgba(169,194,238,.5)}
.bd-preset.on{color:var(--ink-2);background:var(--grad-btn);border-color:transparent}
.bd-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bd-opt{position:relative;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:start;text-align:left;padding:18px;border-radius:20px;border:1px solid var(--line-d);background:linear-gradient(180deg,rgba(26,42,87,.45),rgba(13,22,52,.45));transition:border-color .35s var(--ease),transform .35s var(--ease),background .35s,box-shadow .35s}
.bd-opt:hover{transform:translateY(-2px);border-color:var(--line-d2)}
.bd-opt .ic-sq{grid-row:span 2;width:42px;height:42px}
.bd-opt b{font-family:var(--f-display);font-weight:700;font-size:16px;line-height:1.25;padding-right:26px}
.bd-opt small{font-size:13px;line-height:1.45;color:var(--t-mid)}
.bd-opt .tg{position:absolute;right:14px;top:14px;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line-d2);display:grid;place-items:center;color:transparent;transition:all .3s var(--ease)}
.bd-opt .tg svg{width:13px;height:13px}
.bd-opt[aria-pressed="true"]{border-color:rgba(146,214,60,.6);background:linear-gradient(180deg,rgba(146,214,60,.12),rgba(13,22,52,.5));box-shadow:0 0 0 1px rgba(146,214,60,.25),0 20px 40px -24px rgba(146,214,60,.5)}
.bd-opt[aria-pressed="true"] .tg{background:var(--lime);border-color:var(--lime);color:var(--ink-2)}
.bd-out{position:sticky;top:96px;padding:clamp(20px,2.4vw,30px);border-radius:28px;border:1px solid var(--line-d2);background:radial-gradient(90% 60% at 100% 0%,rgba(60,99,184,.16),transparent 60%),linear-gradient(180deg,var(--ink-3),var(--ink-2));box-shadow:var(--shadow-d)}
.bd-out-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.bd-out-h h3{font-size:var(--fs-xl)}
.bd-count{font-family:var(--f-display);font-weight:700;font-size:12.5px;padding:6px 12px;border-radius:var(--r-pill);background:rgba(146,214,60,.14);color:var(--spark);white-space:nowrap}
.bd-stack{display:flex;flex-direction:column-reverse;gap:8px;min-height:120px}
.bd-layer{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--line-d);animation:layerIn .55s var(--ease) both}
.bd-layer .ic-sq{width:34px;height:34px;border-radius:10px}
.bd-layer .ic-sq svg{width:16px;height:16px}
.bd-layer b{display:block;font-family:var(--f-display);font-size:15px}
.bd-layer p{font-size:13px;line-height:1.5;color:var(--t-mid);margin-top:2px}
.bd-layer.base{background:linear-gradient(100deg,rgba(146,214,60,.16),rgba(60,99,184,.10));border-color:rgba(146,214,60,.3);animation:none}
.bd-layer.base .ic-sq{background:var(--ink-1)}
.bd-layer.base img{width:20px;height:auto}
.bd-empty{padding:14px 16px;border-radius:16px;border:1px dashed var(--line-d2);font-size:13.5px;color:var(--t-lo);text-align:center}
@keyframes layerIn{from{opacity:0;transform:translateY(-14px) scale(.98)}to{opacity:1;transform:none}}
.bd-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line-d)}
.bd-foot p{font-size:13px;color:var(--t-mid);max-width:30ch}
@media (max-width:960px){.builder{grid-template-columns:1fr}.bd-out{position:relative;top:0}}
@media (max-width:560px){.bd-opts{grid-template-columns:1fr}}

/* ---------- ingredient cards ---------- */
.ing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ing{position:relative;display:flex;flex-direction:column;gap:14px;padding:28px;border-radius:24px;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.ing::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--grad-sky);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .45s var(--ease);pointer-events:none}
.ing:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(11,20,48,.35)}
.ing:hover::after{opacity:1}
.ing-top{display:flex;align-items:center;justify-content:space-between}
.ing-n{font-family:var(--f-display);font-weight:700;font-size:13px;color:var(--d-lo);letter-spacing:.06em}
.ing h3{font-size:var(--fs-lg);line-height:1.25}
.ing p{font-size:var(--fs-sm);color:var(--d-mid);line-height:1.6}
.ing ul{display:grid;gap:7px;margin-top:2px}
.ing li{display:flex;gap:9px;font-size:13.5px;line-height:1.45;color:var(--d-hi)}
.ing li svg{flex:none;width:16px;height:16px;margin-top:2px;color:var(--emerald)}
.ing .link-arrow{margin-top:auto;font-size:14px}
@media (max-width:960px){.ing-grid{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.ing-grid{grid-template-columns:1fr}}

/* ---------- keep what works: before / after ---------- */
.ba-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(28px,4vw,48px)}
.ba-toggle{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:5px;border-radius:var(--r-pill);background:rgba(255,255,255,.05);border:1px solid var(--line-d2)}
.ba-toggle button{position:relative;z-index:1;padding:10px 20px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:700;font-size:14px;color:var(--t-mid);transition:color .35s}
.ba-toggle button[aria-pressed="true"]{color:var(--ink-2)}
.ba-toggle::before{content:"";position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:var(--r-pill);background:var(--grad-btn);transition:transform .5s var(--ease)}
.ba.is-after .ba-toggle::before{transform:translateX(100%)}
.ba-stage{position:relative;height:clamp(380px,42vw,520px);border-radius:28px;border:1px solid var(--line-d);background:radial-gradient(60% 70% at 50% 50%,rgba(60,99,184,.10),transparent 70%),linear-gradient(180deg,rgba(17,29,64,.6),rgba(7,12,31,.6));overflow:hidden}
.ba-stage svg.ba-lines{position:absolute;inset:0;width:100%;height:100%}
.ba-lines line{stroke:rgba(169,194,238,.25);stroke-width:1.5;stroke-dasharray:4 7;transition:opacity .6s var(--ease)}
.ba-lines .ok{stroke:url(#baG);stroke-width:2;stroke-dasharray:6 8;opacity:0;animation:dash 1.4s linear infinite}
.ba.is-after .ba-lines .ok{opacity:1}
.ba.is-after .ba-lines .bad{opacity:0}
@keyframes dash{to{stroke-dashoffset:-28}}
.ba-node{position:absolute;left:var(--bx);top:var(--by);transform:translate(-50%,-50%) rotate(var(--br,0deg));display:inline-flex;align-items:center;gap:9px;padding:10px 14px 10px 10px;border-radius:16px;background:rgba(26,42,87,.85);border:1px solid var(--line-d2);font-family:var(--f-display);font-weight:700;font-size:13.5px;white-space:nowrap;box-shadow:var(--shadow-d);transition:left .9s var(--ease),top .9s var(--ease),transform .9s var(--ease),border-color .6s,opacity .6s}
.ba-node i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:rgba(242,118,139,.14);color:var(--rose);transition:background .6s,color .6s}
.ba-node i svg{width:15px;height:15px}
.ba-node em{font-style:normal;font-size:11px;font-weight:600;color:var(--rose);transition:color .6s}
.ba.is-after .ba-node{left:var(--ax);top:var(--ay);transform:translate(-50%,-50%);border-color:rgba(146,214,60,.35)}
.ba.is-after .ba-node i{background:rgba(146,214,60,.16);color:var(--spark)}
.ba.is-after .ba-node em{color:var(--spark)}
.ba-node em.a,.ba.is-after .ba-node em.b{display:none}.ba.is-after .ba-node em.a{display:inline}
.ba-hub{position:absolute;left:50%;top:50%;width:clamp(120px,15vw,168px);aspect-ratio:1;transform:translate(-50%,-50%) scale(.6);border-radius:50%;display:grid;place-items:center;text-align:center;opacity:0;background:radial-gradient(circle at 35% 30%,#22336A,var(--ink-2) 65%);box-shadow:0 0 0 1px rgba(146,214,60,.4),0 0 60px -10px rgba(146,214,60,.55),0 0 120px -20px rgba(60,99,184,.45);transition:opacity .6s var(--ease) .2s,transform .8s var(--ease) .2s}
.ba-hub img{width:64%;margin:0 auto}
.ba-hub small{display:block;font-size:11px;color:var(--t-mid);margin-top:4px}
.ba.is-after .ba-hub{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ba-cap{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}
.ba-cap div{padding:18px 20px;border-radius:18px;border:1px solid var(--line-d);background:rgba(255,255,255,.02)}
.ba-cap b{display:block;font-family:var(--f-display);font-size:16px;margin-bottom:4px}
.ba-cap p{font-size:13.5px;color:var(--t-mid);line-height:1.55}
@media (max-width:760px){.ba-cap{grid-template-columns:1fr}.ba-node{font-size:11.5px;padding:7px 10px 7px 7px;gap:6px}.ba-node i{width:22px;height:22px}.ba .ba-node em{display:none!important}}

/* ---------- experience band ---------- */
.xp{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.xp-c{position:relative;padding:26px;border-radius:24px;border:1px solid var(--line-d);background:linear-gradient(180deg,rgba(26,42,87,.35),rgba(7,12,31,.2));overflow:hidden}
.xp-c b{display:block;font-family:var(--f-display);font-weight:700;font-size:clamp(2.4rem,1.6rem + 2.6vw,3.8rem);letter-spacing:-.04em;line-height:1;background:var(--grad-sky);-webkit-background-clip:text;background-clip:text;color:transparent}
.xp-c span{display:block;margin-top:10px;font-size:var(--fs-sm);color:var(--t-mid);line-height:1.45}
.xp-c.aw{display:flex;align-items:center;gap:16px}
.xp-c.aw img{flex:none;width:68px;height:auto;border-radius:12px}
.xp-c.aw span{margin:0}
.xp-c.aw strong{display:block;font-family:var(--f-display);color:var(--t-hi);font-size:15px;margin-bottom:3px}
.awards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
@media (max-width:960px){.xp{grid-template-columns:1fr 1fr}.awards{grid-template-columns:1fr}}
@media (max-width:480px){.xp{grid-template-columns:1fr}}

/* how we work */
.flow4{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:f;position:relative}
.flow4::before{content:"";position:absolute;left:12.5%;right:12.5%;top:27px;height:2px;background:var(--pearl-2)}
.flow4::after{content:"";position:absolute;left:12.5%;top:27px;height:2px;width:0;background:var(--grad-sky);transition:width 1.6s var(--ease) .2s}
.flow4.is-in::after{width:75%}
.flow4 li{position:relative;display:grid;justify-items:center;text-align:center;gap:10px;padding:0 14px}
.flow4 .n{position:relative;z-index:1;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--line-l2);box-shadow:var(--shadow-l);color:var(--ink-2)}
.flow4 .n svg{width:22px;height:22px}
.flow4 li h3{font-size:var(--fs-lg);margin-top:8px}
.flow4 li p{font-size:var(--fs-sm);color:var(--d-mid);max-width:30ch}
@media (max-width:860px){.flow4{grid-template-columns:1fr 1fr;row-gap:36px}.flow4::before,.flow4::after{display:none}}
@media (max-width:480px){.flow4{grid-template-columns:1fr}}

/* ---------- page hero v3 (subpages) ---------- */
.phero.v3{position:relative;overflow:hidden;isolation:isolate}
.phero.v3::before{content:"";position:absolute;right:-10%;top:-30%;width:70vw;max-width:900px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(60,99,184,.18),transparent);z-index:-1}
.phero.v3::after{content:"";position:absolute;left:-10%;bottom:-50%;width:50vw;max-width:700px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(146,214,60,.12),transparent);z-index:-1}

/* ---------- solutions page ---------- */
.subnav{position:sticky;top:68px;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);border-bottom:1px solid var(--line-l)}
.subnav-in{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:10px 0}
.subnav-in::-webkit-scrollbar{display:none}
.subnav a{flex:none;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:var(--r-pill);font-family:var(--f-display);font-weight:700;font-size:14px;color:var(--d-mid);transition:all .3s var(--ease)}
.subnav a svg{width:16px;height:16px}
.subnav a:hover{color:var(--d-hi);background:var(--pearl)}
.subnav a.on{color:#fff;background:var(--ink-2)}
.subnav a.on svg{color:var(--spark)}
.solx{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:center}
.solx.flip>:first-child{order:2}
.solx-copy{display:grid;gap:18px;align-content:start}
.solx-copy p{font-size:var(--fs-md);line-height:1.65;color:var(--d-mid)}
.dark-sec .solx-copy p,.sec.dark .solx-copy p,.sec.deep .solx-copy p{color:var(--t-mid)}
.solx-pts{display:grid;gap:10px;margin-top:4px}
.solx-pts li{display:flex;gap:12px;font-size:15px;line-height:1.5;font-weight:600}
.solx-pts li svg{flex:none;width:20px;height:20px;padding:3px;border-radius:50%;background:rgba(30,156,107,.12);color:var(--emerald);margin-top:1px}
.sec.dark .solx-pts li svg,.sec.deep .solx-pts li svg{background:rgba(146,214,60,.14);color:var(--spark)}
.solx-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.pull{font-family:var(--f-display);font-weight:700;font-size:clamp(1.25rem,1rem + 1vw,1.75rem);line-height:1.3;letter-spacing:-.015em}
@media (max-width:900px){.solx{grid-template-columns:1fr}.solx.flip>:first-child{order:0}}

/* visual panel */
.vis{position:relative;padding:clamp(18px,2.4vw,28px);border-radius:28px;background:linear-gradient(180deg,var(--ink-3),var(--ink-2));border:1px solid var(--line-d2);color:var(--t-hi);box-shadow:0 40px 90px -40px rgba(11,20,48,.6);overflow:hidden}
.vis::before{content:"";position:absolute;right:-30%;top:-40%;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(60,99,184,.22),transparent);pointer-events:none}
.vis-h{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;font-family:var(--f-display);font-weight:700;font-size:14px}
.vis-h .st{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--spark)}
.vis-h .st::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 0 rgba(146,214,60,.6);animation:pulseDot 2s infinite}
@keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(146,214,60,.55)}70%{box-shadow:0 0 0 8px rgba(146,214,60,0)}100%{box-shadow:0 0 0 0 rgba(146,214,60,0)}}
.vis-note{position:relative;margin-top:14px;font-size:11.5px;color:var(--t-lo)}

/* resilience: failover */
.fo2{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.site{position:relative;padding:16px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.site .k{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-lo);font-weight:700}
.site b{display:block;font-family:var(--f-display);font-size:16px;margin:4px 0 12px}
.site .rk{display:grid;gap:6px}
.site .rk i{display:flex;align-items:center;gap:8px;height:26px;padding:0 10px;border-radius:8px;background:rgba(255,255,255,.05);font-style:normal;font-size:11.5px;color:var(--t-mid)}
.site .rk i::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime)}
.site.b .rk i::before{background:var(--sky)}
.fo2-link{position:relative;margin:14px 0 0;height:44px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--line-d);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--t-mid);font-weight:600}
.fo2-link::before{content:"";position:absolute;left:-30%;top:0;bottom:0;width:30%;background:linear-gradient(90deg,transparent,rgba(146,214,60,.35),transparent);animation:sweep 2.6s var(--ease) infinite}
@keyframes sweep{to{left:100%}}
.fo2-link span{position:relative}
.fo2-rows{position:relative;display:grid;gap:8px;margin-top:14px}
.fo2-rows div{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.03);font-size:13px;color:var(--t-mid)}
.fo2-rows b{font-family:var(--f-display);color:var(--t-hi);font-size:13px}
.fo2-rows .ok{color:var(--spark)}

/* intelligence: wallboard */
.wb3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.wb3 .kpi{padding:14px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.wb3 .kpi span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--t-lo);font-weight:700}
.wb3 .kpi b{display:block;font-family:var(--f-display);font-size:clamp(24px,2.4vw,32px);letter-spacing:-.03em;margin-top:6px;font-variant-numeric:tabular-nums}
.wb3 .kpi.g b{color:var(--spark)}.wb3 .kpi.s b{color:var(--sky-2)}
.wb3-chart{grid-column:1/-1;padding:14px 14px 10px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.wb3-chart .lbl{display:flex;justify-content:space-between;font-size:11.5px;color:var(--t-lo);margin-bottom:8px}
.wb3-bars{display:flex;align-items:flex-end;gap:5px;height:90px}
.wb3-bars i{flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,var(--sky),rgba(60,99,184,.25));height:var(--h);transition:height .9s var(--ease)}
.wb3-bars i.now{background:linear-gradient(180deg,var(--spark),rgba(146,214,60,.3))}
.wb3-agents{grid-column:1/-1;display:grid;gap:6px}
.wb3-agents div{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:9px 12px;border-radius:12px;background:rgba(255,255,255,.03);font-size:13px}
.wb3-agents em{font-style:normal;font-size:11px;font-weight:700;padding:3px 8px;border-radius:var(--r-pill)}
.wb3-agents .on{background:rgba(146,214,60,.14);color:var(--spark)}
.wb3-agents .call{background:rgba(60,99,184,.16);color:var(--sky-2)}
.wb3-agents .wr{background:rgba(244,183,64,.14);color:var(--amber)}
.wb3-agents time{font-size:12px;color:var(--t-lo);font-variant-numeric:tabular-nums}

/* integration hub */
.hub{position:relative;aspect-ratio:1.25;max-height:420px;width:100%}
.hub-c{position:absolute;left:50%;top:50%;width:26%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:28%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#22336A,var(--ink-1));box-shadow:0 0 0 1px rgba(146,214,60,.4),0 0 60px -12px rgba(146,214,60,.6)}
.hub-c img{width:62%}
.hub svg{position:absolute;inset:0;width:100%;height:100%}
.hub svg path{fill:none;stroke:rgba(169,194,238,.25);stroke-width:1.4}
.hub svg path.f{stroke:url(#hubG);stroke-width:2;stroke-dasharray:5 9;animation:dash 1.6s linear infinite}
.hub-n{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:clamp(56px,7vw,72px);aspect-ratio:1;border-radius:18px;display:grid;place-items:center;background:#fff;box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.hub-n img{width:62%;height:auto;max-height:60%;object-fit:contain}
.hub-n.t{width:auto;aspect-ratio:auto;padding:10px 12px;font-family:var(--f-display);font-weight:700;font-size:12px;color:var(--d-hi)}

/* security panel */
.sp{display:grid;gap:8px}
.sp-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line-d);font-size:13.5px}
.sp-row i{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(146,214,60,.14);color:var(--spark)}
.sp-row i svg{width:15px;height:15px}
.sp-row em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--spark);display:inline-flex;align-items:center;gap:6px}
.sp-row em::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.sp-row.al i{background:rgba(244,183,64,.14);color:var(--amber)}
.sp-row.al em{color:var(--amber)}
.pay{margin-top:12px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px;border-radius:16px;background:#fff;color:var(--d-hi)}
.pay i{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--ink-2);color:var(--spark)}
.pay i svg{width:18px;height:18px}
.pay b{display:block;font-family:var(--f-display);font-size:14px}
.pay small{font-size:12px;color:var(--d-lo)}
.pay .lk{font-size:12px;font-weight:700;padding:7px 12px;border-radius:var(--r-pill);background:var(--grad-btn);color:var(--ink-2)}

/* support panel */
.sup-team{display:flex;align-items:center;gap:-8px}
.sup-team span{width:40px;height:40px;margin-left:-8px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--ink-2);font-family:var(--f-display);font-weight:700;font-size:13px;color:var(--ink-2)}
.sup-team span:first-child{margin-left:0}
.sup-tl{display:grid;gap:0;margin-top:16px;border-left:2px solid var(--line-d2);padding-left:18px}
.sup-tl div{position:relative;padding:8px 0 12px}
.sup-tl div::before{content:"";position:absolute;left:-25px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--ink-2);border:2px solid var(--lime)}
.sup-tl time{font-size:11.5px;color:var(--t-lo);font-variant-numeric:tabular-nums}
.sup-tl p{font-size:13.5px;color:var(--t-hi);line-height:1.45}
.sup-badge{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px;padding:14px;border-radius:16px;background:linear-gradient(100deg,rgba(146,214,60,.16),rgba(60,99,184,.12));border:1px solid rgba(146,214,60,.3)}
.sup-badge b{font-family:var(--f-display);font-size:22px}
.sup-badge span{font-size:12.5px;color:var(--t-mid)}

/* ---------- 3CX page ---------- */
.cxapp{position:relative;margin-top:clamp(36px,5vw,64px);border-radius:22px;overflow:hidden;background:#2A2D33;border:1px solid rgba(255,255,255,.08);box-shadow:0 60px 120px -50px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.4);display:grid;grid-template-columns:76px 1fr;grid-template-rows:54px 1fr;color:#E8EAEE}
.cxapp-top{grid-column:1/-1;display:flex;align-items:center;gap:14px;padding:0 18px;background:#1F2126;border-bottom:1px solid rgba(255,255,255,.06)}
.cxapp-top img{height:20px;width:auto}
.cxapp-top .sp{flex:1}
.cxapp-top .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.06);color:#AEB4BF}
.cxapp-top .ic.b{background:#3C63B8;color:#fff}
.cxapp-top .ic svg{width:15px;height:15px}
.cxapp-side{background:#24262B;display:grid;align-content:start;gap:2px;padding:8px 6px}
.cxapp-side span{display:grid;justify-items:center;gap:4px;padding:10px 0;border-radius:10px;font-size:10.5px;color:#9AA1AD}
.cxapp-side span svg{width:18px;height:18px}
.cxapp-side span.on{background:#3C63B8;color:#fff}
.cxapp-main{padding:18px 20px 22px;min-width:0}
.cxapp-main h4{font-size:18px;font-weight:700;letter-spacing:-.01em;margin-bottom:12px}
.cxapp-search{height:36px;border-radius:9px;background:#1F2126;border:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:8px;padding:0 12px;font-size:12.5px;color:#7D8490;margin-bottom:16px}
.cxapp-search svg{width:14px;height:14px}
.cxapp-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.ext{position:relative;display:grid;justify-items:center;gap:6px;padding:16px 10px 12px;border-radius:12px;background:#33363D;border:1px solid rgba(255,255,255,.05);text-align:center;transition:border-color .5s,box-shadow .5s}
.ext .av{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;color:#fff}
.ext .av::after{content:"";position:absolute;right:0;bottom:0;width:11px;height:11px;border-radius:50%;border:2px solid #33363D;background:#3BC46B}
.ext.busy .av::after{background:#F05252}
.ext.away .av::after{background:#F4B740}
.ext b{font-size:12.5px;font-weight:700;line-height:1.25}
.ext small{font-size:11px;color:#9AA1AD}
.ext .acts{display:flex;gap:5px;margin-top:4px}
.ext .acts i{width:24px;height:24px;border-radius:6px;background:rgba(255,255,255,.06);display:grid;place-items:center;color:#AEB4BF}
.ext .acts i svg{width:12px;height:12px}
.ext.ai{border-color:rgba(146,214,60,.7);box-shadow:0 0 0 1px rgba(146,214,60,.35),0 0 30px -8px rgba(146,214,60,.5)}
.ext.ai .av{background:linear-gradient(160deg,#9BDE45,#1E9C6B)}
.ext .ai-t{position:absolute;top:8px;right:8px;font-size:9.5px;font-weight:800;padding:2px 6px;border-radius:5px;background:rgba(146,214,60,.2);color:#B8EB4F}
.cx-toast{position:absolute;right:22px;top:72px;z-index:2;display:flex;gap:12px;align-items:flex-start;max-width:300px;padding:14px 16px;border-radius:14px;background:#fff;color:var(--d-hi);box-shadow:0 30px 60px -20px rgba(0,0,0,.55);animation:toastIn .8s var(--ease) 1s both}
.cx-toast i{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--grad-btn);color:var(--ink-2)}
.cx-toast i svg{width:16px;height:16px}
.cx-toast b{display:block;font-family:var(--f-display);font-size:14px}
.cx-toast small{font-size:12px;color:var(--d-lo);line-height:1.4;display:block;margin-top:2px}
@keyframes toastIn{from{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}
@media (max-width:1000px){.cxapp-grid{grid-template-columns:repeat(3,1fr)}.cxapp-grid .ext:nth-child(n+4){display:none}}
@media (max-width:640px){.cxapp{grid-template-columns:1fr}.cxapp-side{display:none}.cxapp-grid{grid-template-columns:repeat(2,1fr)}.cxapp-grid .ext:nth-child(n+3){display:none}.cx-toast{position:relative;right:auto;top:auto;margin:0 16px 16px;max-width:none}}

/* tech stack */
.stack3{display:grid;gap:12px}
.st-l{position:relative;display:grid;grid-template-columns:150px 1fr auto;gap:18px;align-items:center;padding:20px 22px;border-radius:20px;border:1px solid var(--line-d);background:rgba(255,255,255,.03)}
.st-l.top{border-color:rgba(146,214,60,.45);background:linear-gradient(100deg,rgba(146,214,60,.14),rgba(60,99,184,.06));box-shadow:0 30px 60px -30px rgba(146,214,60,.45)}
.st-l .lg{display:flex;align-items:center;gap:10px}
.st-l .lg img{height:auto}
.st-l b{display:block;font-family:var(--f-display);font-size:16px}
.st-l p{font-size:13.5px;color:var(--t-mid);line-height:1.5;margin-top:3px}
.st-l .role{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:var(--r-pill);border:1px solid var(--line-d2);color:var(--t-mid)}
.st-l.top .role{border-color:rgba(146,214,60,.5);color:var(--spark)}
.st-arrow{display:grid;place-items:center;color:var(--t-lo);height:10px}
.st-arrow svg{width:16px;height:16px}
.stack-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:900px){.stack-wrap{grid-template-columns:1fr}}
@media (max-width:560px){.st-l{grid-template-columns:1fr;gap:10px}.st-l .role{justify-self:start}}

/* provide cards (dark) */
.prov{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.prov article{position:relative;display:grid;gap:12px;align-content:start;padding:26px;border-radius:22px;border:1px solid var(--line-l);background:#fff;box-shadow:var(--shadow-l);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.prov article:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(11,20,48,.35)}
.prov h3{font-size:var(--fs-lg)}
.prov p{font-size:var(--fs-sm);color:var(--d-mid);line-height:1.6}
.prov .new{position:absolute;top:22px;right:22px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;border-radius:var(--r-pill);background:rgba(60,99,184,.14);color:#2E6FC4}
@media (max-width:960px){.prov{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.prov{grid-template-columns:1fr}}

/* AI tabs */
.aitabs{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(20px,3vw,40px);align-items:start}
.ait-list{display:grid;gap:10px}
.ait-btn{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center;text-align:left;padding:18px 20px;border-radius:18px;border:1px solid var(--line-d);background:rgba(255,255,255,.02);transition:all .35s var(--ease)}
.ait-btn b{font-family:var(--f-display);font-size:16px}
.ait-btn small{grid-column:1;font-size:13px;color:var(--t-mid)}
.ait-btn svg{grid-row:span 2;width:18px;height:18px;color:var(--t-lo);transition:transform .35s var(--ease),color .35s}
.ait-btn:hover{border-color:var(--line-d2)}
.ait-btn[aria-selected="true"]{border-color:rgba(146,214,60,.55);background:linear-gradient(100deg,rgba(146,214,60,.12),rgba(255,255,255,.02))}
.ait-btn[aria-selected="true"] svg{color:var(--spark);transform:translateX(3px)}
.ait-panel{padding:clamp(20px,2.6vw,30px);border-radius:26px;border:1px solid var(--line-d2);background:linear-gradient(180deg,var(--ink-3),var(--ink-2));box-shadow:var(--shadow-d)}
.ait-panel[hidden]{display:none}
.ait-panel.show{animation:panelIn .5s var(--ease) both}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ait-ph{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.ait-ph h3{font-size:var(--fs-xl)}
.ait-ph span{font-size:12px;color:var(--t-lo)}
.ait-steps{display:grid;gap:0}
.ait-steps li{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;padding:14px 0;border-top:1px solid var(--line-d)}
.ait-steps li:first-child{border-top:0}
.ait-steps .n{grid-row:span 2;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:#fff;color:var(--emerald);font-family:var(--f-display);font-weight:800;font-size:12px}
.ait-steps b{font-family:var(--f-display);font-size:15.5px}
.ait-steps p{font-size:13.5px;color:var(--t-mid)}
.ait-cta{margin-top:12px;padding:16px 18px;border-radius:16px;background:var(--grad-btn);color:var(--ink-2)}
.ait-cta b{display:block;font-family:var(--f-display);font-size:16px}
.ait-cta span{font-size:13px;opacity:.85}
.ait-note{margin-top:12px;font-size:12px;color:var(--t-lo)}
@media (max-width:900px){.aitabs{grid-template-columns:1fr}.ait-list{grid-template-columns:repeat(3,1fr)}.ait-btn{grid-template-columns:1fr}.ait-btn svg{display:none}}
@media (max-width:620px){.ait-list{grid-template-columns:1fr}}

/* all-included tiles */
.inc{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.inc div{display:grid;gap:10px;align-content:start;padding:22px;border-radius:20px;background:#fff;border:1px solid var(--line-l);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.inc div:hover{transform:translateY(-3px);box-shadow:var(--shadow-l)}
.inc b{font-family:var(--f-display);font-size:16px;line-height:1.3}
.inc p{font-size:13.5px;color:var(--d-mid);line-height:1.55}
.inc .ic-sq{width:40px;height:40px;border-radius:12px}
.inc .ic-sq svg{width:18px;height:18px}
.inc.dk div{background:rgba(255,255,255,.03);border-color:var(--line-d)}
.inc.dk p{color:var(--t-mid)}
.inc.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:960px){.inc,.inc.three{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.inc,.inc.three{grid-template-columns:1fr}}

/* devices */
.dev{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dev figure{margin:0;display:grid;grid-template-rows:220px auto;border-radius:24px;background:#fff;border:1px solid var(--line-l);overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.dev figure:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(11,20,48,.35)}
.dev .im{display:grid;place-items:center;padding:20px;background:radial-gradient(70% 70% at 50% 60%,#fff,#EEF2F9)}
.dev .im img{max-height:180px;width:auto;mix-blend-mode:multiply;transition:transform .6s var(--ease)}
.dev figure:hover .im img{transform:scale(1.04)}
.dev figcaption{padding:18px 20px 22px;border-top:1px solid var(--line-l)}
.dev figcaption b{display:block;font-family:var(--f-display);font-size:16px}
.dev figcaption span{font-size:13.5px;color:var(--d-mid)}
.dev .brand-l{height:16px;width:auto;margin-bottom:8px}
@media (max-width:860px){.dev{grid-template-columns:1fr}}

/* why page */
.story{max-width:760px;margin:0 auto}
.story p{font-size:clamp(1.0625rem,1rem + .35vw,1.25rem);line-height:1.7;color:var(--d-mid);font-weight:400}
.story p+p{margin-top:18px}
.story .big{font-family:var(--f-display);font-weight:700;font-size:clamp(1.5rem,1.1rem + 1.6vw,2.4rem);line-height:1.2;letter-spacing:-.025em;color:var(--d-hi)}
.story .big .hl{color:var(--emerald)}
.scoop{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:clamp(36px,5vw,56px) 0}
.scoop div{padding:24px;border-radius:22px;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l)}
.scoop b{display:block;font-family:var(--f-display);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--emerald);margin-bottom:8px}
.scoop p{font-size:15px!important;line-height:1.55!important}
.manifesto{text-align:center;display:grid;gap:12px;justify-items:center}
.manifesto p{font-family:var(--f-display);font-weight:700;font-size:clamp(1.75rem,1.2rem + 2.6vw,3.4rem);letter-spacing:-.035em;line-height:1.1}
.manifesto p:nth-child(2){color:var(--t-mid)}
.manifesto p:nth-child(3) span{background:var(--grad-sky);-webkit-background-clip:text;background-clip:text;color:transparent}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.split2 p{font-size:var(--fs-md);line-height:1.7;color:var(--d-mid)}
.split2 p+p{margin-top:14px}
.sec.dark .split2 p,.sec.deep .split2 p{color:var(--t-mid)}
@media (max-width:860px){.split2,.scoop{grid-template-columns:1fr}}

/* industry: what else plus can add */
.also3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.also3 a{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:start;padding:20px;border-radius:20px;background:#fff;border:1px solid var(--line-l);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.also3 a:hover{transform:translateY(-3px);box-shadow:var(--shadow-l)}
.also3 .ic-sq{grid-row:span 2;width:40px;height:40px}
.also3 b{font-family:var(--f-display);font-size:16px}
.also3 span{font-size:13.5px;color:var(--d-mid);line-height:1.5}
@media (max-width:820px){.also3{grid-template-columns:1fr}}

/* contact: needs checkboxes */
.needs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.needs label{position:relative;cursor:pointer}
.needs input{position:absolute;opacity:0;pointer-events:none}
.needs span{display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:14px;border:1px solid var(--line-l2);background:#fff;font-family:var(--f-display);font-weight:600;font-size:14px;color:var(--d-hi);transition:all .25s var(--ease)}
.needs span svg{width:16px;height:16px;color:var(--d-lo);transition:color .25s}
.needs input:checked+span{border-color:var(--emerald);background:rgba(30,156,107,.07);box-shadow:0 0 0 1px var(--emerald) inset}
.needs input:checked+span svg{color:var(--emerald)}
.needs input:focus-visible+span{outline:2px solid var(--emerald);outline-offset:2px}
@media (max-width:620px){.needs{grid-template-columns:1fr 1fr}}

@media (prefers-reduced-motion:reduce){
  .orbit-spin,.orbit-chip>span,.ba-lines .ok,.hub svg path.f,.fo2-link::before,.vis-h .st::before{animation:none!important}
  .ba-node,.ba-hub,.bd-layer,.flow4::after{transition:none!important;animation:none!important}
}
.why-chips .bd-preset{color:var(--d-hi);border-color:var(--line-l2);background:#fff}
.why-chips .bd-preset svg{width:16px;height:16px;color:var(--emerald)}
.why-chips .bd-preset:hover{border-color:var(--d-hi);color:var(--d-hi)}
.light .xp-c{border-color:transparent;box-shadow:0 30px 60px -36px rgba(11,20,48,.55)}
.sec.deep .split2 h2{color:var(--t-hi)}
@media (min-width:1101px){.ftr-grid{grid-template-columns:1.5fr repeat(5,1fr);gap:clamp(24px,3vw,44px)}}
@media (min-width:861px) and (max-width:1100px){.ftr-grid{grid-template-columns:repeat(5,1fr)}}
.pull.lg{font-size:var(--fs-2xl);letter-spacing:-.03em;line-height:1.1}
@media (min-width:900px){.subnav-in{justify-content:center}}
@media (max-width:560px){.ai-vis{grid-template-columns:1.3fr .7fr!important}.ai-vis .fo2-rows div{flex-direction:column;align-items:flex-start;gap:2px}}
.sep-note{display:grid;gap:6px;padding:16px 18px;border-radius:16px;border:1px solid var(--line-l2);background:#fff}
.sep-note b{font-family:var(--f-display);font-size:15px;color:var(--d-hi)}
.sep-note p{font-size:13.5px!important;line-height:1.55!important;color:var(--d-mid)}
.sep-note span{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:4px}
.sep-note .link-arrow{font-size:13.5px}
.sec.dark .sep-note,.sec.deep .sep-note{background:rgba(255,255,255,.03);border-color:var(--line-d2)}
.sec.dark .sep-note b,.sec.deep .sep-note b{color:var(--t-hi)}
.sec.dark .sep-note p,.sec.deep .sep-note p{color:var(--t-mid)}
@media (min-width:821px){.stats.s3{grid-template-columns:repeat(3,1fr)}}@media (max-width:820px){.stats.s3{grid-template-columns:1fr}}
.q-res{display:flex;align-items:baseline;gap:10px;margin:14px 0 4px;font-size:14px;color:var(--t-mid)}
.q-res b{font-family:var(--f-display);font-size:clamp(28px,3vw,38px);letter-spacing:-.03em;background:linear-gradient(90deg,#A9C2EE,#92D63C);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ==========================================================================
   Brand refinement layer (Oct 2026): aligns to the Vanilla Plus brand pack
   Midnight #0B1430 · Deep Navy #1C2F5F · Vanilla Green #74C22D
   Sky Blue #3C63B8 · Ice Blue #A9C2EE · premium gradient #B8EB4F→#6CC72D→#1E9C6B
   ========================================================================== */
:root{
  --ink-0:#08102A; --ink-1:#0B1430; --ink-2:#101C40; --ink-3:#16264F; --ink-4:#1C2F5F;
  --navy:#1C2F5F; --sky-b:#3C63B8;
  --sky:#3C63B8; --sky-2:#A9C2EE;
  --grad-brand:linear-gradient(100deg,#B8EB4F 0%,#6CC72D 45%,#1E9C6B 100%);
  --grad-sky:linear-gradient(100deg,#A9C2EE 0%,#3C63B8 55%,#74C22D 100%);
  --line-d:rgba(169,194,238,.12); --line-d2:rgba(169,194,238,.22);
  --t-mid:#AFBCDA; --t-lo:#7F8DB2;
}
body{background:var(--ink-1)}
/* Dark surfaces: brand navy, not black */
.sec.dark{background:linear-gradient(180deg,#0B1430 0%,#0E1A3C 100%)}
.sec.deep{background:linear-gradient(135deg,#1C2F5F 0%,#0B1430 70%)}
.trust,.strip{background:#0A1330}
.ftr{background:#08102A}
.phero{background:radial-gradient(70% 80% at 85% -10%,rgba(60,99,184,.45) 0%,transparent 60%),linear-gradient(180deg,#0B1430 0%,#0E1A3C 100%)}
/* Glows: one quiet sky light, no green corner blobs */
.glow-bg::before{background:radial-gradient(closest-side,rgba(60,99,184,.22),transparent)}
.glow-bg::after{display:none}

/* Section labels: quieter, blue-led with a green dash */
.eyebrow{font-size:12.5px;letter-spacing:.16em;font-weight:700;color:var(--sky-2)}
.eyebrow::before{display:block!important;content:"";width:18px;height:2px;border-radius:2px;background:var(--green)}
.light .eyebrow,.white .eyebrow,.clients .eyebrow{color:var(--sky-b)}
.cta-band .eyebrow,.phero .eyebrow,.dark .eyebrow,.deep .eyebrow{color:var(--sky-2)}
.sec-head.center .eyebrow{justify-content:center}

/* Icon tiles: lighter, brand-tinted rather than heavy dark squares */
.ic-sq{width:42px;height:42px;border-radius:12px;background:#EDF2FB;color:var(--navy);box-shadow:none}
.ic-sq svg{width:20px;height:20px}
.dark .ic-sq,.deep .ic-sq,.tile.dark .ic-sq,.vis .ic-sq,.bd .ic-sq{background:rgba(169,194,238,.08);color:var(--spark);box-shadow:0 0 0 1px rgba(169,194,238,.14) inset}
.ic-sq.sky{color:var(--sky-2)}
.light .ic-sq.sky,.white .ic-sq.sky{color:var(--sky-b)}

/* Numbers: solid, confident, no rainbow gradients */
.xp-c b{background:none;color:#fff;-webkit-text-fill-color:currentColor}
.xp-c b .u,.xp-c b small{color:var(--green)}
.stat{border:0;background:none;border-radius:0;padding:20px 0 0;border-top:1px solid var(--line-d2)}
.q-res b{background:none;color:var(--spark);-webkit-text-fill-color:currentColor}

/* 3CX Titanium: sits cleanly on the page, no bubble */
.ti-pill,.ti-lock{display:inline-flex;align-items:center;gap:12px;padding:0;border:0;background:none;border-radius:0;font-family:var(--f-display);font-weight:500;font-size:13px;line-height:1.3;color:var(--t-mid)}
.ti-pill img,.ti-lock img{width:48px;height:48px;border-radius:0;flex:none}
.ti-pill b,.ti-lock b{display:block;color:var(--t-hi);font-weight:700;font-size:14.5px}
.ftr-ti{padding:0;border:0;background:none;border-radius:0;gap:14px}
.ftr-ti img{width:56px;height:56px;border-radius:0}
.hero-ti{gap:clamp(18px,2.4vw,32px)}
.hero-ti .ti-lock{padding-left:clamp(18px,2.4vw,32px);border-left:1px solid var(--line-d2)}
.light .ti-lock,.white .ti-lock{color:var(--d-mid)}.light .ti-lock b,.white .ti-lock b{color:var(--d-hi)}

/* Home: ingredients as an editorial index, not a card grid */
.ing-grid{grid-template-columns:1fr;gap:0;border-top:1px solid var(--line-l2)}
.ing{display:grid;grid-template-columns:110px minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"n h ul" "n p ul" "n a ul";column-gap:clamp(24px,4vw,64px);row-gap:10px;padding:clamp(28px,3vw,40px) 8px;border-radius:0;background:none;border:0;border-bottom:1px solid var(--line-l2);box-shadow:none;transition:background .4s var(--ease)}
.ing::after{display:none}
.ing:hover{transform:none;box-shadow:none;background:linear-gradient(90deg,rgba(60,99,184,.05),transparent 70%)}
.ing-top{grid-area:n;align-self:start;display:block}
.ing-top .ic-sq{display:none}
.ing-n{display:block;font-size:clamp(40px,4vw,56px);font-weight:600;letter-spacing:-.04em;line-height:.9;color:transparent;-webkit-text-stroke:1.2px var(--sky-b);transition:color .4s var(--ease)}
.ing:hover .ing-n{color:var(--green);-webkit-text-stroke-color:var(--green)}
.ing h3{grid-area:h;font-size:var(--fs-xl);letter-spacing:-.025em}
.ing p{grid-area:p;font-size:var(--fs-md);max-width:46ch}
.ing ul{grid-area:ul;align-self:start;gap:10px;margin:6px 0 0}
.ing li{font-size:14.5px}
.ing .link-arrow{grid-area:a;margin-top:6px}
@media (max-width:860px){.ing{grid-template-columns:64px 1fr;grid-template-areas:"n h" "n p" "n ul" "n a"}.ing-n{font-size:36px}}

/* Picker embedded on home: the section already has a heading */
.vpap.is-embedded #s-choose .vpap-eyebrow,.vpap.is-embedded #s-choose .vpap-h1{display:none}

/* 3CX mockup accents in brand Sky */
.cxapp-top .ic.b,.cxapp-side span.on{background:var(--sky-b)}
/* Credentials: typographic stats and awards sitting on the page, no boxes */
.xp{gap:0 clamp(20px,3vw,40px)}
.xp-c{padding:24px 0 0;border:0;border-top:1px solid var(--line-d2);border-radius:0;background:none!important;overflow:visible}
.awards{gap:0 clamp(20px,3vw,40px);margin-top:clamp(28px,3vw,40px)}
.xp-c.aw{padding:22px 0 0;align-items:center}
.xp-c.aw img{border-radius:0}
.light .xp-c,.white .xp-c{border-top-color:var(--line-l2)}
.light .xp-c b,.white .xp-c b{color:var(--d-hi)}
.light .xp-c span,.white .xp-c span{color:var(--d-mid)}
.light .xp-c.aw strong,.white .xp-c.aw strong{color:var(--d-hi)}
.light .xp-c b .u{color:var(--emerald)}
.xp-c,.light .xp-c,.white .xp-c{box-shadow:none!important}
#proof .quote{margin-top:clamp(48px,6vw,80px)!important;padding:clamp(36px,4vw,56px) 0 0;background:none;border:0;border-top:1px solid var(--line-d2);border-radius:0;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px clamp(32px,5vw,80px);align-items:end}
#proof .quote blockquote{grid-column:1;font-size:clamp(1.5rem,1.1rem + 1.4vw,2.25rem);line-height:1.25;letter-spacing:-.02em}
#proof .quote .q-res{grid-column:2;grid-row:1;align-self:end;flex-direction:column;align-items:flex-start;gap:6px;margin:0;font-size:15px}
#proof .quote .q-res b{font-size:clamp(56px,6vw,88px);line-height:.9;letter-spacing:-.05em}
#proof .quote figcaption{grid-column:1/-1;margin-top:10px}
@media (max-width:820px){#proof .quote{grid-template-columns:1fr}#proof .quote .q-res{grid-column:1;grid-row:auto}}
.phero-bots{right:max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)));bottom:0}
@media (max-width:560px){.hero-ti .ti-lock{padding-left:0;border-left:0}.xp{grid-template-columns:1fr 1fr!important;row-gap:22px}.awards{row-gap:4px}.ing{padding-left:0;padding-right:0}}
/* Trust strip as a white box under the hero, logos in colour */
.trust.trust-box{border:0;background:linear-gradient(180deg,var(--ink-1) 0 50%,var(--pearl) 50% 100%);position:relative;z-index:2;margin-top:-1px}
.trust.trust-box.to-dark{background:linear-gradient(180deg,var(--ink-1) 0 50%,#0B1430 50% 100%)}
.trust-box .trust-in{background:#fff;border-radius:24px;padding:26px clamp(24px,3.5vw,44px);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 30px 70px -30px rgba(5,10,30,.55),0 8px 24px -12px rgba(11,20,48,.18)}
.trust-box .strip-label{color:var(--d-lo)}
.trust-box .trust-logos img{opacity:1;filter:none}
.trust-box .ti-lock{color:var(--d-mid)}
.trust-box .ti-lock b{color:var(--d-hi)}
.trust-box .ti-lock{padding-left:clamp(20px,3vw,40px);border-left:1px solid var(--line-l2)}
@media (max-width:900px){.trust-box .ti-lock{padding-left:0;border-left:0}.trust-box .trust-in{padding:22px}}
.trust.trust-box.to-dark{background:linear-gradient(180deg,#0E1A3C 0 50%,#0B1430 50% 100%)}
.trust.trust-box,.trust.trust-box.to-dark{--ov:56px;margin-top:calc(var(--ov) * -1);background:linear-gradient(180deg,transparent 0 var(--ov),var(--pearl) var(--ov) 100%)}
.trust.trust-box.to-dark{background:linear-gradient(180deg,transparent 0 var(--ov),#0B1430 var(--ov) 100%)}
@media (max-width:900px){.trust-box .trust-in{width:calc(100% - 32px);margin:0 auto}.trust.trust-box,.trust.trust-box.to-dark{--ov:40px}}
.trust.trust-box.to-dark{background:linear-gradient(180deg,transparent 0 var(--ov),#0E1A3C var(--ov),#0B1430 100%)}
@media (max-width:900px){.trust-box .trust-logos{flex-wrap:nowrap;gap:clamp(16px,6vw,28px)}.trust-box .trust-logos img{height:22px;width:auto}}
@media (max-width:900px){.trust-box .trust-logos img[alt="3CX"]{height:28px}}
/* Trust bar: full-width white bar under the hero, logos in colour */
.trust.trust-bar{background:#fff;border:0;border-bottom:1px solid var(--line-l);margin:0}
.trust-bar .trust-in{grid-template-columns:auto 1fr;padding:24px 0}
.trust-bar .strip-label{color:var(--d-lo);max-width:130px}
.trust-bar .trust-logos{justify-content:space-between;gap:clamp(18px,2.4vw,40px)}
.trust-bar .trust-logos img,.trust-bar .tl-ms{opacity:1;filter:none}
.tl-ms{display:inline-flex;align-items:center;gap:8px;flex:none}
.tl-ms b{font-family:"Segoe UI",var(--f-text);font-weight:600;font-size:15px;color:#3A3A3A;letter-spacing:-.01em;white-space:nowrap}
.trust-bar .trust-logos img[alt="3CX"]{height:30px;width:auto}
.trust-bar .trust-logos img[alt="Yealink"]{height:22px;width:auto}
.trust-bar .trust-logos img[alt="Fanvil"]{height:22px;width:auto}
.trust-bar .trust-logos img[alt="HubSpot"]{height:26px;width:auto}
.trust-bar .trust-logos img[alt="Salesforce"]{height:36px;width:auto}
.trust-bar .tl-ms img{height:26px;width:auto}
@media (max-width:1100px){.trust-bar .trust-in{grid-template-columns:1fr;justify-items:center;text-align:center;gap:16px}.trust-bar .strip-label{max-width:none}.trust-bar .trust-logos{flex-wrap:wrap;justify-content:center;gap:18px 28px}}
@media (max-width:560px){.trust-bar .trust-logos{gap:16px 22px}.trust-bar .trust-logos img[alt="3CX"]{height:24px}.trust-bar .trust-logos img[alt="Yealink"],.trust-bar .trust-logos img[alt="Fanvil"]{height:18px}.trust-bar .trust-logos img[alt="HubSpot"]{height:22px}.trust-bar .trust-logos img[alt="Salesforce"]{height:30px}.trust-bar .tl-ms img{height:22px}.tl-ms b{font-size:13.5px}}
@media (max-width:560px){.trust-bar .trust-logos{gap:14px 18px}}

/* ==========================================================================
   Phase 2: partners, offices, remote support, secure payments,
   network diagrams, integrations, 3CX news, downloads, referrals
   ========================================================================== */

/* partner wall */
.pwall-sec{background:#fff;color:var(--d-hi);padding:clamp(72px,8vw,120px) 0;border-top:1px solid var(--line-l)}
.pwall-head{display:grid;gap:14px;max-width:720px;margin-bottom:clamp(32px,4vw,52px)}
.pwall-head p{color:var(--d-mid);font-size:var(--fs-md)}
.pwall-sec .eyebrow{color:var(--emerald)}
.pwall{display:grid;gap:0;border-top:1px solid var(--line-l)}
.pw-row{display:grid;grid-template-columns:200px 1fr;align-items:stretch;border-bottom:1px solid var(--line-l)}
.pw-k{display:flex;align-items:center;margin:0;padding:18px 0;font-family:var(--f-display);font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--d-lo)}
.pw-logos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;padding:0;list-style:none}
.pw-logos li{display:grid;place-items:center;height:104px;padding:14px 18px}
.pw-logos img{height:var(--h,36px);width:auto;max-width:100%;object-fit:contain}
@media (max-width:900px){.pw-row{grid-template-columns:1fr}.pw-k{padding:18px 0 4px}.pw-logos{grid-template-columns:repeat(3,minmax(0,1fr))}.pw-logos li{height:92px}}
@media (max-width:480px){.pw-logos img{height:calc(var(--h,36px)*.82)}}

/* offices */
.offices{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,4vw,56px);align-items:center;padding:clamp(24px,3vw,40px);border-radius:32px;background:radial-gradient(70% 80% at 20% 30%,rgba(60,99,184,.28),transparent 70%),linear-gradient(170deg,var(--ink-3),var(--ink-1));border:1px solid var(--line-d2);color:var(--t-hi);overflow:hidden}
.of-map{position:relative;width:min(380px,100%);aspect-ratio:100/148.8;justify-self:center}
.of-map>img{width:100%;height:100%;display:block;opacity:.55}
.of-pin{position:absolute;left:var(--x);top:var(--y);width:0;height:0}
.of-pin i{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;background:var(--spark);box-shadow:0 0 0 4px rgba(184,235,79,.22),0 0 24px rgba(184,235,79,.8)}
.of-pin i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(184,235,79,.6);animation:ofPing 2.6s var(--ease) infinite}
.of-pin:nth-child(3) i::after{animation-delay:.8s}.of-pin:nth-child(4) i::after{animation-delay:1.6s}
.of-pin b{position:absolute;white-space:nowrap;font-family:var(--f-display);font-size:13px;font-weight:700;padding:5px 10px;border-radius:999px;background:rgba(7,12,31,.82);border:1px solid var(--line-d2);backdrop-filter:blur(6px);transform:translate(-50%,-100%);top:-14px;left:0}
.of-pin.l b{left:auto;right:14px;top:-12px;transform:none}
@keyframes ofPing{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.6);opacity:0}}
.of-list{display:grid;gap:14px}
.of-card{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;padding:20px 22px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid var(--line-d);transition:border-color .3s,background .3s}
.of-card:hover{border-color:rgba(184,235,79,.35);background:rgba(255,255,255,.06)}
.of-card .n{grid-row:span 3;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(146,214,60,.12);color:var(--spark);font-family:var(--f-display);font-weight:700}
.of-card h3{margin:0;font-size:var(--fs-lg);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.of-card h3 small{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.of-card address{font-style:normal;color:var(--t-mid);font-size:var(--fs-sm);line-height:1.55}
.of-card .of-a{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;font-weight:600}
.of-card .of-a a{color:var(--t-hi)}.of-card .of-a a:hover{color:var(--spark)}
@media (max-width:860px){.offices{grid-template-columns:1fr}.of-map{width:min(260px,70%)}}

/* remote support */
.rs-hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.rs-box{position:relative;padding:clamp(24px,3vw,36px);border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--line-d2);box-shadow:0 40px 100px -40px rgba(0,0,0,.8);backdrop-filter:blur(10px);overflow:hidden}
.rs-box::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(140deg,rgba(184,235,79,.55),transparent 40%,transparent 60%,rgba(60,99,184,.6));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.rs-box h2{font-size:var(--fs-xl);margin:0 0 6px}
.rs-box>p{color:var(--t-mid);font-size:var(--fs-sm);margin:0 0 22px}
.rs-code{position:relative}
.rs-code input{width:100%;height:76px;padding:0 22px;border-radius:18px;border:1px solid var(--line-d2);background:rgba(5,9,20,.55);color:var(--t-hi);font-family:var(--f-display);font-size:clamp(26px,3.4vw,34px);font-weight:700;letter-spacing:.32em;text-align:center;outline:none;transition:border-color .25s,box-shadow .25s;font-variant-numeric:tabular-nums}
.rs-code input::placeholder{color:rgba(169,194,238,.28)}
.rs-code input:focus{border-color:var(--lime);box-shadow:0 0 0 4px rgba(146,214,60,.16)}
.rs-row{display:flex;gap:12px;margin-top:14px}
.rs-row .btn{flex:1;justify-content:center}
.rs-status{min-height:56px;margin-top:16px;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;font-size:14px;color:var(--t-mid);background:rgba(255,255,255,.03);border:1px solid var(--line-d);transition:all .3s var(--ease)}
.rs-status .ic{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(169,194,238,.1);color:var(--ice)}
.rs-status .ic svg{width:16px;height:16px}
.rs-status[data-s="busy"] .ic svg{animation:spin 1s linear infinite}
.rs-status[data-s="ok"]{border-color:rgba(146,214,60,.4);background:rgba(146,214,60,.08);color:var(--t-hi)}
.rs-status[data-s="ok"] .ic{background:var(--lime);color:#0A1A06}
.rs-status[data-s="err"]{border-color:rgba(242,118,139,.45);background:rgba(242,118,139,.08);color:#FFD5DC}
.rs-status[data-s="err"] .ic{background:rgba(242,118,139,.2);color:var(--rose)}
@keyframes spin{to{transform:rotate(360deg)}}
.rs-trust{display:flex;gap:10px;margin-top:16px;font-size:12.5px;color:var(--t-lo)}
.rs-trust svg{flex:none;width:16px;height:16px;color:var(--lime)}
.rs-alt{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-size:13px}
.rs-alt a{color:var(--ice);font-weight:600}.rs-alt a:hover{color:var(--spark)}
.rs-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px);counter-reset:s}
.rs-step{position:relative;padding:26px;border-radius:24px;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l)}
.rs-step .art{height:120px;margin:-6px -6px 18px;border-radius:16px;background:linear-gradient(160deg,var(--ink-3),var(--ink-2));display:grid;place-items:center;overflow:hidden}
.rs-step .art svg{width:100%;height:100%}
.rs-step h3{font-size:var(--fs-lg);margin:0 0 6px;display:flex;gap:10px;align-items:center}
.rs-step h3::before{counter-increment:s;content:counter(s);width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:13px;background:var(--pearl-2);color:var(--d-hi)}
.rs-step p{margin:0;color:var(--d-mid);font-size:var(--fs-sm)}
@media (max-width:900px){.rs-hero .wrap{grid-template-columns:1fr}.rs-steps{grid-template-columns:1fr}}

/* shared diagram look */
.dia{position:relative;border-radius:30px;padding:clamp(18px,2.6vw,32px);background:radial-gradient(60% 70% at 85% 0%,rgba(60,99,184,.28),transparent 70%),linear-gradient(180deg,var(--ink-3),var(--ink-1));border:1px solid var(--line-d2);color:var(--t-hi);overflow:hidden;box-shadow:0 40px 90px -40px rgba(11,20,48,.55)}
.dia::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(169,194,238,.08) 1px,transparent 1px);background-size:26px 26px;pointer-events:none;mask-image:linear-gradient(180deg,#000,transparent 85%);-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%)}
.dia>*{position:relative;z-index:1}
.dia svg{display:block;width:100%;height:auto;overflow:visible}
.dia-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.dia-top b{font-family:var(--f-display);font-size:15px}
.dia-pill{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;font-size:12.5px;font-weight:700;background:rgba(146,214,60,.12);color:var(--spark);border:1px solid rgba(146,214,60,.3);transition:all .4s var(--ease)}
.dia-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}
.dia-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid var(--line-d2);background:rgba(255,255,255,.05);color:var(--t-hi);font:600 13px var(--f-display);cursor:pointer;transition:all .3s var(--ease)}
.dia-btn:hover{border-color:var(--lime);color:var(--spark)}
.dia-btn svg{width:15px;height:15px}
.dia-note{margin-top:12px;font-size:11.5px;color:var(--t-lo)}
/* svg primitives */
.dn rect{fill:rgba(17,29,64,.92);stroke:rgba(169,194,238,.28);stroke-width:1}
.dn.hi rect{stroke:rgba(184,235,79,.55)}
.dn text{fill:#F2F6FD;font:600 13px Urbanist,system-ui,sans-serif}
.dn text.s{fill:#A7B4D3;font-weight:500;font-size:11px}
.dn text.k{fill:#B8EB4F;font-weight:700;font-size:9.5px;letter-spacing:.14em}
.dl-base{fill:none;stroke:rgba(169,194,238,.22);stroke-width:2}
.dl-flow{fill:none;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:2 14;animation:dflow 1.1s linear infinite}
.dl-flow.slow{animation-duration:1.8s}
.dl-stand{fill:none;stroke:rgba(169,194,238,.35);stroke-width:1.6;stroke-dasharray:4 6}
@keyframes dflow{to{stroke-dashoffset:-32}}
.d-ic{color:#B8EB4F}
/* outage simulation */
.ha .p-prim rect{transition:stroke .4s,fill .4s}
.ha .x-mark{opacity:0;transition:opacity .3s}
.ha.is-out .p-prim rect{stroke:rgba(242,118,139,.8);fill:rgba(64,17,32,.85)}
.ha.is-out .p-prim text.k{fill:#F2768B}
.ha.is-out .x-mark{opacity:1}
.ha .via-prim{transition:opacity .4s}.ha.is-out .via-prim{opacity:0}
.ha .via-sec{opacity:0;transition:opacity .4s}.ha.is-out .via-sec{opacity:1}
.ha.is-out .sec-stand{opacity:0}
.ha.is-out .dia-pill{background:rgba(244,183,64,.12);color:#FFD27A;border-color:rgba(244,183,64,.35)}
.ha-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:clamp(28px,3vw,40px);border-radius:22px;overflow:hidden;background:var(--line-l);border:1px solid var(--line-l)}
.ha-facts div{padding:22px 24px;background:#fff}
.ha-facts b{display:block;font-family:var(--f-display);font-size:var(--fs-xl);font-weight:700;letter-spacing:-.02em;color:var(--d-hi)}
.ha-facts span{font-size:14px;color:var(--d-mid)}
@media (max-width:860px){.ha-facts{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.ha-facts{grid-template-columns:1fr}}
.ha-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px);margin-top:clamp(16px,2vw,24px)}
.ha-pair .dia h3{margin:0 0 4px;font-size:var(--fs-lg)}
.ha-pair .dia p{margin:0 0 14px;color:var(--t-mid);font-size:var(--fs-sm)}
@media (max-width:900px){.ha-pair{grid-template-columns:1fr}}
.dia-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 calc(clamp(18px,2.6vw,32px)*-1);padding:0 clamp(18px,2.6vw,32px)}
.dia-scroll svg{min-width:560px}

/* integrations */
.addons{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.addons span{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line-d);font-size:13.5px;font-weight:600;color:var(--t-hi)}
.addons span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime)}

/* secure payments */
.pay-hero .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:960px){.pay-hero .wrap{grid-template-columns:1fr}}
.prec{padding:20px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--line-d2);box-shadow:0 40px 100px -40px rgba(0,0,0,.8)}
.prec-h{display:flex;justify-content:space-between;align-items:center;font:700 13.5px var(--f-display);margin-bottom:14px}
.prec-h .st{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--rose)}
.prec-h .st::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;animation:pulseDot 1.6s infinite}
.prec[data-phase="pay"] .prec-h .st{color:var(--amber)}
.prec-wave{position:relative;display:flex;align-items:center;gap:3px;height:64px;padding:0 4px}
.prec-wave i{flex:1;height:var(--h);min-height:3px;border-radius:3px;background:linear-gradient(180deg,var(--spark),var(--emerald));transition:height .25s,opacity .3s,background .3s}
.prec-wave i.pz{background:rgba(169,194,238,.18)!important;height:3px!important}
.prec-steps{display:grid;gap:8px;margin-top:16px}
.prec-steps div{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--line-d);font-size:13.5px;color:var(--t-mid);transition:all .4s var(--ease)}
.prec-steps div i{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:rgba(169,194,238,.1);color:var(--ice)}
.prec-steps div i svg{width:14px;height:14px}
.prec-steps div.on{color:var(--t-hi);border-color:rgba(146,214,60,.35);background:rgba(146,214,60,.07)}
.prec-steps div.on i{background:var(--lime);color:#0A1A06}
.prec-steps div em{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;color:var(--t-lo);font-variant-numeric:tabular-nums;letter-spacing:.08em}
.prec-steps div.on em{color:var(--spark)}
.two-ways{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,24px)}
@media (max-width:860px){.two-ways{grid-template-columns:1fr}}
.way{display:grid;grid-template-rows:auto 1fr;border-radius:28px;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);overflow:hidden}
.way-art{height:220px;background:radial-gradient(70% 80% at 70% 0%,rgba(60,99,184,.35),transparent 70%),linear-gradient(170deg,var(--ink-3),var(--ink-1));display:grid;place-items:center;overflow:hidden}
.way-art svg{height:100%;width:auto}
.way-b{padding:26px 28px 30px;display:grid;gap:12px;align-content:start}
.way-b .k{font:700 11.5px var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--emerald)}
.way-b h3{margin:0;font-size:var(--fs-xl)}
.way-b p{margin:0;color:var(--d-mid)}
.way-b ul{display:grid;gap:8px;margin:4px 0 0;padding:0;list-style:none}
.way-b li{display:flex;gap:10px;font-size:14.5px;font-weight:600;color:var(--d-hi)}
.way-b li svg{flex:none;width:18px;height:18px;padding:3px;border-radius:50%;background:rgba(30,156,107,.12);color:var(--emerald)}
.redact{display:grid;gap:10px}
.redact .ln{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:start;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid var(--line-d);font-size:14px;color:var(--t-mid)}
.redact .ln b{font:700 11px var(--f-display);letter-spacing:.12em;text-transform:uppercase;color:var(--t-lo);padding-top:2px}
.redact .ln.c b{color:var(--ice)}
.redact mark{background:none;color:inherit;position:relative;white-space:nowrap}
.redact mark span{transition:opacity .4s}
.redact mark::after{content:attr(data-r);position:absolute;inset:-2px -4px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:linear-gradient(90deg,#1E9C6B,#74C22D);color:#05210F;font-weight:800;letter-spacing:.12em;font-size:12px;clip-path:inset(0 100% 0 0);transition:clip-path .9s var(--ease)}
.redact.is-red mark::after{clip-path:inset(0 0 0 0)}
.redact.is-red mark span{opacity:0}
.sync-dia .dn text{font-size:12.5px}
.logo-strip{display:flex;flex-wrap:wrap;align-items:center;gap:14px 34px}
.logo-strip img{height:26px;width:auto}
.pci-fact{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:24px 26px;border-radius:22px;background:var(--pearl);border:1px solid var(--line-l)}
.pci-fact i{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--ink-2);color:var(--spark)}
.pci-fact i svg{width:22px;height:22px}
.pci-fact p{margin:0;color:var(--d-mid)}
.pci-fact b{color:var(--d-hi)}
.uses{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.uses div{padding:20px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid var(--line-d)}
.uses svg{width:22px;height:22px;color:var(--spark)}
.uses b{display:block;margin:10px 0 4px;font-family:var(--f-display);font-size:16px}
.uses span{font-size:13.5px;color:var(--t-mid)}
@media (max-width:860px){.uses{grid-template-columns:1fr 1fr}}

/* 3CX news */
.nw-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px)}
@media (max-width:960px){.nw-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.nw-grid{grid-template-columns:1fr}}
.nw-card{display:grid;grid-template-rows:auto auto auto 1fr auto;gap:10px;padding:0 0 22px;border-radius:24px;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);color:var(--d-hi);overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.nw-card:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(11,20,48,.35)}
.nw-card>*:not(.nw-art){margin:0 22px}
.nw-card b{font-family:var(--f-display);font-size:var(--fs-lg);line-height:1.3;letter-spacing:-.01em}
.nw-ex{font-size:14px;color:var(--d-mid)}
.nw-card .link-arrow{font-size:13.5px}
.nw-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--d-lo);margin-top:4px!important}
.nw-tag{padding:4px 10px;border-radius:999px;font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:rgba(60,99,184,.1);color:#2C4F9E}
.nw-art{position:relative;height:132px;overflow:hidden;background:radial-gradient(80% 120% at 85% 0%,rgba(60,99,184,.55),transparent 70%),linear-gradient(160deg,#111D40,#070C1F)}
.nw-art::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(169,194,238,.12) 1px,transparent 1px);background-size:16px 16px}
.nw-art i{position:absolute;border-radius:50%;filter:blur(.2px)}
.nw-art i:nth-child(1){width:150px;height:150px;right:-30px;top:-50px;border:1.5px solid rgba(184,235,79,.5)}
.nw-art i:nth-child(2){width:90px;height:90px;right:20px;top:-10px;border:1.5px solid rgba(169,194,238,.35)}
.nw-art i:nth-child(3){width:10px;height:10px;left:24px;bottom:22px;background:var(--spark);box-shadow:0 0 18px var(--spark)}
.nw-card[data-kind="security"] .nw-art{background:radial-gradient(80% 120% at 85% 0%,rgba(30,156,107,.6),transparent 70%),linear-gradient(160deg,#0E2A2A,#070C1F)}
.nw-card[data-kind="ai"] .nw-art{background:radial-gradient(80% 120% at 85% 0%,rgba(146,214,60,.45),transparent 70%),linear-gradient(160deg,#16294F,#070C1F)}
.nw-card[data-kind="guide"] .nw-art{background:radial-gradient(80% 120% at 85% 0%,rgba(169,194,238,.4),transparent 70%),linear-gradient(160deg,#1A2A57,#070C1F)}
.nw-card[data-kind="security"] .nw-tag{background:rgba(30,156,107,.12);color:#157A53}
.nw-card[data-kind="ai"] .nw-tag{background:rgba(116,194,45,.14);color:#3F7A12}
.nw-card[data-kind="release"] .nw-tag{background:rgba(244,183,64,.16);color:#8A5A00}
.nw-art::after{content:attr(data-l);position:absolute}
.nw-card .nw-art span{display:none}

/* downloads */
.dl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:960px){.dl-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.dl-grid{grid-template-columns:1fr}}
.dl-c{display:grid;gap:10px;align-content:start;padding:22px;border-radius:22px;background:#fff;border:1px solid var(--line-l);box-shadow:var(--shadow-l);color:var(--d-hi);transition:transform .4s var(--ease),border-color .3s}
a.dl-c:hover{transform:translateY(-3px);border-color:rgba(30,156,107,.4)}
.dl-c .ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--ink-2);color:var(--spark)}
.dl-c .ic svg{width:22px;height:22px}
.dl-c b{font-family:var(--f-display);font-size:17px}
.dl-c span{font-size:14px;color:var(--d-mid)}
.dl-c .link-arrow{font-size:13.5px;margin-top:4px}
.dl-soon{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:28px;border-radius:26px;background:linear-gradient(170deg,var(--ink-3),var(--ink-1));border:1px solid var(--line-d2);color:var(--t-hi)}
.dl-soon .stack{position:relative;width:86px;height:96px}
.dl-soon .stack i{position:absolute;inset:0;border-radius:12px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.dl-soon .stack i:nth-child(1){transform:rotate(-10deg) translate(-8px,4px);opacity:.35}
.dl-soon .stack i:nth-child(2){transform:rotate(-4deg);opacity:.6}
.dl-soon .stack i:nth-child(3){background:linear-gradient(180deg,#fff 0 22%,#EBEFF7 22% 26%,#fff 26% 40%,#EBEFF7 40% 44%,#fff 44% 58%,#EBEFF7 58% 62%,#fff 62%)}
.dl-soon h3{margin:0 0 6px;font-size:var(--fs-xl)}
.dl-soon p{margin:0;color:var(--t-mid)}
.dl-soon .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.dl-soon .tags span{padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:600;background:rgba(255,255,255,.05);border:1px solid var(--line-d)}
@media (max-width:760px){.dl-soon{grid-template-columns:1fr}}

/* referral band */
.ref{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(28px,4vw,52px);border-radius:32px;background:radial-gradient(60% 90% at 100% 0%,rgba(146,214,60,.18),transparent 70%),linear-gradient(170deg,var(--ink-3),var(--ink-1));border:1px solid var(--line-d2);color:var(--t-hi);overflow:hidden}
.ref h2{margin:10px 0 12px}
.ref p{color:var(--t-mid);margin:0 0 20px;max-width:56ch}
.ref-art{position:relative;height:220px}
.ref-art .nd{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:16px;background:rgba(17,29,64,.9);border:1px solid var(--line-d2);font:600 13px var(--f-display);white-space:nowrap;box-shadow:0 20px 40px -20px rgba(0,0,0,.7)}
.ref-art .nd i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(146,214,60,.15);color:var(--spark)}
.ref-art .nd i svg{width:15px;height:15px}
.ref-art .nd.a{left:0;top:18px}.ref-art .nd.b{right:0;top:84px}.ref-art .nd.c{left:12%;bottom:8px}
.ref-art svg.ln{position:absolute;inset:0;width:100%;height:100%}
.ref-li{display:inline-flex;align-items:center;gap:10px;font-weight:700;color:var(--t-hi)}
.ref-li svg{width:22px;height:22px;color:#0A66C2;background:#fff;border-radius:5px;padding:2px}
@media (max-width:860px){.ref{grid-template-columns:1fr}.ref-art{height:190px}}

/* header support link + footer extras */
.hdr-sup{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--t-mid);padding:8px 10px;border-radius:999px;transition:color .2s,background .2s}
.hdr-sup svg{width:16px;height:16px}
.hdr-sup:hover{color:var(--t-hi);background:rgba(255,255,255,.05)}
@media (max-width:1499px){.hdr-sup{display:none}}
.ftr-li{display:inline-flex;align-items:center;gap:8px}
.ftr-li svg{width:16px;height:16px}

@media (prefers-reduced-motion:reduce){.dl-flow,.of-pin i::after,.rs-status[data-s="busy"] .ic svg{animation:none!important}.redact mark::after{transition:none}}

@media (min-width:1101px){.ftr-grid{grid-template-columns:repeat(6,1fr);gap:40px clamp(20px,2.4vw,36px)}.ftr-grid>.ftr-brand{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px;padding-bottom:32px;border-bottom:1px solid var(--line-d)}.ftr-grid>.ftr-brand p{max-width:520px;margin:0}}
@media (min-width:861px) and (max-width:1100px){.ftr-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:960px){.pay-hero .wrap{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.rs-hero .wrap,.rs-steps{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){.nw-grid{grid-template-columns:minmax(0,1fr)}}
.dia-scroll{overscroll-behavior-x:contain}

/* top bar (as on the original Vanilla Cloud site) */
:root{--tb:36px}
.tbar{position:relative;z-index:101;height:var(--tb);background:var(--ink-0);border-bottom:1px solid var(--line-d);font-size:12.5px;font-weight:600;color:var(--t-mid)}
.tbar-in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.tbar-l,.tbar-r{display:flex;align-items:center;gap:18px;min-width:0}
.tbar a{display:inline-flex;align-items:center;gap:7px;color:var(--t-mid);white-space:nowrap;transition:color .2s}
.tbar a:hover,.tbar a[aria-current="page"]{color:var(--t-hi)}
.tbar a svg{width:13px;height:13px;flex:none;color:var(--lime)}
.tbar-sep{width:1px;height:14px;background:var(--line-d2)}
.hdr{top:var(--tb)}
.hdr-sup{display:none!important}
.menu-open .tbar{visibility:hidden}
@media (max-width:760px){.tbar-mail,.tbar-sep,.tbar-dl{display:none!important}.tbar-l,.tbar-r{gap:14px}.tbar{font-size:12px}}
@media (max-width:360px){.tbar-r a svg{display:none}}

/* ===== Service status page ===== */
.st-hero{--stc:var(--lime);--stg:rgba(146,214,60,.35)}
.st-hero[data-st="degraded"]{--stc:#F2C94C;--stg:rgba(242,201,76,.35)}
.st-hero[data-st="partial"]{--stc:#F2994A;--stg:rgba(242,153,74,.38)}
.st-hero[data-st="major"]{--stc:#EB5757;--stg:rgba(235,87,87,.4)}
.st-hero[data-st="maintenance"]{--stc:var(--ice);--stg:rgba(169,194,238,.35)}
.st-hero[data-st="loading"],.st-hero[data-st="unknown"]{--stc:#7383A9;--stg:rgba(115,131,169,.25)}
.st-hero .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.st-panel{position:relative;border-radius:var(--r-lg);padding:clamp(22px,3vw,34px);background:linear-gradient(180deg,rgba(28,47,95,.55),rgba(11,20,48,.7));border:1px solid var(--line-d2);box-shadow:0 30px 80px -40px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(14px);overflow:hidden}
.st-panel::before{content:"";position:absolute;inset:-40% -20% auto auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--stg),transparent);opacity:.55;transition:background .6s;pointer-events:none}
.st-now{position:relative;display:flex;gap:20px;align-items:center}
.st-orb{position:relative;flex:none;width:64px;height:64px;display:grid;place-items:center}
.st-orb b{width:22px;height:22px;border-radius:50%;background:var(--stc);box-shadow:0 0 0 6px color-mix(in srgb,var(--stc) 18%,transparent),0 0 28px var(--stg);transition:background .5s}
.st-orb i{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--stc);opacity:0;animation:stRing 2.8s var(--ease) infinite}
.st-orb i+i{animation-delay:1.4s}
@keyframes stRing{0%{transform:scale(.35);opacity:.7}100%{transform:scale(1);opacity:0}}
.st-k{margin:0;font-family:var(--f-display);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--t-lo)}
.st-head{margin-top:6px;font-size:clamp(24px,2.6vw,32px);letter-spacing:-.02em;color:var(--t-hi)}
.st-sub{margin:6px 0 0;color:var(--t-mid);font-size:15px;line-height:1.5}
.st-stats{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:26px 0 0;border-radius:var(--r-md);overflow:hidden;background:var(--line-d)}
.st-stats div{padding:16px 16px 14px;background:rgba(7,12,31,.55)}
.st-stats dt{font-size:12px;color:var(--t-lo);line-height:1.35}
.st-stats dd{margin:6px 0 0;font-family:var(--f-display);font-weight:600;font-size:clamp(20px,2vw,26px);color:var(--t-hi);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.st-live{position:relative;display:flex;align-items:center;gap:10px;margin:18px 0 0;font-size:13px;color:var(--t-mid)}
.st-pulse{width:8px;height:8px;border-radius:50%;background:var(--stc);box-shadow:0 0 0 0 var(--stg);animation:stPulse 2s infinite}
@keyframes stPulse{0%{box-shadow:0 0 0 0 var(--stg)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* status colours */
[data-s]{--sc:#2FB36E}
[data-s="degraded"]{--sc:#E2B33C}[data-s="partial"]{--sc:#EE8A3C}[data-s="major"]{--sc:#E14B4B}[data-s="maintenance"]{--sc:#5D86D6}[data-s="sched"]{--sc:#3C63B8}
.st-sec{padding:clamp(64px,8vw,110px) 0}
.st-bar-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:22px}
.st-seg{display:inline-flex;padding:4px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line-l2)}
.st-seg button{min-height:38px;padding:0 16px;border:0;border-radius:var(--r-pill);background:transparent;font:600 13.5px var(--f-display);color:var(--d-mid);cursor:pointer;transition:background .25s,color .25s}
.st-seg button[aria-pressed="true"]{background:var(--d-hi);color:#fff}
.st-legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 28px;padding:0;list-style:none;font-size:13px;color:var(--d-mid)}
.st-legend li{display:inline-flex;align-items:center;gap:8px}
.st-legend i{width:10px;height:10px;border-radius:3px;background:var(--sc)}
.st-groups{display:grid;gap:22px}
.st-group{border-radius:var(--r-lg);background:#fff;border:1px solid var(--line-l);box-shadow:0 1px 0 rgba(11,20,48,.03),0 18px 40px -32px rgba(11,20,48,.35);overflow:hidden}
.st-g-h{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px clamp(18px,2.4vw,28px);border-bottom:1px solid var(--line-l)}
.st-g-h h3{font-size:20px;color:var(--d-hi)}
.st-g-h p{margin:2px 0 0;font-size:13.5px;color:var(--d-lo)}
.st-row{padding:18px clamp(18px,2.4vw,28px) 16px;border-top:1px solid var(--line-l)}
.st-row:first-of-type{border-top:0}
.st-r-top{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.st-name{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:600;font-size:16px;color:var(--d-hi)}
.st-dot{width:9px;height:9px;border-radius:50%;background:var(--sc);box-shadow:0 0 0 4px color-mix(in srgb,var(--sc) 16%,transparent)}
.st-r-meta{display:inline-flex;align-items:center;gap:14px}
.st-pct{font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--d-hi);font-variant-numeric:tabular-nums}
.st-pct small{font-size:12.5px;font-weight:500;color:var(--d-lo)}
.st-chip{display:inline-flex;align-items:center;gap:7px;min-height:26px;padding:0 11px;border-radius:var(--r-pill);font:600 12px var(--f-display);letter-spacing:.02em;white-space:nowrap;color:color-mix(in srgb,var(--sc) 78%,#0B1430);background:color-mix(in srgb,var(--sc) 13%,#fff)}
.st-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sc)}
.st-bars{display:flex;gap:2px;height:34px;margin-top:14px}
.st-bars i{flex:1 1 0;min-width:0;border-radius:3px;background:var(--sc);opacity:.88;transform-origin:bottom;transition:opacity .2s,transform .2s}
.st-bars i[data-s="operational"]{background:linear-gradient(180deg,#3CC07A,#2BA765)}
.st-bars i:hover{opacity:1;transform:scaleY(1.12)}
.js .st-group .st-bars i{animation:stGrow .55s var(--ease) both;animation-delay:calc(var(--i,0) * 6ms)}
.st-bars[data-per="30"]{gap:4px}.st-bars[data-per="30"] i{border-radius:4px}.st-bars[data-per="365"]{gap:3px}
@keyframes stGrow{from{transform:scaleY(.2);opacity:0}}
.st-r-foot{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:12px;color:var(--d-lo)}
.st-tip{position:absolute;z-index:300;max-width:280px;padding:10px 12px;border-radius:12px;background:var(--d-hi);color:#fff;font-size:12.5px;line-height:1.45;box-shadow:0 18px 40px -16px rgba(0,0,0,.5);pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .15s,transform .15s}
.st-tip.on{opacity:1;transform:none}
.st-tip b{display:block;font-family:var(--f-display);font-size:13px}
.st-tip span{display:block;color:var(--ice)}
.st-tip span:first-of-type{color:color-mix(in srgb,var(--sc) 70%,#fff)}
.st-note{padding:22px;border-radius:var(--r-md);background:#fff;border:1px dashed var(--line-l2);color:var(--d-mid)}
.st-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,56px);align-items:start}
.st-card{position:relative;border-radius:var(--r-lg);padding:clamp(20px,2.4vw,28px);background:var(--pearl);border:1px solid var(--line-l);color:var(--d-hi)}
.st-card+.st-card{margin-top:16px}
.st-card h3{font-size:19px;letter-spacing:-.015em}
.st-calm{display:flex;gap:16px;align-items:center}
.st-calm p{margin:4px 0 0;color:var(--d-mid);font-size:14.5px}
.st-ok{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;color:#1E9C6B;background:rgba(30,156,107,.12)}
.st-ok.cal{color:var(--sky,#3C63B8);background:rgba(60,99,184,.1)}
.st-ok svg{width:22px;height:22px}
.st-c-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.st-when{font-size:13px;color:var(--d-lo)}
.st-inc{border-left:4px solid var(--sc);background:#fff}
.st-mt{background:#fff}
.st-mt.is-live{border-color:color-mix(in srgb,#5D86D6 50%,transparent);box-shadow:0 0 0 4px rgba(93,134,214,.1)}
.st-imp{font-size:12.5px;font-weight:600;color:var(--d-lo)}
.st-imp[data-i="medium"]{color:#B7791F}.st-imp[data-i="high"]{color:#C53030}
.st-win{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:14px;font-weight:600;color:var(--d-mid);font-variant-numeric:tabular-nums}
.st-win svg{width:16px;height:16px;flex:none;color:#3C63B8}
.st-affects{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.st-affects span{padding:4px 10px;border-radius:8px;background:var(--pearl-2);font-size:12.5px;font-weight:600;color:var(--d-mid)}
.st-md{font-size:14.5px;line-height:1.6;color:var(--d-mid)}
.st-md p{margin:10px 0 0}.st-md h5{margin:14px 0 0;font:600 14px var(--f-display);color:var(--d-hi)}.st-md ul{margin:8px 0 0;padding-left:18px;list-style:disc}.st-md li{margin-top:4px}.st-md li::marker{color:#1E9C6B}
.st-md a{color:#1E9C6B;font-weight:600}
.st-more{margin-top:14px;border-top:1px solid var(--line-l);padding-top:10px}
.st-more summary,.st-h summary{list-style:none;cursor:pointer}
.st-more summary::-webkit-details-marker,.st-h summary::-webkit-details-marker{display:none}
.st-more summary{display:inline-flex;align-items:center;gap:8px;font:600 14px var(--f-display);color:#1E9C6B}
.st-more summary i,.st-h summary i{position:relative;width:12px;height:12px;flex:none}
.st-more summary i::before,.st-more summary i::after,.st-h summary i::before,.st-h summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:2px;border-radius:2px;background:currentColor;transform:translate(-50%,-50%);transition:transform .3s var(--ease)}
.st-more summary i::after,.st-h summary i::after{transform:translate(-50%,-50%) rotate(90deg)}
.st-more[open] summary i::after,.st-h[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
.st-u-h{margin:18px 0 0;font:600 12px var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--d-lo)}
.st-upd{list-style:none;margin:10px 0 0;padding:0 0 0 18px;border-left:2px solid var(--pearl-2)}
.st-upd li{position:relative;padding:4px 0 12px}
.st-upd li::before{content:"";position:absolute;left:-24px;top:10px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid #3C63B8}
.st-upd time{font:600 12.5px var(--f-display);color:var(--d-lo)}
.st-upd .st-md p{margin-top:4px}
.st-hist{display:grid;gap:10px;max-width:980px}
.st-mo{margin:20px 0 4px;font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--d-lo)}
.st-mo:first-child{margin-top:0}
.st-h{border-radius:var(--r-md);background:#fff;border:1px solid var(--line-l);transition:box-shadow .3s,border-color .3s}
.st-h[open]{border-color:var(--line-l2);box-shadow:0 18px 40px -30px rgba(11,20,48,.4)}
.st-h summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:16px clamp(16px,2vw,22px);color:var(--d-hi)}
.st-h-dot{width:10px;height:10px;border-radius:50%;background:var(--sc)}
.st-h-t b{display:block;font:600 15.5px var(--f-display);letter-spacing:-.01em}
.st-h-t small{display:block;margin-top:2px;font-size:13px;color:var(--d-lo)}
.st-h-b{padding:0 clamp(16px,2vw,22px) 18px calc(clamp(16px,2vw,22px) + 24px)}
.st-h-b .st-affects{margin-top:0}
.st-showmore{justify-self:start;margin-top:10px}
.st-help{background:radial-gradient(70% 120% at 100% 0%,#1A2C63,transparent 60%),var(--ink-1)}
.st-help-in{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.st-help-acts{display:flex;flex-wrap:wrap;gap:12px}
.sk{min-height:120px;background:linear-gradient(90deg,var(--pearl-2) 0%,#fff 50%,var(--pearl-2) 100%);background-size:200% 100%;animation:stSk 1.4s linear infinite;border:0}
.st-group.sk{min-height:260px}
@keyframes stSk{to{background-position:-200% 0}}
@media (max-width:960px){.st-hero .wrap,.st-two{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){
  .st-bars{height:30px;gap:1px}.st-bars[data-per="30"]{gap:3px}.st-bars[data-per="365"]{gap:2px}.st-bars i{border-radius:2px}
  .st-stats{grid-template-columns:1fr 1fr 1fr}.st-stats div{padding:12px 10px}.st-stats dt{font-size:11px}
  .st-h summary{grid-template-columns:auto minmax(0,1fr) auto}.st-h summary .st-chip{display:none}
  .st-pct small{display:none}
  .st-r-top{flex-direction:column;align-items:flex-start;gap:8px}.st-r-meta{gap:10px}
  .st-help-acts .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.st-orb i,.st-pulse,.js .st-group .st-bars i,.sk{animation:none}}

/* top bar status link */
.tbar-st i{width:7px;height:7px;border-radius:50%;background:#7383A9;flex:none;transition:background .4s}
.tbar-st[data-st="operational"] i{background:var(--lime);box-shadow:0 0 0 3px rgba(146,214,60,.18)}
.tbar-st[data-st="degraded"] i{background:#F2C94C}.tbar-st[data-st="partial"] i{background:#F2994A}.tbar-st[data-st="major"] i{background:#EB5757}.tbar-st[data-st="maintenance"] i{background:var(--ice)}
.tbar .sm{display:none}
@media (max-width:760px){.tbar .lg{display:none}.tbar .sm{display:inline}.tbar-r a svg,.tbar-l a svg{display:none}}


/* Vanilla story: office agent, mirrored to face the copy */
.vs-bot{position:relative;width:100%;max-width:500px;aspect-ratio:1/1.05;justify-self:center}
.vs-bot::before{content:"";position:absolute;left:50%;top:50%;width:84%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 50% 38%,#FFFFFF 0%,#E6EDF9 55%,#D5E1F5 100%);box-shadow:inset 0 0 0 1px rgba(60,99,184,.08),0 40px 80px -40px rgba(11,20,48,.35)}
.vs-ring{position:absolute;left:50%;top:50%;width:100%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1px dashed rgba(60,99,184,.18)}
.vs-ring.r2{width:66%;border-style:solid;border-color:rgba(60,99,184,.10)}
.vs-img{position:absolute;left:50%;bottom:4%;width:72%;height:auto;transform:translateX(-50%) scaleX(-1);filter:drop-shadow(0 26px 30px rgba(11,20,48,.28))}
.vs-floor{position:absolute;left:50%;bottom:3%;width:42%;height:22px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(11,20,48,.22),transparent)}
@media (max-width:900px){.vs-bot{max-width:380px;margin-top:10px}}

/* Robots stay still: no bouncing or floating */
.stage-bot,.vpap-item.is-center,.vpap-hero img,.vpap-hero .bot-rig,.bot-rig .bot-idle,.bot-rig.hop .bot-lean,.mainbot .mb-rig{animation:none !important}

/* ---------- Vanilla Cloud services: menu link + footer band ---------- */
.dd-foot.sol{grid-column:1/-1;margin-top:2px}
.dd-foot.sol b{color:var(--d-hi);font-weight:600}
.ftr-vc{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:20px 40px;margin-bottom:clamp(40px,5vw,60px);padding:22px 26px;border-radius:20px;background:linear-gradient(135deg,rgba(28,47,95,.55),rgba(11,20,48,.2));border:1px solid var(--line-d)}
.ftr-vc-k{display:flex;align-items:center;gap:16px}
.ftr-vc-k img{height:34px;width:auto}
.ftr-vc-k span{padding-left:16px;border-left:1px solid var(--line-d);font:600 12px/1.4 var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--t-lo)}
.ftr .ftr-vc ul{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 0}
.ftr-vc li{display:flex;align-items:center}
.ftr-vc li+li::before{content:"";width:4px;height:4px;margin:0 16px;border-radius:50%;background:#74C22D;opacity:.7}
.ftr-vc a{color:var(--t-hi);font-weight:500}
.ftr-vc a:hover{color:#92D63C}
@media (max-width:1100px){.ftr-vc{grid-template-columns:1fr}.ftr .ftr-vc ul{justify-content:flex-start}}
@media (max-width:640px){.ftr .ftr-vc ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}.ftr-vc li+li::before{display:none}}
.dd-foot.sol .link-arrow{white-space:nowrap;flex-shrink:0}
.dd-foot.sol .link-arrow svg{flex-shrink:0;width:15px;min-width:15px}
.ftr-vc{gap:20px 28px;padding:20px 24px}
.ftr-vc li+li::before{margin:0 11px}
.ftr-vc a{font-size:14px}
@media (min-width:1101px){.ftr .ftr-vc ul{flex-wrap:nowrap}.ftr-vc li{white-space:nowrap}}

/* ===== Story CTA with the small office agent (phone/tablet) ===== */
.vs-cta{margin-top:26px;display:flex;align-items:flex-end;gap:14px}
.vs-mini{display:none}
@media (max-width:1180px), (max-width:1366px) and (hover:none) and (pointer:coarse){
  .vs-bot{display:none}
  .vs-cta{position:relative;justify-content:space-between;margin-top:30px;padding:14px 14px 14px 16px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px rgba(60,99,184,.14),0 18px 40px -28px rgba(11,20,48,.35);align-items:center}
  .vs-cta .btn{padding-left:18px;padding-right:18px;font-size:15px}
  .vs-mini{position:relative;display:block;flex:none;width:58px;height:84px;margin:-34px 4px -4px 0}
  .vs-mini img{display:block;width:100%;height:auto;transform:scaleX(-1);filter:drop-shadow(0 10px 10px rgba(11,20,48,.22))}
  .vs-mini::after{content:"";position:absolute;left:8px;right:8px;bottom:-2px;height:8px;border-radius:50%;background:radial-gradient(closest-side,rgba(11,20,48,.2),transparent)}
}
@media (max-width:360px){.vs-cta .btn{font-size:14px;padding-left:14px;padding-right:14px}.vs-mini{width:50px;height:72px}}

/* ===== Six ingredients: highlight the row being read (opacity + transform only, so it stays smooth) ===== */
.ing{transition:opacity .6s cubic-bezier(.22,.7,.2,1)}
.ing::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:2px;border-radius:2px;background:linear-gradient(180deg,var(--green),var(--sky-b));transform:scaleY(0);transform-origin:top;transition:transform .7s cubic-bezier(.22,.7,.2,1);z-index:1}
.ing::after{display:block!important;content:"";position:absolute;inset:0;padding:0;border-radius:0;-webkit-mask:none;mask:none;background:linear-gradient(90deg,rgba(60,99,184,.07),rgba(60,99,184,0) 72%);opacity:0;transition:opacity .6s cubic-bezier(.22,.7,.2,1);pointer-events:none;z-index:0}
.ing>*{position:relative;z-index:1}
.ing-n{transition:color .6s cubic-bezier(.22,.7,.2,1),-webkit-text-stroke-color .6s cubic-bezier(.22,.7,.2,1)}
.ing-grid.has-on .ing{opacity:.6}
.ing-grid.has-on .ing.is-on,.ing-grid.has-on .ing:hover{opacity:1}
.ing.is-on::before{transform:scaleY(1)}
.ing.is-on::after{opacity:1}
.ing.is-on .ing-n{color:var(--green);-webkit-text-stroke-color:var(--green)}
.ing:hover{background:none!important}
.ing:hover::after{opacity:1}
@media (max-width:560px){.ing::before{left:-12px}.ing::after{left:-20px;right:-20px}}
@media (prefers-reduced-motion:reduce){.ing,.ing::before,.ing::after,.ing-n{transition:none}}
.vs-cta .btn{white-space:nowrap}
.vs-cta .btn svg{flex:none;width:18px;height:18px}
@media (max-width:1180px), (max-width:1366px) and (hover:none) and (pointer:coarse){.vs-cta{background:linear-gradient(135deg,#fff 0%,#F5F7FB 100%)}}

/* ===== Homepage: 3CX platform ===== */
.cx3-in{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,6vw,96px);align-items:center}
.cx3-copy{display:grid;gap:22px;align-content:start}
.cx3-copy .h-1{max-width:18ch}
.cx3-lede{font-size:var(--fs-lg);line-height:1.6;color:var(--d-mid);max-width:54ch}
.cx3-list{display:grid;border-top:1px solid var(--line-l)}
.cx3-list li{position:relative;display:grid;gap:3px;padding:15px 0 15px 30px;border-bottom:1px solid var(--line-l)}
.cx3-list li::before,.cx3-list li::after{content:"";position:absolute;left:4px;top:24px;width:12px;height:2.4px;border-radius:2px;background:var(--green)}
.cx3-list li::after{transform:rotate(90deg)}
.cx3-list b{font-family:var(--f-display);font-weight:600;font-size:16.5px;color:var(--d-hi);letter-spacing:-.01em}
.cx3-list span{font-size:15px;line-height:1.5;color:var(--d-mid)}
.cx3-note{font-size:14px;line-height:1.55;color:var(--d-lo);max-width:56ch}
.cx3-cta{color:var(--emerald)!important;justify-self:start}
/* product moment */
.cx3-app{position:relative;border-radius:26px;padding:18px;background:radial-gradient(120% 80% at 100% 0%,rgba(60,99,184,.35),transparent 60%),var(--ink-2);color:var(--t-hi);box-shadow:0 40px 80px -40px rgba(11,20,48,.6),inset 0 0 0 1px rgba(169,194,238,.12)}
.cx3-bar{display:flex;align-items:center;gap:12px;padding:4px 6px 16px;border-bottom:1px solid rgba(169,194,238,.12)}
.cx3-bar img{height:20px;width:auto}
.cx3-tt{font-family:var(--f-display);font-weight:600;font-size:15px;color:var(--t-hi)}
.cx3-live{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:#C9D6EF}
.cx3-live i{width:7px;height:7px;border-radius:50%;background:#92D63C;box-shadow:0 0 0 4px rgba(146,214,60,.18)}
.cx3-rows{display:grid;gap:6px;padding:14px 0}
.cx3-row{display:flex;align-items:center;gap:13px;padding:12px;border-radius:16px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px rgba(169,194,238,.08)}
.cx3-row.is-call{background:linear-gradient(90deg,rgba(146,214,60,.14),rgba(146,214,60,.03));box-shadow:inset 0 0 0 1px rgba(146,214,60,.28)}
.cx3-av{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#fff}
.cx3-av img{width:21px;height:21px}
.cx3-av svg{width:19px;height:19px}
.cx3-call{background:var(--grad-btn);color:#0A1A06}
.cx3-sms{background:#E8EEFA;color:#3C63B8}
.cx3-web{background:#E8EEFA;color:#1E9C6B}
.cx3-tx{min-width:0;display:grid;gap:2px}
.cx3-tx b{font-family:var(--f-display);font-weight:600;font-size:14.5px}
.cx3-tx small{font-size:14px;color:#B9C6E2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx3-t{margin-left:auto;flex:none;font-size:12.5px;color:#8FA0C4}
.cx3-ring{margin-left:auto;display:flex;gap:3px;align-items:flex-end;height:18px}
.cx3-ring i{width:3px;border-radius:2px;background:#92D63C;height:40%}
.cx3-ring i:nth-child(2){height:100%}.cx3-ring i:nth-child(3){height:65%}
.cx3-foot{display:flex;gap:6px;padding:12px 4px 2px;border-top:1px solid rgba(169,194,238,.12)}
.cx3-foot span{padding:7px 12px;border-radius:999px;font-size:12.5px;font-weight:600;color:#B9C6E2;background:rgba(255,255,255,.04)}
.cx3-foot .on{margin-left:auto;color:#0A1A06;background:var(--grad-btn)}
@media (prefers-reduced-motion:no-preference){
  .js .cx3-stage .cx3-row{opacity:0;transform:translateY(10px);transition:opacity .6s cubic-bezier(.22,.7,.2,1),transform .6s cubic-bezier(.22,.7,.2,1)}
  .cx3-stage.is-in .cx3-row{opacity:1;transform:none}
  .cx3-stage.is-in .cx3-row:nth-child(2){transition-delay:.12s}.cx3-stage.is-in .cx3-row:nth-child(3){transition-delay:.24s}
  .cx3-stage.is-in .cx3-row:nth-child(4){transition-delay:.36s}.cx3-stage.is-in .cx3-row:nth-child(5){transition-delay:.48s}
  .cx3-stage.is-in .cx3-ring i{animation:cx3eq 1.1s ease-in-out infinite}
  .cx3-ring i:nth-child(2){animation-delay:.18s!important}.cx3-ring i:nth-child(3){animation-delay:.36s!important}
}
@keyframes cx3eq{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1)}}
.cx3-ring i{transform-origin:bottom}
@media (max-width:960px){.cx3-in{grid-template-columns:1fr}.cx3-app{max-width:560px}}
@media (max-width:560px){.cx3-app{padding:14px;border-radius:22px}.cx3-row{padding:10px;gap:11px}.cx3-av{width:36px;height:36px}.cx3-foot span{padding:6px 10px}}
/* 3CX section: kept compact */
.sec.cx3{padding-block:clamp(64px,8vw,108px)}
.cx3-in{align-items:center}
.cx3-copy{gap:18px}
.cx3-copy .h-1{font-size:clamp(34px,3.6vw,50px);max-width:16ch}
.cx3-lede{font-size:var(--fs-md)}
.cx3-list{grid-template-columns:1fr 1fr;column-gap:28px;border-top:0}
.cx3-list li{padding:14px 0 14px 26px;border-bottom:0;border-top:1px solid var(--line-l)}
.cx3-list li::before,.cx3-list li::after{left:2px;top:23px;width:11px}
.cx3-list b{font-size:15.5px}
.cx3-list span{font-size:14px}
@media (max-width:640px){.cx3-list{grid-template-columns:1fr}}

/* 3CX section v2: copy + facts on top, Team view dashboard with the inbox overlapping */
.cx3-top{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:end}
.cx3-top .cx3-list{align-self:end}
.cx3-stage{position:relative;margin-top:clamp(40px,5vw,64px);padding-right:clamp(0px,16vw,230px);padding-bottom:40px}
.cx3-stage .cxapp{margin-top:0}
.cx3-stage .cx-toast{right:auto;left:clamp(200px,34%,420px);top:66px}
.cx3-stage .cx3-app{position:absolute;right:0;bottom:0;width:min(380px,36%);z-index:3;padding:16px}
.cx3-bar{padding:2px 4px 12px}
.cx3-rows{padding:12px 0 2px}
.cx3-ico{flex:none;width:40px;height:40px;display:grid;place-items:center}
.cx3-ico img{width:24px;height:24px;object-fit:contain}
.cx3 .mock-note{margin-top:14px}
@media (max-width:1100px){.cx3-stage{padding-right:0;padding-bottom:0}.cx3-stage .cx3-app{position:relative;width:auto;max-width:440px;margin:-56px 16px 0 auto}}
@media (max-width:960px){.cx3-top{grid-template-columns:1fr}}
@media (max-width:640px){.cx3-stage .cx3-app{margin:-28px 10px 0 10px;max-width:none}.cx3-stage .cx-toast{left:auto}}
@media (min-width:1101px){
  .cx3-stage{padding-right:24%;padding-bottom:150px}
  .cx3-stage .cx3-app{top:72px;bottom:auto;width:34%;max-width:400px}
  .cx3-stage .cx3-row{padding:9px 10px}
  .cx3-stage .cx-toast{left:auto;right:22px;top:70px}
}
@media (min-width:1101px){
  .cx3-stage .cxapp-grid{grid-template-columns:repeat(4,1fr)}
  .cx3-stage .cxapp-grid .ext:nth-child(n+5){display:none}
  .cx3-stage .cxapp-main{padding-right:clamp(24px,12%,130px)}
  .cx3-stage .cx-toast{top:auto;bottom:22px;left:270px;right:auto;max-width:340px}
}
@media (max-width:640px){.cx3-stage .cx-toast{display:none}.cx3-stage .cx3-app{margin-top:-64px}}
/* team inbox matches the 3CX Team view; separated by a pearl gap ring and a soft lift */
.cx3-stage .cx3-app{background:#2A2D33;color:#E8EAEE;padding:0;overflow:hidden;border-radius:22px;
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 0 7px var(--pearl),0 0 0 8px rgba(11,20,48,.06),0 40px 80px -30px rgba(0,0,0,.55)}
.cx3-stage .cx3-bar{padding:0 18px;height:54px;background:#1F2126;border-bottom:1px solid rgba(255,255,255,.06)}
.cx3-stage .cx3-tt{color:#E8EAEE;font-size:15px}
.cx3-stage .cx3-live{color:#9AA1AD}
.cx3-stage .cx3-rows{padding:12px}
.cx3-stage .cx3-row{background:#33363D;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);border-radius:12px}
.cx3-stage .cx3-row.is-call{background:linear-gradient(90deg,rgba(146,214,60,.16),rgba(146,214,60,.04)),#33363D;box-shadow:inset 0 0 0 1px rgba(146,214,60,.45)}
.cx3-stage .cx3-tx small{color:#9AA1AD}
.cx3-stage .cx3-t{color:#7D8490}
@media (max-width:640px){.cx3-stage .cx3-app{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 0 5px var(--pearl),0 0 0 6px rgba(11,20,48,.06),0 30px 60px -30px rgba(0,0,0,.55)}}
/* ===== Section textures: monoline brand cloud, dot grid, plus markers ===== */
section:has(> .tx){position:relative;isolation:isolate}
.tx{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.tx i{position:absolute;display:block}
.tx-cl{background:url(../brand/tx-cloud.svg) no-repeat center/contain;aspect-ratio:216/100;opacity:.09}
.tx-a{width:520px;top:6%;right:-120px}
.tx-b{width:300px;bottom:8%;left:-80px;opacity:.07}
.tx-c{width:420px;top:42%;left:-150px;opacity:.07}
.tx-d{width:460px;top:4%;right:-90px}
.tx-e{width:560px;bottom:4%;left:-160px;opacity:.07}
.tx-dots{width:560px;height:420px;top:0;left:0;background-image:radial-gradient(rgba(60,99,184,.22) 1.2px,transparent 1.4px);background-size:22px 22px;-webkit-mask-image:radial-gradient(closest-side,#000 30%,transparent);mask-image:radial-gradient(closest-side,#000 30%,transparent)}
.tx-dots.tx-tr{left:auto;right:-60px;top:-40px}
.tx-dots.tx-wide{width:900px;height:620px;left:auto;right:-140px;top:auto;bottom:-80px}
.tx-plus{inset:0;background:url(../brand/tx-plus.svg) 0 0/120px 120px;opacity:.35;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 60%,#000 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 60%,#000 100%)}
.tx-plus.tx-plus-b{-webkit-mask-image:radial-gradient(60% 50% at 100% 100%,#000,transparent);mask-image:radial-gradient(60% 50% at 100% 100%,#000,transparent);opacity:.45}
@media (prefers-reduced-motion:no-preference){
  .tx-cl{animation:txDrift 26s ease-in-out infinite alternate}
  .tx-b,.tx-e,.tx-g2{animation-duration:32s;animation-direction:alternate-reverse}
  .tx-plus{animation:txPan 60s linear infinite}
}
@keyframes txDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-28px,14px,0)}}
@keyframes txPan{from{background-position:0 0}to{background-position:120px 120px}}
@media (max-width:760px){
  .tx-a{width:300px;right:-110px;top:2%}.tx-b{width:200px}.tx-c{width:260px;left:-120px}
  .tx-d{width:280px;right:-110px}.tx-e{width:320px;left:-140px}
  .tx-dots{width:340px;height:300px}.tx-dots.tx-wide{width:420px;height:420px}
  .tx-plus{opacity:.25}
}

/* ===== Experience section in brand green ===== */
#proof.sec-green{background:radial-gradient(70% 60% at 85% 0%,rgba(146,214,60,.28),transparent 70%),radial-gradient(60% 50% at 0% 100%,rgba(30,156,107,.45),transparent 70%),linear-gradient(165deg,#0C3D2B 0%,#0F4A34 55%,#0B3526 100%);color:#fff}
#proof.sec-green .eyebrow{color:#C6F25A}
#proof.sec-green .eyebrow::before{background:#C6F25A}
#proof.sec-green .lede,#proof.sec-green .xp-c span,#proof.sec-green .q-res,#proof.sec-green .quote figcaption{color:#D3EBDD}
#proof.sec-green .xp-c{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border-color:rgba(255,255,255,.14)}
#proof.sec-green .xp-c b{background:linear-gradient(120deg,#FFFFFF 10%,#C6F25A 90%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
#proof.sec-green .xp-c.aw strong,#proof.sec-green .quote figcaption b{color:#fff}
#proof.sec-green .quote{background:linear-gradient(170deg,rgba(6,30,21,.55),rgba(6,30,21,.3));border-color:rgba(255,255,255,.14)}
#proof.sec-green .q-res b{color:#C6F25A}
#proof.sec-green .tx-cl{background-image:url(../brand/tx-cloud-w.svg);opacity:.12}
.tx-g1{width:620px;top:-40px;right:-160px}
.tx-g2{width:380px;bottom:6%;left:-120px;opacity:.09}
@media (max-width:760px){.tx-g1{width:340px;right:-140px;top:-10px}.tx-g2{width:240px}}
#how .tx-plus{opacity:.22;-webkit-mask-image:radial-gradient(70% 65% at 50% 50%,transparent 35%,#000 85%);mask-image:radial-gradient(70% 65% at 50% 50%,transparent 35%,#000 85%)}
/* ===== Mobile audit: 14px minimum for readable text, larger tap targets ===== */
@media (max-width:760px){
  .eyebrow{letter-spacing:.16em}
  /* small links: grow the hit area, not the layout */
  .tbar a{position:relative}
  .tbar a::after{content:"";position:absolute;inset:-11px -6px}
  .vpap-dots button{position:relative}
  .vpap-dots button::after{content:"";position:absolute;inset:-14px -3px}
  .ftr ul a:not(.ftr-li),footer ul a:not(.ftr-li){display:inline-block;padding:8px 0;margin:-4px 0}
  .ftr-li{padding:8px 0;margin:-4px 0}
  .ftr-legal a,.crumbs a{display:inline-block;padding:10px 0;margin:-10px 0}
  .fx-tel,.fx-em{display:inline-flex;align-items:center;min-height:40px}
}
@media (max-width:760px){.logo-strip>span{font-size:14px!important}}
/* story CTA: grid can never be pushed wider than the screen; agent stands on the card's top edge */
@media (max-width:1180px), (max-width:1366px) and (hover:none) and (pointer:coarse){.vstory{grid-template-columns:minmax(0,1fr)}}
@media (max-width:1180px), (max-width:1366px) and (hover:none) and (pointer:coarse){
  .vs-cta{margin-top:88px}
  .vs-cta .btn{flex:1 1 auto;min-width:0;justify-content:center}
  .vs-mini{position:absolute;right:18px;top:-73px;width:50px;height:72px;margin:0;z-index:1}
  .vs-mini::after{bottom:-4px}
}
/* Experience section on off-white */
#proof.sec-ow{background:radial-gradient(60% 50% at 90% 0%,rgba(60,99,184,.07),transparent 70%),linear-gradient(180deg,#FAFBFD 0%,var(--pearl) 100%)}
#proof.sec-ow .xp-c{background:#fff;border:1px solid rgba(11,20,48,.07);box-shadow:0 24px 50px -34px rgba(11,20,48,.35)!important}
#proof.sec-ow .xp-c b{background:linear-gradient(120deg,#1C2F5F 20%,#3C63B8 95%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
#proof.sec-ow .tx-cl{opacity:.08}
#proof.sec-ow .quote{background:radial-gradient(70% 90% at 100% 0%,rgba(60,99,184,.35),transparent 60%),linear-gradient(165deg,#1C2F5F 0%,#0B1430 100%)!important;border:0!important;color:#fff;box-shadow:0 40px 80px -40px rgba(11,20,48,.6)}
#proof.sec-ow .quote blockquote{color:#fff}
#proof.sec-ow .quote figcaption,#proof.sec-ow .quote .q-res{color:#C9D6EE}
#proof.sec-ow .quote figcaption b{color:#fff}
#proof.sec-ow .quote .q-res b{color:var(--spark)}

/* Homepage hero: no eyebrow, slightly more air between lines */
.hero-home .hero-copy{gap:32px}
.hero-home .hero-ctas{margin-top:8px}
.hero-home .hero-ti{margin-top:14px}
@media (max-width:760px){.hero-home .hero-copy{gap:26px}.hero-home .hero-ti{margin-top:8px}}

/* Mortlake quote: full-width blue band, content kept to the page margins */
#proof.sec-ow .quote{margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;margin-bottom:calc(-1 * var(--sec))!important;
  padding:clamp(56px,7vw,96px) calc(50vw - 50%) clamp(56px,7vw,96px);border-radius:0!important;box-shadow:none}
#proof.sec-ow{overflow:clip}
@supports not (overflow:clip){#proof.sec-ow{overflow:hidden}}
@media (max-width:480px){.cta-band .hero-ctas{display:grid;gap:10px}.cta-band .hero-ctas .btn{width:100%;justify-content:center}}

/* blog: newest article as a wide featured card (Oct 2026) */
@media (min-width:961px){
  #post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  #post-grid>.post-card:first-child:not([hidden]){grid-column:1/-1;flex-direction:row;align-items:stretch}
  #post-grid>.post-card:first-child .th{flex:0 0 58%;aspect-ratio:auto;display:grid;place-items:center;background:#0A1230}
  #post-grid>.post-card:first-child .th img{height:auto;aspect-ratio:1200/630;object-fit:contain}
  #post-grid>.post-card:first-child .bd{padding:clamp(28px,3vw,44px);align-content:center;gap:14px}
  #post-grid>.post-card:first-child h2,#post-grid>.post-card:first-child h3{font-size:clamp(1.6rem,1.2rem + 1vw,2.1rem)}
  #post-grid>.post-card:first-child p{font-size:16px}
  #post-grid>.post-card:first-child .link-arrow{margin-top:8px}
}

.xp-src{margin:14px 0 0;font-size:14px;line-height:1.55;color:var(--t-lo)}
.xp-src a{color:var(--ice);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(169,194,238,.4)}
.xp-src a:hover{color:#fff}
#proof.sec-ow .xp-c{padding:24px 24px 22px;border-radius:20px}
#proof.sec-ow .xp-c.aw{padding:18px 20px}
#proof.sec-ow .xp-src{color:var(--d-mid)}
#proof.sec-ow .xp-src a{color:#2F55A8;text-decoration-color:rgba(47,85,168,.35)}
#proof.sec-ow .xp-src a:hover{color:#1C2F5F}

/* footer 3CX badges */
.ftr-bdg{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px}
.ftr-bdg .ftr-ti{margin-top:0}
/* m-floor:start (generated by scripts/gen_mfloor.py) */
@media (max-width:760px){.eyebrow{font-size:max(14px, 12.5px)}.pill{font-size:max(14px, 13px)}.pill b{font-size:max(14px, 11px)}.float-card{font-size:max(14px, 13px)}.float-card .k{font-size:max(12px, 10.5px)}.tag{font-size:max(12px, 11px)}.strip-label{font-size:max(14px, 12px)}.mock{font-size:max(14px, 13px)}.bub .who{font-size:max(12px, 10.5px)}.live{font-size:max(12px, 11px)}.flow-row{font-size:max(14px, 12.5px)}.kv div{font-size:max(14px, 12.5px)}.ch{font-size:max(14px, 12.5px)}.ch i{font-size:max(14px, 11px)}.ch .c{font-size:max(14px, 11px)}.chip{font-size:max(14px, 12.5px)}.screen-call .acts span{font-size:max(14px, 12px)}.badge{font-size:max(12px, 11px)}.plan li .soon{font-size:max(12px, 10.5px)}.ftr h4{font-size:max(14px, 12px)}.ftr-legal{font-size:max(14px, 12.5px)}.agent-body .ind{font-size:max(14px, 12px)}.feat-num{font-size:max(14px, 13px)}.bars-x{font-size:max(12px, 11px)}.wb span{font-size:max(14px, 11px)}.cmp .grp td{font-size:max(14px, 12px)}.field label{font-size:max(14px, 13.5px)}.field legend{font-size:max(14px, 13.5px)}.seg span{font-size:max(14px, 13.5px)}.form .fine{font-size:max(14px, 12.5px)}.side-card ol li::before{font-size:max(14px, 12px)}.note{font-size:max(14px, 12.5px)}.mock-note{font-size:max(14px, 12px)}.badge-mini{font-size:max(12px, 10.5px)}.ftr .ftr-h{font-size:max(14px, 12px)}.ib-via{font-size:max(12px, 11px)}.ib-top time{font-size:max(12px, 11px)}.ib-n{font-size:max(12px, 11px)}.ib-tabs span{font-size:max(12px, 11.5px)}.brand-row .br-k{font-size:max(14px, 12px)}.vid span{font-size:max(14px, 13px)}.vid-bar em{font-size:max(14px, 12px)}.apps span{font-size:max(14px, 12px)}.rec-t{font-size:max(14px, 12px)}.rec-meta{font-size:max(14px, 12px)}.rep-side span{font-size:max(14px, 11.5px)}.rep-logos{font-size:max(14px, 12px)}.fo-row{font-size:max(14px, 13px)}.fo-row em{font-size:max(14px, 11.5px)}.vm-head{font-size:max(14px, 12.5px)}.vm p{font-size:max(14px, 12.5px)}.vm-sent{font-size:max(14px, 11.5px)}.dr-meta{font-size:max(14px, 13px)}.crumbs{font-size:max(14px, 13px)}.ind-tile .pill{font-size:max(14px, 11px)}.ind-jump a{font-size:max(14px, 13.5px)}.ind-d-head .k{font-size:max(12px, 11.5px)}.ind-col h3{font-size:max(14px, 12px)}.ind-who li{font-size:max(14px, 13px)}.ind-q{font-size:max(14px, 13.5px)}.ind-q .who{font-size:max(12px, 10.5px)}.ind-foot .t{font-size:max(14px, 12.5px)}.tl .time{font-size:max(14px, 13.5px)}.fact a.src{font-size:max(14px, 12.5px)}.tgrid .tile .pro{font-size:max(12px, 11px)}.post-card .cat{font-size:max(14px, 13px)}.post-tags span{font-size:max(14px, 12px)}.post-toc b{font-size:max(14px, 11.5px)}.prose .key b.h{font-size:max(14px, 12px)}.prose blockquote cite{font-size:max(14px, .65em)}.prose figcaption{font-size:max(14px, 13.5px)}.prose .sources{font-size:max(14px, .85em)}.prose .sources b{font-size:max(14px, 12px)}.etp-bar{font-size:max(14px, 13px)}.etp-bar .live{font-size:max(12px, 11.5px)}.etp-caller small{font-size:max(14px, 12px)}.etp-caller .mis{font-size:max(14px, 11.5px)}.etp-note{font-size:max(14px, 12.5px)}.etp-h{font-size:max(14px, 10.5px)}.etp-row .pic{font-size:max(14px, 11px)}.etp-row b{font-size:max(14px, 13.5px)}.etp-row small{font-size:max(14px, 11.5px)}.etp-row .btn-log{font-size:max(14px, 11.5px)}.etp-hist{font-size:max(14px, 12px)}.etp-phone small{font-size:max(14px, 11.5px)}.etp-cap{font-size:max(14px, 12px)}.etp-mis .lbl{font-size:max(14px, 12px)}.etp-plan .hd span{font-size:max(14px, 13.5px)}.etp-plus .k{font-size:max(12px, 11.5px)}.etp-plus li{font-size:max(14px, 13.5px)}.etp-plus li::before{font-size:max(14px, 12px)}.etp-src{font-size:max(14px, 12.5px)}.agent-body .agent-pro{font-size:max(14px, var(--fs-xs,13.5px))}.agent-body .agent-pro b{font-size:max(14px, 11px)}.dd-i small{font-size:max(14px, 12.5px)}.dd-k{font-size:max(14px, 12px)}.dd-side .link-arrow{font-size:max(14px, 13.5px)}.ftr-ti span{font-size:max(14px, 12.5px)}.ti-pill{font-size:max(14px, 13px)}.kicker{font-size:max(14px, 12px)}.hero-ti .yrs span{font-size:max(14px, 13px)}.fc-sol li{font-size:max(14px, 13px)}.fc-sol .base{font-size:max(14px, 11.5px)}.fc-ext{font-size:max(14px, 13px)}.fc-ext .x{font-size:max(14px, 11px)}.orbit-core span{font-size:max(14px, clamp(11px,1vw,13px))}.orbit-core small{font-size:max(14px, 11px)}.bd-presets span{font-size:max(14px, 12px)}.bd-preset{font-size:max(14px, 13px)}.bd-opt small{font-size:max(14px, 13px)}.bd-count{font-size:max(14px, 12.5px)}.bd-layer p{font-size:max(14px, 13px)}.bd-empty{font-size:max(14px, 13.5px)}.bd-foot p{font-size:max(14px, 13px)}.ba-node em{font-size:max(14px, 11px)}.ba-hub small{font-size:max(14px, 11px)}.ba-cap p{font-size:max(14px, 13.5px)}.vis-note{font-size:max(14px, 11.5px)}.site .k{font-size:max(12px, 11px)}.site .rk i{font-size:max(14px, 11.5px)}.fo2-link{font-size:max(14px, 12.5px)}.fo2-rows div{font-size:max(14px, 13px)}.fo2-rows b{font-size:max(14px, 13px)}.wb3 .kpi span{font-size:max(12px, 11px)}.wb3-chart .lbl{font-size:max(14px, 11.5px)}.wb3-agents div{font-size:max(14px, 13px)}.wb3-agents em{font-size:max(14px, 11px)}.hub-n.t{font-size:max(14px, 12px)}.sp-row{font-size:max(14px, 13.5px)}.sp-row em{font-size:max(14px, 11.5px)}.pay small{font-size:max(14px, 12px)}.pay .lk{font-size:max(14px, 12px)}.cxapp-side span{font-size:max(12px, 10.5px)}.ext small{font-size:max(12px, 11px)}.ext .ai-t{font-size:max(12px, 9.5px)}.st-l p{font-size:max(14px, 13.5px)}.st-l .role{font-size:max(12px, 10.5px)}.prov .new{font-size:max(12px, 10.5px)}.ait-btn small{font-size:max(14px, 13px)}.ait-steps p{font-size:max(14px, 13.5px)}.ait-cta span{font-size:max(14px, 13px)}.ait-note{font-size:max(14px, 12px)}.inc p{font-size:max(14px, 13.5px)}.dev figcaption span{font-size:max(14px, 13.5px)}.scoop b{font-size:max(14px, 13px)}.also3 span{font-size:max(14px, 13.5px)}.sep-note p{font-size:max(14px, 13.5px)!important}.sep-note .link-arrow{font-size:max(14px, 13.5px)}.ti-lock{font-size:max(14px, 13px)}.pw-k{font-size:max(14px, 12.5px)}.of-pin b{font-size:max(14px, 13px)}.of-card h3 small{font-size:max(14px, 11px)}.rs-trust{font-size:max(14px, 12.5px)}.rs-alt{font-size:max(14px, 13px)}.rs-step h3::before{font-size:max(14px, 13px)}.dia-btn{font-size:max(14px, 13px)}.dia-note{font-size:max(14px, 11.5px)}.addons span{font-size:max(14px, 13.5px)}.prec-h{font-size:max(14px, 13.5px)}.prec-steps div{font-size:max(14px, 13.5px)}.prec-steps div em{font-size:max(14px, 12px)}.way-b .k{font-size:max(12px, 11.5px)}.redact .ln b{font-size:max(12px, 11px)}.redact mark::after{font-size:max(14px, 12px)}.uses span{font-size:max(14px, 13.5px)}.nw-card .link-arrow{font-size:max(14px, 13.5px)}.nw-meta{font-size:max(14px, 12.5px)}.nw-tag{font-size:max(14px, 11px)}.dl-c .link-arrow{font-size:max(14px, 13.5px)}.dl-soon .tags span{font-size:max(14px, 12.5px)}.ref-art .nd{font-size:max(14px, 13px)}.st-k{font-size:max(14px, 12px)}.st-live{font-size:max(14px, 13px)}.st-seg button{font-size:max(14px, 13.5px)}.st-legend{font-size:max(14px, 13px)}.st-g-h p{font-size:max(14px, 13.5px)}.st-pct small{font-size:max(14px, 12.5px)}.st-chip{font-size:max(14px, 12px)}.st-r-foot{font-size:max(14px, 12px)}.st-tip{font-size:max(14px, 12.5px)}.st-tip b{font-size:max(14px, 13px)}.st-when{font-size:max(14px, 13px)}.st-imp{font-size:max(14px, 12.5px)}.st-affects span{font-size:max(14px, 12.5px)}.st-u-h{font-size:max(14px, 12px)}.st-mo{font-size:max(14px, 13px)}.st-h-t small{font-size:max(14px, 13px)}.ftr-vc-k span{font-size:max(14px, 12px)}}
@media (max-width:760px) and (max-width:720px){.cmp.vs .vs-h small{font-size:max(14px, 11.5px)}.cmp.vs td{font-size:max(14px, 13px)}.cmp.vs .badge-mini{font-size:max(12px, 9.5px)}.cmp.vs td:first-child{font-size:max(14px, 12px)}}
@media (max-width:760px) and (max-width:760px){.cmp:not(.vs) td{font-size:max(14px, 13.5px)}.ba-node{font-size:max(14px, 11.5px)}.tbar{font-size:max(14px, 12px)}}
@media (max-width:760px) and (max-width:420px){.phero-art .pa-card{font-size:max(14px, 12px)}}
@media (max-width:760px) and (max-width:520px){.ind-tile span.s{font-size:max(14px, 12.5px)}}
@media (max-width:760px) and (max-width:560px){.orbit-chip>span{font-size:max(14px, 11.5px)}}
@media (max-width:760px) and (max-width:600px){.st-stats dt{font-size:max(14px, 11px)}}
/* m-floor:end */