
:root{
  --pool-blue: #00A8E8;
  --pool-blue-2: #007EA7;
  --sun-yellow: #FFC30B;
  --dark-blue: #003459;
}

html{scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif; color:#2b2b2b}

.brand-logo{height:auto; width: 100%; max-width: 250px;}

.brand-logo.small{height:auto; width: 100%; max-width: 150px;}

.brand-text{letter-spacing:0.5px;color:var(--dark-blue)}

.navbar .nav-link{font-weight:500}
.navbar .btn-sun{border-radius:999px}

.hero-section{
  padding-top:10rem; 
  padding-bottom:5rem;
  background: linear-gradient(135deg, var(--pool-blue), var(--pool-blue-2));
  position:relative;
}
.hero-image-wrapper{transform:translateZ(0)}
.hero-img{border:6px solid rgba(255,255,255,.3)}
.text-sun{color:var(--sun-yellow)}
.btn-sun{
  background: var(--sun-yellow);
  border-color: var(--sun-yellow);
  color:#1b1b1b;
}
.btn-sun:hover{filter:brightness(.95); color:#1b1b1b}
.btn-gradient{
  background: linear-gradient(135deg, var(--pool-blue), var(--pool-blue-2));
  border:0;
}
.btn-gradient:hover{filter:brightness(.95)}

.hero-badges .badge-item{
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(2px);
  border:1px solid rgba(255,255,255,.25);
  color:#fff; padding:.5rem .75rem; border-radius:999px; font-size:.9rem;
}
.hero-badges i{margin-right:.4rem}
.hero-wave{position:absolute; bottom:0; left:0; width:100%; height:110px}

.feature-card{
  text-align:center; background:#fff; border-radius:16px; padding:1rem; height:100%;
  border:1px solid #eef2f6; transition:.2s transform ease, .2s box-shadow ease;
}
.feature-card:hover{transform:translateY(-3px); box-shadow:0 8px 24px rgba(0,0,0,.08)}
.feature-card i{font-size:1.6rem; color:var(--pool-blue)}
.feature-card h3{font-size:1rem; margin-top:.5rem}

.card img{object-fit:cover; height:220px}

.cta-section{
  background: linear-gradient(135deg, var(--pool-blue-2), var(--dark-blue));
  border-top: 4px solid var(--sun-yellow);
  border-bottom: 4px solid var(--sun-yellow);
}

footer{background:#fff}

.whatsapp-float{
  position:fixed; bottom:16px; right:16px; width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#25D366; color:#fff; font-size:1.8rem; box-shadow:0 8px 24px rgba(0,0,0,.2);
  z-index:1040; text-decoration:none;
}
.whatsapp-float:hover{transform:translateY(-2px); color:#fff}

.carousel .blockquote{font-size:1.25rem}
.carousel .blockquote-footer{color:#6c757d}

/* Accessibility focus */
a:focus, button:focus, .btn:focus{outline:3px solid var(--sun-yellow); outline-offset:2px}

/* Utility */
.shadow-soft{box-shadow:0 10px 30px rgba(0,0,0,.06)}
