/* White theme: navy, black and dark grey. Loaded after styles.css and v2.css. */
:root{
  --bg:#FFFFFF;--bg-2:#F4F5F7;--surface:#FFFFFF;--surface-2:#EEF0F3;
  --line:rgba(16,24,40,.10);--line-2:rgba(16,24,40,.18);
  --text:#0B0E14;--muted:#3A3F47;--dim:#5E646E;
  --ember:#14213D;--ember-2:#1F3360;--ember-ink:#FFFFFF;
  --teal:#3A4A66;--danger:#B42318;
  --fire:#E8590C;--conc:#2F5BB7;--flood:#0E8A9A;
}
body{background:#fff;color:var(--text)}
.nav.is-scrolled{background:rgba(255,255,255,.92);border-color:var(--line)}
.brand__mark{background:#14213D;color:#fff}
.btn--primary{background:#14213D;color:#fff;box-shadow:0 8px 24px -12px rgba(20,33,61,.55)}
.btn--primary:hover{background:#0B0E14}
.btn--ghost{background:#fff;border-color:rgba(16,24,40,.25);color:#0B0E14}
.btn--ghost:hover{border-color:#14213D;color:#14213D}

/* Hero: image fades into white on the text side */
.hero__bg img{opacity:.9}
.hero--v2 .hero__bg::after,.hero__bg::after{background:linear-gradient(90deg,#fff 8%,rgba(255,255,255,.93) 40%,rgba(255,255,255,.35) 72%,rgba(255,255,255,.15)),linear-gradient(0deg,#fff 0%,transparent 26%)}
.hero__grid{opacity:.35}
.hero__scan{display:none}
.hero__title{color:#0B0E14}
.hero__title em{background:none;-webkit-background-clip:initial;background-clip:initial;color:#14213D}
.hero__sub{color:#3A3F47}
.eyebrow{background:rgba(255,255,255,.85);border-color:var(--line-2);color:#3A3F47}
.dot{background:#14213D;animation:none}
.peril-chips li{background:#fff;border-color:var(--line-2);color:#0B0E14}
.chain li{background:rgba(255,255,255,.94);border-color:var(--line-2);color:#0B0E14}
.chain .is-live{border-color:#14213D;background:#EEF1F7}
.scope__frame{border-color:rgba(20,33,61,.25);box-shadow:0 30px 70px -30px rgba(16,24,40,.45)}
.card-ev{background:#fff;box-shadow:0 24px 60px -30px rgba(16,24,40,.35)}
.chip{color:#14213D;border-color:rgba(20,33,61,.3)}
.ring{border-color:rgba(20,33,61,.4)}
.live .tick{border-color:#14213D;box-shadow:0 0 0 4px rgba(20,33,61,.12)}

/* Sections */
.section--alt{background:#F4F5F7}
.strip{background:#0B0E14;border-color:#0B0E14}
.strip span{color:#C9CED6}
.strip span::after{background:#fff}
.orbit,.ai{background:#fff}
.pilot{background:#F4F5F7}
.split__media::after{background:linear-gradient(0deg,rgba(11,14,20,.25),transparent 50%)}
.pillars__icon,.f4__icon,.mod__icon{background:#EEF1F7;border-color:rgba(20,33,61,.18)}
.f4--accent{border-color:#14213D;background:#fff}
.f4--accent .f4__icon{background:#14213D;border-color:#14213D}
.f4--accent .f4__icon svg{stroke:#fff}
.mod--fire,.mod--conc,.mod--flood{background:#fff}
.tag--now{color:#fff;background:#14213D;border-color:#14213D}
.tag--dev{color:#3A3F47;border-color:rgba(16,24,40,.3)}
.ai-box{fill:rgba(58,74,102,.08);stroke:#3A4A66}
.human{fill:rgba(20,33,61,.08);stroke:#14213D}
.slot{background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(16,24,40,.03) 10px 20px)}

/* Form */
input,select,textarea{background:#fff;border-color:rgba(16,24,40,.22);color:#0B0E14}
input:focus,select:focus,textarea:focus{border-color:#14213D;box-shadow:0 0 0 3px rgba(20,33,61,.14)}
.pill input:checked+span{background:#14213D;border-color:#14213D;color:#fff}
.success__icon{background:#EEF1F7;border-color:#14213D}
.success__icon svg{stroke:#14213D}
.footer{background:#0B0E14;color:#E6E8EC;border-color:#0B0E14}
.footer .brand__mark{background:#fff;color:#0B0E14}
.footer__tag,.footer__legal{color:#9AA1AC}
.footer__links a{color:#C9CED6}
.footer__links a:hover{color:#fff}
.footer__legal{border-color:rgba(255,255,255,.12)}
@media (max-width:900px){
  .hero--v2 .hero__bg::after,.hero__bg::after{background:linear-gradient(180deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.9) 60%,#fff 100%)}
}

/* Saudi Made mark: small fixed badge bottom-right on larger screens; sits in the footer on phones */
.ksa-fixed{position:fixed;right:18px;bottom:18px;z-index:40;display:flex;align-items:center;justify-content:center;padding:8px 10px;background:#fff;border:1px solid rgba(16,24,40,.14);border-radius:10px;box-shadow:0 10px 30px -14px rgba(16,24,40,.45);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.ksa-fixed:hover{transform:translateY(-2px);box-shadow:0 14px 34px -14px rgba(16,24,40,.5)}
.ksa-fixed img{display:block;height:54px;width:auto}
.ksa-footer{display:none}
@media (max-width:720px){
  .ksa-fixed{display:none}
  .footer__legal{position:relative;padding-right:72px}
  .ksa-footer{display:block;position:absolute;right:0;bottom:var(--space-5,32px);height:56px;width:auto;background:#fff;padding:5px 6px;border-radius:8px}
}
/* Hero chain chips: light in a little sooner */
.chain li:nth-child(1){animation-delay:1s}.chain li:nth-child(2){animation-delay:1.3s}.chain li:nth-child(3){animation-delay:1.6s}.chain li:nth-child(4){animation-delay:1.9s}
.scope .credit{color:#3A3F47;background:rgba(255,255,255,.75);display:inline-block;padding:2px 6px;border-radius:4px}

/* ---- Density pass: tighter sections, smaller blocks, laptop-friendly ---- */
:root{--text-2xl:clamp(1.6rem,1.1rem + 1.6vw,2.4rem);--text-lg:clamp(1.05rem,.95rem + .45vw,1.25rem)}
.section{padding-block:clamp(var(--space-10),5.5vw,var(--space-16))}
.sec-head{margin-bottom:clamp(var(--space-6),3vw,var(--space-10))}
.lead{margin-top:var(--space-3)}
.nav__links a{white-space:nowrap}
.hero{min-height:0;padding-block:calc(72px + var(--space-8)) var(--space-10)}
.hero--v2 .hero__title{font-size:clamp(2.2rem,0.8rem + 3.8vw,4.4rem)}
.hero__sub{font-size:var(--text-base)}
.strip{padding-block:var(--space-3)}
/* Problem blocks */
.m-card{padding:var(--space-5) var(--space-5) var(--space-5)}
.m-card h3{font-size:var(--text-base);margin-block:var(--space-2) var(--space-1)}
.m-card p{font-size:var(--text-sm);line-height:1.5}
.m-card__n{font-size:.68rem}
/* Platform cards: aligned */
.mod{padding:var(--space-5)}
.mod h3{font-size:var(--text-base);margin-block:var(--space-3) var(--space-1);min-height:2.5em;display:flex;align-items:flex-end}
.mod p{font-size:var(--text-sm);line-height:1.5}
.mod__icon{width:38px;height:38px}
.tag{white-space:nowrap}
.tag--road{color:#3A3F47;border-color:rgba(16,24,40,.3)}
/* How it works */
.flow4{gap:var(--space-3)}
.f4{padding:var(--space-5)}
.f4__icon{width:40px;height:40px;margin-top:var(--space-3);border-radius:10px}
.f4__icon svg{width:20px;height:20px}
.f4 h3{font-size:var(--text-base);margin-block:var(--space-3) var(--space-1)}
.f4 p{font-size:var(--text-sm);line-height:1.5}
.f4:not(:last-child)::after{right:calc(-1 * var(--space-3));width:var(--space-3)}
/* Desks / AI / pilot */
.desks{margin-top:var(--space-5)}
.desks li{padding-block:var(--space-3);font-size:var(--text-sm)}
.ai__inner{gap:var(--space-10)}
.benefits li{padding:var(--space-3) var(--space-5);font-size:var(--text-sm)}
.pilot__top{gap:var(--space-10)}
.partners{margin-top:var(--space-8)}
.ov{gap:var(--space-6)}
/* AI diagram */
.ai__diagram{padding:var(--space-5)}
.aiflow .flow path{stroke:#9AA3B5;stroke-width:1.5;stroke-dasharray:none;animation:none;fill:none}
.aiflow .flow .flow--out{stroke:#14213D}
.aiflow .dots circle{fill:#3A4A66}
.aiflow .dots .dot--out{fill:#14213D}
.aiflow .nodes circle{fill:#fff;stroke:#3A4A66;stroke-width:1.5}
.aiflow .outs circle{fill:#14213D;stroke:#14213D}
.aiflow .lbl{font-size:16px}
.aiflow .lbl--l{text-anchor:start;fill:#0B0E14;font-weight:700}
.aiflow .lbl--xs{font-size:12.5px}
.aiflow .ai-spark{fill:#14213D;transform-origin:240px 157px;animation:sparkPulse 2.4s ease-in-out infinite}
.aiflow .ai-spark--s{transform-origin:257px 149px;animation-delay:.6s}
.aiflow .lbl--ai{font-weight:800;font-size:18px;letter-spacing:.04em}
.aiflow .out-box{fill:#14213D}
.aiflow .lbl--out{fill:#fff;font-weight:700;font-size:15px}
@keyframes sparkPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.75}}
/* orbit layer tabs: show they are interactive */
.ov__tabs button{cursor:pointer;position:relative;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s,background .2s}
.ov__tabs button:hover{transform:translateY(-1px);box-shadow:0 6px 18px -10px rgba(11,14,20,.45);border-color:var(--c)}
.ov__tabs button:not([aria-selected=true])::before{animation:tabPulse 1.8s ease-out infinite}
.ov__tabs button:nth-child(2):not([aria-selected=true])::before{animation-delay:.6s}
.ov__tabs button:nth-child(3):not([aria-selected=true])::before{animation-delay:1.2s}
.ov__tabs button:not([aria-selected=true])::after{content:"→";position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.85rem;color:var(--c);opacity:.7;animation:tabNudge 1.8s ease-in-out infinite}
.ov__tabs button:nth-child(2)::after{animation-delay:.6s}.ov__tabs button:nth-child(3)::after{animation-delay:1.2s}
@keyframes tabPulse{0%{box-shadow:0 0 0 0 color-mix(in oklab,var(--c) 55%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
@keyframes tabNudge{0%,100%{transform:translate(0,-50%)}50%{transform:translate(4px,-50%)}}
@media (prefers-reduced-motion:reduce){.ov__tabs button::before,.ov__tabs button::after,.aiflow .ai-spark{animation:none}}
@media (max-width:640px){.ov__tabs button:not([aria-selected=true])::after{display:none}}
.ai__cap{margin:var(--space-3) 0 0;font-size:var(--text-xs);color:#5E646E;text-align:center}
@media (prefers-reduced-motion:reduce){.aiflow .dots{display:none}}
@media (max-width:900px){
  .mod h3{min-height:0;display:block}
}

/* ---- Compact pass for tablets and phones ---- */
@media (max-width:900px){
  .section{padding-block:var(--space-10)}
  .sec-head{margin-bottom:var(--space-6)}
  .h2{font-size:clamp(1.5rem,1.2rem + 1.6vw,2rem)}
  .hero{padding-block:calc(68px + var(--space-6)) var(--space-8)}
  .hero--v2 .hero__inner{gap:var(--space-8)}
  .mods{gap:var(--space-3)}
  .mod{padding:var(--space-4)}
  .mod{display:grid;grid-template-columns:1fr auto;column-gap:var(--space-3);align-items:start}
  .mod__top{grid-column:2;grid-row:1}
  .mod__icon{display:none}
  .mod h3{grid-column:1;grid-row:1;margin-top:0;min-height:0;display:block}
  .mod p{grid-column:1/-1;grid-row:2;margin-top:var(--space-1)}
  .flow4{gap:var(--space-3)}
  .f4{padding:var(--space-4)}
  .f4__icon{display:none}
  .f4 h3{margin-top:var(--space-2)}
  .ai__inner,.pilot__top{gap:var(--space-6)}
  .partners{margin-top:var(--space-6)}
  .split__media img{aspect-ratio:16/9;object-fit:cover;max-height:420px;width:100%}
  .ov-lbl{font-size:22px}
  .ov-lbl--dim{font-size:18px}
}
@media (max-width:640px){
  :root{--text-lg:1.05rem}
  .section{padding-block:var(--space-8)}
  .sec-head{margin-bottom:var(--space-5)}
  .lead{font-size:var(--text-sm)}
  .hero--v2 .hero__title{font-size:clamp(2rem,1.4rem + 4vw,2.6rem);margin-block:var(--space-4)}
  .hero__sub{font-size:var(--text-sm)}
  .hero__ctas{margin-top:var(--space-5)}
  .btn{padding-block:12px}
  .strip{padding-block:var(--space-2)}
  .strip span{font-size:var(--text-sm)}
  /* problem list: number and title on one line */
  .m-card{display:grid;grid-template-columns:auto 1fr;column-gap:var(--space-3);padding:var(--space-3) var(--space-4);align-items:baseline}
  .m-card h3{margin:0;font-size:var(--text-sm)}
  .m-card p{grid-column:2;margin:var(--space-1) 0 0;font-size:var(--text-xs);line-height:1.5}
  /* platform cards */
  .mod{padding:var(--space-3) var(--space-4)}
  .mod h3{font-size:var(--text-sm)}
  .mod p{font-size:var(--text-xs)}
  .tag{font-size:.66rem;padding:3px 8px}
  /* how it works: step number beside title */
  .f4{display:grid;grid-template-columns:auto 1fr;column-gap:var(--space-3);padding:var(--space-3) var(--space-4);align-items:baseline}
  .f4 h3{margin:0;font-size:var(--text-sm)}
  .f4 p{grid-column:2;margin:var(--space-1) 0 0;font-size:var(--text-xs);line-height:1.5}
  .ov__badge{font-size:.62rem}
  /* hero: shorter satellite frame and tighter chain chips */
  .scope__frame{aspect-ratio:4/3}
  .chain{gap:4px;margin-top:var(--space-2)}
  .chain li{padding:5px 4px;font-size:.64rem}
  .scope__credit,.scope figcaption{font-size:.62rem}
  /* orbit view: layer tabs in one row */
  .ov__tabs{flex-direction:row;gap:var(--space-2)}
  .ov__tabs button{flex:1 1 0;justify-content:center;padding:8px 4px;font-size:.76rem;gap:6px}
  .ov__tabs button::before{flex:none;width:8px;height:8px}
  .ov__panel{padding:var(--space-4)}
  .ov__tabs button{padding-block:10px}
  .ov__info h3{font-size:var(--text-lg)}
  .ov__info p,.desks span,.benefits li,.faq__list p{font-size:var(--text-sm)}
  .desks li{padding-block:var(--space-2)}
  .split{gap:var(--space-5)}
  .split__media img{aspect-ratio:16/10;object-fit:cover}
  .ai__diagram{padding:var(--space-3)}
  .badges li{font-size:var(--text-xs)}
  .benefits li{padding:var(--space-2) var(--space-4)}
  .partners__grid{gap:var(--space-2)}
  .slot{min-height:64px;font-size:var(--text-xs)}
  .form{padding:var(--space-4)}
  .form__grid{gap:var(--space-3)}
  .faq__list summary{font-size:var(--text-sm);padding:var(--space-3) var(--space-8) var(--space-3) 0}
  .footer{padding-block:var(--space-8) var(--space-6)}
  .footer__legal{margin-top:var(--space-6);padding-top:var(--space-4)}
}