/* Full-screen homepage hero (fx). The motion stage is drawn at 1366x696 and scaled to fit the first screen. */
header#top.fx-hero{position:relative;padding:0!important;margin:0;overflow:hidden!important;background:radial-gradient(70% 85% at 64% 40%,#232a72 0%,#161a45 46%,#0d1030 100%)!important;color:#fff;z-index:1}
header#top.fx-hero>canvas.pl-canvas{display:none!important}
.fx-hero .fx-frame{position:relative;width:100%;height:calc(100svh - var(--fx-nav,74px));min-height:480px}
.fx-hero .fx-stage{position:absolute;z-index:2;left:0;top:0;width:1366px;height:696px;transform-origin:0 0}
.fx-hero .fx-net{position:absolute;inset:0}
.fx-hero .fx-net canvas{position:absolute;left:0;top:0;width:1366px;height:696px}
.fx-hero .fx-scrim{position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(90deg,rgba(13,16,48,.9) 0%,rgba(13,16,48,.5) 36%,rgba(13,16,48,0) 58%),linear-gradient(0deg,rgba(13,16,48,.85) 0%,rgba(13,16,48,0) 46%)}
.fx-hero .fx-node{position:absolute;z-index:8;border-radius:10px;padding:9px 12px;font-size:13px;line-height:1.25;border:1px solid rgba(255,255,255,.14);background:rgba(20,24,64,.86);white-space:nowrap;transform:translate(-50%,-50%);color:#fff;font-family:Satoshi,-apple-system,"Segoe UI",sans-serif}
.fx-hero .fx-node small{display:block;color:rgba(255,255,255,.55);font-size:11px;margin-top:2px}
.fx-hero .fx-hub{position:absolute;z-index:9;width:168px;height:168px;border-radius:50%;transform:translate(-50%,-50%);display:grid;place-items:center;text-align:center;background:radial-gradient(circle,#0a1140 58%,rgba(10,17,64,0) 60%);font-family:Satoshi,-apple-system,"Segoe UI",sans-serif}
.fx-hero .fx-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(245,138,31,.75);box-shadow:0 0 40px rgba(245,138,31,.35)}
.fx-hero .fx-ring2{position:absolute;inset:-22px;border-radius:50%;border:1.5px solid rgba(245,138,31,.25)}
.fx-hero .fx-pulse{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(245,138,31,.8);opacity:0}
.fx-hero .fx-hub span{display:block;font-size:10px;letter-spacing:.18em;color:#f8b26a;margin-bottom:4px}.fx-hero .fx-hub b{font-size:19px;font-weight:600}
.fx-hero .fx-lab{position:absolute;z-index:6;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.4)}
/* copy */
.fx-hero .fx-copy{position:absolute;left:56px;bottom:40px;width:660px;z-index:20}
.fx-hero .fx-copy .pl-eyebrow{font-size:12.5px!important;letter-spacing:.18em!important;text-transform:uppercase;color:#ff8724!important;margin:0 0 14px!important}
.fx-hero .fx-copy h1{font-size:46px!important;line-height:1.07!important;font-weight:500!important;letter-spacing:-.025em!important;margin:0 0 14px!important;color:#fff!important;max-width:none!important}
.fx-hero .fx-copy h1 .pl-span-3{color:#ff8724}
.fx-hero .fx-sub{font-size:16px;line-height:1.5;color:rgba(255,255,255,.74);margin:0 0 20px;max-width:600px}
.fx-hero .fx-sub b{color:#fff;font-weight:500}
.fx-hero .fx-btns{display:flex;gap:12px;align-items:center}
.fx-hero .fx-btns a{display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:4px;font-size:16px;font-weight:500;text-decoration:none;line-height:1.2}
.fx-hero .fx-start{background:#ff8724;color:#fff!important;box-shadow:0 8px 24px rgba(245,138,31,.3)}
.fx-hero .fx-start:hover{background:#f07a14}
.fx-hero .fx-demo{border:1px solid rgba(255,255,255,.4);color:#fff!important;background:rgba(13,16,48,.35)}
.fx-hero .fx-demo:hover{border-color:#fff}
.fx-hero .fx-micro{display:flex;gap:18px;align-items:center;margin:12px 0 0;font-size:13px;color:rgba(255,255,255,.62)}
.fx-hero .fx-micro a{color:#fff!important;text-decoration:none;display:inline-flex;align-items:center;gap:6px;background:none!important;border:0!important;padding:0!important;font-size:13px!important}
.fx-hero .fx-micro a svg{width:11px;height:11px}
/* conversation panel */
.fx-hero .fx-panel{position:absolute;z-index:15;right:56px;top:24px;width:560px;border-radius:18px;background:rgba(18,22,60,.92);border:1px solid rgba(255,255,255,.14);box-shadow:0 40px 100px rgba(0,0,0,.5);display:none;font-family:Satoshi,-apple-system,"Segoe UI",sans-serif;color:#fff}
.fx-hero .fx-pbar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.09);font-size:13px;color:rgba(255,255,255,.7)}
.fx-hero .fx-pbar b{color:#fff;font-weight:600}.fx-hero .fx-dot{width:8px;height:8px;border-radius:50%;background:#2ed66a;box-shadow:0 0 0 4px rgba(46,214,106,.16)}
.fx-hero .fx-pill{margin-left:auto;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#f8b26a;border:1px solid rgba(248,178,106,.35);padding:4px 9px;border-radius:999px}
.fx-hero .fx-pb{padding:16px 18px 18px}
.fx-hero .fx-say{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:14px 14px 14px 4px;padding:13px 15px;font-size:14.5px;line-height:1.5;color:#e9eaf6;min-height:20px}
.fx-hero .fx-say b{color:#fff}
.fx-hero .fx-u{margin:12px 0 12px auto;width:fit-content;max-width:82%;background:#5f73f4;padding:11px 14px;border-radius:14px 14px 4px 14px;font-size:14.5px;line-height:1.45;min-width:40px;min-height:43px}
.fx-hero .fx-st{font:11.5px/1.5 "SFMono-Regular",Menlo,Consolas,monospace;color:rgba(255,255,255,.58)}.fx-hero .fx-st i{color:#2ed66a;font-style:normal;margin-right:6px}
.fx-hero .fx-act{margin-top:10px;border:1px solid rgba(245,138,31,.5);background:rgba(245,138,31,.08);border-radius:12px;padding:11px 13px;font-size:13.5px}
.fx-hero .fx-act.ok{border-color:rgba(46,214,106,.55);background:rgba(46,214,106,.09)}
.fx-hero .fx-pbtns{display:flex;gap:8px;margin-top:9px}.fx-hero .fx-pbtn{font-size:12.5px;font-weight:600;padding:7px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.22);display:inline-block}.fx-hero .fx-pbtn.o{background:#f58a1f;border-color:#f58a1f;color:#141735}
.fx-hero .fx-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.fx-hero .fx-kp{border:1px solid rgba(46,214,106,.4);background:rgba(46,214,106,.07);border-radius:10px;padding:10px 12px;font-size:11.5px;color:rgba(255,255,255,.6)}
.fx-hero .fx-kp b{display:block;font-size:22px;color:#fff;font-weight:600;margin-bottom:2px;font-variant-numeric:tabular-nums}.fx-hero .fx-kp em{font-style:normal;color:#4ade80;font-size:12px;margin-left:4px}
.fx-hero .fx-cta{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:14px}
.fx-hero .fx-cta a{background:#ff8724;color:#fff!important;font-weight:600;font-size:15px;padding:12px 22px;border-radius:6px;text-decoration:none;box-shadow:0 8px 24px rgba(245,138,31,.35)}
.fx-hero .fx-cta span{font-size:12.5px;color:rgba(255,255,255,.62);line-height:1.4}
.fx-hero .fx-cursor{position:absolute;z-index:30;width:20px;height:20px;opacity:0;pointer-events:none}
.fx-hero .fx-caret{display:inline-block;width:2px;height:1em;background:#fff;vertical-align:-2px;margin-left:1px}
/* phones and small tablets: copy first, then a cropped, scaled view of the motion */
@media (max-width:899px){
 .fx-hero .fx-frame{height:auto;min-height:0}
 .fx-hero .fx-copy{position:relative;left:auto;bottom:auto;width:auto;padding:26px 20px 18px}
 .fx-hero .fx-copy h1{font-size:34px!important;line-height:1.08!important}
 .fx-hero .fx-sub{font-size:15.5px;margin-bottom:18px}
 .fx-hero .fx-btns{flex-direction:column;align-items:stretch;gap:10px}
 .fx-hero .fx-btns a{justify-content:center;padding:14px 18px}
 .fx-hero .fx-micro{flex-wrap:wrap;gap:6px 14px;justify-content:center}
 .fx-hero .fx-view{position:relative;overflow:hidden}
 .fx-hero .fx-scrim{display:none}
}
@media (prefers-reduced-motion:reduce){.fx-hero .fx-pulse{display:none}}
.fx-hero .fx-stage.fx-p .fx-panel{left:15px;right:auto;top:15px;width:450px}
.fx-hero .fx-stage.fx-p .fx-node{font-size:14px}
.fx-hero .fx-stage.fx-p .fx-kpis{gap:8px}.fx-hero .fx-stage.fx-p .fx-kp b{font-size:20px}
/* keep the hero's nodes and hub independent of the MCP page's phone rules (shared class names) */
.fx-hero .fx-stage .fx-hub{width:168px!important;height:168px!important;max-width:none!important;padding:0!important}
.fx-hero .fx-stage .fx-node{padding:9px 12px!important}
.fx-hero .fx-stage .fx-cap small{display:block!important}
/* MCP server module: a Palera connector card, steel edge, wordmark in white gradient */
.fx-hero .fx-stage .fx-hub{width:248px!important;height:148px!important;border-radius:16px!important;background:none!important;padding:0!important;display:block!important;text-align:left!important;--sw:130%;--on:0}
.fx-hero .fx-hub .fx-bezel{position:absolute;inset:0;border-radius:16px;padding:1.5px;background:linear-gradient(140deg,#d9dce6 0%,#6b718a 24%,#f2f3f7 48%,#565c75 72%,#c4c8d6 100%);box-shadow:0 22px 50px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.4)}
.fx-hero .fx-hub .fx-dial{position:relative;width:100%;height:100%;border-radius:14.5px;overflow:hidden;background:linear-gradient(180deg,#151b5a 0%,#0c1146 60%,#090d38 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.1);padding:20px 20px 0;box-sizing:border-box}
.fx-hero .fx-hub .fx-top{display:flex;align-items:center;gap:14px}
.fx-hero .fx-hub .fx-tile{flex:0 0 56px;width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(160deg,#3a46a8 0%,#232c7a 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 0 0 1px rgba(255,255,255,.1),0 6px 14px rgba(0,0,0,.4)}
.fx-hero .fx-hub .fx-pm{width:40px;height:40px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.35))}
.fx-hero .fx-hub .fx-nm{display:flex;flex-direction:column;gap:5px}
.fx-hero .fx-hub .fx-wm{font-family:Satoshi,-apple-system,"Segoe UI",sans-serif;font-size:34px!important;font-weight:700!important;letter-spacing:-.025em;line-height:.95;color:transparent;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(100deg,rgba(255,255,255,0) 40%,#fff 50%,rgba(255,255,255,0) 60%),linear-gradient(180deg,#ffffff 0%,#f1f3fa 45%,#b9c1de 100%);background-size:250% 100%,100% 100%;background-repeat:no-repeat;background-position:var(--sw) 0,0 0;filter:drop-shadow(0 0 7px rgba(255,255,255,.25)) drop-shadow(0 2px 2px rgba(0,0,0,.45))}
.fx-hero .fx-hub .fx-nm span{display:block;font-size:12.5px!important;letter-spacing:.01em!important;color:rgba(255,255,255,.62)!important;margin:0!important;font-family:Satoshi,-apple-system,"Segoe UI",sans-serif}
.fx-hero .fx-hub .fx-cs{position:absolute;left:20px;right:20px;bottom:0;height:46px;border-top:1px solid rgba(255,255,255,.1)}
.fx-hero .fx-hub .fx-cs i{position:absolute;left:0;top:14px;font-style:normal;font-size:13px;font-weight:600;font-family:Satoshi,-apple-system,"Segoe UI",sans-serif;display:inline-flex;align-items:center;gap:7px}
.fx-hero .fx-hub .fx-off{color:rgba(255,255,255,.75);opacity:calc(1 - var(--on))}
.fx-hero .fx-hub .fx-on{color:#3ee07a;opacity:var(--on)}
.fx-hero .fx-hub .fx-on svg{width:16px;height:16px;padding:2px;box-sizing:border-box;border-radius:4px;background:rgba(46,214,106,.16);color:#3ee07a}
.fx-hero .fx-hub .fx-ring{position:absolute;inset:-1px;border-radius:17px;border:1px solid rgba(233,207,164,.6)!important;box-shadow:0 0 16px rgba(245,138,31,.22)!important}
.fx-hero .fx-hub .fx-pulse{position:absolute;inset:0;border-radius:16px!important;border:1.5px solid rgba(233,207,164,.7)!important}
/* feel: polished edge, weight, glass that catches light, a precise status change */
.fx-hero .fx-hub{perspective:800px}
.fx-hero .fx-hub .fx-bezel{transform:rotateY(var(--ry,0deg));box-shadow:0 -1px 0 rgba(255,255,255,.18),0 30px 60px -12px rgba(0,0,0,.65),0 10px 22px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.45)}
.fx-hero .fx-hub .fx-dial{box-shadow:inset 0 0 0 1px rgba(0,0,0,.55),inset 0 0 0 2px rgba(255,255,255,.07),inset 0 14px 24px -14px rgba(255,255,255,.08)}
.fx-hero .fx-hub .fx-dial:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.075) 47%,rgba(255,255,255,.02) 53%,rgba(255,255,255,0) 60%);background-size:260% 100%;background-position:var(--gl,50%) 0}
.fx-hero .fx-hub .fx-cs{overflow:hidden}
.fx-hero .fx-hub .fx-off{opacity:calc(1 - var(--cs,0));transform:translateY(calc(var(--cs,0) * -30px))}
.fx-hero .fx-hub .fx-on{opacity:var(--cs,0);transform:translateY(calc((1 - var(--cs,0)) * 30px))}
.fx-hero .fx-hub .fx-on path{stroke-dasharray:12;stroke-dashoffset:calc(12 * (1 - var(--ck,0)))}
.fx-hero .fx-hub .fx-wm{font-size:27px!important;letter-spacing:-.02em;white-space:nowrap}
/* white dial: lacquered white to soft silver, navy type */
.fx-hero .fx-hub .fx-dial{background:radial-gradient(130% 100% at 28% 0%,#ffffff 0%,rgba(255,255,255,0) 62%),linear-gradient(180deg,#ffffff 0%,#f3f4f9 55%,#dfe3ee 100%);box-shadow:inset 0 0 0 1px rgba(10,17,64,.14),inset 0 2px 0 rgba(255,255,255,.9),inset 0 -14px 22px -14px rgba(20,23,53,.22)}
.fx-hero .fx-hub .fx-dial:after{background:linear-gradient(112deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.75) 47%,rgba(255,255,255,.25) 53%,rgba(255,255,255,0) 60%);background-size:260% 100%;background-position:var(--gl,50%) 0}
.fx-hero .fx-hub .fx-tile{box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 1px rgba(10,17,64,.25),0 6px 12px rgba(20,23,53,.28)}
.fx-hero .fx-hub .fx-wm{background-image:linear-gradient(100deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.75) 50%,rgba(255,255,255,0) 60%),linear-gradient(180deg,#2a2f63 0%,#141735 100%);filter:drop-shadow(0 1px 0 rgba(255,255,255,.9))}
.fx-hero .fx-hub .fx-cs{border-top-color:rgba(20,23,53,.12)}
.fx-hero .fx-hub .fx-off{color:#4a5078}
.fx-hero .fx-hub .fx-on{color:#15a34a}
.fx-hero .fx-hub .fx-on svg{background:#22c55e;color:#fff}
/* tighter corners to match the site's cards */
.fx-hero .fx-stage .fx-hub{border-radius:10px!important}
.fx-hero .fx-hub .fx-bezel{border-radius:10px}
.fx-hero .fx-hub .fx-dial{border-radius:8.5px}
.fx-hero .fx-hub .fx-ring{border-radius:11px}
.fx-hero .fx-hub .fx-pulse{border-radius:10px!important}
/* calmer: no gold ring, no glow, no edge flash */
.fx-hero .fx-hub .fx-ring,.fx-hero .fx-hub .fx-pulse{display:none!important}
.fx-hero .fx-tel{margin:6px 0 0;font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.5);max-width:660px}
@media (max-width:899px){.fx-hero .fx-tel{text-align:center;margin:8px auto 0;font-size:12px}}
.fx-hero .fx-br{display:none}
@media (max-width:899px){.fx-hero .fx-br{display:block;height:0}.fx-hero .fx-micro>span{text-align:center;flex-basis:100%}}
/* polished silver edge: thicker and brighter so it reads on navy */
.fx-hero .fx-hub .fx-bezel{padding:2.5px;background:linear-gradient(140deg,#f6f7fb 0%,#9097b0 20%,#ffffff 44%,#727995 68%,#e4e7f0 88%,#b9bed0 100%);box-shadow:0 -1px 0 rgba(255,255,255,.25),0 30px 60px -12px rgba(0,0,0,.65),0 10px 22px rgba(0,0,0,.35)}
.fx-hero .fx-hub .fx-dial{border-radius:7.5px}
.fx-hero .fx-hub .fx-bezel{background:linear-gradient(140deg,#fdfdff 0%,#7b8199 18%,#f4f5f9 38%,#4f5672 60%,#d9dce6 82%,#9aa0b6 100%)}
.fx-hero .fx-hub .fx-dial{box-shadow:inset 0 0 0 1px rgba(10,17,64,.38),inset 0 2px 0 rgba(255,255,255,.9),inset 0 -14px 22px -14px rgba(20,23,53,.22)}
/* one glint along the silver edge at the moment it connects */
.fx-hero .fx-hub .fx-bezel:after{content:"";position:absolute;inset:-2px;z-index:2;border-radius:12px;padding:4.5px;pointer-events:none;
 background:linear-gradient(115deg,rgba(255,255,255,0) 44%,rgba(255,255,255,.9) 49%,#fff 50%,rgba(255,255,255,.9) 51%,rgba(255,255,255,0) 56%);background-size:320% 100%;background-repeat:no-repeat;background-position:var(--gx,130%) 0;
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
 filter:drop-shadow(0 0 3px rgba(255,255,255,.85)) drop-shadow(0 0 8px rgba(200,215,255,.45))}
.fx-hero .fx-hub .fx-dial{z-index:1}
/* title moment: words rise in, then the headline settles into place */
.fx-hero .fx-copy h1 .fx-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.fx-hero .fx-copy h1 .fx-wi{display:inline-block;will-change:transform}
.fx-hero .fx-copy h1{will-change:transform}
/* Version B: diagram-only hero */
@media (min-width:900px){.fx-hero .fx-copy{bottom:auto!important;top:97px!important;width:540px!important}}
.fx-hero .fx-panel{display:none!important}
.fx-hero .fx-stage .fx-hub{width:234px!important;height:190px!important}
.fx-hero .fx-hub .fx-dial{padding:20px 18px 0}
.fx-hero .fx-hub .fx-top{flex-direction:column;gap:12px;align-items:center}
.fx-hero .fx-hub .fx-wm{font-size:26px!important}
.fx-hero .fx-hub .fx-cs i{left:0;right:0;justify-content:center}
@media (min-width:900px){.fx-hero .fx-scrim{background:linear-gradient(90deg,rgba(13,16,48,.92) 0%,rgba(13,16,48,.62) 34%,rgba(13,16,48,0) 50%)!important}}
@media (min-width:900px){.fx-hero .fx-tel{max-width:none}}
.fx-hero .fx-stage:not(.fx-p) .fx-lab{transform:translateX(-50%)!important}
/* precision grid: matched box sizes on computers */
.fx-hero .fx-stage:not(.fx-p) .fx-node{width:140px;min-height:52px;box-sizing:border-box;padding:9px 12px!important;display:flex;flex-direction:column;justify-content:center;white-space:nowrap}
.fx-hero .fx-stage:not(.fx-p) .fx-node small{font-size:10px}
@media (min-width:900px){.fx-hero .fx-micro{flex-wrap:wrap;row-gap:8px}.fx-hero .fx-micro>span{white-space:nowrap;flex-basis:100%}.fx-hero .fx-micro a{white-space:nowrap}}
.fx-hero .fx-node .fx-aisub{display:block;font-size:10.5px;line-height:1.35;color:rgba(255,255,255,.62);margin-top:3px;letter-spacing:0}
.fx-hero .fx-lab{display:none!important}
.fx-hero .fx-stage:not(.fx-p) .fx-ai{min-height:66px}
/* Claude, connected: orange edge with a slow light travelling around it */
.fx-hero .fx-node.fx-ai.fx-on{color:#fff!important}
.fx-hero .fx-node.fx-ai.fx-on small{color:#ffc999!important}
