*,
*::after,
*::before {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: "Playfair Display", serif;
}

p {
    font-family: Inter;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: Jura, sans-serif;
}


.project-main {
    min-height: 100vh;
    width: 100%;
    background-image: url("https://pub-d42da20eaf1e49769442c7255703f40d.r2.dev/project-bg.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    /* overflow-x: hidden;
    overflow-y: hidden; */
    /* position:relative; */
   


}

.project-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    /* align-items: center; */
}

.project-wrapper {
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;

}






.project-heading h1 {
    font-family: Jura;
    font-weight: 600;
    font-size: 64px;
    line-height: 62.72px;
    letter-spacing: 0%;
    color: white;
}

.project-heading {
padding-top: 100px;
    display: flex;
    align-items: center;
    justify-content: center;

}


.project-sec2
{
    display: flex;
    flex-direction: column;
    margin-top:64px;
    justify-content: center;
    align-items: center;
}
.project-sec2 p{
 
font-weight: 400;
font-size: 24px;
line-height: 34.8px;
letter-spacing: 0%;
text-align: center;

}
.project-sec2 span
{
    font-family: Inter;
    font-weight: 700;
    font-size: 20px;
    line-height: 24.2px;
    letter-spacing: 4%;
    text-align: center;
    margin-top: 32px;
    
}
.specifications
{
    display: flex;
    flex-wrap: wrap;
    margin-top: 64px;
    width: 100%;
    /* gap:151px; */
    justify-content: center;
}
.spec-img-text
{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap:18px;
    align-items: center;
    margin: 15px;
    width: 250px;
}
.spec-img-text img
{
    width: 100px;
height: 100px;
/* border-radius: 50%; */
/* background: #DEF4FF80; */

}
.spec-img-text p

{
    
font-weight: 700;
font-size: 16px;
line-height: 19.36px;
letter-spacing: 0%;
text-align: center;

}
.project-find-more-btn
{
 background-color: black;
font-family: Inter;
font-weight: 500;
font-size: 24px;
line-height: 30px;
letter-spacing: 0%;
color: #FFFFFF;
height:47px;
width: 271px;
margin-top:65px ;
}
.project-layout 
{
margin-top :50px;
margin-bottom :50px;

width: 100vw;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
gap:42px;

}

.project-layout h1
{
color:#494949;
font-weight: 600;
font-size: 48px;
line-height: 49.92px;
letter-spacing: 0%;
text-align: center;

}
.project-sec4
{
background:   #E0F5FF;
    width: 100%;


}
.project-sec-4-wrapper
{
    display: flex;
    padding-top:105px ;
    padding-bottom:105px;
    gap:80px;
    /* align-items: center; */
    color:#494949;
}

.interior-text-wrapper   h3
{
    
    font-weight: 600;
    font-size: 48px;
    /* line-height: px; */
    letter-spacing: 0%;


    

}
.interior-text-wrapper {
    position: relative;
    padding: 16px;
    overflow: visible;
}

/* Refined accordion styling within interior-text-wrapper */
.interior-text-wrapper .accordion-item {
    /* border-radius: 12px; */
    background: #ffffff;
    border: 1px solid #dee2e6 !important;
    margin-bottom: 14px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.interior-text-wrapper .accordion-button {
    padding: 16px 18px;
    font-weight: 600;
    color: #1e1e1e;
}
.interior-text-wrapper .accordion-button:not(.collapsed) {
    background-color: #006699!important;
    color:white !important;
}
.interior-text-wrapper .accordion-body {
    padding: 16px 18px 16px 18px;
}
.accordion-item {
    border: solid 1px #dee2e6 !important;
    outline: none !important;
}

/* Closed state (black arrow) */
.interior-text-wrapper .accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6-.708.708-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
}

/* Open state (white arrow) */
.interior-text-wrapper .accordion-button:not(.collapsed)::after {




    transform: rotate(180deg);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6-.708.708-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

.accordion-button{
font-size: 24px;
    border: none !important;
    outline: none !important;
        box-shadow:none !important;
}

/* Ensure accordion chevron arrow is visible */


.accordion {

    --bs-accordion-border:none !important;
     border: none !important;
    outline: none !important;
}

.interior-text-wrapper 
{
width: 100%;
position: relative;
padding: 16px;
overflow: visible !important;
}
b, strong {
 
    font-family: 'Inter';
}

 ul  li
{

    font-family: Inter;
    font-weight: 400;
    font-size: 18px;
    line-height: 28.08px;
    letter-spacing: -4%;
   color: #494949;
    

}
.heading{
    font-weight: 600;
    font-size: 48px;
    line-height: 49.92px;
    letter-spacing: 0%;
    color: #494949;
    margin-bottom: 40px;
}

 ul 
{
padding-left: 1rem !important;

/* margin-top:42px ; */
 font-family: Inter;

}
.section-city
{
    padding-top:42px ;
    padding-bottom:42px ;
}
.section-city-wrapper
{
    align-items: center;
    display: flex;
    flex-direction: column;
}
.section-city h1
{

font-weight: 600;
font-size: 48px;
line-height: 49.92px;
letter-spacing: 0%;
color:#494949;
margin-bottom:40px;

}


.city-my-column
{
display: flex;
margin-top: 50px;
gap:12px;
flex-direction: column;
align-items: center;
justify-content: space-between;
}

.city-my-column span
{
    font-family: Inter;
    font-weight: 600;
    font-size: 20px;
    line-height: 31.2px;
    letter-spacing: 0%;
    text-align: center;
    color:#1E1E1E;
    
    
}
.city-my-row
{
width: 100%;
}
.project-view-all
{
    border:none;
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
    line-height: 31.2px;
    letter-spacing: 0%;
    text-align: center;
    text-decoration: underline;
    text-decoration-style: solid;
    text-decoration-thickness: Auto;
    text-decoration-skip-ink: auto;

    background: none;
    color:#000000;
    margin-top: 36px;
    
}
.hidden {
    display: none;
}

/* Hide Swiper pagination dots */
.mySwiper .swiper-pagination {
    display: none !important;
}
.swiper-pagination-bullet-active {

    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: #006596 !important
}

/* Swiper navigation: place arrows outside the accordion area */
.mySwiper {
    --swiper-navigation-color: #ffffff;
    --swiper-navigation-size: 18px;

    padding: 0 16px; /* breathing room so arrows feel outside */
}
/* Hide default Swiper navigation arrows */
.mySwiper .swiper-button-next,
.mySwiper .swiper-button-prev {
    display: none !important;
}


/* Ensure parent containers don't clip the arrows */
.interior-text-wrapper {
    position: relative;
    padding: 16px 20px;
    overflow: visible !important;
}

.project-sec4 .container {
    overflow: visible !important;
}

.project-sec4 .row {
    overflow: visible !important;
}

.project-sec4 .col-12,
.project-sec4 .col-md-6 {
    overflow: visible !important;
}

/* Custom navigation arrows outside the accordion */
.custom-swiper-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #006699;
    border: none;
    color: white;
    font-size: 20px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-swiper-nav:hover {
    background: #005580;
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
}

.custom-swiper-nav:active {
    transform: translateY(-50%) scale(0.95);
}

.custom-swiper-nav.prev {
    left: -60px;
}

.custom-swiper-nav.next {
    right: -60px;
}

/* Responsive positioning for custom arrows */
@media (max-width: 1200px) {
    .custom-swiper-nav.prev {
        left: -60px;
    }
    .custom-swiper-nav.next {
        right: -60px;
    }
}

@media (max-width: 768px) {
    .custom-swiper-nav.prev {
        left: -50px;
    }
    .custom-swiper-nav.next {
        right: -50px;
    }
    .custom-swiper-nav
    {
        width: 25px;
        height: 25px;
        font-size: 16px;
    }

    

}

@media (max-width: 600px) {
    .custom-swiper-nav.prev {
        left: -29px;
    }
    .custom-swiper-nav.next {
        right: -29px;
    }
  .custom-swiper-nav
    {
        width: 20px;
        height: 20px;
        font-size: 12px;
    }
.spec-img-text {

    width: 150px;
}



}


.project-sec7
{
margin:50px 0px;
width: 100%;

}
.project-sec7 h1
{

   
font-weight: 600;
font-size: 48px;
line-height: 49.92px;
letter-spacing: 0%;
text-align: center;
color:#494949;

}
.project-sec-7-wrapper
{
display: flex;
flex-direction: column;
gap:40px;
align-items: center;
}
.location-wrapper
{
    width: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
gap:70px;
}
.location-wrapper span
{
    font-family: Inter;
    font-weight: 400;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: 0%;
    color:#494949;
    text-align: center;
    display: flex;
    align-items: start;
    
}

.property-showcase-wrapper {
 width: 100%;
    
 background: linear-gradient(275.89deg, #FFFFFF 12.47%, #EEF9FF 75.96%);

    
}

.property-showcase {
 
    border-radius: 5px;
    padding: 15px;


    margin: 2px auto;
    
}

.property-title {
    font-family: Jura;
    font-weight: 600;
    font-size: 48px;
    line-height: 49.92px;
    letter-spacing: 0%;
    text-align: center;
    color:#494949;
    margin-bottom: 40px;
    
}

.main-image {
    width: 100%;
    border-radius: 5px;
    margin-bottom: 15px;
    height: auto;
}

.thumbnail-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.thumbnail {
    background-color: #ccc;
    border-radius: 18px;
    width: calc(16.666% - 10px);
    aspect-ratio: 1/1;
    cursor: pointer;
    transition: opacity 0.3s;
}

.thumbnail:hover {
    opacity: 0.8;
}

@media (max-width: 768px) {
    .thumbnail {
        width: calc(33.333% - 10px);
    }
    .accordion-button{
font-size: 18px;
    border: none !important;
    outline: none !important;
        box-shadow:none !important;
}
}

@media (max-width: 600px) {
    .property-title {
        font-size: 20px;
    }
    
    .thumbnail {
        width: calc(50% - 5px);
    }
}

























/* -------------------------------------------------- */

.gallery-container {
    /* max-width: 1200px; */
    /* margin: 0 auto; */
    /* padding: 20px; */
/* background:   #E0F5FF; */
width: 100%;
padding:40px 0px;



}
.section-8-form-wrapper
{
    background:   #E0F5FF;
    }

.gallery-container h1{
   
    color:#494949;
    font-weight: 600;
    font-size: 48px;
    line-height: 49.92px;
    letter-spacing: 0%;
    text-align: center;
    padding-bottom: 20px;
    
}

.gallery-title {
    text-align: center;
    color: #333;
    margin-bottom: 30px;
    font-size: 2.5rem;
    font-weight: 300;
}

.gallery-item {
    margin-bottom: 20px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    height: 100%;
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.gallery-item:hover img {
    transform: scale(1.03);
}

.tall-item {
    height: 564px;
}

.medium-item {
    height: 270px;
}

.small-item {
    height: 270px;
}


@media (max-width: 768px) {
    .tall-item, .medium-item, .small-item {
        height: 250px;
    }
    
    .gallery-title {
        font-size: 2rem;
    }
}

@media (max-width: 576px) {
    .gallery-container {
        padding: 10px;
    }
    
    .gallery-title {
        font-size: 1.8rem;
        margin-bottom: 20px;
    }
}



.section-8-form {
    display: flex;
align-items: center;
    width: 100%;
    justify-content: space-between;
    margin:45px 0px 64px 0px;
    

}




.property-image {
    width: 100%;
display: flex;
align-items: center;
    position: relative;
    overflow: hidden;
}

.property-image img {
    width: 100%;
   
    object-fit: cover;
    display: block;
    min-height: 600px;
}

/* Right Section - Contact Form */
.contact-form {
    
/* margin: 25px; */
width: 70%;
    padding: 25px;
    background: #006699;
   border-radius:27px ;
align-items: center;


}

/* Form Title */
.contact-form h2 {
    font-family: Jura;
    font-weight: 700;
    font-size: 48px;
    line-height: 56.78px;
    letter-spacing: 0%;
    text-align: center;
    margin-bottom: 28px;
    color: white;



}


/* Form Groups */
.form-group {
    margin-bottom: 20px;
    align-items: center;
    display: flex;
    justify-content: center;
}

/* Input & Textarea Styling */
.form-group input, 
textarea {
    width: 100%;
    padding: 10px;
    border: none;
    border-radius: 5px;
    background: white;
    color: #333;
    font-size: 16px;
    transition: all 0.3s ease;
}

.form-group input:focus, 
textarea:focus {
    outline: none;
    box-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
}

.form-group textarea {
    resize: vertical;
    min-height: 100px;
}

/* Submit Button */
.form-group button {
    width: 40%;
    padding: 10px;
    border: none;
    border-radius: 5px;
    font-family: inter;
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0px;
    text-align: center;
    color:#006596; 
    background-color:white;
    margin-top: 28px;
    transition: all 0.3s ease;
}

.form-group button:hover {
    background: #f0f0f0;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

/* Placeholder Styling */
::placeholder {
    color: #999;
    font-family: Inter;
font-weight: 400;
font-size: 16px;

line-height: 19.36px;
letter-spacing: 0%;


}

/* Input Focus Effects */
input:hover, 
textarea:hover {
    background-color: #f8f8f8;
}

/* Form Validation - Error & Success States */
input:invalid, 
textarea:invalid {
    border: 1px solid #0F1B241A
}

input:valid, 
textarea:valid {
    border: 1px solid #0F1B241A
}

/* Responsive Design */
@media screen and (max-width: 1024px) {
    .section-8-form {
        width: 95%;
        margin: 20px;
    }
    .contact-form {
        padding: 20px;
        width: 80%;
    }
}

@media screen and (max-width: 800px) {
    .section-8-form {
        flex-direction: column;
        max-width: 600px;
    }
    .property-image img {
        min-height: 300px;
    }
    .contact-form {
        width: 100%;
        margin-top:50px ;
    }
     ul  li
{

    
    font-size: 16px;
    

}
  
}

@media screen and (max-width: 480px) {
  
    .section-8-form {
        margin: 10px;
        border-radius: 8px;
    }
    .contact-form {
        padding: 20px;
    }
  

    .property-image img {
        min-height: 200px;
    }
    .form-group {
        margin-bottom: 15px;
    }
}

/* Animation for Form Elements */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

























/* ---------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1023px) {
   

    /* .project-heading {
       p-top: 150px;
    } */
   
    .project-sec2
{

    margin-top:50px;
}

    .mynav {
   
    
        padding-left: 50px;
        padding-right: 50px;

    }
    .project-find-more-btn
{
 
margin-top:30px ;
}

.specifications
{
    
    margin-top: 50px;
    
}
    .project-sec-4-wrapper
{
    display: flex;
    flex-direction: column;
    
    gap:40px;
    align-items: center;
    padding-top:50px;
    padding-bottom:50px;
}
.project-layout
{
    gap:35px;
}
.location-wrapper
{
   
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
gap:70px;
}
.location-wrapper span
{
   
    font-family: Inter;
    font-weight: 400;
    font-size: 20px;
  
    letter-spacing: 0%;
    
}
.location-left img 
{
height:25px;
width: 25px;
}
.section-city {
    padding-bottom: 0px;
    
}



}


@media only screen and (max-width: 600px) {
   

    .mynav 
    {

        padding-left: 12px;
        padding-right: 12px;
    }
    .interior-text-wrapper ul li {
        font-family: Inter;
        font-weight: 400;
        font-size: 16px;
        line-height: 28.08px;
        letter-spacing: -4%;
        color: #494949;
    }
    .location-wrapper span {
        font-family: Inter;
        font-weight: 400;
        font-size:16px;
        letter-spacing: 0%;
    }
    .interior-text-wrapper ul {
        
        /* margin-top: 20px; */
    
}
.section-city {
    padding-bottom: 0px;
    
}
.section-city h1 {
    
    margin-bottom: 0px;
}
.project-sec7 {
    margin-bottom: 0px;
    width: 100%;
} 
.interior-text-wrapper h3
{
    text-align: center;
    margin-top: 20px;
}

    
}