:root {
    --bs-green: #1EE4D2;
    --bs-dun: #e6cfab;
    --bs-primary: #1ca295;
    --bs-secondary: #6c757d;
    --bs-success: #1ca295;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f6f6e8;
    --bs-gray-dark: #383737;
    --bs-dark: #383737;
}

/* Mise en page: body en flex colonne pour garder le footer visible */
html, body {
    height: 100%;
}
.bg-primary {
    color: var(--bs-primary) !important;
}

.fade-enter-active, .fade-leave-active {
    transition: opacity 3000ms;
}
.fade-enter-from, .fade-leave-to {
    opacity: 0;
}
.fade-enter-to, .fade-leave-from {
    opacity: 1;
}

.btn-primary:hover {
    background-color: var(--bs-green);
    border-color: var(--bs-primary);
}

nav#main.navbar {
    background-color: var(--bs-gray-dark);
}
nav.navbar a.navbar-brand img {
    max-height: 48px;
    width: 100%;
    height: auto;
    display: block;
}
/* Ensure navbar brand container doesn't collapse */
nav.navbar a.navbar-brand {
    padding-top: .3125rem;
    padding-bottom: .3125rem;
    min-width: 160px; /* Prevent flexbox from shrinking brand to zero, ensures logo remains visible/clickable */
}
/* Make sure navbar background is not white (white logo must stay visible) */
nav#main.navbar.navbar-light { 
    background-color: var(--bs-gray-dark) !important;
}
/* Homepage: transparent header over hero */
body.homepage nav#main.navbar.navbar-light {
    background-color: transparent !important;
}
/* When scrolled on homepage, use solid navbar */
body.homepage.scrolled nav#main.navbar.navbar-light {
    background-color: var(--bs-gray-dark) !important;
}

/* Compense le fixed-top pour les pages non-homepage */
body:not(.homepage) {
    padding-top: 64px;
}
nav#main.navbar.navbar-light.navbar-expand-lg ul.navbar-nav {

}
nav#main.navbar.navbar-light.navbar-expand-lg ul.navbar-nav li.nav-item a.nav-link {
    color: white;
    font-size: 1.2rem;
}

footer {
    background-color: var(--bs-dark);
    color: white;
    padding-top: 2rem;
    padding-bottom: 2rem;
}
footer #brand img {
    width: 75%;
}

section.bsb-overlay{--bsb-overlay-opacity:0.2;--bsb-overlay-bg-color:var(--bs-black-rgb);position:relative}.bsb-overlay:after{background-color:rgba(var(--bsb-overlay-bg-color),var(--bsb-overlay-opacity));bottom:0;content:"";display:block;left:0;position:absolute;right:0;top:0;z-index:0}.bsb-overlay>*{position:relative;z-index:1}.bsb-overlay-figure{--bsb-overlay-figure-opacity:0.5;--bsb-overlay-figure-bg-color:var(--bs-black-rgb);position:relative}.bsb-overlay-figure:after{background-color:rgba(var(--bsb-overlay-figure-bg-color),var(--bsb-overlay-figure-opacity));bottom:0;content:"";display:block;left:0;position:absolute;right:0;top:0}.bsb-overlay-hover{--bsb-overlay-hover-opacity:0.5;--bsb-overlay-hover-bg-color:var(--bs-black-rgb);position:relative}.bsb-overlay-hover>a{bottom:0;display:block;left:0;position:relative;right:0;top:0}.bsb-overlay-hover>a>img.bsb-scale{--bsb-scale:1}.bsb-overlay-hover>a>img.bsb-scale,.bsb-overlay-hover>a>img.bsb-scale-up{transform:scale3d(var(--bsb-scale),var(--bsb-scale),var(--bsb-scale));transform-style:preserve-3d;transition:transform .5s}.bsb-overlay-hover>a>img.bsb-scale-up{--bsb-scale:1.2}.bsb-overlay-hover>a:after{background-color:rgba(var(--bsb-overlay-hover-bg-color),var(--bsb-overlay-hover-opacity));content:"";cursor:pointer!important;display:block;z-index:0}.bsb-overlay-hover>a:after,.bsb-overlay-hover>figcaption{bottom:0;left:0;opacity:0;position:absolute;right:0;top:0}.bsb-overlay-hover>figcaption{align-items:center;display:flex;flex-direction:column;justify-content:center;pointer-events:none;z-index:1}.bsb-overlay-hover>figcaption>*{opacity:0}.bsb-overlay-hover:hover>a>img.bsb-hover-scale{--bsb-scale-hover:1;transform:scale3d(var(--bsb-scale-hover),var(--bsb-scale-hover),var(--bsb-scale-hover))}.bsb-overlay-hover:hover>a>img.bsb-hover-scale-up{--bsb-scale-hover:1.2;transform:scale3d(var(--bsb-scale-hover),var(--bsb-scale-hover),var(--bsb-scale-hover))}.bsb-overlay-hover:hover>a:after{opacity:1;transition:opacity .15s linear}.bsb-overlay-hover:hover>figcaption{opacity:1;transition:opacity .15s linear .1s}.bsb-overlay-hover:hover>figcaption>.bsb-hover-fadeIn{--bsb-animation-duration:500ms;animation-duration:var(--bsb-animation-duration);animation-fill-mode:both;animation-name:bsb-fadeIn}.bsb-overlay-hover:hover>figcaption>.bsb-hover-fadeInUp{--bsb-animation-duration:500ms;animation-duration:var(--bsb-animation-duration);animation-fill-mode:both;animation-name:bsb-fadeInUp}.bsb-overlay-hover:hover>figcaption>.bsb-hover-fadeInDown{--bsb-animation-duration:500ms;animation-duration:var(--bsb-animation-duration);animation-fill-mode:both;animation-name:bsb-fadeInDown}.bsb-overlay-hover:hover>figcaption>.bsb-hover-fadeInLeft{--bsb-animation-duration:500ms;animation-duration:var(--bsb-animation-duration);animation-fill-mode:both;animation-name:bsb-fadeInLeft}.bsb-overlay-hover:hover>figcaption>.bsb-hover-fadeInRight{--bsb-animation-duration:500ms;animation-duration:var(--bsb-animation-duration);animation-fill-mode:both;animation-name:bsb-fadeInRight}.bsb-overlay-hover:hover>figcaption>.bsb-hover-zoomIn{--bsb-animation-duration:500ms;animation-duration:var(--bsb-animation-duration);animation-fill-mode:both;animation-name:bsb-zoomIn}.bsb-hover-pull{transform:scaleX(1);transform-style:preserve-3d;transition:all .5s}.bsb-hover-pull:hover{transform:scale3d(1.02,1.02,1.02)}.bsb-hover-push{transform:scaleX(1);transform-style:preserve-3d;transition:all .5s}.bsb-hover-push:hover{transform:scale3d(.98,.98,.98)}.bsb-hover-image .bsb-scale{--bsb-scale:1}.bsb-hover-image .bsb-scale,.bsb-hover-image .bsb-scale-up{transform:scale3d(var(--bsb-scale),var(--bsb-scale),var(--bsb-scale));transform-style:preserve-3d;transition:transform .5s}.bsb-hover-image .bsb-scale-up{--bsb-scale:1.2}.bsb-hover-image:hover .bsb-hover-scale{--bsb-scale-hover:1}.bsb-hover-image:hover .bsb-hover-scale,.bsb-hover-image:hover .bsb-hover-scale-up{transform:scale3d(var(--bsb-scale-hover),var(--bsb-scale-hover),var(--bsb-scale-hover))}.bsb-hover-image:hover .bsb-hover-scale-up{--bsb-scale-hover:1.2}.bsb-btn-xl{--bs-btn-padding-y:0.625rem;--bs-btn-padding-x:1.25rem;--bs-btn-font-size:calc(1.26rem + 0.12vw);--bs-btn-border-radius:var(--bs-border-radius-lg)}@media(min-width:1200px){.bsb-btn-xl{--bs-btn-font-size:1.35rem}}.bsb-btn-2xl{--bs-btn-padding-y:0.75rem;--bs-btn-padding-x:1.5rem;--bs-btn-font-size:calc(1.27rem + 0.24vw);--bs-btn-border-radius:var(--bs-border-radius-lg)}@media(min-width:1200px){.bsb-btn-2xl{--bs-btn-font-size:1.45rem}}.bsb-btn-3xl{--bs-btn-padding-y:0.875rem;--bs-btn-padding-x:1.75rem;--bs-btn-font-size:calc(1.28rem + 0.36vw);--bs-btn-border-radius:var(--bs-border-radius-lg)}@media(min-width:1200px){.bsb-btn-3xl{--bs-btn-font-size:1.55rem}}.bsb-btn-4xl{--bs-btn-padding-y:1rem;--bs-btn-padding-x:2rem;--bs-btn-font-size:calc(1.29rem + 0.48vw);--bs-btn-border-radius:var(--bs-border-radius-lg)}@media(min-width:1200px){.bsb-btn-4xl{--bs-btn-font-size:1.65rem}}.bsb-btn-5xl{--bs-btn-padding-y:1.125rem;--bs-btn-padding-x:2.25rem;--bs-btn-font-size:calc(1.3rem + 0.6vw);--bs-btn-border-radius:var(--bs-border-radius-lg)}@media(min-width:1200px){.bsb-btn-5xl{--bs-btn-font-size:1.75rem}}.bsb-hero-1{background-attachment:fixed;background-position:50%;background-size:cover;padding-bottom:3rem;padding-top:3rem}@media(min-width:768px){.bsb-hero-1{padding-bottom:5rem;padding-top:5rem}}@media(min-width:1200px){.bsb-hero-1{padding-bottom:10rem;padding-top:10rem}}
section.bsb-hero-1 h2 {
    font-family: Roboto, serif;
    letter-spacing: 0.25rem;
    font-size: calc(1.75rem + 0.75vw);
}

section.list .subtitle {
    font-family: Georgia, serif;
}
section.list .subtitle h3 {
    font-size: 2rem;
    font-weight: 900;
}
section.list .subtitle p {
    font-size: 1.2rem;
    text-align: center;
}
section.list {
    margin-bottom: 2rem;
}
section.list h3 {
    font-family: Georgia, serif;
    color: var(--bs-gray-dark);
    font-size:calc(1.5rem + 0.75vw);
    text-align: center;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

section.list .card {
    background-color: var(--bs-light);
    margin-bottom: 1.5rem;
    height: 450px;
}
section.list .card:hover {
    border-color: var(--bs-success);
}
section.list .card .card-title a {
    font-size: calc(0.9rem + 0.5vw);
    font-family: Georgia, serif;
    font-weight: 800;
    color: var(--bs-gray-dark);
    text-decoration: none;
}
section.list .card .card-text {
    font-family: Georgia, serif;
    font-size: calc(0.8rem + 0.5vw);
}
section.list .card .card-body .location {
    font-size:0.8rem;
}
section.list .card .card-body .property-type {
    font-size:0.8rem;
    text-align: end;
}

section.list .card a img.card-img-top.card-img-home {
    width: 100%;
    height: 15vw;
    object-fit: cover;
}

section.list .seemore {
    text-align: center;
}

.fill, .fill-1 {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
/* Set container heights; images will cover without distortion */
.fill { height: 220px; }
.fill-1 { height: clamp(320px, 48vh, 560px); }

/* Ensure images fill their boxes without stretching */
#property #lightbox .fill img,
#property #lightbox .fill-1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    flex-shrink: 0;
}

/* Right mosaic: match left image height with a 3x2 grid (no offsets) */
@media (min-width: 768px) {
  /* Target the right column's inner row */
  #property #lightbox > .row > div:nth-child(2) > .row.g-0 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr); /* two equal rows */
    height: clamp(320px, 48vh, 560px); /* exactly same height as .fill-1 */
    gap: 0; /* keep Bootstrap g-0 intent */
  }
  /* Each tile fills its grid cell */
  #property #lightbox > .row > div:nth-child(2) > .row.g-0 > .fill {
    height: 100%;
    width: 100%;
  }
  /* Ensure images cover their cells */
  #property #lightbox > .row > div:nth-child(2) > .row.g-0 > .fill img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block; /* remove inline gap */
  }
}

.fill-1:hover {
    background-color: rgba(0,0,0,125);
}


/* Styles de chips */
.badge.chip-default {
    background-color: var(--bs-secondary);
    color: var(--bs-light);
    border: 1px solid rgba(0, 0, 0, 0.125);
}
.badge.chip-favorite {
    background-color: var(--bs-primary);
    color: var(--bs-light);
    border: 1px solid var(--bs-secondary);
}

.badge.chip-favorite .bi-star-fill {
    filter: drop-shadow(0 0 0.25rem rgba(0,0,0,.15));
}


#property #content h1 {
    color: var(--bs-gray-dark);
}
#property #content h2 {
    color: var(--bs-gray-700);
}
#property #content p.location {
    color: var(--bs-gray-500);
    font-size: calc(0.8rem + 0.5vw);
}
#property #content h3 {
    font-size: calc(1rem + 0.5vw);
    color: var(--bs-gray-700);
}

#property #content #sqaoneprop {
    font-family: 'Roboto', serif;
    background-color: var(--bs-light);
}

#property #content #sqaoneprop h2 {
    font-size: 1.6rem;
    color: #ffffff;
    letter-spacing: 3px;
    text-align: center;
    background-color: var(--bs-success);
    text-transform: uppercase;
    padding: 1rem;
}
#property #content #sqaoneprop .form-label {
    font-size: 1.2rem;
    font-weight: bolder;
    color: var(--bs-gray-700);
}
#property #content #sqaoneprop label.form-label.travelers {
    font-weight: normal;
    font-size: 1rem;
}
#property #content #sqaoneprop label.form-label button.btn.btn-link i.bi.bi-trash3-fill {
    color: var(--bs-warning);
}
#property #content #sqaoneprop button.btn.btn-link i.bi.bi-house-add-fill {
    font-size: 2rem;
    color: var(--bs-success);
}
footer #legal-content ul {
    list-style: none;
}
footer #legal-content ul li {
    padding-bottom: 0.8rem;
}
footer #legal-content ul li a {
    text-decoration: none;
    color: var(--bs-gray-400);
}

#blog {
    font-family: 'Roboto', serif;
    text-align: justify;
}

#blog h1.display-6 {
    text-align: end;
    font-weight: 800;
    color: var(--bs-gray-dark);
    font-size: calc(3.5rem + 0.75vw);
    letter-spacing: 0.25rem;
}

#blog h2 {
    font-size: calc(1.5rem + 0.75vw);
    color: var(--bs-gray-dark);
    font-weight: 800;
}

#blog a {
    color: var(--bs-gray-dark);
}

#blog h3 {
    font-size: calc(1.2rem + 0.75vw);
    color: var(--bs-gray-dark);
}

/* Homepage hero height adjustment */
section.bsb-hero-1 {
    padding-top: 15rem;
    padding-bottom: 15rem;
}

section.bsb-hero-1 h2 {
    font-family: Georgia, serif;
    /* existants */
    letter-spacing: 0.15rem;           /* -40% pour une masse visuelle plus compacte */
    font-size: calc(2rem + 1vw);        /* +légère hausse, responsive */

    /* nouveaux effets lisibilité */
    display: inline-block;              /* permet un fond local autour du texte */
    padding: .6rem 1rem;                /* espace respirant */
    background: rgba(0,0,0,.28);        /* voile discret juste sous le texte */
    backdrop-filter: blur(2px);         /* adoucit l’arrière-plan sous le texte (si supporté) */
    border-radius: 12px;
    text-shadow: 0 8px 24px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.35);
    -webkit-text-stroke: 1px rgba(0,0,0,.18); /* filet très léger pour le micro-contraste */
}

section.bsb-hero-1 { position: relative; }
section.bsb-hero-1::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background: linear-gradient(
            to bottom,
            rgba(0,0,0,.55) 0%,
            rgba(0,0,0,.30) 10%,
            rgba(0,0,0,0) 35%
    );
}

/* Keep hero title on one line on larger screens; allow wrap on small */
@media (min-width: 577px) {
  section.bsb-hero-1 h2 {
    white-space: nowrap;
  }
}
@media (max-width: 576px) {
  section.bsb-hero-1 h2 {
    white-space: normal; /* default, explicit for clarity */
  }
}


/* Premium photo treatment: subtle, chic enhancements */
#property img.premium-photo {
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(0,0,0,.18), 0 4px 8px rgba(0,0,0,.12);
    filter: contrast(1.06) saturate(1.08) brightness(1.02);
    transition: transform .35s ease, box-shadow .35s ease, filter .35s ease;
    backface-visibility: hidden;
}

#property img.premium-photo:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(0,0,0,.22), 0 8px 16px rgba(0,0,0,.14);
    filter: contrast(1.08) saturate(1.10) brightness(1.02);
}

/* Ensure floated description images keep elegant margins on all sizes */
#property .description img.premium-photo.float-md-start { margin-right: 1rem; margin-bottom: .75rem; }
#property .description img.premium-photo.float-md-end { margin-left: 1rem; margin-bottom: .75rem; }

/* Fine-tune lightbox tiles so effects don’t break layout */
#property #lightbox .fill img.premium-photo,
#property #lightbox .fill-1 img.premium-photo {
    object-fit: cover;
}