/* v6: How we work (layers, PM, 24h clock, loop) + Global (art map, globe) */
.ops { background: radial-gradient(70% 50% at 50% 0%, color-mix(in srgb, var(--night) 14%, transparent), transparent 70%); }
.ops-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 28px; align-items: start; }
.layers { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; position: relative; }
.layers::before { content: ""; position: absolute; inset-inline-start: 19px; top: 22px; bottom: 22px; width: 2px; background: linear-gradient(180deg, #d8ee73, var(--night), #5fd4b8, #9fb3cf); opacity: .7; }
.layer-row { display: grid; grid-template-columns: 40px 1fr; gap: 14px; align-items: start; background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 14px 16px 14px 10px; padding-inline-start: 10px; position: relative; }
.lnum { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-weight: 700; color: #1f292c; background: var(--lc, #d8ee73); position: relative; z-index: 1; box-shadow: 0 0 16px color-mix(in srgb, var(--lc, #d8ee73) 50%, transparent); }
.layer-row h3 { margin: 2px 0 2px; font-size: 17.5px; } .layer-row p { margin: 0; color: var(--muted); font-size: 14.5px; }
.lr-founder { --lc: #d8ee73; } .lr-orch { --lc: #b9a8ff; } .lr-teams { --lc: #7c8cff; } .lr-engines { --lc: #5fd4b8; } .lr-brain { --lc: #e09a63; } .lr-infra { --lc: #9fb3cf; }
.fx-on .layer-row.in .lnum { animation: glowpulse 3s ease-in-out infinite; }
@keyframes glowpulse { 50% { box-shadow: 0 0 26px var(--lc); } }
.pm-grid { display: grid; gap: 12px; margin-top: 56px; }
.pm { --c: var(--night); background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 18px 20px; }
.pm h3 { margin: 0 0 4px; font-size: 17.5px; } .pm p { margin: 0; color: var(--muted); font-size: 14.5px; }

.clock-wrap { display: grid; grid-template-columns: 300px 1fr 260px; gap: 28px; align-items: center; margin-top: 44px; padding: 26px; border-radius: 24px; background: linear-gradient(135deg, #10172a, #15233a); border: 1px solid #253555; color: #eef2f7; }
.clock-wrap .sub-h { margin-top: 0; } .clock-wrap .sub { color: #b8c4d6; margin-bottom: 14px; }
.clock { width: 100%; } .clock .face { fill: #0c1222; stroke: #253555; }
.clock .seg { fill: none; stroke-width: 16; stroke-linecap: butt; }
.clock .day { stroke: #d8ee73; } .clock .cap { stroke: #e09a63; } .clock .night { stroke: #7c8cff; } .clock .rep { stroke: #5fd4b8; }
.clock .watch { stroke: #5fd4b8; stroke-width: 3; stroke-dasharray: 2 6; opacity: .8; }
.clock .tick { stroke: #3a4b6d; stroke-width: 1.5; } .clock .hr { fill: #9fb0cc; font-size: 11px; font-family: inherit; direction: ltr; }
.clock .ev-dot { fill: #0c1222; stroke: #fff; stroke-width: 2.5; }
.clock .hand line { stroke: #fff; stroke-width: 3; stroke-linecap: round; } .clock .hand circle { fill: #fff; }
.clock .hand { transform-origin: 160px 160px; transform: rotate(var(--hand, 0deg)); }
.fx-on .clock .hand { animation: spinhand 24s linear infinite; } @keyframes spinhand { to { transform: rotate(360deg); } }
.clock .cl-l { fill: #fff; font-weight: 700; font-size: 18px; font-family: inherit; } .clock .cl-s { fill: #b8c4d6; font-size: 12px; font-family: inherit; }
.clock-rows { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.clock-rows li { display: grid; grid-template-columns: 116px 1fr; gap: 12px; align-items: baseline; }
.clock-rows time { font-weight: 700; font-size: 14px; direction: ltr; unicode-bidi: isolate; }
.cr0 time { color: #d8ee73; } .cr1 time { color: #e09a63; } .cr2 time { color: #9aa6ff; } .cr3 time { color: #5fd4b8; } .cr4 time { color: #5fd4b8; }
.clock-rows h4 { margin: 0; font-size: 15.5px; } .clock-rows p { margin: 0; color: #b8c4d6; font-size: 13.5px; }
.loop-art h4 { margin: 0 0 6px; text-align: center; color: #b8c4d6; font-weight: 600; }
.loop { width: 100%; } .loop .track { fill: none; stroke: #2b3d60; stroke-width: 2; }
.loop .runner { fill: none; stroke: #d8ee73; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 90 614; filter: drop-shadow(0 0 6px #d8ee73); transform-origin: 150px 150px; transform: rotate(-90deg); }
.fx-on .loop .runner { animation: run 8s linear infinite; } @keyframes run { to { stroke-dashoffset: -704; } }
.loop .ln circle { fill: #15233a; stroke: #3f5a8a; stroke-width: 1.5; } .loop .ln text { fill: #eef2f7; font-size: 10.5px; font-weight: 600; font-family: inherit; }
.fx-on .loop .ln circle { animation: lit 8s linear infinite; }
.loop .n0 circle { animation-delay: 0s; } .loop .n1 circle { animation-delay: 1s; } .loop .n2 circle { animation-delay: 2s; } .loop .n3 circle { animation-delay: 3s; }
.loop .n4 circle { animation-delay: 4s; } .loop .n5 circle { animation-delay: 5s; } .loop .n6 circle { animation-delay: 6s; } .loop .n7 circle { animation-delay: 7s; }
@keyframes lit { 0%, 12% { stroke: #d8ee73; fill: #2a3b1e; } 18%, 100% { stroke: #3f5a8a; fill: #15233a; } }
.loop .inf { fill: #d8ee73; font-size: 40px; font-weight: 700; font-family: inherit; }
@media (max-width: 980px) { .ops-grid, .clock-wrap { grid-template-columns: 1fr; } .pm-grid { margin-top: 0; } .clock-art, .loop-art { max-width: 300px; margin-inline: auto; } }

/* Global: globe + art map */
.glob-top { display: grid; grid-template-columns: 1.1fr 1fr; gap: 30px; align-items: center; }
.globe-box { aspect-ratio: 1; max-width: 460px; width: 100%; justify-self: center; position: relative; }
.globe-box::before { content: ""; position: absolute; inset: 6%; border-radius: 50%; background: radial-gradient(circle at 40% 35%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 65%); filter: blur(10px); }
#globe { width: 100%; height: 100%; display: block; position: relative; }
.map-box { --c: #d8ee73; margin-top: 26px; background: #0d1420; border: 1px solid #22314a; border-radius: 24px; padding: 18px 18px 12px; }
.worldmap { width: 100%; height: auto; display: block; direction: ltr; }
.worldmap .land path { fill: none; } .worldmap .m0 { stroke: #3c4d5c; } .worldmap .m1 { stroke: #d8ee73; filter: drop-shadow(0 0 3px #d8ee73); } .worldmap .m2 { stroke: #5fd4b8; } .worldmap .m3 { stroke: #e09a63; }
.worldmap .arc { fill: none; stroke-width: 1.4; stroke-dasharray: 600; stroke-dashoffset: 0; opacity: .85; }
.worldmap .arc.ring1 { stroke: #5fd4b8; } .worldmap .arc.ring2 { stroke: #e09a63; } .worldmap .arc.ring3 { stroke: #9aa6ff; }
.fx-on .worldmap .arc { stroke-dashoffset: 600; animation: maparc 5s ease-in-out infinite; }
.fx-on .worldmap .d1 { animation-delay: .5s; } .fx-on .worldmap .d2 { animation-delay: 1s; } .fx-on .worldmap .d3 { animation-delay: 1.5s; } .fx-on .worldmap .d4 { animation-delay: 2s; } .fx-on .worldmap .d5 { animation-delay: 2.5s; }
@keyframes maparc { 0% { stroke-dashoffset: 600; } 45%, 75% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -600; } }
.worldmap .tgt { stroke: #0d1420; stroke-width: 1.5; } .worldmap .tgt.ring1 { fill: #5fd4b8; } .worldmap .tgt.ring2 { fill: #e09a63; } .worldmap .tgt.ring3 { fill: #9aa6ff; }
.worldmap .home-dot { fill: #d8ee73; stroke: #0d1420; stroke-width: 2; }
.worldmap .home-pulse { fill: none; stroke: #d8ee73; stroke-width: 2; transform-box: fill-box; transform-origin: center; }
.fx-on .worldmap .home-pulse { animation: mpulse 2s ease-out infinite; } @keyframes mpulse { from { opacity: .9; transform: scale(.6); } to { opacity: 0; transform: scale(3); } }
.worldmap .maplbl rect { fill: rgba(13,20,32,.85); stroke: #2b3d60; } .worldmap .maplbl text { fill: #eef2f7; font-size: 11.5px; font-weight: 600; font-family: "Noto Sans Arabic", "Outfit", sans-serif; }
.worldmap .maplbl.ring1 rect { stroke: #d8ee73; } .worldmap .maplbl.ring1 text { fill: #d8ee73; }
.map-legend { list-style: none; padding: 0; margin: 10px 4px 0; display: flex; gap: 18px; flex-wrap: wrap; font-size: 13.5px; color: #b8c4d6; }
.map-legend .sw { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-inline-end: 7px; }
.sw.m0 { background: #3c4d5c; } .sw.m1 { background: #d8ee73; } .sw.m2 { background: #5fd4b8; } .sw.m3 { background: #e09a63; }
@media (max-width: 860px) { .glob-top { grid-template-columns: 1fr; } }