@font-face{font-family:"Manrope";src:url(/assets/media-a30ddcd349703aff.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Inter";src:url(/assets/media-3100e775e8616cd2.woff2) format("woff2");font-weight:100 900;font-display:swap}
/* NORMA Q marketing site v2 — tokens, base, then one block per scene. */
:root{
  --navy:#040b17;--deep:#071427;--graphite:#0c1a2e;--line:rgba(150,195,230,.18);
  --cyan:#2fb8e6;--blue:#1a5fd0;--ice:#eef6fc;--mute:#8ba5ba;
  --amber:#f2b134;--red:#ef4a4a;--green:#34c98a;
  --f-display:"Manrope","Helvetica Neue",Arial,sans-serif;
  --f-ar:"IBM Plex Sans Arabic","Alexandria","Segoe UI",Tahoma,sans-serif; /* reserved for the Arabic/RTL build */
  --f-body:"Inter","Helvetica Neue",Arial,sans-serif;
  --f-mono:"Inter","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);--pad:clamp(20px,5vw,72px);
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--navy);color:var(--ice);font:400 18px/1.55 var(--f-body);overflow-x:hidden}
img{max-width:100%;display:block}a{color:inherit}svg{display:block;width:100%;height:auto;overflow:visible}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;z-index:99;background:#fff;color:#000;padding:8px}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.wrap{max-width:1240px;margin:auto;padding:0 var(--pad)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:start}
.fine{font-size:.82rem;color:var(--mute);margin-top:16px;max-width:60ch}
.sub{font-size:1.2rem;color:#c3d6e6;max-width:52ch;margin:-20px 0 28px}.sub.c{margin:24px auto 0;text-align:center}
.demo-tag{color:var(--amber);font-size:.82rem;letter-spacing:.06em;margin-bottom:20px}
.btn{display:inline-block;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#02101c;font:700 .98rem var(--f-display);padding:15px 28px;border:0;border-radius:3px;cursor:pointer;text-decoration:none;transition:box-shadow .3s,transform .2s}
.btn:hover{box-shadow:0 12px 34px -8px var(--cyan)}.btn.ghost{background:none;color:var(--ice);border:1px solid var(--line)}.btn.ghost:hover{border-color:var(--cyan)}.btn-sm{padding:9px 16px}

/* nav */
#nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:12px var(--pad);background:linear-gradient(var(--navy),rgba(4,11,23,.55));backdrop-filter:blur(10px)}
.brand img{height:34px;width:auto}
#links{display:flex;align-items:center;gap:26px;font:500 .92rem var(--f-display)}
#links a,#links button{text-decoration:none;color:var(--ice);background:none;border:0;font:inherit;cursor:pointer;opacity:.85}
#links a:hover,#links button:hover{opacity:1;color:var(--cyan)}.signin{border-bottom:1px solid var(--cyan)}
.has-mega{position:relative}
.mega{position:absolute;top:140%;left:-20px;display:none;grid-template-columns:repeat(3,170px);gap:24px;padding:26px;background:var(--graphite);box-shadow:0 30px 70px rgba(0,0,0,.6)}
.has-mega.open .mega,.has-mega:hover .mega,.has-mega:focus-within .mega{display:grid}
.mega b{display:block;font-size:.72rem;letter-spacing:.14em;color:var(--cyan);text-transform:uppercase;margin-bottom:8px}.mega a{display:block;padding:5px 0;font-size:.9rem}
.burger{display:none;background:none;border:1px solid var(--line);color:var(--ice);padding:8px 14px;font:inherit}

/* type */
h1,.big,h3{font-family:var(--f-display);letter-spacing:-.035em}
.big{font-weight:800;font-size:clamp(2rem,4.8vw,4.2rem);line-height:1.02;margin-bottom:56px;max-width:18ch}
.big em{font-style:normal;color:var(--mute);font-weight:600}.big.sm{font-size:clamp(1.5rem,2.8vw,2.4rem);margin:96px 0 36px;max-width:26ch}
.alt{background:linear-gradient(var(--deep),var(--navy) 85%)}

/* 01 hero */
.hero{position:relative;min-height:100svh;display:grid;align-items:center;overflow:hidden;background:radial-gradient(ellipse 55% 75% at 74% 50%,rgba(26,95,208,.34),transparent 70%),radial-gradient(ellipse 90% 40% at 50% 110%,rgba(47,184,230,.12),transparent),var(--navy)}
#gravity{position:absolute;inset:0;width:100%;height:100%}
.q-stage{position:absolute;right:max(3vw,10px);top:50%;width:min(52vw,680px);aspect-ratio:1;transform:translateY(-50%);display:grid;place-items:center}
.rings{position:absolute;inset:0}.rings circle{fill:none;stroke:rgba(47,184,230,.2);stroke-width:1}.rings .dash{stroke-dasharray:3 9;animation:spin 90s linear infinite;transform-origin:center}
.arc{fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;filter:drop-shadow(0 0 6px var(--cyan))}.a1{animation:spin 40s linear infinite;transform-origin:center}.a2{animation:spin 26s linear infinite reverse;transform-origin:center}
@keyframes spin{to{transform:rotate(360deg)}}
.q-core{width:clamp(230px,27vw,400px);height:auto;position:relative;filter:drop-shadow(0 0 30px rgba(47,184,230,.55)) drop-shadow(0 0 90px rgba(26,95,208,.6))}
.hero-copy{position:relative;max-width:800px;padding:130px var(--pad) 80px}
h1{font-weight:900;font-size:clamp(2.6rem,5.4vw,5rem);line-height:.98}h1 span{color:var(--cyan)}
.lede{margin:26px 0 34px;max-width:42ch;color:#c9dbe9;font-size:1.25rem}.cta{display:flex;flex-wrap:wrap;gap:14px}
.hero-steps{position:absolute;bottom:26px;left:var(--pad);display:flex;gap:28px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.hero-steps i{font-style:normal}.hero-steps i:last-child{color:var(--cyan)}

/* 02-03 truth + pulse */
.truth{position:relative}
.truth-copy{position:absolute;right:0;top:50%;transform:translateY(-50%);width:34%}
.truth-copy h3{font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.1;margin-bottom:10px}.truth-copy p{color:#c3d6e6}
#truthSvg text{fill:var(--ice);font:500 15px var(--f-body)}
#truthSvg .src{transform:translate(calc((1 - min(1,var(--sp,0)*2)) * var(--jx)),calc((1 - min(1,var(--sp,0)*2)) * var(--jy)));opacity:calc(.45 + min(.55,var(--sp,0)))}
#truthSvg path{fill:none;stroke:var(--cyan);stroke-width:1.4;stroke-dasharray:1;stroke-dashoffset:calc(1 - min(1,var(--sp,0)*2));filter:drop-shadow(0 0 4px rgba(47,184,230,.6))}
.pulse{margin-top:90px}.pulse-head{display:flex;flex-wrap:wrap;gap:12px 44px;font-size:1.05rem;color:var(--mute)}.pulse-head b{font:800 3rem var(--f-display);color:var(--ice);margin-right:6px;letter-spacing:-.03em}
.pulse-head .amb b{color:var(--amber)}.pulse-head .red b{color:var(--red)}
#pulseSvg .halo{fill:none;stroke:var(--red);animation:ping 2.2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes ping{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(3.2)}}
#pulseSvg .hit{cursor:pointer}.pulse-read{margin-top:10px;color:var(--cyan);min-height:1.6em}

/* 04 cause impact action */
.cia-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:46px}
.cia-tabs button{background:none;border:0;border-bottom:2px solid var(--line);color:var(--mute);padding:8px 4px;margin-right:18px;font:600 1rem var(--f-display);cursor:pointer}
.cia-tabs button[aria-selected=true]{color:var(--ice);border-color:var(--cyan)}
.cia{display:grid;grid-template-columns:repeat(4,1fr);position:relative;gap:24px}
.cia::before{content:"";position:absolute;left:0;right:0;top:10px;height:2px;background:var(--line)}
.cia::after{content:"";position:absolute;left:0;top:10px;height:2px;width:100%;background:linear-gradient(90deg,var(--cyan),var(--blue));transform-origin:left;transform:scaleX(0);transition:transform 2.4s var(--ease)}
.cia.go::after{transform:scaleX(1)}
.st{position:relative;padding-top:42px;opacity:.25;transition:opacity .6s}.st.on{opacity:1}
.st::before{content:"";position:absolute;top:2px;left:0;width:18px;height:18px;border-radius:50%;background:var(--navy);border:2px solid var(--cyan);transition:.5s}.st.on::before{background:var(--cyan);box-shadow:0 0 18px var(--cyan)}
.st small{display:block;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}.st b{display:block;font:800 clamp(1.3rem,2.4vw,2rem) var(--f-display);line-height:1.1;margin-top:6px;letter-spacing:-.02em}
.st.hot b{color:var(--amber)}.st.fin b{color:var(--green)}
.loopline{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:80px;color:var(--mute);font:600 .95rem var(--f-display)}.loopline span+span::before{content:"→";margin-right:26px;color:var(--cyan)}

/* 05 spine */
#spineStage text{fill:var(--ice);font:500 13px var(--f-body)}
#spineStage .route{fill:none;stroke:rgba(150,195,230,.35);stroke-width:2;stroke-dasharray:2 8}
.spine{position:relative;margin:24px 0 0}
#spineRange{width:100%;accent-color:var(--cyan);cursor:pointer}
#spineTicks{list-style:none;display:flex;justify-content:space-between;font:400 .75rem var(--f-mono);color:var(--mute);padding:0}
#spineTicks li{cursor:pointer;padding:6px 0}#spineTicks li.on{color:var(--cyan)}#spineTicks li.risk.on{color:var(--amber)}#spineTicks li.ok.on{color:var(--green)}
.spine-detail{min-height:120px;margin:26px 0;padding-left:22px;border-left:2px solid var(--cyan)}
.spine-detail h3{font-size:1.7rem;line-height:1.1}.spine-detail p{color:#c3d6e6;margin-top:8px;max-width:60ch}.spine-detail small{display:block;color:var(--mute);margin-top:10px;font-size:.82rem}

/* 06 planning */
@keyframes flow{to{stroke-dashoffset:-24}}
.plan-cap{margin:18px 0;font:700 1.3rem var(--f-display);color:var(--cyan);min-height:1.6em}

/* 07 vehicle */

/* 08 pricing */



/* 09 evidence */
.ev-read{margin-top:8px;color:var(--cyan);font:600 1.2rem var(--f-display);min-height:1.6em}.iso{margin-top:40px;color:var(--mute);letter-spacing:.04em}

/* 10 SOL */
.sol span{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}.sol-q p{font:700 clamp(1.4rem,2.4vw,2rem) var(--f-display);line-height:1.15;margin-top:8px;min-height:3.4em}
.sol-out{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.sol-out div{border-left:2px solid var(--line);padding-left:18px;opacity:.2;transition:.6s}.sol-out div.on{opacity:1;border-color:var(--cyan)}.sol-out b{display:block;font:700 .8rem var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:6px}.sol-out p{font-size:.98rem;color:#d3e2ee}
.sol-ap{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px;border-top:1px solid var(--line);padding-top:22px;min-height:78px}
.sol-ap .need{color:var(--amber);font:800 1.1rem var(--f-display)}.sol-ap .done{color:var(--green);font:600 1rem var(--f-display)}

/* 11 orbit */
#orbSvg text{fill:var(--ice);font:600 15px var(--f-display)}#orbSvg .ring{fill:none;stroke:rgba(47,184,230,.18)}#orbSvg .ring.sp{stroke-dasharray:2 10;animation:spin 120s linear infinite;transform-origin:500px 280px}
#orbSvg .ln{fill:none;stroke:rgba(150,195,230,.3);stroke-dasharray:4 9;animation:flow 1.6s linear infinite}#orbSvg .ln.out{animation-direction:reverse}
#orbSvg .it{cursor:pointer}#orbSvg .it:hover text,#orbSvg .it:focus text{fill:var(--cyan)}#orbSvg .ln.hot{stroke:var(--cyan);stroke-width:2}

/* 12 trust */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.stats dt{font:900 clamp(2.6rem,5.4vw,4.6rem) var(--f-display);color:var(--cyan);line-height:1;letter-spacing:-.04em}.stats dd{color:var(--mute);margin-top:8px;font-size:.95rem}
.trustline{list-style:none;display:grid;grid-template-columns:repeat(8,1fr);padding:0;position:relative}
.trustline::before{content:"";position:absolute;top:10px;left:0;height:2px;width:calc(var(--sp,0) * 160%);max-width:100%;background:linear-gradient(90deg,var(--cyan),var(--blue))}
.trustline::after{content:"";position:absolute;top:10px;left:0;right:0;height:2px;background:var(--line);z-index:-1}
.trust-read{margin-top:30px;color:var(--cyan);font:600 1.15rem var(--f-display);min-height:1.6em}

/* 13 demo */
.final{background:radial-gradient(ellipse 60% 60% at 25% 70%,rgba(26,95,208,.34),transparent),var(--navy)}
.preview{position:relative;width:min(360px,80%);margin:30px 0 0}.q-mini{position:absolute;inset:0;margin:auto;width:84px;height:auto;filter:drop-shadow(0 0 20px rgba(47,184,230,.6))}
#prevSvg circle.d{fill:var(--cyan);opacity:.85;transition:opacity .5s}#prevSvg .rg{fill:none;stroke:rgba(47,184,230,.25)}#prevSvg .ln{stroke:rgba(47,184,230,.2)}
.prev-read{margin-top:14px;color:#c3d6e6;min-height:3em}
.demo{padding:34px 0 0 36px;border-left:1px solid var(--cyan)}
.steps{display:flex;gap:22px;margin-bottom:24px;font:700 .95rem var(--f-display);color:var(--mute)}.steps .on{color:var(--cyan)}
.step{display:none;border:0;padding:0}.step.on{display:grid;gap:16px;animation:rise .5s var(--ease)}@keyframes rise{from{opacity:0;transform:translateY(12px)}}
.demo label,.demo legend{display:grid;gap:6px;font-size:.85rem;color:var(--mute)}
.demo input,.demo select,.demo textarea{background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--ice);padding:10px 0;font:1.05rem var(--f-body);border-radius:0;width:100%}.demo select option{background:var(--navy)}
.demo input:focus,.demo select:focus,.demo textarea:focus{border-color:var(--cyan);outline:0}.demo .bad{border-color:var(--red)}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chips button{padding:9px 16px;background:none;border:1px solid var(--line);border-radius:20px;color:var(--ice);cursor:pointer;font:.9rem var(--f-body);transition:.3s}.chips button[aria-pressed=true]{border-color:var(--cyan);background:rgba(47,184,230,.16)}
.nav-btns{display:flex;justify-content:space-between;margin-top:22px}
footer{padding:48px var(--pad);border-top:1px solid var(--line);display:grid;gap:20px}footer img{height:30px;width:auto}footer nav{display:flex;flex-wrap:wrap;gap:22px;font-size:.9rem}
#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,40px);background:var(--graphite);border:1px solid var(--cyan);padding:12px 20px;opacity:0;transition:.4s;z-index:90}#toast.show{opacity:1;transform:translate(-50%,0)}

/* responsive: mobile is art-directed, not stacked */
@media(max-width:980px){
  .burger{display:block}
  #links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;padding:20px var(--pad);background:var(--graphite);gap:16px}#links.open{display:flex}
  .mega{position:static;grid-template-columns:1fr;display:none}.has-mega.open .mega{display:grid}
  .split,.sol{grid-template-columns:1fr}.demo{padding:28px 0 0;border-left:0;border-top:1px solid var(--cyan)}
  .q-stage{right:50%;top:27%;transform:translate(50%,-50%);width:112vw}.q-core{width:230px}
  .hero-copy{padding-top:52svh;padding-bottom:90px}
  .truth-copy{position:static;transform:none;width:100%;margin-top:10px}
  .cia,.sol-out,.stats{grid-template-columns:1fr 1fr}.cia::before,.cia::after{display:none}
  .trustline{grid-template-columns:1fr 1fr;row-gap:20px}.trustline::before,.trustline::after{display:none}
  #spineTicks li:not(.on){font-size:0}#spineTicks li::after{content:""}
  .swipe{overflow-x:auto}.swipe svg{min-width:720px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ===== v3 polish ===== */
#beacon{position:fixed;right:12px;top:0;bottom:0;width:2px;background:linear-gradient(transparent,var(--line),transparent);z-index:40;pointer-events:none}
#beacon i{position:absolute;left:-4px;width:10px;height:10px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan);top:calc(var(--bp,0) * (100vh - 12px))}
/* coach states (set on the <use> element) */
.v-warn{--nq-accent:#f2b134;--nq-tint:#f2b134}.v-crit{--nq-accent:#ef4a4a;--nq-tint:#ef4a4a;--nq-lamp:#ffb4b4}.v-rec{--nq-accent:#34c98a;--nq-tint:#34c98a}.v-sel{--nq-accent:#2fb8e6}
/* vehicle 360 */
/* incident */
#spineStage .clock{font:800 40px var(--f-display);fill:var(--cyan)}
#spineStage .mv{transition:transform 1.8s cubic-bezier(.12,.7,.2,1)}
#spineStage .route.live{animation:flow 1s linear infinite}#spineStage .route.br{stroke:rgba(150,195,230,.25)}
#spineStage .pax{fill:var(--amber);opacity:0;transition:transform 1.3s var(--ease),opacity .6s,fill .6s}#spineStage .pax.ok{fill:var(--green)}
#spineStage .halo{fill:none;stroke:var(--red);animation:ping 2.2s ease-out infinite;transform-box:fill-box;transform-origin:center}#spineStage .halo.am{stroke:var(--amber)}
/* planning: constraint-solving field */
#planSvg text{fill:var(--ice);font:600 12px var(--f-body)}#planSvg .rl{fill:var(--mute);font-weight:500}#planSvg .tt{fill:var(--mute);font-size:11px}
#planSvg .lane{fill:rgba(255,255,255,.025)}#planSvg .tk{stroke:rgba(150,195,230,.1)}
#planSvg .bk{opacity:0;transform:translateX(-36px);transition:transform .9s var(--ease),opacity .6s}
#planSvg .bk rect{fill:rgba(47,184,230,.24);stroke:var(--cyan);transition:fill .5s,stroke .5s}
#planSvg:is(.p0,.p1,.p2,.p3) .bk.trip{opacity:1;transform:none}
#planSvg .band{opacity:0;transition:opacity .7s}#planSvg .band rect{fill:rgba(242,177,52,.14);stroke:var(--amber);stroke-dasharray:4 4}#planSvg .band text{fill:var(--amber);font-size:11px}
#planSvg:is(.p1,.p2,.p3) .band{opacity:1}
#planSvg .cfl,#planSvg .cft{opacity:0;transition:opacity .5s}#planSvg .cfl{stroke:var(--amber);stroke-dasharray:3 4}#planSvg .cft{fill:var(--amber);font-size:12px}
#planSvg:is(.p1,.p2) .cfl,#planSvg:is(.p1,.p2) .cft{opacity:1}
#planSvg:is(.p1,.p2) .tb rect{fill:rgba(242,177,52,.28);stroke:var(--amber)}
#planSvg .bk.gh{opacity:0}#planSvg .gh rect{fill:rgba(47,184,230,.06);stroke-dasharray:5 4}#planSvg .gh text{fill:var(--cyan)}
#planSvg.p2 .bk.gh{opacity:1;transform:none}
#planSvg.p3 .tb.v,#planSvg.p3 .tb.d{transform:translateY(52px)}#planSvg.p3 .tb rect{fill:rgba(52,201,138,.22);stroke:var(--green)}
#planSvg .vp{fill:var(--green);font:800 22px var(--f-display);opacity:0;transition:opacity .8s}#planSvg.p3 .vp{opacity:1}
/* pricing extras */

/* evidence */
#evSvg text{fill:var(--ice);font:600 14px var(--f-display)}#evSvg .st2{fill:var(--mute);font-weight:500;font-size:14px}
#evSvg .trk{fill:none;stroke:rgba(150,195,230,.16)}#evSvg .hsp{cursor:pointer}#evSvg .hsp circle{fill:var(--navy);stroke:var(--cyan);stroke-width:2.5;transition:.3s}#evSvg .hsp:hover circle,#evSvg .hsp:focus circle,#evSvg .hsp.hot circle{fill:var(--cyan)}
/* SOL workspace */
.sol{display:grid;grid-template-columns:1fr;gap:30px;position:relative}
#solSvg text{fill:var(--ice);font:600 16px var(--f-display)}#solSvg .res{fill:#c3d6e6;font:500 14px var(--f-body);opacity:0;transition:opacity .6s}#solSvg .res.on{opacity:1}
#solSvg .sl{fill:none;stroke:rgba(150,195,230,.25);transition:stroke .5s}#solSvg .sl.hot{stroke:var(--cyan);stroke-width:2}#solSvg .sn{fill:var(--navy);stroke:var(--mute);stroke-width:2;transition:.5s}#solSvg .sn.hot{fill:var(--cyan);stroke:var(--cyan)}
#solSvg .core{fill:rgba(26,95,208,.18);stroke:var(--cyan)}#solSvg .core2{fill:none;stroke:rgba(47,184,230,.35);stroke-dasharray:3 8;animation:spin 40s linear infinite;transform-origin:400px 135px}
.gt{opacity:0;transform:translateY(6px);transition:opacity .7s,transform .7s;color:var(--green);font:600 1.05rem var(--f-display)}.gt.on{opacity:1;transform:none}
.sol-ap .ready{color:var(--cyan);font:800 1.1rem var(--f-display)}
/* trust gates */
.trustline li{position:relative;padding:44px 8px 0 0;cursor:pointer;font:700 .98rem var(--f-display);outline-offset:6px}
.gate{position:absolute;top:0;left:0;width:22px;height:22px}.gate b{position:absolute;left:0;width:22px;height:9px;background:var(--cyan);transition:transform .7s var(--ease),opacity .7s}
.gate b:first-child{top:0}.gate b:last-child{top:13px}
.trustline li.open .gate b:first-child{transform:translateY(-12px);opacity:.25}.trustline li.open .gate b:last-child{transform:translateY(12px);opacity:.25}
.trustline li.hot{color:var(--cyan)}
/* orbit hierarchy */
#orbSvg .disk{fill:rgba(26,95,208,.16);stroke:rgba(47,184,230,.5)}#orbSvg .in text{fill:var(--mute);font-size:13px;font-weight:500}#orbSvg .out text{font-size:17px;font-weight:700}
/* mobile: dedicated compact compositions */
@media(max-width:980px){
  .desk-only{display:none}
  #planSvg text{font-size:20px}#planSvg .tt,#planSvg .band text{font-size:16px}#spineStage text{font-size:20px}#spineStage .clock{font-size:52px}
  #solSvg text{font-size:21px}#solSvg .res{font-size:18px}#evSvg text{font-size:19px}#orbSvg text{font-size:20px}
}

#spineStage .fx{opacity:0;transition:opacity .6s}#spineStage .fx.on{opacity:1}


/* ===== Vehicle Digital Twin ===== */
.dtwin{--mode:var(--cyan);background:radial-gradient(ellipse 70% 55% at 38% 62%,rgba(26,95,208,.24),transparent 70%),var(--navy)}
.dtwin[data-mode=health]{--mode:var(--green)}.dtwin[data-mode=cost]{--mode:#5b8cff}.dtwin[data-mode=predict]{--mode:var(--amber)}
.dt-modes{display:flex;flex-wrap:wrap;gap:6px 30px;margin:8px 0 28px;border-bottom:1px solid var(--line)}
.dt-modes button{background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;color:var(--mute);padding:12px 2px;font:700 1.02rem var(--f-display);cursor:pointer;transition:color .2s,border-color .3s}
.dt-modes button:hover{color:var(--ice)}.dt-modes button[aria-selected=true]{color:var(--ice);border-color:var(--mode)}
.dt-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:22px}
.dt-kpis b{display:block;font:800 clamp(1.3rem,2.4vw,2rem) var(--f-display);letter-spacing:-.02em;line-height:1.1}.dt-kpis span{color:var(--mute);font-size:.9rem}
.dt-main{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:center}
.dt-stage{position:relative;aspect-ratio:800/533;overflow:hidden;perspective:1400px}
.dt-floor{position:absolute;left:8%;right:8%;bottom:4%;height:30%;border-radius:50%;border:1px solid var(--mode);opacity:.35;box-shadow:inset 0 0 60px -20px var(--mode),0 0 50px -24px var(--mode);transition:border-color .5s,box-shadow .5s}
.dt-cam{position:absolute;inset:0;transform-origin:0 0;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.dt-tilt{position:absolute;inset:0;transition:transform .3s ease-out;transform-style:flat}
.dt-bus,.dt-glow{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;-webkit-mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,#000 55%,transparent 100%)}
.dt-glow{filter:blur(24px) saturate(1.3);opacity:.6;animation:dtpulse 5s ease-in-out infinite;transition:transform .3s ease-out}
@keyframes dtpulse{50%{opacity:.95}}@keyframes dtping{from{transform:scale(.6);opacity:.9}to{transform:scale(1.5);opacity:0}}
.dtwin:not(.on) .dt-glow,.dtwin:not(.on) .dt-hs button::after{animation-play-state:paused}
.dt-hs button{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;background:none;border:0;border-radius:50%;cursor:pointer;color:var(--ice)}
.dt-hs button::before{content:"";position:absolute;inset:16px;border-radius:50%;background:var(--ice);box-shadow:0 0 0 3px rgba(4,11,23,.85),0 0 14px var(--cyan);transition:.3s}
.dt-hs button::after{content:"";position:absolute;inset:8px;border-radius:50%;border:1.5px solid var(--cyan);animation:dtping 2.4s ease-out infinite}
.dt-hs button.s1::before{background:var(--amber);box-shadow:0 0 0 3px rgba(4,11,23,.85),0 0 14px var(--amber)}.dt-hs button.s1::after{border-color:var(--amber)}
.dt-hs button.s2::before{background:var(--red);box-shadow:0 0 0 3px rgba(4,11,23,.85),0 0 14px var(--red)}.dt-hs button.s2::after{border-color:var(--red)}
.dt-hs button[aria-pressed=true]::before{transform:scale(1.5)}
.dt-hs button span{position:absolute;left:50%;bottom:100%;transform:translate(-50%,-2px);white-space:nowrap;background:rgba(4,11,23,.9);padding:4px 10px;font:600 .8rem var(--f-body);opacity:0;pointer-events:none;transition:opacity .2s}
.dt-hs button:hover span,.dt-hs button:focus-visible span,.dt-hs button[aria-pressed=true] span{opacity:1}
.dt-panel{position:relative;z-index:2;padding-left:24px;border-left:2px solid var(--mode);min-height:320px;transition:border-color .4s}
.dt-panel small{color:var(--mode);font:700 .78rem var(--f-display);letter-spacing:.14em;text-transform:uppercase}
.dt-panel h3{font:800 1.7rem var(--f-display);margin:8px 0 6px;line-height:1.1}.dt-panel p{color:#c3d6e6;margin-top:6px}.dt-panel .hd{font:700 1.15rem var(--f-display);color:var(--ice);margin-top:14px}
.dt-panel .rec{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}.dt-panel .rec b{display:block;color:var(--mode);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}
.dt-panel .btn{margin-top:20px}
.alerts{list-style:none;padding:0;margin:14px 0 0}.alerts button{display:flex;gap:12px;align-items:center;width:100%;background:none;border:0;border-bottom:1px solid var(--line);color:var(--ice);padding:13px 0;text-align:left;font:600 1rem var(--f-body);cursor:pointer}.alerts button:hover{color:var(--mode)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;background:var(--cyan);margin-right:10px;vertical-align:middle}.alerts .dot{margin:0}.dot.s1{background:var(--amber)}.dot.s2{background:var(--red)}
.dt-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;overflow:visible}.dt-lines path{fill:none;stroke-width:1.6;stroke-dasharray:5 7;animation:flow 1.1s linear infinite}
.dt-parts{margin-top:22px;justify-content:flex-start}
@media(max-width:980px){
  .dt-modes{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.dt-kpis{grid-template-columns:1fr 1fr;gap:16px}
  .dt-main{grid-template-columns:1fr;gap:26px}.dt-panel{min-height:0}
}
@media(prefers-reduced-motion:reduce){.dt-cam,.dt-tilt{transition:none!important}}.dtwin.scene{padding-top:clamp(100px,9vw,130px)}.dtwin .big{margin-bottom:22px}.dtwin .sub{margin:0 0 18px}.dtwin .dt-modes{margin-top:0}

/* ===== Commercial Intelligence Command Center ===== */
.cc{background:radial-gradient(ellipse 80% 40% at 15% 0%,rgba(26,95,208,.2),transparent 70%),radial-gradient(ellipse 60% 30% at 92% 55%,rgba(47,184,230,.07),transparent),var(--navy);padding-bottom:140px}
.cc-wrap{max-width:1380px}.cc .big{max-width:none}
.cc-eyebrow{color:var(--cyan);font:700 .85rem var(--f-display);letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}
.cc-lede{font-size:1.2rem;color:#c3d6e6;max-width:60ch;margin:-18px 0 22px}
.cc-story{font:600 clamp(1.1rem,2vw,1.5rem) var(--f-display);color:var(--mute);margin-bottom:10px}.cc-story b{color:var(--ice)}
.chip{display:inline-block;padding:3px 10px;border:1px solid currentColor;font:700 .74rem var(--f-display);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.chip.v0{color:var(--green)}.chip.v1{color:var(--amber)}.chip.v2{color:var(--red)}.chip.big{font-size:.95rem;padding:7px 16px}
.cc-bar{position:sticky;top:58px;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px 0;margin-top:36px;background:linear-gradient(rgba(4,11,23,.97),rgba(4,11,23,.9));backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.cc-rail{list-style:none;display:flex;gap:4px;padding:0;margin:0}
.cc-rail a{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--mute);font:700 .85rem var(--f-display);padding:8px 10px;transition:color .3s;white-space:nowrap}
.cc-rail i{font-style:normal;display:grid;place-items:center;width:22px;height:22px;border:1px solid var(--line);border-radius:50%;font-size:.72rem;transition:.3s}
.cc-rail a.done i{border-color:var(--cyan);color:var(--cyan)}.cc-rail a.on{color:var(--ice)}.cc-rail a.on i{background:var(--cyan);border-color:var(--cyan);color:#02101c}
.cc-kpis{display:flex;gap:24px;margin:0}.cc-kpis dt{font:800 1.3rem var(--f-display);letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap}.cc-kpis dd{margin:3px 0 0;font-size:.72rem;color:var(--mute);white-space:nowrap}
.cc-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start;margin-top:30px}
.cc-ctrl{position:sticky;top:136px;max-height:calc(100vh - 156px);overflow:auto;padding:4px 4px 20px 26px;border-left:1px solid var(--line);scrollbar-width:thin}
.ctl-h{font:700 .74rem var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin:26px 0 10px}.ctl-h.first{margin-top:0}
.scn{display:grid;gap:2px}.scn button{text-align:left;background:none;border:0;border-left:2px solid var(--line);padding:10px 12px;color:var(--mute);cursor:pointer;font:400 .84rem/1.4 var(--f-body);transition:.25s}
.scn button b{display:block;color:var(--ice);font:700 1rem var(--f-display)}.scn button:hover{background:rgba(47,184,230,.05)}.scn button[aria-checked=true]{border-color:var(--cyan);background:rgba(47,184,230,.09);color:#c3d6e6}
.note{font-size:.82rem;color:var(--mute);margin-top:10px;max-width:34ch}
.price{display:flex;align-items:center;gap:12px}.price input{flex:1;accent-color:var(--cyan)}.price output{font:800 1.2rem var(--f-display);min-width:56px;text-align:right;font-variant-numeric:tabular-nums}
.grp{border-top:1px solid var(--line);padding:2px 0}.grp summary{cursor:pointer;padding:12px 0;font:700 .92rem var(--f-display);list-style:none;display:flex;justify-content:space-between}.grp summary::after{content:"+";color:var(--cyan)}.grp[open] summary::after{content:"–"}
.fld{display:grid;grid-template-columns:1fr 84px;gap:2px 12px;align-items:center;margin:0 0 12px}.fld label{grid-column:1/-1;font-size:.82rem;color:#c3d6e6;display:flex;justify-content:space-between;gap:8px}.fld label small{color:var(--mute)}
.fld input[type=range]{accent-color:var(--cyan);width:100%}.fld input[type=number],.fld select{background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--ice);padding:7px 8px;font:500 .9rem var(--f-body);width:100%;font-variant-numeric:tabular-nums}.fld.sel{grid-template-columns:1fr}.fld select option{background:var(--navy)}
#resetBtn{margin-top:18px;width:100%}
/* stages */
.stage{padding:64px 0 72px;border-top:1px solid var(--line);scroll-margin-top:140px}.stage:first-child{border-top:0;padding-top:8px}
.st-head{display:grid;grid-template-columns:72px 1fr;margin-bottom:34px}.st-n{font:800 3.4rem var(--f-display);color:rgba(47,184,230,.28);line-height:1;letter-spacing:-.04em}
.st-head h3{font:800 clamp(1.7rem,2.8vw,2.5rem) var(--f-display);letter-spacing:-.03em;line-height:1.05;text-transform:uppercase}.st-head p{color:#c3d6e6;margin-top:10px;max-width:64ch}
.sub-h{font:700 .78rem var(--f-display);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin:40px 0 14px}.sub-h:first-of-type{margin-top:0}
.st-split{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:48px;align-items:center}.clock-wrap{position:relative;display:grid;place-items:center}
#clockSvg{display:block;max-width:100%}#clockSvg .cg{fill:none;stroke:rgba(150,195,230,.14)}#clockSvg .ct{stroke:rgba(150,195,230,.3)}
#clockSvg .ar{fill:none;stroke-linecap:butt;opacity:.3;transition:opacity .2s,stroke .2s}#clockSvg .c0{stroke:#4cc3f0}#clockSvg .c1{stroke:#3d78f0}#clockSvg .c2{stroke:#dff3ff}#clockSvg .ar.on{opacity:1}
#clockSvg.h0 .c0,#clockSvg.h1 .c1,#clockSvg.h2 .c2{display:none}#clockSvg .hand{stroke:#fff;stroke-width:1.5}
#clockSvg .cbig{fill:var(--ice);font:800 38px var(--f-display);font-variant-numeric:tabular-nums}#clockSvg{cursor:crosshair}
.cc svg .ax{fill:var(--mute);font:500 11px var(--f-body)}
.legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:6px}.lg{display:flex;align-items:center;gap:8px;background:none;border:0;color:var(--ice);font:600 .9rem var(--f-body);cursor:pointer;padding:6px 0;opacity:1}.lg[aria-pressed=false]{opacity:.4}
.lg i{width:22px;height:4px;border-radius:2px}.lg.c0 i{background:#4cc3f0}.lg.c1 i{background:#3d78f0}.lg.c2 i{background:#dff3ff}.lg b{color:var(--mute);font-weight:500}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px 30px;margin:24px 0 0}.facts div{min-width:0}.facts dt{font:800 clamp(1.4rem,2.2vw,1.9rem) var(--f-display);letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}.facts dd{color:var(--mute);font-size:.86rem;margin:4px 0 0}
.insight{margin-top:22px;padding-left:16px;border-left:2px solid var(--cyan);color:#d3e2ee;max-width:64ch}.hint{font-size:.85rem;color:var(--mute);margin:12px 0 0}
.chart{position:relative;padding:22px 6px 8px;background:linear-gradient(180deg,rgba(16,31,53,.55),rgba(9,18,32,.15));border:1px solid rgba(150,195,230,.1)}.chart svg{display:block;width:100%}
.tip{position:absolute;z-index:5;pointer-events:none;background:rgba(7,20,39,.97);border:1px solid var(--line);padding:9px 12px;font-size:.84rem;line-height:1.5;box-shadow:0 14px 34px rgba(0,0,0,.55);white-space:nowrap}.tip[hidden]{display:none}.tip b{display:block;font:700 .95rem var(--f-display)}.tip .am{color:var(--amber)}
.chart .gl{stroke:rgba(150,195,230,.1)}.chart text.ceil-t{fill:#cfe6f5;font:600 12px var(--f-body)}.chart .ceil{stroke:#cfe6f5;stroke-dasharray:5 5}.chart .pk-t{fill:var(--ice);font:700 13px var(--f-display)}
.chart .cx{stroke:#fff;stroke-opacity:.6}.chart .cxd{fill:#fff;stroke:#040b17;stroke-width:3}#pcx.lk .cx{stroke:var(--amber);stroke-opacity:1}.chart .hit{fill:transparent;cursor:crosshair}
.hourbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-bottom:26px}.hourbar label{font:700 .8rem var(--f-display);letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}.hourbar input{flex:1;min-width:160px;accent-color:var(--cyan)}.hourbar output{font:600 .95rem var(--f-body);min-width:210px;font-variant-numeric:tabular-nums}
.btn.sm{padding:9px 16px;font-size:.85rem}
.alloc-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:48px}.alloc-grid h4{font:800 1.3rem var(--f-display);margin-bottom:14px}.alloc-grid h4 span{display:block;font:500 .86rem var(--f-body);color:var(--mute);margin-top:3px}
.tk-lab{display:flex;align-items:center;gap:8px;font-size:.86rem;color:#c3d6e6;margin:16px 0 8px}.tk-lab b{color:var(--ice)}.sw{width:12px;height:12px;border-radius:3px;display:inline-block}.sw.re{background:#38b6e8}.sw.nw{background:var(--amber)}.sw.dr{background:var(--ice);border-radius:50%}.sw.sp{border:1.5px solid var(--ice);border-radius:50%}
.tks{display:flex;flex-wrap:wrap;gap:4px}.tks i{width:13px;height:13px;border-radius:3px;background:#38b6e8;transition:opacity .25s}.tks i.nw{background:var(--amber)}.tks.drv i{width:11px;height:11px;border-radius:50%;background:var(--ice)}.tks.drv i.sp{background:transparent;border:1.5px solid var(--ice)}.tks i.off{opacity:.14}
.tks.run i{animation:tkin .55s var(--ease) both;animation-delay:calc(var(--i)*3ms)}@keyframes tkin{from{opacity:0;transform:translateY(10px) scale(.5)}}
.calc{margin-top:26px;color:#c3d6e6;max-width:70ch;font-size:.95rem}.calc b{color:var(--ice)}
.km{margin-top:26px}.km-bar{display:flex;height:34px;font:700 .82rem var(--f-display)}.km-bar span{display:flex;align-items:center;padding:0 12px;white-space:nowrap;overflow:hidden}.km-bar .lo{background:rgba(47,184,230,.3);border:1px solid #2fb8e6}.km-bar .em{background:repeating-linear-gradient(135deg,rgba(242,177,52,.5) 0 6px,rgba(242,177,52,.22) 6px 12px);border:1px solid var(--amber)}.km p{margin-top:8px;color:var(--mute);font-size:.88rem}
.wb rect{transform-origin:0 0;transition:transform .7s var(--ease),fill .4s}.wb text{transition:transform .7s var(--ease)}.wb.tot rect{fill:#2fb8e6}.wb.cost rect{fill:#4a6a8c}.wb.sub rect{fill:#4f86ff}.wb.fin rect.good{fill:#34c98a}.wb.fin rect.mid{fill:#4f86ff}.wb.fin rect.neg{fill:#f2b134}.wb .hit{fill:transparent;transform:none!important}
.wb text.v{fill:var(--ice);font:700 14px var(--f-display);font-variant-numeric:tabular-nums}.wb text.p{font-size:11px}.wb:hover rect:first-child,.wb:focus rect:first-child{filter:brightness(1.2)}.wb{outline:none;cursor:default}.cn{stroke:rgba(150,195,230,.35);stroke-dasharray:3 3}
.s-cur{stroke:#7fd6f5;stroke-width:2.6}.s-lo{stroke:#f2b134;stroke-width:1.6;stroke-dasharray:5 5}.s-hi{stroke:#cfe6f5;stroke-width:1.6;stroke-dasharray:5 5}.zero{stroke:rgba(255,255,255,.4)}.pbl{stroke:#34c98a;stroke-dasharray:3 4}.pb-t{fill:var(--green);font:700 13px var(--f-display)}.am-t{fill:var(--amber);font:700 13px var(--f-display)}
.gloss{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px 28px;margin:34px 0 0}.gloss dt{font:700 .82rem var(--f-display);color:var(--cyan);letter-spacing:.06em;text-transform:uppercase}.gloss dd{margin:4px 0 0;color:var(--mute);font-size:.86rem}
.cmp{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cmp-c{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;background:none;border:0;border-left:1px solid var(--line);padding:22px 22px 24px;color:var(--ice);cursor:pointer;transition:background .3s}.cmp-c:first-child{border-left:0}.cmp-c:hover{background:rgba(47,184,230,.05)}.cmp-c.on{background:rgba(47,184,230,.1);box-shadow:inset 0 3px 0 var(--cyan)}
.cmp-n{font:800 1.1rem var(--f-display)}.cmp-m{font:800 2.6rem var(--f-display);letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}.cmp-l{font-size:.8rem;color:var(--mute)}
.mbar{position:relative;display:block;width:100%;height:6px;background:rgba(255,255,255,.08);margin:6px 0 10px}.mbar i{position:absolute;inset:0 auto 0 0;background:var(--cyan);transition:width .6s var(--ease)}.mbar u{position:absolute;top:-4px;bottom:-4px;width:2px;background:#fff;text-decoration:none}
.cmp-c dl{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin:0;width:100%}.cmp-c dt{font:700 1rem var(--f-display);font-variant-numeric:tabular-nums}.cmp-c dd{margin:1px 0 0;font-size:.76rem;color:var(--mute)}
.surf-ctl{display:flex;gap:8px;margin-bottom:12px}.surf-ctl button{background:none;border:1px solid var(--line);color:var(--mute);padding:8px 16px;font:700 .85rem var(--f-display);cursor:pointer}.surf-ctl button[aria-pressed=true]{color:var(--ice);border-color:var(--cyan);background:rgba(47,184,230,.12)}
#surfCv{display:block;max-width:100%;cursor:crosshair;touch-action:none}.skey{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:.82rem;color:var(--mute);margin-top:12px}.skey span{display:flex;align-items:center;gap:7px}.skey i{width:16px;height:10px}.skey u{width:16px;height:2px;background:#ebf7ff}
.risks{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}.rk{display:grid;grid-template-columns:20px minmax(120px,1.1fr) 1.6fr auto;gap:10px 14px;align-items:center;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);color:var(--ice);padding:15px 0;cursor:pointer;font:500 .95rem var(--f-body)}.rk:hover{background:rgba(47,184,230,.04)}
.rk .rk-n{font:700 1rem var(--f-display)}.rk .rk-v{color:var(--mute)}.rk em{font:700 .72rem var(--f-display);letter-spacing:.08em;text-transform:uppercase;font-style:normal}.rk em.sv0{color:var(--cyan)}.rk em.sv1{color:var(--amber)}.rk em.sv2{color:var(--red)}.rk-d{margin:0;padding:12px 0 18px 34px;color:#c3d6e6;border-bottom:1px solid var(--line);max-width:80ch}.rk-d[hidden]{display:none}
.vd{padding-top:6px}.vd-head{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-bottom:26px}.vd-head p{font:600 clamp(1.1rem,1.8vw,1.4rem) var(--f-display);max-width:46ch}
.vd-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:30px 40px;border-top:1px solid var(--line);padding-top:26px}.vd h5{font:700 .76rem var(--f-display);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-bottom:8px}.vd p,.vd li{color:#d3e2ee;font-size:.95rem}.vd ul{padding-left:18px;margin:0}
.opt-h{margin-top:34px}.opt{padding-left:20px;display:grid;gap:10px;max-width:80ch}.opt b{color:var(--ice)}.vd-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
@media(max-width:1100px){
  .cc-grid{grid-template-columns:1fr;gap:26px}.cc-ctrl{position:static;max-height:none;order:-1;border-left:0;border-bottom:1px solid var(--line);padding:0 0 22px}
  .cc-bar{flex-wrap:wrap;gap:8px 20px}.st-split{grid-template-columns:1fr;gap:28px}.alloc-grid{grid-template-columns:1fr;gap:34px}
}
@media(max-width:720px){
  .cc-rail a{padding:6px 4px}.cc-rail a span{display:none}.cc-rail a.on span{display:inline}.cc-kpis{gap:14px;flex-wrap:wrap}.cc-kpis .hm{display:none}.cc-kpis dt{font-size:1.05rem}
  .st-head{grid-template-columns:1fr}.st-n{font-size:2.2rem}.rk{grid-template-columns:18px 1fr auto}.rk .rk-v{grid-column:2/-1;order:4}.cmp{grid-template-columns:1fr}.cmp-c{border-left:0;border-top:1px solid var(--line)}.cmp-c:first-child{border-top:0}
  .hourbar output{min-width:0;width:100%}.chart{padding:16px 0 6px}.chart .pk-t{font-size:12px}
}
/* containment fixes: sticky bar, rail and KPIs never exceed the viewport */
.cc-bar{flex-wrap:wrap;row-gap:8px;min-width:0}
.cc-rail{min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:none}
.cc-rail::-webkit-scrollbar{display:none}
.cc-kpis{flex-wrap:wrap;row-gap:8px;min-width:0}
@media (max-width:1100px){.cc-bar{position:static}.cc-rail{width:100%}}
@media (max-width:520px){.cc-kpis .hm{display:none}.cc-rail a{padding:6px 3px}}


/* ===== Typography system v5: Manrope (display) + Inter (interface and body) ===== */
:root{--t-hero:clamp(2.5rem,5.6vw,5.4rem);--t-h2:clamp(1.9rem,4.1vw,3.7rem)}
body{font-feature-settings:"cv11","ss03";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,.big,h3,.btn,.stats dt,.pulse-head b{font-feature-settings:"ss01";font-kerning:normal}
h1{font-weight:800;font-size:var(--t-hero);line-height:1;letter-spacing:-.035em;text-transform:uppercase;text-wrap:balance}
.big{font-weight:800;font-size:var(--t-h2);line-height:1.04;letter-spacing:-.03em;text-transform:uppercase;max-width:20ch;text-wrap:balance}
.big em{font-weight:700}
.big.sm{font-size:clamp(1.4rem,2.6vw,2.2rem);max-width:28ch}
h3{letter-spacing:-.02em}
.cc .big{font-size:clamp(2.1rem,4.4vw,4rem)}
.lede,.sub,.cc-lede{text-wrap:pretty;line-height:1.6}
.sub{max-width:58ch;color:#b9cde0;font-size:1.12rem;margin:-26px 0 34px}.sub.c{margin:24px auto 0;text-align:center}
.eyebrow,.demo-tag,.hero-steps,.fine{font-family:var(--f-body)}
.demo-tag{letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;font-weight:600}
.btn{letter-spacing:.04em;text-transform:uppercase;font-size:.82rem;font-weight:800;padding:16px 28px}
.btn-sm{padding:11px 18px;font-size:.74rem}
.btn.ghost{font-weight:700}
.lnk{display:inline-block;margin-left:22px;color:var(--cyan);font:700 .82rem var(--f-display);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid transparent;padding:6px 0;transition:border-color .3s}
.lnk::after{content:" →"}.lnk:hover,.lnk:focus-visible{border-color:var(--cyan)}
.stats dt,.pulse-head b,.cc-kpis dt,.k dt{font-variant-numeric:tabular-nums lining-nums}
#links{font-weight:600;font-size:.86rem;letter-spacing:.01em}
.mega b{font-family:var(--f-display);letter-spacing:.1em;text-transform:uppercase;font-size:.7rem}
:lang(ar){font-family:var(--f-ar)}:lang(ar) h1,:lang(ar) .big{text-transform:none;letter-spacing:0;line-height:1.25}
/* editorial entrance: headline lines rise in as the section arrives */
@media (prefers-reduced-motion:no-preference){.scene .big{animation:nqRise .9s cubic-bezier(.2,.7,.2,1) both;animation-timeline:view();animation-range:entry 0% entry 55%}}
@keyframes nqRise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.hero-copy{max-width:min(860px,60vw)}
h1{font-size:clamp(2.2rem,4.5vw,4.5rem);max-width:none}
h1 span{display:block}
@media(max-width:980px){.hero-copy{max-width:100%}h1{font-size:clamp(2rem,8.4vw,3.4rem)}}
.big{letter-spacing:-.012em;word-spacing:.08em}h1{letter-spacing:-.018em;word-spacing:.06em}
.cc .big{letter-spacing:-.01em}
#trust .big{max-width:30ch}
@media(max-width:600px){.hero-steps{display:flex;flex-wrap:wrap;gap:6px 18px;right:var(--pad);max-width:calc(100% - 2*var(--pad))}.hero-steps i{margin:0}}

/* =====================================================================
   NORMA Q V6 — cinematic visual layer. Loaded after styles.css.
   Logic (script.js, cc.js, nqsim.js) is untouched; this layer re-composes
   type, light, depth and rhythm, and adds the reveal/parallax system.
   ===================================================================== */
:root{
  --void:#03070e;--graph:#0b121c;--steel:#141e2c;--edge:rgba(170,210,245,.16);--edge-hi:rgba(120,215,255,.55);
  --glass:linear-gradient(160deg,rgba(24,38,58,.62),rgba(9,16,28,.52));
  --ease:cubic-bezier(.2,.7,.2,1);
}
body{background:var(--void)}
::selection{background:rgba(47,184,230,.35)}

/* ---------- section rhythm ---------- */
.scene{position:relative;isolation:isolate;padding-block:clamp(110px,13vw,200px)}
.scene::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,var(--edge-hi) 50%,transparent);opacity:.5;z-index:1}
.sc-void{background:radial-gradient(ellipse 70% 50% at 82% 8%,rgba(26,95,208,.20),transparent 70%),radial-gradient(ellipse 60% 40% at 8% 100%,rgba(47,184,230,.08),transparent 70%),var(--void)}
.sc-metal{background:
  repeating-linear-gradient(100deg,rgba(255,255,255,.012) 0 2px,transparent 2px 7px),
  radial-gradient(ellipse 80% 55% at 50% 0%,rgba(120,160,200,.13),transparent 70%),
  linear-gradient(180deg,#0c1520,#0a1019 60%,#080d15)}
.sc-grid::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(rgba(120,190,240,.05) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,rgba(120,190,240,.05) 1px,transparent 1px) 0 0/64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 45%,#000,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 45%,#000,transparent 75%)}
.wrap{max-width:1360px}

/* ---------- editorial section header ---------- */
.sec-head{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:20px clamp(32px,6vw,110px);align-items:end;margin-bottom:clamp(48px,6vw,92px)}
.idx{display:flex;align-items:center;gap:14px;grid-column:1/-1;margin:0 0 6px;color:var(--cyan);font:700 .74rem var(--f-display);letter-spacing:.22em;text-transform:uppercase}
.idx i{font-style:normal;color:var(--ice);opacity:.55;font-variant-numeric:tabular-nums}
.idx::after{content:"";width:64px;height:1px;background:linear-gradient(90deg,var(--cyan),transparent)}
.idx.c{justify-content:center}
.sec-head .big{margin:0;max-width:none}
.sec-head .sub{margin:0;max-width:44ch;color:#aebfd2;font-size:1.06rem;padding-bottom:.6em}
.big{font-size:clamp(2.3rem,5.9vw,5.8rem);line-height:.96;letter-spacing:-.025em;word-spacing:.06em;max-width:15ch;text-transform:uppercase}
.big em{font-weight:800;background:linear-gradient(96deg,#c9efff 0%,#4cc4ee 48%,#5b8cff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.big.sm{font-size:clamp(1.5rem,2.8vw,2.5rem);max-width:none}
#trust .big{max-width:20ch}

/* ---------- navigation ---------- */
#nav{inset:14px 0 auto;padding:0;background:none;backdrop-filter:none;pointer-events:none}
#nav>*{pointer-events:auto}
#nav::before{content:"";position:absolute;inset:0 auto;left:50%;width:min(1320px,calc(100% - 28px));height:100%;transform:translateX(-50%);border-radius:16px;background:linear-gradient(rgba(12,20,32,.72),rgba(6,12,20,.6));border:1px solid var(--edge);box-shadow:0 18px 50px -20px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.05);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);pointer-events:none}
#nav{height:60px}
.brand{position:relative;margin-left:max(26px,calc((100% - 1320px)/2 + 24px))}.brand img{height:30px}
@media(min-width:981px){#links{position:relative;margin-right:max(26px,calc((100% - 1320px)/2 + 16px));gap:22px}}
#links>a:not(.btn),#links .has-mega>button{position:relative;opacity:.8;font-weight:600;font-size:.84rem;letter-spacing:.015em}
#links>a:not(.btn):not(.signin)::after,#links .has-mega>button::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--cyan);transform:scaleX(0);transition:transform .35s var(--ease)}
#links>a:hover::after,#links .has-mega>button:hover::after,#links>a.on::after{transform:scaleX(1)}
#links>a.on{opacity:1;color:var(--ice)}
.signin{border:0;opacity:.8}
.btn-sm{border-radius:10px;padding:10px 16px}
.mega{background:linear-gradient(rgba(16,26,42,.96),rgba(8,14,24,.96));border:1px solid var(--edge);border-radius:14px;top:170%;backdrop-filter:blur(20px)}

/* ---------- buttons ---------- */
.btn{border-radius:10px;position:relative;overflow:hidden;box-shadow:0 0 0 1px rgba(160,230,255,.35) inset,0 14px 40px -16px rgba(47,184,230,.7)}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.38) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease)}
.btn:hover::after{transform:translateX(120%)}
.btn.ghost{background:rgba(255,255,255,.03);box-shadow:none;backdrop-filter:blur(8px)}
.btn.xl{font-size:.95rem;padding:22px 44px;border-radius:14px;letter-spacing:.07em}

/* =============== 01 HERO =============== */
.hero{background:
  radial-gradient(ellipse 50% 70% at 72% 48%,rgba(26,95,208,.46),transparent 70%),
  radial-gradient(ellipse 30% 40% at 72% 48%,rgba(47,184,230,.18),transparent 70%),
  radial-gradient(ellipse 100% 35% at 50% 112%,rgba(47,184,230,.20),transparent),
  linear-gradient(#02050b,#040b17 70%,#050d1a)}
.hero::before{content:"";position:absolute;left:-10%;right:-10%;bottom:-2%;height:46%;z-index:0;pointer-events:none;
  background:linear-gradient(rgba(47,184,230,.20) 1px,transparent 1px) 0 0/100% 46px,linear-gradient(90deg,rgba(47,184,230,.16) 1px,transparent 1px) 0 0/92px 100%;
  transform:perspective(520px) rotateX(64deg);transform-origin:50% 100%;
  -webkit-mask-image:linear-gradient(to top,#000 5%,transparent 78%);mask-image:linear-gradient(to top,#000 5%,transparent 78%);opacity:.5}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 40%,transparent 55%,rgba(2,5,11,.75));z-index:1}
#gravity{opacity:.5}
.q-stage{width:min(56vw,760px);right:max(1vw,0px);z-index:2;transform:translateY(-50%);perspective:1100px}
.q-halo{position:absolute;inset:6%;border-radius:50%;background:radial-gradient(circle,rgba(47,184,230,.42),rgba(26,95,208,.22) 38%,transparent 68%);filter:blur(24px);transform:translate3d(calc(var(--px,0)*-18px),calc(var(--py,0)*-12px),0)}
.q-beam{position:absolute;left:50%;top:-34%;width:46%;height:86%;transform:translateX(-50%);background:linear-gradient(rgba(150,225,255,.22),transparent 78%);clip-path:polygon(38% 0,62% 0,100% 100%,0 100%);filter:blur(14px);opacity:.55;mix-blend-mode:screen}
.trails{position:absolute;inset:0;overflow:visible;z-index:1;pointer-events:none}
.trails path{fill:none;stroke:url(#trg);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:70 930;stroke-dashoffset:1000;animation:trail var(--t,6s) linear var(--d,0s) infinite;opacity:.9;filter:drop-shadow(0 0 5px rgba(80,200,255,.8))}
.trails path.base{stroke:rgba(80,170,230,.10);stroke-dasharray:none;animation:none;filter:none;stroke-width:1}
@keyframes trail{to{stroke-dashoffset:0}}
.rings{z-index:1;transform:translate3d(calc(var(--px,0)*8px),calc(var(--py,0)*6px),0) rotateX(calc(var(--py,0)*-6deg))}
.rings circle{stroke:rgba(110,200,240,.22)}
.q-obj{position:relative;z-index:3;transform:translate3d(calc(var(--px,0)*-14px),calc(var(--py,0)*-10px),40px) rotateY(calc(var(--px,0)*9deg)) rotateX(calc(var(--py,0)*-7deg));transform-style:preserve-3d;transition:transform .35s ease-out}
.q-core{width:clamp(250px,30vw,440px);filter:drop-shadow(0 30px 40px rgba(0,10,30,.7)) drop-shadow(0 0 34px rgba(47,184,230,.55)) drop-shadow(0 0 120px rgba(26,95,208,.7))}
.q-sheen{position:absolute;inset:0;-webkit-mask:url(/assets/media-c11152d9df735355.png) center/contain no-repeat;mask:url(/assets/media-c11152d9df735355.png) center/contain no-repeat;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.62) 50%,transparent 62%) -160% 0/260% 100% no-repeat;mix-blend-mode:overlay;animation:sheen 7s ease-in-out 1.5s infinite}
@keyframes sheen{0%{background-position:-160% 0}38%,100%{background-position:160% 0}}
.hero-copy{max-width:min(900px,62vw);padding-top:150px;position:relative;z-index:3}
h1{text-transform:uppercase;font-weight:800;line-height:.92;letter-spacing:-.03em}
h1 span{display:block}
h1 .l1{font-size:clamp(1.05rem,2.3vw,2.1rem);letter-spacing:.2em;font-weight:600;color:#cfe0ee;margin-bottom:20px;line-height:1.15}
h1 .l2{font-size:clamp(2.7rem,6.8vw,7.4rem);background:linear-gradient(100deg,#e9f9ff 0%,#6fd4f6 36%,#2fb8e6 58%,#4f86ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 40px rgba(47,184,230,.28));padding-bottom:.06em}
.lede{font-size:1.18rem;max-width:44ch;margin:30px 0 38px;color:#b8cde0}
.hero-steps{z-index:3;font-size:.7rem;letter-spacing:.24em}

/* ---------- glass + signatures ---------- */
.glass,.truth,.spine-wrap,.plan-wrap,.sol,.dt-main,.ctl-room{position:relative}
#truthSvg{filter:drop-shadow(0 0 1px rgba(47,184,230,.2))}
.truth{padding:clamp(18px,3vw,40px) 0}
.truth::before{content:"";position:absolute;inset:-4% -2%;background:radial-gradient(ellipse 40% 60% at 58% 50%,rgba(47,184,230,.14),transparent 70%);pointer-events:none;z-index:-1}
.truth-copy{width:31%}.truth-copy h3{font-size:clamp(1.6rem,2.8vw,2.6rem);text-transform:uppercase;line-height:1;letter-spacing:-.02em}
#truthSvg text{font:600 15px var(--f-body);letter-spacing:.01em}
#truthSvg .lyr{fill:none;stroke:rgba(110,205,245,.28);stroke-dasharray:2 7}
#truthSvg .lyr-t{fill:#7fd6f5;font:700 10px var(--f-display);letter-spacing:.18em;text-transform:uppercase}
#truthSvg .node{fill:#7fd6f5;filter:drop-shadow(0 0 5px #2fb8e6)}
#truthSvg .beam{stroke:url(#tbm);stroke-width:2;fill:none}
.pulse{margin-top:clamp(70px,9vw,130px);padding:28px 30px 20px;border:1px solid var(--edge);border-radius:18px;background:var(--glass);backdrop-filter:blur(12px);box-shadow:0 30px 80px -40px #000,inset 0 1px 0 rgba(255,255,255,.05)}
.pulse-head b{font-size:3.6rem}

/* decision timeline */
.cia-tabs{display:inline-flex;padding:5px;border:1px solid var(--edge);border-radius:14px;background:rgba(255,255,255,.03);gap:2px;margin-bottom:64px}
.cia-tabs button{border:0;border-radius:10px;margin:0;padding:11px 20px;font-size:.88rem;transition:background .3s,color .3s}
.cia-tabs button[aria-selected=true]{background:linear-gradient(135deg,rgba(47,184,230,.22),rgba(26,95,208,.22));color:var(--ice);box-shadow:inset 0 0 0 1px rgba(120,215,255,.4)}
.cia{counter-reset:s;gap:clamp(14px,2vw,30px)}
.cia::before,.cia::after{top:22px;height:2px}
.cia::after{box-shadow:0 0 14px var(--cyan)}
.st{padding-top:78px;counter-increment:s}
.st::before{top:6px;width:34px;height:34px;border-width:2px;content:counter(s,decimal-leading-zero);display:grid;place-items:center;font:700 .66rem var(--f-display);color:var(--mute);letter-spacing:.04em;background:var(--graph)}
.st.on::before{color:#02101c}
.st::after{content:counter(s,decimal-leading-zero);position:absolute;right:0;top:40px;font:800 5.6rem/1 var(--f-display);color:rgba(150,200,240,.06);letter-spacing:-.05em;pointer-events:none}
.st small{color:var(--cyan);font-weight:700;letter-spacing:.2em}
.st b{font-size:clamp(1.4rem,2.5vw,2.3rem);text-transform:none;letter-spacing:-.02em}
.loopline{margin-top:clamp(70px,8vw,120px);padding-top:26px;border-top:1px solid var(--edge);justify-content:space-between;letter-spacing:.16em;text-transform:uppercase;font-size:.72rem}
.loopline span+span::before{margin-right:14px}

/* incident: fleet-control environment */
.ctl-room{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr);gap:0;border:1px solid var(--edge);border-radius:22px;overflow:hidden;background:linear-gradient(rgba(9,16,28,.7),rgba(4,9,16,.85));box-shadow:0 50px 120px -50px #000,0 0 0 1px rgba(0,0,0,.4)}
.ctl-room .cr-stage{position:relative;padding:22px 22px 8px;background:
  radial-gradient(ellipse 60% 70% at 40% 60%,rgba(26,95,208,.20),transparent 70%),
  linear-gradient(rgba(120,190,240,.05) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,rgba(120,190,240,.05) 1px,transparent 1px) 0 0/48px 48px}
.ctl-room .cr-stage::before,.ctl-room .cr-stage::after{content:"";position:absolute;width:26px;height:26px;border:1px solid var(--edge-hi);pointer-events:none}
.ctl-room .cr-stage::before{left:14px;top:14px;border-right:0;border-bottom:0}.ctl-room .cr-stage::after{right:14px;bottom:14px;border-left:0;border-top:0}
.ctl-room .cr-side{display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:30px 30px 26px;border-left:1px solid var(--edge);background:linear-gradient(160deg,rgba(22,36,56,.7),rgba(8,14,24,.8));backdrop-filter:blur(16px)}
.cr-side .tag{font:700 .68rem var(--f-display);letter-spacing:.22em;text-transform:uppercase;color:var(--cyan)}
.ctl-room .spine-detail{border:0;padding:0;margin:0;min-height:170px}
.ctl-room .spine-detail h3{font-size:clamp(1.5rem,2.2vw,2.1rem);text-transform:uppercase;letter-spacing:-.02em;line-height:1.02}
.ctl-room .spine-detail p{font-size:1.02rem;color:#bcd0e2}
#spineStage .clock{font-size:46px}
.cr-side .btn{align-self:flex-start}
.ctl-room .spine{margin:6px 0 0;padding:0 4px 8px}
.cr-side .lnk{margin:0}

/* planning */
.plan-wrap{padding:26px 24px 8px;border:1px solid var(--edge);border-radius:22px;background:var(--glass);backdrop-filter:blur(12px);box-shadow:0 50px 120px -60px #000,inset 0 1px 0 rgba(255,255,255,.05);overflow:hidden}
.plan-wrap::before{content:"";position:absolute;top:0;bottom:0;left:calc(24px + (100% - 48px)*.2);width:1px;background:linear-gradient(transparent,var(--cyan),transparent);box-shadow:0 0 18px var(--cyan);animation:pscan 14s linear infinite;pointer-events:none;opacity:.55;z-index:2}
@keyframes pscan{0%{left:calc(24px + (100% - 48px)*.2)}100%{left:calc(24px + (100% - 48px)*.86)}}
.plan-cap{font-size:clamp(1.3rem,2vw,1.8rem);text-transform:uppercase;letter-spacing:-.01em;margin-top:26px}
#planSvg .bk rect{filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))}
#planSvg .mv{filter:drop-shadow(0 0 8px rgba(47,184,230,.7))}

/* =============== 06 VEHICLE SHOWROOM =============== */
.dtwin{background:
  radial-gradient(ellipse 55% 45% at 38% 52%,rgba(47,184,230,.20),transparent 70%),
  radial-gradient(ellipse 80% 40% at 50% 100%,rgba(26,95,208,.22),transparent 70%),
  linear-gradient(#02050a,#050b14 55%,#03070d)}
.dtwin.scene{padding-top:clamp(120px,12vw,180px)}
.dtwin .sec-head{margin-bottom:34px}
.dt-modes{display:inline-flex;padding:5px;border:1px solid var(--edge);border-radius:14px;background:rgba(255,255,255,.03);gap:2px;border-bottom:1px solid var(--edge)}
.dt-modes button{border-radius:10px;border:0!important;padding:11px 20px;transition:background .3s}
.dt-modes button[aria-selected=true]{background:linear-gradient(135deg,rgba(47,184,230,.24),rgba(26,95,208,.2));box-shadow:inset 0 0 0 1px rgba(120,215,255,.45)}
.dt-kpis{margin:34px 0 0}
.dt-kpis b,.dt-kpis strong{font-variant-numeric:tabular-nums}
.dt-main{margin-top:6px;grid-template-columns:minmax(0,1.9fr) minmax(300px,.85fr);gap:clamp(24px,3vw,48px)}
.dt-stage{border-radius:26px;overflow:hidden;aspect-ratio:800/500;background:radial-gradient(ellipse 70% 55% at 50% 38%,rgba(40,70,110,.34),rgba(5,10,18,0) 70%)}
.dt-stage::before{content:"";position:absolute;left:12%;right:12%;top:-6%;height:70%;pointer-events:none;background:linear-gradient(rgba(170,225,255,.20),transparent 90%);clip-path:polygon(34% 0,66% 0,100% 100%,0 100%);filter:blur(22px);opacity:.55;mix-blend-mode:screen}
.dt-stage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:30%;pointer-events:none;background:radial-gradient(ellipse 50% 100% at 50% 100%,rgba(47,184,230,.20),transparent 72%);border-bottom:1px solid var(--edge)}
.dt-floor{border-color:var(--mode);bottom:6%;opacity:.55;transform:perspective(600px) rotateX(62deg);height:36%;left:6%;right:6%}
.dt-ref{position:absolute;left:0;top:73%;width:100%;height:100%;object-fit:cover;transform:scaleY(-1);opacity:.28;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,#000 0,transparent 32%);mask-image:linear-gradient(to bottom,#000 0,transparent 32%);filter:blur(1.5px)}
.dt-panel{padding:30px 30px 28px;border:1px solid var(--edge);border-left:2px solid var(--mode);border-radius:18px;background:var(--glass);backdrop-filter:blur(18px);box-shadow:0 40px 90px -40px #000,0 0 60px -30px var(--mode)}
.dt-panel h3{text-transform:uppercase;letter-spacing:-.015em}
.dt-hs button::before{box-shadow:0 0 0 4px rgba(4,11,23,.7),0 0 18px var(--cyan)}
.dt-hs button span{border:1px solid var(--edge);border-radius:8px;background:rgba(8,14,24,.82);backdrop-filter:blur(8px)}
.dt-parts button,.dtwin .chips button{border-radius:999px}

/* =============== 07 COMMERCIAL: cinematic entry =============== */
.cc{background:
  radial-gradient(ellipse 70% 45% at 50% 0%,rgba(26,95,208,.30),transparent 70%),
  radial-gradient(ellipse 50% 40% at 90% 40%,rgba(47,184,230,.10),transparent 70%),var(--void)}
.cc-head{min-height:min(88vh,860px);display:flex;flex-direction:column;justify-content:center;position:relative;padding-bottom:40px}
.cc-head::before{content:"";position:absolute;inset:-8% -4% auto;height:100%;background:conic-gradient(from 210deg at 80% 40%,transparent,rgba(47,184,230,.10),transparent 30%);pointer-events:none;z-index:-1}
.cc-eyebrow{display:flex;align-items:center;gap:14px;font-size:.74rem;letter-spacing:.22em}.cc-eyebrow::after{content:"";width:64px;height:1px;background:linear-gradient(90deg,var(--cyan),transparent)}
.cc .big{font-size:clamp(2.6rem,7.4vw,7.6rem);line-height:.92}
.cc-lede{max-width:52ch;color:#b4c8db;font-size:1.12rem;margin:-10px 0 34px}
.cc-story{display:none}
.ci-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:26px 0 38px;border-block:1px solid var(--edge)}
.ci-kpis div{padding:28px 26px 26px 0;position:relative}
.ci-kpis div+div{padding-left:26px;border-left:1px solid var(--edge)}
.ci-kpis dt{font:800 clamp(2.4rem,5vw,4.8rem)/1 var(--f-display);letter-spacing:-.04em;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff,#8fd8f4);-webkit-background-clip:text;background-clip:text;color:transparent}
.ci-kpis dt small{font-size:.38em;letter-spacing:0;margin-left:.2em;-webkit-text-fill-color:var(--mute);font-weight:600}
.ci-kpis dd{margin:10px 0 0;color:var(--mute);font-size:.84rem;letter-spacing:.04em}
.ci-act{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px}
.ci-note{color:var(--mute);font-size:.86rem}
.cc[data-open="0"] .cc-bar,.cc[data-open="0"] .cc-grid{display:none}
.cc[data-open="1"] .cc-head{min-height:0;padding-bottom:0}
.cc[data-open="1"] .ci-act .btn{display:none}
.cc-grid{animation:ccOpen .9s var(--ease) both}
@keyframes ccOpen{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.cc-bar{border-radius:0 0 16px 16px;border:1px solid var(--edge);border-top:0;padding:12px 18px;background:linear-gradient(rgba(8,14,24,.9),rgba(6,10,18,.82));box-shadow:0 20px 50px -30px #000;margin-top:40px}
.stage{padding-top:clamp(40px,5vw,72px)}
.st-head h3{text-transform:uppercase;font-size:clamp(1.7rem,3vw,2.8rem);letter-spacing:-.02em}
.st-n{font-size:clamp(2.6rem,5vw,4.6rem);background:linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,0));-webkit-background-clip:text;background-clip:text;color:transparent}
.cc-ctrl{border-radius:20px;border:1px solid var(--edge);background:linear-gradient(rgba(16,26,42,.55),rgba(8,14,24,.5));backdrop-filter:blur(14px)}
.cc-ctrl::before{content:"Operating inputs";display:block;padding:18px 20px 0;color:var(--cyan);font:700 .68rem var(--f-display);letter-spacing:.22em;text-transform:uppercase}
.vd{position:relative;border-radius:22px;border:1px solid var(--edge-hi);background:linear-gradient(150deg,rgba(40,70,104,.55),rgba(10,18,30,.82));backdrop-filter:blur(14px);box-shadow:0 40px 100px -50px rgba(47,184,230,.5),inset 0 1px 0 rgba(255,255,255,.1);padding-top:46px!important}
.vd::before{content:"Executive conclusion";position:absolute;left:28px;top:20px;color:var(--cyan);font:700 .68rem var(--f-display);letter-spacing:.22em;text-transform:uppercase}

/* =============== 08 STANDARDS =============== */
.path{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);margin:0 0 34px;padding:0;position:relative;counter-reset:p}
.path::before{content:"";position:absolute;left:0;right:0;top:15px;height:2px;background:linear-gradient(90deg,var(--cyan),var(--blue) 70%,transparent);box-shadow:0 0 14px rgba(47,184,230,.6);opacity:.8}
.path li{position:relative;padding-top:48px;counter-increment:p}
.path li::before{content:counter(p);position:absolute;top:0;left:0;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--graph);border:2px solid var(--cyan);font:800 .75rem var(--f-display);color:var(--cyan);box-shadow:0 0 18px -2px var(--cyan)}
.path b{display:block;font:800 1.2rem var(--f-display);text-transform:uppercase;letter-spacing:-.005em}
.path span{color:var(--mute);font-size:.88rem}
#evSvg{padding:10px 0}
.iso-l{margin:56px 0 12px;font:700 .68rem var(--f-display);letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}
.iso{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:0;margin:0}
.iso li{padding:20px 22px;border-radius:14px;border:1px solid var(--edge);background:linear-gradient(160deg,rgba(60,84,112,.35),rgba(18,28,42,.5));box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 20px 50px -30px #000}
.iso b{display:block;font:800 1.45rem var(--f-display);letter-spacing:-.01em;background:linear-gradient(180deg,#fff,#a9c2d8);-webkit-background-clip:text;background-clip:text;color:transparent}
.iso span{display:block;margin-top:4px;color:var(--mute);font-size:.84rem}

/* =============== 09 SOL console =============== */
.sol{display:grid;grid-template-columns:minmax(220px,.42fr) minmax(0,1.6fr);gap:0 36px;padding:0;border:1px solid var(--edge);border-radius:24px;background:linear-gradient(150deg,rgba(16,28,46,.78),rgba(5,10,18,.9));box-shadow:0 60px 140px -60px #000,0 0 90px -50px var(--cyan);overflow:hidden}
.sol>*{grid-column:2}
.sol-rail{grid-column:1;grid-row:1/span 4;padding:30px 26px;border-right:1px solid var(--edge);background:linear-gradient(rgba(255,255,255,.025),transparent)}
.sol-rail .sr-h{margin:26px 0 8px;color:var(--cyan);font:700 .66rem var(--f-display);letter-spacing:.22em;text-transform:uppercase}.sol-rail .sr-h:first-child{margin-top:0}
.sol-rail p{margin:0;color:var(--mute);font-size:.88rem;line-height:1.5}.sol-rail p b{display:block;color:var(--ice);font:700 1rem var(--f-display)}
.sr-steps{list-style:none;margin:30px 0 0;padding:0;counter-reset:q;border-left:1px solid var(--edge)}
.sr-steps li{counter-increment:q;position:relative;padding:8px 0 8px 22px;color:#b4c8db;font:600 .86rem var(--f-display)}
.sr-steps li::before{content:"";position:absolute;left:-4px;top:15px;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
.sol-q{margin:30px 30px 0 0;padding:20px 22px;border:1px solid var(--edge);border-radius:14px;background:rgba(0,0,0,.28)}
.sol-q span::after{content:" · permission-aware";color:var(--mute);letter-spacing:.1em}
.sol-q p{margin:10px 0 0;min-height:2.4em;font-size:clamp(1.2rem,2vw,1.7rem)}.sol-q p::before{content:"›";color:var(--cyan);margin-right:12px}
.sol-q p::after{content:"";display:inline-block;width:2px;height:1em;background:var(--cyan);margin-left:4px;vertical-align:-.12em;animation:caret 1s steps(2) infinite}
@keyframes caret{50%{opacity:0}}
#solSvg{margin-right:30px;width:calc(100% - 30px)}
.sol-out,.sol-ap{margin-right:30px}
.sol-ap{margin-bottom:28px}

/* =============== 10 INTEGRATIONS / 11 TRUST =============== */
#orbSvg{filter:drop-shadow(0 0 30px rgba(26,95,208,.3))}
#orbSvg .disk{fill:rgba(47,184,230,.06);stroke:rgba(110,205,245,.45)}
.fine.c{text-align:center;margin-inline:auto}
.stats{gap:0;border-block:1px solid var(--edge);margin-top:10px}
.stats>div{padding:34px 26px 30px 0}.stats>div+div{padding-left:26px;border-left:1px solid var(--edge)}
.stats dt{background:linear-gradient(180deg,#fff,#58c8ee 80%);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:clamp(2.8rem,6vw,5.6rem)}
.trustline li{transition:color .4s}

/* =============== 12 FINALE =============== */
.final{padding-top:0;background:radial-gradient(ellipse 70% 50% at 50% 12%,rgba(26,95,208,.5),transparent 70%),radial-gradient(ellipse 45% 30% at 50% 22%,rgba(47,184,230,.20),transparent 70%),linear-gradient(#030710,#02050b)}
.finale{position:relative;text-align:center;padding:clamp(140px,16vw,230px) var(--pad) clamp(80px,9vw,130px);display:flex;flex-direction:column;align-items:center}
.fin-q{position:relative;width:clamp(220px,24vw,360px);margin-bottom:clamp(28px,4vw,56px)}
.fin-q img{position:relative;width:100%;filter:drop-shadow(0 30px 50px rgba(0,8,24,.8)) drop-shadow(0 0 40px rgba(47,184,230,.6)) drop-shadow(0 0 140px rgba(26,95,208,.8));animation:float 9s ease-in-out infinite}
.fin-glow{position:absolute;left:50%;top:50%;width:280%;aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-radial-gradient(circle,transparent 0 56px,rgba(80,180,235,.09) 57px 58px);-webkit-mask-image:radial-gradient(circle,#000 8%,transparent 55%);mask-image:radial-gradient(circle,#000 8%,transparent 55%);animation:breathe 10s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-12px)}}
@keyframes breathe{50%{transform:translate(-50%,-50%) scale(1.06)}}
.finale .big{max-width:16ch;font-size:clamp(2.6rem,7.6vw,8rem);margin:0 auto 26px;line-height:.92}
.finale .sub{margin:0 auto 44px;max-width:50ch;text-align:center;color:#b4c8db;font-size:1.14rem;padding:0}
.finale .btn.xl{box-shadow:0 0 0 1px rgba(160,230,255,.5) inset,0 24px 80px -16px rgba(47,184,230,.9)}
#demoSplit{margin-top:0;padding-top:20px;scroll-margin-top:90px}
.demo{padding:36px 38px;border:1px solid var(--edge);border-radius:22px;background:var(--glass);backdrop-filter:blur(16px);box-shadow:0 60px 120px -60px #000}
.final-l .preview{opacity:.95}
footer{background:#02050a;border-top:1px solid var(--edge)}

/* ---------- reveal + motion language ---------- */
.v6js .rv{opacity:0;transform:translateY(34px);filter:blur(6px);transition:opacity 1s var(--ease),transform 1s var(--ease),filter 1s var(--ease);transition-delay:var(--rd,0s)}
.v6js .rv.in{opacity:1;transform:none;filter:none}
.v6js .sec-head .big{overflow:hidden}
.scene .big{animation:none}
@media (prefers-reduced-motion:reduce){
  .v6js .rv{opacity:1;transform:none;filter:none;transition:none}
  .trails path,.q-sheen,.fin-q img,.fin-glow,.plan-wrap::before,.sol-q p::after,.cc-grid{animation:none!important}
  .q-obj,.rings,.q-halo{transform:none!important}
  .trails path{stroke-dasharray:none;opacity:.35}
}

/* ---------- responsive ---------- */
@media(max-width:1100px){
  .sec-head{grid-template-columns:1fr}.sec-head .sub{max-width:56ch}
  .ctl-room{grid-template-columns:1fr}.ctl-room .cr-side{border-left:0;border-top:1px solid var(--edge)}
  .sol{grid-template-columns:1fr}.sol>*,.sol-rail{grid-column:1;grid-row:auto}.sol-rail{border-right:0;border-bottom:1px solid var(--edge);display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
  .sol-q,#solSvg,.sol-out,.sol-ap{margin-inline:22px;width:auto}.sol-q{margin-top:24px}
  .dt-main{grid-template-columns:1fr}
}
@media(max-width:980px){
  #nav::before{width:calc(100% - 20px)}.brand{margin-left:22px}#links{margin-right:0}
  .hero-copy{max-width:100%;padding-top:54svh}
  .q-stage{width:min(112vw,560px);top:23%;right:50%;transform:translate(50%,-50%)}
  .cia{grid-template-columns:1fr 1fr;row-gap:36px}
  .path{grid-template-columns:1fr 1fr;row-gap:28px}.path::before{display:none}
  .iso{grid-template-columns:1fr 1fr}
  .ci-kpis{grid-template-columns:1fr 1fr}.ci-kpis div:nth-child(3){padding-left:0;border-left:0}.ci-kpis div:nth-child(n+3){border-top:1px solid var(--edge)}
  .stats{grid-template-columns:1fr 1fr}.stats>div:nth-child(3){padding-left:0;border-left:0}.stats>div:nth-child(n+3){border-top:1px solid var(--edge)}
  .plan-wrap{padding:16px 12px 4px}
  .dt-stage{aspect-ratio:800/533}
}
@media(max-width:560px){
  .big{font-size:clamp(2.1rem,10.4vw,3rem)}
  h1 .l1{letter-spacing:.14em}h1 .l2{font-size:clamp(2.5rem,12.6vw,3.4rem)}
  .cia{grid-template-columns:1fr}.st::after{font-size:4rem}
  .sol-rail{grid-template-columns:1fr}
  .btn.xl{padding:19px 28px;width:100%;text-align:center}
  .finale .big{font-size:clamp(2.3rem,11vw,3.2rem)}
  .demo{padding:24px 20px}
  .ctl-room .cr-side{padding:24px 20px}
  .cc .big{font-size:clamp(2.4rem,12vw,3.4rem)}
  .ci-kpis div{padding:20px 14px 18px 0}.ci-kpis div+div{padding-left:14px}.ci-kpis div:nth-child(3){padding-left:0}
}
.hero-copy{max-width:min(940px,68vw)}
h1 .l2{font-size:clamp(2.6rem,6.1vw,6.9rem);line-height:.94}
@media(max-width:980px){.hero-copy{max-width:100%}}
/* scale tuning */
.scene{padding-block:clamp(88px,9.5vw,150px)}
.sec-head{grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);margin-bottom:clamp(40px,5vw,72px)}
.big{font-size:clamp(2.1rem,4.6vw,4.8rem);max-width:none}
.sec-head .big{max-width:17ch}
@media(max-width:560px){.big{font-size:clamp(2rem,9.6vw,2.9rem)}}
.sol-rail span{display:block;text-transform:none;letter-spacing:0;color:var(--mute);font-size:.86rem;font-weight:500;margin-top:2px}
.sol-rail p b+span{color:var(--cyan);font-size:.78rem}
.cc-head::before{background:radial-gradient(ellipse 50% 60% at 78% 36%,rgba(47,184,230,.12),transparent 70%);inset:-6% -10% auto}
.cc .big{font-size:clamp(2.4rem,5.9vw,6.2rem);max-width:none}
.cc-head{min-height:min(84vh,820px)}
#spineStage{margin-inline:-4%;width:108%}
.chip.big{font:700 .95rem/1.2 var(--f-display);letter-spacing:.06em;word-spacing:0;max-width:none;margin:0;padding:7px 16px;text-transform:uppercase;background:none}
.vd{padding:46px 28px 28px!important}
.st-head{grid-template-columns:clamp(86px,9vw,140px) 1fr;align-items:start}
.st-n{font-size:clamp(2.4rem,4.4vw,4rem)}
.cc-ctrl::before{padding:18px 0 0 20px}
@media(max-width:980px){.st-head{grid-template-columns:1fr}}
.cc-ctrl{top:176px!important;max-height:calc(100vh - 196px)}
#links a.btn{background:linear-gradient(135deg,var(--cyan),var(--blue));color:#02101c;opacity:1;font-weight:800;letter-spacing:.05em;text-transform:uppercase;font-size:.72rem}
#links a.btn:hover{color:#02101c}
/* containment */
.scene,.hero,.final{overflow-x:clip}
.sol{min-width:0}.sol>*{min-width:0}
@media(max-width:1100px){.sol{grid-template-columns:minmax(0,1fr)}}
@media(max-width:560px){.sol-rail{grid-template-columns:minmax(0,1fr)}.sol-out{grid-template-columns:1fr}}

@media(max-width:980px){
  .burger{margin-right:20px;position:relative;border-radius:10px;background:rgba(255,255,255,.05);border-color:var(--edge);font-weight:600;font-size:.85rem}
  #links{position:absolute;top:calc(100% + 8px);left:10px;right:10px;margin:0;border:1px solid var(--edge);border-radius:16px;background:linear-gradient(rgba(14,24,40,.97),rgba(6,12,20,.97));backdrop-filter:blur(18px)}
  #links .btn{width:100%;text-align:center}
}
@media(max-width:1100px){.sec-head{grid-template-columns:minmax(0,1fr)}}
@media(min-width:1500px){
  .hero-copy{padding-left:calc((100vw - 1320px)/2 + 28px)}
  .q-stage{right:calc((100vw - 1320px)/2 - 40px)}
  .hero-steps{left:calc((100vw - 1320px)/2 + 28px)}
}
h1 .l2{font-size:clamp(2.6rem,5.5vw,6.4rem)}
@media(max-width:980px){h1 .l2{font-size:clamp(2.2rem,8.6vw,3.8rem)}}
@media(max-width:560px){h1 .l2{font-size:clamp(2.5rem,12.6vw,3.4rem)}}
/* decision timeline: nodes sit above the line; one numbering only */
.cia::before,.cia::after{z-index:0}
.st{z-index:1}
.st::before{z-index:2;font-size:.72rem;font-weight:800;letter-spacing:0;color:var(--mute);background:#0b141f}
.st.on::before{background:var(--cyan);color:#02101c;box-shadow:0 0 0 5px rgba(47,184,230,.14),0 0 22px rgba(47,184,230,.55)}
.st::after{content:none!important}

/* ===== context system: what it is, who it serves, nine functions ===== */
.hero-kicker{margin:0 0 22px;display:flex;align-items:center;gap:14px;color:var(--cyan);font:700 .74rem var(--f-display);letter-spacing:.24em;text-transform:uppercase}
.hero-kicker::before{content:"";width:44px;height:1px;background:var(--cyan)}
.hero-for{margin:-14px 0 34px;max-width:46ch;color:var(--mute);font-size:.98rem;padding-left:16px;border-left:2px solid var(--cyan)}
.si{padding-top:clamp(70px,8vw,120px)}
.si-define{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,5vw,90px);margin-bottom:clamp(40px,5vw,72px);padding:clamp(26px,3.4vw,46px) 0;border-block:1px solid var(--edge)}
.si-define h3{margin:0 0 14px;color:var(--cyan);font:700 .72rem var(--f-display);letter-spacing:.22em;text-transform:uppercase}
.si-define p{margin:0;font-size:clamp(1.1rem,1.7vw,1.5rem);line-height:1.5;color:var(--ice);letter-spacing:-.005em;max-width:40ch}
.si-for{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.si-for li{position:relative;padding-left:22px;color:#c6d6e5;font-size:1rem}
.si-for li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:1px;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.si-list{list-style:none;margin:0;padding:0;counter-reset:none}
.si-list li{border-bottom:1px solid var(--edge)}
.si-list a{display:grid;grid-template-columns:70px minmax(0,1.5fr) minmax(0,1fr) 40px;gap:20px;align-items:center;padding:clamp(20px,2.2vw,30px) 4px;text-decoration:none;color:inherit;position:relative;transition:background .4s,padding .4s var(--ease)}
.si-list a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--cyan);transform:scaleY(0);transition:transform .45s var(--ease);box-shadow:0 0 14px var(--cyan)}
.si-list a:hover,.si-list a:focus-visible{background:linear-gradient(90deg,rgba(47,184,230,.09),transparent 70%);padding-left:20px;outline:0}
.si-list a:hover::before,.si-list a:focus-visible::before{transform:scaleY(1)}
.si-list i{font:800 clamp(1.5rem,2.4vw,2.2rem) var(--f-display);font-style:normal;color:rgba(150,205,240,.32);font-variant-numeric:tabular-nums;letter-spacing:-.03em;transition:color .4s}
.si-list a:hover i{color:var(--cyan)}
.si-list b{display:block;font:800 clamp(1.15rem,1.9vw,1.7rem) var(--f-display);text-transform:uppercase;letter-spacing:-.015em}
.si-list div span{display:block;margin-top:6px;color:#9fb4c8;font-size:.98rem;max-width:52ch}
.si-list em{font-style:normal;color:#c6d6e5;font-size:.92rem}
.si-list em small{display:block;margin-bottom:3px;color:var(--mute);font:700 .62rem var(--f-display);letter-spacing:.2em;text-transform:uppercase}
.si-list s{text-decoration:none;color:var(--cyan);font-size:1.4rem;justify-self:end;transition:transform .4s var(--ease)}
.si-list a:hover s{transform:translateX(6px)}
.usedby{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-4px 0 6px}
.usedby small{margin-right:6px;color:var(--mute);font:700 .62rem var(--f-display);letter-spacing:.2em;text-transform:uppercase}
.usedby span{padding:5px 12px;border:1px solid var(--edge);border-radius:999px;background:rgba(255,255,255,.03);color:#c6d6e5;font-size:.8rem}
.cc-eyebrow+.usedby{margin:-8px 0 26px}
.sol-mega .mega{left:50%;transform:translateX(-50%);grid-template-columns:repeat(3,minmax(190px,1fr));width:min(820px,92vw);gap:10px 30px}
.sol-mega .mega>div{display:grid;gap:4px;align-content:start}
.sol-mega .mega a{padding:7px 0;font-size:.88rem}
.mega-all{grid-column:1/-1;margin-top:8px;padding:14px 0 0!important;border-top:1px solid var(--edge);color:var(--cyan)!important;font-weight:700;letter-spacing:.04em}
.sol-mega.open .mega{display:grid}
#fnTrack{position:fixed;left:max(18px,calc((100vw - 1320px)/2 - 6px));bottom:20px;z-index:40;display:flex;align-items:center;gap:12px;padding:10px 16px;border:1px solid var(--edge);border-radius:999px;background:linear-gradient(rgba(14,24,40,.82),rgba(6,12,20,.78));backdrop-filter:blur(14px);text-decoration:none;color:var(--ice);font:600 .78rem var(--f-display);opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .5s,transform .5s var(--ease)}
#fnTrack.show{opacity:1;transform:none;pointer-events:auto}
#fnTrack b{color:var(--cyan);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em}
#fnTrack span{letter-spacing:.02em}
#fnTrack i{display:flex;gap:4px}
#fnTrack u{width:14px;height:3px;border-radius:2px;background:rgba(150,200,240,.2);transition:background .4s,box-shadow .4s}
#fnTrack u.d{background:rgba(47,184,230,.55)}#fnTrack u.c{background:var(--cyan);box-shadow:0 0 10px var(--cyan)}
#fnTrack:hover{border-color:var(--edge-hi)}
@media(max-width:980px){
  .si-define{grid-template-columns:1fr}
  .si-list a{grid-template-columns:48px minmax(0,1fr) 28px}.si-list em{grid-column:2;grid-row:2}.si-list s{grid-row:1;grid-column:3}
  .sol-mega .mega{position:static;transform:none;width:auto;grid-template-columns:1fr}
  #fnTrack{left:12px;bottom:12px;padding:8px 12px;gap:8px}#fnTrack i{display:none}
}
@media(max-width:560px){#fnTrack span{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-for{margin-top:-8px}}
@media(prefers-reduced-motion:reduce){#fnTrack{transition:none}.si-list a,.si-list a::before,.si-list s{transition:none}}

/* ===== nine solutions: pages, demonstrations, language ===== */
@font-face{font-family:"IBM Plex Sans Arabic";src:url(/assets/media-6010e7fd0dce5d52.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(/assets/media-16734a5adb27b0f3.woff2) format("woff2");font-weight:500 600;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(/assets/media-04c730b4292731cc.woff2) format("woff2");font-weight:700 900;font-display:swap}
html[lang=ar] body,html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] h4,html[lang=ar] b,html[lang=ar] button,html[lang=ar] input,html[lang=ar] select,html[lang=ar] textarea,html[lang=ar] .btn,html[lang=ar] .idx,html[lang=ar] #fnTrack{font-family:"IBM Plex Sans Arabic",Inter,Manrope,system-ui,sans-serif}
html[lang=ar] .big,html[lang=ar] .hero h1,html[lang=ar] .si-list b{text-transform:none;letter-spacing:0;word-spacing:0;line-height:1.28}
html[lang=ar] .idx,html[lang=ar] .hero-kicker,html[lang=ar] .usedby small,html[lang=ar] .si-define h3,html[lang=ar] .mega b,html[lang=ar] .si-list em small,html[lang=ar] .btn,html[lang=ar] .hero-steps i{letter-spacing:0;text-transform:none}
.langbtn{margin:0 6px;padding:8px 12px;border:1px solid var(--edge);border-radius:999px;background:transparent;color:var(--ice);font:700 .78rem var(--f-display);cursor:pointer;transition:border-color .3s,background .3s}
.langbtn:hover{border-color:var(--cyan);background:rgba(47,184,230,.1)}
.si-note{margin:26px 0 0;color:var(--mute);font-size:.84rem;max-width:80ch}
.solpage{display:inline-block;margin:-4px 0 22px;color:var(--cyan);font:700 .8rem var(--f-display);text-decoration:none;letter-spacing:.02em}
.solpage:hover{text-decoration:underline}
.cc-eyebrow+.usedby{margin:6px 0 10px}.cc-eyebrow~.solpage{margin-top:0}
body.sp-open{overflow:hidden}
body.sp-open main,body.sp-open footer,body.sp-open #fnTrack{visibility:hidden}
#sp{position:fixed;inset:0;z-index:30;overflow-y:auto;background:radial-gradient(1200px 700px at 78% -10%,rgba(47,184,230,.14),transparent 60%),#050b14;padding:110px 0 80px;display:none}
body.sp-open #sp{display:block}
.sp-wrap{width:min(1180px,calc(100% - 48px));margin:0 auto}
.sp-back{display:inline-block;margin-bottom:34px;color:var(--cyan);text-decoration:none;font:700 .86rem var(--f-display)}
.sp-hero h1{margin:14px 0 18px;font-size:clamp(2.2rem,5.6vw,5rem);text-transform:uppercase;line-height:1.02;max-width:16ch;background:linear-gradient(180deg,#fff,#9fdcff);-webkit-background-clip:text;background-clip:text;color:transparent}
.sp-hero .sub{max-width:62ch;font-size:clamp(1.05rem,1.5vw,1.3rem);color:#c6d6e5;margin:0 0 20px}
.sp-hero .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}
.sp-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,80px);margin:clamp(44px,6vw,80px) 0;padding-top:34px;border-top:1px solid var(--edge)}
.sp-pair h2,.sp-h{margin:0 0 14px;color:var(--cyan);font:700 .74rem var(--f-display);letter-spacing:.22em;text-transform:uppercase}
.sp-pair p{margin:0;font-size:1.12rem;line-height:1.55;color:#dbe7f3;max-width:48ch}
.sp-demo{margin:14px 0 clamp(44px,6vw,80px);padding:clamp(18px,3vw,34px);border:1px solid var(--edge);border-radius:20px;background:linear-gradient(160deg,rgba(18,32,52,.78),rgba(6,12,22,.9));box-shadow:0 30px 80px -40px rgba(47,184,230,.35)}
.sp-sim{margin:18px 0 0;color:#e2b15a;font:700 .66rem var(--f-display);letter-spacing:.18em;text-transform:uppercase}
.sp-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px 40px;margin:14px 0 clamp(44px,6vw,80px)}
.sp-groups h3{margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--edge);font:800 1rem var(--f-display)}
.sp-groups ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sp-groups li{position:relative;padding-inline-start:18px;color:#b7c9db;font-size:.93rem;line-height:1.4}
.sp-groups li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;width:8px;height:1px;background:var(--cyan)}
.sp-rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.sp-rel a{display:grid;gap:6px;padding:22px;border:1px solid var(--edge);border-radius:16px;text-decoration:none;color:inherit;background:rgba(255,255,255,.02);transition:border-color .3s,transform .4s var(--ease)}
.sp-rel a:hover{border-color:var(--cyan);transform:translateY(-3px)}
.sp-rel i{font:800 1.4rem var(--f-display);font-style:normal;color:rgba(150,205,240,.4)}.sp-rel b{font:800 1.05rem var(--f-display)}.sp-rel span{color:#9fb4c8;font-size:.9rem}
.sp-cta{margin-top:clamp(50px,7vw,100px);text-align:center;padding:50px 0;border-top:1px solid var(--edge)}.sp-cta .big{margin-bottom:26px}.sp-cta .si-note{margin-inline:auto}
/* demos */
.dm-act{margin-top:18px}.btn.sm{padding:11px 18px;font-size:.82rem}
.gmsg{margin:16px 0 0;padding:14px 16px;border-inline-start:2px solid var(--cyan);background:rgba(47,184,230,.07);color:#dbe7f3;font-size:.96rem}
.fd-chips,.rt-tabs,.rt-alt,.isoc{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;align-items:center}
.fd-chips button,.rt-tabs button,.rt-alt button{padding:8px 14px;border:1px solid var(--edge);border-radius:999px;background:transparent;color:#c6d6e5;font:600 .82rem var(--f-body);cursor:pointer}
[aria-pressed=true].fd-chips button,.fd-chips [aria-pressed=true],.rt-tabs [aria-pressed=true],.rt-alt [aria-pressed=true]{border-color:var(--cyan);background:rgba(47,184,230,.16);color:#fff}
.fd{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr);gap:20px}
.fd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.fd-t{display:grid;gap:3px;padding:12px 10px;border:1px solid var(--edge);border-radius:12px;background:rgba(255,255,255,.03);color:inherit;text-align:start;cursor:pointer;border-top:3px solid #3a6;transition:opacity .3s,border-color .3s}
.fd-t b{font:800 .86rem var(--f-display)}.fd-t small{color:#9fb4c8;font-size:.7rem}
.fd-t.s1{border-top-color:var(--cyan)}.fd-t.s2{border-top-color:#e2b15a}.fd-t.s3{border-top-color:#e0605e}.fd-t.dim{opacity:.25}.fd-t.on{outline:1px solid var(--cyan);background:rgba(47,184,230,.12)}
.fd-p{padding:18px;border:1px solid var(--edge);border-radius:14px;background:rgba(0,0,0,.25)}.fd-p h4{margin:0 0 10px;font:800 1.2rem var(--f-display)}
dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px}dt{color:#8ea6bd;font-size:.82rem}dd{margin:0;font-weight:600}
.gt{display:grid;grid-template-columns:repeat(8,1fr);margin-inline-start:92px;color:#7f98af;font-size:.72rem;border-bottom:1px solid var(--edge)}
.gr{display:grid;grid-template-columns:92px 1fr;align-items:center;margin-top:10px}.gr b{font:700 .82rem var(--f-display)}
.gr>div{position:relative;height:34px;background:repeating-linear-gradient(90deg,rgba(150,200,240,.08) 0 1px,transparent 1px 12.5%)}
.gr i{position:absolute;top:3px;bottom:3px;display:grid;place-items:center;border-radius:8px;background:rgba(47,184,230,.28);border:1px solid var(--cyan);font:600 .74rem var(--f-body);font-style:normal;transition:all .5s var(--ease)}
.gr i.bad{background:rgba(224,96,94,.3);border-color:#e0605e}.gr i.ok{border-color:#58d69a;background:rgba(88,214,154,.22)}
html[dir=rtl] .gt,html[dir=rtl] .gr>div{direction:ltr}html[dir=rtl] .gt{margin-inline-start:0;margin-right:92px}
.rt-def{margin:0 0 14px;color:#c6d6e5;max-width:70ch}
.rt{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr);gap:22px;align-items:center}
.rt svg{width:100%;height:auto;background:rgba(0,0,0,.25);border-radius:14px;border:1px solid var(--edge)}
.rt-l{fill:none;stroke:var(--cyan);stroke-width:3;stroke-linejoin:round;filter:drop-shadow(0 0 6px var(--cyan));stroke-dasharray:6 5;animation:dash 1.4s linear infinite}@keyframes dash{to{stroke-dashoffset:-22}}
.rt g circle{fill:#0b1a2a;stroke:#476a8a;stroke-width:2}.rt g.on circle{stroke:var(--cyan);fill:#10324a}.rt text{fill:#9fb4c8;font:600 11px var(--f-body);text-anchor:middle}
.five,.chain{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.five li,.chain li{display:grid;grid-template-columns:minmax(150px,.5fr) 1fr;gap:16px;padding:14px 16px;border:1px solid var(--edge);border-radius:12px;opacity:.45;transition:opacity .4s,border-color .4s}
.five li.on,.chain li.on{opacity:1;border-color:rgba(47,184,230,.5);background:rgba(47,184,230,.06)}.five b,.chain b{font:800 .95rem var(--f-display)}.five span,.chain span{color:#dbe7f3}
.kb{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.kb>div{min-height:120px;padding:10px;border:1px dashed var(--edge);border-radius:12px}.kb>div.cur{border:1px solid var(--cyan);background:rgba(47,184,230,.08)}
.kb h4{margin:0 0 10px;color:#8ea6bd;font:700 .7rem var(--f-display);letter-spacing:.06em}.kc{margin:0;padding:10px;border-radius:10px;background:rgba(255,255,255,.07);font:800 .86rem var(--f-display)}.kc small{display:block;margin-top:4px;font:400 .76rem var(--f-body);color:#b7c9db}
.phone{width:min(300px,100%);margin:0 auto;padding:22px 18px;border:2px solid #2c4a66;border-radius:34px;background:linear-gradient(#0c1a2b,#07101c);display:grid;gap:12px;min-height:340px;box-shadow:0 0 50px -10px rgba(47,184,230,.4)}
.phone h5{margin:0;font:800 1.1rem var(--f-display)}.phone p{margin:0;color:#c6d6e5;font-size:.9rem}
.phone u{text-decoration:none;display:block;text-align:center;padding:12px;border-radius:12px;background:var(--cyan);color:#02101c;font-weight:800}.phone u.w{background:#e2b15a}.phone u.d{background:#e0605e;color:#fff}
.isoc span{padding:7px 14px;border:1px solid var(--edge);border-radius:999px;color:#7f98af;transition:all .4s}.isoc span.on{border-color:#58d69a;color:#fff;background:rgba(88,214,154,.15)}
.mm{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.m{padding:16px;border:1px solid var(--edge);border-radius:14px;background:rgba(0,0,0,.25)}.m small{display:block;color:#8ea6bd;font-size:.74rem;margin-bottom:6px}.m b{font:800 1.7rem var(--f-display);font-variant-numeric:tabular-nums}
.sol-c{display:grid;gap:10px;max-width:720px}.sol-r{margin:0;color:#8ea6bd;font:700 .72rem var(--f-display);letter-spacing:.1em}.sol-c .u{justify-self:end;margin:0;padding:12px 16px;border-radius:16px 16px 4px 16px;background:rgba(47,184,230,.18)}.sol-c .a{margin:0;padding:12px 16px;border-radius:16px 16px 16px 4px;background:rgba(255,255,255,.07);max-width:92%}
html[dir=rtl] .sol-c .u{border-radius:16px 16px 16px 4px}html[dir=rtl] .sol-c .a{border-radius:16px 16px 4px 16px}
@media(max-width:860px){.sp-pair,.fd,.rt{grid-template-columns:1fr}.fd-grid{grid-template-columns:repeat(3,1fr)}.kb{grid-template-columns:1fr 1fr}.five li,.chain li{grid-template-columns:1fr;gap:6px}#sp{padding-top:90px}}
/* RTL */
html[dir=rtl] .hero-kicker::before{order:2}
html[dir=rtl] .hero-for{padding-left:0;border-left:0;padding-right:16px;border-right:2px solid var(--cyan)}
html[dir=rtl] .si-for li{padding-left:0;padding-right:22px}html[dir=rtl] .si-for li::before{left:auto;right:0}
html[dir=rtl] .si-list a::before{left:auto;right:0}html[dir=rtl] .si-list a:hover,html[dir=rtl] .si-list a:focus-visible{padding-left:4px;padding-right:20px;background:linear-gradient(270deg,rgba(47,184,230,.09),transparent 70%)}
html[dir=rtl] .si-list a:hover s{transform:translateX(-6px)}html[dir=rtl] .si-list s{justify-self:start}
html[dir=rtl] #fnTrack{left:auto;right:max(18px,calc((100vw - 1320px)/2 - 6px))}
html[dir=rtl] .gmsg{border-inline-start-width:2px}
html[dir=rtl] .q-stage,html[dir=rtl] canvas#gravity,html[dir=rtl] .hero-steps{direction:ltr}
html[dir=rtl],html[dir=rtl] body{overflow-x:clip}
html[dir=rtl] .hero,html[dir=rtl] .scene{overflow-x:clip}
html[dir=rtl] .skip{left:auto;right:-999px}
@media(min-width:981px){
 html[dir=rtl] .q-stage{right:auto;left:max(1vw,0px)}
 html[dir=rtl] .hero{background:radial-gradient(ellipse 55% 75% at 26% 50%,rgba(26,95,208,.34),transparent 70%),radial-gradient(ellipse 90% 40% at 50% 110%,rgba(47,184,230,.12),transparent 70%),#030812}
}
@media(min-width:1400px){html[dir=rtl] .q-stage{left:calc((100vw - 1320px)/2 - 40px)}html[dir=rtl] .hero-copy{padding-left:var(--pad);padding-right:calc((100vw - 1320px)/2 + 28px)}}
html[dir=rtl] .brand{margin-left:0;margin-right:max(26px,calc((100% - 1320px)/2 + 24px))}
@media(min-width:981px){html[dir=rtl] #links{margin-right:0;margin-left:max(26px,calc((100% - 1320px)/2 + 16px))}}
@media(max-width:980px){html[dir=rtl] .brand{margin-left:0;margin-right:22px}html[dir=rtl] #links{margin:0}}
html[dir=rtl] #menuBtn{margin-left:18px}

/* ===== calm scale: smaller type, more air ===== */
body{font-size:16.5px;line-height:1.6}
.big,.sec-head .big{font-size:clamp(1.75rem,3.5vw,3.3rem);line-height:1.08;letter-spacing:-.02em;max-width:22ch}
.big.sm{font-size:clamp(1.3rem,2.2vw,2rem)}
.cc .big{font-size:clamp(1.9rem,4vw,3.8rem);max-width:none}
.finale .big{font-size:clamp(2rem,4.8vw,4.4rem);max-width:20ch}
h1 .l1{font-size:clamp(.85rem,1.5vw,1.3rem);letter-spacing:.18em;margin-bottom:14px}
h1 .l2{font-size:clamp(2.2rem,4.5vw,4.7rem);line-height:1.02}
.lede{font-size:1.04rem;max-width:46ch;line-height:1.6;margin:24px 0 24px}
.sub,.sec-head .sub,.finale .sub{font-size:1rem;line-height:1.6;max-width:50ch}
.truth-copy h3{font-size:clamp(1.25rem,2vw,1.8rem)}.ctl-room .spine-detail h3,.st-head h3{font-size:clamp(1.3rem,2vw,1.9rem)}.dt-panel h3,.spine-detail h3{font-size:1.35rem}
.scene{padding-block:clamp(96px,11vw,170px)}
.sec-head{margin-bottom:clamp(40px,5vw,70px)}
.hero-kicker{font-size:.68rem}.hero-for{font-size:.92rem;margin:-6px 0 28px}
.si-define{grid-template-columns:1fr;padding:30px 0}.si-define p{font-size:clamp(1.02rem,1.4vw,1.25rem);max-width:62ch}
.si-list a{grid-template-columns:56px minmax(0,1fr) 36px;padding:clamp(18px,1.8vw,24px) 4px}
.si-list i{font-size:clamp(1.15rem,1.7vw,1.5rem)}.si-list b{font-size:clamp(1rem,1.35vw,1.2rem)}.si-list div span{font-size:.92rem;max-width:62ch}
.sp-hero h1{font-size:clamp(1.9rem,4vw,3.4rem);max-width:20ch}.sp-hero .sub{font-size:1.02rem}
.sp-pair p{font-size:1rem}.sp-groups li{font-size:.88rem}
#fnTrack{font-size:.72rem}
@media(max-width:980px){.scene{padding-block:84px}.si-list a{grid-template-columns:40px minmax(0,1fr) 24px}}
@media(max-width:560px){.big,.sec-head .big{font-size:clamp(1.65rem,7.6vw,2.2rem)}.cc .big,.finale .big{font-size:clamp(1.8rem,8.6vw,2.5rem)}h1 .l2{font-size:clamp(2rem,10.4vw,2.8rem)}}
html[lang=ar] .big,html[lang=ar] .sec-head .big{line-height:1.4;max-width:24ch}html[lang=ar] h1 .l2{line-height:1.3}

/* ===== connected layout: header stacks above its content, no orphan columns ===== */
.sec-head{display:block;max-width:760px;margin:0 0 clamp(28px,3.4vw,46px)}
.sec-head>*{grid-column:auto}
.sec-head .idx{margin:0 0 16px}
.sec-head .big{margin:0 0 14px;max-width:24ch}
.sec-head .sub{margin:0;max-width:58ch;padding:0}
.solpage{display:none}
.scene{padding-block:clamp(60px,6.5vw,100px)}
.dtwin.scene{padding-top:clamp(60px,6.5vw,100px)}
.truth{padding-top:0}
#solutions .sec-head{max-width:880px}
.si-define{margin-bottom:clamp(24px,3vw,40px);padding:0 0 clamp(24px,3vw,40px);border-top:0}
@media(max-width:980px){.scene{padding-block:56px}}

/* ===== demo request: a showpiece ===== */
#demoSplit{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,80px);align-items:center;max-width:1180px;margin-inline:auto;padding-top:clamp(40px,5vw,70px)}
.final-l{position:relative}
.fl-eyebrow{margin:0 0 12px;color:var(--cyan);font:700 .7rem var(--f-display);letter-spacing:.24em;text-transform:uppercase}
.fl-title{margin:0 0 22px;font:800 clamp(1.5rem,2.6vw,2.2rem)/1.15 var(--f-display);letter-spacing:-.02em;max-width:18ch}
.fl-next{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:12px}
.fl-next li{display:flex;gap:14px;align-items:center;color:#c6d6e5;font-size:.98rem}
.fl-next b{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(47,184,230,.5);color:var(--cyan);font:800 .72rem var(--f-display);box-shadow:0 0 16px rgba(47,184,230,.25)}
.final-l .preview{margin:34px 0 0;width:min(340px,80%);filter:drop-shadow(0 0 40px rgba(47,184,230,.25))}
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
.demo{position:relative;isolation:isolate;padding:clamp(26px,3.2vw,44px);border:0;border-radius:26px;background:linear-gradient(160deg,rgba(18,32,54,.92),rgba(5,11,20,.96));box-shadow:0 50px 120px -50px rgba(0,0,0,.9),0 0 80px -30px rgba(47,184,230,.35)}
.demo::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--ang),rgba(47,184,230,.0),rgba(47,184,230,.9),rgba(79,134,255,.6),rgba(47,184,230,0) 60%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:ang 7s linear infinite}
@keyframes ang{to{--ang:360deg}}
.demo::after{content:"";position:absolute;inset:-1px;z-index:-2;border-radius:inherit;background:radial-gradient(600px 220px at 85% -10%,rgba(47,184,230,.16),transparent 70%)}
.demo .steps{position:relative;display:flex;justify-content:space-between;gap:0;margin:0 0 30px;padding:0;counter-reset:st}
.demo .steps::before{content:"";position:absolute;left:16px;right:16px;top:16px;height:2px;background:rgba(150,200,240,.16);border-radius:2px}
.demo .steps::after{content:"";position:absolute;left:16px;top:16px;height:2px;width:0;max-width:calc(100% - 32px);background:linear-gradient(90deg,var(--cyan),#4f86ff);box-shadow:0 0 12px var(--cyan);border-radius:2px;transition:width .6s var(--ease)}
.demo:has(.steps span:nth-child(2).on) .steps::after{width:calc(50% - 16px)}
.demo:has(.steps span:nth-child(3).on) .steps::after{width:calc(100% - 32px)}
.demo .steps span{position:relative;z-index:1;display:grid;justify-items:center;gap:8px;counter-increment:st;color:var(--mute);font:600 .76rem var(--f-display);letter-spacing:.04em;flex:1}
.demo .steps span::before{content:counter(st);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#0a1626;border:1px solid rgba(150,200,240,.3);color:#8ea6bd;font:800 .8rem var(--f-display);transition:all .4s}
.demo .steps span:first-child{justify-items:start}.demo .steps span:last-child{justify-items:end}
.demo .steps span.on{color:#fff}.demo .steps span.on::before{background:var(--cyan);border-color:var(--cyan);color:#02101c;box-shadow:0 0 0 6px rgba(47,184,230,.14),0 0 24px rgba(47,184,230,.6)}
.demo .step.on{grid-template-columns:1fr 1fr;gap:16px}
.demo .step.on label[for],.demo .step.on label:has(textarea),.demo legend,.demo .step .chips{grid-column:1/-1}
.demo label,.demo legend{gap:8px;color:#9fb4c8;font:600 .74rem var(--f-display);letter-spacing:.12em;text-transform:uppercase}
.demo input,.demo select,.demo textarea{padding:14px 16px;border:1px solid rgba(150,200,240,.2);border-radius:14px;background:rgba(255,255,255,.04);font:500 1rem var(--f-body);letter-spacing:0;text-transform:none;color:#fff;transition:border-color .3s,box-shadow .3s,background .3s}
.demo input:hover,.demo select:hover,.demo textarea:hover{border-color:rgba(150,200,240,.4)}
.demo input:focus,.demo select:focus,.demo textarea:focus{border-color:var(--cyan);background:rgba(47,184,230,.07);box-shadow:0 0 0 4px rgba(47,184,230,.16),0 0 28px -6px rgba(47,184,230,.6)}
.demo input::placeholder{color:#5f7890}
.demo .chips button{padding:10px 18px;border-color:rgba(150,200,240,.25);background:rgba(255,255,255,.03);font:600 .86rem var(--f-body);letter-spacing:0;text-transform:none}
.demo .chips button[aria-pressed=true]{border-color:var(--cyan);background:rgba(47,184,230,.2);box-shadow:0 0 18px -4px var(--cyan);color:#fff}
.demo .nav-btns{margin-top:28px;align-items:center}
.demo #next{min-width:170px;position:relative;overflow:hidden}
.demo #next::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);animation:shn 3.6s ease-in-out infinite}
@keyframes shn{60%,100%{transform:translateX(120%)}}
.demo .fine{margin-top:16px}
@media(max-width:980px){#demoSplit{grid-template-columns:1fr}.final-l{text-align:start}.final-l .preview{margin-inline:0}}
@media(max-width:560px){.demo .step.on{grid-template-columns:1fr}.demo{padding:24px 18px}.demo .steps span{font-size:.68rem}.fl-title{max-width:none}}
html[dir=rtl] .demo .steps::after{left:auto;right:16px}html[dir=rtl] .demo .steps::before{left:16px;right:16px}
@media(prefers-reduced-motion:reduce){.demo::before,.demo #next::after{animation:none}}
.demo .step.on label:has([name=phone]),.demo .step.on label:has([name=current]){grid-column:1/-1}

/* ===== demo: four fields, then pick a time ===== */
.dm-title{margin:0 0 6px;font:800 clamp(1.35rem,2.2vw,1.8rem)/1.2 var(--f-display);letter-spacing:-.015em;text-transform:none}
html[lang=ar] .dm-title{letter-spacing:0}
.dm-sub{margin:0 0 24px;color:#9fb4c8;font-size:.96rem}
.dm-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dm-grid label:nth-child(3){grid-column:1/-1}
.dm-go{width:100%;margin-top:22px;justify-content:center}.dm-go[disabled]{opacity:.45;pointer-events:none;filter:saturate(.5)}
.dm-back{margin:0 0 14px;padding:0;border:0;background:none;color:var(--cyan);font:700 .82rem var(--f-display);cursor:pointer}
.dm-days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:16px}
@media(max-width:760px){.dm-days{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(72px,1fr);overflow-x:auto;overscroll-behavior-inline:contain;padding-bottom:6px;scrollbar-width:thin}}
.dm-days button{display:grid;gap:1px;justify-items:center;padding:12px 4px;border:1px solid rgba(150,200,240,.22);border-radius:14px;background:rgba(255,255,255,.03);color:#c6d6e5;cursor:pointer;transition:all .3s}
.dm-days small{font:600 .66rem var(--f-display);letter-spacing:.1em;text-transform:uppercase;color:#8ea6bd}.dm-days b{font:800 1.35rem var(--f-display)}
.dm-days button:hover{border-color:rgba(47,184,230,.6)}
.dm-days button[aria-selected=true]{border-color:var(--cyan);background:rgba(47,184,230,.18);box-shadow:0 0 22px -4px var(--cyan);color:#fff}.dm-days button[aria-selected=true] small{color:#bfe9fb}
.dm-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;animation:rise .45s var(--ease)}
.dm-slots button{padding:14px 10px;border:1px solid rgba(150,200,240,.22);border-radius:14px;background:rgba(255,255,255,.04);color:#fff;font:700 1rem var(--f-display);cursor:pointer;transition:all .25s;font-variant-numeric:tabular-nums}
.dm-slots button:hover{border-color:var(--cyan);transform:translateY(-2px)}
.dm-slots button[aria-pressed=true]{border-color:var(--cyan);background:linear-gradient(135deg,rgba(47,184,230,.35),rgba(47,100,230,.35));box-shadow:0 0 26px -4px var(--cyan)}
.dm-tz{margin:14px 0 0;color:#7f98af;font-size:.8rem}
.dm-done{display:grid;justify-items:center;text-align:center;gap:8px;padding:18px 0}
.dm-done i{width:76px;height:76px;margin-bottom:8px;filter:drop-shadow(0 0 20px rgba(88,214,154,.6))}
.dm-done svg{width:100%;height:100%;fill:rgba(88,214,154,.1);stroke:#58d69a;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.dm-done svg circle{stroke-dasharray:152;stroke-dashoffset:152;animation:ckd .9s .1s forwards}.dm-done svg path{fill:none;stroke-dasharray:40;stroke-dashoffset:40;animation:ckd .6s .7s forwards}
@keyframes ckd{to{stroke-dashoffset:0}}
.dm-when{margin:4px 0 8px;padding:12px 22px;border:1px solid rgba(88,214,154,.4);border-radius:999px;background:rgba(88,214,154,.1);font:700 1.05rem var(--f-display)}
.demo .fine{max-width:44ch}
@media(max-width:560px){.dm-grid{grid-template-columns:1fr}.dm-days{gap:5px}.dm-days b{font-size:1.1rem}.dm-slots{grid-template-columns:repeat(2,1fr)}}

/* Arabic mode: the interactive scenes keep their English content, so they stay left-to-right islands */
html[dir=rtl] .truth,html[dir=rtl] .pulse,html[dir=rtl] .cia-tabs,html[dir=rtl] .cia,html[dir=rtl] .loopline,html[dir=rtl] .demo-tag,
html[dir=rtl] #spineStage,html[dir=rtl] .spine,html[dir=rtl] .spine-detail,html[dir=rtl] #planSvg,html[dir=rtl] .plan-cap,
html[dir=rtl] .dt-modes,html[dir=rtl] .dt-kpis,html[dir=rtl] .dt-main,html[dir=rtl] .dt-parts,html[dir=rtl] .path,html[dir=rtl] #evSvg,
html[dir=rtl] .ev-read,html[dir=rtl] .iso-l,html[dir=rtl] .sol,html[dir=rtl] #orbSvg,html[dir=rtl] .cc-grid,html[dir=rtl] .cc-bar,html[dir=rtl] .cc-head,
html[dir=rtl] .trustline,html[dir=rtl] .sec-head~button.btn,html[dir=rtl] .wrap>button.btn.ghost,html[dir=rtl] .ccBar,html[dir=rtl] #ccBar,html[dir=rtl] .cc-enter{direction:ltr;text-align:left;unicode-bidi:isolate}
html[dir=rtl] #truth,html[dir=rtl] #loop,html[dir=rtl] #command,html[dir=rtl] #planning,html[dir=rtl] #fleet,html[dir=rtl] #pricing,html[dir=rtl] #standards,html[dir=rtl] #sol,html[dir=rtl] #integrations,html[dir=rtl] #trust{direction:ltr}
html[dir=rtl] .scene .sec-head{direction:rtl;text-align:right;margin-left:auto;margin-right:0}
html[dir=rtl] #solutions .sec-head{margin-left:0}
html[dir=rtl] #integrations .sub.c,html[dir=rtl] #trust h2.big,html[dir=rtl] #trust .fine,html[dir=rtl] #trust h3.big.sm,html[dir=rtl] #trustRead{direction:rtl;unicode-bidi:plaintext}
html[dir=rtl] #trust h2.big,html[dir=rtl] #trust h3.big.sm{text-align:right;margin-left:auto}
html[dir=rtl] #trust .fine{text-align:right}
html[dir=rtl] .cc-head{direction:rtl;text-align:right}
html[dir=rtl] .cc-head .big,html[dir=rtl] .cc-lede,html[dir=rtl] .cc-story{text-align:right;margin-left:auto;margin-right:0}
html[dir=rtl] #integrations .fine.c,html[dir=rtl] #integrations .sub.c{text-align:center}
html[dir=rtl] #trust .fine{margin-right:0;margin-left:auto;max-width:60ch}
html[dir=rtl] .cc-head>*:not(.cc-eyebrow):not(h2):not(.cc-lede):not(.cc-story){direction:ltr;text-align:left}

#ccKpis{display:none!important}
.si-list i{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5;margin-inline-end:10px;vertical-align:middle}
html[lang=ar] .cc-ctrl::before{content:"مدخلات التشغيل";letter-spacing:0;text-transform:none;font-size:.8rem}
html[lang=ar] .vd::before{content:"الخلاصة التنفيذية";letter-spacing:0;text-transform:none;font-size:.8rem;left:auto;right:28px}

.demo input.bad{border-color:#e0605e!important;box-shadow:0 0 0 3px rgba(224,96,94,.25);background:rgba(224,96,94,.08)}
.demo .fine.err{color:#ff9d9b;font-weight:600;font-size:.95rem;margin-top:12px}

.dm-slots{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}
.dm-slots button small{display:block;font:600 .62rem var(--f-body,inherit);letter-spacing:.04em;opacity:.8;margin-top:2px}
.dm-slots button.off,.dm-slots button:disabled.off{cursor:not-allowed;color:#6f8399;border-color:rgba(150,200,240,.1);transform:none;box-shadow:none;
 background:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 6px,rgba(255,255,255,.015) 6px 12px)}
.dm-slots button.off small{text-decoration:none;display:block}
.dm-slots.ld{opacity:.5;pointer-events:none}
.dm-days button.full{opacity:.45;background:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 5px,transparent 5px 10px)}
.dm-key{display:flex;gap:14px;align-items:center;margin:14px 0 0;font-size:.82rem;color:#9db3c8}
.dm-key i{display:inline-block;width:14px;height:14px;border-radius:4px;margin-inline-end:6px;vertical-align:-2px;border:1px solid rgba(150,200,240,.3)}
.dm-key .k-off{background:repeating-linear-gradient(135deg,rgba(255,255,255,.12) 0 3px,transparent 3px 6px)}
@media(max-width:560px){.dm-slots{grid-template-columns:repeat(2,1fr)}}

/* refined scrollbars */
*{scrollbar-width:thin;scrollbar-color:rgba(47,184,230,.45) transparent}
*::-webkit-scrollbar{height:6px;width:6px;background:transparent}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:rgba(47,184,230,.4);border-radius:6px}
*::-webkit-scrollbar-thumb:hover{background:rgba(47,184,230,.7)}
*::-webkit-scrollbar-button{display:none;width:0;height:0}
*::-webkit-scrollbar-corner{background:transparent}

/* ===== pricing teaser ===== */
.plans{padding-block:clamp(70px,8vw,120px)}
.pl-wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,5vw,80px);align-items:center}
.pl-copy .big em{color:#ffc65c;font-style:normal}
.pl-chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:26px 0 30px}
.pl-chips li{padding:9px 16px;border:1px solid rgba(255,198,92,.4);border-radius:999px;color:#ffe2a8;background:rgba(255,198,92,.08);font-weight:600;font-size:.92rem}
.pl-cta{display:flex;gap:14px;flex-wrap:wrap}
.pl-fig{margin:0;text-align:center;justify-self:center}
.pp-drop{width:clamp(150px,22vw,260px);height:auto;filter:drop-shadow(0 20px 50px rgba(240,166,43,.35))}
.pp-wave{animation:ppw 5s linear infinite}
@keyframes ppw{to{transform:translateX(100px)}}
.pl-fig figcaption{display:grid;gap:4px;margin-top:14px}.pl-fig b{font:800 1.25rem var(--f-display);color:#ffd27a}.pl-fig span{color:#9db3c8;font-size:.95rem}
@media(max-width:860px){.pl-wrap{grid-template-columns:1fr}.pl-fig{order:-1}}
@media(prefers-reduced-motion:reduce){.pp-wave{animation:none}}

/* ===== pricing page: a luminous light design ===== */
body.pp-open{overflow:hidden}
body.pp-open main,body.pp-open footer,body.pp-open #fnTrack{visibility:hidden}
#pp{position:fixed;inset:0;z-index:30;overflow-y:auto;display:none;background:linear-gradient(180deg,#f7f1e6 0,#eef4f9 38%,#e8eff7 100%);color:#0b1b2e;padding:96px 0 0}
body.pp-open #pp{display:block}
.pp-wrap{--ink:#0b1b2e;--sub:#42586f;--gold:#f0a62b;--sea:#0a8fc0;max-width:1180px;margin:0 auto;padding:0 clamp(20px,5vw,56px) 90px}
.pp-wrap h1,.pp-wrap h2,.pp-wrap h3{font-family:var(--f-display);color:var(--ink);margin:0}
html[lang=ar] .pp-wrap *{font-family:var(--f-ar)}
.pp-back{display:inline-block;margin:18px 0 8px;color:var(--sea);font-weight:700;text-decoration:none}
.pp-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px,4vw,60px);align-items:center;padding:clamp(28px,4vw,56px);margin-top:10px;border-radius:32px;color:#fff;background:radial-gradient(900px 500px at 85% 20%,rgba(240,166,43,.28),transparent 60%),linear-gradient(135deg,#071a33,#0b2f57 70%,#0a4a78);box-shadow:0 40px 90px -40px rgba(7,26,51,.6);overflow:hidden}
.pp-eyebrow{margin:0 0 16px;font:800 .78rem var(--f-display);letter-spacing:.2em;text-transform:uppercase;color:#ffd27a}
html[lang=ar] .pp-eyebrow{letter-spacing:0;font-size:.95rem;text-transform:none}
.pp-wrap .pp-hero h1{color:#fff;font-size:clamp(2.1rem,4.6vw,4rem);line-height:1.1;letter-spacing:-.02em}
.pp-hero h1 em{font-style:normal;color:#ffc65c}
.pp-lead{color:#cfe1f2;font-size:1.12rem;max-width:36ch;line-height:1.6;margin:18px 0 26px}
.pp-cta{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.pp-link{color:#ffd27a;font-weight:700}
.pp-hero-f{margin:0;text-align:center}.pp-hero-f figcaption{margin-top:12px;color:#ffe2a8;font-weight:700}
.pp-loss{text-align:center;max-width:820px;margin:clamp(50px,7vw,90px) auto}
.pp-loss p{color:var(--sub);font-weight:600;margin:0 0 14px}
.pp-wrap .pp-loss h2{font-size:clamp(1.5rem,3vw,2.4rem);line-height:1.25}
.pp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pp-card{background:#fff;border-radius:26px;padding:28px;box-shadow:0 18px 50px -24px rgba(11,27,46,.28);border:1px solid rgba(11,27,46,.06);display:flex;flex-direction:column;gap:12px;transition:transform .35s var(--ease),box-shadow .35s}
.pp-card:hover{transform:translateY(-6px);box-shadow:0 28px 60px -22px rgba(11,27,46,.35)}
.pp-card.wide{grid-column:span 2;background:linear-gradient(135deg,#fff,#fff7e6)}
.pp-ic{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--sea),#1a5fd0)}.pp-ic svg{width:30px;height:30px}
.pp-card:nth-child(2) .pp-ic{background:linear-gradient(135deg,#ffc65c,var(--gold))}
.pp-wrap .pp-card h3{font-size:1.3rem}.pp-card p{margin:0;color:var(--sub);line-height:1.65}
.pp-card small{color:#6a7f94;line-height:1.5}
.pp-iso{list-style:none;padding:0;margin:6px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px}.pp-iso li{padding:10px 12px;border-radius:12px;background:#eef6fc;display:grid}.pp-iso b{color:var(--ink)}.pp-iso span{color:var(--sub);font-size:.85rem}
.pp-no{list-style:none;padding:0;margin:6px 0 0;display:flex;flex-wrap:wrap;gap:8px}.pp-no li{padding:7px 12px;border-radius:999px;background:#fdeaea;color:#a23a3a;text-decoration:line-through;font-weight:600;font-size:.9rem}
.pp-stack{margin-top:clamp(50px,7vw,90px);padding:clamp(24px,4vw,48px);border-radius:30px;background:#0b1b2e;color:#fff}
.pp-wrap .pp-stack h2{color:#fff;font-size:clamp(1.5rem,3vw,2.3rem)}.pp-stack-h p{color:#9db3c8;margin:8px 0 22px}
.pp-tabs{display:inline-flex;padding:5px;border-radius:999px;background:rgba(255,255,255,.08);margin-bottom:22px;flex-wrap:wrap;gap:4px}
.pp-tabs button{padding:10px 18px;border:0;border-radius:999px;background:transparent;color:#cfe1f2;font-weight:700;font-size:.95rem;font-family:inherit;cursor:pointer;transition:all .3s}
.pp-tabs button[aria-selected=true]{background:#ffc65c;color:#0b1b2e}
.pp-rows{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pp-rows li{display:flex;align-items:center;gap:12px;padding:16px 18px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);transition:all .5s var(--ease) var(--d)}
.pp-rows .lk{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.1);flex:none;transition:all .5s var(--ease) var(--d)}
.pp-rows .lk svg{width:20px;height:20px;fill:none;stroke:#cfe1f2;stroke-width:2;stroke-linecap:round}
.pp-rows .lk .sh{transform-origin:16px 11px;transition:transform .5s var(--ease) var(--d)}
.pp-rows b{flex:1;color:#fff;font-size:1rem}
.pp-rows .tg{font-style:normal;font-size:.8rem;font-weight:700;padding:4px 10px;border-radius:999px;white-space:nowrap}
.pp-rows .t1{background:rgba(239,74,74,.18);color:#ff9d9b}.pp-rows .t2{display:none;background:rgba(52,201,138,.2);color:#7ff0bd}
[data-mode=nq] .pp-rows li{border-color:rgba(52,201,138,.45);background:rgba(52,201,138,.08)}
[data-mode=nq] .pp-rows .lk{background:rgba(52,201,138,.25)}[data-mode=nq] .pp-rows .lk svg{stroke:#7ff0bd}
[data-mode=nq] .pp-rows .lk .sh{transform:rotate(-35deg) translate(1px,-2px)}
[data-mode=nq] .t1{display:none}[data-mode=nq] .t2{display:inline-block}
.pp-sum{margin:22px 0 0;font-weight:700;font-size:1.1rem;color:#ffd27a}.pp-sum .s2{display:none}
[data-mode=nq] .pp-sum .s1{display:none}[data-mode=nq] .pp-sum .s2{display:inline;color:#7ff0bd}
@media(max-width:860px){.pp-rows{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.pp-rows li,.pp-rows .lk,.pp-rows .sh{transition:none}}
.pp-steps{margin-top:clamp(50px,7vw,90px)}.pp-wrap .pp-steps h2{font-size:clamp(1.5rem,3vw,2.3rem);margin-bottom:24px}
.pp-steps ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.pp-steps li{counter-increment:s;position:relative;padding:26px;border-radius:22px;background:#fff;box-shadow:0 14px 40px -24px rgba(11,27,46,.3);display:grid;gap:8px}
.pp-steps li::before{content:"";width:34px;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--gold),var(--sea))}
.pp-steps b{font-size:1.15rem;color:var(--ink)}.pp-steps span{color:var(--sub);line-height:1.6}
.pp-faq{margin-top:clamp(50px,7vw,90px);max-width:820px}.pp-wrap .pp-faq h2{font-size:clamp(1.5rem,3vw,2.3rem);margin-bottom:18px}
.pp-faq details{background:#fff;border-radius:18px;padding:18px 22px;margin-bottom:10px;border:1px solid rgba(11,27,46,.06)}
.pp-faq summary{cursor:pointer;font-weight:700;color:var(--ink);list-style:none}.pp-faq summary::-webkit-details-marker{display:none}
.pp-faq summary::after{content:"+";float:right;color:var(--sea);font-weight:800}html[dir=rtl] .pp-faq summary::after{float:left}.pp-faq details[open] summary::after{content:"–"}
.pp-faq details p{margin:12px 0 0;color:var(--sub);line-height:1.65}
.pp-final{margin-top:clamp(50px,7vw,90px);text-align:center;padding:clamp(36px,5vw,64px);border-radius:30px;background:linear-gradient(135deg,#ffe2a8,#ffc65c)}
.pp-wrap .pp-final h2{font-size:clamp(1.6rem,3.2vw,2.6rem);margin-bottom:22px}
@media(max-width:860px){.pp-hero{grid-template-columns:1fr}.pp-hero-f{order:-1}.pp-grid,.pp-steps ol{grid-template-columns:1fr}.pp-card.wide{grid-column:auto}.pp-iso{grid-template-columns:1fr}}
.pp-badge{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 0!important}.pp-badge b{padding:6px 12px;border-radius:10px;background:linear-gradient(135deg,#ffc65c,#f0a62b);color:#0b1b2e;letter-spacing:.04em}.pp-badge span{color:#0b1b2e;font-weight:700}

.pp-card.cert{grid-column:1/-1;position:relative;overflow:hidden;align-items:center;text-align:center;gap:18px;padding:clamp(34px,5vw,64px) clamp(20px,5vw,64px);color:#fff;background:radial-gradient(900px 420px at 50% -8%,rgba(255,198,92,.28),transparent 62%),linear-gradient(160deg,#061a34,#0a2d54 70%,#0a3d68);border:1px solid rgba(255,198,92,.5)}
.pp-card.cert:hover{transform:none}
.cert-seal{position:relative;width:clamp(190px,22vw,270px);height:auto;filter:drop-shadow(0 14px 28px rgba(0,0,0,.45))}
.cert-eyebrow{position:relative;margin:6px 0 0!important;font-weight:800;letter-spacing:.2em;font-size:.85rem!important;color:#ffd27a!important;text-transform:uppercase}
html[lang=ar] .cert-eyebrow{letter-spacing:0;font-size:1rem!important}
.pp-wrap .pp-card.cert h3{position:relative;color:#fff;font-size:clamp(1.7rem,3.4vw,2.7rem);line-height:1.25;max-width:20ch;text-wrap:balance}
.cert-beats{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:0;width:100%;max-width:980px;margin-top:10px}
.pp-card.cert .cert-beats p{margin:0;padding:6px clamp(14px,2vw,28px);font-size:1rem;line-height:1.75;color:#cfe1f2;display:flex;flex-direction:column;gap:8px}
.cert-beats p+p{border-inline-start:1px solid rgba(255,198,92,.3)}
.cert-beats b{color:#ffd27a;font-size:1.05rem}
.pp-card.cert .cert-q{position:relative;margin:12px 0 0;padding:0;font-weight:800;font-size:clamp(1.25rem,2.2vw,1.7rem);color:#fff}
.pp-card.cert .cert-q::before,.pp-card.cert .cert-q::after{content:"";display:inline-block;width:46px;height:2px;background:linear-gradient(90deg,transparent,#ffc65c);vertical-align:middle;margin-inline:14px}
.pp-card.cert .cert-q::after{transform:scaleX(-1)}
.pp-card.cert .pp-iso{position:relative;grid-template-columns:repeat(4,1fr);width:100%;max-width:880px;margin-top:8px;text-align:start}
.pp-card.cert .pp-iso li{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16)}.pp-card.cert .pp-iso b{color:#fff}.pp-card.cert .pp-iso span{color:#b9cfe3}
.pp-card.cert small{position:relative;color:#9db3c8}
@media(max-width:860px){.cert-beats{grid-template-columns:1fr;gap:14px}.cert-beats p+p{border-inline-start:0;border-top:1px solid rgba(255,198,92,.3);padding-top:14px}.pp-card.cert .pp-iso{grid-template-columns:1fr 1fr}}
/* certificate card: clear layout */
.pp-card.cert{align-items:stretch;text-align:start;gap:clamp(26px,3.4vw,44px)}
.cert-hero{position:relative;display:flex;align-items:center;justify-content:center;gap:clamp(24px,4.5vw,64px)}
.cert-hero .cert-seal{flex:none;width:clamp(180px,20vw,250px)}
.cert-intro{display:flex;flex-direction:column;gap:12px;max-width:560px;min-width:0}
.cert-intro .cert-eyebrow{margin:0!important}
.pp-wrap .pp-card.cert .cert-intro h3{max-width:none;font-size:clamp(1.6rem,3vw,2.4rem);margin:0}
.pp-card.cert .cert-def{margin:0;font-size:1.08rem;line-height:1.85;color:#d3e3f3}
.cert-sec{position:relative;display:flex;flex-direction:column;gap:14px}
.pp-wrap .pp-card.cert .cert-sec h4{margin:0;display:flex;align-items:center;gap:14px;color:#ffd27a;font-size:1.05rem;font-weight:800}
.cert-sec h4::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(255,198,92,.45),transparent)}
html[dir=rtl] .cert-sec h4::after{background:linear-gradient(270deg,rgba(255,198,92,.45),transparent)}
.cert-cov,.cert-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.cert-cov{grid-template-columns:repeat(4,1fr)}.cert-steps{grid-template-columns:repeat(3,1fr);counter-reset:s}
.cert-cov li,.cert-steps li{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);min-width:0}
.cert-cov b{font-size:.78rem;letter-spacing:.08em;color:#ffd27a}
.cert-cov strong,.cert-steps strong{color:#fff;font-size:1.05rem}
.cert-cov span,.cert-steps span{color:#b9cfe3;font-size:.95rem;line-height:1.7}
.cert-steps i{counter-increment:s;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;color:#0b2347;background:linear-gradient(135deg,#fbeab0,#c9922e)}
.cert-steps i::before{content:counter(s)}
html[lang=ar] .cert-steps i::before{content:counter(s,arabic-indic)}
.pp-card.cert .cert-q{align-self:center;text-align:center}
.pp-card.cert small{align-self:center;text-align:center}
@media(max-width:900px){.cert-cov{grid-template-columns:1fr 1fr}.cert-steps{grid-template-columns:1fr}.cert-hero{flex-direction:column;text-align:center}.cert-intro{align-items:center}}
@media(max-width:520px){.cert-cov{grid-template-columns:1fr}}
/* menu button: three lines, no word */
.burger{width:46px;height:42px;padding:0!important;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.burger i{display:block;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .25s,opacity .2s}
.burger[aria-expanded=true] i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded=true] i:nth-child(2){opacity:0}
.burger[aria-expanded=true] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:980px){.burger{display:flex!important}}