/* style.css — Professional clean theme (White + Teal + Blue)
   - Uses Inter font (loaded from Google Fonts)
   - Clear hierarchy, trust-building visuals
*/

:root{
  --bg: #f7fbfc;
  --card: #ffffff;
  --text: #0f1724;
  --muted: #6b7280;
  --accent-1: #007bff; /* blue */
  --accent-2: #00a69c; /* teal */
  --accent-3: #0ea5a4;
  --radius: 12px;
  --max-w: 1200px;
  --container-padding: 20px;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  font-weight: 400;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background: linear-gradient(180deg, var(--bg) 0%, #ffffff 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
  font-size:16px;
}

.container{max-width:var(--max-w);margin:0 auto;padding:0 var(--container-padding)}

a{color:var(--accent-1);text-decoration:none}
a:hover{text-decoration:underline}

/* Header */
.site-header{position:sticky;top:0;z-index:80;background:rgba(255,255,255,0.85);backdrop-filter:blur(6px);border-bottom:1px solid rgba(15,23,36,0.04)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.brand-logo{width:58px;height:58px;border-radius:10px;object-fit:cover;box-shadow:0 8px 24px rgba(3,105,161,0.08)}
.brand-name{font-weight:700;font-size:18px}
.brand-tag{font-size:13px;color:var(--muted)}

/* Nav */
.nav-toggle{display:none;background:transparent;border:0;font-size:18px}
.nav-list{list-style:none;display:flex;gap:18px;margin:0;padding:0;align-items:center}
.nav-list a{font-weight:600;color:var(--text)}

/* Hero */
.hero {
  background: url("images/hero.jpg") center/cover no-repeat;
}

.hero{position:relative;padding:72px 0;display:flex;align-items:center;overflow:hidden}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(120deg, rgba(0,123,255,0.08), rgba(0,165,148,0.06));pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1fr 420px;gap:26px;align-items:center}
.hero-copy{max-width:58ch}
.eyebrow{display:inline-block;background:linear-gradient(90deg, rgba(0,123,255,0.12), rgba(0,165,148,0.08));padding:6px 10px;border-radius:999px;color:var(--accent-2);font-weight:700;font-size:13px}
h1{font-size:36px;margin:14px 0 8px}
.lead{color:var(--muted);margin-bottom:16px}
.hero-cta{display:flex;gap:12px;align-items:center;margin-bottom:18px}
.btn{display:inline-block;padding:10px 16px;border-radius:10px;font-weight:700;cursor:pointer;border:0}
.btn-primary{background:linear-gradient(90deg,var(--accent-1),var(--accent-2));color:white;box-shadow:0 10px 30px rgba(0,122,204,0.12)}
.btn-ghost{background:transparent;border:1px solid rgba(15,23,36,0.06);color:var(--text)}

/* Trust row */
.trust-row{display:flex;align-items:center;gap:18px;margin-top:8px;flex-wrap:wrap}
.badge{display:flex;align-items:center;gap:10px;background:linear-gradient(180deg,#fff,#f8fffe);padding:8px 10px;border-radius:10px;box-shadow:0 6px 18px rgba(2,6,23,0.04)}
.badge-icon{display:block}
.badge-title{font-weight:700}
.badge-sub{font-size:13px;color:var(--muted)}
.contact-quick a{margin-left:8px;color:var(--muted);font-weight:600}

/* Media card */
.media-card{border-radius:12px;overflow:hidden;box-shadow:0 12px 30px rgba(2,6,23,0.06);background:var(--card)}
.media-img{width:100%;height:280px;object-fit:cover;display:block}
.media-caption{padding:12px}

/* Sections */
.section{padding:64px 0}
.section-heading h2{font-size:24px;color:var(--accent-1);margin-bottom:6px}
.muted{color:var(--muted)}

.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:18px;padding:0;list-style:none}
.service-card{background:var(--card);border-radius:12px;padding:18px;box-shadow:0 10px 30px rgba(2,6,23,0.04);display:flex;flex-direction:column;gap:10px;transition:transform .28s ease,box-shadow .28s ease}
.service-card:hover{transform:translateY(-8px);box-shadow:0 22px 50px rgba(2,6,23,0.08)}
.service-icon{width:100%;height:140px;object-fit:cover;border-radius:8px}

/* Why / two-col */
.why-grid{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start}
.why-cards{display:grid;grid-template-columns:repeat(1,1fr);gap:12px}
.icon-card{background:linear-gradient(90deg,#fff,#fbfeff);padding:14px;border-radius:12px;box-shadow:0 8px 24px rgba(2,6,23,0.04)}
.testimonial{background:linear-gradient(90deg,#f0fbff,#fff);padding:18px;border-radius:12px;box-shadow:0 8px 24px rgba(2,6,23,0.04)}

/* About */
.about-grid{display:grid;grid-template-columns:420px 1fr;gap:28px;align-items:center}
.about-image{width:100%;height:320px;object-fit:cover;border-radius:12px;box-shadow:0 12px 30px rgba(2,6,23,0.06)}
.about-list{margin-top:12px;color:var(--muted)}
.awards{margin-top:12px;display:flex;gap:10px}
.award{background:linear-gradient(90deg,#eefaf9,#ffffff);padding:8px 12px;border-radius:999px;font-weight:700;color:var(--accent-2)}

/* Contact grid */
.contact-grid{display:grid;grid-template-columns:1fr 420px;gap:24px;align-items:start}
.contact-card{background:var(--card);padding:16px;border-radius:12px;box-shadow:0 12px 30px rgba(2,6,23,0.04)}
.contact-form input, .contact-form textarea{width:100%;padding:12px;border-radius:8px;border:1px solid rgba(15,23,36,0.06);margin-bottom:10px;font-size:15px}
.form-actions{display:flex;gap:8px;align-items:center}
.map-card{background:var(--card);border-radius:12px;padding:0;overflow:hidden;box-shadow:0 12px 30px rgba(2,6,23,0.04)}
.map-card iframe{width:100%;height:260px;border:0}

/* Footer */
.site-footer{background:linear-gradient(90deg,#0ea5a4,#007bff);color:white;padding:18px 0;margin-top:28px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:12px}
.footer-left p{margin:0}
.socials a{color:rgba(255,255,255,0.9);text-decoration:none}

/* FAB */
.fab{position:fixed;right:18px;bottom:18px;z-index:120}
.fab-btn{background:linear-gradient(90deg,var(--accent-1),var(--accent-2));color:white;padding:12px 14px;border-radius:999px;border:0;box-shadow:0 12px 30px rgba(3,105,161,0.14);cursor:pointer;font-weight:700}
.fab-menu{display:none;margin-top:8px;background:var(--card);padding:8px;border-radius:12px;box-shadow:0 12px 30px rgba(2,6,23,0.06)}
.fab-item{display:block;padding:8px 10px;border-radius:8px;color:var(--text);font-weight:700;margin-bottom:6px}

/* Accessibility */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Animations & Reveal */
@keyframes floatIn {from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.reveal {opacity:0;transform:translateY(18px) scale(.98);transition:opacity .7s ease, transform .7s ease}
.reveal.revealed {opacity:1;transform:none}

/* Responsive */
@media (max-width:1000px){
  .hero-grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .nav-toggle{display:block}
  .nav-list{position:absolute;right:16px;top:68px;background:var(--card);padding:12px;border-radius:8px;box-shadow:0 12px 30px rgba(2,6,23,0.06);display:none;flex-direction:column}
  .nav-list.show{display:flex}
}

@media (max-width:520px){
  h1{font-size:28px}
  .brand-logo{width:48px;height:48px}
  .media-img{height:200px}
}







/* =======================
   FIXED FOOTER STYLE
   ======================= */
/* Footer styling */
.footer {
  background: #0b0b0d;
  color: #fff;
  padding: 50px 20px;
  position: relative;
}

.footer-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 30px;
  max-width: 1200px;
  margin: auto;
}

.footer-column h3 {
  color: #fff;
  margin-bottom: 10px;
  border-bottom: 2px solid #ff5c5c;
  display: inline-block;
  padding-bottom: 5px;
}

.footer-column a {
  display: block;
  color: #ccc;
  text-decoration: none;
  margin-bottom: 6px;
}

.footer-column a:hover {
  color: #ff5c5c;
}

/* Social buttons */
.social-links {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.social-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: white;
  text-decoration: none;
  transition: 0.3s;
}

.facebook { background: #1877f2; }
.instagram { background: #e4405f; }
.youtube { background: #ff0000; }

.social-btn:hover {
  opacity: 0.85;
  transform: translateY(-3px);
}


/* WhatsApp floating button */
.whatsapp-btn {
  position: fixed;
  right: 18px;
  bottom: 18px;
  background: #25d366;
  color: #fff;
  font-size: 26px;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
  text-decoration: none;
  z-index: 999;
}

.whatsapp-btn:hover {
  background: #20b858;
}

/* Mobile friendly */
@media (max-width: 768px) {
  .footer-container {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .social-links {
    justify-content: center;
  }
}







<style>
.no-bullets,
.no-bullets ul,
.no-bullets li,
.about-us ul,
.about-us li {
  list-style-type: none !important;
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  background: none !important;
}

.about-us li::marker {
  content: "" !important;
}

.about-us ul {
  padding-inline-start: 0 !important;
  margin-inline-start: 0 !important;
}
