body{
margin:0;
font-family:Arial,sans-serif;
color:#0f172a;
background:#fff;
}

.container{
width:min(1180px,calc(100% - 40px));
margin:auto;
}

.top{
background:#081923;
color:white;
padding:10px 0;
}

.top-inner{
display:flex;
justify-content:space-between;
}

.top a{
color:white;
font-weight:bold;
}

.nav{
background:white;
border-bottom:1px solid #e5e7eb;
position:sticky;
top:0;
z-index:50;
}

.nav-inner{
display:flex;
justify-content:space-between;
align-items:center;
padding:18px 0;
}

.logo{
width:250px;
max-width:55vw;
}

.nav-links{
display:flex;
gap:24px;
font-weight:bold;
}

.hero{
position:relative;
min-height:700px;
background:url('assets/water-extraction.jpg') center/cover;
display:flex;
align-items:center;
color:white;
}

.overlay{
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.45));
}

.hero-grid{
position:relative;
z-index:2;
display:grid;
grid-template-columns:1.2fr .8fr;
gap:40px;
align-items:center;
}

.eyebrow{
text-transform:uppercase;
letter-spacing:.15em;
font-size:13px;
font-weight:900;
color:#bcefff;
}

h1{
font-size:clamp(42px,7vw,82px);
line-height:1;
margin:0 0 18px;
}

.lead{
font-size:21px;
max-width:700px;
color:rgba(255,255,255,.85);
}

.btn{
display:inline-block;
padding:16px 24px;
border-radius:999px;
background:#d9a441;
color:#081923;
font-weight:900;
margin-top:20px;
text-decoration:none;
}

.hero-card{
background:rgba(255,255,255,.95);
padding:30px;
border-radius:28px;
color:#081923;
box-shadow:0 25px 60px rgba(0,0,0,.22);
}

.hero-card img{
width:240px;
display:block;
margin:auto;
}

.section{
padding:90px 0;
}

.center{
text-align:center;
margin-bottom:40px;
}

.cards{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:22px;
}

.card{
background:white;
border-radius:28px;
overflow:hidden;
box-shadow:0 20px 50px rgba(0,0,0,.08);
}

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

.card-body{
padding:24px;
}

.gallery{
background:#f5f8fb;
padding:90px 0;
}

.gallery-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
}

.gallery-grid img{
width:100%;
height:420px;
object-fit:cover;
border-radius:28px;
box-shadow:0 18px 45px rgba(0,0,0,.1);
}

.contact{
padding:90px 0;
}

.contact-box{
display:flex;
justify-content:space-between;
align-items:center;
gap:30px;
padding:40px;
background:#081923;
color:white;
border-radius:32px;
}

.footer{
padding:35px 0;
background:#081923;
color:white;
text-align:center;
}

@media(max-width:900px){

.hero-grid,
.cards,
.gallery-grid,
.contact-box{
grid-template-columns:1fr;
display:grid;
}

.nav-links{
display:none;
}

.hero{
min-height:auto;
padding:70px 0;
}

.card img,
.gallery-grid img{
height:250px;
}
}


.center-sub{
text-align:center;
max-width:760px;
margin:0 auto 40px;
color:#5b6674;
font-size:18px;
}

.gallery-card{
background:white;
border-radius:28px;
overflow:hidden;
box-shadow:0 18px 45px rgba(0,0,0,.1);
}

.gallery-card img{
width:100%;
height:320px;
object-fit:cover;
display:block;
}

.gallery-text{
padding:22px;
}

.gallery-text p{
color:#5b6674;
}

.reviews{
padding:90px 0;
background:#f5f8fb;
}

.review-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:22px;
}

.review-card{
background:white;
padding:28px;
border-radius:28px;
box-shadow:0 18px 45px rgba(0,0,0,.08);
}

.stars{
font-size:24px;
color:#d9a441;
letter-spacing:.08em;
margin-bottom:16px;
}

.review-card p{
color:#5b6674;
line-height:1.7;
}

@media(max-width:900px){

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

.gallery-card img{
height:240px;
}

}


.credential-badge{
display:inline-block;
margin-top:18px;
margin-bottom:8px;
padding:10px 16px;
border-radius:999px;
background:#ffffff;
color:#0f3d4a;
font-weight:900;
font-size:14px;
box-shadow:0 12px 30px rgba(0,0,0,.15);
border:2px solid #d9a441;
}


.iicrc-badge-wrap{
margin-top:24px;
}

.iicrc-badge{
width:240px;
max-width:100%;
display:block;
border-radius:20px;
box-shadow:0 14px 35px rgba(0,0,0,.18);
background:white;
}