/* SNOW Global – design system v3. Colours/fonts are variables at the top. */
:root{--ink:#050e2b;--indigo:#0c1f66;--royal:#1747c9;--gold:#e3a02b;--golddk:#9a6208;--paper:#f3f6fc;--tint:#e6edfa;--text:#050c24;--muted:#222e4b;--nav:76px;
--ease-out:cubic-bezier(.23,1,.32,1);--ease-io:cubic-bezier(.77,0,.175,1);--fd:Manrope,"Segoe UI",system-ui,sans-serif;--fb:Inter,system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:var(--nav);-webkit-text-size-adjust:100%}
body{margin:0;font:500 17px/1.68 var(--fb);color:var(--text);background:#fff;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overflow-x:hidden}
a,button,summary{touch-action:manipulation}
h1,h2,h3,h4{text-transform:uppercase}h1,h2,h3{font-family:var(--fd);font-weight:800;line-height:1.14;margin:0;letter-spacing:.02em;text-wrap:balance}h2{font-size:clamp(1.8rem,3.4vw,2.8rem);color:var(--ink)}h3{letter-spacing:.03em}p{text-wrap:pretty}
.wrap{max-width:1200px;margin:auto;padding:0 28px}.sec{padding:116px 0}.mist{background:linear-gradient(180deg,var(--tint),var(--paper))}
.rv{opacity:0;transform:translateY(14px);transition:opacity 700ms var(--ease-out),transform 700ms var(--ease-out);transition-delay:calc(var(--i,0)*60ms)}.rv.in{opacity:1;transform:none}
.rise{opacity:0;transform:perspective(1200px) rotateX(9deg) translateY(36px) scale(.97);transform-origin:50% 100%;transition:opacity 800ms var(--ease-out),transform 900ms var(--ease-out)}.rise.in{opacity:1;transform:none}
header{position:fixed;top:0;left:0;right:0;height:calc(var(--nav) + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(36px,env(safe-area-inset-right)) 0 max(36px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:50;transition:box-shadow 200ms ease}header.solid{box-shadow:0 8px 30px #050e2b33}
.logo img{height:54px;display:block}nav{display:flex;gap:26px;align-items:center}nav>a:not(.btn){position:relative;color:var(--indigo);text-decoration:none;font:700 .78rem var(--fb);letter-spacing:.06em;padding:8px 0}
nav>a:not(.btn):after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform 200ms var(--ease-out)}nav>a.active:after{transform:scaleX(1)}
#burger{display:none;background:none;border:2px solid var(--indigo);color:var(--indigo);padding:8px 18px;border-radius:999px;font:700 .8rem var(--fb);transition:transform 160ms var(--ease-out)}#burger:active{transform:scale(.97)}
.btn{display:inline-block;padding:15px 30px;border:2px solid var(--gold);border-radius:999px;background:var(--gold);color:var(--ink)!important;font:700 .86rem var(--fb);letter-spacing:.03em;text-decoration:none;cursor:pointer;transition:transform 160ms var(--ease-out),background-color 160ms ease,color 160ms ease,border-color 160ms ease}.btn:active{transform:scale(.97)}
.btn.ghost{background:transparent;color:#fff!important;border-color:#ffffffcc}nav .btn{padding:11px 22px}
.hero{position:relative;min-height:max(100vh,780px);min-height:max(100svh,780px);overflow:hidden;color:#fff;background:var(--ink)}#scene{position:absolute;inset:0;width:100%;height:100%}
.hero:before{content:"";position:absolute;inset:0 0 38% 0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#050e2bd9,#050e2b8c 55%,transparent)}.hin{position:relative;z-index:2;max-width:1200px;margin:auto;padding:calc(var(--nav) + 84px) 28px 0}.tag{margin:0 0 22px;font:700 .92rem var(--fb);letter-spacing:.22em;color:var(--gold)}
.hero h1{font-size:clamp(1.85rem,3.7vw,3.3rem);max-width:900px;max-width:880px;color:#fff}
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.12em}.w span{display:inline-block;transform:translateY(105%);transition:transform 900ms var(--ease-out);transition-delay:calc(var(--i)*70ms)}.ready .w span{transform:none}
.sub{max-width:560px;font-size:1.15rem;color:#f1f5ff;margin:22px 0 0;font-weight:500}.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.sail{animation:sail linear infinite}.glint{animation:glint 2.8s var(--ease-io) infinite;transform-box:fill-box;transform-origin:center}@keyframes glint{50%{opacity:.15;transform:scaleX(.55)}}.foam{animation:wv linear infinite}@keyframes sail{from{transform:translateX(var(--a))}to{transform:translateX(var(--b))}}.bob{animation:bob 5s var(--ease-io) infinite;transform-box:fill-box;transform-origin:50% 100%}@keyframes bob{50%{transform:translateY(4px) rotate(.7deg)}}.wave{animation:wv linear infinite}@keyframes wv{to{transform:translateX(-360px)}}
/* section-to-section transition: a row of container panels sweeps up, the page jumps behind, the panels leave upward */
#wipe{position:fixed;inset:0;z-index:80;display:flex;pointer-events:none;visibility:hidden}
#wipe i{flex:1;transform:translateY(101%);border-top:4px solid var(--gold);background-color:#16306b;background-image:repeating-linear-gradient(90deg,#0000004d 0 2px,transparent 2px 9px),linear-gradient(180deg,#ffffff14,#0000004d);box-shadow:inset -2px 0 0 #00000080,inset 2px 0 0 #00000040;will-change:transform}
#wipe i:nth-child(6n+1){background-color:#7c1d2b}#wipe i:nth-child(6n+2){background-color:#0f4c5c}#wipe i:nth-child(6n+3){background-color:#16306b}#wipe i:nth-child(6n+4){background-color:#b8741a}#wipe i:nth-child(6n+5){background-color:#25303f}#wipe i:nth-child(6n+6){background-color:#1d5c3a}
#wipe.cover,#wipe.leave{visibility:visible;pointer-events:all}
#wipe.cover i{transform:none;transition:transform 280ms var(--ease-io);transition-delay:calc(var(--k)*24ms)}
#wipe.leave i{transform:translateY(-101%);transition:transform 280ms var(--ease-io);transition-delay:calc(var(--k)*24ms)}
/* container strip dividers */
.xfer{position:relative;height:92px;overflow:hidden;background:linear-gradient(#030a1f,#0a1a55);border-top:1px solid #ffffff14}.belt{display:flex;gap:6px;width:max-content;position:absolute;bottom:16px;left:0}
.belt i{display:block;height:48px;border-radius:1px;background-image:linear-gradient(180deg,#ffffff2e 0 2px,transparent 2px),repeating-linear-gradient(90deg,#0000004d 0 2px,transparent 2px 7px);box-shadow:inset 0 -7px 0 #00000059,inset 2px 0 0 #00000066,inset -2px 0 0 #00000066,0 3px 6px #0008}.rail{position:absolute;left:0;right:0;bottom:9px;height:7px;background:linear-gradient(#5d6a8a,#222c4a)}
/* corridors */
.cor-sec{background:radial-gradient(1200px 600px at 80% 0,#17379a55,transparent 60%),linear-gradient(170deg,#091a55,#050e2b 70%);color:#fff}.cor-sec h2{color:#fff}.sec.cor-sec p{color:#d3def6}
.head{max-width:740px;margin:0 auto 64px;text-align:center}.head p{margin:18px 0 0;font-size:1.1rem}
.row{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center;margin-top:56px;perspective:1400px}.row.flip{grid-template-columns:1.2fr .8fr}.row.flip .txt{order:2}
.txt h3{font-size:clamp(1.35rem,2.2vw,1.85rem);color:#fff}.txt p{margin:16px 0 26px}
.mapbox{border-radius:28px;padding:10px;background:linear-gradient(160deg,#1c3f9e,#071445);box-shadow:0 40px 70px #00000066,inset 0 1px 0 #ffffff33;transform:rotateY(-6deg) rotateX(3deg);transition:transform 600ms var(--ease-out)}.flip .mapbox{transform:rotateY(6deg) rotateX(3deg)}
.mapbox svg{display:block;width:100%;height:auto;border-radius:20px;background:radial-gradient(circle at 50% 40%,#0b2272,#050f33)}
.land{fill:#5f84d8;opacity:.5}.hl{fill:#f2b341}
.route{fill:none;stroke-width:1.6;stroke-linecap:round}.route.in{stroke:#f2b341;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 3px #f2b341)}.route.out{stroke:#8fb2ff;stroke-dasharray:3 3;opacity:0;filter:drop-shadow(0 0 2px #8fb2ff)}
.dot{opacity:0;fill:#fff}.ring{fill:none;stroke:#8fb2ff;stroke-width:1.2;opacity:0}.halo{fill:#f2b341;opacity:.28;transform-box:fill-box;transform-origin:center;animation:halo 2.6s var(--ease-io) infinite}@keyframes halo{50%{transform:scale(1.7);opacity:.06}}
.go .route.in{stroke-dashoffset:0;transition:stroke-dashoffset 2200ms var(--ease-io);transition-delay:var(--d,0s)}.go .route.out{opacity:.95;transition:opacity 900ms ease;transition-delay:var(--d,0s)}.go .dot{opacity:1;transition:opacity 500ms ease;transition-delay:var(--d2,0s)}.go .ring{opacity:.9;transition:opacity 600ms ease;transition-delay:var(--d,0s)}
/* about */
.two{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center}.sec p{color:var(--muted)}.dark p{color:#c9d6f2}.two p{margin:18px 0}
.pillars{display:grid;gap:18px}.pillars>div{padding:26px 30px;border-radius:22px;background:linear-gradient(135deg,var(--indigo),var(--royal));color:#fff;box-shadow:0 26px 46px #0c1f6659}.pillars>div:nth-child(2){background:linear-gradient(135deg,#071a52,#0c1f66)}.pillars>div:nth-child(3){background:linear-gradient(135deg,#8a5a08,var(--gold))}
.pillars b{font:800 1.2rem var(--fd);letter-spacing:.06em;text-transform:uppercase}.pillars p{margin:6px 0 0;color:#e3ebfb}.pillars>div:nth-child(3) p,.pillars>div:nth-child(3) b{color:var(--ink)}
/* products */
.prod{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(230px,24vw,320px);gap:18px}.pc:nth-child(1),.pc:nth-child(10){grid-column:span 2}
.pc{position:relative;border-radius:22px;overflow:hidden;display:block;background:var(--indigo);box-shadow:0 22px 44px #0c1f6640;transition:transform 220ms var(--ease-out),box-shadow 220ms ease}.pc:active{transform:scale(.985)}
.im{position:absolute;inset:0;clip-path:inset(0 0 100% 0);transition:clip-path 900ms var(--ease-io);transition-delay:calc(var(--i,0)*70ms)}.im.in{clip-path:inset(0)}.im img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.08);transition:transform 1100ms var(--ease-out);transition-delay:calc(var(--i,0)*70ms)}.im.in img{transform:none}
.pc:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(5,14,43,.95));pointer-events:none}.pc h3{position:absolute;z-index:2;left:20px;right:20px;bottom:18px;color:#fff;font-size:.98rem;line-height:1.25;letter-spacing:.04em}
/* enquiry */
.tabs{position:relative;display:flex;justify-content:center;gap:60px;flex-wrap:wrap;margin:0 auto 44px;width:fit-content;max-width:100%}.tabs button{background:none;border:0;padding:8px 0 16px;cursor:pointer;font:800 1.1rem var(--fd);letter-spacing:.05em;text-transform:uppercase;color:#0c1f6659;text-align:center;transition:color 200ms ease}.tabs button.on{color:var(--ink)}.tabs small{display:block;font:700 .78rem var(--fb);letter-spacing:.06em;color:var(--golddk);margin-top:4px}
.ind{position:absolute;left:0;top:0;width:1px;height:3px;background:var(--gold);transform-origin:left;transition:transform 300ms var(--ease-io)}
#forms{max-width:900px;margin:auto;background:#fff;border-radius:34px;padding:56px;box-shadow:0 30px 80px #0c1f6633;border:1px solid #0c1f6622}#forms.sw>form{opacity:.5;filter:blur(2px)}#forms>form{transition:opacity 140ms ease,filter 140ms ease}
form{display:grid;grid-template-columns:1fr 1fr;gap:24px 22px}form[hidden]{display:none}.full{grid-column:1/-1}form h3{font-size:1.5rem;color:var(--ink)}form h3+p{margin:10px 0 0}
label{display:block;font:700 .8rem var(--fb);letter-spacing:.03em;color:var(--indigo)}label i{color:var(--golddk);font-style:normal}
input,select,textarea{width:100%;border:1px solid #0c1f6622;border-radius:14px;background:#0c1f6609;padding:13px 16px;margin-top:6px;font:500 16px var(--fb);color:var(--text);transition:background-color 160ms ease,border-color 160ms ease}input:focus,select:focus,textarea:focus{outline:0;border-color:var(--gold);background:#fff}input[type=file]{border:1px dashed #0c1f6666;background:transparent}textarea{resize:vertical}
.ph2{display:grid;grid-template-columns:118px 1fr;gap:10px}.hp{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}.hint{display:block;margin-top:6px;font-size:.82rem;color:var(--muted)}.msg{grid-column:1/-1;padding:16px 20px;border-radius:14px;font-weight:600}.msg.ok{background:#dcf2e4;color:#074d22}.msg.err{background:#fff0d6;color:#7a3d00}
.dark{background:linear-gradient(160deg,#0c1f66,#050e2b);color:#fff}.dark h2{color:#fff}.dark label{color:#bccdf0}.dark input,.dark textarea,.dark select{background:#ffffff14;color:#fff;border-color:#ffffff26}.dark input:focus,.dark textarea:focus{background:#ffffff26}.dark select option{color:#000}#contactForm form{grid-template-columns:1fr}
dl{margin:30px 0}dt{font:700 .8rem var(--fb);letter-spacing:.08em;color:var(--gold);margin-top:20px}dd{margin:4px 0 0;font:800 1.3rem var(--fd);color:#fff}
footer{background:#030a1f;color:#c9d6f2;padding:70px 0 0}.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1.4fr 1.1fr;gap:40px}.flogo{width:190px;background:#fff;padding:6px 10px;border-radius:12px;display:block;margin-bottom:16px}footer h4{font:700 .8rem var(--fb);letter-spacing:.12em;color:var(--gold);margin:0 0 14px}footer a{display:block;color:#c9d6f2;text-decoration:none;margin:5px 0;font-size:.95rem;transition:color 160ms ease}footer p{font-size:.92rem;margin:0;color:#c9d6f2}.two2{columns:2}.copy{text-align:center;font-size:.82rem;border-top:1px solid #ffffff1a;margin:50px 0 0;padding:22px calc(22px + env(safe-area-inset-bottom));color:#8fa1c8}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(hover:hover) and (pointer:fine){nav>a:not(.btn):hover:after{transform:scaleX(1)}.btn:hover{background-color:transparent;color:var(--gold)!important}.btn.ghost:hover{background-color:#fff;color:var(--indigo)!important}.pc:hover{box-shadow:0 34px 64px #0c1f6666}.pc:hover .im.in img{transform:scale(1.06)}.mapbox:hover{transform:none}footer a:hover{color:var(--gold)}.tabs button:not(.on):hover{color:var(--ink)}}
@media(max-width:1000px){.prod{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){body{font-size:16px}.sec{padding:76px 0}header{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}.logo img{height:46px}#burger{display:block}nav{position:fixed;inset:calc(var(--nav) + env(safe-area-inset-top)) 0 0 0;background:#fff;flex-direction:column;justify-content:center;gap:26px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),visibility 0s 200ms}nav.open{opacity:1;visibility:visible;transform:none;transition-delay:0s}nav>a:not(.btn){font-size:1rem}.hin{padding-top:calc(var(--nav) + 50px)}.row,.row.flip{grid-template-columns:1fr;gap:28px}.row.flip .txt{order:0}.mapbox,.flip .mapbox{transform:none}.two{grid-template-columns:1fr;gap:50px}#forms{padding:30px 20px;border-radius:26px}form{grid-template-columns:1fr}.tabs{gap:24px}.tabs button{font-size:.98rem}.fgrid{grid-template-columns:1fr 1fr}.cta .btn{flex:1;text-align:center}.xfer{height:76px}#scene{top:auto;bottom:0;height:58%;-webkit-mask-image:linear-gradient(transparent,#000 20%);mask-image:linear-gradient(transparent,#000 20%)}}
@media(max-width:560px){.prod{gap:12px;grid-auto-rows:200px}.pc h3{font-size:.92rem;left:12px;right:12px;bottom:12px}.fgrid{grid-template-columns:1fr}.tag{font-size:.78rem;letter-spacing:.16em}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.sail,.bob,.wave,.halo,.glint,.foam{animation:none}.rv,.rise{transform:none}.im{clip-path:none}.im img,.w span{transform:none}.ind,nav{transition-duration:0s}.route.in{stroke-dashoffset:0}.route.out,.dot,.ring{opacity:1}#wipe{display:none}}

dd a{color:inherit;text-decoration:none;border-bottom:1px solid #e3a02b99}footer p a{color:#c9d6f2}
.soc{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;border:1.5px solid #fff;background:#fff;color:#0c1f66;margin-top:6px;transition:transform 160ms var(--ease-out),background-color 160ms ease,color 160ms ease}.soc[hidden]{display:none}.soc svg{width:22px;height:22px}.soc:active{transform:scale(.94)}footer .soc{margin:14px 0 0;width:40px;height:40px}
@media(hover:hover) and (pointer:fine){.soc:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}}
/* maps v2 */
.mapbox{position:relative}.mapbox:after{content:"";position:absolute;inset:10px;border-radius:20px;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 55%,#030a1fcc 100%)}
.grat{stroke:#8fb2ff;stroke-width:.35;opacity:.14;fill:none}
.pill-bg{fill:#050e2b;fill-opacity:.82;stroke:#ffffff33;stroke-width:.6}.pill-bg.hub{stroke:#f2b341;stroke-width:.9}
.lbl{font:700 8px var(--fb);letter-spacing:.08em;fill:#fff;stroke:none;paint-order:normal}.lbl.hubt{fill:#ffd37a}
.ripple{fill:none;stroke:#f2b341;stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center;animation:rip 3.2s var(--ease-out) infinite}@keyframes rip{0%{transform:scale(.4);opacity:.8}100%{transform:scale(3.4);opacity:0}}
.legend{position:absolute;z-index:2;left:24px;bottom:22px;display:flex;gap:16px;flex-wrap:wrap;padding:8px 14px;border-radius:999px;background:#050e2bcc;border:1px solid #ffffff2e;font:700 .72rem var(--fb);letter-spacing:.06em;text-transform:uppercase;color:#dbe6ff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.legend i{display:inline-block;width:22px;height:0;border-top:2px solid #f2b341;vertical-align:middle;margin-right:8px;filter:drop-shadow(0 0 3px #f2b341)}.legend i.d{border-top:2px dashed #8fb2ff;filter:drop-shadow(0 0 3px #8fb2ff)}
@media(max-width:560px){.legend{left:14px;right:14px;bottom:14px;font-size:.62rem;gap:8px;justify-content:center}}
@media(prefers-reduced-motion:reduce){.ripple{animation:none}}
footer p a{display:inline;margin:0}footer .soc{display:inline-flex}
/* language switch */
.lang{order:1;display:flex;gap:2px;margin-inline-start:18px;padding:3px;border-radius:999px;border:1.5px solid #0c1f6633;background:#fff}
.lang button{border:0;background:none;padding:7px 12px;border-radius:999px;font:700 .76rem var(--fb);letter-spacing:.06em;color:var(--indigo);cursor:pointer;transition:background-color 160ms ease,color 160ms ease,transform 160ms var(--ease-out)}
.lang button:active{transform:scale(.95)}.lang button[aria-pressed=true]{background:var(--indigo);color:#fff}
#burger{order:2}
@media(hover:hover) and (pointer:fine){.lang button[aria-pressed=false]:hover{background:#0c1f661a}}
@media(max-width:900px){.lang{margin-inline-start:auto;margin-inline-end:10px}.lang button{padding:7px 10px}}
/* Arabic: right-to-left layout and a proper Arabic typeface. Letter-spacing must be off or Arabic letters stop joining. */
html[lang=ar]{--fd:"Noto Sans Arabic",Manrope,"Segoe UI",system-ui,sans-serif;--fb:"Noto Sans Arabic",Inter,"Segoe UI",system-ui,sans-serif}
html[lang=ar] *{letter-spacing:0!important}
html[lang=ar] body{line-height:1.85}html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3{line-height:1.4}
html[lang=ar] .lbl{font-weight:600}
[dir=rtl] .mapbox{transform:rotateY(6deg) rotateX(3deg)}[dir=rtl] .flip .mapbox{transform:rotateY(-6deg) rotateX(3deg)}
[dir=rtl] .legend{left:auto;right:24px}
[dir=rtl] nav>a:not(.btn):after{transform-origin:right}
a[href^="tel:"],a[href^="mailto:"],input[type=email],input[type=tel]{direction:ltr;unicode-bidi:isolate}
[dir=rtl] input[type=email],[dir=rtl] input[type=tel]{text-align:right}
@media(max-width:900px){[dir=rtl] .mapbox,[dir=rtl] .flip .mapbox{transform:none}}