:root{
  --primary:#096e66;
  --accent:#1ab99c;
  --text:#183a37;
  --bg:#f7fcfb;
}

html{scroll-behavior:smooth}
body{
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
  color:var(--text);
  background:var(--bg);
}

/* Top bar */
.topbar{
  background:var(--primary);
  color:#fff;
  font-size:.95rem
}
.topbar a{color:#eafff7; text-decoration:none}
.topbar i{opacity:.9}

/* Header + Navbar */
.header .brand-title{color:var(--primary); font-weight:800; letter-spacing:.5px}
.header .brand-sub{color:#59847f}
.header .btn-accent{background:var(--accent); color:#083b36; border:none}
.header .btn-accent:hover{filter:brightness(.95); color:#062f2b}

.navbar{box-shadow:0 6px 24px rgba(9,110,102,.08)}
.navbar .nav-link{font-weight:600}
.navbar .nav-link.active, .navbar .nav-link:hover{color:var(--primary)}
.navbar .navbar-brand{color:var(--primary) !important}
/* make sticky transition nicer */
.sticky-top {
  transition: box-shadow .2s ease, background .2s ease;
}

/* Hero / Carousel */
#home .carousel .carousel-item img{
  object-fit: cover;
  height: 68vh;
  min-height: 380px;
}
.carousel-caption{
  backdrop-filter: blur(4px);
  background: rgba(0,0,0,.35);
  border-radius: 1rem;
  padding: 1rem 1.25rem;
}
.carousel-caption h2{font-weight:800}
.carousel-caption p{font-weight:400}

/* Sections */
.section{padding:80px 0}
.section-title{font-weight:900; color:var(--primary); letter-spacing:.2px}
.section-underline{
  width:96px; height:4px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  border-radius:8px
}

/* Cards / Services */
.service-card{transition:transform .2s ease, box-shadow .2s ease; border:none; border-radius:1rem}
.service-card:hover{transform:translateY(-6px); box-shadow:0 18px 48px rgba(9,110,102,.18)}
.icon-bubble{
  display:inline-flex; align-items:center; justify-content:center;
  width:56px; height:56px; border-radius:50%;
  background:linear-gradient(135deg,var(--accent),#7de3d1);
  color:#053a35; font-size:1.35rem;
  box-shadow:0 6px 16px rgba(26,185,156,.35)
}

.icon-bubble-about{
  display:inline-flex; align-items:center; justify-content:center;
  width:120px; height:56px; border-radius:50%;
  background:linear-gradient(135deg,var(--accent),#7de3d1);
  color:#053a35; font-size:1.35rem;
  box-shadow:0 6px 16px rgba(26,185,156,.35)
}

/* Gallery */
.gallery img{border-radius:1rem; aspect-ratio: 4/3; object-fit:cover; width:100%; height:auto}
.gallery img:hover{transform:scale(1.01); transition:.15s ease; box-shadow:0 12px 30px rgba(0,0,0,.15)}

/* Contact */
.contact-card{border:0; border-radius:1rem; box-shadow:0 12px 36px rgba(9,110,102,.12)}
.form-control:focus{border-color:var(--accent); box-shadow:0 0 0 .2rem rgba(26,185,156,.25)}

/* Footer */
footer{background:#0a5d57; color:#e6fffb}
footer a{color:#bff2e7; text-decoration:none}
footer a:hover{text-decoration:underline}
.copyright{background:#084f49; color:#d6fff7}

/* Utilities */
.bg-accent-soft{background:linear-gradient(180deg, rgba(26,185,156,.08), rgba(9,110,102,.03))}

/* Floating Call Button (optional) — only shows on mobile/tablet */
.call-now-btn {
  position: fixed !important;
  bottom: 96px;
  right: 18px;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  text-decoration: none;
  font-size: 24px;
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
  z-index: 2147483647;
  pointer-events: auto;
  transition: transform .15s ease, background .15s ease;
}
.call-now-btn:hover { background: var(--accent); transform: scale(1.04); }
@media (min-width: 1024px) {
  .call-now-btn { display: none; }
}

/* Responsive tweaks */
@media (max-width: 991.98px){
  #home .carousel .carousel-item img{height: 56vh}
  .section{padding:64px 0}
}
@media (max-width: 575.98px){
  .topbar{font-size:.9rem}
  .header .brand-title{font-size:1.4rem}
  .carousel-caption{padding:.75rem 1rem}
}








/* Contact section polish */
.contact-section{
  background:
    radial-gradient(1200px 1200px at -10% 10%, rgba(26,185,156,.08), transparent 55%),
    radial-gradient(1000px 1000px at 110% -10%, rgba(9,110,102,.05), transparent 45%),
    #f7fcfb;
}

.contact-card.luxe{
  border: 1px solid rgba(9,110,102,.08);
  border-radius: 1rem;
  box-shadow: 0 12px 40px rgba(9,110,102,.10);
  background: #fff;
}

.link-contrast{
  color: var(--text);
  text-decoration: none;
}
.link-contrast:hover{ color: var(--primary); }

.mini-icon{
  width: 40px; height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg,var(--accent),#7de3d1);
  color:#053a35; display:inline-flex; align-items:center; justify-content:center;
  box-shadow: 0 6px 16px rgba(26,185,156,.25);
  font-size: 18px;
}

.btn-soft{
  border-color: var(--accent) !important;
  color: var(--primary) !important;
}
.btn-soft:hover{
  background: rgba(26,185,156,.1) !important;
}

.form-control-lg{
  border-radius: .8rem;
  padding: .8rem 1rem;
}

/* Map shell spacing (keeps map independent of the card) */
.map-shell{ box-shadow: 0 16px 40px rgba(0,0,0,.08) !important; }













/* Footer styling */
.footer{
  background:#0a5d57; /* base */
  color:#e6fffb;
  position: relative;
  overflow: hidden;
}
.footer::before{
  /* soft top glow */
  content:"";
  position:absolute; inset:-20% -40% auto -40%;
  height:160px;
  background: radial-gradient(600px 120px at 50% 100%, rgba(26,185,156,.25), transparent 60%);
  pointer-events:none;
}
.footer a{ color:#bff2e7; text-decoration:none }
.footer a:hover{ color:#ffffff; text-decoration:underline }

.footer-brand{
  font-weight:800; letter-spacing:.3px; color:#ffffff;
}
.footer-title{
  font-weight:700; color:#e6fffb; margin-bottom:.5rem;
}
.text-footer{ color:#cdeee6 }
.text-accent{ color:var(--accent) }

.badge-soft{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.35rem .6rem; border-radius:999px;
  background:rgba(26,185,156,.12); border:1px solid rgba(26,185,156,.35);
  color:#eafff7; font-size:.9rem;
}
.badge-soft:hover{
  background:rgba(26,185,156,.18);
  text-decoration:none;
}

.link-map{ color:#bff2e7 }
.link-map:hover{ color:#fff }

.social-btn{
  width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 6px 16px rgba(0,0,0,.15);
  font-size:18px;
}
.social-btn:hover{
  background:rgba(26,185,156,.25);
  border-color:rgba(26,185,156,.6);
}

.footer-hr{
  border:0; height:2px;
  background:linear-gradient(90deg, transparent, rgba(191,242,231,.6), transparent);
}



#callme {
    position: fixed;
    right: 10px;
   
    width: 70px;
    height: 70px;
    cursor: pointer;
    top:190px;
    z-index: 999999999;
}
#callme #callmeMain {
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    border-radius: 50% !important;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: rgb(207,8,8);
    width: 70px;
    height: 70px;
    -webkit-animation: zcwmini2 1.5s 0s ease-out infinite;
    -moz-animation: zcwmini2 1.5s 0s ease-out infinite;
    animation: zcwmini2 1.5s 0s ease-out infinite;
}
#callme #callmeMain:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image:url(https://ss.zadarma.com/callbackWidget/images/mini.png);
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-animation: zcwphone2 1.5s linear infinite;
    -moz-animation: zcwphone2 1.5s linear infinite;
    animation: zcwphone2 1.5s linear infinite;
}
@-webkit-keyframes zcwphone {
    0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
    50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
    100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-moz-keyframes zcwphone {
    0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
    50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
    100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@keyframes zcwphone {
    0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
    50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
    100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-webkit-keyframes zcwphone2 {
    0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
    50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
    100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-moz-keyframes zcwphone2 {
    0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
    50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
    100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@keyframes zcwphone2 {
    0% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    25% {-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
    50% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
    75% {-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
    100% {-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-webkit-keyframes zcwmini {
    0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
    10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
    100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@-moz-keyframes zcwmini {
    0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
    10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
    100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@keyframes zcwmini {
    0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
    10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
    100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@-webkit-keyframes zcwmini2 {
    0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
    10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
    100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@-moz-keyframes zcwmini2 {
    0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
    10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
    100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@keyframes zcwmini2 {
    0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
    10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
    100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}

