﻿body {}

@font-face {
    font-family: 'DancingScript';
    src: url('../Fonts/DancingScript.ttf') format('truetype');
}

.DancingScript {
    font-family: DancingScript
}

.carousel-item img {
    height: 500px;
    object-fit: cover;
}

.card-body img {
    max-width: 50%;
    max-height: 200px;
}

.myTopBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 18px;
    border: none;
    outline: none;
    background-color: rgba(147, 148, 150, 0.54);
    color: white;
    cursor: pointer;
    padding: 15px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.myTopBtn:hover {
    background-color: rgb(255 193 7);
    color:black;
}

.navmenu {
    color:white;
}

.navmenu:hover {
    color:rgb(255 193 7);
}

.carousel-wrapper {
      overflow: hidden;
      position: relative;
    }

    .testimonial-track {
      display: flex;
      width: calc(300px * 12); /* item width * number of items */
      animation: scroll 30s linear infinite;
    }

    .testimonial-item {
      flex: 0 0 300px;
      margin: 15px;
      background: #ffffff;
      border-radius: 15px;
      padding: 20px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);
      text-align: center;
    }

    .testimonial-item img {
      width: auto;
      height: 70px;
      object-fit: cover;
      border-radiu1s: 50%;
      margin-bottom: 10px;
    }

    @keyframes scroll {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

    /* Duplicate the track for infinite scroll illusion */
    .testimonial-track > .testimonial-item {
      min-width: 300px;
    }

    @media (max-width: 768px) {
      .testimonial-track {
        width: calc(250px * 12);
      }

      .testimonial-item {
        flex: 0 0 250px;
      }
    }

      .flip-card {
      perspective: 1000px;
    }

    .flip-card-inner {
      position: relative;
      width: 100%;
      height: 300px;
      transition: transform 0.8s;
      transform-style: preserve-3d;
      border-radius: 1rem;
    }

    .flip-card:hover .flip-card-inner {
      transform: rotateY(180deg);
    }

    .flip-card-front,
    .flip-card-back {
      position: absolute;
      width: 100%;
      height: 100%;
      backface-visibility: hidden;
      border-radius: 1rem;
      overflow: hidden;
    }

    .flip-card-front img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: brightness(50%);
    }

    .flip-card-front .overlay-text {
      position: absolute;
      bottom: 0;
      padding: 1.5rem;
      color: white;
      background: linear-gradient(to top, rgba(0, 0, 0, 0.6), transparent 60%);
      width: 100%;
    }

    .flip-card-back {
      background-color: #343a40;
      color: white;
      transform: rotateY(180deg);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 2rem;
      text-align: center;
    }

    .hero-section {
  position: relative;
}
.hero-section .overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6); /* adjust 0.4 → 0.6 for darker */
}

.hero-logo {
  max-width: 150px;   /* controls size */
  height: auto;
}


.hero {
min-height: 70vh;
color: #fff;
display: flex;
align-items: center;
}


/* Page-specific hero backgrounds */
.hero-servicesFS {
background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.55)),
url('../b5img/HomeBannerFS.jpg') center/cover no-repeat;
}


.hero-servicesRS {
background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.55)),
url('../b5img/PPResidance01.jpg') center/cover no-repeat;
}


.hero-servicesLD {
background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.55)),
url('../b5img/LandDev04.jpg') center/cover no-repeat;
}


.hero h1 {
font-size: 3rem;
font-weight: 700;
}


.hero p {
font-size: 1.25rem;
}


.service-card {
transition: transform 0.3s ease, box-shadow 0.3s ease;
}


.service-card:hover {
transform: translateY(-6px);
box-shadow: 0 10px 25px rgba(245, 227, 129, 0.15);
border-color: rgb(252, 185, 1);
}



