/* stable.css: load LAST (after futuristic.css).
   Professional navy theme: one calm background, no moving shapes, no 3D wobble, nothing cut off on phones. */
:root{--pro-bg1:#0d1f3c;--pro-bg2:#102a4c;--pro-bg3:#0b1a31;--pro-accent:#38bdf8;--pro-accent2:#2563eb}

/* ---------- background: solid navy, one soft light, nothing moving ---------- */
html{background:#050a1f}
html,body{overflow-x:clip}
body[data-view="online"],body.inner{
  background-color:#04061a!important;
  background-image:
    radial-gradient(900px 600px at 50% 0%,rgba(37,99,235,.22),transparent 72%),
    radial-gradient(760px 540px at 4% 60%,rgba(124,58,237,.20),transparent 70%),
    radial-gradient(760px 540px at 98% 85%,rgba(34,211,238,.12),transparent 70%),
    linear-gradient(180deg,#050a1f 0%,#0a1236 55%,#060b24 100%)!important;
  background-size:100% 1800px,100% 1800px,100% 1800px,100% 100%!important;
  background-repeat:repeat-y,repeat-y,repeat-y,no-repeat!important;
  background-attachment:scroll!important}
/* every decorative moving layer is switched off (3D hero objects, orbs, grid, floating shapes) */
#scene-canvas,#o-bg,.o-orb,.mk-p,.mk-shot{display:none!important}
.o-header{background:rgba(8,16,52,.95)!important;border-bottom:1px solid rgba(255,255,255,.08)}
.sb-footer{background:linear-gradient(180deg,rgba(13,31,60,0),#0b1a50 16%,#060c26 100%)!important}
.sb-footer::before{background:linear-gradient(90deg,transparent,#2563eb 25%,#38bdf8 55%,#2563eb 80%,transparent)!important}

/* clean panels */
.in-note,.in-points li,.sp-faq details,.pr-faq details,.pr-feat,.sp-chips li,.sp-rel a,.sp-spot,.pr-dash,.pr-plan{
  background-color:rgba(255,255,255,.05)!important;border-color:rgba(255,255,255,.12)!important}
.sp-spot{background-image:none!important}

/* accents: sky blue instead of neon green/purple */
body.inner a:not([class]),.o-nav a[aria-current="page"]{color:var(--pro-accent)}
.in-note strong,.sb-h{color:#7dd3fc}
.in-tick{background:linear-gradient(135deg,#38bdf8,#2563eb)!important;color:#fff!important}
.sb-footer .sb-top,.sb-footer .sb-social__a:hover{background:linear-gradient(135deg,#38bdf8,#2563eb)!important;color:#fff!important}
.sb-item__ico{color:#7dd3fc;background:rgba(56,189,248,.1);border-color:rgba(56,189,248,.28)}

/* ---------- no wobble ---------- */
.mk-f,.mk-o,.mk-shot img,.in-mk img,.panel__art--img img,.sb-wa,.sb-wa__ring,.sb-top:hover svg{animation:none!important}
#main-online,#online-site main{perspective:none!important;perspective-origin:50% 50%!important}
.card,.panel,.o-steps li,.o-principles li,.o-stat,.in-points li,.in-note,.o-formwrap,.o-h2,.o-hero__title,.in-title,.o-cta h2,.o-sub,
.in-photo,.in-art,.panel__art,.o-orbring,.o-badge,.o-vert{translate:none!important;rotate:none!important;will-change:auto!important}
.card__inner,.card__icon,.card h3,.card p,.card__go{transform:none!important;transform-style:flat!important}
.card:hover,.pr-feat:hover,.in-photo:hover img,.sb-footer .sb-social__a:hover{transform:none!important}
.o-h2,.in-title,.o-hero__title{filter:none!important}

/* ---------- nothing cut off on phones ---------- */
.in-hero__grid>*,.in-two>*,.sp-spot>*,.sp-rows>*,.o-contact>*{min-width:0}
.in-lead,.in-points li,.sp-row dd,.sp-row dt,.in-note,.sp-faq p,.pr-faq p{overflow-wrap:anywhere}
.in-points{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))!important}
.sp-rel a{white-space:normal}
@media(max-width:1000px){
  .in-hero__grid,.in-two,.sp-rows,.sp-spot,.o-contact{grid-template-columns:minmax(0,1fr)!important}
  .in-two{gap:24px}
}
@media(max-width:700px){
  .o-wrap{padding-left:max(16px,env(safe-area-inset-left))!important;padding-right:max(16px,env(safe-area-inset-right))!important}
  .in-title{font-size:clamp(2rem,9vw,3rem)}
  .sp-spot{padding:22px!important}
}

/* ---------- section rhythm: hairline dividers and soft alternating bands (all static) ---------- */
.o-sec{position:relative}
.o-sec+.o-sec::before{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(56,189,248,.38),rgba(129,140,248,.38),transparent)}
.o-sec:nth-of-type(even){background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0))}
.in-note,.in-points li,.sp-faq details,.pr-faq details,.pr-feat,.pr-plan,.card{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 30px rgba(3,10,25,.28)}

/* ---------- home hero: headline on the left, rocket + dashboard tiles on the right ---------- */
.hud,.o-orbring .r2{animation:none!important}              /* tiles and ring stay still */
.hud{min-width:0}
.hud__g{min-width:0}.hud__g span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(min-width:1101px){
  .fx-hero{padding:44px 0 24px}
  .fx-hero__in{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);column-gap:clamp(28px,4vw,56px);align-items:center;text-align:left}
  .fx-copy{grid-column:1;display:flex;flex-direction:column;align-items:flex-start}
  .fx-hero .o-hero__title{max-width:none;margin:20px 0 18px;text-align:left;font-size:clamp(2.6rem,4.4vw,4.4rem);line-height:1.05}
  .fx-hero .o-hero__lead{max-width:46ch;margin:0 0 26px;text-align:left}
  .fx-search{width:100%;max-width:520px}
  .fx-search span{font-size:.88rem}
  .fx-stage{grid-column:2;margin-top:0;gap:14px;grid-template-columns:minmax(132px,1fr) auto minmax(132px,1fr)}
  .fx-stage .o-orbring{width:clamp(210px,24vw,340px)}
  .fx-icons,.fx-tag,.o-hero__hint{grid-column:1/-1;text-align:center}
}

/* ---------- hero v2: no side tiles, big rocket on the right, tidy headline ---------- */
.fx-col{display:none!important}
.fx-hero .o-hero__lead{text-wrap:pretty}
@media(min-width:1101px){
  .fx-hero__in{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);column-gap:clamp(20px,3vw,48px)}
  .fx-hero .o-hero__title{font-size:clamp(2.2rem,3.4vw,3rem);line-height:1.1;letter-spacing:-.03em;text-wrap:balance;margin:22px 0 20px}
  .fx-hero .o-hero__lead{max-width:44ch;font-size:1.05rem;line-height:1.7;margin:0 0 28px}
  .fx-stage{display:grid;grid-template-columns:minmax(0,1fr);justify-items:end}
  .fx-stage .o-hero__art{width:100%;place-items:center end}
  .fx-stage .o-orbring{width:min(100%,clamp(340px,40vw,600px));margin-right:clamp(0px,1vw,16px)}
}

/* ---------- hero v3: balanced two-column, rocket sized to the text block ---------- */
@media(min-width:1101px){
  .fx-hero{padding:48px 0 28px}
  .fx-hero__in{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(24px,4vw,64px);align-items:center}
  .fx-copy{justify-content:center}
  .fx-hero .o-hero__lead{max-width:46ch}
  .fx-search{max-width:500px}
  .fx-stage{grid-template-columns:minmax(0,1fr);justify-items:center;padding:0 0 4%}
  .fx-stage .o-hero__art{place-items:center}
  .fx-stage .o-orbring{width:min(100%,clamp(320px,33vw,450px));margin:0}
}

/* ---------- hero v4: bigger copy, two buttons, rocket further right ---------- */
.fx-hero-btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.fx-hero-btns .btn{padding:15px 28px;font-size:.95rem}
@media(min-width:1101px){
  .fx-hero-btns{justify-content:flex-start}
  .fx-hero .o-hero__title{font-size:clamp(2.4rem,4.2vw,3.2rem);line-height:1.08;margin:24px 0 22px}
  .fx-hero .o-hero__lead{font-size:1.15rem;line-height:1.7;max-width:48ch;margin:0 0 32px}
  .fx-stage{justify-items:end}
  .fx-stage .o-hero__art{place-items:center end}
  .fx-stage .o-orbring{margin-right:clamp(-40px,-2vw,0px)}
}

/* ---------- hero: extra static light behind the headline and the rocket ---------- */
.fx-hero{background:none}
.o-sec+.o-sec::before{background:linear-gradient(90deg,transparent,rgba(34,211,238,.55),rgba(167,139,250,.55),transparent)!important}

/* ---------- cosmic background (bgart.js): fixed, behind the content (#online-site is z-index 2), never takes clicks ---------- */
#mk-bg{display:none;position:fixed;inset:0;z-index:0;overflow:hidden;perspective:none!important;pointer-events:none;user-select:none}
body[data-view="online"] #mk-bg{display:block}
#mk-bg .cs-fade{position:absolute;inset:0}
#mk-bg .cs-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#mk-bg .cs-veil{position:absolute;inset:0;background:rgba(3,5,20,.08);pointer-events:none}          /* light veil: the cosmos stays bright */
#mk-bg .cs-vig{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 30% 26% at 50% 48%,rgba(3,5,20,.28) 0,rgba(3,5,20,0) 100%)}    /* softly dims the very centre only */

/* hero copy stays readable on top of the sun and planets */
.fx-hero .fx-copy{filter:drop-shadow(0 2px 14px rgba(2,4,20,.75))}
.in-hero .in-lead,.sx-hero .sx-lead,.sx-hero .sx-kick{text-shadow:0 2px 14px rgba(2,4,20,.8)}

/* ---------- hero: rocket panel removed; the sun system (bgart.js) is the hero picture ---------- */
.fx-stage{display:none!important}
@media(min-width:1101px){.fx-hero__in{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}