*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

:root{
  --accent:#1eaae2;
  --text:#374151;
  --bg:#0f172a;
}

body{
  font-family:Inter, sans-serif;
  background:var(--bg);
  overflow-x:hidden;
}

/* NAVBAR */

.navbar{
position:fixed;
top:20px;
left:50%;
transform:translateX(-50%);

width:100%;
display:flex;
justify-content:center;

z-index:1000;

transition:all .3s ease;
}

.nav-container{
  width:min(92%,1400px);
  margin:auto;
  background:white;
  padding:clamp(12px,1.2vw,18px) clamp(20px,2vw,35px);
  border-radius:50px;
text-decoration: none;
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:clamp(12px,2vw,30px);

  box-shadow:0 10px 30px rgba(0,0,0,0.15);
  position:relative;
}

.desktop-nav{
  display:flex;
  gap:clamp(16px,2vw,34px);
  align-items:center;
  flex-wrap:nowrap;
	text-decoration: none;
}

.desktop-nav a{
  font-size:clamp(14px,0.9vw,16px);
  white-space:nowrap;
	
text-decoration: none;
	color: black;
}

.contact-btn{
  color:white;
  
  border-radius:25px;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  background:linear-gradient(180deg, #49c5f6 0%, #1eaae2 100%);
  transition:box-shadow .25s ease, transform .25s ease;
	
padding:clamp(8px,0.8vw,10px) clamp(16px,1.4vw,22px);
font-size:clamp(13px,0.9vw,15px);

}

.contact-btn:hover{
  box-shadow:0 12px 28px rgba(30,170,226,0.45);
  transform:translateY(-2px);
}

/* HAMBURGER / LOGO BUTTON */

.menu-toggle{
  position:fixed;
  top:9px;
  left:50%;
  transform:translateX(-50%);
  width:56px;
  height:56px;
  border-radius:50%;
  background:white;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  cursor:pointer;
  z-index:1002;
  overflow:visible;

  /* na začiatku bez tieňa a bez pulsu */
  box-shadow:none;
  animation:none;

  transition:transform .25s ease, box-shadow .25s ease;
}

.menu-toggle.is-ready:hover{
  transform:translateX(-50%) scale(1.12);
  box-shadow:0 12px 30px rgba(0,0,0,0.35);
}

.menu-toggle.is-ready{
  box-shadow:0 8px 25px rgba(0,0,0,0.25);
  animation:pulseRing 2.2s infinite, pulseCircle 2.2s infinite;
}

.menu-toggle:active{
  transform:translateX(-50%) scale(1.05);
}

.menu-toggle.pulse-stopped{
  animation:none !important;
  box-shadow:0 8px 25px rgba(0,0,0,0.25);
}

body.menu-open .menu-toggle{
  animation:none !important;
  box-shadow:0 8px 25px rgba(0,0,0,0.25);
}

/* IMPORTANT: no shared fixed width here */
.menu-toggle img{
  position:absolute;
  height:auto;
  display:block;
  transition:opacity .6s ease, transform .6s ease;
}

/* first logo bigger */
.menu-logo{
  width:134px;
  opacity:1;
  transform:scale(1);
}

/* hamburger smaller */
.menu-icon{
  width:32px;
  opacity:0;
  transform:scale(0.55);
}

.menu-toggle.show-hamburger .menu-logo{
  opacity:0;
  transform:scale(0.35);
}

.menu-toggle.show-hamburger .menu-icon{
  opacity:1;
  transform:scale(1);
}

/* MOBILE / OVERLAY MENU */

.mobile-menu{
  display:block;
  position:fixed;
  inset:0;
  background:rgba(5,14,35,0.48);
  backdrop-filter:blur(10px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, visibility .3s ease;
  z-index:1000;
}

.mobile-menu.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.mobile-menu-inner{
  width:min(88vw, 360px);
  margin:106px auto 0;
  background:rgba(9,20,48,0.88);
  border:1px solid rgba(255,255,255,0.08);
  backdrop-filter:blur(18px);
  border-radius:28px;
  padding:28px 24px 24px;
  box-shadow:0 30px 80px rgba(0,0,0,0.35);
  text-align:center;
}

.mobile-nav{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:24px;
}

.mobile-nav-link,
.mobile-services-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:56px;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.08);
  color:#fff;
  text-decoration:none;
  font-size:1.08rem;
  font-weight:700;
  opacity:0.96;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
}

.mobile-nav-link{
  justify-content:flex-start;
}

.mobile-services-dropdown{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.mobile-services-toggle{
  border:none;
  cursor:pointer;
  background:rgba(255,255,255,0.06);
  font-family:inherit;
}

.mobile-services-chevron{
  width:18px;
  height:18px;
  flex-shrink:0;
  transition:transform .28s ease, opacity .28s ease;
  opacity:.9;
}

.mobile-services-dropdown.is-open .mobile-services-chevron{
  transform:rotate(180deg);
}

.mobile-services-submenu{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transform:translateY(-6px);
  transition:grid-template-rows .32s ease, opacity .24s ease, transform .24s ease;
}

.mobile-services-submenu > *{
  overflow:hidden;
}

.mobile-services-dropdown.is-open .mobile-services-submenu{
  grid-template-rows:1fr;
  opacity:1;
  transform:translateY(0);
}

.mobile-services-submenu > div{
  min-height:0;
}

.mobile-services-submenu{
  border-radius:22px;
}

.mobile-services-submenu-inner,
.mobile-services-submenu > div{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.mobile-service-link{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.07);
  color:#fff;
  text-decoration:none;
  font-weight:600;
}

.mobile-service-icon{
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,0.08);
  flex-shrink:0;
}

.mobile-service-icon svg{
  width:18px;
  height:18px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.mobile-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:52px;
  padding:14px 18px;
  border-radius:999px;
  background:var(--accent);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  box-shadow:0 14px 34px rgba(30,170,226,0.32);
}

/* HERO */

.hero{
  min-height:100vh;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  padding:140px 20px 80px;
  overflow:hidden;
  background:#06101f;
	padding-top: 50px;
}

.hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
 
}






.hero-card{
  max-width:900px;
  padding:70px 32px;
  text-align:center;
  color:white;
  position:relative;
  z-index:2;
}



.badge{
  display:inline-block;
  background:var(--accent);
  color:white;
  padding:8px 18px;
  border-radius:20px;
  font-size:14px;
  margin-bottom:25px;
}

.hero h1{
  font-size:56px;
  font-weight:800;
  line-height:1.1;
  margin-bottom:20px;
}

.hero h1 span{
  color:var(--accent);
}

.hero p{
  color:white;
  font-size:18px;
  margin-bottom:35px;
}

.buttons{
  display:flex;
  gap:20px;
  justify-content:center;
  flex-wrap:wrap;
}

.btn-primary,
.btn-secondary{
  text-decoration:none;
  border-radius:30px;
  color:white;
  cursor:pointer;
  position:relative;
}

.btn-primary{
  background:linear-gradient(180deg, #49c5f6 0%, #1eaae2 100%);
  padding:15px 30px;
  font-weight:600;
  box-shadow:0 8px 20px rgba(30,170,226,0.35);
}

.btn-secondary{
  background:rgba(255,255,255,0.08);
  padding:15px 30px;
  font-weight:500;
  border:1px solid rgba(255,255,255,0.25);
  backdrop-filter:blur(6px);
  transition:all 0.35s ease;
}

.btn-secondary:hover{
  background:rgba(255,255,255,0.15);
  border:1px solid rgba(73,197,246,0.8);
  transform:translateY(-3px) scale(1.05);
  box-shadow:0 0 15px rgba(73,197,246,0.6), 0 10px 25px rgba(0,0,0,0.25);
}

.btn-secondary::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:30px;
  opacity:0;
  transition:opacity .3s ease;
  background:radial-gradient(circle at center, rgba(73,197,246,0.4), transparent 70%);
}

.btn-secondary:hover::after{
  opacity:1;
}
















/* BUBBLES */

.bubbles{
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  overflow:hidden;
  z-index:0;
}

.bubbles span{
  position:absolute;
  display:block;
  border-radius:50%;
  background:rgba(255,255,255,0.08);
  backdrop-filter:blur(5px);
  animation:float 20s linear infinite;
}

.bubbles span:nth-child(1){width:120px;height:120px;left:10%;bottom:-150px;animation-duration:22s;}
.bubbles span:nth-child(2){width:80px;height:80px;left:25%;bottom:-120px;animation-duration:18s;}
.bubbles span:nth-child(3){width:140px;height:140px;left:50%;bottom:-180px;animation-duration:25s;}
.bubbles span:nth-child(4){width:90px;height:90px;left:70%;bottom:-150px;animation-duration:20s;}
.bubbles span:nth-child(5){width:60px;height:60px;left:85%;bottom:-100px;animation-duration:17s;}

/* SERVICES */

.services{
  background:white;
  padding:80px 0 100px;
}

.services-container{
  width:min(1200px, 90%);
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
}

.service-card{
  background:white;
  padding:40px 30px;
  border-radius:10px;
  text-align:center;
  width:100%;
  box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

.icon{
  width:80px;
  height:80px;
  border-radius:50%;
  border:2px solid #e5ecff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:32px;
  margin:auto auto 20px;
  color:var(--accent);
  background:white;
}

.service-card h3{
  font-size:18px;
  margin-bottom:15px;
}

.service-card p{
  color:#6b7280;
  font-size:14px;
  line-height:1.6;
  margin-bottom:20px;
}

.read-more{
  display:inline-block;
  background:var(--accent);
  color:white;
  padding:10px 18px;
  border-radius:4px;
  font-size:13px;
  cursor:pointer;
  text-decoration:none;
}

/* ANIMATIONS */

@keyframes float{
  0%{transform:translateY(0);}
  100%{transform:translateY(-120vh);}
}

@keyframes pulseRing{
  0%{box-shadow:0 0 0 0 rgba(30,170,226,0.6);}
  70%{box-shadow:0 0 0 18px rgba(30,170,226,0);}
  100%{box-shadow:0 0 0 0 rgba(30,170,226,0);}
}

@keyframes pulseCircle{
  0%{transform:translateX(-50%) scale(1);}
  50%{transform:translateX(-50%) scale(1.05);}
  100%{transform:translateX(-50%) scale(1);}
}

@media (max-width:900px){
  .hero-glass{
    width:min(92vw, 620px);
    height:min(62vh, 520px);
    border-radius:30px;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
}

@media (max-width:650px){
  .hero-glass{
    width:calc(100% - 28px);
    height:min(58vh, 440px);
    border-radius:26px;
  }

  .hero-video{
    object-position:center;
  }
}


  
}


	
	













	

	
	
	
	
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	/* FOOTER */

.site-footer{

background:linear-gradient(180deg,#042247,#031733);

color:white;

padding:80px 0;

}

.footer-inner{

width:90%;

max-width:1300px;

margin:auto;

}

.footer-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:40px;

}

.footer-logo{

width:200px;

margin-bottom:15px;

}

.footer-links{

list-style:none;

}

.footer-links li{

margin-bottom:10px;

}

.footer-links a{

color:white;

text-decoration:none;

opacity:0.8;

}

.footer-links a:hover{

opacity:1;

}

.footer-socials{

display:flex;

gap:10px;

margin-top:15px;

}

.footer-social{

width:40px;

height:40px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

color:white;

text-decoration:none;

}

.fb{background:#4064ac;}
.ig{background:#d63384;}
.yt{background:#ea3323;}
.tk{background:#000;}

.footer-map iframe{

width:100%;

height:150px;

border:none;

border-radius:10px;

}

.footer-bottom{

margin-top:40px;

display:flex;

justify-content:space-between;

align-items:center;

}

.back-to-top{

background:#1eaae2;

color:white;

width:40px;

height:40px;

display:flex;

align-items:center;

justify-content:center;

border-radius:10px;

text-decoration:none;

}
	
	


/* ===== INSPECTION REQUEST FORM ===== */

.inspection-request{
  position:relative;
  padding:110px 20px;
  background:#f8fbff;
    
}

.inspection-shell{
  width:min(1100px, 92%);
  margin:0 auto;
}

.inspection-heading{
  max-width:760px;
  margin:0 auto 34px;
  text-align:center;
}

.inspection-kicker{
  display:inline-block;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(30,170,226,0.12);
  color:#0f5f93;
  font-size:0.85rem;
  font-weight:700;
  letter-spacing:0.04em;
  margin-bottom:14px;
}

.inspection-heading h2{
  margin:0 0 14px;
  font-size:clamp(2rem, 4vw, 3rem);
  line-height:1.05;
  color:#082848;
}

.inspection-heading p{
  margin:0 auto;
  max-width:680px;
  color:#5d6b7d;
  line-height:1.7;
  font-size:1rem;
}

.inspection-card{
  background:rgba(255,255,255,0.94);
  border:1px solid rgba(10, 41, 73, 0.06);
  border-radius:28px;
  padding:38px;
  box-shadow:
    0 18px 55px rgba(10, 33, 61, 0.09),
    0 3px 10px rgba(10, 33, 61, 0.04);
  backdrop-filter:blur(8px);
}

.inspection-form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:24px 22px;
}

.field{
  display:flex;
  flex-direction:column;
}

.field-half{
  grid-column:span 1;
}

.field-full{
  grid-column:1 / -1;
}

.field label{
  margin-bottom:10px;
  font-size:0.98rem;
  font-weight:700;
  color:#0b335a;
  line-height:1.45;
}

.field label span{
  font-weight:500;
  color:#627384;
}

.field input,
.field textarea{
  width:100%;
  border:1px solid #dbe5f0;
  background:#fdfefe;
  color:#0f172a;
  border-radius:18px;
  padding:17px 18px;
  font-size:1rem;
  font-family:inherit;
  outline:none;
  transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}

.field input::placeholder,
.field textarea::placeholder{
  color:#94a3b8;
}

.field input:focus,
.field textarea:focus{
  border-color:#52c7f6;
  box-shadow:0 0 0 4px rgba(30,170,226,0.12);
}

.field textarea{
  min-height:210px;
  resize:vertical;
  line-height:1.7;
}

.file-input{
  display:none;
}

.upload-box{
  display:flex;
  align-items:center;
  gap:18px;
  padding:18px 20px;
  border:1.5px dashed #b8cde1;
  background:linear-gradient(180deg, #f8fcff 0%, #f1f8ff 100%);
  border-radius:22px;
  cursor:pointer;
  transition:border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}

.upload-box:hover{
  border-color:#52c7f6;
  box-shadow:0 10px 26px rgba(30,170,226,0.12);
  transform:translateY(-1px);
}

.upload-icon{
  width:54px;
  height:54px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, #49c5f6 0%, #1eaae2 100%);
  color:white;
  font-size:1.3rem;
  font-weight:800;
  flex-shrink:0;
  box-shadow:0 10px 22px rgba(30,170,226,0.26);
}

.upload-text{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}

.upload-text strong{
  color:#0b335a;
  font-size:1rem;
}

.upload-text small{
  color:#64748b;
  line-height:1.5;
}

.upload-button{
  margin-left:auto;
  flex-shrink:0;
  padding:12px 16px;
  border-radius:999px;
  background:#ffffff;
  border:1px solid #d7e4f0;
  color:#0f5f93;
  font-weight:700;
  font-size:0.93rem;
}

.submit-wrap{
  margin-top:4px;
  display:flex;
  justify-content:center;
}

.inspection-submit{
  border:none;
  border-radius:999px;
  padding:16px 28px;
  min-width:220px;
  font-size:1rem;
  font-weight:700;
  color:#fff;
  cursor:pointer;
  background:linear-gradient(180deg, #49c5f6 0%, #1eaae2 100%);
  box-shadow:0 16px 34px rgba(30,170,226,0.28);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.inspection-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 20px 38px rgba(30,170,226,0.34);
  filter:saturate(1.05);
}

.inspection-submit:active{
  transform:translateY(0);
}

@media (max-width: 820px){
  .inspection-card{
    padding:26px 18px;
    border-radius:22px;
  }

  .inspection-form-grid{
    grid-template-columns:1fr;
    gap:20px;
  }

  .field-half,
  .field-full{
    grid-column:auto;
  }

  .upload-box{
    flex-direction:column;
    align-items:flex-start;
  }

  .upload-button{
    margin-left:0;
  }

  .submit-wrap{
    justify-content:stretch;
  }

  .inspection-submit{
    width:100%;
  }
}



/* ===== GLOBAL PREMIUM BUBBLES ===== */

body{
  position:relative;
  overflow-x:hidden;
}

.global-bubbles{
  position:fixed;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  z-index:3;
  transition:transform .6s ease;
}

.premium-bubble{
  position:absolute;
  border-radius:50%;
  display:block;
  opacity:var(--opacity, 0.18);
  background:
    radial-gradient(circle at 30% 30%,
      rgba(255,255,255,0.65),
      rgba(255,255,255,0.16) 35%,
      rgba(255,255,255,0.06) 60%,
      rgba(255,255,255,0.02) 100%);
  backdrop-filter:blur(var(--blur, 4px));
  -webkit-backdrop-filter:blur(var(--blur, 4px));
  box-shadow:
    inset 0 0 18px rgba(255,255,255,0.18),
    0 0 18px rgba(117,216,255,0.10),
    0 0 40px rgba(117,216,255,0.05);
  animation:premiumBubbleFloat var(--duration, 20s) linear var(--delay, 0s) forwards;
}

.premium-bubble::before{
  content:"";
  position:absolute;
  top:14%;
  right:18%;
  width:28%;
  height:28%;
  border-radius:50%;
  background:rgba(255,255,255,0.42);
  filter:blur(2px);
}

.premium-bubble::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  border:1px solid rgba(255,255,255,0.14);
}

@keyframes premiumBubbleFloat{
  0%{
    transform:translate3d(0,0,0) scale(0.88);
    opacity:0;
  }
  8%{
    opacity:var(--opacity, 0.08);
  }
  50%{
    transform:translate3d(calc(var(--drift) * 0.45), -45vh, 0) scale(1);
  }
  100%{
    transform:translate3d(var(--drift), -125vh, 0) scale(1.12);
    opacity:0;
  }
}


/* FOOTER */

.site-footer{
background:linear-gradient(180deg,#041b35,#020e1f);
color:white;
padding:80px 0 30px;
}

.footer-inner{
width:min(92%,1200px);
margin:auto;
}

.footer-grid{
display:grid;
grid-template-columns:2fr 1fr 1fr 1fr;
gap:50px;
margin-bottom:40px;
}

.footer-brand p{
margin:20px 0;
color:rgba(255,255,255,0.75);
line-height:1.6;
max-width:260px;
}

.footer-logo{
width:180px;
}

.footer-column h4{
margin-bottom:18px;
font-size:16px;
}

.footer-column ul{
list-style:none;
}

.footer-column li{
margin-bottom:10px;
}

.footer-column a{
color:rgba(255,255,255,0.8);
text-decoration:none;
transition:0.3s;
}

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

.footer-socials{
display:flex;
gap:12px;
margin-top:10px;
}

.footer-social{
width:40px;
height:40px;
	
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
color:white;
text-decoration:none;
font-weight:bold;
}

.fb{background:#4064ac;}
.ig{background:#d63384;}
.yt{background:#ea3323;}
.tk{background:#000;}

.footer-bottom{
border-top:1px solid rgba(255,255,255,0.08);
padding-top:20px;
display:flex;
justify-content:space-between;
align-items:center;
	
}

.footer-bottom p{
color:rgba(255,255,255,0.6);
	
}

.back-to-top{
background:linear-gradient(180deg,#49c5f6,#1eaae2);
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
border-radius:8px;
text-decoration:none;
color:white;
}

/* TABLET */

@media(max-width:900px){

.footer-grid{
grid-template-columns:1fr 1fr;
gap:40px;
}

.footer-brand{
grid-column:1/3;
}

}

/* MOBILE */

@media(max-width:600px){

.footer-grid{
grid-template-columns:1fr;
text-align:center;
}

.footer-brand p{
max-width:none;
}

.footer-socials{
justify-content:center;
}

.footer-bottom{
flex-direction:column;
gap:15px;
}

}
	






/* PREMIUM SERVICES */

.services-premium{

padding:140px 0;

background:
linear-gradient(180deg,#0e2a47,#07192e);

color:white;

position:relative;

overflow:hidden;

}


/* floating bubbles */

.services-premium::before{

content:"";

position:absolute;

inset:0;

background:

radial-gradient(circle at 20% 40%, rgba(255,255,255,0.06) 0px, transparent 80px),

radial-gradient(circle at 70% 20%, rgba(255,255,255,0.05) 0px, transparent 70px),

radial-gradient(circle at 60% 80%, rgba(255,255,255,0.05) 0px, transparent 60px);

pointer-events:none;

}


/* header */

.services-premium-header{

text-align:center;

margin-bottom:70px;

}

.services-premium-header h2{

font-size:54px;

font-weight:500;

margin-bottom:12px;

}

.services-premium-header p{

color:rgba(255,255,255,0.65);

font-size:18px;

}


/* grid */

.services-premium-grid{

width:min(1200px,90%);

margin:auto;

display:grid;

grid-template-columns:repeat(2,1fr);

gap:30px;

}


/* cards */

.service-premium-card{

background:rgba(5,20,35,0.85);

border:1px solid rgba(255,255,255,0.06);

border-radius:54px;

padding:38px;

backdrop-filter:blur(8px);

transition:0.35s;

}

.service-premium-card:hover{

transform:translateY(-6px);

border-color:#5fd2ff;

box-shadow:0 20px 60px rgba(0,0,0,0.5);

}


/* icon */

.service-premium-icon{

margin-bottom:22px;

}

.service-premium-icon svg{

width:34px;

height:34px;

stroke:#5fd2ff;

fill:none;

filter:drop-shadow(0 0 8px rgba(95,210,255,0.6));

}


/* text */

.service-premium-card h3{

font-size:22px;

margin-bottom:10px;

}

.service-premium-card p{

color:rgba(255,255,255,0.65);

line-height:1.6;

}


/* responsive */

@media(max-width:900px){

.services-premium-grid{

grid-template-columns:1fr;

}

.services-premium-header h2{

font-size:38px;

}

}



/* ===== PREMIUM SERVICES EXTRA EFFECTS ===== */

.service-premium-card{
  position:relative;
  overflow:hidden;
}

.service-premium-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:14px;
  padding:1px;
  background:linear-gradient(
    135deg,
    rgba(95,210,255,0.0),
    rgba(95,210,255,0.28),
    rgba(95,210,255,0.0)
  );
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
}

.service-premium-card:hover::before{
  opacity:1;
}

.service-premium-card::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(95,210,255,0.16), transparent 70%);
  top:-60px;
  right:-60px;
  opacity:0;
  transition:opacity .35s ease, transform .35s ease;
  transform:scale(.8);
  pointer-events:none;
}

.service-premium-card:hover::after{
  opacity:1;
  transform:scale(1);
}

.service-premium-icon svg{
  transition:transform .35s ease, filter .35s ease, stroke .35s ease;
}

.service-premium-card:hover .service-premium-icon svg{
  transform:translateY(-2px) scale(1.08);
  filter:drop-shadow(0 0 14px rgba(95,210,255,0.85));
  stroke:#7ddcff;
}

/* parallax bubbles inside section */
.services-premium{
  transform-style:preserve-3d;
}

.services-premium::before{
  animation:servicesFloat 14s ease-in-out infinite alternate;
}

@keyframes servicesFloat{
  0%{
    transform:translate3d(0, 0, 0) scale(1);
  }
  100%{
    transform:translate3d(0, -18px, 0) scale(1.03);
  }
}









/* PROJECTS SECTION */

.projects{

background:white;

padding:120px 0;

text-align:center;

}

.projects-header{

max-width:900px;

margin:auto;

margin-bottom:70px;

}

.projects-header h2{

font-size:32px;

color:#123a63;

margin-bottom:20px;

letter-spacing:1px;

}

.projects-header p{

color:#5b6b7b;

line-height:1.7;

}

.projects-sub{

font-weight:600;

color:#1e3f6b;

margin-top:10px;

}


.projects-grid{

width:min(1200px,90%);

margin:auto;

display:grid;

grid-template-columns:repeat(3,1fr);

gap:40px;

}


.project-card{

background:#f7f9fc;

border-radius:50px;

padding-bottom:30px;

transition:.3s;

box-shadow:0 5px 20px rgba(0,0,0,0.05);

}

.project-card:hover{

transform:translateY(-8px);

box-shadow:0 15px 40px rgba(0,0,0,0.1);

}


.project-image img{

width:100%;

height:200px;

object-fit:cover;

border-radius:50px 50px 0 0;

}


.project-card h3{

font-size:18px;

color:#123a63;

margin:25px 20px 10px;

font-weight:700;

}

.project-card p{

font-size:14px;

color:#6c7a89;

padding:0 25px;

line-height:1.6;

}


.project-btn{

display:inline-block;

margin-top:20px;

background:#143c6b;

color:white;

padding:12px 26px;

border-radius:30px;

text-decoration:none;

font-weight:600;

transition:.3s;

}

.project-btn:hover{

background:#1eaae2;

}


/* responsive */

@media(max-width:900px){

.projects-grid{

grid-template-columns:1fr;

gap:30px;

}

.project-image img{

height:240px;

}

}








.hero-btn-primary{

background:linear-gradient(135deg,#3cc5ff,#1eaae2);

color:white;

padding:14px 34px;

border-radius:30px;

text-decoration:none;

font-weight:600;

display:inline-block;

position:relative;

overflow:hidden;

transition:all .35s ease;

box-shadow:0 8px 20px rgba(30,170,226,0.3);

}


/* hover efekt */

.hero-btn-primary:hover{

transform:translateY(-3px) scale(1.03);

box-shadow:0 12px 30px rgba(30,170,226,0.45);

}


/* animated shine efekt */

.hero-btn-primary::before{

content:"";

position:absolute;

top:0;

left:-120%;

width:120%;

height:100%;

background:linear-gradient(
120deg,
transparent,
rgba(255,255,255,0.45),
transparent
);

transition:0.6s;

}

.hero-btn-primary:hover::before{

left:120%;

}


.footer-credit{
  color:rgba(255,255,255,0.7);
  font-size:14px;
}

.footer-credit a{
  color:#3cc5ff;
  text-decoration:none;
  font-weight:500;
  transition:0.25s;
}

.footer-credit a:hover{
  color:white;
  text-decoration:none;
}



/* ===== PRICING CARDS SECTION ===== */

.pricing-cards-section{
  background:#f8fbff;
  padding:120px 20px;
}

.pricing-cards-wrap{
  width:min(1200px, 92%);
  margin:0 auto;
}

.pricing-cards-head{
  text-align:center;
  max-width:900px;
  margin:0 auto 60px;
}

.pricing-kicker{
  display:inline-block;
  margin-bottom:14px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(30,170,226,0.10);
  color:#0f5f93;
  font-size:0.85rem;
  font-weight:700;
  letter-spacing:0.04em;
}

.pricing-cards-head h2{
  margin:0 0 16px;
  font-size:clamp(2rem, 4vw, 3.2rem);
  color:#123a63;
  line-height:1.08;
}

.pricing-cards-head p{
  color:#607286;
  line-height:1.75;
  font-size:1rem;
}

.pricing-cards-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:26px;
  align-items:stretch;
}

.pricing-card{
  background:#ffffff;
  border:1px solid rgba(18,58,99,0.08);
  border-radius:20px;
  box-shadow:0 14px 34px rgba(0,0,0,0.05);
  padding:22px 20px 20px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  display:flex;
  flex-direction:column;
  height:100%;
}

.pricing-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,0.08);
  border-color:rgba(30,170,226,0.22);
}

.pricing-card-top{
  margin-bottom:16px;
}

.pricing-card h3{
  margin:0 0 14px;
  font-size:1.18rem;
  line-height:1.35;
  color:#123a63;
}

.pricing-mini-link{
  display:flex;
  align-items:center;
  gap:10px;
  color:#1e6ea8;
  font-size:0.92rem;
  font-weight:700;
}



.pricing-card-body{
  flex:1;
}

.pricing-card-body p{
  margin:0;
  color:#617384;
  line-height:1.75;
  font-size:0.98rem;
}

.pricing-card-bottom{
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid rgba(18,58,99,0.08);
}

.pricing-card-bottom strong{
  display:block;
  color:#123a63;
  font-size:1.12rem;
  font-weight:800;
}

@media (max-width:1100px){
  .pricing-cards-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:640px){
  .pricing-cards-section{
    padding:90px 16px;
  }

  .pricing-cards-grid{
    grid-template-columns:1fr;
  }

  .pricing-card{
    padding:18px 16px;
    border-radius:18px;
  }

  .pricing-card h3{
    font-size:1.05rem;
  }
}





/* ===== BEFORE / AFTER GALLERY ===== */

.before-after-gallery{
  background:#ffffff;
  padding:120px 20px;
}

.before-after-shell{
  width:min(1280px, 92%);
  margin:0 auto;
}

.before-after-head{
  text-align:center;
  max-width:850px;
  margin:0 auto 56px;
}

.before-after-kicker{
  display:inline-block;
  margin-bottom:14px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(30,170,226,0.10);
  color:#0f5f93;
  font-size:0.85rem;
  font-weight:700;
  letter-spacing:0.04em;
}

.before-after-head h2{
  margin:0 0 16px;
  font-size:clamp(2rem, 4vw, 3.2rem);
  color:#123a63;
  line-height:1.08;
}

.before-after-head p{
  color:#607286;
  line-height:1.75;
  font-size:1rem;
}

.before-after-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:26px;
}

.ba-card{
  background:#fff;
  border:1px solid rgba(18,58,99,0.08);
  border-radius:22px;
  padding:14px;
  box-shadow:0 14px 34px rgba(0,0,0,0.05);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.ba-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 42px rgba(0,0,0,0.08);
  border-color:rgba(30,170,226,0.18);
}

.ba-slider{
  position:relative;
  width:100%;
  aspect-ratio: 4 / 3;
  overflow:hidden;
  border-radius:16px;
  background:#edf3f9;
  cursor:ew-resize;
  user-select:none;
  -webkit-user-select:none;
  touch-action:none;
}

.ba-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}

.ba-after-wrap{
  position:absolute;
  top:0;
  left:0;
  bottom:0;
  overflow:hidden;
  border-right:2px solid rgba(255,255,255,0.95);
  transition:width .28s ease;
}

.ba-after{
  width:100%;
  height:100%;
  object-fit:cover;
}

.ba-label{
  position:absolute;
  top:14px;
  z-index:3;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(4,23,51,0.72);
  backdrop-filter:blur(8px);
  color:#fff;
  font-size:0.78rem;
  font-weight:800;
  letter-spacing:0.08em;
}

.ba-label-left{
  left:14px;
}

.ba-label-right{
  right:14px;
  background:linear-gradient(180deg, #49c5f6 0%, #1eaae2 100%);
}

.ba-handle{
  position:absolute;
  top:0;
  bottom:0;
  width:0;
  z-index:4;
  transform:translateX(-1px);
  transition:left .28s ease;
}

.ba-handle::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:2px;
  transform:translateX(-50%);
  background:rgba(255,255,255,0.95);
  box-shadow:0 0 12px rgba(255,255,255,0.45);
}

.ba-handle span{
  position:absolute;
  top:50%;
  left:50%;
  width:46px;
  height:46px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:linear-gradient(180deg, #49c5f6 0%, #1eaae2 100%);
  box-shadow:0 16px 30px rgba(30,170,226,0.26);
}

.ba-handle span::before,
.ba-handle span::after{
  content:"";
  position:absolute;
  top:50%;
  width:10px;
  height:10px;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
  transform:translateY(-50%) rotate(45deg);
}

.ba-handle span::before{
  left:12px;
  transform:translateY(-50%) rotate(225deg);
}

.ba-handle span::after{
  right:12px;
}

@media (max-width:1024px){
  .before-after-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:640px){
  .before-after-gallery{
    padding:90px 16px;
  }

  .before-after-grid{
    grid-template-columns:1fr;
  }

  .ba-card{
    padding:12px;
    border-radius:18px;
  }

  .ba-label{
    font-size:0.72rem;
    padding:6px 10px;
  }

  .ba-handle span{
    width:42px;
    height:42px;
  }
}

















/* ===== DESKTOP SERVICES DROPDOWN ===== */
.nav-item{
  position:relative;
}

.nav-dropdown-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:none;
  background:transparent;
  color:#111827;
  font:inherit;
  font-size:clamp(14px,0.9vw,16px);
  white-space:nowrap;
  cursor:pointer;
  padding:0;
}

.nav-dropdown-chevron{
  width:16px;
  height:16px;
  opacity:.72;
  transition:transform .24s ease, opacity .24s ease;
}

.nav-dropdown.is-open .nav-dropdown-chevron{
  transform:rotate(180deg);
  opacity:1;
}

.services-dropdown-menu{
  position:absolute;
  top:calc(100% + 14px);
  left:50%;
  transform:translateX(-50%) translateY(10px);
  min-width:260px;
  padding:10px;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.72);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 20px 48px rgba(15,23,42,.16);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease, transform .24s ease, visibility .24s ease;
  z-index:1100;
}

.nav-dropdown.is-open .services-dropdown-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

.dropdown-link{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:14px;
  color:#163b63;
  text-decoration:none;
  font-weight:700;
  font-size:15px;
  transition:background .22s ease, transform .22s ease;
}

.dropdown-link:hover{
  background:rgba(30,170,226,.08);
  transform:translateX(2px);
}

.dropdown-icon{
  width:36px;
  height:36px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, rgba(73,197,246,.18) 0%, rgba(30,170,226,.12) 100%);
  color:#1e7fba;
  flex-shrink:0;
}

.dropdown-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* ===== MOBILE MENU POLISHED ===== */
.mobile-menu{
  pointer-events:none;
  background:rgba(5,14,35,0.28);
}

.mobile-menu.open{
  pointer-events:none;
}

.mobile-menu-inner{
  pointer-events:auto;
}

.mobile-nav{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:24px;
}

.mobile-nav-link,
.mobile-services-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:56px;
  padding:16px 18px;
  border-radius:18px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.08);
  color:#fff;
  text-decoration:none;
  font-size:1.08rem;
  font-weight:700;
  opacity:.96;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.mobile-nav-link{
  justify-content:flex-start;
}

.mobile-nav-item{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.mobile-services-toggle{
  border:none;
  cursor:pointer;
  font-family:inherit;
}

.mobile-services-chevron{
  width:18px;
  height:18px;
  flex-shrink:0;
  opacity:.9;
  transition:transform .28s ease;
}

.mobile-services-dropdown.is-open .mobile-services-chevron{
  transform:rotate(180deg);
}

.mobile-services-submenu{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transform:translateY(-6px);
  transition:grid-template-rows .32s ease, opacity .24s ease, transform .24s ease;
}

.mobile-services-submenu.open{
  grid-template-rows:1fr;
  opacity:1;
  transform:translateY(0);
}

.mobile-services-submenu-inner{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.mobile-service-link{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:56px;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,0.92);
  color:#163b63;
  text-decoration:none;
  font-weight:700;
  box-shadow:0 10px 24px rgba(0,0,0,0.12);
}

.mobile-service-icon{
  width:34px;
  height:34px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, rgba(73,197,246,.22) 0%, rgba(30,170,226,.14) 100%);
  color:#1e7fba;
  flex-shrink:0;
}

.mobile-service-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}










/* ===== REMOVE HERO OVERLAYS / BLOCKING LAYERS ===== */

.hero::before,
.hero::after{
  content:none !important;
  display:none !important;
}

.hero-video::before,
.hero-video::after,
.hero-media::before,
.hero-media::after,
.hero-overlay,
.hero-gradient,
.hero-glass,
.hero-blur{
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

/* keep hero clean and responsive */
.hero{
  position:relative;
  overflow:hidden;
}

.hero video,
.hero .hero-video,
.hero .hero-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:none !important;
  transform:none !important;
}

.hero-card{
  position:relative;
  z-index:2;
}






@media (min-width:401px) and (max-width:1100px) {
  body.menu-open{
    overflow:hidden;
  }

  .navbar{
    top:5px;
  }

  .nav-container{
    width:90%;
    background:transparent;
    box-shadow:none;
    border-radius:0;
    padding:0;
    display:flex;
    justify-content:center;
    align-items:center;
  }

  .desktop-nav,
  .desktop-cta{
    display:none;
  }

  .menu-toggle{
    top:36px;
    left:50%;
    transform:translateX(-50%);
  }

  .hero{
    padding-top:122px;
  }

  .hero-card{
    margin-top:-80px;
  }

		
		.menu-logo{
    filter:brightness(0) invert(1);
}
  
.menu-icon{
width:32px;
opacity:0;
transform:scale(.55);
}

.menu-toggle.show-hamburger .menu-logo{
opacity:0;
transform:scale(.35);
}

.menu-toggle.show-hamburger .menu-icon{
opacity:1;
transform:scale(1);
}

/* MOBILE MENU */

.mobile-menu{
position:fixed;
inset:0;
background:rgba(5,14,35,.48);
backdrop-filter:blur(10px);
opacity:0;
visibility:hidden;
transition:.3s;
	
}

.mobile-menu.open{
opacity:1;
visibility:visible;
}
	
	
.menu-toggle{
position:fixed;
top:12px;
left:50%;
transform:translateX(-50%);
width:56px;
height:56px;
border-radius:50%;

/* FIRST STATE - no background */

background:transparent;

display:flex;
align-items:center;
justify-content:center;

cursor:pointer;
z-index:1002;

box-shadow:none;
animation:none;

transition:all .3s ease;
}

/* AFTER TRANSFORMATION */

.menu-toggle.is-ready{

background:white;
box-shadow:0 8px 25px rgba(0,0,0,0.25);
animation:pulseRing 2.2s infinite, pulseCircle 2.2s infinite;

}

.menu-toggle.is-ready:hover{

transform:translateX(-50%) scale(1.12);
box-shadow:0 12px 30px rgba(0,0,0,0.35);

}

.menu-toggle img{
position:absolute;
transition:all .6s ease;
}

.menu-logo{
width:134px;
opacity:1;
transform:scale(1);
}
	
  .buttons{
    flex-direction:column;
    align-items:center;
    gap:13px;
  }

	.btn-secondary{
   ;
	 max-width: 160px;
		
}
	
}





@media (min-width:401px) and (max-width:780px) {
 .hero{
  margin-top: -25px;
}
	
.hero h1{
  font-size:38px;
  font-weight:800;
  line-height:1.1;
  margin-bottom:20px;
	margin-top: -10px;
}

.hero h1 span{
  color:var(--accent);
}

.hero p{
  color:white;
  font-size:15px;
  margin-bottom:35px;
	margin-top: -10px;
}

	.buttons{
    flex-direction:column;
    align-items:center;
    gap:13px;
		margin-top: -10px;
  }

	.btn-secondary{
   ;
	 max-width: 160px;
		
}
	
}



/* ===== GARDEN SECTION MATCHED TO BLUE SERVICES ===== */
.services-premium-garden{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 140px 0;
  background:
    radial-gradient(circle at 18% 30%, rgba(70, 170, 90, 0.10), transparent 16%),
    radial-gradient(circle at 74% 20%, rgba(70, 170, 90, 0.08), transparent 14%),
    linear-gradient(180deg, #082212 0%, #0a2a16 52%, #071a0d 100%);
  color: white;
	
}



.services-premium-garden::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg, rgba(8,34,18,0.985), rgba(10,42,22,0.985) 52%, rgba(7,26,13,0.985)),
    radial-gradient(circle at 15% 75%, rgba(120,84,48,0.05), transparent 10%),
    radial-gradient(circle at 84% 82%, rgba(120,84,48,0.045), transparent 10%);
  pointer-events:none;
	
	
}

.services-premium-garden > *{
  position: relative;
  z-index: 2;

}

.services-premium-garden .services-premium-header{
  text-align:center;
  margin-bottom:70px;
	
}

.services-premium-garden .services-premium-header h2{
  font-size:54px;
  font-weight:500;
  margin-bottom:12px;
}

.services-premium-garden .services-premium-header p{
  color:rgba(255,255,255,0.68);
  font-size:18px;
}

.services-premium-garden .services-premium-grid{
  width:min(1120px, 90%);
  margin:auto;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:30px;
	
}

.services-premium-garden .service-premium-card{
  background:rgba(3, 22, 10, 0.88);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:42px;
  padding:36px 38px;
  min-height:240px;
  position:relative;
  overflow:hidden;
  box-shadow:0 18px 60px rgba(0,0,0,0.20);
  backdrop-filter:blur(4px);
	
}

.services-premium-garden .service-premium-icon{
  width:50px;
  height:50px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(23, 95, 48, 0.40);
  color:#18e06f;
  margin-bottom:22px;
	
}

.services-premium-garden .service-premium-icon svg{
  width:22px;
  height:22px;
  display:block;
  stroke:currentColor;
}

.services-premium-garden .service-premium-card h3{
  font-size:22px;
  line-height:1.3;
  margin-bottom:14px;
}

.services-premium-garden .service-premium-card p{
  color:rgba(255,255,255,0.64);
  line-height:1.65;
  max-width:92%;
}

.garden-effects{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  overflow:hidden;
	
}

.garden-soil{
  position:absolute;
  border-radius:50%;
  background:radial-gradient(circle, rgba(120,84,48,0.08), rgba(120,84,48,0.025) 55%, transparent 75%);
  filter:blur(20px);
  opacity:.76;
}

.soil-1{ width:180px; height:180px; left:8%; bottom:10%; }
.soil-2{ width:130px; height:130px; right:11%; bottom:15%; }
.soil-3{ width:90px; height:90px; left:56%; bottom:8%; }

.garden-leaf{
  position:absolute;
  top:-8%;
  font-size:25px;
  color:rgba(138, 214, 111, 0.18);
  opacity:.32;
  animation:gardenLeafFall linear infinite;
  will-change:transform;
}


.services-premium-garden .service-premium-card,
.services-premium-garden .garden-service-card {
  position: relative !important;
  overflow: hidden !important;
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease !important;
}

.services-premium-garden .service-premium-card::before,
.services-premium-garden .garden-service-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at top left, rgba(47, 207, 122, 0.10), transparent 42%);
  opacity: 0;
  transition: opacity 0.35s ease;
}

.services-premium-garden .service-premium-card:hover,
.services-premium-garden .garden-service-card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(47, 207, 122, 0.95) !important;
  box-shadow:
    0 0 0 1px rgba(47, 207, 122, 0.50),
    0 18px 55px rgba(0, 0, 0, 0.22),
    0 0 30px rgba(47, 207, 122, 0.12) !important;
}







.services-premium-garden .service-premium-card:hover::before,
.services-premium-garden .garden-service-card:hover::before {
  opacity: 1;
}


@media only screen and (max-width: 1100px) {
  .navbar .desktop-nav {
    display: none !important;
  }
}







.leaf-1{ left:10%; animation-duration:17s; animation-delay:-2s; }
.leaf-2{ left:24%; animation-duration:19s; animation-delay:-6s; }
.leaf-3{ left:43%; animation-duration:16s; animation-delay:-4s; }
.leaf-4{ left:62%; animation-duration:20s; animation-delay:-10s; }
.leaf-5{ left:79%; animation-duration:18s; animation-delay:-5s; }
.leaf-6{ left:91%; animation-duration:22s; animation-delay:-9s; }

@keyframes gardenLeafFall{
  0%{ transform:translate3d(0,-10%,0) rotate(0deg); }
  25%{ transform:translate3d(12px,25vh,0) rotate(55deg); }
  50%{ transform:translate3d(-10px,52vh,0) rotate(105deg); }
  75%{ transform:translate3d(10px,78vh,0) rotate(155deg); }
  100%{ transform:translate3d(-8px,108vh,0) rotate(220deg); }
}

@media (max-width: 900px){
  .services-premium-garden .services-premium-grid{
    grid-template-columns:1fr;
  }
  .services-premium-garden .services-premium-header h2{
    font-size:38px;
  }
}

@media (prefers-reduced-motion: reduce){
  .garden-leaf{ animation:none; }
}



/* garden cards clickable */
.services-premium-garden .service-card-link,
.services-premium-garden .garden-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.services-premium-garden .service-card-link:hover,
.services-premium-garden .service-card-link:focus,
.services-premium-garden .service-card-link:focus-visible,
.services-premium-garden .garden-card-link:hover,
.services-premium-garden .garden-card-link:focus,
.services-premium-garden .garden-card-link:focus-visible {
  text-decoration: none;
  color: inherit;
}

.services-premium-garden .service-card-link h3,
.services-premium-garden .service-card-link p,
.services-premium-garden .garden-card-link h3,
.services-premium-garden .garden-card-link p {
  color: inherit;
}

.services-premium-garden .service-card-link *,
.services-premium-garden .garden-card-link * {
  pointer-events: none;
}



.service-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.service-card-link:hover,
.service-card-link:focus,
.service-card-link:focus-visible {
  text-decoration: none;
  color: inherit;
}

.service-card-link h3,
.service-card-link p {
  color: inherit;
}

.service-card-link * {
  pointer-events: none;
}





/* ===== NAV UPDATE ONLY ===== */
.nav-container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.desktop-nav{
  display:flex;
  align-items:center;
  gap:26px;
  flex:1 1 auto;
}

.nav-right{
  display:flex;
  align-items:center;
  gap:20px;
  margin-left:auto;
}

.navbar .desktop-nav > a,
.navbar .nav-right-link{
  font-size:clamp(14px,0.9vw,16px);
  white-space:nowrap;
  text-decoration:none;
  color:#1c1c1c;
  font-weight:500;
  line-height:1;
}

.navbar .nav-right-link:hover,
.navbar .desktop-nav > a:hover{
  color:#1c1c1c;
  opacity:.75;
}

.nav-item{
  position:relative;
}

.nav-dropdown-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:transparent;
  border:none;
  color:#1c1c1c;
  font:inherit;
  font-weight:500;
  cursor:pointer;
  padding:0;
  line-height:1;
}

.nav-dropdown-chevron{
  width:16px;
  height:16px;
  transition:transform .22s ease;
}

.nav-dropdown.is-open .nav-dropdown-chevron{
  transform:rotate(180deg);
}

.services-dropdown-menu{
  position:absolute;
  top:calc(100% + 18px);
  left:0;
  min-width:255px;
  background:#f2f2f2;
  border-radius:24px;
  padding:14px;
  box-shadow:0 18px 50px rgba(0,0,0,0.12);
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
  z-index:30;
  pointer-events:none;
}

.nav-dropdown.is-open .services-dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}

.dropdown-link{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 12px;
  border-radius:18px;
  text-decoration:none;
  color:#1c1c1c;
  font-weight:600;
}

.dropdown-link:hover{
  background:rgba(255,255,255,0.55);
}

.dropdown-icon{
  width:38px;
  height:38px;
  border-radius:14px;
  background:rgba(69,180,255,0.14);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#49b6ff;
  flex:0 0 38px;
}

.garden-dropdown-icon{
  background:rgba(38,168,84,0.14);
  color:#2ab35f;
}

.dropdown-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

@media (max-width:1100px){
  .nav-right{
    display:none;
  }
}



.desktop-nav .nav-dropdown .services-dropdown-menu {
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  pointer-events: none;
}

.desktop-nav .nav-dropdown.is-open .services-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.desktop-nav .nav-dropdown.is-open .nav-dropdown-chevron {
  transform: rotate(180deg);
}




.mobile-services-dropdown .mobile-services-submenu {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.3s ease, opacity 0.3s ease;
}

.mobile-services-dropdown.is-open .mobile-services-submenu {
  max-height: 500px;
  opacity: 1;
}