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

    /* Left Side - Fixed Width */
    .left-content {
      width: 850px;
      max-width: 100%;
    }

    .main-image {
      width: 100%;
      height: auto;
      object-fit: cover;
      border-radius: 8px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
      margin-bottom: 20px;
    }

    .image-scroll-wrapper {
      overflow-x: auto;
      white-space: nowrap;
      padding-bottom: 10px;
      -webkit-overflow-scrolling: touch;
      scroll-snap-type: x mandatory;
    }

    .image-scroll-wrapper::-webkit-scrollbar {
      height: 8px;
    }

    .image-scroll-wrapper::-webkit-scrollbar-thumb {
      background: #999;
      border-radius: 5px;
    }

    .image-scroll-wrapper::-webkit-scrollbar-thumb:hover {
      background: #666;
    }

    .thumbnail {
      display: inline-block;
      width: 180px;
      height: 120px;
      margin-right: 10px;
      border-radius: 6px;
      overflow: hidden;
      border: 2px solid #ccc;
      cursor: pointer;
      transition: transform 0.3s, border-color 0.3s;
      scroll-snap-align: start;
    }

    .thumbnail:hover {
      transform: scale(1.05);
      border-color: #333;
    }

    .thumbnail img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    /* Right Side - Fixed Width */
    .right-sidebar {
      width: 380px;
      margin-top: 50px;
      max-width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      background: #f9f9f9;
      border-radius: 8px;
      padding: 30px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.1);
      text-align: center;
      height: fit-content;
    }
    .sidebar-price {
      font-size: 32px;
      font-weight: bold;
      color: #2c3e50;
      margin-bottom: 15px;
    }

    .sidebar-title {
      font-size: 24px;
      font-weight: 600;
      color: #34495e;
      margin-bottom: 8px;
    }

    .sidebar-location {
      font-size: 18px;
      color: #7f8c8d;
    }

    /* Responsive Behavior */
@media (min-width: 1440px) {
  .left-content {
    width: 900px;
  }

  .right-sidebar {
    width: 400px;
  }
}


    @media (max-width: 991px) {
      .main-container {
        flex-direction: column;
        align-items: center;
      }
      .left-content, .right-sidebar {
        width: 100%;
      }
      .thumbnail {
        width: 140px;
        height: 90px;
      }
    }

    @media (max-width: 480px) {
      .thumbnail {
        width: 110px;
        height: 75px;
      }
    }


    .tick-container {
      display: grid;
      grid-template-columns: repeat(3, 1fr); /* 3 equal columns */
      gap: 10px;
      max-width: 800px;
      margin: auto;
    }

    .tick-list {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .tick-list li {
      position: relative;
      padding-left: 35px;
      margin-bottom: 12px;
      font-family: sans-serif;
      font-size: 18px;
    }

    .tick-list li::before {
      content: "✔";
      position: absolute;
      left: 0;
      top: 0;
      font-size: 24px;
      color: green;
      font-weight: bold;
      line-height: 1;
    }
h2 {
  font-size: 28px;
  font-weight: 700;
  color: #2c3e50; /* dark blue-gray */
  margin-bottom: 20px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  display: inline-block;
  padding-bottom: 5px;
}


         .pd-reviews-card {
  margin: 0; 
  padding: 15px;
}

.pd-reviews-card + .pd-reviews-card {
  margin-top: 0;
}

.image-wrapper {
  max-width: 100%;
  margin: 0 auto;
}

.property-info {
      display: flex;
      align-items: center;
      border: 1px solid #ccc;
      padding: 10px 0;
      max-width: 400px;
      font-family: Arial, sans-serif;
    }
    .info-item {
      flex: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      padding: 10px;
    }
    .divider {
      width: 1px;
      height: 40px;
      background-color: #ccc;
    }
    .info-icon {
      font-size: 18px;
      color: #555;
    }
    .info-label {
      font-weight: bold;
      color: #333;
    }

     /* Accordion Wrapper */

     .accordion-wrapper {
  max-width: 100%
  margin: 0 auto;
}
         /* Accordion Container */
         .accordion {
         width: 100%;
         max-width: 100%;
         border-bottom: 1px solid #ddd;
         box-sizing: border-box;
         }
         /* Accordion Item */
         .accordion-item {
         margin-bottom: 10px;
         width: 100%;
         }
         /* Accordion Header */
         .accordion-header {
         cursor: pointer;
         padding: 15px;
         background: #f9f9f9;
         border-radius: 5px;
         font-weight: bold;
         display: flex;
         justify-content: space-between;
         align-items: center;
         transition: background 0.3s;
         color: #000;
         width: 100%;
         box-sizing: border-box;
         }
         .accordion-header:hover {
         background: #eee;
         }
         .accordion-header::after {
         content: "+";
         font-size: 20px;
         transition: transform 0.3s, content 0.3s;
         }
         .accordion-header.active::after {
         content: "-";
         transform: rotate(180deg);
         }
         /* Accordion Body */
         .accordion-body {
         padding: 10px 15px;
         display: none;
         background: #38505e;
         color: #000 !important;
         border-left: 3px solid #007BFF;
         margin-top: 5px;
         border-radius: 5px;
         box-sizing: border-box;
         }
         .accordion-body.active {
         display: block;
         animation: fadeIn 0.3s ease-in-out;
         }
         /* Fade-In Animation */
         @keyframes fadeIn {
         from { opacity: 0; }
         to { opacity: 1; }
         }
         /* Custom List Styles */
         .custom-list {
         list-style: none;
         padding-left: 20px;
         margin: 0;
         }
         .custom-list li {
         position: relative;
         padding-left: 30px;
         margin-bottom: 10px;
         font-size: 16px;
         line-height: 1.5;
         white-space: normal;
         color: #fff;
         }
         .custom-list li::before {
         content: "✓";
         position: absolute;
         left: 0;
         top: 0;
         color: #d8e1e5;
         font-weight: bold;
         font-size: 18px;
         line-height: 1;
         }
         .custom-list ul li {
         font-size: 14px;
         color: #fff;
         }
         /* Responsive Design */
         @media (min-width: 1440px) {
  .accordion-header {
    padding: 10px;
    font-size: 20px;
    flex-direction: row;
    align-items: center;
  }
}

         @media (max-width: 768px) {
  .accordion {
    padding: 10px;
  }

  .accordion-header {
    padding: 10px;
    font-size: 16px;
    flex-direction: column;
    align-items: flex-start;
  }

  .accordion-body {
    font-size: 14px;
    padding: 8px 10px;
  }

  .custom-list {
    padding-left: 15px;
  }

  .custom-list li {
    font-size: 14px;
    padding-left: 22px;
    margin-bottom: 8px;
  }

  .custom-list li::before {
    font-size: 16px;
    top: 1px;
  }
}

.section-heading {
  text-align: center;
  margin-bottom: 10px;
  color: #333;
}

/* Large screens (1440px and above) */
@media (min-width: 1440px) {
  .section-heading {
    text-align: center;
    font-size: 36px;
  }
}

/* Tablets and small laptops */
@media (max-width: 1024px) {
  .section-heading {
    text-align: center;
    font-size: 28px;
  }
}

/* Mobile devices */
@media (max-width: 768px) {
  .section-heading {
    text-align: center;
    font-size: 26px;
    text-align: left;
  }
}

/* Very small screens */
@media (max-width: 479px) {
  .section-heading {
    padding-left: 0;
    text-align: center;
    font-size: 24px;
  }
}



/* Container for all accordion columns */
.accordion-columns {
  display: flex;
  gap: 30px;
  justify-content: center;
  align-items: flex-start;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
}

/* Each column */
.accordion-column {
  flex: 1 1 300px;
  min-width: 500px;
  max-width: 600px;
}

/* For 1366px screens */
@media (max-width: 1399px) and (min-width: 1300px) {
  .accordion-column {
    flex: 1 1 500px;
    min-width: 500px;
    max-width: 550px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .accordion-columns {
    max-width: 1280px;
    justify-content: space-around;
  }
}

/* Large Screens (1440px and above) */
@media (min-width: 1440px) {
  .accordion-columns {
    max-width: 1400px;
    margin: 0 auto;
    justify-content: space-between;
  }

  .accordion-column {
    flex: 0 0 650px; /* Fixed width for large screens */
    max-width: 650px; /* Ensures column width stays at 600px */
    padding-left: 20px;
    padding-right: 20px;
  }
}


/* Tablet screens */
@media (max-width: 991px) {
  .accordion-column {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

/* Mobile screens */
@media (max-width: 479px) {
  .accordion-columns {
    flex-direction: column;
    padding: 10px;
    gap: 15px;
  }

  .accordion-column {
    width: 100%;
  }
}

.floor-plan-heading {
  padding-left: 100px; 
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #333;
}

/* Large screens (1440px and above) */
@media (min-width: 1440px) {
  .floor-plan-heading {
    padding-left: 35px; /* Increased padding for large screens */
    font-size: 32px; /* Optionally, increase font size on large screens */
  }
}

/* For 1366px screen size */
@media (max-width: 1399px) and (min-width: 1366px) {
  .floor-plan-heading {
    padding-left: 150px; 
    font-size: 32px; 
  }
}

/* Tablets and small laptops (max-width: 1024px) */
@media (max-width: 1024px) {
  .floor-plan-heading {
    padding-left: 32px;
    font-size: 28px;
  }
}

/* Mobile devices (max-width: 768px) */
@media (max-width: 768px) {
  .floor-plan-heading {
    padding-left: 20px;
    font-size: 26px;
    text-align: left;
  }
}

/* Very small screens (max-width: 479px) */
@media (max-width: 479px) {
  .floor-plan-heading {
    padding-left: 0;
    text-align: center;
    font-size: 24px;
  }
}



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

.image-column {
  flex: 1 1 50%;
  max-width: 50%;
  box-sizing: border-box;
}



/* Tablets */
@media (max-width: 991px) {
  .floor-plan-img {
    padding: 30px;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .image-columns {
    flex-direction: column;
    align-items: center;
  }

  .image-column {
    flex: 1 1 100%;
    max-width: 100%;
  }

  .floor-plan-img {
    padding: 20px;
  }
}

/* Large Screens (1920px and above) */
@media (min-width: 1440px) {
  .floor-plan-img {
    padding: 5px;
  }
}
@media (max-width: 768px) {
  .image-column {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

/* Container for the image */

.single-image-wrapper {
  position: relative;
  width: 100%;
  height: 479px; /* Full height of the screen */
  overflow: hidden; /* Ensures the image doesn't overflow */
}

/* Image styling */
.floor-plan-img {
  width: 100%; /* Default to full width */
  height: auto; /* Maintain aspect ratio */
  display: block;
  border-radius: 8px;
}

/* For large screens (1920px) */
@media (min-width: 1920px) {
  .single-image-wrapper {
    width: 100%;
    height: 100vh; /* Full height of the screen */
  }

  .floor-plan-img {
    width: 1920px; /* Fixed width for 1920px screens */
    height: 480px; /* Fixed height for 1920px screens */
  }
}

/* For 1366px screens */
@media (min-width: 1366px) and (max-width: 1919px) {
  .single-image-wrapper {
    width: 100%;
    height: 100vh; /* Full height of the screen */
  }

  .floor-plan-img {
    width: 1366px; /* Fixed width for 1366px screens */
    height: 480px; /* Fixed height for 1366px screens */
  }
}

/* For tablets (1024px and below) */
@media (max-width: 1024px) {
  .single-image-wrapper {
    width: 100%;
    height: 100vh; /* Full height of the screen */
  }

  .floor-plan-img {
    width: 1024px; /* Fixed width for tablets */
    height: 480px; /* Fixed height for tablets */
  }
}

/* For mobile devices (768px and below) */
@media (max-width: 768px) {
  .single-image-wrapper {
    width: 100%;
    height: 100vh; /* Full height of the screen */
  }

  .floor-plan-img {
    width: 768px; /* Fixed width for smaller mobile devices */
    height: 432px; /* Fixed height for smaller mobile devices */
  }
}

/* For very small screens (480px and below) */
@media (max-width: 479px) {
  .single-image-wrapper {
    width: 100%;
    height: 100vh; /* Full height of the screen */
  }

  .floor-plan-img {
    width: 480px; /* Fixed width for very small screens */
    height: 270px; /* Fixed height for very small screens */
  }
}



