/* ASAS 360° V11 — camera-led navigation through one continuous scene. */
:root{color-scheme:dark;--bg:#05080c;--ink:#f5f8fb;--muted:#c3cfda;--blue:#2b5a89;--line:#ffffff35;--ease:cubic-bezier(.2,.76,.16,1)}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0}
html{background:var(--bg);scrollbar-color:#365471 #071019}
body{overflow:hidden;background:var(--bg);color:var(--ink);font-family:'Manrope',Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,a{font:inherit}a{color:inherit}button{color:inherit}
::selection{background:#2b5a89;color:#fff}
:focus-visible{outline:2px solid #c7e6ff;outline-offset:4px}
.skip{position:fixed;z-index:100;top:-60px;left:14px;padding:10px 15px;border:1px solid #fff;background:#07111b;color:#fff;text-decoration:none}
.skip:focus{top:12px}
.camera-stage{--pan-x:0vw;--pan-y:0vh;--zoom:1.12;position:fixed;z-index:0;inset:-2%;overflow:hidden;pointer-events:none;background:#05080c}
.camera-master{position:absolute;inset:-6%;background:#07111c url('media/asas-service-panorama.webp') var(--scene-position,50%) center/auto 100% no-repeat;transform:translate3d(var(--pan-x),var(--pan-y),0) scale(var(--zoom));transition:transform 1.55s var(--ease),background-position 1.75s var(--ease);will-change:transform,background-position;filter:saturate(.72) brightness(.78)}
.camera-stage[data-scene="home"]{--scene-position:0%;--pan-x:2vw;--zoom:1.12}
.camera-stage[data-scene="solutions"]{--scene-position:21%;--pan-x:-3vw;--pan-y:1vh;--zoom:1.17}
.camera-stage[data-scene="overview"]{--scene-position:40%;--pan-x:2vw;--pan-y:-1vh;--zoom:1.14}
.camera-stage[data-scene="why"]{--scene-position:60%;--pan-x:-2vw;--pan-y:1vh;--zoom:1.17}
.camera-stage[data-scene="who"]{--scene-position:80%;--pan-x:2vw;--pan-y:-1vh;--zoom:1.18}
.camera-stage[data-scene="contact"]{--scene-position:100%;--pan-x:-2vw;--pan-y:1vh;--zoom:1.16}
.camera-vignette{position:absolute;inset:0;background:linear-gradient(90deg,#020407ed 0%,#020407bd 35%,#02040744 72%,#02040770 100%),linear-gradient(180deg,#02040798 0%,transparent 27%,#0204073b 61%,#020407e8 100%);transition:opacity .8s ease}
.camera-circuits{position:absolute;inset:0;width:100%;height:100%;opacity:.62;filter:drop-shadow(0 0 10px #93c8f42c)}
.camera-header{position:fixed;z-index:30;inset:0 0 auto;min-height:90px;padding:14px clamp(20px,4vw,68px);display:flex;align-items:center;justify-content:space-between;gap:22px;background:linear-gradient(180deg,#03060bd9,#03060b70 74%,transparent);border-bottom:1px solid #ffffff16}
.brand{display:flex;align-items:center;flex:0 0 auto;width:clamp(150px,15vw,210px);height:68px}
.brand img{display:block;width:100%;max-height:66px;object-fit:contain;object-position:left center}
.camera-nav{display:flex;justify-content:center;align-items:center;gap:clamp(11px,1.45vw,23px);white-space:nowrap}
.camera-nav a,.mobile-menu a{position:relative;text-decoration:none;color:#c9d5e0;font:700 10px/1.4 'Manrope',sans-serif;letter-spacing:.105em;transition:color .2s ease}
.camera-nav a:after{content:"";position:absolute;inset:auto 0 -9px;height:1px;background:linear-gradient(90deg,#2b5a89,#dceeff);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.camera-nav a:hover,.camera-nav a[aria-current="page"]{color:#fff}
.camera-nav a[aria-current="page"]:after{transform:scaleX(1)}
.header-tools{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.lang{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;box-sizing:border-box;padding:7px 12px;border:1px solid #ffffff47;border-radius:999px;background:#08111ca3;color:#eaf2fa;text-decoration:none;font-size:11px;font-weight:700;white-space:nowrap;transition:border-color .2s ease,background .2s ease,color .2s ease}.lang:hover{border-color:#9bd3ff;background:#102d4c;color:#fff}.lang .language-globe{width:18px;height:18px;flex:none;stroke:#b9d7ee;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}.lang:hover{color:#b9d7ee}
.menu-trigger{display:none;width:42px;height:42px;border:1px solid #ffffff47;border-radius:6px;background:#08111ca3;cursor:pointer;align-items:center;justify-content:center;gap:5px;flex-direction:column}
.menu-trigger span{display:block;width:17px;height:1px;background:#fff;transition:transform .2s ease}
.menu-trigger[aria-expanded="true"] span:first-child{transform:translateY(3px) rotate(45deg)}
.menu-trigger[aria-expanded="true"] span:last-child{transform:translateY(-3px) rotate(-45deg)}
.mobile-menu{position:fixed;z-index:29;top:78px;left:16px;right:16px;padding:10px;border:1px solid #ffffff30;border-radius:12px;background:#07111ded;backdrop-filter:blur(18px);box-shadow:0 22px 60px #0009}
.mobile-menu[hidden]{display:none}
.mobile-menu a{display:block;padding:14px 13px;border-bottom:1px solid #ffffff17;font-size:11px}
.mobile-menu a:last-child{border-bottom:0}
.camera-viewport{position:fixed;z-index:2;inset:0;overflow:hidden}
.camera-panel{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-start;padding:112px clamp(24px,8vw,125px) 100px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#5b7893 transparent;opacity:0;visibility:hidden;pointer-events:none;transform:translate3d(0,22px,0) scale(.986);transition:opacity .5s ease,visibility .5s ease,transform .8s var(--ease)}
.camera-panel.active{opacity:1;visibility:visible;pointer-events:auto;transform:translate3d(0,0,0) scale(1)}
.panel-content{position:relative;width:min(100%,960px);padding:clamp(25px,4vw,58px);border:1px solid #d8e7f21a;border-radius:4px;background:linear-gradient(120deg,#050a11d9 0%,#060a10a8 59%,#07111b52 100%);box-shadow:0 22px 80px #0005;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.home-content{max-width:760px;background:linear-gradient(105deg,#03060ce6 0%,#03060cb5 76%,transparent 100%);border-color:transparent;box-shadow:none;backdrop-filter:none;padding-left:0}
.kicker{display:flex;align-items:center;gap:11px;margin:0 0 22px;color:#b8d8f1;font:700 10px/1.6 'Manrope',sans-serif;letter-spacing:.17em;text-transform:uppercase}
.kicker>span{display:block;width:26px;height:1px;background:#a5d5fa;box-shadow:0 0 12px #a5d5fa80;flex:0 0 auto}
h1,h2,h3,p{margin-top:0}
.camera-panel h1,.camera-panel h2{margin-bottom:19px;color:#fff;font-family:'Saved By Zero','Manrope',sans-serif;font-size:clamp(38px,5.3vw,78px);font-weight:400;line-height:1.08;letter-spacing:-.045em;text-wrap:balance;text-shadow:0 8px 35px #0008}
.camera-panel h1 span,.camera-panel h2 span{color:#c8e4fb;text-shadow:0 0 28px #68a8d829}
.lead{max-width:660px;margin:0;color:#d0dbe5;font-size:clamp(14px,1.25vw,17px);line-height:1.85;text-shadow:0 2px 12px #0008}
.camera-actions,.panel-actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px}
.wide-content{max-width:1160px}
.solutions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:24px}
.solution-tile{min-height:58px;padding:10px 12px;display:grid;grid-template-columns:30px 1fr 23px;gap:8px;align-items:center;border:1px solid #c5d9eb27;border-radius:5px;background:linear-gradient(125deg,#0a1624d9,#101e2c9c);text-decoration:none;transition:transform .22s ease,border-color .22s ease,background .22s ease}
.solution-tile:hover{transform:translateY(-2px);border-color:#9ac9ed90;background:#132a40df}
.solution-no{font:700 9px 'Manrope',sans-serif;letter-spacing:.06em;color:#92bad9}
.solution-tile strong{font-size:12px;line-height:1.35;font-weight:700;color:#f4f7fb}
.tile-ico{width:22px;height:22px;display:grid;place-items:center;border:1px solid #a8d2f146;border-radius:50%;color:#b7dbf8}
.tile-ico svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.reasons-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:24px}
.reason{min-height:102px;padding:14px 16px;border:1px solid #ffffff22;border-radius:5px;background:#081522a6}
.reason>span,.purpose>span{color:#9dc9e9;font:700 9px 'Manrope',sans-serif;letter-spacing:.12em}
.reason h3{margin:9px 0 5px;font-size:13px;color:#fff}
.reason p,.purpose p{margin:0;color:#c5d1dc;font-size:11px;line-height:1.65}
.purpose-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:27px}
.purpose{min-height:93px;padding:14px;border-top:1px solid #94b7d451;background:#07111b99}
.purpose p{margin-top:10px}
.camera-footer{margin-top:25px;padding-top:17px;border-top:1px solid #ffffff24}
.camera-footer img{width:105px;height:auto;max-height:55px;object-fit:contain;object-position:left center}
.camera-footer p{margin:10px 0 3px;color:#e2ebf4;font-size:10px;letter-spacing:.035em}
.camera-footer small{color:#9eadbb;font-size:9px}
.camera-ui{position:fixed;z-index:35;right:clamp(18px,4vw,64px);bottom:29px;display:flex;align-items:center;gap:17px}
.scene-tally{display:flex;align-items:center;gap:7px;color:#d9e3ec;font:600 10px 'Manrope',sans-serif;letter-spacing:.11em}
#cameraIndex{font-size:15px;color:#fff}
.scene-tally .divider{color:#7d9bb5}
.scene-hint{padding-left:11px;margin-left:4px;border-left:1px solid #c5d8e532;color:#b2c2d1;font-size:8px;letter-spacing:.16em}
.scene-controls{display:flex;gap:7px}
.scene-controls button{width:39px;height:39px;display:grid;place-items:center;border:1px solid #ffffff65;border-radius:50%;background:#07111a9c;color:#fff;cursor:pointer;backdrop-filter:blur(10px);transition:background .2s ease,border-color .2s ease,transform .2s ease}
.scene-controls button:hover{background:#2b5a89;border-color:#c0e4ff;transform:translateY(-1px)}
.scene-controls svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.camera-pagebar{position:fixed;z-index:40;inset:auto 0 0;height:2px;background:#ffffff1a}
.camera-pagebar span{display:block;width:16.667%;height:100%;background:linear-gradient(90deg,#2b5a89,#d8edff);box-shadow:0 0 12px #8dc7f875;transition:width .65s var(--ease)}
html[dir="rtl"] body{font-family:'IBM Plex Sans Arabic',Arial,sans-serif}
html[dir="rtl"] .camera-header{direction:rtl}
html[dir="rtl"] .brand img{object-position:right center}
html[dir="rtl"] .camera-nav a,.mobile-menu a{letter-spacing:0}
html[dir="rtl"] .camera-panel{text-align:right}
html[dir="rtl"] .home-content{padding-left:clamp(25px,4vw,58px);padding-right:0;background:linear-gradient(255deg,#03060ce6 0%,#03060cb5 76%,transparent 100%)}
html[dir="rtl"] .camera-ui{right:auto;left:clamp(18px,4vw,64px)}
html[dir="rtl"] .scene-hint{padding-left:0;margin-left:0;border-left:0;padding-right:11px;margin-right:4px;border-right:1px solid #c5d8e532}
html[dir="rtl"] .camera-footer img{object-position:right center}
html[dir="rtl"] .camera-master{background-position:var(--scene-position,50%) center}
html[dir="rtl"] .scene-controls button:first-child svg{transform:scaleX(-1)}
html[dir="rtl"] .scene-controls button:last-child svg{transform:scaleX(-1)}
@media(max-width:1120px){
 .camera-header{min-height:78px;padding-inline:23px}
 .camera-nav{gap:12px}
 .camera-nav a{font-size:8px;letter-spacing:.07em}
 .brand{width:154px;height:62px}
 .camera-panel{padding-inline:5vw}
 .panel-content{max-width:860px}
}
@media(max-width:820px){
 .camera-header{padding:11px 18px}
 .camera-nav{display:none}
 .menu-trigger{display:flex}
 .camera-panel{padding:93px 20px 92px;align-items:flex-start}
 .panel-content{margin-block:auto;padding:24px 21px}
 .home-content{margin-top:auto;margin-bottom:auto;padding-inline:0;background:linear-gradient(100deg,#03060ce9,#03060cb4 84%,transparent)}
 .camera-panel h1,.camera-panel h2{font-size:clamp(36px,9vw,58px);line-height:1.14}
 .kicker{font-size:8px;letter-spacing:.11em;margin-bottom:17px}
 .lead{font-size:13px;line-height:1.75}
 .solutions-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:18px}
 .solution-tile{min-height:55px;padding:8px;grid-template-columns:25px 1fr 20px;gap:6px}
 .solution-tile strong{font-size:10px}
 .reasons-grid{gap:7px;margin-top:18px}
 .reason{min-height:93px;padding:11px}
 .reason h3{font-size:11px}
 .reason p,.purpose p{font-size:10px}
 .purpose-grid{gap:6px;margin-top:18px}
 .purpose{padding:10px 8px;min-height:103px}
 .camera-ui{right:16px;bottom:16px;gap:10px}
 html[dir="rtl"] .camera-ui{right:auto;left:16px}
 .scene-hint{display:none}
 .scene-controls button{width:35px;height:35px}
 .scene-tally{font-size:9px}
 #cameraIndex{font-size:13px}
 .camera-pagebar{height:3px}
}
@media(max-width:520px){
 .camera-stage[data-scene="home"]{--pan-x:1vw;--zoom:1.08}
 .camera-stage[data-scene="solutions"]{--scene-position:21%;--pan-x:-1vw;--pan-y:1vh;--zoom:1.08}
 .camera-stage[data-scene="overview"]{--scene-position:40%;--pan-x:1vw;--pan-y:-1vh;--zoom:1.08}
 .camera-stage[data-scene="why"]{--scene-position:60%;--pan-x:-1vw;--pan-y:1vh;--zoom:1.09}
 .camera-stage[data-scene="who"]{--scene-position:80%;--pan-x:1vw;--pan-y:-1vh;--zoom:1.09}
 .camera-stage[data-scene="contact"]{--scene-position:100%;--pan-x:-1vw;--pan-y:1vh;--zoom:1.08}
 .camera-vignette{background:linear-gradient(90deg,#020407e8,#0204077a 80%),linear-gradient(180deg,#02040795,transparent 28%,#02040770 68%,#020407ef)}
 .camera-header{min-height:70px;padding:9px 14px}
 .brand{width:150px;height:58px}
 .brand img{max-height:56px}
 .lang{min-height:32px;font-size:10px;padding:6px 10px;gap:6px}.lang .language-globe{width:17px;height:17px}
 .menu-trigger{width:39px;height:39px}
 .mobile-menu{top:68px;left:10px;right:10px}
 .camera-panel{padding:77px 12px 69px}
 .panel-content{padding:20px 16px}
 .home-content{padding-inline:0}
 .camera-panel h1,.camera-panel h2{font-size:clamp(34px,9vw,48px);letter-spacing:-.035em}
 .kicker{font-size:7px;gap:7px}
 .kicker>span{width:17px}
 .lead{font-size:12px}
 .camera-actions{gap:8px;margin-top:22px}
 .camera-actions .asas-btn{font-size:9px;padding-left:10px}
 .camera-actions .asas-btn__badge{width:24px;height:24px;flex-basis:24px}
 .solutions-grid{grid-template-columns:1fr 1fr}
 .camera-ui{bottom:12px;right:12px}
 html[dir="rtl"] .camera-ui{left:12px}
 .scene-controls{gap:5px}
 .scene-controls button{width:32px;height:32px}
}
/* Refine the Our Difference display heading and give the mobile header lockup more presence. */
.camera-panel#why h2{font-size:clamp(34px,4.8vw,70px)}
@media(max-width:820px){.camera-panel#why h2{font-size:clamp(32px,8.2vw,52px)}}
@media(max-width:520px){.camera-panel#why h2{font-size:clamp(30px,8.2vw,43px)}.brand-mark-glow{inset-inline-start:18px;width:35px;height:37px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.camera-master{transform:scale(1.06)!important}}

/* Timed header energy pulse: the original logo stays untouched; glow is masked from its approved shield art. */
.camera-header{isolation:isolate}
.brand{position:relative;z-index:1;overflow:visible}
.brand-mark-glow{position:absolute;inset-block-start:0;inset-inline-start:18px;width:37px;height:39px;z-index:2;pointer-events:none;opacity:0;background:linear-gradient(135deg,#61caff 0%,#a8e8ff 50%,#45b7f5 100%);transition:opacity .55s ease,filter .55s ease;filter:drop-shadow(0 0 2px #7edaff)}
.brand-power-glow{-webkit-mask:url("powerlines-mask.png") center/100% 100% no-repeat;mask:url("powerlines-mask.png") center/100% 100% no-repeat}
.brand-eagle-glow{-webkit-mask:url("eagle-mask.png") center/100% 100% no-repeat;mask:url("eagle-mask.png") center/100% 100% no-repeat;background:linear-gradient(135deg,#55c4ff 0%,#91ddff 48%,#35a9ee 100%)}
.brand-power-glow.is-lit{opacity:.96;filter:drop-shadow(0 0 3px #7edaff) drop-shadow(0 0 9px #36b8ff)}
.brand-eagle-glow.is-lit{opacity:1;filter:drop-shadow(0 0 4px #8fe1ff) drop-shadow(0 0 12px #47c0ff) drop-shadow(0 0 22px #168fd9)}
.header-energy-track{position:absolute;z-index:0;inset:auto 0 0;height:1px;overflow:visible;background:linear-gradient(90deg,transparent,#8dc9f522 13%,#8dc9f536 50%,#8dc9f522 87%,transparent);pointer-events:none}
.header-energy-spark{position:absolute;left:0;top:50%;width:8px;height:8px;border-radius:50%;opacity:0;background:radial-gradient(circle,#fff 0 17%,#dff5ff 28%,#65b9f6 58%,transparent 74%);box-shadow:0 0 7px 2px #91d4ff,0 0 18px 4px #398fd880;transform:translate3d(var(--spark-from,0),-50%,0);pointer-events:none}
.header-energy-track.is-running .header-energy-spark{opacity:1;animation:header-energy-travel 9s cubic-bezier(.4,.02,.52,.98) forwards}
@keyframes header-energy-travel{from{transform:translate3d(var(--spark-from),-50%,0)}to{transform:translate3d(var(--spark-to),-50%,0)}}
@media(max-width:520px){.brand-mark-glow{inset-inline-start:15px;width:31px;height:33px}}
@media(prefers-reduced-motion:reduce){.header-energy-spark{animation:none!important}.brand-mark-glow{transition:none!important}}

/* ASAS section transitions: a restrained silver-blue energy sweep and soft synthesized chime. */
.sound-toggle{width:39px;height:39px;display:grid;place-items:center;border:1px solid #ffffff55;border-radius:50%;background:#07111a9c;color:#eaf4fc;cursor:pointer;backdrop-filter:blur(10px);transition:background .22s ease,border-color .22s ease,transform .22s ease}
.sound-toggle:hover{background:#2b5a89;border-color:#c0e4ff;transform:translateY(-1px)}
.sound-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.sound-toggle .sound-off{display:none}
.sound-toggle[aria-pressed="false"] .sound-wave{display:none}
.sound-toggle[aria-pressed="false"] .sound-off{display:block}
body.is-scene-transitioning::after{content:"";position:fixed;z-index:25;top:-18vh;bottom:-18vh;left:0;width:min(24vw,260px);min-width:116px;pointer-events:none;opacity:0;mix-blend-mode:screen;background:linear-gradient(90deg,transparent 0%,#3d8bc41c 22%,#9dcdf642 44%,#f5fbffb8 50%,#a9d9ff5c 56%,#3d8bc41c 78%,transparent 100%);filter:blur(5px) drop-shadow(0 0 30px #82c5f05c);transform:translate3d(-135%,0,0) skewX(-13deg);animation:asasSceneSweepForward 760ms cubic-bezier(.2,.76,.16,1) both}
body.is-scene-transitioning[data-transition-direction="reverse"]::after{animation-name:asasSceneSweepReverse}
body.is-scene-transitioning .camera-panel.active .panel-content{animation:asasPanelArrive 520ms cubic-bezier(.2,.76,.16,1) both}
@keyframes asasSceneSweepForward{0%{opacity:0;transform:translate3d(-135%,0,0) skewX(-13deg)}22%{opacity:.62}55%{opacity:.3}100%{opacity:0;transform:translate3d(650%,0,0) skewX(-13deg)}}
@keyframes asasSceneSweepReverse{0%{opacity:0;transform:translate3d(650%,0,0) skewX(-13deg)}22%{opacity:.62}55%{opacity:.3}100%{opacity:0;transform:translate3d(-135%,0,0) skewX(-13deg)}}
@keyframes asasPanelArrive{0%{opacity:.55;transform:translate3d(0,12px,0) scale(.99)}100%{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@media(prefers-reduced-motion:reduce){body.is-scene-transitioning::after{animation:none;opacity:0}body.is-scene-transitioning .camera-panel.active .panel-content{animation:none}.sound-toggle{transition:none}}
\n

/* ASAS 360° cinematic first-entry loading screen. */
.asas-intro{position:fixed;z-index:1000;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 50% 43%,#122338 0%,#09131f 34%,#05080c 72%);color:#eaf4fc;opacity:1;visibility:visible;transition:opacity .72s cubic-bezier(.2,.76,.16,1),visibility .72s ease}
html:not(.camera-js) .asas-intro{display:none}
.asas-intro.is-finished{opacity:0;visibility:hidden;pointer-events:none}
.intro-atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:linear-gradient(115deg,transparent 20%,#9edcff08 48%,transparent 76%),linear-gradient(#8ab8da08 1px,transparent 1px),linear-gradient(90deg,#8ab8da08 1px,transparent 1px);background-size:auto,72px 72px,72px 72px;mask-image:radial-gradient(ellipse at center,#000 8%,transparent 78%)}
.intro-atmosphere span{position:absolute;display:block;border:1px solid #9bcff51c;border-radius:50%;transform:translate(-50%,-50%) rotateX(70deg);box-shadow:0 0 44px #83c7f40b,inset 0 0 26px #83c7f40b}
.intro-atmosphere span:nth-child(1){left:50%;top:47%;width:min(78vw,760px);height:min(78vw,760px)}
.intro-atmosphere span:nth-child(2){left:50%;top:47%;width:min(60vw,560px);height:min(60vw,560px)}
.intro-atmosphere span:nth-child(3){left:50%;top:47%;width:min(43vw,390px);height:min(43vw,390px);border-color:#d6efff20}
.intro-logo-stage{position:relative;z-index:1;display:grid;place-items:center;width:min(82vw,490px);min-height:190px;perspective:1100px;animation:introLogoEnter 1.1s cubic-bezier(.18,.78,.16,1) both}
.intro-logo-stage img{position:relative;z-index:1;display:block;width:100%;max-height:210px;object-fit:contain;filter:drop-shadow(0 18px 22px #000b) drop-shadow(0 0 13px #63bafa44);transform:rotateX(7deg) rotateY(-7deg) translateZ(24px);animation:introLogoFloat 3.4s ease-in-out 1.1s infinite alternate}
.intro-logo-halo{position:absolute;inset:16% 10%;border-radius:50%;background:radial-gradient(ellipse,#79caff2b 0%,#3989ca12 38%,transparent 72%);filter:blur(14px);transform:translateZ(-30px);animation:introHaloPulse 2.8s ease-in-out infinite alternate}
.intro-tagline{position:relative;z-index:1;margin:12px 18px 26px;color:#b4cbe0;font:600 10px/1.6 'Manrope','IBM Plex Sans Arabic',sans-serif;letter-spacing:.22em;text-align:center;text-shadow:0 0 20px #6bb4eb36;animation:introTextEnter .8s ease .25s both}
html[dir="rtl"] .intro-tagline{font-family:'IBM Plex Sans Arabic',sans-serif;letter-spacing:0;font-size:12px}
.intro-loader{position:relative;z-index:1;width:min(220px,52vw);height:2px;overflow:hidden;background:#dcecff20;box-shadow:0 0 14px #73c4ff1c}
.intro-loader span{display:block;width:36%;height:100%;background:linear-gradient(90deg,#78c9ff,#f3fbff,#72c3ff);box-shadow:0 0 12px #83ccffb0;animation:introLoading 1.45s cubic-bezier(.45,.05,.55,.95) infinite}
.intro-loading{position:relative;z-index:1;margin:12px 0 0;color:#8fa9bf;font:500 9px/1.5 'Manrope',sans-serif;letter-spacing:.19em;text-transform:uppercase;animation:introTextEnter .8s ease .4s both}
html[dir="rtl"] .intro-loading{font-family:'IBM Plex Sans Arabic',sans-serif;letter-spacing:0;font-size:11px;text-transform:none}
@keyframes introLogoEnter{0%{opacity:0;transform:translateY(22px) scale(.9) rotateX(8deg)}100%{opacity:1;transform:translateY(0) scale(1) rotateX(0)}}
@keyframes introLogoFloat{from{transform:rotateX(7deg) rotateY(-7deg) translate3d(0,0,24px)}to{transform:rotateX(3deg) rotateY(4deg) translate3d(0,-5px,34px)}}
@keyframes introHaloPulse{from{opacity:.55;transform:scale(.92)}to{opacity:1;transform:scale(1.08)}}
@keyframes introTextEnter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes introLoading{0%{transform:translateX(-120%)}100%{transform:translateX(390%)}}
html[dir="rtl"] .intro-loader span{animation-name:introLoadingRtl}
@keyframes introLoadingRtl{0%{transform:translateX(390%)}100%{transform:translateX(-120%)}}
@media(max-width:520px){.intro-logo-stage{width:min(84vw,380px);min-height:150px}.intro-logo-stage img{max-height:160px}.intro-tagline{font-size:8px;letter-spacing:.14em;margin:9px 16px 23px}.intro-atmosphere span:nth-child(1){width:94vw;height:94vw}.intro-atmosphere span:nth-child(2){width:73vw;height:73vw}.intro-atmosphere span:nth-child(3){width:52vw;height:52vw}}
@media(prefers-reduced-motion:reduce){.intro-logo-stage,.intro-logo-stage img,.intro-logo-halo,.intro-tagline,.intro-loading,.intro-loader span{animation-duration:.01ms!important;animation-iteration-count:1!important}.intro-loader span{width:100%;transform:none!important}}


/* Keep the intro as a fully isolated full-screen welcome sequence. */
html.asas-intro-active body>:not(#asasIntro){visibility:hidden!important}
.asas-intro{z-index:2147483647;width:100vw;height:100vh;height:100svh;min-height:100%;pointer-events:auto;isolation:isolate;background:#05080c;background:radial-gradient(ellipse at 50% 43%,#122338 0%,#09131f 34%,#05080c 72%)}
.intro-logo-stage{min-height:0;width:min(82vw,500px)}
.intro-logo-stage img{max-height:min(30vh,230px)}
.intro-loader span{width:100%;transform:scaleX(0);transform-origin:left;animation:introLoading 3s linear forwards}
html[dir="rtl"] .intro-loader span{transform-origin:right;animation-name:introLoading}
@keyframes introLoading{to{transform:scaleX(1)}}
@media(max-width:520px){.intro-logo-stage{width:min(86vw,390px);min-height:0}.intro-logo-stage img{max-height:min(25vh,180px)}}


/* Keep the complete welcome screen isolated until its three-second sequence ends. */
.asas-intro{transition:opacity .5s cubic-bezier(.2,.76,.16,1),visibility .5s ease}
.intro-loader span{animation-duration:2.5s}

/* Calm orbital motion around the ASAS 360° welcome mark */
.intro-logo-stage .intro-logo-halo{z-index:0}
.intro-orbits{position:absolute;z-index:1;left:50%;top:50%;width:148%;aspect-ratio:1.52;transform:translate(-50%,-50%);pointer-events:none}
.intro-orbit{position:absolute;left:50%;top:50%;display:block;border:1px solid #9dd9ff2b;border-radius:50%;box-shadow:0 0 18px #6fc2ff12,inset 0 0 12px #6fc2ff08;transform-style:preserve-3d;animation:introOrbitSpin 28s linear infinite}
.intro-orbit:nth-child(1){width:100%;height:100%;animation-duration:34s}
.intro-orbit:nth-child(2){width:79%;height:79%;border-color:#d9efff29;animation-duration:26s;animation-direction:reverse}
.intro-orbit:nth-child(3){width:59%;height:59%;border-color:#56a8e52b;animation-duration:20s}
.intro-orbit i{position:absolute;left:50%;top:-5px;display:block;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 32% 28%,#fff 0 12%,#c7e9ff 20%,#73b8ee 65%,#3879b5 100%);box-shadow:0 0 7px #b6e2ff,0 0 18px #5eaeed8a}
.intro-orbit:nth-child(2) i{width:7px;height:7px;top:-4px;background:radial-gradient(circle at 30% 25%,#fff 0 15%,#d9f3ff 24%,#a5c7df 72%);box-shadow:0 0 8px #d8f0ff}
.intro-orbit:nth-child(3) i{width:6px;height:6px;top:-3px;background:radial-gradient(circle at 30% 25%,#fff 0 15%,#91d6ff 25%,#327fbd 75%);box-shadow:0 0 7px #81c8ff}
@keyframes introOrbitSpin{from{transform:translate(-50%,-50%) rotateX(67deg) rotateZ(0deg)}to{transform:translate(-50%,-50%) rotateX(67deg) rotateZ(360deg)}}
.intro-logo-stage img{z-index:2}
@media(max-width:520px){.intro-orbits{width:142%;aspect-ratio:1.25}.intro-orbit:nth-child(1){width:100%;height:100%}.intro-orbit:nth-child(2){width:78%;height:78%}.intro-orbit:nth-child(3){width:56%;height:56%}}
@media(prefers-reduced-motion:reduce){.intro-orbit{animation:none!important}}