
:root{--bg:#050b16;--panel:#071426;--blue:#126bff;--blue2:#1d8cff;--text:#f8fbff;--muted:#aab7ca;--line:#17314f}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#030812;color:var(--text);line-height:1.55}.container{max-width:1220px;margin:auto;padding:0 22px}.topbar{position:sticky;top:0;z-index:20;background:rgba(3,8,18,.96);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(10px)}.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:86px}.brand{display:flex;flex-direction:column;text-decoration:none;color:white;font-weight:900;letter-spacing:.4px}.brand span:first-child{font-size:24px;line-height:1}.brand small{font-size:10px;color:#d9e4f5;margin-top:5px;letter-spacing:.8px}.menu{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.menu a{font-size:13px;text-transform:uppercase;color:white;text-decoration:none;font-weight:800;letter-spacing:.35px}.menu a:hover{color:var(--blue2)}.quote-btn,.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(135deg,#0964e8,#0f7cff);color:white;text-decoration:none;border:0;border-radius:4px;padding:14px 18px;font-weight:900;text-transform:uppercase;letter-spacing:.4px;box-shadow:0 10px 30px rgba(18,107,255,.22);cursor:pointer}.hero{background:#061120;padding:28px 0 42px;border-bottom:1px solid rgba(255,255,255,.08)}.hero-img{width:100%;border-radius:3px;display:block;box-shadow:0 20px 60px rgba(0,0,0,.4)}.intro{padding:48px 0 18px;text-align:center}.kicker{color:var(--blue2);text-transform:uppercase;font-weight:900;letter-spacing:1px;font-size:13px}.intro h1,.section-title{font-size:clamp(32px,5vw,58px);line-height:1.04;margin:10px 0 16px;text-transform:uppercase}.intro p{color:var(--muted);font-size:18px;max-width:820px;margin:0 auto 24px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:24px 0 58px}.card{position:relative;min-height:210px;border:1px solid rgba(255,255,255,.09);overflow:hidden;border-radius:8px;background:#08162a;text-decoration:none;color:white;box-shadow:0 18px 50px rgba(0,0,0,.25)} .card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85;transition:.35s}.card:hover img{transform:scale(1.05);opacity:.7}.card .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,6,15,.2),rgba(1,6,15,.96))}.card h3{position:absolute;left:18px;right:18px;bottom:46px;margin:0;font-size:21px;text-transform:uppercase;line-height:1.12}.card p{position:absolute;left:18px;right:18px;bottom:14px;margin:0;color:#bdd0ea;font-size:13px}.service-wrap{padding:22px 0 52px}.mockup{display:block;width:100%;height:auto;border:1px solid rgba(255,255,255,.08);box-shadow:0 24px 70px rgba(0,0,0,.45);background:#071426}.addon{padding:54px 0;border-top:1px solid rgba(255,255,255,.08)}.addon h2{font-size:clamp(28px,4vw,42px);text-transform:uppercase;margin:0 0 16px}.addon p{color:#c6d3e6;max-width:900px}.button-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}.supplier{background:#071426;border:1px solid var(--line);padding:20px;border-radius:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;color:white}.supplier strong{text-transform:uppercase}.supplier span{background:#0d67ee;padding:9px 12px;border-radius:4px;font-size:12px;font-weight:900;text-transform:uppercase}.solis{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:center;background:#071426;border:1px solid var(--line);border-radius:10px;padding:24px}.solis img{width:100%;border-radius:8px;background:white}.gallery-section{padding:56px 0;background:#07101f}.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.gallery-item{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:8px;border:1px solid rgba(255,255,255,.08);cursor:pointer;background:#111}.gallery-item img{width:100%;height:100%;object-fit:cover;transition:.35s}.gallery-item:hover img{transform:scale(1.06);opacity:.75}.gallery-item span{position:absolute;left:0;right:0;bottom:0;padding:30px 12px 12px;background:linear-gradient(transparent,rgba(0,0,0,.86));font-size:12px;font-weight:800}.contact{padding:56px 0;background:#030812}.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:30px}.contact-card,.form-card{background:#071426;border:1px solid var(--line);border-radius:10px;padding:26px}.field{display:grid;gap:7px;margin-bottom:13px}.field label{font-size:12px;text-transform:uppercase;color:#9eb4d4;font-weight:900}.field input,.field select,.field textarea{width:100%;padding:14px;border-radius:4px;border:1px solid #203b5d;background:#020813;color:white;font-size:15px}.field textarea{min-height:120px}.whatsapp{position:fixed;right:20px;bottom:20px;z-index:40;border-radius:999px;background:#12b857;color:white;text-decoration:none;padding:15px 18px;font-weight:900;box-shadow:0 12px 35px rgba(0,0,0,.35)}footer{border-top:1px solid rgba(255,255,255,.08);padding:28px 0;color:#9eb4d4;background:#020610}.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;z-index:100;padding:24px}.lightbox.open{display:flex}.lightbox img{max-width:95vw;max-height:88vh;border-radius:8px}.close{position:absolute;right:24px;top:18px;color:white;background:#126bff;border:0;border-radius:4px;font-size:26px;padding:4px 12px;cursor:pointer}.note{font-size:13px;color:#9fb2ce;margin-top:10px}@media(max-width:980px){.nav{align-items:flex-start;flex-direction:column;padding:14px 0}.menu{gap:12px}.cards{grid-template-columns:repeat(2,1fr)}.button-grid{grid-template-columns:1fr 1fr}.solis,.contact-grid{grid-template-columns:1fr}.gallery-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:620px){.container{padding:0 14px}.cards,.button-grid,.gallery-grid{grid-template-columns:1fr}.card{min-height:240px}.menu a{font-size:12px}.quote-btn{width:100%}.mockup{width:100%;}.whatsapp{left:14px;right:14px;text-align:center}.hero{padding-top:14px}}



.whatsapp{
position:fixed;
right:20px;
bottom:20px;
z-index:40;
border-radius:50%;
background:#25D366;
text-decoration:none;
width:56px;
height:56px;
padding:0;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 12px 35px rgba(0,0,0,.35);
}

.whatsapp img{
width:24px;
height:24px;
display:block;
}

.brand{
display:flex;
flex-direction:column;
text-decoration:none;
color:white;
font-weight:900;
letter-spacing:.4px;
max-width:110px;
}





@media(max-width:620px){


.whatsapp{
width:56px;
height:56px;
right:18px;
bottom:18px;
left:auto;
}
}


/* FORCE FIXES */
.brand{max-width:140px !important;width:140px !important;}

.brand small{font-size:9px !important;line-height:1.2 !important;}
.whatsapp{width:56px !important;height:56px !important;border-radius:50% !important;left:auto !important;right:20px !important;bottom:20px !important;}
.whatsapp img{width:24px !important;height:24px !important;}
@media(max-width:620px){
 .brand{max-width:120px !important;width:120px !important;}
 
}

/* FINAL ALL PAGES OVERRIDE */

.whatsapp{width:56px!important;height:56px!important;padding:0!important;left:auto!important;right:20px!important;bottom:20px!important;}
.whatsapp img{width:24px!important;height:24px!important;max-width:24px!important;max-height:24px!important;}
@media(max-width:768px){

.whatsapp{width:56px!important;height:56px!important;left:auto!important;right:18px!important;bottom:18px!important;}
.whatsapp img{width:24px!important;height:24px!important;}
}




/* SINGLE WHATSAPP RULE - CLEAN */
.whatsapp{
position:fixed !important;
right:18px !important;
bottom:18px !important;
width:56px !important;
height:56px !important;
padding:0 !important;
border-radius:50% !important;
background:#25D366 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:hidden !important;
z-index:99999 !important;
}

.whatsapp::before,
.whatsapp::after{
content:none !important;
display:none !important;
}

.whatsapp img{
width:30px !important;
height:30px !important;
display:block !important;
margin:0 !important;
}

@media(max-width:768px){
.whatsapp{
right:18px !important;
bottom:18px !important;
width:56px !important;
height:56px !important;
left:auto !important;
}
}


/* ABSOLUTE WHATSAPP ARROW KILL */
a.whatsapp,
a.whatsapp:link,
a.whatsapp:visited{
position:fixed !important;
right:20px !important;
bottom:20px !important;
left:auto !important;
width:58px !important;
height:58px !important;
min-width:58px !important;
min-height:58px !important;
max-width:58px !important;
max-height:58px !important;
padding:0 !important;
margin:0 !important;
border-radius:50% !important;
background:#25D366 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
overflow:hidden !important;
z-index:99999 !important;
box-shadow:0 8px 20px rgba(0,0,0,.25) !important;
text-decoration:none !important;
font-size:0 !important;
line-height:0 !important;
color:transparent !important;
text-indent:-9999px !important;
white-space:nowrap !important;
}

a.whatsapp::before,
a.whatsapp::after,
a.whatsapp *::before,
a.whatsapp *::after{
content:"" !important;
display:none !important;
visibility:hidden !important;
width:0 !important;
height:0 !important;
}

a.whatsapp img{
display:block !important;
width:32px !important;
height:32px !important;
min-width:32px !important;
min-height:32px !important;
max-width:32px !important;
max-height:32px !important;
margin:0 !important;
padding:0 !important;
object-fit:contain !important;
text-indent:0 !important;
}

@media(max-width:768px){
a.whatsapp,
a.whatsapp:link,
a.whatsapp:visited{
right:18px !important;
bottom:18px !important;
left:auto !important;
width:56px !important;
height:56px !important;
min-width:56px !important;
min-height:56px !important;
max-width:56px !important;
max-height:56px !important;
}
a.whatsapp img{
width:30px !important;
height:30px !important;
min-width:30px !important;
min-height:30px !important;
max-width:30px !important;
max-height:30px !important;
}
}


/* FINAL WHATSAPP SIZE LOCK */
.whatsapp,
.whatsapp:link,
.whatsapp:visited{
width:56px !important;
height:56px !important;
min-width:56px !important;
min-height:56px !important;
max-width:56px !important;
max-height:56px !important;
overflow:hidden !important;
}

.whatsapp img,
.whatsapp svg{
width:28px !important;
height:28px !important;
min-width:28px !important;
min-height:28px !important;
max-width:28px !important;
max-height:28px !important;
object-fit:contain !important;
}

@media(max-width:768px){
.whatsapp,
.whatsapp:link,
.whatsapp:visited{
width:56px !important;
height:56px !important;
min-width:56px !important;
min-height:56px !important;
max-width:56px !important;
max-height:56px !important;
}
.whatsapp img,
.whatsapp svg{
width:28px !important;
height:28px !important;
min-width:28px !important;
min-height:28px !important;
max-width:28px !important;
max-height:28px !important;
}
}

/* MYBUILDER + MOBILE HEADER FIX */
@media(max-width:980px){

.quote-btn{width:100%;}
}

.reviews-section{padding:60px 0;text-align:center;background:#071426;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.reviews-section p{max-width:800px;margin:0 auto 25px;color:#c6d3e6;font-size:18px}


/* ANDY - MOBILE WHATSAPP SHRINK ONLY */
@media(max-width:768px){

.whatsapp,
.whatsapp:link,
.whatsapp:visited{
width:46px !important;
height:46px !important;
min-width:46px !important;
min-height:46px !important;
max-width:46px !important;
max-height:46px !important;
right:18px !important;
bottom:18px !important;
left:auto !important;
}

.whatsapp img,
.whatsapp svg{
width:24px !important;
height:24px !important;
min-width:24px !important;
min-height:24px !important;
max-width:24px !important;
max-height:24px !important;
}

}






/* FINAL MOBILE HEADER FIX */
@media(max-width:980px){

.nav{
display:block !important;
text-align:center !important;
}

.brand{
display:block !important;
width:100% !important;
max-width:none !important;
margin:0 auto 20px auto !important;
text-align:center !important;
}

.brand-logo{
width:180px !important;
max-width:180px !important;
height:auto !important;
margin:0 auto !important;
display:block !important;
}

.menu{
display:block !important;
width:100% !important;
text-align:center !important;
}

.menu a{
display:block !important;
padding:8px 0 !important;
}

.quote-btn{
display:block !important;
width:100% !important;
margin-top:15px !important;
}
}
