/* ============================================================
   Emirates Pearl — Brand / Light Theme / WhatsApp V10
   Dark remains the default. Light uses only White + Navy + Gold.
   ============================================================ */

:root{
  --ep-logo-desktop-width:150px;
  --ep-logo-mobile-width:62px;
}

/* ---------------- Brand sizing ---------------- */
.site-header .brand{
  width:var(--ep-logo-desktop-width)!important;
  min-width:var(--ep-logo-desktop-width)!important;
}
.site-header .brand-logo-shell{
  width:var(--ep-logo-desktop-width)!important;
  max-width:var(--ep-logo-desktop-width)!important;
}
.site-header .brand-logo{
  width:100%!important;
  height:100%!important;
  inset:0!important;
  position:absolute!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
.footer-brand img{
  width:min(var(--ep-logo-desktop-width),180px)!important;
  height:auto!important;
  object-fit:contain!important;
}

/* ---------------- Floating WhatsApp ---------------- */
.floating-whatsapp{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:160;
  min-height:54px;
  padding:0 18px 0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  border-radius:999px;
  border:1px solid rgba(197,139,65,.55);
  background:#0b1f38;
  color:#fff;
  text-decoration:none;
  font-weight:800;
  font-size:13px;
  box-shadow:0 16px 38px rgba(4,18,31,.28);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.floating-whatsapp:hover{
  transform:translateY(-3px);
  border-color:#c58b41;
  box-shadow:0 20px 44px rgba(4,18,31,.34);
}
.floating-whatsapp svg{
  width:30px;
  height:30px;
  fill:none;
  stroke:#c58b41;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}
html[dir="rtl"] .floating-whatsapp{
  right:auto;
  left:22px;
  padding:0 13px 0 18px;
}

/* ============================================================
   LIGHT THEME
   ============================================================ */
html[data-theme="light"] body{
  background:#fff!important;
  color:#0b1f38!important;
}

/* Header */
html[data-theme="light"] .site-header,
html[data-theme="light"] .site-header.scrolled{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid rgba(11,31,56,.10)!important;
  box-shadow:0 12px 32px rgba(11,31,56,.08)!important;
}
html[data-theme="light"] .nav a,
html[data-theme="light"] .brand-copy,
html[data-theme="light"] .menu-btn,
html[data-theme="light"] .lang-btn{
  color:#0b1f38!important;
}
html[data-theme="light"] .lang-btn,
html[data-theme="light"] .menu-btn{
  border-color:rgba(11,31,56,.16)!important;
  background:rgba(11,31,56,.035)!important;
}
html[data-theme="light"] .mobile-panel{
  background:rgba(255,255,255,.985)!important;
}
html[data-theme="light"] .mobile-panel__nav a,
html[data-theme="light"] .mobile-panel__close,
html[data-theme="light"] .mobile-panel__brand{
  color:#0b1f38!important;
}
html[data-theme="light"] .mobile-panel__nav a{
  border-bottom-color:rgba(11,31,56,.10)!important;
}

/* White content surfaces */
html[data-theme="light"] .products-section,
html[data-theme="light"] .founders-section,
html[data-theme="light"] .partners-orbit-section,
html[data-theme="light"] .network-wrap,
html[data-theme="light"] .mobile-trust-rail{
  background:#fff!important;
  color:#0b1f38!important;
}
html[data-theme="light"] .products-section:before,
html[data-theme="light"] .founders-section:before,
html[data-theme="light"] .partners-orbit-section:before{
  opacity:.55!important;
}
html[data-theme="light"] .section-title,
html[data-theme="light"] .products-section .section-title,
html[data-theme="light"] .founders-section .section-title,
html[data-theme="light"] .partners-orbit-section .section-title{
  color:#0b1f38!important;
}
html[data-theme="light"] .section-copy,
html[data-theme="light"] .products-section .section-copy,
html[data-theme="light"] .founders-section .section-copy,
html[data-theme="light"] .partners-orbit-section .section-copy{
  color:rgba(11,31,56,.66)!important;
}
html[data-theme="light"] .kicker{
  color:#c58b41!important;
}

/* Cards */
html[data-theme="light"] .product-card,
html[data-theme="light"] .founder-card,
html[data-theme="light"] .mobile-trust-card{
  background:#fff!important;
  border-color:rgba(11,31,56,.12)!important;
  box-shadow:0 16px 42px rgba(11,31,56,.07)!important;
  color:#0b1f38!important;
}
html[data-theme="light"] .product-card:before,
html[data-theme="light"] .product-card:after{
  opacity:.45!important;
}
html[data-theme="light"] .product-name,
html[data-theme="light"] .founder-card h3,
html[data-theme="light"] .product-meta,
html[data-theme="light"] .product-link{
  color:#0b1f38!important;
}
html[data-theme="light"] .product-meta,
html[data-theme="light"] .product-cat{
  color:rgba(11,31,56,.62)!important;
}

/* Trust rail */
html[data-theme="light"] .mobile-trust-item strong{
  color:#0b1f38!important;
}
html[data-theme="light"] .mobile-trust-item>span:last-child{
  color:rgba(11,31,56,.58)!important;
}
html[data-theme="light"] .mobile-trust-icon{
  background:rgba(197,139,65,.08)!important;
  border-color:rgba(197,139,65,.24)!important;
  color:#c58b41!important;
}

/* Contact / content */
html[data-theme="light"] .content-section{
  background:#fff!important;
  color:#0b1f38!important;
}
html[data-theme="light"] .contact-details>a,
html[data-theme="light"] .contact-details>div{
  color:#0b1f38!important;
  border-bottom-color:rgba(11,31,56,.11)!important;
}
html[data-theme="light"] .contact-details span{
  color:rgba(11,31,56,.52)!important;
}
html[data-theme="light"] .contact-form input,
html[data-theme="light"] .contact-form textarea,
html[data-theme="light"] .contact-form select{
  color:#0b1f38!important;
  background:#fff!important;
  border-color:rgba(11,31,56,.16)!important;
}

/* Page hero: white-led cinematic presentation rather than a dark block */
html[data-theme="light"] .page-hero{
  background:#fff!important;
  color:#0b1f38!important;
}
html[data-theme="light"] .page-hero:before{
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,.72),rgba(255,255,255,.46)),
    var(--cms-page-bg,url('../assets/images/hero-world.jpg'))!important;
}
html[data-theme="light"] .page-hero h1{
  color:#0b1f38!important;
}
html[data-theme="light"] .page-hero p{
  color:rgba(11,31,56,.66)!important;
}

/* Home visual sections remain cinematic, but feel lighter. */
html[data-theme="light"] .hero-stage,
html[data-theme="light"] .showcase-stage{
  background:#fff!important;
}
html[data-theme="light"] .hero-bg:after{
  background:
    linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.62) 68%,rgba(255,255,255,.90))!important;
}
html[data-theme="light"] .hero-title,
html[data-theme="light"] .hero-desc{
  color:#0b1f38!important;
}
html[data-theme="light"] .hero-title .outline{
  color:#0b1f38!important;
  -webkit-text-stroke:0!important;
}
html[data-theme="light"] .hero-desc{
  color:rgba(11,31,56,.72)!important;
}
html[data-theme="light"] .hero-eyebrow{
  background:rgba(255,255,255,.74)!important;
  color:#c58b41!important;
}

/* Footer becomes white in light theme, with navy/gold identity. */
html[data-theme="light"] .site-footer{
  background:#fff!important;
  color:#0b1f38!important;
  border-top-color:rgba(11,31,56,.10)!important;
}
html[data-theme="light"] .site-footer a,
html[data-theme="light"] .footer-title,
html[data-theme="light"] .footer-bottom{
  color:#0b1f38!important;
}
html[data-theme="light"] .footer-brand p{
  color:rgba(11,31,56,.62)!important;
}

/* WhatsApp follows current brand theme */
html[data-theme="light"] .floating-whatsapp{
  background:#fff;
  color:#0b1f38;
  border-color:rgba(197,139,65,.65);
  box-shadow:0 16px 38px rgba(11,31,56,.14);
}

@media(max-width:720px){
  .site-header .brand,
  html[dir="rtl"] .site-header .brand{
    flex:0 0 var(--ep-logo-mobile-width)!important;
    width:var(--ep-logo-mobile-width)!important;
    min-width:var(--ep-logo-mobile-width)!important;
    height:56px!important;
  }
  .site-header .brand-logo-shell{
    width:var(--ep-logo-mobile-width)!important;
    max-width:var(--ep-logo-mobile-width)!important;
    height:56px!important;
    background:transparent!important;
  }
  .site-header .brand-logo{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    transform:none!important;
    inset:0!important;
  }

  .floating-whatsapp{
    width:54px;
    min-width:54px;
    height:54px;
    padding:0;
    right:14px;
    bottom:max(14px,env(safe-area-inset-bottom));
  }
  .floating-whatsapp span{display:none}
  .floating-whatsapp svg{width:31px;height:31px}
  html[dir="rtl"] .floating-whatsapp{
    right:auto;
    left:14px;
    padding:0;
  }
}