:root{
  --bg:#ffffff;
  --panel:#ffffff;
  --yellow:#4A90E2;
  --text:#213015;
  --muted:#647158;
  --line:#dfe8d2;
}
body{background:#fff;color:var(--text)}
header{background:#fffffff2;border-bottom-color:#e2ead8}
.logo b,.btn{background:#4A90E2;border-color:#4A90E2}
.logo b,.btn{color:#fff}
.btn:hover{background:#3478C5;box-shadow:0 12px 30px #4A90E233}
.btn-ghost{background:#fff;color:#57742d;border-color:#cddbb8}
.btn-ghost:hover{color:#3478C5;border-color:#4A90E2}
.eyebrow,h1 em,h2 em,.service-top,.service>a,.why-grid svg,.split-copy li svg,.compare article>span svg,.mini-grid svg,.faq summary svg,.contact-lines svg,.option-grid svg,.benefit-grid svg,.application-tags svg{color:#4A90E2}
.eyebrow i{background:#4A90E2}
.ticker{background:#4A90E2;color:#fff;border-color:#4A90E2}
.ticker i{background:#fff}
.service.featured{background:linear-gradient(145deg,#f8faF4,#edf3e4);border-color:#c8d9aa}
.service:hover,.compare article:hover{border-color:#4A90E2}
.visual-split,.applications,.projector,.service-benefits{background:#f4f8ed}
.showcase{background:#f8faf5}
.why-grid,.why-grid article,.compare article,.option-grid article,.benefit-grid article,form{background:#fff}
.pill{background:#4A90E21c;color:#3478C5}
.size-row div:hover{background:#4A90E2;color:#fff}
.size-row sup{color:#789f34}.size-row div:hover sup{color:#fff}
.steps article>div{background:linear-gradient(90deg,#4A90E2,#dfe8d2)}
.cta{background:#4A90E2;border-color:#4A90E2}
.cta h2,.cta p,.cta .eyebrow{color:#fff}
.cta .btn{background:#fff;border-color:#fff;color:#405D78}
.cta .btn-ghost{background:transparent;border-color:#fff;color:#fff}
.contact{background:#fff}
footer{background:#f4f8ed;border-color:#dce7cd}
.whatsapp{background:#4A90E2;color:#fff}
input:focus,select:focus,textarea:focus{border-color:#4A90E2}
.hero .eyebrow,.subhero .eyebrow{color:#d9efb2}
.hero .eyebrow i{background:#d9efb2}
@media(max-width:1050px){
  .nav nav{background:#fff;border-color:#D9E8F7}
  .nav nav.open>a:not(.btn):hover{background:#f1f6e9}
}

/* Strict white + #4A90E2 theme: no black or near-black UI surfaces */
.hero-shade{
  background:linear-gradient(90deg,#4A90E2f2 0%,#4A90E2bf 48%,#4A90E248 78%),
             linear-gradient(0deg,#ffffff 0%,transparent 34%)
}
.hero .btn-ghost{background:#ffffff26;color:#fff;border-color:#fff}
.image-panel span,.gallery-grid figcaption{
  background:#4A90E2e8;color:#fff;border-color:#fff
}
.show-grid article{
  background-image:linear-gradient(180deg,#4A90E215 12%,#4A90E2ed 100%),url(../media/hero-professional-blue.webp)!important;
  border-color:#cbdab2
}
.projector-card:after{
  background:linear-gradient(90deg,#4A90E210 5%,#4A90E2eb 62%)
}
.projector-copy,.projector-copy h2,.projector-copy p,.projector-copy .mini-grid span{color:#fff}
.subhero>div:first-of-type{
  background:linear-gradient(90deg,#4A90E2ed 0%,#4A90E2aa 58%,#4A90E240 100%),
             linear-gradient(0deg,#fff 0%,transparent 38%)
}
.service-page footer,footer{background:#f4f8ed;color:#213015}
.menu{color:#4A90E2}

body{font-family:"Manrope",Arial,Helvetica,sans-serif}
.logo b{clip-path:none;border-radius:10px;width:50px;font-size:.78rem;letter-spacing:-.02em}
.logo span{font-size:0}
.logo span::before{content:"LED RENTAL";font-size:.92rem;letter-spacing:.06em}
.logo small{font-size:0}
.logo small::after{content:"DUBAI";font-size:.6rem;letter-spacing:.2em}
.service-page .logo b{font-size:0}
.service-page .logo b::after{content:"LED";font-size:.78rem}
.service-page footer .legal span:first-child{font-size:0}
.service-page footer .legal span:first-child::after{content:"© 2026 LED Rental Dubai · Dubai, UAE";font-size:.9rem}
#about .eyebrow{font-size:0}
#about .eyebrow::after{content:"WHY LED RENTAL DUBAI";font-size:.78rem}
.contact-page-hero{padding:160px 0 75px;background:linear-gradient(135deg,#f4f8ed,#fff);border-bottom:1px solid #dfe8d2}
.contact-page-hero h1{color:#213015;font-size:clamp(2.8rem,5vw,5.2rem);margin-bottom:24px}
.contact-page-hero p:last-child{max-width:720px;font-size:1.08rem}
.service-page>header:not(.site-header){display:none}
.subpage-header{display:block}
@media(max-width:1050px){
  .subpage-header .menu{display:block}
  .subpage-header nav{display:none;position:absolute;top:78px;left:20px;right:20px;background:#fff;border:1px solid #D9E8F7;border-radius:14px;padding:18px;box-shadow:0 24px 70px #173d2450}
  .subpage-header nav.open{display:flex;flex-direction:column;align-items:stretch;gap:4px}
  .subpage-header nav.open>a:not(.btn){display:block;padding:11px 12px;border-radius:8px}
}
@media(max-width:720px){.subpage-header nav{top:68px;left:14px;right:14px}}

.site-header{height:auto;background:#fff}
.site-header .header-top{height:36px;background:#EAF4FF;border-bottom:1px solid #D9E8F7;color:#42532f;font-size:.72rem;font-weight:700;letter-spacing:.04em}
.header-top .shell{height:100%;display:flex;align-items:center;justify-content:space-between}
.header-top a{display:flex;align-items:center;gap:7px}
.header-top svg{width:15px;color:#4A90E2}
.site-header .nav{height:82px}
.site-header nav{gap:34px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.site-header nav>a,.services-menu summary{color:#26331c;transition:.2s}
.site-header nav>a:hover,.services-menu summary:hover{color:#4A90E2}
.services-menu{position:relative}
.services-menu summary{display:flex;align-items:center;gap:5px;cursor:pointer;list-style:none}
.services-menu summary::-webkit-details-marker{display:none}
.services-menu summary svg{width:15px}
.services-dropdown{display:none;position:absolute;top:calc(100% + 24px);left:-22px;width:270px;padding:12px;background:#fff;border:1px solid #D9E8F7;border-top:3px solid #4A90E2;border-radius:0 0 12px 12px;box-shadow:0 18px 45px #33451f26}
.services-menu[open] .services-dropdown,.services-menu:hover .services-dropdown{display:grid}
.services-dropdown a{padding:10px 12px;color:#344228;text-transform:none;letter-spacing:0;border-radius:7px}
.services-dropdown a:hover{background:#EAF4FF;color:#4A90E2}
.quote-link{color:#4A90E2!important}
.brand-logo{display:flex;align-items:center;flex:0 0 auto}
.brand-logo img{width:240px;height:auto;display:block}
footer .brand-logo img{width:220px}

@media(max-width:1050px){
 .site-header .header-top{display:none}
 .site-header .nav{height:68px}
 .site-header nav{top:68px;gap:4px;text-transform:none;letter-spacing:0}
 .site-header nav.open>a{display:block;padding:11px 12px}
 .site-header .services-menu{display:block}
 .services-menu summary{padding:11px 12px}
 .services-dropdown{position:static;width:100%;box-shadow:none;border:0;border-left:3px solid #4A90E2;border-radius:0;margin:2px 0 8px;padding:4px 8px}
 .services-menu:hover .services-dropdown{display:none}
 .services-menu[open] .services-dropdown{display:grid}
}
@media(max-width:720px){
 .brand-logo img{width:190px}
 footer .brand-logo img{width:205px}
}
@media(max-width:720px){
  .hero-shade{
    background:linear-gradient(90deg,#4A90E2ed,#4A90E270),
               linear-gradient(0deg,#fff 1%,transparent 48%)
  }
  .projector-card:after{
    background:linear-gradient(0deg,#4A90E2f4 32%,#4A90E235 78%)
  }
}

/* Remove the dark appearance created by the original night-event photography */
.hero{background:#fff}
.hero>img{opacity:.26;filter:brightness(1.28) saturate(.72)}
.hero-shade{
  background:linear-gradient(90deg,#fff 0%,#fffffff5 42%,#EAF4FFc9 72%,#4A90E266 100%)
}
.hero-copy h1{color:#284016}
.hero .lead{color:#5e7050}
.hero .eyebrow{color:#4A90E2}.hero .eyebrow i{background:#4A90E2}
.hero .trust{color:#34511f}
.hero .btn-ghost{background:#fff;color:#405D78;border-color:#4A90E2}
.show-grid article{
  background-image:linear-gradient(180deg,#4A90E290 0%,#4A90E2f5 100%),url(/media/hero-professional-blue.webp)!important
}
.projector-card{background:#4A90E2}
.projector-card>img{opacity:.42;filter:brightness(1.22) saturate(.65)}
.projector-card:after{background:linear-gradient(90deg,#ffffff1f 0%,#4A90E2e8 60%)}
.subhero{background:#fff}
.subhero>img{opacity:.34;filter:brightness(1.3) saturate(.65)}
.subhero>div:first-of-type{
  background:linear-gradient(90deg,#fff 0%,#fffffff0 45%,#4A90E2b8 100%)
}
.subhero-copy h1,.subhero-copy{color:#284016}
.subhero-copy>p:not(.eyebrow){color:#536a43}
.subhero .eyebrow{color:#4A90E2}
.gallery-grid figure,.service-gallery{background:#fff}
.gallery-grid figure{border:4px solid #eef4e5}
.gallery-grid img,.service-gallery img{filter:brightness(1.08) saturate(.8)}
@media(max-width:720px){
  .hero-shade{background:linear-gradient(90deg,#fffffff8,#EAF4FFbd)}
  .hero>img{opacity:.2}
  .projector-card:after{background:linear-gradient(0deg,#4A90E2f5 35%,#4A90E266 100%)}
  .subhero>div:first-of-type{background:linear-gradient(90deg,#fffffff5,#4A90E280)}
}
