*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;background:#f4fbf7;color:#073b78;overflow-x:hidden}a{text-decoration:none;color:inherit}.container{width:min(1120px,calc(100% - 32px));margin:auto}.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.97);border-bottom:1px solid #dbece4}.header-inner{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px}.brand-mark{width:40px;height:40px;border:2px solid #0757a6;border-radius:50%;display:grid;place-items:center;font-weight:900}.brand strong{display:block;font-size:18px;font-weight:900}.brand small{display:block;margin-top:3px;font-size:10px;font-weight:900;letter-spacing:1.3px}.nav{display:flex;gap:26px;font-size:16px;font-weight:800;align-items:center}.nav a:hover{color:#18a66b}.header-wa{padding:12px 19px;border-radius:999px;background:#18a66b;color:#fff;font-size:14px;font-weight:800}.hero{padding:90px 0;background:linear-gradient(135deg,#eaf9f1,#dceeff)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:55px;align-items:center}.eyebrow{font-size:11px;letter-spacing:2px;color:#168453;font-weight:800}.hero h1,.section h2{font-size:clamp(44px,6vw,72px);line-height:1.02;margin:18px 0;font-weight:900;letter-spacing:-2px}.hero h1 em,.section h2 em{color:#18a66b;font-style:normal}.hero-text,.section-text{font-size:17px;line-height:1.75;color:#55708e;max-width:650px}.actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}.btn{padding:14px 20px;border-radius:999px;font-weight:800;font-size:13px}.primary{background:#18a66b;color:#fff}.secondary{border:1px solid #0757a6;color:#0757a6}.portrait{background:#fff;border-radius:28px;padding:18px;box-shadow:0 20px 55px rgba(7,59,120,.12)}.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:22px;display:block}.section{padding:90px 0}.soft{background:#eaf7f0}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:45px}.card,.benefit,.testimonial{background:#fff;border:1px solid #dcebe5;border-radius:18px;padding:25px}.card{min-height:220px}.icon{font-size:28px}.card h3{font-size:20px;margin:25px 0 10px}.card p,.benefit p,.testimonial p,.faq p{font-size:15px;line-height:1.7;color:#55708e}.benefits,.testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}.benefit h3{font-size:19px}.testimonial strong{display:block;margin-top:18px}.faq{max-width:850px;margin:40px auto}.faq details{background:#fff;border:1px solid #dcebe5;border-radius:14px;padding:18px 20px;margin:12px 0}.faq summary{cursor:pointer;font-weight:800;color:#0757a6}.faq p{padding-top:12px}.socials{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:40px}.social{background:#fff;padding:24px;border:1px solid #dcebe5;border-radius:18px;font-weight:800}.contact-box{background:linear-gradient(135deg,#e3f5eb,#e4f0fb);padding:45px;border-radius:24px;display:grid;grid-template-columns:1fr 280px;gap:40px}.contact-info{margin-top:28px;line-height:2;color:#55708e}.contact-info strong{color:#073b78}.qr{text-align:center}.qr img{width:150px;height:150px;background:#fff;border-radius:10px}footer{padding:30px;background:#0757a6;color:#fff;text-align:center;font-size:12px}.floating{position:fixed;right:18px;bottom:18px;z-index:200;display:flex;flex-direction:column;gap:9px}.floating a{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:21px;box-shadow:0 8px 25px rgba(0,0,0,.15)}.call{background:#0757a6}.wa{background:#18a66b}.map{width:100%;height:220px;border:0;border-radius:18px;margin-top:25px}@media(max-width:850px){.nav,.header-wa{display:none}.hero-grid{grid-template-columns:1fr}.grid4{grid-template-columns:1fr 1fr}.benefits,.testimonials,.socials{grid-template-columns:1fr}.contact-box{grid-template-columns:1fr}}@media(max-width:600px){.hero{padding:65px 0}.hero h1,.section h2{font-size:43px}.hero-text,.section-text{font-size:16px}.grid4{grid-template-columns:1fr}.section{padding:70px 0}.brand strong{font-size:17px!important}.brand small{font-size:10px!important}.card p,.benefit p,.testimonial p,.faq p{font-size:15px!important}.contact-box{padding:28px 22px}}
/* LARGE MOBILE NAVIGATION */
.menu-toggle{display:none;border:0;background:#0757a6;color:#fff;width:46px;height:46px;border-radius:11px;font-size:27px;cursor:pointer;line-height:1}
.mobile-menu{display:none;position:fixed;top:70px;left:0;right:0;z-index:999;background:#fff;border-bottom:1px solid #dbece4;box-shadow:0 14px 35px rgba(7,59,120,.16);padding:10px 16px}
.mobile-menu.open{display:block}
.mobile-menu a{display:block;padding:18px 12px;font-size:20px!important;font-weight:800;color:#073b78;border-bottom:1px solid #e8f0ed}
.mobile-menu a:last-child{border-bottom:0}
@media(max-width:850px){
 .menu-toggle{display:block}
 .nav,.header-wa{display:none!important}
 .mobile-menu{top:70px}
 .mobile-menu a{font-size:20px!important;padding:18px 12px!important}
}

/* FLOATING ACTION ICONS */
.floating a{font-size:22px!important}

.floating a svg{width:23px;height:23px;display:block}

/* VISIBLE FLOATING CALL / WHATSAPP ANIMATION */
.floating a{
  position:relative;
  animation:floatBounce 1.8s ease-in-out infinite;
  transform-origin:center;
}
.floating a::after{
  content:"";
  position:absolute;
  inset:-6px;
  border:2px solid currentColor;
  border-radius:50%;
  animation:floatRing 1.8s ease-out infinite;
  pointer-events:none;
}
.floating .wa{
  animation-delay:.9s;
}
.floating .wa::after{
  animation-delay:.9s;
}
@keyframes floatBounce{
  0%,100%{transform:scale(1) translateY(0)}
  15%{transform:scale(1.16) translateY(-2px)}
  30%{transform:scale(1) translateY(0)}
  45%{transform:scale(1.10)}
  60%{transform:scale(1)}
}
@keyframes floatRing{
  0%{transform:scale(.85);opacity:.75}
  70%{transform:scale(1.55);opacity:0}
  100%{transform:scale(1.55);opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .floating a,.floating a::after{animation:none}
}

/* SERVICE CARD HOVER EFFECT */
#services .card,
#services-grid .card{
  position:relative;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  cursor:pointer;
}
#services .card:hover,
#services-grid .card:hover{
  transform:translateY(-8px);
  border-color:#18a66b;
  box-shadow:0 16px 35px rgba(7,59,120,.14);
}
#services .card .icon,
#services-grid .card .icon{
  display:inline-block;
  transition:transform .28s ease;
}
#services .card:hover .icon,
#services-grid .card:hover .icon{
  transform:scale(1.15);
}
/* Social Media Brand Hover Colors */

.social{
  transition: all .25s ease;
}

.social:nth-child(1):hover{
  color:#1877F2;
  border-color:#1877F2;
}

.social:nth-child(2):hover{
  color:#E4405F;
  border-color:#E4405F;
}

.social:nth-child(3):hover{
  color:#FF0000;
  border-color:#FF0000;
}

.social:nth-child(4):hover{
  color:#0A66C2;
  border-color:#0A66C2;
}

/* ABOUT TEXT ANIMATION */

#about .reveal,
#about h2,
#about h3,
#about p {
  opacity: 0;
  transform: translateY(25px);
  transition: opacity .7s ease, transform .7s ease;
}

#about .reveal.show,
#about h2.show,
#about h3.show,
#about p.show {
  opacity: 1;
  transform: translateY(0);
}

/* GOOGLE MAP - RESPONSIVE WIDE */
.map{
  display:block;
  width:100%;
  height:420px;
  border:0;
  border-radius:18px;
  margin-top:25px;
}

@media (min-width:851px){
  .map{
    width:100%;
    min-height:460px;
  }
}

@media (max-width:850px){
  .map{
    width:100%;
    height:360px;
    min-height:360px;
    border-radius:14px;
  }
}
/* FINAL WORKING MOBILE MENU */
.menu-toggle{
  display:none;
  width:48px;
  height:48px;
  padding:0;
  border:0;
  border-radius:10px;
  background:#0757a6;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  flex-shrink:0;
}
.menu-toggle span{
  display:block;
  width:25px;
  height:3px;
  border-radius:3px;
  background:#fff;
  transition:transform .25s ease,opacity .2s ease;
}
.menu-toggle.active span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

.mobile-menu{
  display:none;
  position:fixed;
  top:76px;
  left:0;
  right:0;
  z-index:99999;
  background:#fff;
  border-top:1px solid #dbece4;
  border-bottom:1px solid #dbece4;
  box-shadow:0 14px 35px rgba(7,59,120,.16);
  padding:8px 16px 12px;
}
.mobile-menu.open{display:block}
.mobile-menu a{
  display:block;
  padding:17px 12px;
  font-size:19px !important;
  font-weight:800;
  color:#073b78;
  border-bottom:1px solid #e8f0ed;
}
.mobile-menu a:last-child{border-bottom:0}
.mobile-menu a:hover{color:#18a66b}

@media(max-width:850px){
  .header-inner{height:76px}
  .site-header .nav,
  .site-header .header-wa{display:none !important}
  .site-header .menu-toggle{display:flex !important}
}

@media(max-width:600px){
  .menu-toggle{width:46px;height:46px}
  .mobile-menu{top:76px}
}