:root{
--blue:#004aad;
--green:#28a745;
--dark:#0d1117;
--light:#f4f7f6;
--white:#fff;
}

/* RESET */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Poppins;
}

html,body{
overflow-x:hidden;
}

body{
background:var(--light);
color:#111;
}

/* NAVBAR */.navbar{
height:90px;   /* Increased */
padding:0 18px;
display:flex;
align-items:center;
justify-content:space-between;
background:white;
position:sticky;
top:0;
z-index:3000;
}
/* BIG BRAND HEADER */
.brand-header{
display:flex;
align-items:center;
gap:15px;
}

/* BIG LOGO */
.brand-logo{
height:85px;      /* Almost full navbar */
width:auto;
object-fit:contain;
display:block;
}

/* TEXT BLOCK */
.brand-text{
display:flex;
align-items:center;
gap:3px;
white-space:nowrap;
}

/* SMART */
.brand-smart,
.brand-solar{
font-size:240px;
font-weight:700;
}
.brand-smart{ color:#F36C21; }
.brand-solar{ color:#004aad; }
/* SOLUTIONS */
.brand-solutions{
font-size:18px;
color:#28a745;
margin-left:3px;
}
@media(max-width:768px){

.brand-logo{
height:60px;
}

.brand-smart,
.brand-solar{
font-size:19px;
}

.brand-solutions{
font-size:17px;
}

}
/* LOGO */
.logo{
font-size:22px;
font-weight:700;
color:var(--blue);
}
.logo span{
color:var(--green);
}
.navbar{
height:80px;
padding:0 2%;
display:flex;
align-items:center;
justify-content:space-between;
background:white;
position:sticky;
top:0;
z-index:3000;
}
/* NAV LINKS */
.nav-links{
display:flex;
gap:30px;
list-style:none;
}
.brand-header{
display:flex;
align-items:center;
gap:12px;   /* Logo ↔ Text spacing */
flex:1;
min-width:0;
}
.nav-links a{
text-decoration:none;
color:#333;
font-weight:600;
}

/* BURGER */
.burger{
display:none;
flex-direction:column;
cursor:pointer;
z-index:3000;
}
.burger div{
width:25px;
height:3px;
background:#111;
margin:4px;
border-radius:2px;
transition:.3s;
}
.burger{
margin-left:12px;
flex-shrink:0;
}
/* OVERLAY */
.menu-overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.45);
opacity:0;
visibility:hidden;
transition:.3s;
z-index:1500;
}
.menu-overlay.active{
opacity:1;
visibility:visible;
}

/* HERO (Use solar1 image) */
.hero{
height:90vh;
background:
linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,.65)),
url("solar1.png");
background-size:cover;
background-position:center;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
}

.hero h1{
font-size:3rem;
margin-bottom:20px;
}
.hero span{
color:var(--green);
}

/* BUTTONS */
.btn{
padding:14px 30px;
border-radius:6px;
text-decoration:none;
display:inline-block;
margin:10px;
font-weight:600;
}
.primary{
background:var(--green);
color:white;
}
.secondary{
border:2px solid white;
color:white;
}

/* SECTIONS */


.light{background:white}
.dark{background:var(--dark)}
.white{color:white}

/* GRID */
.grid-3{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
}

/* CARD */
.card{
background:white;
padding:35px;
border-radius:16px;
box-shadow:0 10px 25px rgba(0,0,0,.08);
text-align:center;
transition:.4s;
}
.card:hover{
transform:translateY(-8px);
}
.card i{
font-size:35px;
color:var(--blue);
margin-bottom:15px;
}

/* QUALITY */
.quality-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
}
.quality-card{
background:white;
border-radius:18px;
overflow:hidden;
color:black;
}
.quality-card img{
width:100%;
height:200px;
object-fit:cover;
background:#eee;
}

/* CONTACT */
.contact-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
}
.contact-form input,
.contact-form textarea{
width:100%;
padding:14px;
margin-bottom:15px;
border:1px solid #ddd;
border-radius:6px;
}

/* TESTIMONIAL */
.testimonial-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}
.testimonial{
background:white;
padding:30px;
border-radius:16px;
box-shadow:0 10px 25px rgba(0,0,0,.08);
}

/* NEWSLETTER */
.newsletter{
background:var(--blue);
color:white;
text-align:center;
padding:50px 20px;
}
.newsletter input{
padding:12px;
width:260px;
border:none;
border-radius:6px;
margin-right:10px;
}

/* FOOTER */


/* MOBILE */
@media(max-width:768px){

.hero h1{
font-size:2rem;
}

.contact-grid{
grid-template-columns:1fr;
}

/* SHOW BURGER */
.burger{
display:flex;
}

/* DRAWER MENU */
.nav-links{
position:fixed;
top:0;
right:-260px;
width:240px;
height:100vh;
background:white;
flex-direction:column;
padding:100px 25px;
gap:30px;
transition:.35s;
z-index:2000;
box-shadow:-5px 0 20px rgba(0,0,0,.2);
}

.nav-links.active{
right:0;
}

}

/* BURGER ANIMATION */
.burger.active div:nth-child(1){
transform: rotate(45deg) translate(5px,5px);
}
.burger.active div:nth-child(2){
opacity:0;
}
.burger.active div:nth-child(3){
transform: rotate(-45deg) translate(6px,-6px);
}
.about-container{
max-width:900px;
margin:auto;
}
/* ============================= */
/* ===== ABOUT SECTION FINAL ==== */
/* ============================= */

.about-section{
padding:90px 6%;
background:linear-gradient(180deg,#ffffff,#f6f9fc);
}

/* CONTAINER */
.about-container{
max-width:950px;
margin:auto;
}

/* TITLE */
.about-title{
font-size:42px;
font-weight:700;
margin-bottom:25px;
color:#0d1117;
text-align:center;
letter-spacing:-0.5px;
}

/* DESCRIPTION */
.about-desc{
font-size:18px;
line-height:1.8;
color:#444;
text-align:center;
margin-bottom:55px;
max-width:720px;
margin-left:auto;
margin-right:auto;
}

/* ================= */
/* CARDS GRID */
/* ================= */

.about-cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:32px;
}

/* ================= */
/* ABOUT CARD */
/* ================= */

.about-card{
background:white;
padding:32px 28px;
border-radius:20px;
box-shadow:0 15px 35px rgba(0,0,0,.06);
transition:all .35s ease;
position:relative;
overflow:hidden;
}

/* TOP PREMIUM ACCENT */
.about-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#004aad,#28a745);
}

/* HOVER EFFECT */
.about-card:hover{
transform:translateY(-10px);
box-shadow:0 28px 60px rgba(0,0,0,.12);
}

/* CARD TITLE */
.about-card h3{
font-size:22px;
margin-bottom:14px;
color:#004aad;
font-weight:600;
}

/* CARD TEXT */
.about-card p{
font-size:16px;
color:#555;
line-height:1.65;
}

/* ================= */
/* OPTIONAL ICON SPACE */
/* ================= */

.about-card i{
font-size:26px;
color:#28a745;
margin-bottom:12px;
display:block;
}

/* ================= */
/* MOBILE RESPONSIVE */
/* ================= */

@media(max-width:768px){

.about-section{
padding:70px 20px;
}

.about-title{
font-size:32px;
}

.about-desc{
font-size:16px;
margin-bottom:40px;
}

.about-card{
padding:26px 22px;
}

.about-card h3{
font-size:20px;
}

.about-card p{
font-size:15px;
}

}

/* EXTRA SMALL MOBILE */

@media(max-width:420px){

.about-title{
font-size:28px;
}

.about-desc{
font-size:15px;
}

}
/* ======================= */
/* SUBSIDY PROMO SECTION */
/* ======================= */

.subsidy-section{
padding:70px 6%;
background:#f6f9fc;
}

/* CARD */
.subsidy-card{
display:grid;
grid-template-columns:320px 1fr;
gap:40px;
align-items:center;

background:white;
padding:35px;
border-radius:22px;
box-shadow:0 20px 50px rgba(0,0,0,.08);
transition:.4s;
}

.subsidy-card:hover{
transform:translateY(-6px);
box-shadow:0 30px 60px rgba(0,0,0,.12);
}

/* IMAGE SQUARE */
.subsidy-img{
width:100%;
aspect-ratio:1/1;
overflow:hidden;
border-radius:18px;
}

.subsidy-img img{
width:100%;
height:100%;
object-fit:cover;
}

/* CONTENT */
.subsidy-content h2{
font-size:30px;
margin-bottom:15px;
color:#004aad;
}

.subsidy-content p{
font-size:17px;
line-height:1.7;
color:#444;
margin-bottom:20px;
}

/* BUTTON */
.subsidy-btn{
display:inline-block;
display: center;
padding:14px 28px;
background:linear-gradient(90deg,#004aad,#28a745);
color:white;
text-decoration:none;
border-radius:8px;
font-weight:600;
transition:.3s;
}
.subsidy-btn{
display:flex;
justify-content:center;
}
.subsidy-content{
text-align:center;
}
.subsidy-btn:hover{
transform:scale(1.05);
}

/* TAGS */
.subsidy-tags{
margin-top:20px;
font-size:14px;
color:#666;
line-height:1.6;
}

/* ======================= */
/* MOBILE */
/* ======================= */

@media(max-width:768px){

.subsidy-card{
grid-template-columns:1fr;
padding:25px;
}

.subsidy-content h2{
font-size:24px;
}

.subsidy-content p{
font-size:16px;
}

}
.subsidy-section{
padding:70px 6%;
background:#F4F7F6;
}
.subsidy-card{
max-width:900px;
margin:auto;

background:white;
padding:30px;
border-radius:22px;

border:1px solid #E5EAF0;
box-shadow:0 10px 30px rgba(0,0,0,.05);

transition:.3s;
}

.subsidy-card:hover{
box-shadow:0 20px 40px rgba(0,0,0,.08);
transform:translateY(-4px);
}
.subsidy-img{
width:100%;
aspect-ratio:1/1;
border-radius:18px;
overflow:hidden;

border:3px solid #1F4FA3;
padding:4px;
background:white;
}

.subsidy-img img{
width:100%;
height:100%;
object-fit:cover;
border-radius:14px;
}
.subsidy-content h2{
font-size:28px;
color:#1F4FA3;
margin-bottom:15px;
font-weight:700;
}
.subsidy-content p{
font-size:17px;
line-height:1.7;
color:#333;
margin-bottom:20px;
}
.subsidy-content b{
color:#28A745;
font-weight:700;
}
.subsidy-btn{
display:inline-block;

background:#1F4FA3;
color:white;

padding:14px 26px;
border-radius:10px;

text-decoration:none;
font-weight:600;
font-size:16px;

transition:.25s;
}
.subsidy-btn:hover{
background:#28A745;
}
.subsidy-tags{
margin-top:20px;
font-size:14px;
color:#666;
line-height:1.6;
}

@media(max-width:768px){

.subsidy-card{
padding:22px;
}

.subsidy-content h2{
font-size:24px;
}

.subsidy-content p{
font-size:16px;
}

}
.about-section{
padding:100px 6%;
background:linear-gradient(180deg,#f8fbff,#eef3f9);
}
.about-title{
font-size:44px;
font-weight:700;
text-align:center;
color:#0D1117;
margin-bottom:28px;
letter-spacing:-0.5px;
}
.about-desc{
font-size:18px;
line-height:1.9;
color:#4a5568;
text-align:center;
max-width:700px;
margin:auto;
margin-bottom:65px;
}
.about-cards{
display:grid;
grid-template-columns:1fr;
gap:35px;
}
.about-card{
background:white;

padding:34px 30px;
border-radius:24px;

border:1px solid #e6edf5;

box-shadow:
0 10px 30px rgba(0,0,0,.05),
0 2px 6px rgba(0,0,0,.04);

transition:all .35s ease;

position:relative;
overflow:hidden;
}
.about-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}
.about-card:hover{
transform:translateY(-6px);
box-shadow:
0 25px 55px rgba(0,0,0,.10),
0 5px 18px rgba(0,0,0,.08);
}
.about-card h3{
font-size:24px;
color:#1F4FA3;
margin-bottom:14px;
font-weight:700;
}
.about-card p{
font-size:17px;
color:#4a5568;
line-height:1.7;
}

.about-card::after{
content:"";
position:absolute;
top:-50%;
left:-50%;
width:200%;
height:200%;
background:radial-gradient(circle,rgba(255,255,255,.5),transparent 60%);
opacity:.2;
pointer-events:none;
}
@media(max-width:768px){

.about-section{
padding:80px 20px;
}

.about-title{
font-size:34px;
}

.about-desc{
font-size:16px;
}

.about-card{
padding:28px 24px;
}

.about-card h3{
font-size:22px;
}

.about-card p{
font-size:15.5px;
}

}

/* ===== QUALITY SECTION ===== */

.quality-section{
background:#020817;
padding:90px 6%;
}

.quality-title{
color:white;
font-size:40px;
font-weight:700;
margin-bottom:50px;
text-align:center;
}

/* GRID */
.quality-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:40px;
}

/* CARD */
.quality-card{
background:white;
border-radius:22px;
overflow:hidden;
cursor:pointer;

box-shadow:
0 15px 40px rgba(0,0,0,.25),
0 5px 18px rgba(0,0,0,.18);

transition:.4s;
position:relative;
}

.quality-card:hover{
transform:translateY(-10px);
box-shadow:
0 30px 70px rgba(0,0,0,.35),
0 10px 30px rgba(0,0,0,.25);
}

/* BRAND LINE */
.quality-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}

/* IMAGE */
.quality-card img{
width:100%;
height:220px;
object-fit:cover;
display:block;
}

/* CONTENT */
.quality-content{
padding:22px 24px 26px;
}

.quality-content h3{
font-size:22px;
font-weight:700;
color:#0D1117;
margin-bottom:10px;
}

.quality-content p{
font-size:16px;
color:#4a5568;
line-height:1.7;
}

/* MOBILE */
@media(max-width:768px){

.quality-section{
padding:70px 20px;
}
.quality-section{
background:#020817;
padding:90px 6%;
}

.quality-title{
color:#fff;
font-size:42px;
font-weight:700;
text-align:center;
margin-bottom:55px;
letter-spacing:.5px;
}
.quality-title{
font-size:30px;
}

.quality-card img{
height:200px;
}

}/* IMAGE POPUP */

.image-popup{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.9);
display:flex;
align-items:center;
justify-content:center;

opacity:0;
visibility:hidden;
transition:.3s;
z-index:5000;
}

.image-popup.active{
opacity:1;
visibility:visible;
}

.image-popup img{
max-width:92%;
max-height:90%;
border-radius:12px;
}

.popup-close{
position:absolute;
top:25px;
right:25px;
font-size:32px;
color:white;
cursor:pointer;
font-weight:700;
}
.quality-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:40px;
}
.quality-card{
background:#fff;
border-radius:24px;
overflow:hidden;
cursor:pointer;
position:relative;

box-shadow:
0 18px 45px rgba(0,0,0,.25),
0 6px 18px rgba(0,0,0,.18);

transition:.4s;
}

.quality-card:hover{
transform:translateY(-8px);
box-shadow:
0 30px 70px rgba(0,0,0,.35);
}
.quality-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}
.quality-card.portrait img{
height:320px;
object-fit:cover;
}
.quality-card img{
width:100%;
height:220px;
object-fit:cover;
display:block;
}
.quality-content{
padding:22px 20px 28px;
text-align:center;
background:#fff;
}

.quality-content h3{
font-size:22px;
font-weight:700;
color:#0D1117;
margin-bottom:8px;
}
.quality-content p{
font-size:15.8px;
color:#4a5568;
line-height:1.7;
}
.quality-icon{
position:absolute;
top:14px;
right:14px;

width:42px;
height:42px;

background:#fff;
border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

box-shadow:0 5px 18px rgba(0,0,0,.25);

font-size:18px;
color:#28a745;
}
@media(max-width:768px){

.quality-section{
padding:70px 20px;
}

.quality-title{
font-size:30px;
}

.quality-card img{
height:200px;
}

.quality-card.portrait img{
height:260px;
}

}
.quality-section{
background:#ffffff;
padding:90px 6%;
}
.quality-title{
color:#0D1117;
font-size:42px;
font-weight:700;
text-align:center;
margin-bottom:55px;
}
.quality-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:40px;
}
.quality-card{
background:#ffffff;
border-radius:24px;
overflow:hidden;
cursor:pointer;
position:relative;

border:1px solid #eef2f7;

box-shadow:
0 12px 35px rgba(0,0,0,.08),
0 4px 12px rgba(0,0,0,.05);

transition:.35s;
}
.quality-card:hover{
transform:translateY(-6px);
box-shadow:
0 20px 50px rgba(0,0,0,.12);
}
.quality-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}
/* =========================================
   QUALITY SECTION – FINAL GLASS PREMIUM
========================================= */

.quality-section{
position:relative;
padding:100px 5%;

/* CHANGE IMAGE HERE */
background:
linear-gradient(rgba(8,15,30,.70), rgba(8,15,30,.75)),
url("bg4.png");

background-size:cover;
background-position:center;
background-attachment:fixed;
}


/* ===== HEADING PILL ===== */

.quality-heading-box{
max-width:520px;
margin:0 auto 60px;

background:rgba(255,255,255,.15);
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);

border:1px solid rgba(255,255,255,.25);
border-radius:32px;

padding:16px;
text-align:center;

box-shadow:0 10px 35px rgba(0,0,0,.30);
}

.quality-heading-box h2{
font-size:34px;
font-weight:700;
color:#fff;
letter-spacing:.5px;
}


/* ===== GRID ===== */

.quality-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:40px;
}


/* ===== GLASS CARD ===== */

.quality-card{

background:rgba(255,255,255,.12);
backdrop-filter:blur(18px);
-webkit-backdrop-filter:blur(18px);

border-radius:26px;
padding:18px;

border:1px solid rgba(255,255,255,.25);

box-shadow:
0 15px 40px rgba(0,0,0,.35);

transition:.45s;
}


/* ===== CARD HOVER ===== */

.quality-card:hover{
transform:translateY(-10px) scale(1.01);
background:rgba(255,255,255,.18);
box-shadow:0 30px 70px rgba(0,0,0,.50);
}


/* ===== IMAGE BOX ===== */

.quality-image-box{
border-radius:22px;
overflow:hidden;
margin-bottom:18px;
}

.quality-image-box img{
width:100%;
height:230px;
object-fit:cover;
transition:.6s ease;
display:block;
}

.quality-card:hover img{
transform:scale(1.07);
}


/* ===== FIRST IMAGE PORTRAIT ===== */

.quality-card.portrait img{
height:340px;
}


/* ===== TITLE ===== */

.quality-card-title{
font-size:22px;
font-weight:700;
color:#fff;
margin-bottom:8px;
}


/* ===== SUB TEXT ===== */

.quality-card-sub{
font-size:15.5px;
color:rgba(255,255,255,.85);
line-height:1.65;
}


/* ===== MOBILE ===== */

@media(max-width:768px){

.quality-section{
padding:70px 18px;
background-attachment:scroll;
}

.quality-heading-box{
margin-bottom:40px;
}

.quality-heading-box h2{
font-size:26px;
}

.quality-image-box img{
height:200px;
}

.quality-card.portrait img{
height:260px;
}

}
/* =====================================
   SERVICES SECTION – ULTRA PREMIUM FINAL
===================================== */

.section.light{
background:linear-gradient(180deg,#f8fbff,#eef3f9);
padding:90px 6%;
}

/* ===== SECTION TITLE ===== */

.section-title{
text-align:center;
font-size:42px;
font-weight:700;
color:#0D1117;
margin-bottom:60px;
letter-spacing:-.5px;
}

/* ===== GRID ===== */

.grid-3{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:35px;
}

/* ===== CARD PREMIUM ===== */

.card{

background:rgba(255,255,255,.9);
backdrop-filter:blur(10px);

padding:40px 30px;
border-radius:26px;
text-align:center;

border:1px solid #eef2f7;

box-shadow:
0 15px 40px rgba(0,0,0,.06),
0 4px 12px rgba(0,0,0,.04);

transition:.45s ease;
position:relative;
overflow:hidden;
}

/* ===== BRAND TOP ACCENT ===== */

.card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}

/* ===== HOVER PREMIUM ===== */

.card:hover{
transform:translateY(-12px) scale(1.02);

box-shadow:
0 30px 70px rgba(0,0,0,.10),
0 10px 25px rgba(0,0,0,.06);
}

/* ===== ICON ===== */

.card i{
font-size:42px;

background:linear-gradient(135deg,#1F4FA3,#28A745);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;

margin-bottom:18px;
}

/* ===== TITLE ===== */

.card h3{
font-size:24px;
font-weight:700;
color:#0D1117;
margin-bottom:12px;
}

/* ===== DESCRIPTION ===== */

.card p{
font-size:16px;
color:#5b6472;
line-height:1.7;
max-width:85%;
margin:auto;
}

/* ===== HOVER ICON ANIMATION ===== */

.card:hover i{
transform:scale(1.1);
}

/* ===== SOFT GLOW EFFECT ===== */

.card::after{
content:"";
position:absolute;
top:-40%;
left:-40%;
width:180%;
height:180%;
background:radial-gradient(circle,rgba(40,167,69,.08),transparent 60%);
opacity:.6;
pointer-events:none;
}

/* ===== MOBILE ===== */

@media(max-width:768px){

.section.light{
padding:70px 20px;
}

.section-title{
font-size:32px;
margin-bottom:45px;
}

.card{
padding:35px 25px;
}

.card h3{
font-size:22px;
}

.card p{
font-size:15px;
}

}
/* =====================================
   CONTACT SECTION – PREMIUM FINAL
===================================== */

#contact{
background:#ffffff;
padding:90px 6% 70px;
text-align:center;
position:relative;
}

/* ===== TITLE ===== */

#contact .section-title{
font-size:40px;
font-weight:700;
color:#0D1117;
margin-bottom:40px;
letter-spacing:-.5px;
}

/* ===== CONTACT TEXT ===== */

#contact p{
font-size:18px;
color:#5B6472;
margin:14px 0;
font-weight:500;
transition:.3s ease;
}

/* ===== CONTACT HOVER ===== */

#contact p:hover{
color:#1F4FA3;
transform:translateY(-2px);
}

/* ===== ICON SPACE ===== */

#contact p{
display:flex;
justify-content:center;
align-items:center;
gap:10px;
}

/* ===== SOFT TOP DIVIDER ===== */

#contact::before{
content:"";
position:absolute;
top:0;
left:50%;
transform:translateX(-50%);
width:120px;
height:4px;
border-radius:10px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}

/* =====================================
   FOOTER – PREMIUM FINAL
===================================== */



/* ===== FOOTER TEXT ===== */

footer p{
color:#C9D4E5;
font-size:15px;
letter-spacing:.3px;
margin:0;
}

/* ===== TOP FOOTER GLOW LINE ===== */



/* =====================================
   MOBILE OPTIMIZATION
===================================== */

@media(max-width:768px){

#contact{
padding:70px 20px 60px;
}

#contact .section-title{
font-size:32px;
}

#contact p{
font-size:16px;
}

footer p{
font-size:14px;
}

}
/* ===============================
   EXTRA SOLAR SECTION – BG READY
================================ */

.solar-extra-section{

/* 👉 BACKGROUND IMAGE ADD HERE */
background-image:url("bg3.png");

/* OR AI IMAGE LINK */
background-size:cover;
background-position:center;
background-repeat:no-repeat;

padding:90px 6%;
position:relative;
z-index:1;
}

/* ===== DARK OVERLAY FOR READABILITY ===== */

.solar-extra-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(5,15,35,0.65);
z-index:-1;
}

/* ===== TITLE ===== */

.solar-extra-title{
text-align:center;
font-size:38px;
font-weight:700;
color:#ffffff;
margin-bottom:60px;
letter-spacing:-.5px;
}

/* ===== GRID ===== */

.solar-extra-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:35px;
}

/* ===== GLASS CARD ===== */

.solar-extra-card{
background:rgba(255,255,255,0.08);
backdrop-filter:blur(18px);
border:1px solid rgba(255,255,255,0.18);
border-radius:22px;
overflow:hidden;
transition:.4s ease;
box-shadow:0 15px 45px rgba(0,0,0,0.35);
position:relative;
}

/* ===== BRAND TOP LINE ===== */

.solar-extra-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:4px;
background:linear-gradient(90deg,#1F4FA3,#28A745);
}

/* ===== HOVER ===== */

.solar-extra-card:hover{
transform:translateY(-10px);
box-shadow:0 25px 60px rgba(0,0,0,0.45);
}

/* ===== LANDSCAPE IMAGE ===== */

.solar-extra-card img{
width:100%;
height:230px;
object-fit:cover;
display:block;
}

/* ===== CONTENT ===== */

.solar-extra-content{
padding:26px;
}

.solar-extra-content h3{
font-size:24px;
font-weight:700;
margin-bottom:12px;
color:#ffffff;
}

.solar-extra-content p{
font-size:16px;
color:#E2E8F0;
line-height:1.6;
}

/* ===== MOBILE ===== */

@media(max-width:900px){

.solar-extra-grid{
grid-template-columns:1fr;
}

.solar-extra-card img{
height:200px;
}

.solar-extra-title{
font-size:30px;
}

}
.img-popup{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.9);
display:flex;
justify-content:center;
align-items:center;
z-index:99999;
}

.img-popup img{
max-width:90%;
max-height:85%;
border-radius:14px;
}

.img-close{
position:absolute;
top:25px;
right:30px;
font-size:40px;
color:white;
cursor:pointer;
}
#contact a{
color:#1F4FA3;
text-decoration:none;
font-weight:600;
}

#contact a:hover{
color:#28A745;
}
.img-popup{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.95);
display:flex;
justify-content:center;
align-items:center;
z-index:999999;
}

.img-popup img{
max-width:92%;
max-height:85%;
border-radius:16px;
box-shadow:0 30px 60px rgba(0,0,0,.6);
}

.img-close{
position:absolute;
top:30px;
right:30px;
font-size:42px;
color:white;
cursor:pointer;
font-weight:700;
}
.section{
  background-color: black;
}
/* =========================
   CONTACT SECTION DARK BG
========================= */

#contact.section{
background:#020617;   /* Dark background */
padding:80px 20px;
display:flex;
justify-content:center;
}

/* CONTACT CARD */



/* TOP ACCENT LINE */


/* TITLE */
#contact .section-title{
font-size:22px;
font-weight:700;
color:#0f172a;
margin-bottom:25px;
}

/* CONTACT TEXT */
#contact p{
font-size:18px;
color:#334155;
margin:14px 0;
font-weight:500;
display:flex;
justify-content:center;
align-items:center;
gap:12px;
}

/* LINKS */
#contact a{
color:#004aad;
text-decoration:none;
font-weight:600;
transition:.3s;
}

#contact a:hover{
color:#28a745;
}


/* =========================
   FOOTER MATCH DARK THEME
========================= */



/* =========================
   CONTACT SECTION FULL FIX
========================= */

#contact{
background:#020617;   /* PURE DARK */
padding:80px 20px;
display:flex;
justify-content:center;
align-items:center;
}

/* WHITE CONTACT CARD */
.contact-card{
background:#EAF4FF;   /* PURE WHITE */
max-width:520px;
width:100%;
padding:45px 25px;
border-radius:26px;
text-align:center;
box-shadow:0 25px 70px rgba(0,0,0,.5);
position:relative;
}

/* TOP COLOR LINE */
.contact-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:5px;
background:linear-gradient(90deg,#004aad,#28a745);
border-top-left-radius:26px;
border-top-right-radius:26px;
}

/* TITLE */
#contact .section-title{
font-size:22px;
font-weight:700;
color:#0f172a;
margin-bottom:25px;
}

/* TEXT */
.contact-card p{
font-size:18px;
color:#334155;
margin:16px 0;
display:flex;
justify-content:center;
align-items:center;
gap:12px;
flex-wrap:wrap;   /* ⭐ EMAIL CUT FIX */
word-break:break-word;
}

/* LINKS */
.contact-card a{
color:#004aad;
font-weight:600;
text-decoration:none;
transition:.3s;
}

.contact-card a:hover{
color:#28a745;
}

/* =========================
   FOOTER
========================= */

footer{
background:#020617;
color:#94a3b8;
text-align:center;
padding:28px 15px;
font-size:15px;
border-top:1px solid rgba(255,255,255,.08);
}
/* =============================
WHY CHOOSE SECTION
============================= */

.why-section{
padding:80px 20px;
background: linear-gradient(180deg,#f8fbff,#eef5ff);
}

.why-container{
max-width:1200px;
margin:auto;
}

.why-title{
text-align:center;
font-size:34px;
font-weight:700;
margin-bottom:50px;
color:#0f172a;
}

/* GRID */
.why-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
}

/* CARD */
.why-card{
background:#ffffff;
padding:30px 25px;
border-radius:20px;
box-shadow:0 15px 35px rgba(0,0,0,0.08);
text-align:center;
transition:0.4s;
border-top:4px solid #22c55e;
}

.why-card:hover{
transform:translateY(-8px);
box-shadow:0 25px 50px rgba(0,0,0,0.15);
}

/* ICON */
.why-card i{
font-size:38px;
margin-bottom:18px;
background: linear-gradient(45deg,#2563eb,#22c55e);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

/* TITLE */
.why-card h3{
font-size:20px;
font-weight:600;
margin-bottom:10px;
color:#0f172a;
}

/* TEXT */
.why-card p{
font-size:15px;
color:#475569;
line-height:1.6;
}

/* MOBILE */
@media(max-width:768px){

.why-title{
font-size:26px;
}

.why-card{
padding:25px 20px;
}

}
/* =============================
TESTIMONIAL SECTION
============================= */

.testimonial-section{
padding:80px 20px;
background: linear-gradient(180deg,#071b34,#0b2545);
}

.testimonial-container{
max-width:1100px;
margin:auto;
}

.testimonial-title{
text-align:center;
color:white;
font-size:34px;
font-weight:700;
margin-bottom:50px;
}

/* GRID */
.testimonial-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:30px;
}

/* CARD */
.testimonial-card{
background:rgba(255,255,255,0.08);
backdrop-filter:blur(10px);
border:1px solid rgba(255,255,255,0.15);
padding:35px 30px;
border-radius:22px;
position:relative;
transition:0.4s;
}

.testimonial-card:hover{
transform:translateY(-8px);
box-shadow:0 25px 50px rgba(0,0,0,0.4);
}

/* LEFT BORDER LINE */
.testimonial-card::before{
content:"";
position:absolute;
left:0;
top:30px;
height:70%;
width:4px;
background:linear-gradient(#2563eb,#22c55e);
border-radius:10px;
}

/* TEXT */
.testimonial-text{
color:#e2e8f0;
font-size:17px;
line-height:1.7;
margin-bottom:25px;
font-style:italic;
}

/* NAME */
.testimonial-name{
color:white;
font-size:18px;
font-weight:600;
margin-bottom:4px;
}

/* ROLE */
.testimonial-role{
color:#94a3b8;
font-size:14px;
}

/* MOBILE */
@media(max-width:768px){

.testimonial-title{
font-size:26px;
}

.testimonial-text{
font-size:16px;
}

}
/* =============================
NEW CONTACT PRO SECTION
============================= */

.contact-pro-section{
padding:80px 20px;
background:#061a2e;
}

.contact-pro-container{
max-width:700px;
margin:auto;
background:rgba(255,255,255,0.06);
backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,0.15);
border-radius:24px;
padding:45px 35px;
box-shadow:0 20px 60px rgba(0,0,0,0.4);
}

/* TITLE */
.contact-pro-title{
color:white;
font-size:32px;
font-weight:700;
margin-bottom:15px;
}

/* DESC */
.contact-pro-desc{
color:#cbd5e1;
font-size:18px;
margin-bottom:30px;
}

/* INFO */
.contact-pro-info p{
color:#e2e8f0;
font-size:18px;
margin:18px 0;
line-height:1.6;
}

/* LINKS */
.contact-pro-info a{
color:#22c55e;
text-decoration:none;
font-weight:600;
transition:0.3s;
}

.contact-pro-info a:hover{
color:#3b82f6;
text-decoration:underline;
}

/* MAP LINK SPECIAL */
.map-link{
margin-top:25px;
font-size:19px;
}

/* MOBILE */
@media(max-width:768px){

.contact-pro-title{
font-size:26px;
}

.contact-pro-desc{
font-size:16px;
}

.contact-pro-info p{
font-size:16px;
}

.contact-pro-container{
padding:35px 22px;
}

}
/* =============================
FOOTER PRO
============================= */

.footer-pro{
background:#041223;
color:#e2e8f0;
padding-top:60px;
}

.footer-pro-container{
max-width:1100px;
margin:auto;
display:grid;
grid-template-columns:2fr 1fr;
gap:40px;
padding:0 20px 40px;
}

/* COMPANY */
.footer-pro-company h3{
color:white;
font-size:24px;
margin-bottom:15px;
}

.footer-pro-company p{
margin:10px 0;
font-size:16px;
}

/* LINKS */
.footer-pro-links h4{
color:white;
margin-bottom:18px;
font-size:20px;
}

.footer-pro-links a{
display:block;
color:#cbd5e1;
text-decoration:none;
margin:10px 0;
transition:0.3s;
}

.footer-pro-links a:hover{
color:#22c55e;
transform:translateX(5px);
}

/* CONTACT LINKS */
.footer-pro a{
color:#22c55e;
text-decoration:none;
font-weight:500;
}

.footer-pro a:hover{
color:#3b82f6;
text-decoration:underline;
}

/* BOTTOM */
.footer-pro-bottom{
border-top:1px solid rgba(255,255,255,0.1);
text-align:center;
padding:20px;
font-size:14px;
color:#94a3b8;
}

/* MOBILE */
@media(max-width:768px){

.footer-pro-container{
grid-template-columns:1fr;
text-align:center;
}

.footer-pro-links a:hover{
transform:none;
}

}
/* =============================
GLOBAL OVERFLOW FIX
============================= */

*{
box-sizing:border-box;
}

html, body{
overflow-x:hidden;
max-width:100%;
}


/* =============================
CONTACT CARD OVERFLOW FIX
============================= */

.contact-pro-card,
.footer-pro,
.footer-pro-container{
width:100%;
max-width:100%;
overflow:hidden;
}


/* TEXT WRAP FIX */
.contact-pro-card p,
.footer-pro p,
.footer-pro a{
word-break:break-word;
overflow-wrap:break-word;
}


/* EMAIL / PHONE LONG TEXT FIX */
.contact-pro-card a,
.footer-pro a{
display:inline-block;
max-width:100%;
}


/* =============================
FOOTER GRID MOBILE FIX
============================= */

@media(max-width:768px){

.footer-pro-container{
grid-template-columns:1fr;
padding:0 20px;
}

.footer-pro-company,
.footer-pro-links{
width:100%;
}

}


/* =============================
CONTACT CARD WIDTH FIX
============================= */

.contact-pro-card{
width:90%;
max-width:420px;
margin:auto;
}


/* =============================
HEADING SAFE WIDTH
============================= */

.footer-pro-company h3,
.footer-pro-links h4{

}


/* =============================
EXTRA SAFETY FOR LONG EMAIL
============================= */

.contact-pro-card a[href^="mailto"],
.footer-pro a[href^="mailto"]{
font-size:15px;
}
/* =========================
RESET (IMPORTANT)
========================= */
#get-touch,
.get-touch-section{
background:#f4f7fb !important;
padding:80px 20px !important;
}

/* REMOVE DEFAULT FORM STYLE */
#get-touch input,
#get-touch textarea,
#get-touch button{
appearance:none;
-webkit-appearance:none;
border:none;
outline:none;
font-family:'Poppins',sans-serif;
}

/* =========================
MAIN FORM CARD
========================= */
#get-touch form{
max-width:520px;
margin:auto;
background:#ffffff;
padding:45px 35px;
border-radius:24px;
box-shadow:0 25px 60px rgba(0,0,0,0.08);
}

/* =========================
TITLE
========================= */
#get-touch h2{
font-size:34px;
font-weight:700;
color:#0b1c2c;
margin-bottom:10px;
}

/* TEXT */
#get-touch p{
color:#7b8a97;
margin-bottom:30px;
}

/* =========================
INPUT STYLE
========================= */
#get-touch input,
#get-touch textarea{
width:100%;
padding:17px;
margin-bottom:18px;
border-radius:14px;
border:1.5px solid #e2e8f0;
background:#f9fbfd;
font-size:15px;
color:#0b1c2c;
transition:0.3s;
}

/* FOCUS */
#get-touch input:focus,
#get-touch textarea:focus{
border-color:#2db35c;
background:#fff;
box-shadow:0 0 0 3px rgba(45,179,92,0.15);
}

/* PLACEHOLDER LIGHT */
#get-touch input::placeholder,
#get-touch textarea::placeholder{
color:#9aa6b2;
}

/* TEXTAREA SIZE */
#get-touch textarea{
min-height:120px;
resize:none;
}

/* =========================
BUTTON
========================= */
#get-touch button{
width:100%;
padding:18px;
border-radius:16px;
background:#2db35c;
color:#fff;
font-size:18px;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

#get-touch button:hover{
background:#24994f;
transform:translateY(-2px);
box-shadow:0 12px 28px rgba(45,179,92,0.35);
}

/* =========================
MOBILE
========================= */
@media(max-width:768px){

#get-touch{
padding:60px 15px !important;
}

#get-touch form{
padding:35px 22px;
}

#get-touch h2{
font-size:28px;
}

#get-touch input,
#get-touch textarea{
padding:15px;
}

#get-touch button{
padding:16px;
font-size:16px;
}

}
.visit-popup{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.7);
backdrop-filter:blur(8px);
display:none;
justify-content:center;
align-items:center;
z-index:9999;
padding:20px;
}

.visit-popup.active{
display:flex;
}

.visit-popup-box{
background:#0f2238;
padding:30px 20px;
border-radius:20px;
width:100%;
max-width:420px;
position:relative;
}

.visit-close{
position:absolute;
right:20px;
top:15px;
color:#fff;
font-size:22px;
cursor:pointer;
}

.visit-popup-box input,
.visit-popup-box textarea{
width:100%;
padding:14px;
margin-bottom:14px;
border-radius:12px;
border:none;
background:rgba(255,255,255,0.08);
color:#fff;
}

.visit-popup-box button{
width:100%;
padding:16px;
border:none;
border-radius:14px;
background:#28a745;
color:#fff;
font-weight:600;
cursor:pointer;
}
/* ===== CONTACT PRO SECTION SIZE CONTROL ===== */

.contact-pro-section{
width:100%;
padding:60px 20px;
display:flex;
justify-content:center;
}

/* MAIN CARD WIDTH CONTROL */
.contact-pro-container{
width:100%;
max-width:1000px;   /* 👉 MAIN SIZE CONTROL */
margin:auto;
}

/* ===== MOBILE ===== */
@media(max-width:768px){

.contact-pro-section{
padding:50px 16px;
}

.contact-pro-container{
max-width:95%;
}

}

/* ===== SMALL MOBILE ===== */
@media(max-width:480px){

.contact-pro-container{
max-width:100%;
}

}
/* ===== TEXT OVERFLOW MASTER FIX ===== */

.contact-pro-info{
width:100%;
overflow:hidden;
}

/* ALL TEXT SAFE WRAP */
.contact-pro-info p,
.contact-pro-info a,
.contact-pro-info strong{
word-wrap:break-word;
overflow-wrap:break-word;
}

/* EMAIL SPECIAL FIX */
.contact-pro-info a[href^="mailto"]{
word-break:break-all;
}

/* PHONE SAFE */
.contact-pro-info a[href^="tel"]{
white-space:nowrap;
}

/* MOBILE EXTRA SAFE */
@media(max-width:480px){

.contact-pro-info{
font-size:15px;
line-height:1.6;
}

}
/* =========================
   NAVBAR DESKTOP FIX
========================= */

.navbar{
width:100%;
height:70px;
padding:0 40px;
display:flex;
align-items:center;
justify-content:space-between;
position:fixed;
top:0;
left:0;
z-index:9999;
background:rgba(255,255,255,0.95);
backdrop-filter:blur(10px);
}

/* BRAND */
.brand-header{
display:flex;
align-items:center;
gap:12px;
}

.brand-logo{
height:50px;
width:auto;
}

.brand-text span{
font-size:18px;
font-weight:600;
}

/* NAV LINKS DESKTOP */
.nav-links{
display:flex;
align-items:center;
gap:28px;
list-style:none;
margin:0;
padding:0;
}

.nav-links a{
text-decoration:none;
color:#111;
font-weight:500;
font-size:15px;
white-space:nowrap;
}

/* BURGER HIDE IN PC */
.burger{
display:none;
}

/* =========================
   HERO FIX (HEADER GAP)
========================= */

.hero{
padding-top:90px;
}

/* =========================
   DESKTOP ONLY RULES
========================= */

@media(min-width:992px){

.nav-links{
position:static;
flex-direction:row;
background:none;
height:auto;
width:auto;
}

.menu-overlay{
display:none !important;
}

}
@media(max-width:991px){

.burger{
display:block;
}

.nav-links{
position:fixed;
top:0;
right:-100%;
width:70%;
height:100vh;
background:#fff;
flex-direction:column;
padding-top:100px;
transition:0.4s;
}

.nav-links.active{
right:0;
}

}
.brand-header{
margin-left:0;
}/* =========================
   MOBILE HEADER LOGO FIX
========================= */

@media(max-width:768px){

.navbar{
padding:0 12px;
height:65px;
}

/* BRAND CONTAINER LEFT */
.brand-header{
justify-content:flex-start;
gap:8px;
}

/* LOGO SIZE MOBILE */
.brand-logo{
height:40px;
}

/* BRAND TEXT SIZE MOBILE */
.brand-text span{
font-size:16px;
}

/* REMOVE EXTRA SPACE LEFT */
.navbar{
padding-left:10px;
}

}
/* HEADER WHITE BACKGROUND */
.navbar{
background:#ffffff;
}