/* DELTA V63 — final typography, desktop spacing, mobile navigation and footer */
@font-face{font-family:"DeltaText";src:url("../fonts/NotoSansArabic-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DeltaText";src:url("../fonts/NotoSansArabic-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"DeltaText";src:url("../fonts/NotoSansArabic-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"DeltaDisplay";src:url("../fonts/delta-display/NotoKufiArabic-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DeltaDisplay";src:url("../fonts/delta-display/NotoKufiArabic-Medium.ttf") format("truetype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"DeltaDisplay";src:url("../fonts/delta-display/NotoKufiArabic-Bold.ttf") format("truetype");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"DeltaDisplay";src:url("../fonts/delta-display/NotoKufiArabic-Black.ttf") format("truetype");font-weight:900;font-style:normal;font-display:swap}

:root{
  --delta-blue:#42c1ff;
  --delta-blue-2:#8ce7ff;
  --delta-blue-3:#0d8fff;
  --delta-bg:#071b2c;
  --delta-panel:#0a2337;
  --delta-line:rgba(124,218,255,.24);
  --delta-text:#effaff;
  --delta-muted:#a9c3d2;
  --delta-shadow:0 28px 80px rgba(0,10,22,.30);
}

html,body,button,input,textarea,select{font-family:"DeltaText",Tahoma,Arial,sans-serif!important}
body *{font-family:inherit!important}
body{font-size:15px!important;line-height:1.95!important;letter-spacing:0!important}

h1,h2,h3,h4,h5,h6,.header .links a,.btn,.hero-chip,.eyebrow,.site-credit{font-family:"DeltaDisplay","DeltaText",Tahoma,sans-serif!important}
h1,h2,h3,h4,h5,h6{font-weight:700!important;line-height:1.55!important;letter-spacing:-.018em!important}
.hero-v51 .hero-core h1,.page-hero h1,.detail-hero h1{font-weight:700!important}
p,li,label,input,textarea,select{font-weight:400!important}
strong,b{font-weight:700!important}

/* Wider, calmer desktop header */
.header.page{min-height:90px!important;background:rgba(5,20,33,.82)!important;border-bottom:1px solid rgba(126,216,255,.16)!important;backdrop-filter:blur(22px)!important}
.header.page .nav{width:min(1380px,calc(100% - 44px))!important;min-height:90px!important;gap:24px!important}
.header.page .logo{flex:0 0 auto!important}
.header.page .logo img{width:118px!important;height:78px!important;object-fit:contain!important;filter:brightness(1.12) saturate(1.18) drop-shadow(0 0 26px rgba(55,192,255,.34))!important}
.header.page .links{flex:1 1 auto!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:clamp(28px,3.4vw,58px)!important;min-width:0!important}
.header.page .links a{font-size:15px!important;font-weight:500!important;padding:20px 10px!important;color:#effaff!important;min-width:88px!important;text-align:center!important}
.header.page .head-actions{flex:0 0 auto!important;gap:9px!important}
.header.page .head-actions .btn{min-height:44px!important}
.header.page .btn.primary{padding-inline:18px!important}

/* Main hero: remove the old center rectangle, enlarge the supplied logo and lift the palette */
.hero-v51{background:
  radial-gradient(circle at 50% 30%,rgba(47,176,255,.23),transparent 29%),
  radial-gradient(circle at 8% 72%,rgba(50,127,255,.13),transparent 34%),
  linear-gradient(180deg,#071c30 0%,#061727 100%)!important;min-height:850px!important;padding-top:138px!important}
.hero-v51 .hero-bg{opacity:.57!important;filter:saturate(1.08) brightness(.90)!important}
.hero-v51 .hero-core{padding:24px 18px 18px!important;border:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}
.hero-v51 .hero-logo-stage{height:390px!important}
.hero-v51 .hero-logo{width:min(390px,88vw)!important;max-height:390px!important;object-fit:contain!important;filter:brightness(1.16) saturate(1.16) drop-shadow(0 0 38px rgba(52,191,255,.40))!important}
.hero-v51 .hero-core h1{font-size:clamp(34px,4vw,56px)!important;margin-top:6px!important}
.hero-v51 .hero-core p{font-size:16px!important;color:#c3deeb!important;max-width:720px!important}
.hero-v51 .slogan{font-size:13px!important;letter-spacing:3px!important;color:#7fe0ff!important}

/* Home domain cards — photographic/graphic backgrounds, visible through a refined overlay */
.hero-v51 .domain-card{min-height:170px!important;border-radius:24px!important;border:1px solid rgba(135,224,255,.24)!important;box-shadow:0 24px 60px rgba(0,0,0,.24)!important;background-color:#0b2439!important}
.hero-v51 .domain-card:before{background:linear-gradient(90deg,rgba(3,16,28,.78),rgba(5,28,45,.36) 60%,rgba(3,16,28,.20))!important}
.hero-v51 .domain-card b{font-size:19px!important}
.hero-v51 .domain-card small{font-size:10px!important;color:#b6e8f8!important;letter-spacing:1.8px!important}
.hero-v51 .domain-icon{background:rgba(4,28,46,.50)!important;border:1px solid rgba(163,232,255,.30)!important;color:#91e6ff!important}

/* Four main cards on the home page */
.domain-services-section{background:linear-gradient(180deg,#071b2d 0%,#081f33 55%,#071a2a 100%)!important}
.domain-showcase{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important}
.domain-feature{min-height:560px!important;height:560px!important;border-radius:30px!important;border:1px solid rgba(132,221,255,.26)!important;overflow:hidden!important;background-color:#0a2033!important;background-size:cover!important;background-position:center!important;box-shadow:var(--delta-shadow)!important;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease,background-size .5s ease!important}
.domain-feature[data-domain-panel="security"]{background-image:url('../images/domain-security-real.png')!important}
.domain-feature[data-domain-panel="energy"]{background-image:url('../images/domain-energy-real.png')!important}
.domain-feature[data-domain-panel="construction"]{background-image:url('../images/domain-construction-real.png')!important}
.domain-feature[data-domain-panel="business"]{background-image:url('../images/domain-business-real.png')!important}
.domain-feature:hover,.domain-feature.is-active{transform:translateY(-9px)!important;border-color:rgba(137,229,255,.55)!important;background-size:108%!important;box-shadow:0 40px 100px rgba(0,8,20,.42)!important}
.domain-feature-overlay{background:linear-gradient(180deg,rgba(3,17,29,.10) 0%,rgba(4,19,32,.27) 44%,rgba(3,15,27,.84) 100%)!important}
.domain-feature-content{inset:22px 20px 20px!important}
.domain-feature h3{font-size:27px!important;text-shadow:0 3px 25px rgba(0,0,0,.42)!important}
.domain-feature p{font-size:13.5px!important;color:#e0f2f8!important}
.domain-subitems{gap:9px!important}
.domain-subitems a{font-size:12.5px!important;padding:11px 13px!important;background:rgba(3,22,37,.60)!important;border-color:rgba(169,227,247,.18)!important}
.domain-subitems a:hover{background:rgba(12,93,139,.72)!important}

/* Page sections/cards */
.section{padding-block:110px!important}
.section-head h2{font-size:clamp(30px,4vw,46px)!important}
.section-head p{font-size:15px!important}
.service,.product-card,.info-card,.project,.media{border-radius:24px!important}
.service p,.product-card p,.info-card p,.project p{font-size:14px!important;line-height:2!important}

/* Brand section injected by CMS */
.brand-section{background:linear-gradient(180deg,#081e31,#071a2b)!important}
.brand-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important}
.brand-card{display:flex!important;flex-direction:column!important;justify-content:space-between!important;gap:10px!important;min-height:120px!important;padding:20px!important;border-radius:20px!important;border:1px solid rgba(120,216,255,.20)!important;background:linear-gradient(145deg,rgba(14,47,70,.92),rgba(6,26,43,.92))!important;color:#effaff!important;text-decoration:none!important;box-shadow:0 18px 48px rgba(0,10,22,.22)!important;transition:.28s ease!important}
.brand-card:hover{transform:translateY(-6px)!important;border-color:rgba(127,224,255,.50)!important;box-shadow:0 26px 60px rgba(0,10,22,.34)!important}
.brand-card b{font-family:"DeltaDisplay","DeltaText",sans-serif!important;font-size:16px!important;line-height:1.7!important}
.brand-card span{color:#8de5ff!important;font-size:12px!important}
.cms-external-link{display:inline-flex!important;align-items:center!important;justify-content:center!important;margin-top:10px!important;padding:10px 13px!important;border-radius:12px!important;background:rgba(39,168,236,.12)!important;border:1px solid rgba(103,215,255,.22)!important;color:#91e6ff!important;text-decoration:none!important;font-size:12px!important}
.cms-external-link:hover{background:rgba(35,165,234,.22)!important}

/* Social links: every app opens its own page in a new tab */
.footer-grid>div:last-child>a{display:flex!important;align-items:center!important;gap:8px!important;width:fit-content!important;padding:8px 10px!important;margin:2px 0!important;border-radius:12px!important;color:#dff7ff!important;background:rgba(56,178,239,.05)!important;border:1px solid transparent!important;transition:.22s ease!important}
.footer-grid>div:last-child>a:hover{border-color:rgba(124,220,255,.22)!important;background:rgba(56,178,239,.12)!important;transform:translateX(-2px)!important;color:#ffffff!important}

/* Footer on every page */
.footer{margin-top:auto!important;border-top:1px solid rgba(130,219,255,.15)!important;background:linear-gradient(180deg,#061522,#071b2b)!important}
.site-credit{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:8px!important;padding:18px 0 24px!important;color:#b9d1de!important;font-size:13px!important;text-align:center!important;line-height:2!important}
.site-credit .developer-mark{width:40px!important;height:40px!important;object-fit:contain!important;vertical-align:middle!important;filter:drop-shadow(0 0 15px rgba(73,203,255,.25))!important}
.site-credit a{color:#8de4ff!important;text-decoration:none!important;font-weight:700!important}
.site-credit a:hover{text-decoration:underline!important}

/* Sticky page layout so the credit stays at the bottom on short pages */
html,body{min-height:100%;background:var(--delta-bg)}
body{min-height:100vh;display:flex;flex-direction:column}
body>main{flex:1 0 auto}
body>footer{flex:0 0 auto}

/* Mobile: drawer menu + comfortable cards + no overflow */
@media(max-width:1020px){
  .header.page .nav{width:min(100% - 28px,1380px)!important;min-height:74px!important}
  .header.page .logo img{width:96px!important;height:66px!important}
  .header.page .links{display:none!important}
  .header.page .menu{display:grid!important;place-items:center!important;width:44px!important;height:44px!important;padding:0!important;font-size:20px!important;flex:0 0 44px!important}
  .domain-showcase{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .domain-feature{height:490px!important;min-height:490px!important}
  .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .mobile-open .header.page .links{display:flex!important;position:fixed!important;top:82px!important;right:14px!important;left:14px!important;flex-direction:column!important;gap:6px!important;padding:12px!important;background:rgba(6,22,35,.97)!important;border:1px solid rgba(127,221,255,.20)!important;border-radius:20px!important;box-shadow:0 30px 90px rgba(0,0,0,.46)!important;z-index:300!important;backdrop-filter:blur(18px)!important}
  .mobile-open .header.page .links a{width:100%!important;min-width:0!important;padding:13px 15px!important;text-align:right!important;border-radius:12px!important;font-size:15px!important}
  .mobile-open .header.page .links a:hover,.mobile-open .header.page .links a.active{background:rgba(76,193,255,.10)!important}
  .mobile-open{overflow:hidden!important}
}
@media(max-width:760px){
  .header.page .nav{min-height:70px!important;width:calc(100% - 24px)!important}
  .header.page .logo img{width:84px!important;height:58px!important}
  .header.page .head-actions{gap:5px!important}
  .header.page .head-actions .theme-toggle,.header.page .head-actions .primary{display:none!important}
  .hero-v51{min-height:760px!important;padding-top:105px!important}
  .hero-v51 .hero-core{padding-inline:8px!important}
  .hero-v51 .hero-logo-stage{height:280px!important}
  .hero-v51 .hero-logo{width:min(300px,86vw)!important;max-height:280px!important}
  .hero-v51 .hero-core h1{font-size:clamp(28px,8vw,39px)!important}
  .hero-v51 .hero-core p{font-size:14px!important;line-height:2!important}
  .hero-v51 .domain-card{min-height:120px!important}
  .domain-showcase{grid-template-columns:1fr!important;gap:14px!important}
  .domain-feature{height:390px!important;min-height:390px!important;border-radius:24px!important}
  .domain-feature h3{font-size:24px!important}
  .domain-feature p{font-size:12.5px!important}
  .domain-subitems a{font-size:12px!important;padding:10px 11px!important}
  .section{padding-block:76px!important}
  .page-hero,.detail-hero{padding:125px 0 65px!important;min-height:360px!important}
  .brand-grid{grid-template-columns:1fr!important}
  .footer-grid{grid-template-columns:1fr!important;gap:28px!important}
  .site-credit{padding:16px 10px 22px!important;gap:5px 7px!important;font-size:11.5px!important}
  .site-credit .developer-mark{width:34px!important;height:34px!important}
}

/* Gateway page uses the same footer treatment */
.gateway-footer{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:10px!important;text-align:center!important}
.gateway-credit{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:7px!important;font-family:"DeltaText",Tahoma,sans-serif!important}
.gateway-credit .gateway-developer-mark{width:40px!important;height:40px!important;object-fit:contain!important}
.gateway-credit a{color:#8de4ff!important;font-weight:700!important}
@media(max-width:760px){.gateway-credit{font-size:11.5px!important;gap:5px!important}.gateway-credit .gateway-developer-mark{width:34px!important;height:34px!important}}
