:root{--navy:#06283d;--blue:#087ea4;--cyan:#16b7d6;--light:#f3fbfd;--ink:#15232d;--muted:#61727c;--white:#fff;--line:#dcebef;--shadow:0 18px 50px rgba(6,40,61,.10);--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.65}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1160px,92%);margin:auto}.topbar{background:var(--navy);color:#d9f4fa;font-size:14px}.topbar .container{display:flex;justify-content:space-between;gap:20px;padding:9px 0}.topbar a{color:#fff}.navbar{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 4px 22px rgba(6,40,61,.06)}.nav-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:21px;letter-spacing:.2px;color:var(--navy)}.brand-mark{width:43px;height:43px;border-radius:50%;background:linear-gradient(145deg,var(--cyan),var(--blue));display:grid;place-items:center;color:#fff;font-weight:900;font-size:19px;box-shadow:0 8px 20px rgba(8,126,164,.25)}.nav-links{display:flex;align-items:center;gap:28px;font-weight:700;font-size:15px}.nav-links a{color:#3d505b}.nav-links a:hover,.nav-links a.active{color:var(--blue)}.nav-cta{background:var(--blue);color:#fff!important;padding:12px 18px;border-radius:999px}.menu-btn{display:none;border:0;background:none;font-size:28px;color:var(--navy)}
.hero{position:relative;overflow:hidden;background:linear-gradient(115deg,#052b41 0%,#075d79 52%,#0ba2ba 100%);color:#fff}.hero:after{content:"";position:absolute;inset:auto -10% -90px;height:230px;background:rgba(255,255,255,.08);border-radius:50%}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;min-height:600px;gap:50px;padding:70px 0;position:relative;z-index:1}.eyebrow{display:inline-flex;gap:8px;align-items:center;color:#a9f2fb;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;font-size:13px}.hero h1{font-size:clamp(42px,6vw,72px);line-height:1.02;margin:17px 0 22px;letter-spacing:-2px}.hero p{font-size:19px;color:#d9f7fb;max-width:650px}.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 21px;border-radius:999px;font-weight:800;border:2px solid transparent;transition:.2s}.btn-primary{background:#fff;color:var(--navy)}.btn-outline{border-color:rgba(255,255,255,.5);color:#fff}.btn-primary:hover,.btn-outline:hover{transform:translateY(-2px)}.hero-card{position:relative;border-radius:28px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.2);border:7px solid rgba(255,255,255,.14)}.hero-card img{height:450px;width:100%;object-fit:cover}.hero-badge{position:absolute;left:20px;bottom:20px;background:#fff;color:var(--navy);padding:15px 18px;border-radius:14px;font-weight:800;box-shadow:var(--shadow)}
.section{padding:90px 0}.section-soft{background:var(--light)}.section-head{text-align:center;max-width:730px;margin:0 auto 48px}.kicker{color:var(--blue);font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:1.7px}.section h2{font-size:clamp(32px,4vw,48px);line-height:1.1;margin:12px 0 15px;color:var(--navy);letter-spacing:-1px}.section-head p,.muted{color:var(--muted)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:0 8px 28px rgba(6,40,61,.05)}.service-card{overflow:hidden;padding:0}.service-card img{height:190px;width:100%;object-fit:cover}.service-card .card-body{padding:25px}.icon{width:52px;height:52px;border-radius:15px;background:#e6f8fb;color:var(--blue);display:grid;place-items:center;font-size:24px;font-weight:900;margin-bottom:20px}.card h3{font-size:21px;margin:0 0 10px;color:var(--navy)}.card p{color:var(--muted);margin:0}.checks{display:grid;gap:13px;margin:25px 0 0;padding:0;list-style:none}.checks li{display:flex;gap:11px;align-items:flex-start}.checks b{color:var(--cyan)}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.split-media{border-radius:25px;overflow:hidden;box-shadow:var(--shadow)}.split-media img{width:100%;height:470px;object-fit:cover}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.stat{padding:25px;border-radius:16px;background:#fff;border:1px solid var(--line);text-align:center}.stat strong{display:block;font-size:32px;color:var(--blue)}.stat span{color:var(--muted);font-size:14px}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:step}.process .card{position:relative;padding-top:55px}.step{position:absolute;top:18px;left:22px;width:32px;height:32px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800}.step:before{counter-increment:step;content:counter(step)}.banner{padding:0}.page-title{background:linear-gradient(90deg,rgba(5,43,65,.92),rgba(5,120,147,.75)),url('assets/images/page-title.jpg') center/cover;min-height:310px;display:grid;place-items:center;text-align:center;color:#fff}.page-title h1{font-size:clamp(40px,6vw,62px);margin:0 0 10px}.page-title p{margin:0;color:#dff9fc}.service-list{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.service-large{display:grid;grid-template-columns:190px 1fr;gap:22px;align-items:stretch}.service-large img{height:100%;min-height:180px;width:190px;object-fit:cover;border-radius:14px}.pill{display:inline-block;padding:6px 10px;border-radius:999px;background:#e8f8fb;color:var(--blue);font-size:12px;font-weight:800;margin-bottom:9px}.industry{min-height:230px;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(180deg,rgba(4,40,61,.05),rgba(4,40,61,.92)),url('assets/images/water.jpg') center/cover;border-radius:18px;color:#fff;padding:25px}.industry:nth-child(2){background-image:linear-gradient(180deg,rgba(4,40,61,.05),rgba(4,40,61,.92)),url('assets/images/tanks.jpg')}.industry:nth-child(3){background-image:linear-gradient(180deg,rgba(4,40,61,.05),rgba(4,40,61,.92)),url('assets/images/industrial.jpg')}.industry:nth-child(4){background-image:linear-gradient(180deg,rgba(4,40,61,.05),rgba(4,40,61,.92)),url('assets/images/clean-water.jpg')}.industry h3{margin:0;font-size:22px}.industry p{margin:5px 0 0;color:#e5f7fa;font-size:14px}.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:28px}.contact-card{padding:30px;border:1px solid var(--line);border-radius:18px}.contact-item{display:flex;gap:14px;margin:20px 0}.contact-item .icon{flex:0 0 48px;margin:0}.contact-item h3{font-size:15px;margin:0 0 2px}.contact-item a,.contact-item p{margin:0;color:var(--muted)}form{display:grid;grid-template-columns:1fr 1fr;gap:15px}label{font-size:13px;font-weight:800;color:var(--navy)}input,textarea,select{width:100%;margin-top:7px;border:1px solid var(--line);border-radius:11px;padding:13px 14px;font:inherit;outline:none}input:focus,textarea:focus,select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(22,183,214,.12)}textarea{min-height:145px;resize:vertical}.full{grid-column:1/-1}.footer{background:#061f30;color:#b7d1da;padding:55px 0 20px}.footer-grid{display:grid;grid-template-columns:1.3fr .8fr .9fr;gap:50px}.footer h3{color:#fff;margin-top:0}.footer a:hover{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:35px;padding-top:18px;font-size:13px;display:flex;justify-content:space-between;gap:15px}.floating-call{position:fixed;right:18px;bottom:18px;background:var(--cyan);color:#fff;padding:13px 17px;border-radius:999px;font-weight:900;box-shadow:0 10px 25px rgba(22,183,214,.35);z-index:30}.note{font-size:12px;color:#82939a;margin-top:8px}.quote{font-size:21px;color:var(--navy);font-weight:700;border-left:4px solid var(--cyan);padding-left:20px}.reveal{animation:rise .7s ease both}@keyframes rise{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@media(max-width:900px){.nav-links{display:none;position:absolute;left:4%;right:4%;top:74px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.menu-btn{display:block}.hero-grid,.split,.contact-grid{grid-template-columns:1fr}.hero-grid{padding:55px 0}.hero-card{max-width:650px}.grid-4,.stats,.process{grid-template-columns:repeat(2,1fr)}.service-list{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}
@media(max-width:600px){.topbar .container{flex-direction:column;gap:2px}.nav-inner{height:70px}.brand{font-size:17px}.brand-mark{width:38px;height:38px}.hero h1{letter-spacing:-1px}.hero-card img{height:320px}.section{padding:65px 0}.grid-3,.grid-4,.stats,.process{grid-template-columns:1fr}.service-large{grid-template-columns:1fr}.service-large img{width:100%;height:180px}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.footer-bottom{flex-direction:column}.actions .btn{width:100%}form{grid-template-columns:1fr}.full{grid-column:auto}}

/* Enhanced floating contact controls */
.floating-contact{position:fixed;bottom:22px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#fff;z-index:100;box-shadow:0 12px 30px rgba(6,40,61,.24);transition:transform .2s,box-shadow .2s;font-size:25px;font-weight:900}
.floating-contact:hover{transform:translateY(-3px);box-shadow:0 16px 35px rgba(6,40,61,.3)}
.floating-call-left{left:22px;background:#087ea4}
.floating-whatsapp-right{right:22px;background:#16b7d6}
.floating-contact svg{width:27px;height:27px;fill:currentColor}
.service-hero{background:linear-gradient(115deg,#052b41 0%,#075d79 55%,#0ba2ba 100%);color:#fff;padding:72px 0;position:relative;overflow:hidden}
.service-hero .container{position:relative;z-index:1}
.service-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
.service-hero h1{font-size:clamp(38px,5vw,62px);line-height:1.05;margin:12px 0 18px;letter-spacing:-1.5px}
.service-hero p{font-size:18px;color:#d9f7fb;max-width:690px}
.service-image{border-radius:25px;overflow:hidden;border:6px solid rgba(255,255,255,.14);box-shadow:0 28px 65px rgba(0,0,0,.22)}
.service-image img{height:400px;width:100%;object-fit:cover}
.service-detail-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:start}
.service-side{position:sticky;top:105px}
.service-side .card{margin-bottom:18px}
.callout{border-radius:20px;background:linear-gradient(135deg,#e7f9fc,#f3fbfd);border:1px solid var(--line);padding:28px}
.callout h3{color:var(--navy);margin-top:0}
.faq{display:grid;gap:12px;max-width:900px;margin:auto}.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px}.faq summary{cursor:pointer;font-weight:800;color:var(--navy)}.faq p{color:var(--muted);margin:12px 0 0}
.service-links{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service-link{padding:22px;border:1px solid var(--line);border-radius:16px;background:#fff}.service-link h3{margin:0 0 7px;color:var(--navy);font-size:18px}.service-link p{margin:0;color:var(--muted);font-size:14px}
@media(max-width:900px){.service-hero-grid,.service-detail-grid{grid-template-columns:1fr}.service-side{position:static}.service-links{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.floating-contact{bottom:16px;width:52px;height:52px}.floating-call-left{left:14px}.floating-whatsapp-right{right:14px}.service-hero{padding:55px 0}.service-image img{height:300px}.service-links{grid-template-columns:1fr}}

/* Logo */
.brand-logo{width:230px;height:auto;max-height:62px;object-fit:contain;object-position:left center}
.footer .brand-logo{filter:none;background:#fff;border-radius:8px;padding:5px 9px;width:245px}
.map-section{padding-top:20px}.map-card{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}.map-card iframe{display:block;width:100%;height:430px;border:0}.map-info{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:24px 28px}.map-info>div{display:grid;gap:5px}.map-info strong{font-size:20px;color:var(--navy)}.map-info span{color:var(--muted);font-size:14px;line-height:1.55}
@media(max-width:900px){.brand-logo{width:200px}.map-info{flex-direction:column;align-items:flex-start}}
@media(max-width:600px){.brand-logo{width:175px;max-height:52px}.footer .brand-logo{width:210px}.map-card iframe{height:340px}.map-info{padding:20px}.map-info .btn{width:100%}}

/* Top contact header */
.topbar{background:#06283d;color:#d9f4fa;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar-inner{min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:7px 0}
.top-contact{display:flex;align-items:center;gap:22px;min-width:0}
.top-contact a{display:inline-flex;align-items:center;gap:8px;color:#fff;font-size:13px;white-space:nowrap}
.top-contact i{color:#16b7d6;font-size:13px}
.top-social{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.top-social>span{font-size:12px;margin-right:3px;color:#b9d6de}
.top-social a{width:29px;height:29px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:grid;place-items:center;color:#fff;font-size:12px;transition:.2s}
.top-social a:hover{background:#16b7d6;border-color:#16b7d6;transform:translateY(-2px)}

/* Home image slider */
.hero-card{position:relative;min-height:420px}
.hero-slider{height:420px;border-radius:25px;overflow:hidden;position:relative;border:6px solid rgba(255,255,255,.14);box-shadow:0 28px 65px rgba(0,0,0,.22);background:#06283d}
.hero-slider .slide{position:absolute;inset:0;opacity:0;transition:opacity .65s ease}
.hero-slider .slide.active{opacity:1}
.hero-slider .slide img{width:100%;height:100%;object-fit:cover}
.hero-slider:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,40,61,.04) 45%,rgba(6,40,61,.48));pointer-events:none}
.slider-arrow{position:absolute;z-index:4;top:50%;transform:translateY(-50%);width:43px;height:43px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(6,40,61,.52);color:#fff;font-size:22px;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(4px)}
.slider-arrow:hover{background:#087ea4}
.slider-arrow.prev{left:17px}.slider-arrow.next{right:17px}
.slider-dots{position:absolute;z-index:4;left:50%;bottom:22px;transform:translateX(-50%);display:flex;gap:8px}
.dot{width:10px;height:10px;padding:0;border:1px solid #fff;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer}
.dot.active{background:#fff;transform:scale(1.2)}
.hero-slider .hero-badge{position:absolute;z-index:4;left:22px;bottom:18px;background:rgba(255,255,255,.93);color:var(--navy);padding:9px 14px;border-radius:999px;font-weight:800;font-size:12px;box-shadow:0 10px 24px rgba(0,0,0,.12)}

/* Footer social icons */
.footer-social{display:flex;gap:10px;margin-top:18px}
.footer-social a{width:38px;height:38px;border:1px solid rgba(255,255,255,.18);border-radius:50%;display:grid;place-items:center;color:#dff9fc;font-size:15px;transition:.2s}
.footer-social a:hover{background:#16b7d6;border-color:#16b7d6;color:#fff;transform:translateY(-2px)}
.footer .contact i{margin-right:7px;color:#16b7d6}
.footer-grid p a i{margin-right:7px;color:#16b7d6}

@media(max-width:1000px){.top-contact{gap:13px}.top-contact a{font-size:12px}.top-social>span{display:none}}
@media(max-width:760px){.topbar-inner{align-items:flex-start;flex-direction:column;padding:9px 0}.top-contact{width:100%;justify-content:space-between;gap:8px;flex-wrap:wrap}.top-contact a{font-size:11px}.top-contact a:first-child{width:100%}.top-social{position:absolute;right:4%;top:10px}.top-contact a:nth-child(2),.top-contact a:nth-child(3){padding-right:2px}.hero-card{min-height:320px}.hero-slider{height:320px}}
@media(max-width:600px){.top-contact{display:grid;grid-template-columns:1fr 1fr}.top-contact a:first-child{grid-column:1/-1}.top-contact a{font-size:10.5px}.top-social{display:none}.hero-card{min-height:300px}.hero-slider{height:300px}.hero-slider .hero-badge{left:13px;bottom:15px;font-size:10px}.slider-arrow{width:38px;height:38px;font-size:18px}.slider-arrow.prev{left:10px}.slider-arrow.next{right:10px}}
