/* Virtual Kinect: shared stylesheet. Neumorphic light system, tight spacing, eyebrow above every heading. */
:root{
  --bg:#e6ebf1; --shade:#c3cbd6; --light:#ffffff;
  --navy:#053a5f; --navy-2:#2c6894; --ink:#15202b; --muted:#4f5b69; --ok:#1f8a5b;
  --raised:8px 8px 16px var(--shade),-8px -8px 16px var(--light);
  --raised-sm:5px 5px 10px var(--shade),-5px -5px 10px var(--light);
  --inset:inset 6px 6px 12px var(--shade),inset -6px -6px 12px var(--light);
  --r:20px;
  --float:10px 10px 20px var(--shade),-10px -10px 20px var(--light);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.55 "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:"Montserrat","Inter",system-ui,sans-serif;margin:0;line-height:1.15;text-wrap:balance;color:var(--ink)}
p{margin:0;color:var(--muted);text-wrap:pretty}
a{color:var(--navy-2)}
:focus-visible{outline:3px solid var(--navy-2);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:16px;top:8px;z-index:20;background:var(--bg);padding:8px 12px;border-radius:10px;box-shadow:var(--raised)}
.wrap{max-width:none;margin-inline:auto;padding-inline:clamp(16px,3vw,56px)}

/* Eyebrow: every section heading sits under one of these */
.eyebrow{font:600 12px/1.2 "Montserrat",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--navy-2);margin:0 0 8px;display:block}

/* Header */
.site-head{padding-block:10px}
.head-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;text-decoration:none;flex:none}
.brand img{height:44px;width:auto;mix-blend-mode:multiply}
.nav{display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.nav a{font-size:14px;font-weight:600;color:var(--muted);text-decoration:none;padding:9px 12px;border-radius:12px}
.nav a{transition:box-shadow .2s ease,color .2s ease}
.nav a:hover{color:var(--navy);box-shadow:var(--float)}
.nav a[aria-current="page"]{color:var(--navy);box-shadow:var(--inset)}
.menu-toggle{display:none;font:600 14px/1 "Inter",sans-serif;background:var(--bg);border:0;border-radius:12px;padding:11px 14px;box-shadow:var(--raised-sm);color:var(--navy);cursor:pointer}

.head-cta{display:flex;align-items:center;gap:10px;flex:none}
.btn.ghost{background:transparent;color:var(--navy);box-shadow:inset 0 0 0 2px var(--navy-2)}
.btn.pill{border-radius:999px;background:linear-gradient(145deg,var(--navy-2),var(--navy));color:#fff;box-shadow:var(--raised-sm)}

/* Buttons */
.btn{font:600 15px/1 "Inter",sans-serif;padding:12px 18px;border:0;border-radius:16px;background:var(--bg);color:var(--navy);box-shadow:var(--raised);text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:transform .25s,box-shadow .25s}
.btn{transition:box-shadow .2s ease,transform .2s ease}
.btn:hover{transform:translateY(-1px);box-shadow:var(--float)}
.btn.ghost:hover{box-shadow:inset 0 0 0 2px var(--navy-2),var(--raised-sm)}
.btn:focus-visible{box-shadow:var(--float)}
.btn:active{box-shadow:var(--inset);transform:none}
.btn.primary{color:#fff;background:linear-gradient(145deg,var(--navy-2),var(--navy))}
.btn.small{padding:11px 16px;font-size:14px}

/* Hero (command layout) */
.hero{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:center;padding-block:12px 20px}
.hero h1{font-size:clamp(32px,4.8vw,54px);color:var(--navy);letter-spacing:-.015em;margin-bottom:14px}
.hero h1 span{color:var(--ink)}
.lead{font-size:17px;max-width:54ch}
.row{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.panel{border-radius:22px;background:var(--bg);box-shadow:var(--raised);padding:14px;display:grid;gap:12px;min-width:0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font:600 13px/1 "Montserrat",sans-serif;color:var(--navy)}
.live{display:inline-flex;align-items:center;gap:8px;color:var(--ok)}
.live::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--ok)}
.well{border-radius:20px;box-shadow:var(--inset);overflow:hidden;background:var(--bg);position:relative;aspect-ratio:16/11;min-width:0}
.scene{position:absolute;inset:0}
.scene canvas{width:100%!important;height:100%!important;display:block}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kpi{border-radius:16px;box-shadow:var(--inset);padding:14px;min-width:0}
.kpi .n{font:800 24px/1 "Montserrat",sans-serif;color:var(--navy);font-variant-numeric:tabular-nums}
.kpi .l{font-size:12px;color:var(--muted);margin-top:6px;font-weight:600}
.note{font-size:12px;color:var(--muted)}

/* Sections: tight rhythm */
section.block{padding-block:24px}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.sec-head h2{font-size:clamp(24px,3.2vw,34px);color:var(--navy)}
.sec-head p{max-width:46ch}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.card{background:var(--bg);border-radius:var(--r);box-shadow:var(--raised);padding:18px;display:flex;flex-direction:column;gap:6px;min-width:0}
.card h3{font-size:18px}
.card p{font-size:15px}
.card a.more{margin-top:auto;font-size:14px;font-weight:700;text-decoration:none;padding-top:6px}
.ico{width:46px;height:46px;border-radius:14px;box-shadow:var(--inset);display:grid;place-items:center;flex:none;margin-bottom:4px}
.ico svg{width:22px;height:22px;stroke:var(--navy);fill:none;stroke-width:1.8}
.list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.list li{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;box-shadow:var(--raised-sm);color:var(--ink);font-weight:500}
.list li::before{content:"";width:10px;height:10px;border-radius:50%;flex:none;margin-top:7px;background:var(--navy-2);box-shadow:var(--inset)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step{padding:16px;border-radius:var(--r);box-shadow:var(--raised);min-width:0;display:grid;gap:6px;align-content:start}
.step .n{font:800 12px/1 "Montserrat",sans-serif;letter-spacing:.1em;color:var(--navy-2)}
.step h3{font-size:17px}
.step p{font-size:14px}
.counts{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.count{padding:20px;border-radius:var(--r);box-shadow:var(--inset);display:grid;gap:6px}
.count .n{font:800 34px/1 "Montserrat",sans-serif;color:var(--navy);font-variant-numeric:tabular-nums}
.count .l{font-size:13px;color:var(--muted);font-weight:600}
.band{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:center;padding:20px;border-radius:26px;box-shadow:var(--raised)}
.band h2{font-size:clamp(22px,2.8vw,30px);color:var(--navy)}
.band .row{margin-top:0;justify-content:flex-end}

/* Forms */
.form{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:22px;border-radius:24px;box-shadow:var(--raised)}
.form .full{grid-column:1/-1}
label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px}
input,select,textarea{width:100%;font:500 15px/1.4 "Inter",sans-serif;color:var(--ink);background:var(--bg);border:0;border-radius:14px;padding:12px 14px;box-shadow:var(--inset);min-width:0}
textarea{min-height:96px;resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.status{font-weight:600;color:var(--navy);min-height:1.3em;grid-column:1/-1;margin:0}

/* Legal and sitemap */
.doc{padding-block:24px 40px;max-width:1040px}
.doc h1{font-size:clamp(28px,4vw,40px);color:var(--navy);margin-bottom:10px}
.doc h2{font-size:19px;color:var(--navy);margin:4px 0 6px}
.doc .eyebrow{margin-top:18px}
.doc p,.doc li{font-size:15px}
.doc ul{padding-left:20px;margin:6px 0;display:grid;gap:4px}
.meta{font-size:13px;color:var(--muted);font-weight:600}
.sitemap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.sitemap ul{list-style:none;margin:0;padding:18px;border-radius:var(--r);box-shadow:var(--raised);display:grid;gap:8px}
.sitemap li a{text-decoration:none;color:var(--ink);font-weight:500}
.sitemap li a:hover{color:var(--navy)}

/* Footer */
.site-foot{padding-block:22px 24px;margin-top:12px;box-shadow:0 -1px 0 var(--shade)}
.foot-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:24px}
.foot-grid img{height:40px;width:auto;mix-blend-mode:multiply;margin-bottom:10px}
.foot-grid h2{margin-bottom:10px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot-grid a{text-decoration:none;color:var(--muted);font-size:14px}
.foot-grid a:hover{color:var(--navy)}
.legal{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:20px;padding-top:14px;font-size:13px;color:var(--muted)}

/* Responsive */
@media (max-width:920px){
  .hero,.two,.band{grid-template-columns:1fr}
  .band .row{justify-content:flex-start}
  .steps,.counts{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .nav{display:none;position:absolute;left:16px;right:16px;top:64px;background:var(--bg);box-shadow:var(--float,var(--raised));border-radius:18px;padding:10px;flex-direction:column;align-items:stretch;z-index:5}
  .nav.open{display:flex}
  .menu-toggle{display:inline-block}
  .site-head{position:relative}
}
/* Header menu switches to the Menu button before the larger logo can wrap the links */
@media (max-width:1100px){
  .nav{display:none;position:absolute;left:16px;right:16px;top:64px;background:var(--bg);box-shadow:var(--float,var(--raised));border-radius:18px;padding:10px;flex-direction:column;align-items:stretch;z-index:5}
  .nav.open{display:flex}
  .menu-toggle{display:inline-block}
  .site-head{position:relative}
}
@media (max-width:560px){
  .steps,.counts,.form,.foot-grid{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr 1fr 1fr}
  .well{aspect-ratio:4/3}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Utility classes (used instead of inline style attributes, which the CSP blocks) */
.sec-title{font-family:"Montserrat","Inter",system-ui,sans-serif;color:var(--navy);font-size:clamp(24px,3.2vw,34px);line-height:1.15;margin:0 0 12px;text-wrap:balance}
.ml6{margin-left:6px}
.mt8{margin-top:8px}
.mt12{margin-top:12px}
.hero-tight{padding-bottom:12px}
.two.start{align-items:start}



/* Clickable blocks: shadow on hover and focus */
.card:has(a.more){transition:box-shadow .2s ease}
.card:has(a.more):hover,.sitemap ul:hover,.menu-toggle:hover{box-shadow:var(--float)}
.sitemap li a{display:inline-block;padding:4px 8px;margin:-4px -8px;border-radius:10px;transition:box-shadow .2s ease}
.sitemap li a:hover,.sitemap li a:focus-visible{box-shadow:var(--raised-sm)}
.foot-grid a{display:inline-block;padding:2px 6px;margin-left:-6px;border-radius:8px;transition:box-shadow .2s ease}
.foot-grid a:hover,.foot-grid a:focus-visible{box-shadow:var(--raised-sm);color:var(--navy)}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:var(--inset),0 0 0 2px var(--navy-2)}

/* Top Technology Partners: scrolling logo band */
.partners-band{text-align:center}
.partners-band .eyebrow{text-align:center}
.partners-band .sec-title{margin-left:auto;margin-right:auto}
.partners-band .wrap{padding-bottom:8px}
.marquee{overflow:hidden;position:relative;padding:12px 0 16px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{list-style:none;margin:0;padding:0;display:flex;width:max-content;animation:marquee 45s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.logo-card{flex:0 0 auto;width:200px;height:100px;margin-right:16px;display:flex;align-items:center;justify-content:center;
  border-radius:var(--r);background:var(--bg);box-shadow:var(--raised-sm)}
.logo-card img{width:180px;height:84px;object-fit:contain;display:block;mix-blend-mode:multiply}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee{overflow-x:auto}.marquee-track{animation:none}}

/* Logos: smaller so the menu has more room */
.brand img{height:51px}
.foot-grid img{height:30px}

/* Key figures band: centred, equal blocks, one-line labels */
.kf-band{padding-block:16px}
.kf-band .panel{width:100%}
.kf-band .counts{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kf-band .count{min-height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;padding:14px 10px;min-width:0}
.kf-band .count .n{white-space:nowrap;font-size:clamp(24px,3vw,34px)}
.kf-band .count .l{white-space:nowrap;font-size:13px}
@media (max-width:560px){
  .kf-band .counts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kf-band .count .n{font-size:26px}
}

/* Header: menu links fit on one row */
.nav{gap:0}
.nav a{padding:8px 8px;white-space:nowrap}
.head-cta .btn.small{padding:9px 13px}
.head-cta{gap:8px}

/* Compact 3D image on pages without a hero scene */
.well.doc-art{aspect-ratio:16/6;margin-top:14px;max-width:820px}
@media (max-width:560px){.well.doc-art{aspect-ratio:16/9}}

/* FAQ (visible questions, also marked up as FAQPage data) */
.faq{display:grid;gap:10px}
.faq-item{border-radius:16px;box-shadow:var(--raised-sm);padding:14px 18px;background:var(--bg);transition:box-shadow .2s ease}
.faq-item:hover{box-shadow:var(--float)}
.faq-item[open]{box-shadow:var(--inset)}
.faq-item summary{cursor:pointer;font:600 16px/1.4 "Inter",sans-serif;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-weight:800;color:var(--navy-2);font-size:20px;line-height:1}
.faq-item[open] summary::after{content:"\2212"}
.faq-item p{margin-top:10px;font-size:15px}

/* Phones: header fits 360px screens */
@media (max-width:560px){
  .head-row{gap:6px}
  .brand img{height:36px}
  .head-cta .btn.small{padding:7px 9px;font-size:12px}
  .head-cta .pill{display:none}
  .menu-toggle{padding:8px 10px;font-size:13px}
}

/* Small screens: keep the main call to action, hide the secondary button */
@media (max-width:760px){.head-cta .ghost{display:none}}

/* Hero visual: 3D image and numbers only (no box, no heading) */
.hero-visual{display:grid;gap:14px;min-width:0;align-content:center}
.visual{position:relative;aspect-ratio:16/11;min-width:0}
.hero-visual .kpis{gap:8px}
.hero-visual .kpi{box-shadow:none;padding:4px 0;text-align:center;min-width:0}
.hero-visual .kpi .n{font-size:clamp(22px,2.6vw,30px)}
.hero-visual .kpi .l{font-size:12px}

/* Keep 3D scenes inside their own box */
.visual{overflow:hidden;isolation:isolate}
.visual .scene{position:absolute;inset:0;overflow:hidden}
