*{
margin:0;
padding:0;
box-sizing:border-box;
cursor:default;
caret-color:transparent;
}

a,button,.btn,.service-card,.submit-btn,.close-btn{
cursor:pointer !important;
}

body{
font-family:'Poppins',sans-serif;
background:#fff;
color:#1e293b;
overflow-x:hidden;
line-height:1.6;
}

.container{
width:90%;
max-width:1250px;
margin:auto;
}

.section{
padding:90px 0;
}

.hero{
position:relative;
min-height:90vh;
background:url('datacenter.jpg') center/cover no-repeat;
color:#fff;
}

.overlay{position:absolute;inset:0;background: linear-gradient(135deg, rgb(5 91 210), rgba(7, 87, 167, .84), rgb(30 94 147));}

.navbar,.hero-content{
position:relative;
z-index:2;
}

.navbar{
display:flex;
justify-content:space-between;
align-items:center;
padding:24px 0;
}

.brand,.footer-brand{
display:flex;
align-items:center;
gap:14px;
font-weight:700;
}

.brand img,.footer-brand img{width:64px;height:64px;background: #ffffff33;border-radius:50%;padding:5px;object-fit:contain;}

.nav-links{
display:flex;
gap:28px;
}

.nav-links a{
text-decoration:none;
color:#fff;
}

.hero-content{
display:grid;
grid-template-columns:1.2fr .8fr;
gap:50px;
align-items:center;
min-height:75vh;
}

.hero-text h1{
font-size:60px;
line-height:1.1;
margin-bottom:24px;
}

.hero-text p{
font-size:18px;
line-height:1.8;
margin-bottom:35px;
max-width:700px;
}

.hero-buttons{
display:flex;
gap:18px;
flex-wrap:wrap;
}

.btn{
padding:16px 30px;
border-radius:50px;
text-decoration:none;
font-weight:600;
}

.btn-primary{
background:#fff;
color:#032b73;
}

.btn-secondary{
border:2px solid #fff;
color:#fff;
}

.hero-card{
background:rgba(255,255,255,.1);
backdrop-filter:blur(12px);
padding:35px;
border-radius:28px;
}

.stats{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:18px;
margin-top:25px;
}

.stat-item{
background:rgba(255,255,255,.08);
padding:20px;
border-radius:20px;
text-align:center;
}

.services{
background:#f8fafc;
}

.section-header{
text-align:center;
max-width:850px;
margin:auto auto 60px;
}

.section-tag{
color:#0b5ed7;
font-weight:700;
letter-spacing:2px;
font-size:14px;
}

.section-header h2{
font-size:42px;
margin:15px 0;
color:#032b73;
}

.service-category{
margin-bottom:70px;
}

.service-category h3{
font-size:34px;
margin-bottom:35px;
color:#032b73;
border-left:6px solid #198754;
padding-left:18px;
}

.services-grid{
display:grid;
grid-template-columns:repeat(3,minmax(320px,1fr));
gap:30px;
}

.service-card{background:#fff;padding:32px 28px;border-radius:28px;box-shadow:0 10px 30px rgba(0,0,0,.08);border-top: 6px solid #2566a1;transition:.3s;}

.service-card:hover{
transform:translateY(-8px);
}

.service-card i{width:70px;height:70px;border-radius:22px;background: linear-gradient(135deg, rgb(5 91 210), rgba(7, 87, 167, .84), rgb(30 94 147));display:flex;align-items:center;justify-content:center;color:#fff;font-size:28px;margin-bottom:22px;}

.service-card h4{
font-size:22px;
margin-bottom:14px;
color:#032b73;
}

.service-card p{
color:#64748b;
line-height:1.7;
}

.contact-wrapper{
display:grid;
grid-template-columns:.8fr 1.2fr;
gap:40px;
}

.contact-item{
display:flex;
gap:18px;
margin-bottom:24px;
}

.contact-item i{width:55px;height:55px;border-radius:18px;background: linear-gradient(135deg, rgb(5 91 210), rgba(7, 87, 167, .84), rgb(30 94 147));display:flex;align-items:center;justify-content:center;color:#fff;}

.contact-form{
background:#fff;
padding:35px;
border-radius:28px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
margin-bottom:18px;
}

.contact-form input,.contact-form textarea{
width:100%;
padding:16px 18px;
border:1px solid #dbe4ee;
border-radius:16px;
font-family:inherit;
}

.submit-btn{background: linear-gradient(135deg, rgb(5 91 210), rgba(7, 87, 167, .84), rgb(30 94 147));border:none;color:#fff;padding:16px 28px;border-radius:50px;margin-top:18px;}

footer{background: #2769a5;color: #ffffff;padding:28px 0;}

.footer-content{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:20px;
}

.modal{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.7);
z-index:9999;
align-items:center;
justify-content:center;
padding:20px;
}

.modal.show{
display:flex;
}

/* ── Industries Grid ─────────────────────────────────────────────────────── */
.industries-grid{
grid-template-columns:repeat(4,minmax(240px,1fr));
}
@media(max-width:1200px){
.industries-grid{grid-template-columns:repeat(3,minmax(220px,1fr));}
}
@media(max-width:768px){
.industries-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:480px){
.industries-grid{grid-template-columns:1fr;}
}

/* ── WhatsApp Floating Button ─────────────────────────────────────────────── */
.whatsapp-float{
position:fixed;
bottom:24px;
right:24px;
width:56px;
height:56px;
background:#25d366;
color:#fff;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:30px;
text-decoration:none;
box-shadow:0 6px 20px rgba(37,211,102,.45);
z-index:9000;
transition:transform .25s, box-shadow .25s;
}
.whatsapp-float:hover{
transform:scale(1.12);
box-shadow:0 8px 26px rgba(37,211,102,.6);
}

/* ── Back to Top Button ───────────────────────────────────────────────────── */
.back-to-top{
position:fixed;
bottom:24px;
right:90px;
width:46px;
height:46px;
background:linear-gradient(135deg,rgb(5 91 210),rgb(30 94 147));
color:#fff;
border:none;
border-radius:50%;
display:none;
align-items:center;
justify-content:center;
font-size:18px;
box-shadow:0 6px 18px rgba(5,91,210,.4);
z-index:9000;
cursor:pointer;
transition:transform .25s;
}
.back-to-top.visible{
display:flex;
}
.back-to-top:hover{
transform:translateY(-4px);
}

.modal-content{background:#fff;max-width:700px;width:100%;padding:35px;border-radius:28px;position:relative;border-top: 8px solid #2566a1;}

.close-btn{
position:absolute;
top:14px;
right:20px;
font-size:32px;
}

@media(max-width:1024px){
.hero-content,.contact-wrapper{
grid-template-columns:repeat(3,1fr);
}
.services-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
}

@media(max-width:768px){
.nav-links{
display:none;
}

.hero-content{
display:flex;
flex-direction:column;
gap:30px;
padding:40px 0;
}

.hero-text h1{
font-size:38px;
}

.stats,.services-grid,.form-row{
grid-template-columns:repeat(3,1fr);
}

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

.footer-content{
flex-direction:column;
text-align:center;
}
}

@media(max-width:480px){
.hero-text h1{
font-size:30px;
}

.section-header h2{
font-size:30px;
}

.brand img,.footer-brand img{
width:52px;
height:52px;
}

.service-category h3{
font-size:26px;
}
}


/* =========================
   RESPONSIVE IMPROVEMENTS
========================= */

img{
max-width:100%;
height:auto;
}

.hero-card,
.contact-form,
.service-card,
.modal-content{
width:100%;
}

@media (max-width:1200px){
.hero-text h1{
font-size:52px;
}

.services-grid{
grid-template-columns:repeat(2,minmax(280px,1fr));
}

.contact-wrapper{
grid-template-columns:1fr;
align-items:start;
}
}

@media (max-width:1024px){

.navbar{
gap:20px;
flex-wrap:wrap;
}

.hero{
min-height:auto;
padding-bottom:60px;
}

.hero-content{
grid-template-columns:1fr;
gap:40px;
padding:40px 0 20px;
min-height:auto;
}

.hero-text,
.hero-card{
width:100%;
}

.hero-text h1{
font-size:46px;
}

.hero-text p{
font-size:17px;
max-width:100%;
}

.stats{
grid-template-columns:repeat(2,1fr);
}

.form-row{
grid-template-columns:1fr;
}
}

@media (max-width:768px){

.container{
width:min(92%, 100%);
}

.section{
padding:70px 0;
}

.navbar{
flex-direction:column;
align-items:flex-start;
padding:20px 0;
}

.brand{
width:100%;
justify-content:flex-start;
}

.nav-links{
display:flex;
flex-wrap:wrap;
gap:16px;
width:100%;
}

.hero-content{
padding-top:20px;
}

.hero-text h1{
font-size:38px;
line-height:1.2;
}

.hero-text p{
font-size:16px;
line-height:1.7;
}

.hero-buttons{
width:100%;
}

.btn{
width:100%;
text-align:center;
padding:15px 22px;
}

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

.service-card{
padding:28px 22px;
}

.section-header{
margin-bottom:45px;
}

.section-header h2{
font-size:34px;
line-height:1.2;
}

.service-category h3{
font-size:28px;
line-height:1.3;
}

.contact-wrapper{
gap:28px;
}

.contact-form{
padding:28px 22px;
}

.footer-content{
flex-direction:column;
text-align:center;
}
}

@media (max-width:576px){

.hero{
padding-bottom:40px;
}

.brand span{
font-size:14px;
line-height:1.4;
word-break:break-word;
}

.hero-text h1{
font-size:32px;
}

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

.stat-item{
padding:18px;
}

.section-header h2{
font-size:28px;
}

.service-category h3{
font-size:24px;
padding-left:14px;
}

.service-card h4{
font-size:20px;
}

.contact-item{
align-items:flex-start;
}

.modal-content{
padding:28px 20px;
border-radius:20px;
}

.close-btn{
top:10px;
right:14px;
}
}

@media (max-width:360px){

.hero-text h1{
font-size:28px;
}

.btn{
font-size:14px;
}

.service-card,
.contact-form{
padding:22px 18px;
}

.brand{
gap:10px;
}

.brand img,
.footer-brand img{
width:46px;
height:46px;
}
}