/* ===== V2 overrides ===== */
:root{--bg:#05080f;--bg-2:#090f1b;--surface:#0d1524;--fire:#ff8a3d;--conc:#c58bff;--flood:#4fb3ff;--ksa:#00a85a}

/* nav + saudi badge */
.nav__left{display:flex;align-items:center;gap:var(--space-4)}
.ksa-badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:5px var(--space-3) 5px 6px;border-radius:999px;border:1px solid rgba(0,168,90,.45);background:linear-gradient(90deg,rgba(0,108,53,.35),rgba(0,108,53,.08));white-space:nowrap}
.ksa-badge__icon{width:22px;height:22px;flex:none}
.ksa-badge__icon path{fill:var(--ksa)}
.ksa-badge__icon .tick{fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ksa-badge__txt{display:flex;flex-direction:column;line-height:1.1}
.ksa-badge__txt b{font-size:.72rem;font-weight:700;letter-spacing:.02em;color:#eafff3}
.ksa-badge img{height:30px;width:auto}

/* hero */
.hero--v2 .hero__bg img{opacity:.9;object-position:65% center}
.hero--v2 .hero__bg::after{background:linear-gradient(90deg,var(--bg) 5%,rgba(5,8,15,.86) 38%,rgba(5,8,15,.25) 70%,rgba(5,8,15,.4)),linear-gradient(0deg,var(--bg) 0%,transparent 28%)}
.hero--v2 .hero__inner{grid-template-columns:1.15fr .95fr}
.hero--v2 .hero__title{font-size:clamp(2.3rem,0.6rem + 4.4vw,5.2rem)}
.hero--v2 .hero__sub{max-width:44ch}
.peril-chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-8)}
.peril-chips li{font-size:var(--text-xs);font-weight:500;padding:6px var(--space-3);border-radius:999px;border:1px solid var(--line-2);background:rgba(5,8,15,.55);display:flex;align-items:center;gap:var(--space-2);backdrop-filter:blur(6px)}
.peril-chips li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--dim)}
.peril-chips .c-fire::before{background:var(--fire)}.peril-chips .c-conc::before{background:var(--conc)}.peril-chips .c-flood::before{background:var(--flood)}
.peril-chips .c-more{color:var(--muted)}.peril-chips .c-more::before{display:none}

/* scope */
.scope{margin:0;justify-self:end;width:min(100%,460px);position:relative}
.scope__frame{position:relative;aspect-ratio:1;border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(63,193,201,.35);box-shadow:0 40px 100px -30px rgba(0,0,0,.9),0 0 0 6px rgba(63,193,201,.05)}
.scope__frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.05);animation:zoomIn 2.4s var(--ease) both}
@keyframes zoomIn{from{transform:scale(1.25);filter:blur(4px) saturate(.6)}to{transform:none}}
.scope__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,8,15,.35),transparent 25%,transparent 70%,rgba(5,8,15,.55));pointer-events:none}
.scope__overlay{position:absolute;inset:0;width:100%;height:100%;opacity:0;animation:fadeIn .8s 1.8s forwards}
@keyframes fadeIn{to{opacity:1}}
.reticle{position:absolute;inset:14%;border:1px solid rgba(255,255,255,.18);border-radius:50%;pointer-events:none}
.reticle::before,.reticle::after{content:"";position:absolute;background:rgba(255,255,255,.25)}
.reticle::before{left:50%;top:-6%;bottom:-6%;width:1px}
.reticle::after{top:50%;left:-6%;right:-6%;height:1px}
.scope__hud{position:absolute;z-index:2;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;color:#dfe8f5;background:rgba(5,8,15,.6);padding:4px 8px;border-radius:6px;backdrop-filter:blur(4px);display:flex;align-items:center;gap:6px}
.scope__hud--tl{top:12px;left:12px}.scope__hud--tr{top:12px;right:12px}.scope__hud--bl{bottom:12px;left:12px}
.live{width:7px;height:7px;border-radius:50%;background:#ff4d4d;animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.25}}
.chain{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:var(--space-3)}
.chain li{font-size:.75rem;font-weight:700;padding:8px 10px;border-radius:10px;background:rgba(13,21,36,.85);border:1px solid var(--line-2);display:flex;flex-direction:column;gap:2px;opacity:.35;animation:chainOn .5s var(--ease) forwards}
.chain li span{font-family:var(--font-mono);font-size:.68rem;color:var(--teal);font-weight:400}
.chain li:nth-child(1){animation-delay:2.2s}.chain li:nth-child(2){animation-delay:2.6s}.chain li:nth-child(3){animation-delay:3s}.chain li:nth-child(4){animation-delay:3.4s}
.chain .is-live{border-color:var(--ember);background:rgba(242,165,65,.12)}
.chain .is-live span{color:var(--ember)}
@keyframes chainOn{to{opacity:1}}
.credit{margin-top:var(--space-2);font-size:.72rem;color:var(--dim)}

/* overlays shared */
.ov-fire{fill:rgba(255,138,61,.14);stroke:var(--fire);stroke-width:3}
.ov-yard{fill:rgba(255,138,61,.06);stroke:var(--fire);stroke-width:2;stroke-dasharray:8 6}
.ov-measure{stroke:#fff;stroke-width:2.5;stroke-dasharray:4 4}
.ov-conc{fill:rgba(197,139,255,.08);stroke:var(--conc);stroke-width:3;stroke-dasharray:10 8}
.ov-conc--in{fill:rgba(197,139,255,.14);stroke-dasharray:none;stroke-width:2}
.ov-pt{fill:var(--conc);stroke:#fff;stroke-width:2}
.ov-flood{fill:rgba(79,179,255,.22);stroke:var(--flood);stroke-width:2.5}
.ov-run{fill:none;stroke:var(--flood);stroke-width:4;stroke-dasharray:14 10;animation:dash 1.4s linear infinite}
.ov-lbl{font:700 22px var(--font-body);fill:#fff;paint-order:stroke;stroke:rgba(5,8,15,.85);stroke-width:6px}
.ov-lbl--dim{font-weight:500;font-size:19px;fill:#dfe8f5}
.ov-lbl--c{text-anchor:middle}

/* strip */
.strip{border-block:1px solid var(--line);background:var(--bg-2);overflow:hidden;padding-block:var(--space-4)}
.strip__track{display:flex;gap:var(--space-12);width:max-content;animation:marquee 40s linear infinite}
.strip span{font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:var(--space-12)}
.strip span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--ember)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* macro */
.macro{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.m-card{background:var(--bg);padding:var(--space-8);transition:background .3s}
.m-card:hover{background:var(--surface)}
.m-card__n{color:var(--ember)}
.m-card h3,.mod h3,.f4 h3{font-family:var(--font-body);font-weight:700;font-size:var(--text-lg);letter-spacing:-.01em;margin-block:var(--space-4) var(--space-2)}
.m-card p,.mod p,.f4 p{color:var(--muted)}

/* modules */
.mods{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}
.mod{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-8);overflow:hidden;transition:transform .3s var(--ease),border-color .3s}
.mod:hover{transform:translateY(-3px);border-color:var(--line-2)}
.mod::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--line-2)}
.mod--fire::before{background:var(--fire)}.mod--conc::before{background:var(--conc)}.mod--flood::before{background:var(--flood)}
.mod--fire,.mod--conc,.mod--flood{background:linear-gradient(180deg,rgba(255,255,255,.025),var(--surface))}
.mod__top{display:flex;justify-content:space-between;align-items:center}
.mod__icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.04);border:1px solid var(--line-2)}
.mod__icon svg{width:22px;height:22px;fill:none;stroke:var(--text);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mod--fire .mod__icon svg{stroke:var(--fire)}.mod--conc .mod__icon svg{stroke:var(--conc)}.mod--flood .mod__icon svg{stroke:var(--flood)}
.tag{font-size:.72rem;font-weight:700;letter-spacing:.04em;padding:4px 10px;border-radius:999px;border:1px solid}
.tag--now{color:var(--ember);border-color:rgba(242,165,65,.5);background:rgba(242,165,65,.1)}
.tag--dev{color:var(--teal);border-color:rgba(63,193,201,.45)}
.tag--road{color:var(--muted);border-color:var(--line-2);border-style:dashed}

/* orbit view */
.orbit{background:radial-gradient(ellipse at 20% 30%,rgba(63,193,201,.07),transparent 55%)}
.ov{display:grid;grid-template-columns:1.25fr .75fr;gap:var(--space-8);align-items:stretch}
.ov__stage{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line-2);aspect-ratio:1}
.ov__stage img{width:100%;height:100%;object-fit:cover}
.ov__svg{position:absolute;inset:0;width:100%;height:100%}
.ov__svg .L{opacity:0;transition:opacity .5s var(--ease)}
.ov__stage[data-layer=fire] .L-fire,.ov__stage[data-layer=conc] .L-conc,.ov__stage[data-layer=flood] .L-flood{opacity:1}
.ov__badge{position:absolute;left:12px;bottom:12px;font-size:.72rem;font-family:var(--font-mono);letter-spacing:.08em;background:rgba(5,8,15,.7);padding:5px 9px;border-radius:6px;color:#dfe8f5}
.ov__panel{display:flex;flex-direction:column;gap:var(--space-6);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-8)}
.ov__tabs{display:flex;flex-direction:column;gap:var(--space-2)}
.ov__tabs button{font:600 var(--text-sm) var(--font-body);color:var(--muted);text-align:left;padding:var(--space-3) var(--space-4);border-radius:12px;border:1px solid var(--line-2);background:transparent;cursor:pointer;display:flex;align-items:center;gap:var(--space-3);transition:all .2s}
.ov__tabs button::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor}
.ov__tabs .t-fire{--c:var(--fire)}.ov__tabs .t-conc{--c:var(--conc)}.ov__tabs .t-flood{--c:var(--flood)}
.ov__tabs button::before{background:var(--c)}
.ov__tabs button[aria-selected=true]{color:var(--text);border-color:var(--c);background:color-mix(in oklab,var(--c) 12%,transparent)}
.ov__tabs button:hover{color:var(--text)}
.ov__info h3{font-family:var(--font-display);font-size:var(--text-xl);font-weight:800}
.ov__info p{color:var(--muted);margin-top:var(--space-2)}
.ov__meta{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin:0;padding-top:var(--space-5);border-top:1px solid var(--line)}
.ov__meta dt{font-size:.72rem;font-family:var(--font-mono);letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
.ov__meta dd{margin:2px 0 0;font-size:var(--text-sm);font-weight:500}
.ov__panel .credit{margin-top:auto}

/* flow4 */
.flow4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);position:relative}
.f4{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-8) var(--space-6)}
.f4:not(:last-child)::after{content:"";position:absolute;right:calc(-1 * var(--space-4));top:50%;width:var(--space-4);height:1px;background:linear-gradient(90deg,var(--teal),var(--ember))}
.f4__n{color:var(--dim)}
.f4__icon{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;margin-top:var(--space-5);background:rgba(63,193,201,.1);border:1px solid rgba(63,193,201,.3)}
.f4__icon svg{width:26px;height:26px;fill:none;stroke:var(--teal);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.f4--accent{border-color:rgba(242,165,65,.45);background:linear-gradient(180deg,rgba(242,165,65,.08),var(--surface))}
.f4--accent .f4__icon{background:rgba(242,165,65,.12);border-color:rgba(242,165,65,.4)}
.f4--accent .f4__icon svg{stroke:var(--ember)}

/* desks */
.desks{display:grid;gap:0;margin-top:var(--space-8)}
.desks li{display:grid;grid-template-columns:200px 1fr;gap:var(--space-4);padding-block:var(--space-5);border-top:1px solid var(--line)}
.desks b{font-weight:700}
.desks span{color:var(--muted)}
#desks .split__media{aspect-ratio:4/3.6}
#desks .split__media img{object-position:center}

@media (max-width:1024px){
  .macro,.mods{grid-template-columns:1fr 1fr}
  .flow4{grid-template-columns:1fr 1fr}
  .f4::after{display:none}
  .ov{grid-template-columns:1fr}
}
@media (max-width:880px){
  .hero--v2 .hero__inner{grid-template-columns:1fr}
  .scope{justify-self:stretch;width:100%;max-width:520px}
  .desks li{grid-template-columns:1fr;gap:var(--space-1)}
}
@media (max-width:640px){
    .ksa-badge__txt b{white-space:nowrap;font-size:.66rem}
  .ksa-badge{padding:4px 8px 4px 4px;gap:6px}
  .ksa-badge__icon{width:18px;height:18px}
  .nav .btn--sm{white-space:nowrap;padding-inline:14px;font-size:.8rem}
  .brand__word{font-size:1.1rem}
  .nav__left{gap:var(--space-3)}
}
@media (max-width:560px){
  .macro,.mods,.flow4{grid-template-columns:1fr}
  .chain li{font-size:.68rem;padding:6px}
  .ov__panel{padding:var(--space-6)}
  .ov-lbl{font-size:28px}
}
@media (max-width:420px){
  .ksa-badge__txt b{white-space:normal;max-width:70px;line-height:1.05}
  .nav .btn--sm{font-size:.8rem;padding:var(--space-2) var(--space-3)}
}
@media (prefers-reduced-motion:reduce){
  .scope__overlay,.chain li{opacity:1}
}