/* ============================================================
   HomeCorsica — Direction 12 "Méditerranée"
   Navy + cream + gold. Hero sombre, contenu clair.
============================================================ */

/* ---------- RESET ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
    font-family:'Manrope',sans-serif;
    font-weight:400;
    font-size:16px;
    line-height:1.55;
    color:var(--text);
    background:var(--bg);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
    transition:background 0.5s var(--ease);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}

/* ---------- TOKENS ---------- */
:root{
    /* Base light palette for content */
    --bg:#f5f7fa;                 /* bluish off-white */
    --bg-elev-1:#ffffff;          /* pure white cards */
    --bg-elev-2:#eef2f7;          /* slightly deeper bluish */
    --border:#d8dde5;
    --border-soft:#e8ecf0;
    --text:#1e3a5f;               /* deep navy for headings */
    --text-body:#2c4560;          /* body copy */
    --text-muted:#5a6673;
    --text-faded:#8a95a5;

    /* Dark navy for nav / hero / footer */
    --navy:#1e3a5f;
    --navy-deep:#15293f;
    --navy-light:#2c4d78;

    /* Gold accents */
    --gold:#d4a957;
    --gold-soft:#b8914a;
    --gold-dim:#9a7a3b;

    /* Per-location sub-accents (used only on location detail pages) */
    --accent:#b8914a;             /* default = gold */
    --accent-soft:#9a7a3b;

    --serif:'DM Serif Display',serif;
    --sans:'Manrope',sans-serif;

    --max-w:1440px;
    --gutter:clamp(1.5rem, 4vw, 4rem);

    --ease:cubic-bezier(0.16, 1, 0.3, 1);
    --radius:6px;
    --radius-lg:10px;
    --shadow-sm:0 2px 10px rgba(30, 58, 95, 0.06);
    --shadow-md:0 10px 30px rgba(30, 58, 95, 0.1);
    --shadow-lg:0 20px 50px rgba(30, 58, 95, 0.15);
}

/* Dolce Mare sub-theme: turquoise blue (different from navy base) */
body.theme-dolcemare{
    --accent:#3d9dbf;
    --accent-soft:#2a7a98;
}
/* Pinarello sub-theme: saffron yellow */
body.theme-pinarello{
    --accent:#c89329;
    --accent-soft:#9a7020;
}
/* Bastia sub-theme: warm brass (slightly different from base gold) */
body.theme-bastia{
    --accent:#a87a3a;
    --accent-soft:#7d5a28;
}
/* Vardiola sub-theme: warm terracotta */
body.theme-vardiola{
    --accent:#b85a3e;
    --accent-soft:#8e3f2a;
}

/* ---------- TYPOGRAPHY ---------- */
.display{
    font-family:var(--serif);
    font-weight:400;
    letter-spacing:-0.015em;
    line-height:1;
    color:var(--text);
}
.eyebrow{
    font-family:var(--sans);
    font-weight:600;
    font-size:0.75rem;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--gold-soft);
}
.numeral{
    font-family:var(--serif);
    font-style:italic;
    color:var(--gold);
}

/* ---------- LAYOUT ---------- */
.container{
    width:100%;
    max-width:var(--max-w);
    margin:0 auto;
    padding:0 var(--gutter);
}

/* ---------- NAV (DARK NAVY) ---------- */
.nav{
    position:fixed;
    top:0;left:0;right:0;
    z-index:100;
    padding:1rem var(--gutter);
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:var(--navy);
    color:#fff;
    box-shadow:0 1px 0 rgba(0,0,0,0.1);
}
.nav__brand{
    font-family:var(--serif);
    font-weight:400;
    font-size:1.55rem;
    letter-spacing:-0.01em;
    color:#fff;
}
.nav__brand em{
    font-style:italic;
    color:var(--gold);
}
.nav__links{
    display:flex;
    gap:2.5rem;
    align-items:center;
}
.nav__links a{
    font-family:var(--sans);
    font-size:0.78rem;
    font-weight:600;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.82);
    transition:color 0.3s var(--ease);
    position:relative;
    padding-bottom:4px;
}
.nav__links a::after{
    content:'';
    position:absolute;
    left:0;bottom:0;
    height:2px;
    width:0;
    background:var(--gold);
    transition:width 0.4s var(--ease);
}
.nav__links a:hover{color:#fff}
.nav__links a:hover::after,
.nav__links a.active::after{width:100%}
.nav__links a.active{color:#fff}

.lang-switch{
    display:flex;
    gap:0.25rem;
    font-family:var(--sans);
    font-size:0.75rem;
    font-weight:600;
    letter-spacing:0.15em;
    text-transform:uppercase;
    color:rgba(255,255,255,0.55);
}
.lang-switch button{
    padding:0.25rem 0.5rem;
    transition:color 0.3s var(--ease);
}
.lang-switch button.active{color:var(--gold)}
.lang-switch button:hover{color:#fff}
.lang-switch .sep{color:rgba(255,255,255,0.3)}

@media (max-width: 900px){
    .nav__links{display:none}
}

/* ---------- PAGE SYSTEM ---------- */
.page{display:none;opacity:0}
.page.active{display:block;animation:fadeIn 0.7s var(--ease) forwards}
@keyframes fadeIn{to{opacity:1}}

/* ---------- HERO (HOME) ---------- */
.hero{
    position:relative;
    min-height:460px;
    overflow:hidden;
    display:grid;
    grid-template-columns:1fr 1fr;
    background:var(--navy);
    color:#fff;
    padding-top:68px; /* for fixed nav */
}
.hero__text{
    padding:3rem 3rem;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    z-index:2;
}
.hero__meta{
    display:flex;
    align-items:center;
    gap:1rem;
    margin-bottom:1.5rem;
}
.hero__meta .line{
    width:40px;height:1px;
    background:var(--gold);
}
.hero__meta .eyebrow{
    color:var(--gold);
    font-size:0.72rem;
}
.hero h1{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(2.5rem, 5vw, 4.25rem);
    line-height:1.05;
    letter-spacing:-0.02em;
    color:#fff;
    max-width:22ch;
    margin-bottom:1.5rem;
}
.hero h1 em{
    font-style:italic;
    color:var(--gold);
}
.hero__tagline{
    font-size:1rem;
    max-width:46ch;
    line-height:1.7;
    color:rgba(255,255,255,0.82);
    margin-bottom:2rem;
}
.hero__actions{
    display:flex;
    gap:1rem;
    align-items:center;
    flex-wrap:wrap;
}
.hero__img{
    background-image:url('/img/home-hero.jpg');
    background-size:cover;
    background-position:center;
}
@media (max-width: 900px){
    .hero{
        grid-template-columns:1fr;
        min-height:auto;
    }
    .hero__img{height:320px}
}

/* ---------- BUTTONS ---------- */
.btn{
    display:inline-flex;
    align-items:center;
    gap:0.75rem;
    padding:1rem 1.75rem;
    font-family:var(--sans);
    font-size:0.82rem;
    font-weight:700;
    letter-spacing:0.12em;
    text-transform:uppercase;
    background:var(--gold);
    color:var(--navy);
    border:1px solid var(--gold);
    border-radius:2px;
    transition:all 0.3s var(--ease);
    cursor:pointer;
}
.btn:hover{
    background:var(--gold-soft);
    border-color:var(--gold-soft);
    color:#fff;
    transform:translateY(-1px);
}
.btn--ghost{
    background:transparent;
    color:#fff;
    border-color:rgba(255,255,255,0.35);
}
.btn--ghost:hover{
    background:rgba(255,255,255,0.05);
    border-color:#fff;
    color:#fff;
}
.btn .arrow{transition:transform 0.3s var(--ease)}
.btn:hover .arrow{transform:translateX(4px)}

/* ---------- SECTION: INTRO ---------- */
.intro{
    padding:clamp(2rem, 5vh, 4.5rem) 0;
    background:var(--bg);
}
.intro__grid{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:clamp(2rem, 5vw, 5rem);
    align-items:start;
}
.intro__label{
    position:sticky;
    top:100px;
}
.intro__label .num{
    font-size:4.5rem;
    line-height:1;
    display:block;
    margin-bottom:0.5rem;
    color:var(--gold);
    font-style:italic;
}
.intro__copy h2{
    font-family:var(--serif);
    font-size:clamp(1.5rem, 2.6vw, 2.25rem);
    font-weight:400;
    margin-bottom:1.5rem;
    color:var(--navy);
    letter-spacing:-0.01em;
    line-height:1.15;
    white-space:nowrap;
}
.intro__copy h2 em{
    font-style:italic;
    color:var(--gold-soft);
}
.intro__copy p{
    font-size:1rem;
    line-height:1.55;
    color:var(--text-body);
    margin-bottom:0.6rem;
}

@media (max-width: 900px){
    .intro__grid{grid-template-columns:1fr;gap:2rem}
    .intro__label{position:static}
}

/* ---------- SECTION: PROPERTIES ---------- */
.props{
    padding:clamp(2rem, 5vh, 4.5rem) 0;
    background:var(--bg-elev-2);
    border-top:1px solid var(--border-soft);
    border-bottom:1px solid var(--border-soft);
}
.props__head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    margin-bottom:2.5rem;
    padding-bottom:1.25rem;
    border-bottom:1px solid var(--border);
    flex-wrap:wrap;
    gap:2rem;
}
.props__head h2{
    font-family:var(--serif);
    font-size:clamp(1.5rem, 2.6vw, 2.25rem);
    font-weight:400;
    color:var(--navy);
    letter-spacing:-0.015em;
    white-space:nowrap;
}
.props__head h2 em{font-style:italic;color:var(--gold-soft)}
.props__cta{
    font-family:var(--sans);
    font-size:0.78rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--navy);
    padding:0.75rem 0;
    border-bottom:2px solid var(--navy);
    transition:all 0.3s var(--ease);
}
.props__cta:hover{
    color:var(--gold-soft);
    border-bottom-color:var(--gold-soft);
}
.props__cta .arrow{
    display:inline-block;
    margin-left:0.75rem;
    transition:transform 0.4s var(--ease);
}
.props__cta:hover .arrow{transform:translateX(6px)}

.props__grid{
    display:grid;
    grid-template-columns:repeat(12, 1fr);
    gap:clamp(1.5rem, 3vw, 2.5rem);
}

/* ---------- CARDS ---------- */
.card{
    cursor:pointer;
    display:block;
    position:relative;
    background:var(--bg-elev-1);
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow-sm);
    border:1px solid var(--border);
    transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-lg);
    border-color:var(--gold);
}
.card__img{
    overflow:hidden;
    position:relative;
    background:var(--bg-elev-2);
}
.card__img img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform 1s var(--ease);
}
.card:hover .card__img img{transform:scale(1.04)}
.card__tag{
    position:absolute;
    top:1rem;left:1rem;
    background:var(--navy);
    color:#fff;
    padding:0.4rem 0.85rem;
    font-family:var(--sans);
    font-size:0.68rem;
    font-weight:700;
    letter-spacing:0.15em;
    text-transform:uppercase;
    border-left:3px solid var(--gold);
}

/* Card content (distributed on direct children - no wrapper) */
.card > .card__meta{
    padding:1.5rem 1.5rem 0.5rem;
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    flex-wrap:wrap;
    gap:0.5rem;
}
.card__region{
    font-family:var(--sans);
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--text-faded);
}
.card__price{
    font-family:var(--serif);
    font-style:italic;
    font-size:1.1rem;
    color:var(--gold-soft);
}
.card > h3{
    padding:0 1.5rem;
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(1.35rem, 2vw, 1.75rem);
    line-height:1.1;
    margin-bottom:0.6rem;
    color:var(--navy);
    letter-spacing:-0.01em;
}
.card > h3 em{font-style:italic;color:var(--gold-soft)}
.card > .card__type{
    padding:1.25rem 1.5rem 1.5rem;
    font-size:0.92rem;
    color:var(--text-muted);
    line-height:1.55;
}

/* Home grid — 3 equal columns, title ABOVE image */
.card--equal{
    grid-column:span 4;
    display:flex;
    flex-direction:column;
}
.card--equal > .card__meta{
    padding-top:1.75rem;
    margin-bottom:0.5rem;
}
.card--equal > .card__img{
    aspect-ratio:4/3;
    width:100%;
    flex-shrink:0;
    display:block;
}
.card--equal > .card__img img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

@media (max-width: 900px){
    .props__grid{grid-template-columns:1fr}
    .card--equal{grid-column:span 1}
    .card--equal .card__img{aspect-ratio:4/3}
}

/* 4 cartes = grille 2x2 (chaque carte sur 6 colonnes au lieu de 4) */
.props__grid--four > .card--equal{
    grid-column:span 6;
}
@media (max-width: 900px){
    .props__grid--four > .card--equal{grid-column:span 1}
}

/* ---------- SECTION: DESTINATIONS ---------- */
.destination{
    padding:clamp(2rem, 5vh, 4.5rem) 0;
    background:var(--bg);
}
.destination__grid{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:clamp(3rem, 6vw, 6rem);
    align-items:center;
}
.destination__img{
    aspect-ratio:4/5;
    overflow:hidden;
    background:var(--bg-elev-2);
    border-radius:var(--radius);
    box-shadow:var(--shadow-md);
}
.destination__img img{width:100%;height:100%;object-fit:cover}
.destination__text h2{
    font-family:var(--serif);
    font-size:clamp(1.7rem, 3.3vw, 2.6rem);
    font-weight:400;
    margin-bottom:1.5rem;
    max-width:14ch;
    color:var(--navy);
    letter-spacing:-0.01em;
    line-height:1.05;
}
.destination__text h2 em{font-style:italic;color:var(--gold-soft)}
.destination__text p{
    color:var(--text-body);
    font-size:1rem;
    line-height:1.55;
    max-width:48ch;
    margin-bottom:0.6rem;
}
.destination__list{
    list-style:none;
    margin-top:2.5rem;
}
.destination__list li{
    padding:1.25rem 0;
    border-bottom:1px solid var(--border-soft);
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    font-family:var(--sans);
    font-size:0.92rem;
}
.destination__list li .place{
    font-family:var(--serif);
    font-style:italic;
    font-size:1.2rem;
    color:var(--navy);
}
.destination__list li .count{
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--gold-soft);
}
@media (max-width: 900px){
    .destination__grid{grid-template-columns:1fr}
}

/* ---------- FOOTER ---------- */
.footer{
    padding:clamp(2rem, 5vh, 4rem) 0 1.5rem;
    background:var(--navy-deep);
    color:rgba(255,255,255,0.85);
}
.footer__grid{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1fr;
    gap:3rem;
    margin-bottom:2rem;
}
.footer__brand{
    font-family:var(--serif);
    font-size:2rem;
    font-weight:400;
    margin-bottom:1.5rem;
    color:#fff;
    letter-spacing:-0.01em;
}
.footer__brand em{font-style:italic;color:var(--gold)}
.footer__about{
    color:rgba(255,255,255,0.65);
    max-width:42ch;
    line-height:1.55;
    font-size:0.95rem;
}
.footer h4{
    font-family:var(--sans);
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.22em;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:1.5rem;
}
.footer ul{list-style:none}
.footer li{
    padding:0.45rem 0;
    color:rgba(255,255,255,0.75);
    font-size:0.92rem;
}
.footer li a{transition:color 0.3s var(--ease)}
.footer li a:hover{color:var(--gold)}
.footer__bottom{
    padding-top:2rem;
    border-top:1px solid rgba(255,255,255,0.1);
    display:flex;
    justify-content:space-between;
    align-items:center;
    color:rgba(255,255,255,0.4);
    font-size:0.82rem;
    flex-wrap:wrap;
    gap:1rem;
}
@media (max-width: 900px){
    .footer__grid{grid-template-columns:1fr 1fr;gap:2.5rem}
    .footer__grid > div:first-child{grid-column:1 / -1}
}

/* ---------- LOCATIONS PAGE ---------- */
.page-header{
    padding:clamp(5.5rem, 9vh, 7rem) 0 clamp(1.75rem, 4vh, 3rem);
    background:var(--navy);
    color:#fff;
    position:relative;
    overflow:hidden;
}
.page-header::before{
    content:'';
    position:absolute;
    right:-200px;top:-100px;
    width:500px;height:500px;
    background:radial-gradient(circle, rgba(212,169,87,0.12) 0%, transparent 70%);
}
.page-header .hero__meta,.page-header .prop-hero__meta{
    margin-bottom:1.5rem;
}
.page-header h1{
    font-family:var(--serif);
    font-size:clamp(2.25rem, 5.5vw, 4.5rem);
    font-weight:400;
    max-width:14ch;
    color:#fff;
    line-height:1;
    letter-spacing:-0.02em;
    margin:0;
    position:relative;
    z-index:2;
}
.page-header h1 em{font-style:italic;color:var(--gold)}
.page-header__desc{
    margin-top:2.5rem;
    color:rgba(255,255,255,0.82);
    max-width:55ch;
    font-size:1rem;
    line-height:1.55;
    position:relative;
    z-index:2;
}
/* ===== Page Contact : titre + phrase sur UNE seule ligne ===== */
main.page-contact .page-header h1,
.page-contact .page-header h1 {
    max-width: none !important;
    white-space: nowrap !important;
    font-size: clamp(1.5rem, 3vw, 2.5rem) !important;
    line-height: 1.1 !important;
}
main.page-contact .page-header__desc,
.page-contact .page-header__desc {
    max-width: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(0.85rem, 1vw, 1rem) !important;
}
@media (max-width: 800px){
    main.page-contact .page-header h1,
    .page-contact .page-header h1,
    main.page-contact .page-header__desc,
    .page-contact .page-header__desc {
        white-space: normal !important;
        text-overflow: clip !important;
        overflow: visible !important;
    }
}
/* ===== END page-contact ===== */

/* ===== Page Locations : titre + phrase sur UNE seule ligne ===== */
main.page-locations .page-header h1,
.page-locations .page-header h1 {
    max-width: none !important;
    white-space: nowrap !important;
    font-size: clamp(1.5rem, 3vw, 2.5rem) !important;
    line-height: 1.1 !important;
}
main.page-locations .page-header__desc,
.page-locations .page-header__desc {
    max-width: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(0.85rem, 1vw, 1rem) !important;
}
@media (max-width: 800px){
    main.page-locations .page-header h1,
    .page-locations .page-header h1,
    main.page-locations .page-header__desc,
    .page-locations .page-header__desc {
        white-space: normal !important;
        text-overflow: clip !important;
        overflow: visible !important;
    }
}
/* ===== END page-locations ===== */

.filters{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:1.25rem 0 1rem;
    border-bottom:1px solid var(--border-soft);
    flex-wrap:wrap;
    gap:1rem;
    background:var(--bg);
}
.filters__options{
    display:flex;
    gap:0.6rem;
    flex-wrap:wrap;
}
.filter{
    font-family:var(--sans);
    font-size:0.75rem;
    font-weight:700;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--text-muted);
    padding:0.6rem 1.2rem;
    border:1px solid var(--border);
    border-radius:2px;
    background:var(--bg-elev-1);
    transition:all 0.3s var(--ease);
}
.filter.active{
    color:#fff;
    background:var(--navy);
    border-color:var(--navy);
}
.filter:not(.active):hover{
    border-color:var(--navy);
    color:var(--navy);
}
.filters__count{
    font-family:var(--sans);
    font-size:0.75rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--gold-soft);
}

.locations-grid{
    padding:2rem 0 4rem;
    background:var(--bg);
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:2.5rem;
}
.locations-grid .card .card__img{aspect-ratio:4/5}
@media (max-width: 900px){
    .locations-grid{grid-template-columns:1fr;gap:2rem}
    .locations-grid .card .card__img{aspect-ratio:4/3}
}
@media (max-width: 1200px) and (min-width: 901px){
    .locations-grid{grid-template-columns:repeat(2, 1fr)}
}

/* ---------- PROPERTY DETAIL PAGE ---------- */
.prop-hero{
    padding:clamp(5.5rem, 9vh, 7rem) 0 0;
    background:var(--navy);
    color:#fff;
    position:relative;
    overflow:hidden;
}
.prop-hero::before{
    content:'';
    position:absolute;
    right:-200px;top:-100px;
    width:500px;height:500px;
    background:radial-gradient(circle, rgba(212,169,87,0.12) 0%, transparent 70%);
}
.prop-hero > .container{position:relative;z-index:2}
.prop-hero__meta{
    display:flex;
    align-items:center;
    gap:1rem;
    margin-bottom:1.5rem;
}
.prop-hero__meta .line{width:40px;height:1px;background:var(--gold)}
.prop-hero__meta .eyebrow{color:var(--gold)}
.prop-hero h1{
    font-family:var(--serif);
    font-size:clamp(2.15rem, 5vw, 4.25rem);
    font-weight:400;
    max-width:18ch;
    color:#fff;
    line-height:1;
    letter-spacing:-0.02em;
    margin-bottom:1.5rem;
}
.prop-hero h1 em{font-style:italic;color:var(--gold)}
.prop-hero__sub{
    display:flex;
    gap:1rem 2rem;
    flex-wrap:wrap;
    padding-bottom:2.25rem;
    color:rgba(255,255,255,0.82);
    font-family:var(--sans);
    font-size:0.88rem;
}
.prop-hero__sub span strong{
    color:var(--gold);
    font-weight:600;
    margin-right:0.35rem;
}

/* Back link sits over the hero */
.prop-hero .back-link{
    color:rgba(255,255,255,0.75);
}
.prop-hero .back-link:hover{color:var(--gold)}

/* Gallery */
.gallery{
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    grid-template-rows:280px 280px;
    gap:0.6rem;
    margin:-1.5rem 0 2.5rem;  /* overlap with dark hero */
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow-lg);
    position:relative;
    z-index:3;
}
.gallery__item{
    overflow:hidden;
    background:var(--bg-elev-2);
    cursor:pointer;
    transition:opacity 0.3s var(--ease);
}
.gallery__item:hover{opacity:0.88}
.gallery__item img{
    width:100%;height:100%;
    object-fit:cover;
    transition:transform 1s var(--ease);
}
.gallery__item:hover img{transform:scale(1.04)}
.gallery__item--main{grid-row:1 / 3;height:100%}
@media (max-width: 900px){
    .gallery{
        grid-template-columns:1fr 1fr;
        grid-template-rows:240px 180px 180px;
    }
    .gallery__item--main{grid-row:1;grid-column:1 / -1;height:240px}
}

/* Body */
.prop-body{
    display:grid;
    grid-template-columns:1.6fr 1fr;
    gap:clamp(3rem, 6vw, 6rem);
    padding-bottom:clamp(2rem, 5vh, 4rem);
}
@media (max-width: 1000px){.prop-body{grid-template-columns:1fr}}

.prop-section{margin-bottom:1.5rem}
.prop-section h2{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(1.5rem, 2.6vw, 2.1rem);
    margin-bottom:0.6rem;
    letter-spacing:-0.01em;
    color:var(--navy);
    line-height:1.1;
}
.prop-section h2 em{font-style:italic;color:var(--accent)}
.prop-section p{
    color:var(--text-body);
    line-height:1.55;
    font-size:0.97rem;
    margin-bottom:0.6rem;
    max-width:65ch;
}
.prop-section p em{
    font-style:italic;
    color:var(--accent);
    font-weight:500;
    font-family:var(--serif);
}

.amenities{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:0 2rem;
    margin-top:0.75rem;
}
.amenities li{
    list-style:none;
    padding:0.55rem 0;
    border-bottom:1px solid var(--border-soft);
    color:var(--text);
    font-family:var(--sans);
    font-size:0.96rem;
    display:flex;
    align-items:center;
    gap:0.85rem;
}
.amenities li::before{
    content:'';
    width:6px;height:6px;
    background:var(--accent);
    border-radius:50%;
    flex-shrink:0;
}
.amenities li strong{
    font-weight:600;
    color:var(--accent-soft);
}

.tarifs-table{
    width:100%;
    border-collapse:collapse;
    margin-top:0.75rem;
    font-family:var(--sans);
    background:var(--bg-elev-1);
    border:1px solid var(--border);
    border-radius:var(--radius);
    overflow:hidden;
}
.tarifs-table th,.tarifs-table td{
    padding:0.85rem 1.1rem;
    border-bottom:1px solid var(--border-soft);
    text-align:left;
    font-weight:400;
    font-size:0.95rem;
}
.tarifs-table th{
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--gold-soft);
    background:var(--bg-elev-2);
}
.tarifs-table td{color:var(--text)}
.tarifs-table td:last-child{
    text-align:right;
    font-family:var(--serif);
    font-style:italic;
    color:var(--gold-soft);
    font-size:1.1rem;
}
.tarifs-table tbody tr:last-child td{border-bottom:none}
.tarifs-table tbody tr:hover{background:var(--bg-elev-2)}

.map-image{
    margin-top:1.5rem;
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow-md);
    border:1px solid var(--border);
}
.map-image img{width:100%;height:auto;display:block}

.floorplan{
    margin-top:1.5rem;
    display:grid;
    grid-template-columns:1fr 1.4fr;
    gap:2.5rem;
    align-items:center;
    padding:2rem;
    background:var(--bg-elev-1);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    border:1px solid var(--border);
}
.floorplan__img{
    background:#fff;
    padding:1rem;
    border-radius:var(--radius);
    border:1px solid var(--border);
}
.floorplan__img img{width:100%;height:auto;display:block}
.floorplan__caption .label{
    font-family:var(--sans);
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--gold-soft);
    margin-bottom:0.5rem;
}
.floorplan__caption h3{
    font-family:var(--serif);
    font-weight:400;
    font-size:1.7rem;
    margin-bottom:1rem;
    color:var(--navy);
    letter-spacing:-0.01em;
}
.floorplan__caption h3 em{font-style:italic;color:var(--accent)}
.floorplan__caption p{color:var(--text-body);font-size:0.98rem;line-height:1.75}
@media (max-width: 800px){
    .floorplan{grid-template-columns:1fr;gap:1.5rem;padding:1.5rem}
}

/* Sticky booking */
.booking{
    position:sticky;
    top:100px;
    padding:1.75rem;
    background:var(--bg-elev-1);
    border-radius:var(--radius);
    box-shadow:var(--shadow-md);
    border:1px solid var(--border);
}
.booking__price{
    padding-bottom:1.5rem;
    margin-bottom:1.5rem;
    border-bottom:1px solid var(--border-soft);
}
.booking__price .from{
    font-family:var(--sans);
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--text-faded);
    margin-bottom:0.5rem;
    display:block;
}
.booking__price .amount{
    font-family:var(--serif);
    font-style:italic;
    font-size:2.5rem;
    color:var(--gold-soft);
    font-weight:400;
    line-height:1;
}
.booking__price .unit{
    font-family:var(--sans);
    font-style:normal;
    color:var(--text-muted);
    font-size:0.95rem;
    margin-left:0.5rem;
    font-weight:400;
}

.form-field{margin-bottom:1.15rem}
.form-field label{
    display:block;
    font-family:var(--sans);
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--text-faded);
    margin-bottom:0.4rem;
}
.form-field input,.form-field textarea,.form-field select{
    width:100%;
    background:#fff;
    border:1px solid var(--border);
    border-radius:3px;
    padding:0.75rem 0.9rem;
    color:var(--text);
    font-family:var(--sans);
    font-size:0.95rem;
    font-weight:400;
    transition:all 0.3s var(--ease);
}
.form-field input:focus,.form-field textarea:focus,.form-field select:focus{
    outline:none;
    border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(212,169,87,0.15);
}
.form-field textarea{resize:vertical;min-height:90px}
.form-field__row{
    display:flex;
    gap:1rem;
}
.form-field__row > .form-field{
    flex:1;
    min-width:0;
}
@media (max-width: 600px){
    .form-field__row{flex-direction:column; gap:0;}
}
.booking button.btn{
    width:100%;
    margin-top:0.75rem;
    justify-content:center;
}

/* ---------- CONTACT PAGE ---------- */
.contact-grid{
    padding:clamp(2rem, 4vh, 3.5rem) 0 4rem;
    display:grid;
    grid-template-columns:1fr 1.25fr;
    gap:clamp(3rem, 6vw, 6rem);
    background:var(--bg);
}
@media (max-width: 900px){.contact-grid{grid-template-columns:1fr}}

.contact-info h2{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(1.5rem, 2.6vw, 2.1rem);
    margin-bottom:1.5rem;
    letter-spacing:-0.01em;
    color:var(--navy);
    line-height:1.1;
}
.contact-info h2 em{font-style:italic;color:var(--gold-soft)}
.contact-info p{
    color:var(--text-body);
    line-height:1.55;
    max-width:58ch;
    margin-bottom:2rem;
    font-size:1.04rem;
}
.contact-info__block{
    padding:1.5rem 0;
    border-bottom:1px solid var(--border-soft);
}
.contact-info__block .label{
    font-family:var(--sans);
    font-size:0.72rem;
    font-weight:700;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--text-faded);
    margin-bottom:0.5rem;
}
.contact-info__block .value{
    font-family:var(--serif);
    font-size:1.35rem;
    color:var(--navy);
    font-weight:400;
}
.contact-info__block .value em{font-style:italic;color:var(--gold-soft)}

.contact-form{
    padding:2.5rem;
    background:var(--bg-elev-1);
    border-radius:var(--radius);
    box-shadow:var(--shadow-md);
    border:1px solid var(--border);
}

/* ---------- MICRO-INTERACTIONS ---------- */
.reveal{opacity:1;transform:translateY(0);transition:opacity 0.9s var(--ease), transform 0.9s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}
.js-reveal-active .reveal{opacity:0;transform:translateY(20px)}
.js-reveal-active .reveal.visible{opacity:1;transform:translateY(0)}

/* Back link */
.back-link{
    display:inline-flex;
    align-items:center;
    gap:0.75rem;
    font-family:var(--sans);
    font-size:0.75rem;
    font-weight:700;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--text-muted);
    padding:0.5rem 0;
    margin-bottom:1.5rem;
    transition:color 0.3s var(--ease);
}
.back-link::before{
    content:'';
    width:30px;height:2px;
    background:currentColor;
    transition:width 0.4s var(--ease);
}
.back-link:hover{color:var(--gold-soft)}
.back-link:hover::before{width:40px}

/* Variant cards (Dolce Mare studios) */
.variants{
    padding-top:1.25rem;
    border-top:1px solid var(--border);
    margin-top:1.25rem;
}
.variants__head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    flex-wrap:wrap;
    gap:1.5rem;
    margin-bottom:1.5rem;
}
.variants__head h2{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(1.5rem, 2.6vw, 2.1rem);
    letter-spacing:-0.01em;
    color:var(--navy);
    line-height:1.1;
}
.variants__head h2 em{font-style:italic;color:var(--accent)}
.variants__head p{
    color:var(--text-body);
    font-size:0.98rem;
    max-width:50ch;
}
.variants__grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:1.5rem;
}
@media (max-width: 1100px){.variants__grid{grid-template-columns:repeat(2, 1fr)}}
@media (max-width: 600px){.variants__grid{grid-template-columns:1fr}}

.variant-card{
    display:block;
    cursor:pointer;
    background:var(--bg-elev-1);
    border-radius:var(--radius);
    overflow:hidden;
    border:1px solid var(--border);
    box-shadow:var(--shadow-sm);
    transition:transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.variant-card:hover{
    transform:translateY(-3px);
    border-color:var(--accent);
    box-shadow:var(--shadow-md);
}
.variant-card__img{
    aspect-ratio:4/5;
    overflow:hidden;
    background:var(--bg-elev-2);
    position:relative;
}
.variant-card__img img{
    width:100%;height:100%;
    object-fit:cover;
    transition:transform 1s var(--ease);
}
.variant-card:hover .variant-card__img img{transform:scale(1.05)}
.variant-card__badge{
    position:absolute;
    top:0.9rem;left:0.9rem;
    background:var(--navy);
    color:#fff;
    padding:0.4rem 0.85rem;
    font-family:var(--sans);
    font-size:0.66rem;
    font-weight:700;
    letter-spacing:0.15em;
    text-transform:uppercase;
    border-left:2px solid var(--accent);
}
.variant-card > .variant-card__num{
    padding:1.25rem 1.35rem 0;
    display:block;
    font-family:var(--serif);
    font-style:italic;
    color:var(--accent);
    font-size:0.95rem;
    margin-bottom:0.25rem;
}
.variant-card > h3{
    padding:0 1.35rem;
    font-family:var(--serif);
    font-weight:400;
    font-size:1.35rem;
    line-height:1.15;
    margin-bottom:0.6rem;
    color:var(--navy);
    letter-spacing:-0.01em;
}
.variant-card > h3 em{font-style:italic;color:var(--accent)}
.variant-card > .variant-card__specs{
    margin:0 1.35rem 1.35rem;
    padding-top:0.75rem;
    border-top:1px solid var(--border-soft);
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    font-family:var(--sans);
    font-size:0.82rem;
    color:var(--text-muted);
}
.variant-card__specs .price{
    font-family:var(--serif);
    font-style:italic;
    font-size:1rem;
    color:var(--gold-soft);
}

::selection{background:var(--gold);color:var(--navy)}

::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--gold-soft)}


/* ---------- TYPOGRAPHY: justify body text ---------- */
.intro__copy p,
.prop-section p,
.destination__text p,
.contact-info p,
.variants__head p {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
}

/* Tighter paragraph rhythm */
.intro__copy p + p,
.prop-section p + p,
.destination__text p + p {
    margin-top: -0.15rem;
}


/* ---------- COMPACT BODY TEXT (override) ---------- */
.intro__copy p,
.prop-section p,
.destination__text p,
.contact-info p,
.variants__head p,
.page-header__desc {
    margin-bottom: 0.5rem;
    line-height: 1.55;
}
.intro__copy p:last-child,
.prop-section p:last-child,
.destination__text p:last-child,
.contact-info p:last-child {
    margin-bottom: 0;
}
.intro__copy p + p,
.prop-section p + p,
.destination__text p + p {
    margin-top: 0;
}
.prop-section h2 {
    margin-top: 0;
}


/* Allow titles to wrap on small screens */
@media (max-width: 700px){
    .intro__copy h2,
    .props__head h2 {
        white-space: normal;
    }
}