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

	/* CSS Variables */
	:root {
	  --blueish: #31B9D4;
	  --font-main: "PT Sans Narrow",sans-serif;
	}
	.blueish {
		color: var(--blueish);
	}

    body,html{
        height:100%;
        font-family:'Helvetica Neue',Arial,sans-serif;
        overflow-x:hidden;
        scroll-behavior:smooth;
        }
    img,video{max-width:100%;height:auto;display:block;}
    .header{
        position:fixed;
        top:0;
        left:0;
        width:100%;
        padding:1rem 2rem;
        display:flex;
        justify-content:space-between;
        align-items:center;
        background:rgba(0,0,0,.5);
          z-index: 10000 !important;   /* higher than anything else */
          pointer-events: auto !important;
        transition:background .3s;
        }
    .header.scrolled{background:rgba(0,0,0,.8);}
    .header img{height:50px;}
    .logo{color:white;font-weight:bold;font-size:1.5rem;text-decoration:none;}
    .menu-toggle{color:white;font-size:1.8rem;cursor:pointer;z-index:1001;}
    
/* 2. Make sure taps on the logo and menu button never get blocked */
.header a,
.header .menu-toggle,
.header * {
  z-index: 10001 !important;
  pointer-events: auto !important;
}

    /* ==== FULLSCREEN GLASS MENU ==== */
    .fullscreen-menu{
      position:fixed;top:0;left:0;width:100%;height:100%;
      /*
	  background: rgba(0,60,64, 0.5);
	  */
	background-color: var(--blueish);
	background-image: url(assets/splash/hands_2_blur.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
      display:flex;flex-direction:column;justify-content:center;align-items:center;
      transform:translateY(-100%);opacity:0;
      transition:transform .6s cubic-bezier(0.25,0.8,0.25,1),opacity .6s ease;
  z-index: 20000 !important;   /* higher than header (10000) and everything else */
  pointer-events: auto !important;
      padding: 2rem;
      backdrop-filter: blur(10px);
    }
	
	
    .fullscreen-menu.open{transform:translateY(0);opacity:1;}

    .menu-logo{position:absolute;top:2rem;left:2rem;}
    .menu-logo img{height:80px;transition:transform .3s;}
    .menu-logo img:hover{transform:scale(1.05);}

    .close-menu{position:absolute;top:2rem;right:2rem;color:white;font-size:2rem;cursor:pointer;z-index:10000;transition:transform .3s;}
    .close-menu:hover{transform:rotate(90deg) scale(1.1);}

    /* ==== GLASS MENU ITEMS ==== */
    .menu-items{
      list-style:none;
      display:grid;
      grid-template-columns:repeat(3, 1fr);
      gap:1.5rem;
      max-width:600px;
      width:100%;
    }
    @media (max-width:768px){.menu-items{grid-template-columns:1fr 1fr;gap:1rem;}}
    @media (max-width:480px){.menu-items{grid-template-columns:1fr;}}

    .menu-items li{
      opacity:0;transform:scale(0.8);
      transition:opacity .5s ease,transform .5s ease;
    }
    .fullscreen-menu.open .menu-items li{opacity:1;transform:scale(1);}
    .fullscreen-menu.open .menu-items li:nth-child(1){transition-delay:.15s;}
    .fullscreen-menu.open .menu-items li:nth-child(2){transition-delay:.25s;}
    .fullscreen-menu.open .menu-items li:nth-child(3){transition-delay:.35s;}
    .fullscreen-menu.open .menu-items li:nth-child(4){transition-delay:.45s;}
    .fullscreen-menu.open .menu-items li:nth-child(5){transition-delay:.55s;}

    .menu-items a{
      display:flex;flex-direction:column;align-items:center;justify-content:center;
      width:200px;height:200px;
      background:rgba(255,255,255,0.12);
      backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);
      border:1px solid rgba(255,255,255,0.25);
      border-radius:15px;
      color:white;text-decoration:none;
      font-family:"PT Sans Narrow",sans-serif;font-weight:700;
      font-size:0.9rem;text-transform:uppercase;letter-spacing:1px;
      text-shadow:0 1px 3px rgba(0,0,0,0.4);
      box-shadow:0 4px 15px rgba(0,0,0,0.2),0 0 0 1px rgba(255,255,255,0.1) inset;
      transition:all .4s cubic-bezier(0.25,0.8,0.25,1);
      position:relative;overflow:hidden;
    }
    .menu-items a i{font-size:1.8rem;margin-bottom:0.5rem;transition:transform .3s;}
    .menu-items a::before{
      content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);
      transition:left .6s;
    }
    .menu-items a:hover{
      transform:translateY(-4px) scale(1.05);
      background:rgba(0,188,212,0.25);border-color:rgba(0,188,212,0.6);
      box-shadow:0 10px 30px rgba(0,188,212,0.35),0 0 0 1px rgba(0,188,212,0.4) inset;
    }
    .menu-items a:hover i{transform:scale(1.15);}
    .menu-items a:hover::before{left:100%;}
    .menu-items a:active{transform:translateY(-2px) scale(1.03);}

/* ——— FULLSCREEN MENU ON TOP ——— */
.fullscreen-menu { z-index: 20000 !important; pointer-events: auto !important; }
.fullscreen-menu .close-menu,
.fullscreen-menu .menu-items a { z-index: 20001 !important; pointer-events: auto !important; }
.header { z-index: 10000 !important; }

    /* ==== SPLASH & TEAM SECTIONS ==== */
    .splash, .team-section{
      position:relative;
      width:100vw;
      height:100vh;
      overflow:hidden;
      background:#006064;
    }
    .splash-media, .team-image{
      position:absolute;
      top:50%;left:50%;
      min-width:100%;min-height:100%;
      transform:translate(-50%,-50%);
      object-fit:cover;
      z-index:0;
      pointer-events: none;
    }
    #laserCanvas {position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;}

    /* ==== TOP FADE IN – RESTORED ==== */
    .team-overlay {
      position: absolute;
      top: 0; left: 0;
      width: 100%; height: 150px;
      background: linear-gradient(to bottom, rgba(36,72,72,0.8), transparent);
      display: flex;
      align-items: flex-start;
      padding: 2rem;
      z-index: 1;
      pointer-events: none;
    }

    /* ==== SPLASH TEXT (ON LOAD) ==== */
    .splash-text {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      left: 10%;
      width: 30%;
      color: white;
      z-index: 3;
      text-shadow: 0 2px 10px rgba(0,0,0,0.6);
    }

    .splash-text h1, .splash-text p, .splash-text .btn-glass {
      opacity: 0;
      transform: translateY(30px);
      animation: fadeUp 0.9s ease-out forwards;
    }

    .splash-text h1 { animation-delay: 0.3s; }
    .splash-text p { animation-delay: 0.6s; }
    .splash-text .btn-glass { animation-delay: 0.9s; }

    @keyframes fadeUp {
      to { opacity: 1; transform: translateY(0); }
    }

    .splash-text h1 {
      font-size: 4.5rem;
      font-weight: 900;
      line-height: 1.1;
      margin-bottom: 1rem;
      letter-spacing: -1px;
    }

    .splash-text p {
      font-size: 1.4rem;
      line-height: 1.6;
      font-weight: 400;
      margin-bottom: 1.5rem;
    }

    /* ==== TEAM TEXT + GLASS PANEL ==== */
    .team-wrapper {
      position: absolute;
      top: 50%;
      left: 10%;
      width: 30%;
      z-index: 3;
      transform: translateY(-50%);
      pointer-events: none;
    }

    .glass-panel-behind {
      position: relative;
      top: 0; left: 0; width: 100%; height: 100%;
      background: rgba(23, 78, 89, 0.5);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(16px);
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 20px;
      box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.37),
        0 0 0 1px rgba(255, 255, 255, 0.1) inset;
      z-index: 2;
      opacity: 0;
      transform: scale(0.95);
      transition: all 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
    }

    .glass-panel-behind.visible {
      opacity: 1;
      transform: scale(1);
    }

    .team-text {
      position: relative;
      z-index: 3;
      padding: 2.5rem 2rem;
      color: white;
      pointer-events: auto;
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
    }

    .team-text h1,
    .team-text p,
    .team-text .btn-glass {
      opacity: 0;
      transform: translateY(20px);
      transition: all 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
      margin: 0;
    }

    .team-text.visible h1,
    .team-text.visible p,
    .team-text.visible .btn-glass {
      opacity: 1;
      transform: translateY(0);
    }

    .team-text.visible h1 { transition-delay: 0.1s; }
    .team-text.visible p { transition-delay: 0.3s; }
    .team-text.visible .btn-glass { transition-delay: 0.5s; }

    .team-text h1 {
      font-size: 4.5rem;
      font-weight: 900;
      line-height: 1.1;
      letter-spacing: -1px;
    }

    .team-text p {
      font-size: 1.4rem;
      line-height: 1.6;
      font-weight: 400;
    }
    
    

    /* ==== GLASS CTA BUTTON ==== */
    .btn-glass {
      display: inline-block;
      padding: 0.9rem 2rem;
      font-family: "PT Sans Narrow", sans-serif;
      font-weight: 700;
      font-size: 1rem;
      text-transform: uppercase;
      letter-spacing: 1px;
      color: white;
      background: rgba(255, 255, 255, 0.15);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 15px;
      cursor: pointer;
      text-decoration: none;
      text-shadow: 0 1px 3px rgba(0,0,0,0.4);
      box-shadow: 
        0 4px 15px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.1) inset;
      transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
      position: relative;
      overflow: hidden;
      align-self: flex-start;
    }

    .btn-glass::before {
      content: '';
      position: absolute;
      top: 0; left: -100%;
      width: 100%; height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
      transition: left 0.6s;
    }

    .btn-glass:hover {
      transform: translateY(-3px) scale(1.03);
      background: rgba(0, 188, 212, 0.25);
      border-color: rgba(0, 188, 212, 0.6);
      box-shadow: 
        0 8px 25px rgba(0, 188, 212, 0.3),
        0 0 0 1px rgba(0, 188, 212, 0.4) inset;
    }

    .btn-glass:hover::before { left: 100%; }
    .btn-glass:active { transform: translateY(-1px) scale(1.01); }

	#single-service .service-back a {
		color: var(--blueish) !important;
		text-shadow: 0 0px 0px rgba(0,0,0,0.4);
		
	}
	#single-service .service-back:hover {
		color: var(--blueish);
		text-shadow: 0 0px 0px rgba(0,0,0,0.4);
		
	}
	#single-article .btn-glass {
		/*color: var(--blueish);
		text-shadow: 0 0px 0px rgba(0,0,0,0.4);
		*/
	}
	#single-article .btn-glass:hover {
		/*color: var(--blueish);
		text-shadow: 0 0px 0px rgba(0,0,0,0.4);
		*/
	}

    /* ==== 3D MODEL ==== */
    #modelContainer {
      position: absolute;
      top: 10%;
      left: 0;
      width: 100%;
      height: 80%;
      z-index: 2;
      pointer-events: none;        /* ← allows taps to pass through to header/menu */
    }
    #modelContainer > div {        /* this is our small interactiveArea we created in JS */
      pointer-events: auto !important;        /* ← re-enables interaction ONLY in the center zone */
    }
    

    /* ==== MOBILE: RESPONSIVE + ORIGINAL SIZES ==== */
    @media (max-width: 768px) {
      .splash-text {
        position: relative;
        width: 90%;
        max-width: 500px;
        margin: 2rem auto 0;
        text-align: center;
        top: 8%;
        left: auto;
        transform: none;
      }

      .team-wrapper {
        position: absolute;
        top: auto;
        bottom: 10%;
        left: 5%;
        right: 5%;
        width: auto;
        max-width: 90%;
        transform: none;
        margin: 0 auto;
      }

      .glass-panel-behind {
        border-radius: 18px;
        height: auto;
        min-height: 260px;
      }

      .team-text {
        padding: 2rem 1.5rem;
        text-align: center;
        gap: 1.2rem;
      }

      /* ORIGINAL MOBILE SIZES */
      .splash-text h1, .team-text h1 { font-size: 2.8rem; }
      .splash-text p, .team-text p { font-size: 1.1rem; margin-bottom: 1.2rem; }

      .btn-glass {
        width: 100%;
        max-width: 260px;
        margin: 0 auto;
        font-size: 0.95rem;
        padding: 0.8rem 1.5rem;
        align-self: center;
      }

      #modelContainer { top: 30%; height: 60%; }
      .menu-logo img { height: 50px; }

      /* Keep overlay on mobile */
      .team-overlay { height: 150px; padding: 1.5rem; }
    }
    
/* MOBILE MENU – PERFECT CENTERED ICON + TEXT + TRUE SQUARE BUTTONS */
@media (max-width: 768px) {
  .menu-items {
    grid-template-columns: 1fr 1fr !important;   /* 2 per row */
    gap: 1rem;
    padding: 0 2rem;
    max-width: 100%;
    justify-content: center;
  }

  .menu-items li {
    width: 100%;
    aspect-ratio: 1 / 1;               /* forces perfect square */
  }

  .menu-items a {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    padding-bottom: 0 !important;
    
    /* Absolute center everything */
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
    border-radius: 18px;
    font-size: 0.95rem;
    text-align: center;
    position: relative;
  }

  .menu-items a i {
    font-size: 2.4rem;
    margin-bottom: 0.8rem;
    margin-top: 0;
  }

  /* Optional: make text wrap nicely if any item is longer */
  .menu-items a span,
  .menu-items a {
    line-height: 1.2;
  }
}

    @media (min-width: 1900px) {
      #modelContainer { top: 20%; height: 70%; }
    }

    /* ==== REST OF SECTIONS ==== */
.section{
    position:relative;
    min-height:100vh;
    min-height:100dvh;
    padding:6rem 100px;
    z-index:2;
    border-top: 15px solid var(--blueish);
    overflow:hidden;
}

/* Background layer */
.section::before{
    content:"";
    position:absolute;
    inset:0;
    background: url("assets/images/hands_3_blur.jpg") center/cover no-repeat;
    z-index:-1;

    animation: sectionPanZoom 5s ease-in-out infinite alternate;
}

@keyframes sectionPanZoom {
    0% {
        transform: scale(1) translateX(0%);
    }
    100% {
        transform: scale(1.5) translateX(15%);
    }
}
    @media(max-width:768px){.section{padding:4rem 20px;}}
    .section-header{display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;margin-bottom:3rem;}
    .section-title{
        font-size: 4rem;
        /*color: var(--blueish); */
		color: #4589A6;
        text-align: left;
        flex:1;
        font-family: "PT Sans Narrow", sans-serif; font-weight: 700; font-style: normal;
		text-shadow: 5px 5px 10px rgba(255, 255, 255, 1);
        }
    .section-subtitle{font-size:1.1rem;color:#555;text-align:right;flex:1;max-width:400px;}
    .trust-grid{display:grid;grid-template-columns:1fr 2fr;gap:3rem;align-items:stretch;}
    @media(max-width:768px){.trust-grid{grid-template-columns:1fr;}}
    .reviews-left{background:#006064;border-radius:15px;padding:2rem;color:white;text-align:center;display:flex;flex-direction:column;justify-content:center;}
    .reviews-left h3{font-size:1.8rem;margin-bottom:.5rem;}
    .reviews-left p{font-size:1rem;opacity:.9;}
    .carousel-container{position:relative;overflow:hidden;border-radius:15px;height:100%;}
    .carousel-wrapper{display:flex;transition:transform .8s ease-in-out;height:100%;}
    .review-item{min-width:100%;background:#e5e5e5;border-radius:15px;padding:1.5rem;margin:0 5px;display:flex;flex-direction:column;justify-content:center;align-items:center;}
    .review-item img{max-height:80%;width:auto;border-radius:8px;}
    .carousel-container::before,.carousel-container::after{content:'';position:absolute;top:0;width:50px;height:100%;z-index:1;}
    
/* -------------------------------------------------
   LEFT PANEL – same height as the gallery
   ------------------------------------------------- */
.popped-grid {
  display: grid;
  grid-template-columns: 30% 65%;
  gap: 3rem;
  align-items: stretch;           /* forces equal height */
}
@media (max-width:768px) {
  .popped-grid { grid-template-columns:1fr; }
}
    
/* ==== TEAL LEFT PANEL FOR "LOOK WHO TRUSTS US" ==== */
/* give the left panel the same glass-shine animation as the Google Reviews block */
.popped-left {
background-color: #31B9D4;
background-image: url(assets/splash/hands_2_blur.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;

  /*background: var(--blueish);	/* blueish */
  border-radius: 15px;
  padding: 2rem;
  color: #fff;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
/* shine wrapper (same as .reviews-left) */
.popped-left .glass-shine-wrapper {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.8s cubic-bezier(0.25,0.8,0.25,1);
}
.popped-left.visible .glass-shine-wrapper {
  opacity: 1;
  transform: translateY(0);
}

/* glass-shine sweep (same as .reviews-left) */
.popped-left::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transition: left 0.8s cubic-bezier(0.25,0.8,0.25,1);
  z-index: 1;
  pointer-events: none;
}
.popped-left.visible::before { left: 100%; }

/* logo styling – identical to Google Reviews logo */
.logo-container { width:100%; max-width:180px; margin:0 auto 1rem; }
.trust-logo { width:100%; height:auto; max-width: 180px; margin:0 auto; }

/* headings inside the panel */
.popped-left h3 {
  font-size: 2rem;
  margin-bottom: .5rem;
  font-family: "PT Sans Narrow", sans-serif; font-weight: 700; font-style: normal;
}
.popped-left p {
  font-size: 1.3rem;
  opacity: 0.9;
  font-family: "PT Sans Narrow", sans-serif; font-weight: 400; font-style: normal;
}
    
    .popped-gallery{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:1rem;
      position:relative;
    }
    .gallery-item{
      position:relative;
      overflow:hidden;
      border-radius:15px;
      cursor:pointer;
      aspect-ratio:1;
      opacity:0;
      transform:scale(0.9);
      transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
    }
    .gallery-item.visible{
      opacity:1;
      transform:scale(1);
    }
    .gallery-item img{
      width:100%;height:100%;object-fit:cover;display:block;
      transition:transform .6s ease;
    }
	
	/* Fade in at bottom of gallery item thumbnail */
    .gallery-overlay{
      position:absolute;bottom:0;left:0;width:100%;padding:1.5rem 1rem 1rem;
      background:linear-gradient(to top,rgba(0,0,0,.7),transparent);
	  color:white;
      font-weight:bold;font-size:1rem;
    }

    /* Hover Shine Effect */
    .gallery-item::before{
      content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
      background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);
      transition:left .6s;z-index:1;pointer-events:none;
    }
    .gallery-item:hover::before{left:100%;}
    .gallery-item:hover img{transform:scale(1.08);}

    /* Fullscreen Modal Styles For Gallery Image Opened */
    .image-modal{
      position:fixed;top:0;left:0;width:100%;height:100%;
      
	background-color: var(--blueish);
	background-image: url(assets/splash/hands_2_blur.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	
	  backdrop-filter:blur(12px);
      display:flex;justify-content:center;align-items:center;
      z-index:10000;opacity:0;visibility:hidden;
      transition:opacity .5s ease,visibility .5s ease;
    }
    .image-modal.open{opacity:1;visibility:visible;}
    .modal-content{
      position:relative;max-width:90%;max-height:90%;border-radius:20px;overflow:hidden;
      box-shadow:0 20px 60px rgba(0,0,0,0.5);
      animation:modalZoom .6s cubic-bezier(0.25,0.8,0.25,1);
    }
	.modal-content img {
	  max-width: 90vw;           /* Fit to 90% of viewport width */
	  max-height: 90vh;          /* Fit to 90% of viewport height */
	  width: auto;               /* Let width adjust naturally */
	  height: auto;              /* Preserve aspect ratio */
	  object-fit: contain;       /* Keep full image visible without cropping */
	  display: block;            /* Remove any inline spacing */
	  margin: auto;              /* Center perfectly */
	  border-radius: 12px;       /* Optional: softer corners */
	  box-shadow: 0 10px 40px rgba(0,0,0,0.6); /* Optional: nicer shadow */
	}
    .modal-close{
      position:absolute;top:1.5rem;right:1.5rem;
      width:50px;height:50px;background:rgba(255,255,255,0.15);
      backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.3);
      border-radius:50%;color:white;font-size:1.5rem;
      display:flex;align-items:center;justify-content:center;
      cursor:pointer;transition:all .4s ease;z-index:2;
    }
    .modal-close:hover{
      background:rgba(0,188,212,0.4);border-color:rgba(0,188,212,0.7);
      transform:rotate(90deg) scale(1.1);
    }
    @keyframes modalZoom{from{transform:scale(0.7);opacity:0;}to{transform:scale(1);opacity:1;}}

    .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;}
    @media(max-width:768px){.news-grid{grid-template-columns:1fr;}}
    .news-item{position:relative;overflow:hidden;border-radius:15px;cursor:pointer;height:500px;transition:transform .4s ease;}
    .news-item:hover{transform:scale(1.03);}
    .news-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
    .news-item:hover img{transform:scale(1.1);}
.news-item::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  transition: left .6s;
  z-index: 1;
  pointer-events: none;
}

.news-item:hover::before {
  left: 100%;
}
    .news-overlay{position:absolute;bottom:0;left:0;width:100%;padding:2rem 1.5rem 1.5rem;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);color:white;}
    .news-title{font-size:1.3rem;font-weight:bold;margin-bottom:.5rem;}
    .news-date{font-size:.9rem;color:#ccc;transition:all .4s ease;}
    .news-readmore{opacity:0;font-weight:bold;color:#00bcd4;transform:translateY(10px);transition:all .4s ease;}
    .news-item:hover .news-date{opacity:0;transform:translateY(-10px);}
    .news-item:hover .news-readmore{opacity:1;transform:translateY(0);}
    .news-readmore.btn-glass {margin-top: 1rem;font-size: 0.9rem;padding: 0.7rem 1.5rem;}

    .pt-sans-narrow-regular { font-family: "PT Sans Narrow", sans-serif; font-weight: 400; font-style: normal; }
    .pt-sans-narrow-bold { font-family: "PT Sans Narrow", sans-serif; font-weight: 700; font-style: normal; }
    
    /* ==== GOOGLE LOGO + GLASS SHINE ==== */
    .reviews-left {
background-color: var(--blueish);
background-image: url(assets/splash/hands_2_blur.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
      border-radius: 15px;
      padding: 2rem;
      color: white;
      text-align: center;
      display: flex;
      flex-direction: column;
      justify-content: center;
      position: relative;
      overflow: hidden;
    }

    .glass-shine-wrapper {
      opacity: 0;
      transform: translateY(20px);
      transition: all 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
    }
    .reviews-left.visible .glass-shine-wrapper {
      opacity: 1;
      transform: translateY(0);
    }

    .reviews-left::before {
      content: '';
      position: absolute;
      top: 0; left: -100%;
      width: 100%; height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
      transition: left 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
      z-index: 1;
      pointer-events: none;
    }
    .reviews-left.visible::before {
      left: 100%;
    }

    .google-logo-container {
      width: 100%;
      max-width: 180px;
      margin: 0 auto 1rem;
    }
    .google-logo {
      width: 100%;
      height: auto;
      display: block;
    }
	
/* headings inside the panel */
.reviews-left h3 {
  font-size: 2rem;
  margin-bottom: .5rem;
  font-family: "PT Sans Narrow", sans-serif; font-weight: 700; font-style: normal;
}
.reviews-left p {
  font-size: 1.3rem;
  opacity: 0.9;
  font-family: "PT Sans Narrow", sans-serif; font-weight: 400; font-style: normal;
}

    .carousel-nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 50px;
      height: 50px;
      background: rgba(255, 255, 255, 0.15);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 50%;
      color: white;
      font-size: 1.4rem;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      z-index: 10;
      transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
      box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    }
    .carousel-nav:hover {
      background: rgba(0, 188, 212, 0.3);
      border-color: rgba(0, 188, 212, 0.6);
      transform: translateY(-50%) scale(1.1);
      box-shadow: 0 8px 25px rgba(0, 188, 212, 0.3);
    }
    .carousel-nav.prev { left: 15px; }
    .carousel-nav.next { right: 15px; }
    .pinkish {
        color: #EE8787;
        }

    /* ==== CONTACT MODAL – ALL NEW STYLES ==== */
    .fullscreen-contact {
		
      position:fixed;top:0;left:0;width:100%;height:100%;
      /*
	  background: rgba(0,60,64, 0.5);
	  */
	background-color: var(--blueish);
	background-image: url(assets/splash/hands_2_blur.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
      display:flex;flex-direction:column;justify-content:center;align-items:center;
      transform:translateY(-100%);opacity:0;
      transition:transform .6s cubic-bezier(0.25,0.8,0.25,1),opacity .6s ease;
  z-index: 20000 !important;   /* higher than header (10000) and everything else */
  pointer-events: auto !important;
      padding: 2rem;
      backdrop-filter: blur(10px);
    }
    .fullscreen-contact.open { transform: translateY(0); opacity: 1; }

    .contact-logo { position: absolute; top: 2rem; left: 2rem; }
    .contact-logo img { height: 80px; transition: transform 0.3s; }
    .contact-logo img:hover { transform: scale(1.05); }

    .close-contact { position: absolute; top: 2rem; right: 2rem; color: white; font-size: 2rem; cursor: pointer; z-index: 10000; transition: transform 0.3s; }
    .close-contact:hover { transform: rotate(90deg) scale(1.1); }

    .contact-form-container {
      background: rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(15px);
      -webkit-backdrop-filter: blur(15px);
      border: 1px solid rgba(255, 255, 255, 0.25);
      border-radius: 15px;
      padding: 2.5rem;
      max-width: 800px;
      width: 100%;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
      position: relative;
      overflow: hidden;
      opacity: 0;
      transform: scale(0.8);
      transition: opacity 0.5s ease, transform 0.5s ease;
    }
    .fullscreen-contact.open .contact-form-container { opacity: 1; transform: scale(1); transition-delay: 0.2s; }

    .step-indicator {
      text-align: center;
      color: white;
      font-size: 3rem;
	  font-weight: 700;
      margin-bottom: 2rem;
      font-family: "PT Sans Narrow", sans-serif;
      text-transform: uppercase;
      letter-spacing: 1px;
	  border-bottom: 1px solid #ffffff;
    }

    .form-step {
      display: flex;
      align-items: center;
      gap: 2rem;
      margin-bottom: 2rem;
    }

    .question-left {
      flex: 1;
      color: white;
      font-size: 1.25rem;
      font-family: "PT Sans Narrow", sans-serif;
      font-weight: 700;
    }

    .question-left input,
    .question-left select {
      width: 100%;
      padding: 0.9rem 1.2rem;
      margin-top: 0.8rem;
      background: rgba(255, 255, 255, 0.15);
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 15px;
      color: white;
      font-family: "PT Sans Narrow", sans-serif;
      font-size: 1rem;
      outline: none;
      transition: all 0.3s;
    }

    .question-left input::placeholder { color: rgba(255,255,255,0.7); }

    .question-left input:focus,
    .question-left select:focus {
      border-color: rgba(0, 188, 212, 0.6);
      box-shadow: 0 0 12px rgba(0, 188, 212, 0.35);
      background-color: rgba(255, 255, 255, 0.22);
    }

    /* CUSTOM GLASS DROPDOWN */
    .question-left select {
      appearance: none;
      -webkit-appearance: none;
      background: rgba(255, 255, 255, 0.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23ffffff' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 1.2rem center;
      background-size: 12px;
      padding-right: 3rem !important;
      cursor: pointer;
    }

    .question-left select option {
      background: #006064;
      color: white;
      padding: 0.8rem;
    }

    .question-left select:hover,
    .question-left select:focus {
      border-color: rgba(0, 188, 212, 0.6);
      box-shadow: 0 0 12px rgba(0, 188, 212, 0.35);
      background-color: rgba(255, 255, 255, 0.22);
    }

    .image-right {
      flex: 1;
      max-width: 40%;
      text-align: center;
    }
    .image-right img {
      border-radius: 12px;
      max-height: 120px;
      width: auto;
    }

    .button-wrapper {
      text-align: center;
      margin-top: 3rem;
	  border-top: 1px solid #ffffff;
	  padding-top: 10px;
    }

    /* Robot check */
    .captcha-question {
      font-size: 1.6rem;
      font-weight: 700;
      margin: 1.5rem 0;
      color: white;
    }

    .captcha-options {
      display: flex;
      flex-wrap: wrap;
      gap: 1rem;
      justify-content: center;
      margin: 2rem 0;
    }

    .captcha-btn {
      min-width: 60px;
      padding: 0.9rem 1.2rem;
      font-size: 1.1rem;
    }

    .captcha-btn.wrong {
      background: rgba(255, 100, 100, 0.4) !important;
      border-color: #ff6b6b !important;
      animation: shake 0.5s;
    }

    #captchaFeedback {
      margin-top: 1rem;
      font-size: 1.1rem;
      font-weight: 700;
      min-height: 1.4rem;
      text-align: center;
    }

    @keyframes shake {
      0%, 100% { transform: translateX(0); }
      25% { transform: translateX(-8px); }
      75% { transform: translateX(8px); }
    }

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

    .thank-you {
      text-align: center;
      color: white;
      font-size: 1.8rem;
      opacity: 0;
      transform: scale(0.9);
      transition: opacity 0.6s ease, transform 0.6s ease;
    }
    .thank-you.visible { opacity: 1; transform: scale(1); }

    .form-error {
      color: #ff8787;
      font-size: 1.1rem;
      margin-top: 1rem;
      text-align: center;
      min-height: 1.4rem;
	  padding: 10px;
    }


	  
/* ==== ANDROID / MOBILE ROBOT CHECK – NO OVERFLOW GUARANTEED ==== */
/* FINAL FIX – ROBOT CHECK FULLY VISIBLE ON ALL DEVICES (including Samsung A55) */
@media (max-width: 768px) {
  .contact-form-container {
    padding: 2rem 1.2rem !important;
    max-width: 95vw !important;
    margin: 0 auto;
  }

  .form-step {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1.8rem !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .question-left {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    text-align: center !important;
    font-size: 1.2rem !important;
  }

  .captcha-question {
    font-size: 1.45rem !important;
    line-height: 1.4 !important;
    margin: 0.5rem 0 !important;
  }

  .captcha-options {
    width: 100% !important;
    max-width: 340px !important;
    margin: 1.5rem auto 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
    gap: 0.7rem !important;
  }

  .captcha-btn {
    padding: 0.9rem 0.4rem !important;
    font-size: 1rem !important;
    min-height: 56px !important;
  }

  #finalSubmitBtn {
    margin: 2rem auto 0 !important;
    width: 80% !important;
    max-width: 300px !important;
  }

  .image-right {
    margin-top: 0.5rem !important;
  }
  .image-right img {
    max-height: 100px !important;
  }
}

/* Tiny screens – still perfect */
@media (max-width: 380px) {
  .captcha-options { max-width: 300px !important; }
  .captcha-btn { font-size: 0.95rem !important; }
}
	  
    /* Fix pointer cursor on contact menu item */
    .contact-trigger { cursor: pointer !important; }
	
	
	
/* Footer section */
.site-footer {
  background: var(--blueish) url(assets/splash/hands_1_blur.jpg);
  background-repeat: no-repeat;
  background-size: cover;           /* ← Most important change: cover instead of 100% auto */
  background-position: center;      /* center is usually more reliable than bottom center */
  /* background-attachment: fixed;  ← Remove or test carefully — causes issues on many mobile devices */
  color: #fff;
  font-family: system-ui, sans-serif;
  position: relative;               /* helps with potential z-index / overflow situations */
}

/* Optional: subtle overlay to improve text readability */
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.0);  /* adjust darkness 0.25–0.55 */
  z-index: 0;
}

.footer-inner,
.footer-bottom {
  position: relative;
  z-index: 1;                       /* keep content above overlay */
}

.footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 70px 20px 50px;

  display: grid;
  grid-template-columns: 1fr 1.5fr 1fr;
  gap: 40px;
  align-items: center;
}

/* Mobile – stack columns */
@media (max-width: 850px) {           /* ← adjust breakpoint to taste (768–900px common) */
  .footer-inner {
    grid-template-columns: 1fr;       /* single column */
    gap: 50px;
    text-align: center;               /* centered content usually looks better on mobile */
    padding: 60px 16px 40px;
  }

  .footer-logo {
    order: -1;                        /* logo on top – most common pattern */
  }

  .trust-logo {
    width: 160px;                     /* slightly smaller on mobile */
  }

  .social-icons {
    justify-content: center;
  }

  .footer-info p,
  .footer-social p {
    max-width: 380px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Columns – shared styles */
.footer-col h3,
.footer-col h4 {
  margin-bottom: 12px;
  font-weight: 600;
}

.footer-col p {
  line-height: 1.6;
  opacity: 0.9;
}

/* Logo */
.footer-logo {
  display: flex;
  justify-content: center;
}

.trust-logo {
  width: 180px;
  height: auto;
}

/* Social icons */
.social-icons {
  display: flex;
  gap: 14px;
  margin-top: 16px;
}

.social-icons a {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255,255,255,0.6);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;

  color: #fff;
  text-decoration: none;
  font-weight: bold;
  transition: background 0.2s, color 0.2s;
}

.social-icons a:hover {
  background: #fff;
  color: #3c6f68;
}

/* Bottom bar */
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.2);
  text-align: center;
  padding: 20px 10px;
  font-size: 0.85rem;
}

.footer-bottom a {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
}