/* =========================================================
   MARÉ — ELEGANCE LAYER
   Editorial refinement, layered above style.css
   ========================================================= */

/* ---------- Refined design tokens ---------- */
:root {
    /* Refined palette */
    --el-ink:        #14110f;   /* deep almost-black */
    --el-ink-soft:   #2a221d;
    --el-ink-mute:   #5a4f47;
    --el-porcelain:  #faf6ef;   /* warm off-white */
    --el-cream:      #f1eade;   /* warm cream */
    --el-stone:      #e3dbcc;   /* muted stone */
    --el-burgundy:   #280603;   /* brand burgundy */
    --el-burgundy-2: #3a0a06;
    --el-gold:       #b8924a;   /* muted gold */
    --el-gold-soft:  #c9a961;

    /* Type scale */
    --el-display:  'Vicomte', 'Cormorant Garamond', 'Times New Roman', serif;
    --el-serif:    'Jannon', 'Cormorant Garamond', Georgia, serif;
    --el-sans:     'Futura Light', 'Helvetica Neue', Inter, system-ui, sans-serif;
    --el-mono:     'Affigere', 'Cormorant Garamond', serif;

    /* Spacing scale */
    --el-1: .25rem; --el-2: .5rem; --el-3: .75rem; --el-4: 1rem;
    --el-6: 1.5rem; --el-8: 2rem; --el-12: 3rem;
    --el-16: 4rem; --el-20: 5rem; --el-24: 6rem; --el-32: 8rem;

    /* Animation */
    --el-ease: cubic-bezier(.22,.61,.36,1);
    --el-ease-out: cubic-bezier(.16,1,.3,1);
}

/* ---------- Body / global refinement ---------- */
body.elegance {
    background: var(--el-porcelain);
    color: var(--el-ink);
    font-family: var(--el-sans);
    font-weight: 300;
    letter-spacing: .01em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.elegance ::selection { background: var(--el-burgundy); color: var(--el-porcelain); }

/* ---------- Typography ---------- */
body.elegance h1, body.elegance h2, body.elegance h3, body.elegance h4 {
    font-family: var(--el-display);
    font-weight: 400;
    letter-spacing: .005em;
    color: var(--el-ink);
}
body.elegance .el-hero h1,
body.elegance .el-hero h2,
body.elegance .el-section--dark h1,
body.elegance .el-section--dark h2,
body.elegance .el-section--dark h3,
body.elegance .el-section--dark h4,
body.elegance .el-fullbleed h1,
body.elegance .el-fullbleed h2,
body.elegance footer h1,
body.elegance footer h2,
body.elegance footer h3,
body.elegance footer h4 {
    color: var(--el-porcelain);
}

body.elegance .el-eyebrow {
    display: inline-block;
    font-family: var(--el-sans);
    font-size: .72rem;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: var(--el-gold);
    margin-bottom: var(--el-4);
}

body.elegance .el-eyebrow.dark { color: var(--el-burgundy); }
body.elegance .el-eyebrow.light { color: rgba(250,246,239,.7); }

body.elegance .el-display {
    font-family: var(--el-display);
    font-weight: 400;
    font-size: clamp(2.4rem, 6vw, 5.5rem);
    line-height: 1.02;
    letter-spacing: -.005em;
}

body.elegance .el-italic {
    font-family: var(--el-serif);
    font-style: italic;
    font-weight: 400;
}

/* ============================================================
   NAVBAR — Clean minimalist (M logo left, links right, single row)
   ============================================================ */
body.elegance .navbar {
    background: #2f0805;
    backdrop-filter: blur(0);
    transition: background .5s var(--el-ease), backdrop-filter .5s var(--el-ease), padding .4s var(--el-ease), border-color .4s var(--el-ease);
    padding: 1rem 0;
    border-bottom: 1px solid transparent;
}
body.elegance .navbar .nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 2.5rem;
}
body.elegance .nav-logo {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}
body.elegance .nav-logo img {
    height: 44px;
    width: auto;
    filter: brightness(0) invert(1);
    transition: filter .4s var(--el-ease), height .3s var(--el-ease);
}
body.elegance .nav-right {
    display: flex;
    align-items: center;
    gap: 2.4rem;
}
body.elegance .nav-menu {
    display: flex;
    align-items: center;
    gap: 2.2rem;
}
body.elegance .navbar .nav-link {
    font-family: var(--el-sans);
    font-size: .72rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--el-porcelain);
    font-weight: 400;
    position: relative;
    padding: .4rem 0;
    transition: color .3s var(--el-ease), opacity .3s var(--el-ease);
    opacity: .85;
}
body.elegance .navbar .nav-link:hover { opacity: 1; }
body.elegance .navbar .nav-link::after {
    content: '';
    position: absolute;
    left: 0; bottom: -2px;
    width: 0; height: 1px;
    background: var(--el-gold-soft);
    transition: width .4s var(--el-ease);
}
body.elegance .navbar .nav-link:hover::after,
body.elegance .navbar .nav-link.active::after { width: 100%; }
body.elegance .navbar .nav-link.active { opacity: 1; }

/* Language selector — refined pill */
body.elegance .language-selector { position: relative; }
body.elegance .language-btn {
    background: transparent;
    border: none;
    color: var(--el-porcelain);
    font-family: var(--el-sans);
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: .25em;
    text-transform: uppercase;
    padding: .4rem .25rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    opacity: .85;
    transition: opacity .3s var(--el-ease);
}
body.elegance .language-btn:hover { opacity: 1; }
body.elegance .language-icon { display: inline-flex; align-items: center; }
body.elegance .language-icon svg { display: block; }
body.elegance .language-arrow { font-size: .55rem; transform: translateY(1px); }

/* CTA — gold-bordered pill */
body.elegance .nav-cta {
    font-family: var(--el-sans);
    font-size: .7rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--el-porcelain);
    background: transparent;
    border: 1px solid var(--el-gold-soft);
    border-radius: 999px;
    padding: .65rem 1.5rem;
    text-decoration: none;
    transition: background .35s var(--el-ease), color .35s var(--el-ease), border-color .35s var(--el-ease);
}
body.elegance .nav-cta::after { display: none !important; }
body.elegance .nav-cta:hover {
    background: var(--el-gold-soft);
    color: var(--el-burgundy);
    border-color: var(--el-gold-soft);
}

/* Hamburger (mobile only) */
body.elegance .nav-toggle {
    display: none;
    background: transparent;
    border: none;
    padding: .5rem;
    cursor: pointer;
    flex-direction: column;
    gap: 4px;
    width: 28px;
}
body.elegance .nav-toggle span {
    display: block;
    height: 1.5px;
    width: 22px;
    background: var(--el-porcelain);
    transition: transform .3s var(--el-ease), opacity .3s var(--el-ease), background .3s var(--el-ease);
}

/* ---- Scrolled / solid state (light bg) ---- */
body.elegance .navbar.scrolled,
body.elegance .navbar.solid {
    background: #280603 !important;
    border-bottom: 1px solid rgba(184, 146, 74, .14);
    padding: .65rem 0;
}
body.elegance .navbar.scrolled .nav-logo img,
body.elegance .navbar.solid .nav-logo img { height: 36px; }

/* ---- Interior pages (no hero) — always burgundy solid ---- */
body.elegance.interior .navbar {
    background: #280603 !important;
    border-bottom: 1px solid rgba(184, 146, 74, .14);
    padding: .8rem 0;
}

/* ---- Tablet & mobile ---- */
@media (max-width: 960px) {
    body.elegance .navbar .nav-container {
        padding: 0 1.25rem;
        gap: 1rem;
    }
    body.elegance .nav-logo img { height: 36px; }
    body.elegance .nav-toggle { display: flex; }
    body.elegance .nav-menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #280603;
        border-top: 1px solid rgba(184, 146, 74, .14);
        flex-direction: column;
        align-items: stretch;
        padding: 1rem 1.5rem 1.5rem;
        gap: 0;
        transform: translateY(-12px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: transform .35s var(--el-ease), opacity .35s var(--el-ease), visibility .35s;
    }
    body.elegance .nav-menu.active {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
    body.elegance .nav-menu .nav-link {
        padding: 1rem .25rem !important;
        border-bottom: 1px solid rgba(250, 246, 239, .07);
        font-size: .85rem;
    }
    body.elegance .nav-menu .nav-link:last-child { border-bottom: none; }
    body.elegance .nav-cta { display: none; }
}

@media (max-width: 480px) {
    body.elegance .nav-logo img { height: 30px; }
    body.elegance .nav-right { gap: .75rem; }
}

/* ---------- Cinematic Hero ---------- */
.el-hero {
    position: relative;
    min-height: 100vh;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--el-burgundy);
    color: var(--el-porcelain);
    isolation: isolate;
}

.el-hero__media {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    z-index: 0;
}
.el-hero__media video,
.el-hero__media img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1);
}
.el-hero__media::after {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(120% 80% at 50% 35%, rgba(0,0,0,.15) 0%, rgba(0,0,0,.70) 100%),
        linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.30) 40%, rgba(0,0,0,.70) 100%);
    z-index: 1;
}

.el-hero__content {
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 0 1.5rem;
    max-width: 900px;
    animation: el-fade-up 1.4s var(--el-ease-out) .2s both;
}
.el-hero__wordmark {
    width: clamp(260px, 38vw, 460px);
    margin: 0 auto var(--el-8);
    filter: brightness(0) invert(1);
    opacity: .96;
}
.el-hero__content > p,
.el-hero__content > h1,
.el-hero__content .el-hero__sub,
.el-hero__content .el-hero__title {
    color: var(--el-porcelain);
}
.el-hero__content .el-btn--primary {
    color: var(--el-ink);
}
.el-hero__content .el-btn:not(.el-btn--primary) {
    color: var(--el-porcelain);
}
.el-hero__title {
    font-family: var(--el-display);
    font-size: clamp(2.2rem, 5.4vw, 4.4rem);
    line-height: 1.05;
    font-weight: 400;
    letter-spacing: -.005em;
    margin-bottom: var(--el-6);
    color: var(--el-porcelain);
    text-shadow: 0 2px 24px rgba(0,0,0,.45);
}
.el-hero__title em {
    font-family: var(--el-serif);
    font-style: italic;
    font-weight: 400;
    color: var(--el-gold-soft);
}
.el-hero__sub {
    font-family: var(--el-sans);
    font-size: .82rem;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: rgba(250,246,239,.8);
    margin-bottom: var(--el-12);
}
.el-hero__divider {
    width: 1px; height: 48px;
    background: linear-gradient(180deg, transparent, var(--el-gold-soft), transparent);
    margin: 0 auto var(--el-8);
}
.el-hero__cta {
    display: inline-flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

.el-hero__scroll {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    font-family: var(--el-sans);
    font-size: .65rem;
    letter-spacing: .4em;
    text-transform: uppercase;
    color: rgba(250,246,239,.6);
    writing-mode: vertical-rl;
    display: flex;
    align-items: center;
    gap: .8rem;
}
.el-hero__scroll::after {
    content: '';
    width: 1px; height: 36px;
    background: rgba(250,246,239,.4);
    animation: el-scroll-bar 2.4s var(--el-ease-out) infinite;
}

@keyframes el-scroll-bar {
    0% { transform: scaleY(0); transform-origin: top; }
    50% { transform: scaleY(1); transform-origin: top; }
    51% { transform-origin: bottom; }
    100% { transform: scaleY(0); transform-origin: bottom; }
}

/* ---------- Refined buttons ---------- */
body.elegance .btn,
.el-btn {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    font-family: var(--el-sans);
    font-size: .78rem;
    letter-spacing: .32em;
    text-transform: uppercase;
    font-weight: 400;
    padding: 1rem 2rem;
    border-radius: 0;
    border: 1px solid currentColor;
    background: transparent;
    color: var(--el-porcelain);
    text-decoration: none;
    transition: all .5s var(--el-ease);
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
body.elegance .btn::before,
.el-btn::before {
    content: '';
    position: absolute; inset: 0;
    background: var(--el-porcelain);
    transform: translateY(101%);
    transition: transform .5s var(--el-ease);
    z-index: -1;
}
body.elegance .btn:hover,
.el-btn:hover { color: var(--el-ink); }
body.elegance .btn:hover::before,
.el-btn:hover::before { transform: translateY(0); }

body.elegance .btn-primary,
.el-btn--primary {
    background: var(--el-burgundy);
    color: var(--el-porcelain);
    border-color: var(--el-burgundy);
}
body.elegance .btn-primary::before,
.el-btn--primary::before { background: var(--el-porcelain); }
body.elegance .btn-primary:hover,
.el-btn--primary:hover { color: var(--el-burgundy); border-color: var(--el-porcelain); }

body.elegance .btn-secondary { border-color: var(--el-porcelain); color: var(--el-porcelain); }

.el-btn--dark { color: var(--el-ink); }
.el-btn--dark::before { background: var(--el-ink); }
.el-btn--dark:hover { color: var(--el-porcelain); }

/* ---------- Editorial sections ---------- */
.el-section {
    padding: clamp(5rem, 12vw, 10rem) 1.5rem;
    position: relative;
}
.el-section--dark {
    background: var(--el-burgundy);
    color: var(--el-porcelain);
}
.el-section--ink {
    background: var(--el-burgundy);
    color: var(--el-porcelain);
}
.el-section--cream { background: var(--el-cream); }
.el-section--stone { background: var(--el-stone); }

.el-container {
    max-width: 1240px;
    margin: 0 auto;
}
.el-container--narrow { max-width: 880px; }
.el-container--text { max-width: 680px; }

/* Section title */
.el-title {
    font-family: var(--el-display);
    font-size: clamp(2.2rem, 4.4vw, 3.8rem);
    line-height: 1.05;
    font-weight: 400;
    margin-bottom: var(--el-8);
}
.el-title em {
    font-family: var(--el-serif);
    font-style: italic;
}
.el-lead {
    font-family: var(--el-sans);
    font-size: 1.05rem;
    line-height: 1.85;
    font-weight: 300;
    color: var(--el-ink-soft);
    max-width: 56ch;
}
.el-section--dark .el-lead { color: rgba(250,246,239,.78); }

/* ---------- Story (split image+text) ---------- */
.el-story {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(2rem, 6vw, 6rem);
    align-items: center;
}
.el-story__image {
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
}
.el-story__image img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 1.4s var(--el-ease-out);
}
.el-story__image:hover img { transform: scale(1.04); }
.el-story__image--frame::before {
    content: '';
    position: absolute;
    inset: 12px;
    border: 1px solid rgba(250,246,239,.4);
    pointer-events: none;
    z-index: 2;
}
.el-story--reverse .el-story__image { order: 2; }

/* Chef portrait — refined editorial layout */
body.elegance #story.el-quote-overlap {
    padding-top: clamp(4rem, 8vw, 6.5rem) !important;
    padding-bottom: clamp(2.5rem, 4vw, 3.5rem) !important;
}
body.elegance #story .el-story {
    grid-template-columns: 0.82fr 1fr;
    gap: clamp(2.5rem, 6vw, 6rem);
    align-items: center;
}
body.elegance #story .el-story__image--chef {
    aspect-ratio: 4 / 5;
    max-height: 580px;
    border-radius: 4px;
    overflow: visible;
    box-shadow: none;
    opacity: 1 !important;
    clip-path: none !important;
    transform: none !important;
}
body.elegance #story .el-story__image--chef img {
    object-position: center top;
    border-radius: 4px;
    box-shadow: 0 30px 70px rgba(8, 2, 1, .28);
    position: relative;
    z-index: 1;
}
/* thin gold frame offset behind the photo */
body.elegance #story .el-story__image--chef::before {
    content: '';
    position: absolute;
    inset: -16px -16px 16px 16px;
    border: 1px solid rgba(184, 146, 74, .55);
    border-radius: 4px;
    z-index: 0;
    pointer-events: none;
}
/* text column polish */
body.elegance #story .el-reveal { opacity: 1 !important; transform: none !important; clip-path: none !important; }
body.elegance #story .el-eyebrow.dark {
    letter-spacing: .26em;
    color: var(--el-gold-soft);
}
body.elegance #story .el-title {
    margin-bottom: .4rem;
    color: var(--el-porcelain);
}
body.elegance #story .el-lead {
    max-width: 46ch;
    color: rgba(250, 246, 239, .82);
}
/* bouton clair sur fond bordeaux foncé */
body.elegance #story .el-btn--dark {
    color: var(--el-porcelain);
    border-color: rgba(201, 169, 97, .6);
}
body.elegance #story .el-btn--dark span { color: var(--el-porcelain); }
body.elegance #story .el-btn--dark:hover {
    background: var(--el-gold-soft);
    border-color: var(--el-gold-soft);
    color: var(--el-burgundy);
}
body.elegance #story .el-btn--dark:hover span { color: var(--el-burgundy); }
@media (max-width: 860px) {
    body.elegance #story .el-story { grid-template-columns: 1fr; }
    body.elegance #story .el-story__image--chef {
        aspect-ratio: 4 / 5;
        max-height: none;
        max-width: 320px;
        margin: 0 auto;
    }
    body.elegance #story .el-story__image--chef img {
        object-position: center 30%;
    }
    body.elegance #story .el-story__image--chef::before {
        inset: -10px -10px 10px 10px;
    }
}

@media (max-width: 860px) {
    .el-story { grid-template-columns: 1fr; }
    .el-story--reverse .el-story__image { order: 0; }
}

/* ---------- Full-bleed image with caption ---------- */
.el-fullbleed {
    position: relative;
    width: 100%;
    height: clamp(420px, 80vh, 780px);
    overflow: hidden;
    color: var(--el-porcelain);
}
.el-fullbleed img,
.el-fullbleed video {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}
.el-fullbleed::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.55));
}
.el-fullbleed__caption {
    position: absolute;
    inset: auto 0 0 0;
    z-index: 2;
    padding: clamp(2rem, 6vw, 5rem);
    max-width: 720px;
}
.el-fullbleed__caption h2 {
    font-family: var(--el-display);
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.05;
    font-weight: 400;
    color: var(--el-porcelain);
    margin: 0;
}

/* ---------- Quote / Manifesto ---------- */
.el-quote {
    text-align: center;
    padding: clamp(5rem, 12vw, 9rem) 1.5rem;
}
.el-quote__mark {
    font-family: var(--el-display);
    font-size: 5rem;
    line-height: 1;
    color: var(--el-gold);
    margin-bottom: var(--el-4);
}
.el-quote__text {
    font-family: var(--el-serif);
    font-style: italic;
    font-size: clamp(1.4rem, 2.6vw, 2.2rem);
    line-height: 1.4;
    font-weight: 400;
    max-width: 38ch;
    margin: 0 auto var(--el-8);
    color: var(--el-ink);
}
.el-quote__attr {
    font-family: var(--el-sans);
    font-size: .72rem;
    letter-spacing: .4em;
    text-transform: uppercase;
    color: var(--el-gold);
}

/* ---------- Editorial cards grid ---------- */
.el-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(1rem, 2.4vw, 2rem);
}
@media (max-width: 980px) { .el-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .el-grid { grid-template-columns: 1fr; } }

.el-card {
    position: relative;
    display: block;
    text-decoration: none;
    color: inherit;
    background: var(--el-porcelain);
    overflow: hidden;
    transition: transform .6s var(--el-ease);
}
.el-card__media {
    aspect-ratio: 4/5;
    overflow: hidden;
    position: relative;
}
.el-card__media img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 1.4s var(--el-ease-out), filter .6s var(--el-ease);
    filter: grayscale(20%);
}
.el-card:hover .el-card__media img {
    transform: scale(1.06);
    filter: grayscale(0%);
}
.el-card__body { padding: var(--el-6) 0; }
.el-card__label {
    font-family: var(--el-sans);
    font-size: .68rem;
    letter-spacing: .4em;
    text-transform: uppercase;
    color: var(--el-gold);
    margin-bottom: var(--el-2);
}
.el-card__title {
    font-family: var(--el-display);
    font-size: 1.6rem;
    line-height: 1.15;
    font-weight: 400;
    margin-bottom: var(--el-2);
}
.el-card__desc {
    font-family: var(--el-sans);
    font-size: .92rem;
    line-height: 1.7;
    color: var(--el-ink-mute);
    margin-bottom: var(--el-4);
}
.el-card__more {
    font-family: var(--el-sans);
    font-size: .72rem;
    letter-spacing: .35em;
    text-transform: uppercase;
    color: var(--el-ink);
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    transition: gap .4s var(--el-ease), color .3s var(--el-ease);
}
.el-card__more::after {
    content: '→';
    transition: transform .4s var(--el-ease);
}
.el-card:hover .el-card__more { color: var(--el-burgundy); gap: 1rem; }

/* ---------- Explore section (refined) ---------- */
body.elegance #explore.el-section {
    padding-top: clamp(2.5rem, 4vw, 3.5rem) !important;
}
body.elegance .el-explore__head {
    text-align: center;
    max-width: 640px;
    margin: 0 auto clamp(2.5rem, 5vw, 4rem);
}
body.elegance .el-explore__intro {
    margin-top: 1.4rem;
    font-family: var(--el-serif);
    font-size: clamp(1rem, 1.4vw, 1.12rem);
    line-height: 1.7;
    color: rgba(250, 246, 239, .72);
}
body.elegance .el-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) { body.elegance .el-grid--3 { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; } }

body.elegance .el-card--feature {
    border: 1px solid rgba(201, 169, 97, .16);
    border-radius: 6px;
    background: rgba(250, 246, 239, .03);
    transition: transform .6s var(--el-ease), border-color .6s var(--el-ease), box-shadow .6s var(--el-ease);
}
body.elegance .el-card--feature:hover {
    transform: translateY(-6px);
    border-color: rgba(201, 169, 97, .5);
    box-shadow: 0 30px 70px rgba(8, 2, 1, .35);
}
body.elegance .el-card--feature .el-card__media {
    aspect-ratio: 4 / 5;
    border-radius: 6px 6px 0 0;
}
body.elegance .el-card--feature .el-card__index {
    position: absolute;
    top: 1rem;
    left: 1.1rem;
    z-index: 2;
    font-family: var(--el-display);
    font-size: 1.1rem;
    letter-spacing: .1em;
    color: var(--el-porcelain);
    opacity: .85;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .5);
}
body.elegance .el-card--feature .el-card__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(20, 5, 3, .55) 0%, rgba(20, 5, 3, 0) 45%);
    z-index: 1;
    pointer-events: none;
}
body.elegance .el-card--feature .el-card__body {
    padding: clamp(1.4rem, 2vw, 1.9rem);
}
body.elegance .el-card--feature .el-card__title {
    font-size: clamp(1.35rem, 1.8vw, 1.65rem);
}

/* ---------- Address block ---------- */
.el-address {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    padding-top: var(--el-12);
    border-top: 1px solid rgba(20,17,15,.08);
}
@media (max-width: 760px) { .el-address { grid-template-columns: 1fr; gap: 2.5rem; } }
.el-address__item h4 {
    font-family: var(--el-sans);
    font-size: .72rem;
    letter-spacing: .4em;
    text-transform: uppercase;
    color: var(--el-gold);
    margin-bottom: var(--el-3);
    font-weight: 400;
}
.el-address__item p,
.el-address__item a {
    font-family: var(--el-serif);
    font-style: italic;
    font-size: 1.15rem;
    line-height: 1.55;
    color: var(--el-ink);
    text-decoration: none;
    display: block;
}
.el-address__item a:hover { color: var(--el-burgundy); }

/* ---------- Footer refinement ---------- */
body.elegance footer,
body.elegance .footer {
    background: var(--el-burgundy) !important;
    color: rgba(250,246,239,.78);
    padding: 5rem 1.5rem 2rem;
    border-top: 1px solid rgba(250,246,239,.08);
}
body.elegance footer a,
body.elegance .footer a { color: rgba(250,246,239,.85); }

/* ---------- Loader refinement ---------- */
body.elegance .loader {
    position: fixed; inset: 0;
    background: var(--el-burgundy) !important;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: var(--el-6);
    z-index: 9999;
    opacity: 1; visibility: visible;
    transition: opacity .8s var(--el-ease-out), visibility .8s var(--el-ease-out);
}
body.elegance.loaded .loader {
    opacity: 0; visibility: hidden; pointer-events: none;
}
body.elegance .loader-logo {
    width: 150px; height: auto;
    filter: brightness(0) invert(1);
    opacity: .92;
    animation: el-fade-up 1.2s var(--el-ease-out) both;
}
body.elegance .loader-text {
    color: var(--el-gold);
    font-family: var(--el-serif);
    font-style: italic;
    font-size: 1.1rem;
    letter-spacing: .35em;
    text-transform: uppercase;
    animation: el-fade-up 1.2s var(--el-ease-out) .25s both;
}

/* ---------- Animations ---------- */
@keyframes el-fade-up {
    0% { opacity: 0; transform: translateY(24px); }
    100% { opacity: 1; transform: translateY(0); }
}

.el-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 1.1s var(--el-ease-out), transform 1.1s var(--el-ease-out);
}
.el-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.el-reveal[data-delay="1"] { transition-delay: .1s; }
.el-reveal[data-delay="2"] { transition-delay: .2s; }
.el-reveal[data-delay="3"] { transition-delay: .3s; }
.el-reveal[data-delay="4"] { transition-delay: .4s; }

/* ---------- Utilities ---------- */
.el-mt-0  { margin-top: 0 !important; }
.el-mb-0  { margin-bottom: 0 !important; }
.el-center { text-align: center; }
.el-divider {
    width: 60px; height: 1px;
    background: var(--el-gold);
    margin: var(--el-6) 0;
}
.el-divider--center { margin-left: auto; margin-right: auto; }

/* ---------- Mobile nav (for elegance mode) ---------- */
@media (max-width: 980px) {
    body.elegance .nav-menu {
        background: rgba(20,17,15,.96) !important;
        backdrop-filter: blur(16px);
    }
    body.elegance .nav-menu .nav-link {
        color: var(--el-porcelain) !important;
    }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    .el-reveal, .el-hero__content, .el-hero__brand { animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important; }
    .el-hero__media video { display: none; }
}

/* =========================================================
   BURGUNDY THEME — full-site burgundy background
   Flips the light theme to deep burgundy with porcelain text
   ========================================================= */
body.elegance,
body.elegance.interior {
    background: var(--el-burgundy) !important;
    color: var(--el-porcelain);
}
html { background: var(--el-burgundy); }

/* Headings always porcelain on burgundy */
body.elegance h1, body.elegance h2, body.elegance h3, body.elegance h4, body.elegance h5, body.elegance h6 {
    color: var(--el-porcelain);
}

/* Light sections become burgundy */
body.elegance .el-section--cream,
body.elegance .el-section--stone,
body.elegance .el-section--light {
    background: var(--el-burgundy) !important;
    color: var(--el-porcelain);
}
/* Subtle warmer-burgundy band so cream/stone still differentiate */
body.elegance .el-section--cream { background: #2f0805 !important; }
body.elegance .el-section--stone { background: #340a07 !important; }

/* Explore section — fond blanc cassé beige + textes sombres */
body.elegance #explore.el-section--cream { background: #f6f1e7 !important; color: var(--el-ink); }
body.elegance #explore .el-eyebrow.dark,
body.elegance #explore .el-title,
body.elegance #explore .el-explore__intro { color: var(--el-ink); }
body.elegance #explore .el-title em { color: var(--el-gold); }
body.elegance #explore .el-card__label { color: var(--el-gold); }
body.elegance #explore .el-card__title { color: var(--el-ink); }
body.elegance #explore .el-card__desc { color: rgba(31,26,23,.7); }
body.elegance #explore .el-card__more { color: var(--el-burgundy); }
body.elegance #explore .el-card:hover .el-card__more { color: var(--el-gold); }
/* Cadre burgundy autour des cartes explore — façon photo encadrée */
body.elegance #explore .el-card--feature {
    border: 1px solid rgba(47, 8, 5, .9);
    border-radius: 3px;
    background: #fdfaf4;
    padding: 10px;
    box-shadow: none;
    transition: transform .5s var(--el-ease), box-shadow .5s var(--el-ease);
}
body.elegance #explore .el-card--feature:hover {
    transform: translateY(-6px);
    border-color: var(--el-burgundy);
    box-shadow: 0 22px 50px rgba(47, 8, 5, .18);
}
body.elegance #explore .el-card--feature .el-card__media {
    border-radius: 2px;
    overflow: hidden;
}
body.elegance #explore .el-card--feature .el-card__body {
    padding: 1.3rem .4rem .6rem;
}

/* Quote on the manifesto band */
body.elegance .el-quote__text { color: var(--el-porcelain); }
body.elegance .el-quote__mark,
body.elegance .el-quote__attr { color: var(--el-gold-soft); }

/* Story / leads / paragraphs */
body.elegance .el-lead { color: rgba(250,246,239,.82); }
body.elegance p { color: rgba(250,246,239,.85); }
body.elegance .el-eyebrow.dark { color: var(--el-gold-soft); }

/* Address block */
body.elegance .el-address { border-top-color: rgba(250,246,239,.12); }
body.elegance .el-address__item p,
body.elegance .el-address__item a { color: var(--el-porcelain); }
body.elegance .el-address__item a:hover { color: var(--el-gold-soft); }

/* Cards on burgundy — warm dark surface with porcelain text */
body.elegance .el-card {
    background: rgba(250,246,239,.04);
    border: 1px solid rgba(250,246,239,.08);
}
body.elegance .el-card__body { padding: var(--el-6); }
body.elegance .el-card__title { color: var(--el-porcelain); }
body.elegance .el-card__desc { color: rgba(250,246,239,.72); }
body.elegance .el-card__more { color: var(--el-porcelain); }
body.elegance .el-card:hover .el-card__more { color: var(--el-gold-soft); }
body.elegance .el-card__media img { filter: grayscale(10%) brightness(.95); }

/* Divider gold stays, but on dark add subtle shine */
body.elegance .el-divider { background: var(--el-gold-soft); opacity: .8; }

/* Buttons default: porcelain border on burgundy already works.
   Primary button needs invert (was burgundy-on-cream → now porcelain-on-burgundy) */
body.elegance .el-btn--primary,
body.elegance .btn-primary {
    background: var(--el-porcelain);
    color: var(--el-burgundy);
    border-color: var(--el-porcelain);
}
body.elegance .el-btn--primary::before,
body.elegance .btn-primary::before { background: var(--el-burgundy); }
body.elegance .el-btn--primary:hover,
body.elegance .btn-primary:hover { color: var(--el-porcelain); border-color: var(--el-porcelain); }

/* Navbar scrolled state on HOME (over hero video) — keep burgundy, not cream */
body.elegance .navbar.scrolled,
body.elegance .navbar.solid {
    background: rgba(40,6,3,.96) !important;
    border-bottom: 1px solid rgba(184,146,74,.15);
}
body.elegance .navbar.scrolled .nav-logo img,
body.elegance .navbar.solid .nav-logo img { filter: brightness(0) invert(1); }
body.elegance .navbar.scrolled .nav-link,
body.elegance .navbar.solid .nav-link { color: var(--el-porcelain); }
body.elegance .navbar.scrolled .nav-toggle span,
body.elegance .navbar.solid .nav-toggle span { background: var(--el-porcelain); }
body.elegance .navbar.scrolled .language-btn,
body.elegance .navbar.solid .language-btn { color: var(--el-porcelain); border-color: rgba(250,246,239,.35); }

/* Story image frame border on dark */
body.elegance .el-story__image--frame::before { border-color: rgba(250,246,239,.18); }

/* Override style.css white surfaces on interior pages (menu cards, etc.) */
body.elegance.interior section,
body.elegance.interior .menu-section,
body.elegance.interior .page-section {
    background: transparent;
}
body.elegance.interior .menu-card,
body.elegance.interior .menu-item,
body.elegance.interior .card,
body.elegance.interior .cta-section,
body.elegance.interior .menu-categories,
body.elegance.interior .reservation-simple {
    background: rgba(250,246,239,.04) !important;
    border: 1px solid rgba(250,246,239,.08);
    color: var(--el-porcelain);
}
body.elegance.interior .menu-card h3,
body.elegance.interior .menu-card p,
body.elegance.interior .menu-item h3,
body.elegance.interior .menu-item p { color: var(--el-porcelain); }


/* ---------- Hero brand overlay (minimal: wordmark + tagline) ---------- */
.el-hero__brand {
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 0 1.5rem;
    max-width: 900px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.75rem;
    animation: el-fade-up 1.8s var(--el-ease-out) .35s both;
}
.el-hero__brand-mark {
    /* Img element cache visuellement (conserve alt pour SEO) */
    display: block;
    width: clamp(220px, 32vw, 380px);
    height: auto;
    opacity: 0;
    pointer-events: none;
}
/* Silhouette teintee a la couleur EXACTE #2f0805 via mask */
.el-hero__brand {
    position: relative;
}
.el-hero__brand::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: clamp(220px, 32vw, 380px);
    aspect-ratio: 1138 / 420;
    background-color: #ffffff;
    -webkit-mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') center / contain no-repeat;
            mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') center / contain no-repeat;
    filter: drop-shadow(0 6px 22px rgba(0, 0, 0, .45));
    pointer-events: none;
}
.el-hero__brand-sub {
    font-family: var(--el-sans);
    font-size: .72rem;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: rgba(250,246,239,.85);
    text-shadow: 0 2px 16px rgba(0,0,0,.5);
}
.el-hero__brand-sub::before,
.el-hero__brand-sub::after {
    content: '';
    display: inline-block;
    width: 28px;
    height: 1px;
    background: var(--el-gold-soft);
    vertical-align: middle;
    margin: 0 1rem;
    opacity: .8;
}
@media (max-width: 640px) {
    .el-hero__brand-mark { width: clamp(180px, 60vw, 260px); }
    .el-hero__brand-sub { font-size: .62rem; letter-spacing: .32em; }
    .el-hero__brand-sub::before,
    .el-hero__brand-sub::after { width: 18px; margin: 0 .6rem; }
}


/* ============================================================
   CADRE — Bordure dor�e flottante autour du viewport
   Style maison de luxe / hotel particulier
   ============================================================ */
/* Cadre retire a la demande du client */



/* ============================================================
   QUOTE OVERLAP — la citation remonte sur le hero au scroll
   ============================================================ */
.el-quote-overlap {
    position: relative;
    z-index: 5;
    margin-top: 0;
    border-radius: 32px 32px 0 0;
    box-shadow: 0 -30px 80px rgba(0, 0, 0, .28);
    padding-top: calc(var(--el-section-py, 6rem) + 1.5rem);
}
@media (max-width: 640px) {
    .el-quote-overlap {
        margin-top: 0;
        border-radius: 22px 22px 0 0;
        padding-top: calc(var(--el-section-py, 4rem) + 1rem);
    }
}


/* ============================================================
   HERO PINNED — la section hero reste fixe au scroll,
   les sections suivantes glissent par-dessus
   ============================================================ */
body.elegance .el-hero {
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 100vh;
    z-index: 1;
    transform: translateZ(0);
    will-change: transform;
}
/* Toutes les sections apres le hero doivent passer au-dessus */
body.elegance .el-hero ~ section,
body.elegance .el-hero ~ footer {
    position: relative;
    z-index: 2;
    background: var(--el-porcelain);
}
body.elegance .el-hero ~ .footer,
body.elegance footer.footer {
    background: var(--el-ink);
    transform: translateZ(0);
    will-change: transform;
}


/* ============================================================
   FIX STICKY — overflow-x:hidden de style.css cassait sticky
   overflow-x:clip n''empeche pas sticky (vs hidden)
   ============================================================ */
html { overflow-x: clip !important; overflow-y: visible !important; }
body.elegance { overflow-x: clip !important; overflow-y: visible !important; }

/* ============================================================
   FOOTER — refonte éditoriale
   ============================================================ */
body.elegance .footer { padding: 0 0 2.5rem; }

/* Bandeau réservation */
body.elegance .footer__cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 4.5rem 0 3.5rem;
    border-bottom: 1px solid rgba(250,246,239,.08);
}
body.elegance .footer__mark {
    width: 46px;
    height: auto;
    filter: brightness(0) invert(1);
    opacity: .85;
    margin-bottom: 1.4rem;
}
body.elegance .footer__cta-eyebrow {
    font-size: .7rem;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: #b8924a;
    margin: 0 0 1rem;
}
body.elegance .footer__cta-title {
    font-family: 'Jannon', serif;
    font-weight: 400;
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    line-height: 1.1;
    color: var(--el-porcelain);
    margin: 0 0 2rem;
}
body.elegance .footer__cta-title em { color: #d9b873; font-style: italic; }
body.elegance .footer__cta-text {
    max-width: 44ch;
    margin: 0 0 2rem;
    font-family: var(--el-serif);
    font-size: clamp(.98rem, 1.3vw, 1.08rem);
    line-height: 1.7;
    color: rgba(250,246,239,.66);
}
body.elegance .footer__cta-btn {
    display: inline-block;
    font-size: .74rem;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--el-porcelain);
    text-decoration: none;
    padding: 1rem 2.6rem;
    border: 1px solid rgba(217,184,115,.5);
    border-radius: 2px;
    transition: background .35s, color .35s, border-color .35s;
}
body.elegance .footer__cta-btn:hover {
    background: #d9b873;
    border-color: #d9b873;
    color: #2f0805;
}

/* Infos pratiques */
body.elegance .footer__info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(2rem, 5vw, 4rem);
    padding: 3.2rem 0;
    border-bottom: 1px solid rgba(250,246,239,.08);
}
body.elegance .footer__info-col { text-align: center; }
body.elegance .footer__info-title {
    font-family: var(--el-sans);
    font-size: .7rem;
    letter-spacing: .34em;
    text-transform: uppercase;
    color: #b8924a;
    margin: 0 0 1rem;
}
body.elegance .footer__info-col p {
    font-family: var(--el-serif);
    font-size: 1rem;
    line-height: 1.8;
    color: rgba(250,246,239,.72);
    margin: 0;
}
body.elegance .footer__info-col a {
    color: rgba(250,246,239,.72);
    text-decoration: none;
    transition: color .3s;
}
body.elegance .footer__info-col a.footer__phone {
    font-family: var(--el-sans);
    letter-spacing: .08em;
    font-size: .98rem;
}
body.elegance .footer__info-col a:hover { color: #d9b873; }

/* Bloc minimal centré */
body.elegance .footer__min {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
    text-align: center;
    padding-top: 3.5rem;
}
body.elegance .footer__cta .footer__logo { margin-top: 3rem; }
body.elegance .footer__cta .footer__rule { margin: 1.6rem 0; }
body.elegance .footer__cta .footer__nav { margin-bottom: 1.6rem; }
body.elegance .footer__logo {
    width: 120px;
    filter: brightness(0) invert(1);
    opacity: .9;
}
body.elegance .footer__rule {
    width: 40px;
    height: 1px;
    background: rgba(217,184,115,.45);
}
body.elegance .footer__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.2rem;
}
body.elegance .footer__nav a {
    font-size: .72rem;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: rgba(250,246,239,.75);
    text-decoration: none;
    transition: color .3s;
}
body.elegance .footer__nav a:hover { color: #d9b873; }
body.elegance .footer__social {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .9rem;
}
body.elegance .footer__social a {
    font-size: .66rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: rgba(250,246,239,.5);
    text-decoration: none;
    transition: color .3s;
}
body.elegance .footer__social a:hover { color: #d9b873; }
body.elegance .footer__dot { color: rgba(250,246,239,.3); }

/* Barre inférieure */
body.elegance .footer__bottom {
    margin-top: 3rem;
    padding-top: 1.6rem;
    border-top: 1px solid rgba(250,246,239,.08);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: .7rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: rgba(250,246,239,.45);
}

/* Footer responsive */
@media (max-width: 540px) {
    body.elegance .footer__cta { padding: 3.5rem 0 2.8rem; }
    body.elegance .footer__info { grid-template-columns: 1fr; gap: 2rem; padding: 2.6rem 0; }
    body.elegance .footer__nav { gap: 1.4rem; }
    body.elegance .footer__bottom { justify-content: center; text-align: center; }
}




/* ============================================================
   PREMIUM PASS — editorial typo, breathing, grain, refinements
   ============================================================ */

/* Editorial fonts override (web-safe loaded from Google Fonts) */
body.elegance {
    --el-display: 'Italiana', 'Cormorant Garamond', 'Vicomte', serif;
    --el-serif:   'Cormorant Garamond', 'Jannon', Georgia, serif;
    --el-sans:    'Inter', 'Futura Light', 'Helvetica Neue', system-ui, sans-serif;
    font-family: var(--el-sans);
    font-weight: 300;
    letter-spacing: .005em;
    line-height: 1.65;
}

/* Refined headings — thin, elegant, more tracking precision */
body.elegance h1, body.elegance h2, body.elegance h3, body.elegance h4,
body.elegance .el-display, body.elegance .el-title {
    font-family: var(--el-display) !important;
    font-weight: 400 !important;
    letter-spacing: -.015em !important;
    line-height: 1.04 !important;
}
body.elegance em, body.elegance .el-italic, body.elegance .el-title em {
    font-family: var(--el-serif) !important;
    font-style: italic !important;
    font-weight: 300 !important;
    letter-spacing: -.005em !important;
}

/* Bigger, more cinematic hero title */
body.elegance .el-hero h1, body.elegance .el-hero .el-display {
    font-size: clamp(3.6rem, 9vw, 9rem) !important;
    line-height: .98 !important;
}

/* Hero brand-mark refined width — only when NOT editorial (editorial scope overrides) */
body.elegance .el-hero:not(.el-hero--editorial):not(.el-hero--cinematic) .el-hero__brand-mark { width: clamp(260px, 36vw, 440px) !important; }
body.elegance .el-hero:not(.el-hero--editorial):not(.el-hero--cinematic) .el-hero__brand::before { width: clamp(260px, 36vw, 440px) !important; }

/* Eyebrow — finer, more spaced */
body.elegance .el-eyebrow {
    font-family: var(--el-sans) !important;
    font-size: .68rem !important;
    letter-spacing: .48em !important;
    font-weight: 400 !important;
    text-transform: uppercase;
}

/* Breathing — doubled section padding */
body.elegance .el-section {
    padding: clamp(7rem, 16vw, 14rem) 1.5rem !important;
}
body.elegance .el-container { max-width: 1180px !important; }
body.elegance .el-container--narrow { max-width: 820px !important; }
body.elegance .el-container--text { max-width: 620px !important; }

/* Lead paragraph — editorial line-height */
body.elegance .el-lead {
    font-size: 1.05rem !important;
    line-height: 1.95 !important;
    font-weight: 300 !important;
    letter-spacing: .005em !important;
}

/* Section title — more contrast scale */
body.elegance .el-title {
    font-size: clamp(2.4rem, 5.2vw, 4.6rem) !important;
    margin-bottom: 2.2rem !important;
}

/* Hairline divider — gold thread between sections */
body.elegance .el-section + .el-section::before {
    content: '';
    display: block;
    width: 64px;
    height: 1px;
    background: rgba(201, 169, 97, .35);
    margin: 0 auto clamp(3rem, 8vh, 5rem);
}

/* Grain overlay — analog film texture (very subtle) */
body.elegance::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9999;
    opacity: .035;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .8 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* (Navbar typo refinements moved to NAVBAR LUX block below) */

/* Image refinement — subtle desaturate by default */
body.elegance .el-story img,
body.elegance .el-fullbleed img,
body.elegance section img:not(.nav-logo img):not(.el-hero__brand-mark) {
    filter: saturate(.92) contrast(1.02);
    transition: filter 1.2s var(--el-ease-out), transform 1.4s var(--el-ease-out);
}
body.elegance .el-story:hover img,
body.elegance .el-fullbleed:hover img {
    filter: saturate(1) contrast(1.04);
}

/* Smooth-scroll body cleanup for Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* Reduced motion fallback */
@media (prefers-reduced-motion: reduce) {
    body.elegance::after { display: none; }
    body.elegance * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ============================================================
   PREMIUM PASS v2 — signature reveals
   Title word-by-word · clip-path image unveil · magnetic · cursor
   ============================================================ */

/* ---- Word reveal (editorial title split) ---- */
body.elegance .el-split .el-word {
    display: inline-block;
    overflow: hidden;
    vertical-align: bottom;
    line-height: 1;
}
body.elegance .el-split .el-word__in {
    display: inline-block;
    transform: translateY(110%);
    opacity: 0;
    will-change: transform, opacity;
    transition:
        transform 1.1s cubic-bezier(.2, .8, .2, 1),
        opacity   1.1s cubic-bezier(.2, .8, .2, 1);
}
body.elegance .el-split.is-revealed .el-word__in {
    transform: translateY(0);
    opacity: 1;
}
/* stagger up to 16 words */
body.elegance .el-split.is-revealed .el-word:nth-child(1)  .el-word__in { transition-delay: .00s; }
body.elegance .el-split.is-revealed .el-word:nth-child(2)  .el-word__in { transition-delay: .06s; }
body.elegance .el-split.is-revealed .el-word:nth-child(3)  .el-word__in { transition-delay: .12s; }
body.elegance .el-split.is-revealed .el-word:nth-child(4)  .el-word__in { transition-delay: .18s; }
body.elegance .el-split.is-revealed .el-word:nth-child(5)  .el-word__in { transition-delay: .24s; }
body.elegance .el-split.is-revealed .el-word:nth-child(6)  .el-word__in { transition-delay: .30s; }
body.elegance .el-split.is-revealed .el-word:nth-child(7)  .el-word__in { transition-delay: .36s; }
body.elegance .el-split.is-revealed .el-word:nth-child(8)  .el-word__in { transition-delay: .42s; }
body.elegance .el-split.is-revealed .el-word:nth-child(9)  .el-word__in { transition-delay: .48s; }
body.elegance .el-split.is-revealed .el-word:nth-child(10) .el-word__in { transition-delay: .54s; }
body.elegance .el-split.is-revealed .el-word:nth-child(11) .el-word__in { transition-delay: .60s; }
body.elegance .el-split.is-revealed .el-word:nth-child(12) .el-word__in { transition-delay: .66s; }
body.elegance .el-split.is-revealed .el-word:nth-child(13) .el-word__in { transition-delay: .72s; }
body.elegance .el-split.is-revealed .el-word:nth-child(14) .el-word__in { transition-delay: .78s; }
body.elegance .el-split.is-revealed .el-word:nth-child(15) .el-word__in { transition-delay: .84s; }
body.elegance .el-split.is-revealed .el-word:nth-child(16) .el-word__in { transition-delay: .90s; }

/* ---- Clip-path image unveil ---- */
body.elegance .el-clip {
    position: relative;
    overflow: hidden;
    clip-path: inset(0 0 100% 0);
    transition: clip-path 1.5s cubic-bezier(.7, 0, .2, 1);
    will-change: clip-path;
}
body.elegance .el-clip.is-revealed {
    clip-path: inset(0 0 0 0);
}
body.elegance .el-clip img {
    transform: scale(1.12);
    transition: transform 2.2s cubic-bezier(.16, 1, .3, 1);
    will-change: transform;
}
body.elegance .el-clip.is-revealed img {
    transform: scale(1);
}

/* ---- Magnetic CTA smooth return ---- */
body.elegance .nav-cta,
body.elegance .el-cta,
body.elegance .el-card {
    transition: transform .35s cubic-bezier(.2, .8, .2, 1),
                background .35s var(--el-ease),
                color .35s var(--el-ease),
                box-shadow .35s var(--el-ease),
                border-color .35s var(--el-ease) !important;
}

/* ---- Custom cursor (removed per user preference) ---- */

/* Reduced motion fallback */
@media (prefers-reduced-motion: reduce) {
    body.elegance .el-split .el-word__in { transform: none !important; opacity: 1 !important; transition: none !important; }
    body.elegance .el-clip { clip-path: none !important; }
    body.elegance .el-clip img { transform: none !important; }
}

/* ============================================================
   HERO EDITORIAL REDESIGN — overlay raffine sur video
   ============================================================ */

/* Stronger cinematic overlay for legibility — darken centre + heavier bottom for CTA contrast */
body.elegance .el-hero--editorial .el-hero__media::after {
    background:
        radial-gradient(120% 80% at 50% 50%, rgba(0,0,0,.32) 0%, rgba(0,0,0,.70) 60%, rgba(0,0,0,.88) 100%),
        linear-gradient(180deg, rgba(20,0,0,.55) 0%, rgba(20,0,0,.35) 30%, rgba(20,0,0,.55) 60%, rgba(20,0,0,.92) 100%) !important;
}

/* Centered stage */
body.elegance .el-hero--editorial .el-hero__stage {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0 1.5rem;
    max-width: 980px;
    margin: 0 auto;
    color: var(--el-porcelain);
    animation: el-fade-up 1.8s var(--el-ease-out) .25s both;
}
body.elegance .el-hero--editorial .el-hero__stage > * { flex: 0 0 auto; }

/* Eyebrow with roman numeral */
body.elegance .el-hero--editorial .el-hero__eyebrow {
    display: inline-block;
    font-family: var(--el-sans);
    font-size: .68rem;
    letter-spacing: .58em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .78);
    margin-bottom: 2.2rem;
    padding-left: .58em; /* compensate trailing tracking */
}

/* Wordmark */
body.elegance .el-hero--editorial .el-hero__brand {
    position: relative !important;
    display: inline-block !important;
    width: auto !important;
    align-self: center !important;
    margin: 0 0 2.4rem !important;
    line-height: 0;
}
body.elegance .el-hero--editorial .el-hero__brand-mark {
    display: block !important;
    width: clamp(200px, 22vw, 310px) !important;
    height: auto !important;
    opacity: 0 !important;
    pointer-events: none;
}
body.elegance .el-hero--editorial .el-hero__brand::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    height: auto !important;
    background-color: #ffffff !important;
    -webkit-mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') center/contain no-repeat !important;
            mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') center/contain no-repeat !important;
    filter: drop-shadow(0 8px 28px rgba(0, 0, 0, .55));
}

/* Tagline */
body.elegance .el-hero--editorial .el-hero__tagline {
    font-family: var(--el-serif);
    font-weight: 300;
    font-size: clamp(1rem, 1.45vw, 1.2rem);
    line-height: 1.7;
    letter-spacing: .015em;
    color: rgba(250, 246, 239, .82);
    margin: 0 auto 3.2rem;
    max-width: 520px;
}
body.elegance .el-hero--editorial .el-hero__tagline em {
    font-style: italic;
    color: rgba(201, 169, 97, .82);
    font-weight: 400;
}

/* (Hairline gold separator removed for cleaner composition) */
body.elegance .el-hero--editorial .el-hero__tagline::after {
    content: none !important;
}

/* CTAs — deux outline cream sobres, gold uniquement en accent au hover */
body.elegance .el-hero--editorial .el-hero__actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.2rem;
    margin-top: .25rem;
}
body.elegance .el-hero--editorial .el-hero__cta {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 210px;
    padding: 1.05rem 2rem;
    font-family: var(--el-sans);
    font-size: .66rem;
    font-weight: 400;
    letter-spacing: .42em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 999px;
    overflow: hidden;
    background: transparent;
    transition: color .55s var(--el-ease), border-color .55s var(--el-ease),
                transform .35s cubic-bezier(.2,.8,.2,1);
}
body.elegance .el-hero--editorial .el-hero__cta > * { position: relative; z-index: 2; }
body.elegance .el-hero--editorial .el-hero__cta::before {
    content: '';
    position: absolute; inset: 0;
    background: rgba(250, 246, 239, .06);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .65s cubic-bezier(.2,.8,.2,1);
    z-index: 1;
}
body.elegance .el-hero--editorial .el-hero__cta:hover::before { transform: scaleX(1); }

/* Primary — stroke gold subtil, texte gold */
body.elegance .el-hero--editorial .el-hero__cta--primary {
    color: var(--el-gold-soft);
    border: 1px solid rgba(201, 169, 97, .55);
    box-shadow: none;
}
body.elegance .el-hero--editorial .el-hero__cta--primary:hover {
    color: #f1dca8;
    border-color: rgba(201, 169, 97, .9);
    transform: translateY(-2px);
}

/* Ghost — stroke cream, texte cream */
body.elegance .el-hero--editorial .el-hero__cta--ghost {
    color: var(--el-porcelain);
    border: 1px solid rgba(250, 246, 239, .3);
}
body.elegance .el-hero--editorial .el-hero__cta--ghost:hover {
    color: #ffffff;
    border-color: rgba(250, 246, 239, .65);
    transform: translateY(-2px);
}

/* Top meta lines */
body.elegance .el-hero--editorial .el-hero__meta {
    position: absolute;
    top: clamp(90px, 11vh, 130px);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 1rem;
    font-family: var(--el-sans);
    font-size: .62rem;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .55);
    pointer-events: none;
    animation: el-fade-in 1.4s var(--el-ease-out) 1.1s both;
}
body.elegance .el-hero--editorial .el-hero__meta--tl { left: clamp(1.25rem, 4vw, 3.5rem); }
body.elegance .el-hero--editorial .el-hero__meta--tr { right: clamp(1.25rem, 4vw, 3.5rem); }
body.elegance .el-hero--editorial .el-hero__rule {
    display: inline-block;
    width: 36px; height: 1px;
    background: rgba(201, 169, 97, .55);
}

/* Scroll indicator */
body.elegance .el-hero--editorial .el-hero__scroll {
    position: absolute;
    bottom: clamp(1.5rem, 4vh, 3rem);
    left: 50%;
    z-index: 3;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: .85rem;
    text-decoration: none;
    color: rgba(250, 246, 239, .7);
    writing-mode: horizontal-tb !important;
    transform: translateX(-50%);
    animation: el-fade-in 1.4s var(--el-ease-out) 1.4s both;
}
body.elegance .el-hero--editorial .el-hero__scroll::after { content: none !important; }
body.elegance .el-hero--editorial .el-hero__scroll-label {
    font-family: var(--el-sans);
    font-size: .62rem;
    letter-spacing: .48em;
    text-transform: uppercase;
    white-space: nowrap !important;
    writing-mode: horizontal-tb !important;
    display: inline-block;
}
body.elegance .el-hero--editorial .el-hero__scroll-line {
    display: block;
    width: 1px; height: 48px;
    background: linear-gradient(to bottom, rgba(201,169,97,.7), rgba(201,169,97,0));
    animation: el-scroll-pulse 2.2s ease-in-out infinite;
    transform-origin: top;
}
@keyframes el-scroll-pulse {
    0%, 100% { transform: scaleY(.4); opacity: .35; }
    50%      { transform: scaleY(1);  opacity: 1; }
}
@keyframes el-fade-in {
    from { opacity: 0; } to { opacity: 1; }
}

/* Mobile refinements */
@media (max-width: 720px) {
    body.elegance .el-hero--editorial .el-hero__meta { display: none; }
    body.elegance .el-hero--editorial .el-hero__eyebrow {
        font-size: .58rem;
        letter-spacing: .42em;
        margin-bottom: 1.4rem;
    }
    body.elegance .el-hero--editorial .el-hero__brand-mark,
    body.elegance .el-hero--editorial .el-hero__brand::before {
        width: clamp(220px, 70vw, 320px);
    }
    body.elegance .el-hero--editorial .el-hero__tagline {
        font-size: 1rem;
        margin-bottom: 2rem;
    }
    body.elegance .el-hero--editorial .el-hero__cta {
        min-width: 240px;
        padding: 1rem 1.5rem;
    }
    body.elegance .el-hero--editorial .el-hero__scroll { bottom: 1.2rem; }
    body.elegance .el-hero--editorial .el-hero__scroll-line { height: 36px; }
}

/* ============================================================
   NAVBAR LUX — premium floating navbar
   Transparent over hero · solid burgundy on scroll · gold hairline
   Hover underline that slides in · refined typography
   ============================================================ */
body.elegance .navbar.navbar--lux {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
    backdrop-filter: blur(0px) saturate(1);
    -webkit-backdrop-filter: blur(0px) saturate(1);
    transition:
        background .65s cubic-bezier(.2, .8, .2, 1),
        backdrop-filter .65s cubic-bezier(.2, .8, .2, 1),
        border-color .65s cubic-bezier(.2, .8, .2, 1),
        padding .65s cubic-bezier(.2, .8, .2, 1),
        box-shadow .65s cubic-bezier(.2, .8, .2, 1);
    padding: 1.3rem 0;
    box-shadow: none;
}
body.elegance .navbar--lux.scrolled {
    background: rgba(47, 8, 5, .82);
    backdrop-filter: blur(18px) saturate(1.4);
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
    border-bottom: 1px solid rgba(201, 169, 97, .18);
    padding: .75rem 0;
    box-shadow: 0 12px 40px -20px rgba(0, 0, 0, .55);
}

body.elegance .navbar--lux .nav-container {
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 clamp(1.2rem, 3.5vw, 3rem);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 2rem;
}

/* Logo cell — left */
body.elegance .navbar--lux .nav-logo {
    justify-self: start;
    display: flex;
    align-items: center;
    transition: opacity .4s var(--el-ease-out, ease);
}
body.elegance .navbar--lux .nav-logo:hover { opacity: .82; }
body.elegance .navbar--lux .nav-logo img {
    height: 44px;
    width: auto;
    filter: brightness(0) invert(1);
    transition: height .65s cubic-bezier(.2, .8, .2, 1), filter .4s ease;
}
body.elegance .navbar--lux.scrolled .nav-logo img { height: 36px; }

/* Links cell — center */
body.elegance .navbar--lux .nav-links {
    justify-self: center;
    display: flex;
    align-items: center;
    gap: clamp(1.6rem, 3vw, 2.6rem);
    list-style: none;
    margin: 0;
    padding: 0;
}
body.elegance .navbar--lux .nav-link {
    position: relative;
    display: inline-block;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .82);
    text-decoration: none;
    padding: .5rem 0;
    transition: color .4s ease;
    white-space: nowrap;
}
body.elegance .navbar--lux .nav-link::after {
    content: '';
    position: absolute;
    bottom: .1rem;
    left: 50%;
    width: 0;
    height: 1px;
    background: var(--el-gold-soft, #c9a961);
    transition: width .55s cubic-bezier(.2, .8, .2, 1), left .55s cubic-bezier(.2, .8, .2, 1);
}
body.elegance .navbar--lux .nav-link:hover,
body.elegance .navbar--lux .nav-link.active { color: #faf6ef; }
body.elegance .navbar--lux .nav-link:hover::after,
body.elegance .navbar--lux .nav-link.active::after { width: 100%; left: 0; }

/* Actions cell — right */
body.elegance .navbar--lux .nav-actions {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 1.4rem;
}

/* Language switcher */
body.elegance .navbar--lux .language-switcher { position: relative; }
body.elegance .navbar--lux .language-btn {
    background: transparent;
    border: none;
    color: rgba(250, 246, 239, .75);
    font-family: var(--el-sans);
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: .35em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    cursor: pointer;
    padding: .5rem .2rem;
    transition: color .35s ease;
}
body.elegance .navbar--lux .language-btn:hover { color: var(--el-gold-soft, #c9a961); }
body.elegance .navbar--lux .language-arrow { font-size: .5rem; opacity: .7; transition: transform .35s ease; }
body.elegance .navbar--lux .language-btn[aria-expanded="true"] .language-arrow { transform: rotate(180deg); }

body.elegance .navbar--lux .language-menu {
    position: absolute;
    top: calc(100% + .8rem);
    right: 0;
    min-width: 130px;
    background: rgba(28, 8, 6, .96);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(201, 169, 97, .2);
    border-radius: 2px;
    padding: .4rem 0;
    list-style: none;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .35s ease, transform .35s ease, visibility .35s;
    box-shadow: 0 16px 40px -16px rgba(0, 0, 0, .55);
}
body.elegance .navbar--lux .language-switcher.open .language-menu,
body.elegance .navbar--lux .language-btn[aria-expanded="true"] + .language-menu,
body.elegance .navbar--lux .language-menu.show {
    opacity: 1; visibility: visible; transform: translateY(0);
}
body.elegance .navbar--lux .language-option {
    display: block;
    width: 100%;
    background: transparent;
    border: none;
    color: rgba(250, 246, 239, .78);
    font-family: var(--el-sans);
    font-size: .68rem;
    letter-spacing: .32em;
    text-transform: uppercase;
    text-align: left;
    padding: .65rem 1.1rem;
    cursor: pointer;
    transition: color .3s ease, background .3s ease;
}
body.elegance .navbar--lux .language-option:hover,
body.elegance .navbar--lux .language-option.active {
    color: var(--el-gold-soft, #c9a961);
    background: rgba(201, 169, 97, .06);
}

/* Reservation CTA — gold hairline pill */
body.elegance .navbar--lux .nav-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--el-sans);
    font-size: .65rem;
    font-weight: 500;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: var(--el-gold-soft, #c9a961);
    text-decoration: none;
    padding: .85rem 1.7rem;
    border: 1px solid rgba(201, 169, 97, .55);
    border-radius: 999px;
    position: relative;
    overflow: hidden;
    transition: color .5s ease, border-color .5s ease;
    background: transparent;
}
body.elegance .navbar--lux .nav-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--el-gold-soft, #c9a961);
    transform: translateY(100%);
    transition: transform .55s cubic-bezier(.2, .8, .2, 1);
    z-index: 0;
}
body.elegance .navbar--lux .nav-cta > * { position: relative; z-index: 1; }
body.elegance .navbar--lux .nav-cta:hover {
    color: #1c0806;
    border-color: var(--el-gold-soft, #c9a961);
}
body.elegance .navbar--lux .nav-cta:hover::before { transform: translateY(0); }

/* Hide mobile toggle on desktop */
body.elegance .navbar--lux .mobile-toggle,
body.elegance .navbar--lux .nav-mobile-toggle { display: none; }

/* Offset hero behind transparent navbar */
body.elegance .navbar--lux ~ main .el-hero:first-of-type,
body.elegance .navbar--lux ~ .el-hero:first-of-type { margin-top: 0; }

/* ---- Mobile ---- */
@media (max-width: 980px) {
    body.elegance .navbar--lux .nav-container {
        grid-template-columns: auto 1fr auto;
        gap: 1rem;
    }
    body.elegance .navbar--lux .nav-links {
        position: fixed;
        inset: 0;
        background: rgba(28, 8, 6, .98);
        backdrop-filter: blur(24px);
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 2.4rem;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-12px);
        transition: opacity .5s ease, transform .5s ease, visibility .5s;
        z-index: 999;
    }
    body.elegance .navbar--lux.menu-open .nav-links {
        opacity: 1; visibility: visible; transform: translateY(0);
    }
    body.elegance .navbar--lux .nav-link {
        font-size: .85rem;
        letter-spacing: .35em;
    }
    body.elegance .navbar--lux .nav-mobile-toggle,
    body.elegance .navbar--lux .mobile-toggle {
        display: inline-flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 5px;
        width: 36px;
        height: 36px;
        background: transparent;
        border: none;
        cursor: pointer;
        z-index: 1001;
        padding: 0;
    }
    body.elegance .navbar--lux .nav-mobile-toggle span,
    body.elegance .navbar--lux .mobile-toggle span {
        display: block;
        width: 22px;
        height: 1px;
        background: #faf6ef;
        transition: transform .4s ease, opacity .4s ease;
    }
    body.elegance .navbar--lux.menu-open .nav-mobile-toggle span:nth-child(1),
    body.elegance .navbar--lux.menu-open .mobile-toggle span:nth-child(1) {
        transform: translateY(6px) rotate(45deg);
    }
    body.elegance .navbar--lux.menu-open .nav-mobile-toggle span:nth-child(2),
    body.elegance .navbar--lux.menu-open .mobile-toggle span:nth-child(2) { opacity: 0; }
    body.elegance .navbar--lux.menu-open .nav-mobile-toggle span:nth-child(3),
    body.elegance .navbar--lux.menu-open .mobile-toggle span:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg);
    }
    body.elegance .navbar--lux .nav-actions { gap: .8rem; }
    body.elegance .navbar--lux .nav-cta {
        padding: .65rem 1.1rem;
        font-size: .58rem;
        letter-spacing: .32em;
    }
}


/* ---- HTML hooks specifics: nav-toggle (current markup) + language-selector wrapper ---- */
body.elegance .navbar--lux .nav-toggle { display: none; }
@media (max-width: 980px) {
    body.elegance .navbar--lux .nav-toggle {
        display: inline-flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 5px;
        width: 36px;
        height: 36px;
        background: transparent;
        border: none;
        cursor: pointer;
        z-index: 1001;
        padding: 0;
        order: 3;
    }
    body.elegance .navbar--lux .nav-toggle span {
        display: block;
        width: 22px;
        height: 1px;
        background: #faf6ef;
        transition: transform .4s ease, opacity .4s ease;
    }
    body.elegance .navbar--lux.menu-open .nav-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
    body.elegance .navbar--lux.menu-open .nav-toggle span:nth-child(2) { opacity: 0; }
    body.elegance .navbar--lux.menu-open .nav-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}

/* language wrapper variants */
body.elegance .navbar--lux .language-selector,
body.elegance .navbar--lux .language-dropdown { position: relative; display: inline-block; }
body.elegance .navbar--lux .language-dropdown .language-menu {
    position: absolute;
    top: calc(100% + .8rem);
    right: 0;
    min-width: 140px;
    background: rgba(28, 8, 6, .96);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(201, 169, 97, .2);
    border-radius: 2px;
    padding: .4rem 0;
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .35s ease, transform .35s ease, visibility .35s;
    box-shadow: 0 16px 40px -16px rgba(0, 0, 0, .55);
}
body.elegance .navbar--lux .language-btn[aria-expanded="true"] + .language-menu,
body.elegance .navbar--lux .language-dropdown.open .language-menu,
body.elegance .navbar--lux .language-menu.show {
    opacity: 1; visibility: visible; transform: translateY(0);
}
body.elegance .navbar--lux .language-option {
    color: rgba(250, 246, 239, .78);
    font-family: var(--el-sans);
    font-size: .68rem;
    letter-spacing: .32em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: left;
    padding: .65rem 1.1rem;
    transition: color .3s ease, background .3s ease;
}
body.elegance .navbar--lux .language-option:hover,
body.elegance .navbar--lux .language-option.active {
    color: var(--el-gold-soft, #c9a961);
    background: rgba(201, 169, 97, .06);
}


/* ============================================================
   HERO CINEMATIC + NAVBAR REFINEMENT — full redesign (v u)
   Bottom-anchored editorial composition over cinematic video
   ============================================================ */

/* ---- Navbar refinement: divider + cta span fill ---- */
body.elegance .navbar--lux .nav-divider {
    width: 1px;
    height: 18px;
    background: rgba(250, 246, 239, .22);
    display: inline-block;
}
body.elegance .navbar--lux.scrolled .nav-divider { background: rgba(201, 169, 97, .28); }
body.elegance .navbar--lux .nav-cta > span { position: relative; z-index: 2; }

/* =================== CINEMATIC HERO =================== */
body.elegance .el-hero--cinematic {
    min-height: 100vh;
    min-height: 100svh;
    display: block;
    position: sticky;
    top: 0;
    align-items: stretch;
    justify-content: flex-start;
    background: #1a0503;
}

body.elegance .el-hero--cinematic .el-hero__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    transform: translateZ(0);
    will-change: transform;
}
body.elegance .el-hero--cinematic .el-hero__media video,
body.elegance .el-hero--cinematic .el-hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.04) translateZ(0);
    backface-visibility: hidden;
}
body.elegance .el-hero--cinematic .el-hero__media::after { content: none !important; }

/* Desktop — zoom out the video a touch (show more of the frame) */
@media (min-width: 880px) {
    body.elegance .el-hero--cinematic .el-hero__media video {
        object-fit: cover;
        transform: scale(1);
        animation: none;
    }
}

@keyframes el-hero-kenburns {
    from { transform: scale(1.04); }
    to   { transform: scale(1.12); }
}

/* Veil — refined cinematic gradient, heavy bottom-left for legibility */
body.elegance .el-hero--cinematic .el-hero__veil {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(105deg, rgba(12,2,1,.82) 0%, rgba(12,2,1,.45) 38%, rgba(12,2,1,.12) 62%, rgba(12,2,1,0) 80%),
        linear-gradient(0deg, rgba(10,1,0,.86) 0%, rgba(10,1,0,.30) 34%, rgba(10,1,0,.10) 60%, rgba(10,1,0,.30) 100%),
        radial-gradient(140% 100% at 18% 88%, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 55%);
    pointer-events: none;
}

/* Inner wrapper — anchors content bottom-left */
body.elegance .el-hero--cinematic .el-hero__inner {
    position: relative;
    z-index: 3;
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 clamp(1.4rem, 5vw, 5rem);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: clamp(8rem, 16vh, 12rem);
}

body.elegance .el-hero--cinematic .el-hero__content {
    max-width: 760px;
    text-align: left;
    animation: el-fade-up 1.5s cubic-bezier(.16,1,.3,1) .2s both;
}

/* Eyebrow with leading hairline */
body.elegance .el-hero--cinematic .el-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .7rem;
    font-weight: 400;
    letter-spacing: .46em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .82);
    margin: 0 0 1.6rem;
}
body.elegance .el-hero--cinematic .el-hero__eyebrow-line {
    display: inline-block;
    width: clamp(28px, 4vw, 56px);
    height: 1px;
    background: var(--el-gold-soft);
    opacity: .85;
}

/* Wordmark — left aligned, refined size, white via mask */
body.elegance .el-hero--cinematic .el-hero__brand {
    position: relative;
    display: inline-block;
    width: auto;
    margin: 0 0 1.8rem;
    line-height: 0;
}
body.elegance .el-hero--cinematic .el-hero__brand-mark {
    display: block;
    width: clamp(230px, 30vw, 420px);
    height: auto;
    opacity: 0;
    pointer-events: none;
}
body.elegance .el-hero--cinematic .el-hero__brand::before {
    content: '';
    position: absolute;
    inset: 0;
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    transform: none !important;
    background-color: #ffffff;
    -webkit-mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') left center/contain no-repeat;
            mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') left center/contain no-repeat;
    filter: drop-shadow(0 10px 34px rgba(0, 0, 0, .55));
}

/* Tagline */
body.elegance .el-hero--cinematic .el-hero__tagline {
    font-family: var(--el-serif), 'Cormorant Garamond', Georgia, serif;
    font-weight: 300;
    font-size: clamp(1.1rem, 1.7vw, 1.5rem);
    line-height: 1.6;
    letter-spacing: .01em;
    color: rgba(250, 246, 239, .9);
    margin: 0 0 2.6rem;
    max-width: none;
    white-space: nowrap;
}
body.elegance .el-hero--cinematic .el-hero__tagline em {
    font-style: italic;
    color: var(--el-gold-soft);
    font-weight: 400;
}

/* CTAs */
body.elegance .el-hero--cinematic .el-hero__actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 1rem;
}
body.elegance .el-hero--cinematic .el-hero__cta {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 210px;
    padding: 1.05rem 2.1rem;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .66rem;
    font-weight: 400;
    letter-spacing: .4em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 999px;
    overflow: hidden;
    background: transparent;
    transition: color .55s cubic-bezier(.2,.8,.2,1), border-color .55s ease, transform .4s cubic-bezier(.2,.8,.2,1);
}
body.elegance .el-hero--cinematic .el-hero__cta > span { position: relative; z-index: 2; }
body.elegance .el-hero--cinematic .el-hero__cta::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .6s cubic-bezier(.2,.8,.2,1);
}

/* Primary — solid gold-cream pill, fills darker on hover */
body.elegance .el-hero--cinematic .el-hero__cta--primary {
    color: #1c0604;
    border: 1px solid var(--el-gold-soft);
    background: var(--el-gold-soft);
}
body.elegance .el-hero--cinematic .el-hero__cta--primary::before { background: #e6cf95; }
body.elegance .el-hero--cinematic .el-hero__cta--primary:hover { color: #1c0604; transform: translateY(-2px); }
body.elegance .el-hero--cinematic .el-hero__cta--primary:hover::before { transform: scaleX(1); }

/* Ghost — outline cream */
body.elegance .el-hero--cinematic .el-hero__cta--ghost {
    color: var(--el-porcelain);
    border: 1px solid rgba(250, 246, 239, .32);
}
body.elegance .el-hero--cinematic .el-hero__cta--ghost::before { background: rgba(250, 246, 239, .1); }
body.elegance .el-hero--cinematic .el-hero__cta--ghost:hover { color: #fff; border-color: rgba(250, 246, 239, .6); transform: translateY(-2px); }
body.elegance .el-hero--cinematic .el-hero__cta--ghost:hover::before { transform: scaleX(1); }

/* Bottom meta footer row */
body.elegance .el-hero--cinematic .el-hero__footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: clamp(1.6rem, 4vh, 2.6rem);
    z-index: 3;
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 clamp(1.4rem, 5vw, 5rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
body.elegance .el-hero--cinematic .el-hero__footer-item {
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .62rem;
    letter-spacing: .34em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .55);
    white-space: nowrap;
}
body.elegance .el-hero--cinematic .el-hero__footer-item--right { text-align: right; }

/* Scroll cue — center */
body.elegance .el-hero--cinematic .el-hero__scrollcue {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: .7rem;
    text-decoration: none;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .58rem;
    letter-spacing: .42em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .65);
    transition: color .4s ease;
}
body.elegance .el-hero--cinematic .el-hero__scrollcue:hover { color: var(--el-gold-soft); }
body.elegance .el-hero--cinematic .el-hero__scrollcue-line {
    width: 1px;
    height: 38px;
    background: linear-gradient(180deg, var(--el-gold-soft), transparent);
    position: relative;
    overflow: hidden;
}
body.elegance .el-hero--cinematic .el-hero__scrollcue-line::after {
    content: '';
    position: absolute;
    top: -38px; left: 0;
    width: 1px; height: 38px;
    background: linear-gradient(180deg, transparent, #fff, transparent);
    animation: el-scrollcue 2.4s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes el-scrollcue {
    0%   { transform: translateY(0); }
    100% { transform: translateY(76px); }
}

/* ---- Responsive ---- */
@media (max-width: 880px) {
    body.elegance .el-hero--cinematic .el-hero__inner {
        padding-bottom: clamp(7rem, 22vh, 10rem);
        justify-content: flex-end;
    }
    body.elegance .el-hero--cinematic .el-hero__content { max-width: 100%; }
    body.elegance .el-hero--cinematic .el-hero__brand-mark { width: clamp(190px, 56vw, 300px); }
    body.elegance .el-hero--cinematic .el-hero__tagline { font-size: 1.05rem; white-space: normal; }
    body.elegance .el-hero--cinematic .el-hero__actions { width: 100%; }
    body.elegance .el-hero--cinematic .el-hero__cta { flex: 1 1 auto; min-width: 0; }
    body.elegance .el-hero--cinematic .el-hero__footer-item { display: none; }
    body.elegance .el-hero--cinematic .el-hero__footer { justify-content: center; }
}

/* Mobile drawer keyed on JS classes (.nav-links.active / .nav-toggle.active) */
@media (max-width: 980px) {
    body.elegance .navbar--lux .nav-links.active {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
    }
    body.elegance .navbar--lux .nav-toggle.active span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
    body.elegance .navbar--lux .nav-toggle.active span:nth-child(2) { opacity: 0; }
    body.elegance .navbar--lux .nav-toggle.active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
    body.elegance .navbar--lux .nav-divider { display: none; }
}


/* ============================================================
   NAVBAR MAISON — refined 3-column grid navbar
   Logo left · links center · actions right
   Transparent over hero, solid burgundy + gold hairline on scroll
   ============================================================ */
body.elegance .navbar.navbar--maison {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1000;
    background: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
    padding: 1.5rem 0;
    transition:
        background .6s cubic-bezier(.2,.8,.2,1),
        backdrop-filter .6s cubic-bezier(.2,.8,.2,1),
        border-color .6s cubic-bezier(.2,.8,.2,1),
        padding .6s cubic-bezier(.2,.8,.2,1),
        box-shadow .6s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--maison.scrolled {
    background: rgba(30, 5, 3, .85);
    backdrop-filter: blur(20px) saturate(1.4);
    -webkit-backdrop-filter: blur(20px) saturate(1.4);
    border-bottom: 1px solid rgba(201, 169, 97, .2);
    padding: .85rem 0;
    box-shadow: 0 14px 44px -24px rgba(0, 0, 0, .6);
}
body.elegance .navbar--maison.navbar-hidden { transform: translateY(-100%); }
body.elegance .navbar--maison { transition: transform .6s cubic-bezier(.2,.8,.2,1), background .6s, backdrop-filter .6s, border-color .6s, padding .6s, box-shadow .6s; }

body.elegance .navbar--maison .nav-container {
    max-width: 1560px;
    margin: 0 auto;
    padding: 0 clamp(1.4rem, 4vw, 3.4rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

/* Columns */
body.elegance .navbar--maison .nav-col--left  { order: 1; }
body.elegance .navbar--maison .nav-col--right { order: 2; }
/* Center column holds the fullscreen drawer — not inline */
body.elegance .navbar--maison .nav-col--center { position: static; }

/* Logo */
body.elegance .navbar--maison .nav-logo {
    display: inline-flex;
    align-items: center;
    transition: opacity .4s ease;
}
body.elegance .navbar--maison .nav-logo:hover { opacity: .8; }
body.elegance .navbar--maison .nav-logo img {
    height: 46px;
    width: auto;
    filter: brightness(0) invert(1);
    transition: height .6s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--maison.scrolled .nav-logo img { height: 36px; }

/* Links — always a fullscreen drawer (hamburger only) */
body.elegance .navbar--maison .nav-links {
    position: fixed;
    inset: 0;
    background: rgba(24, 6, 4, .98);
    backdrop-filter: blur(28px);
    -webkit-backdrop-filter: blur(28px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: clamp(1.8rem, 4vh, 2.8rem);
    list-style: none;
    margin: 0;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-14px);
    transition: opacity .55s cubic-bezier(.2,.8,.2,1), transform .55s cubic-bezier(.2,.8,.2,1), visibility .55s;
    z-index: 999;
}
body.elegance .navbar--maison .nav-links.active {
    opacity: 1; visibility: visible; transform: translateY(0);
}
body.elegance .navbar--maison .nav-links li { margin: 0; }
body.elegance .navbar--maison .nav-link {
    position: relative;
    display: inline-block;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: clamp(1.4rem, 3.4vw, 2.4rem);
    font-weight: 400;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .82);
    text-decoration: none;
    padding: .3rem 0;
    transition: color .4s ease;
    white-space: nowrap;
}
body.elegance .navbar--maison .nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px; left: 50%;
    width: 0; height: 1px;
    background: var(--el-gold-soft);
    transform: translateX(-50%);
    transition: width .5s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--maison .nav-link:hover,
body.elegance .navbar--maison .nav-link.active { color: #faf6ef; }
body.elegance .navbar--maison .nav-link:hover::after,
body.elegance .navbar--maison .nav-link.active::after { width: 100%; }

/* Right actions */
body.elegance .navbar--maison .nav-actions {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

/* Language switcher */
body.elegance .navbar--maison .language-selector,
body.elegance .navbar--maison .language-dropdown { position: relative; display: inline-block; }
body.elegance .navbar--maison .language-btn {
    background: transparent;
    border: none;
    color: rgba(250, 246, 239, .72);
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: .26em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: pointer;
    padding: .4rem .2rem;
    transition: color .35s ease;
}
body.elegance .navbar--maison .language-btn:hover { color: var(--el-gold-soft); }
body.elegance .navbar--maison .language-arrow { font-size: .6rem; opacity: .7; transition: transform .35s ease; }
body.elegance .navbar--maison .language-btn[aria-expanded="true"] .language-arrow { transform: rotate(180deg); }
body.elegance .navbar--maison .language-menu {
    position: absolute;
    top: calc(100% + .9rem);
    right: 0;
    min-width: 150px;
    background: rgba(28, 8, 6, .97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(201, 169, 97, .2);
    border-radius: 3px;
    padding: .45rem 0;
    display: flex;
    flex-direction: column;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .35s ease, transform .35s ease, visibility .35s;
    box-shadow: 0 18px 44px -18px rgba(0, 0, 0, .6);
}
body.elegance .navbar--maison .language-btn[aria-expanded="true"] + .language-menu,
body.elegance .navbar--maison .language-dropdown.open .language-menu,
body.elegance .navbar--maison .language-selector.open .language-menu {
    opacity: 1; visibility: visible; transform: translateY(0);
}
body.elegance .navbar--maison .language-option {
    color: rgba(250, 246, 239, .78);
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .68rem;
    letter-spacing: .26em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: left;
    padding: .65rem 1.2rem;
    transition: color .3s ease, background .3s ease;
}
body.elegance .navbar--maison .language-option:hover,
body.elegance .navbar--maison .language-option.active {
    color: var(--el-gold-soft);
    background: rgba(201, 169, 97, .07);
}

/* Reservation CTA — gold hairline pill with fill */
body.elegance .navbar--maison .nav-cta {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .66rem;
    font-weight: 500;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--el-gold-soft);
    text-decoration: none;
    padding: .8rem 1.7rem;
    border: 1px solid rgba(201, 169, 97, .55);
    border-radius: 999px;
    background: transparent;
    transition: color .5s cubic-bezier(.2,.8,.2,1), border-color .5s ease;
}
body.elegance .navbar--maison .nav-cta > span { position: relative; z-index: 2; }
body.elegance .navbar--maison .nav-cta::before {
    content: '';
    position: absolute; inset: 0; z-index: 1;
    background: var(--el-gold-soft);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .55s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--maison .nav-cta:hover { color: #1c0604; border-color: var(--el-gold-soft); }
body.elegance .navbar--maison .nav-cta:hover::before { transform: scaleX(1); }

/* Toggle — hamburger always visible */
body.elegance .navbar--maison .nav-toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 1001;
    padding: 0;
}
body.elegance .navbar--maison .nav-toggle span {
    display: block;
    width: 26px;
    height: 1px;
    background: #faf6ef;
    transition: transform .4s ease, opacity .4s ease, width .4s ease;
}
body.elegance .navbar--maison .nav-toggle:hover span { width: 26px; }
body.elegance .navbar--maison .nav-toggle:hover span:nth-child(2) { width: 18px; }
body.elegance .navbar--maison .nav-toggle.active span:nth-child(1) { transform: translateY(6px) rotate(45deg); width: 26px; }
body.elegance .navbar--maison .nav-toggle.active span:nth-child(2) { opacity: 0; }
body.elegance .navbar--maison .nav-toggle.active span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); width: 26px; }

/* ---- Mobile ---- */
@media (max-width: 980px) {
    body.elegance .navbar--maison .nav-link { font-size: clamp(1.5rem, 7vw, 2rem); letter-spacing: .1em; }
    body.elegance .navbar--maison .nav-actions { gap: 1rem; }
    body.elegance .navbar--maison .nav-cta { padding: .65rem 1.2rem; font-size: .6rem; letter-spacing: .26em; }
}


/* ============================================================
   NAVBAR SIAMO — floating pill buttons cluster (SIAMO NOI style)
   Hamburger + Instagram + Language pills top-left · CTA top-right
   ============================================================ */
body.elegance .navbar.navbar--siamo {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1000;
    background: transparent;
    border: none;
    padding: clamp(1.1rem, 2.6vh, 1.8rem) 0;
    transition: transform .6s cubic-bezier(.2,.8,.2,1), padding .6s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--siamo.navbar-hidden { transform: translateY(-130%); }
body.elegance .navbar--siamo.scrolled { padding: .7rem 0; }

body.elegance .navbar--siamo .nav-container {
    max-width: 1640px;
    margin: 0 auto;
    padding: 0 clamp(1.2rem, 3.5vw, 2.6rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Clusters */
body.elegance .navbar--siamo .nav-cluster {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
}
body.elegance .navbar--siamo .nav-cluster > * { order: 0 !important; }
body.elegance .navbar--siamo .language-selector { order: 0 !important; }

/* Base pill */
body.elegance .navbar--siamo .nav-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    height: 46px;
    padding: 0 1.1rem;
    border-radius: 999px;
    background: rgba(28, 10, 7, .42);
    border: 1px solid rgba(250, 246, 239, .16);
    backdrop-filter: blur(14px) saturate(1.2);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    color: rgba(250, 246, 239, .92);
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: .18em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition: background .4s ease, border-color .4s ease, color .4s ease, transform .35s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--siamo .nav-pill:hover {
    background: rgba(40, 14, 10, .6);
    border-color: rgba(201, 169, 97, .55);
    color: #fff;
    transform: translateY(-1px);
}

/* Icon-only circular pills */
body.elegance .navbar--siamo .nav-pill--icon {
    width: 46px;
    padding: 0;
    color: rgba(250, 246, 239, .92);
}
body.elegance .navbar--siamo .nav-pill--icon svg { display: block; }

/* Force hamburger visible on all viewports (override legacy mobile-only rule) */
body.elegance .navbar--siamo .nav-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}
/* Hamburger inside pill */
body.elegance .navbar--siamo .nav-burger {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    width: 20px; height: 14px;
    background: transparent !important;
}
body.elegance .navbar--siamo .nav-burger span {
    display: block;
    width: 20px !important;
    height: 1.5px !important;
    min-height: 1.5px !important;
    flex: 0 0 1.5px !important;
    margin: 0 !important;
    background: currentColor !important;
    border-radius: 2px;
    transition: transform .4s cubic-bezier(.2,.8,.2,1), opacity .3s ease, width .4s ease;
}
body.elegance .navbar--siamo .nav-toggle.active .nav-burger span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
body.elegance .navbar--siamo .nav-toggle.active .nav-burger span:nth-child(2) { opacity: 0; }
body.elegance .navbar--siamo .nav-toggle.active .nav-burger span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
/* Hide the burger toggle while the drawer is open (drawer has its own close button) */
body.elegance .navbar--siamo .nav-toggle.active {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Language pill */
body.elegance .navbar--siamo .language-selector,
body.elegance .navbar--siamo .language-dropdown { position: relative; display: inline-block; }
body.elegance .navbar--siamo .language-btn {
    width: 46px;
    padding: 0;
    justify-content: center;
    gap: 0;
}
body.elegance .navbar--siamo .language-btn .language-icon {
    opacity: .95;
}
body.elegance .navbar--siamo .language-menu {
    position: absolute !important;
    top: calc(100% + .62rem);
    left: 0;
    right: auto;
    min-width: 148px;
    background: rgba(24, 8, 6, .97);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(201, 169, 97, .24);
    border-radius: 12px;
    padding: .28rem;
    display: flex;
    flex-direction: column;
    gap: .12rem;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px) scale(.985);
    transform-origin: top left;
    transition: opacity .28s ease, transform .32s cubic-bezier(.2,.8,.2,1), visibility .28s;
    box-shadow: 0 18px 44px -18px rgba(0, 0, 0, .6);
    z-index: 1002;
}
body.elegance .navbar--siamo .language-btn[aria-expanded="true"] + .language-menu,
body.elegance .navbar--siamo .language-dropdown.open .language-menu,
body.elegance .navbar--siamo .language-selector.open .language-menu,
body.elegance .navbar--siamo .language-menu.show {
    opacity: 1; visibility: visible; transform: translateY(0) scale(1);
}
body.elegance .navbar--siamo .language-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .45rem;
    color: rgba(250, 246, 239, .8);
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .61rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    text-decoration: none;
    text-align: left;
    padding: .53rem .62rem;
    border-radius: 9px;
    transition: color .25s ease, background .25s ease;
}
body.elegance .navbar--siamo .language-option::after {
    content: '';
    width: 1.05em;
    text-align: center;
    opacity: 0;
    transform: translateY(-1px);
}
body.elegance .navbar--siamo .language-option:hover,
body.elegance .navbar--siamo .language-option.active {
    color: var(--el-gold-soft);
    background: rgba(201, 169, 97, .1);
}
body.elegance .navbar--siamo .language-option.active::after {
    content: '✓';
    opacity: 1;
}

/* CTA pill — gold accent */
body.elegance .navbar--siamo .nav-pill--cta {
    padding: 0 1.5rem;
    color: var(--el-gold-soft);
    border-color: rgba(201, 169, 97, .5);
    letter-spacing: .24em;
    font-weight: 500;
    position: relative;
    overflow: hidden;
}
body.elegance .navbar--siamo .nav-pill--cta > span { position: relative; z-index: 2; }
body.elegance .navbar--siamo .nav-pill--cta::before {
    content: '';
    position: absolute; inset: 0; z-index: 1;
    background: var(--el-gold-soft);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .55s cubic-bezier(.2,.8,.2,1);
}
body.elegance .navbar--siamo .nav-pill--cta:hover { color: #1c0604; border-color: var(--el-gold-soft); transform: translateY(-1px); }
body.elegance .navbar--siamo .nav-pill--cta:hover::before { transform: scaleX(1); }

/* Side drawer panel (white, slides from left) */
body.elegance .navbar--siamo .nav-drawer {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: clamp(300px, 30vw, 392px) !important;
    max-width: 90vw !important;
    height: 100svh !important;
    min-height: 100vh !important;
    background: var(--el-porcelain);
    color: var(--el-burgundy);
    display: flex !important;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-100%);
    transition: transform .55s cubic-bezier(.16,1,.3,1), opacity .4s ease, visibility .55s, box-shadow .55s ease;
    box-shadow: 0 0 0 0 rgba(12, 3, 2, 0);
    z-index: 1000;
    overflow-y: auto;
}
body.elegance .navbar--siamo .nav-drawer.active {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    box-shadow: 0 0 0 100vmax rgba(12, 3, 2, .52);
}

/* Header */
body.elegance .navbar--siamo .nav-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: clamp(1.5rem, 3vw, 2.1rem) clamp(1.4rem, 3vw, 1.9rem) 1.2rem;
    border-bottom: 1px solid rgba(40, 6, 3, .1);
}
body.elegance .navbar--siamo .nav-drawer__title {
    font-family: var(--el-display), 'Cormorant Garamond', serif;
    font-size: 1.55rem;
    font-weight: 500;
    letter-spacing: .01em;
    color: var(--el-burgundy);
}
body.elegance .navbar--siamo .nav-drawer__close {
    width: 38px; height: 38px;
    border-radius: 50%;
    border: 1px solid rgba(40, 6, 3, .16);
    background: transparent;
    color: var(--el-burgundy);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .3s ease, border-color .3s ease, transform .4s var(--el-ease-out);
}
body.elegance .navbar--siamo .nav-drawer__close:hover {
    background: rgba(40, 6, 3, .06);
    border-color: var(--el-gold);
    transform: rotate(90deg);
}

/* List */
body.elegance .navbar--siamo .nav-drawer__list {
    list-style: none;
    margin: 0;
    padding: 1rem .8rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .15rem;
}
body.elegance .navbar--siamo .nav-drawer__list li {
    margin: 0;
    width: 100%;
}

/* Rows */
body.elegance .navbar--siamo .nav-drawer .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    padding: .9rem 1rem;
    width: 100%;
    border: none;
    border-bottom: none;
    border-radius: 12px;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .82rem;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--el-burgundy);
    text-decoration: none;
    opacity: 1;
    transition: background .3s ease, color .3s ease;
}
body.elegance .navbar--siamo .nav-drawer .nav-link::after { content: none; display: none; }
body.elegance .navbar--siamo .nav-drawer .nav-link:hover {
    background: rgba(184, 146, 74, .12);
    color: var(--el-gold);
}
body.elegance .navbar--siamo .nav-drawer .nav-link.active {
    background: rgba(184, 146, 74, .14);
    color: var(--el-gold);
}
body.elegance .navbar--siamo .nav-link__icon {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 20px;
    width: 20px;
    color: var(--el-gold);
}
body.elegance .navbar--siamo .nav-link__text {
    line-height: 1;
    text-align: left;
}


/* ============================================================
   HERO SIAMO — centered wordmark, split footer (left text / right CTAs)
   ============================================================ */
body.elegance .el-hero--siamo .el-hero__inner {
    justify-content: center;
    align-items: center;
    padding-bottom: clamp(8rem, 16vh, 12rem);
    max-width: 1620px;
}

/* Wordmark — left aligned inside foot-left */
body.elegance .el-hero--siamo .el-hero__brand {
    margin: 0 0 1.4rem;
    text-align: left;
}body.elegance .el-hero--siamo .el-hero__brand-mark {
    width: clamp(220px, 26vw, 400px);
    margin: 0;
}
body.elegance .el-hero--siamo .el-hero__brand::before {
    -webkit-mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') left center/contain no-repeat !important;
            mask: url('../Brandbox/Logotype/Mare-Logotype-1.png') left center/contain no-repeat !important;
}

/* Footer row pinned to bottom */
body.elegance .el-hero--siamo .el-hero__foot {
    position: absolute;
    left: 0; right: 0;
    bottom: clamp(2.4rem, 6vh, 4.2rem);
    width: 100%;
    max-width: 1620px;
    margin: 0 auto;
    padding: 0 clamp(1.4rem, 5vw, 5rem);
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
    animation: el-fade-up 1.5s cubic-bezier(.16,1,.3,1) .35s both;
}

/* Left block */
body.elegance .el-hero--siamo .el-hero__foot-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    max-width: 620px;
}
body.elegance .el-hero--siamo .el-hero__eyebrow {
    display: inline-flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    align-items: center;
    gap: .55rem;
    font-family: var(--el-sans), 'Inter', sans-serif;
    font-size: .64rem;
    font-weight: 400;
    letter-spacing: .34em;
    text-transform: uppercase;
    color: rgba(250, 246, 239, .8);
    margin: 0 0 1rem;
}
body.elegance .el-hero--siamo .el-hero__eyebrow-star {
    color: var(--el-gold-soft);
    font-size: .6rem;
}
body.elegance .el-hero--siamo .el-hero__headline {
    font-family: var(--el-serif), 'Cormorant Garamond', Georgia, serif;
    font-weight: 500;
    font-size: clamp(1.7rem, 3.4vw, 2.9rem);
    line-height: 1.1;
    letter-spacing: .005em;
    color: var(--el-porcelain);
    margin: 0 0 .5rem;
}
body.elegance .el-hero--siamo .el-hero__subline {
    font-family: var(--el-serif), 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-weight: 300;
    font-size: clamp(1.05rem, 1.6vw, 1.4rem);
    line-height: 1.5;
    color: rgba(250, 246, 239, .82);
    margin: 0;
}

/* CTA row under the subline (left block) */
body.elegance .el-hero--siamo .el-hero__foot-left .el-hero__cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 2rem;
}
body.elegance .el-hero--siamo .el-hero__foot-left .el-hero__cta {
    white-space: nowrap;
}

/* Right block — two outline buttons */
body.elegance .el-hero--siamo .el-hero__foot-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.4rem;
    flex-shrink: 0;
}
body.elegance .el-hero--siamo .el-hero__photo {
    position: relative;
    margin: 1.8rem 0 0;
    width: clamp(260px, 25vw, 380px);
    aspect-ratio: 16 / 10;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(8, 2, 1, .5);
}
body.elegance .el-hero--siamo .el-hero__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 1s var(--el-ease-out);
}
body.elegance .el-hero--siamo .el-hero__photo:hover img { transform: scale(1.04); }
/* Hairline gold edge */
body.elegance .el-hero--siamo .el-hero__photo::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid rgba(201, 169, 97, .55);
    border-radius: 14px;
    pointer-events: none;
    z-index: 2;
}
body.elegance .el-hero--siamo .el-hero__photo-frame { display: none; }
body.elegance .el-hero--siamo .el-hero__foot-right .el-hero__cta-row {
    display: flex;
    gap: 1rem;
    width: 100%;
}
body.elegance .el-hero--siamo .el-hero__foot-right .el-hero__cta {
    flex: 1;
    white-space: nowrap;
    justify-content: center;
    text-align: center;
}

/* Mobile */
@media (max-width: 880px) {
    body.elegance .navbar--siamo .language-menu {
        position: absolute !important;
        top: calc(100% + .46rem) !important;
        left: 0 !important;
        right: auto !important;
        transform-origin: top left;
        min-width: 136px;
        max-width: none;
        border-radius: 11px;
    }
    body.elegance .navbar--siamo .language-option {
        font-size: .58rem;
        letter-spacing: .13em;
        padding: .5rem .58rem;
    }
    body.elegance .el-hero--siamo .el-hero__eyebrow {
        font-size: .5rem;
        letter-spacing: .14em;
        gap: .35rem;
        max-width: 100%;
    }
    body.elegance .el-hero--siamo .el-hero__eyebrow-star { font-size: .46rem; }
    body.elegance .el-hero--siamo .el-hero__brand-mark { width: clamp(190px, 52vw, 300px); }
    body.elegance .el-hero--siamo .el-hero__inner {
        padding-bottom: clamp(13rem, 38vh, 20rem);
    }
    body.elegance .el-hero--siamo .el-hero__foot {
        flex-direction: column;
        align-items: flex-start;
        bottom: clamp(2rem, 5vh, 3rem);
        gap: 1.6rem;
    }
    body.elegance .el-hero--siamo .el-hero__foot-right {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }
    body.elegance .el-hero--siamo .el-hero__photo {
        width: clamp(260px, 82vw, 420px);
    }
    body.elegance .el-hero--siamo .el-hero__foot-right .el-hero__cta-row {
        flex-direction: column;
        width: 100%;
    }
    body.elegance .el-hero--siamo .el-hero__foot-right .el-hero__cta {
        text-align: center;
        justify-content: center;
    }
}

/* ============================================================ */
/*  PAGE HEADER (interior pages)                                 */
/* ============================================================ */
body.elegance .el-pagehead {
    position: relative;
    min-height: clamp(46vh, 60vh, 640px);
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    background: var(--el-burgundy);
}
body.elegance .el-pagehead__media {
    position: absolute;
    inset: 0;
    z-index: 0;
}
body.elegance .el-pagehead__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.06);
    filter: saturate(1.02);
}
body.elegance .el-pagehead__veil {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(20,4,3,.46) 0%, rgba(20,4,3,.12) 34%, rgba(20,4,3,.62) 78%, rgba(20,4,3,.86) 100%);
}
body.elegance .el-pagehead__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 clamp(1.4rem, 5vw, 4rem) clamp(3rem, 7vh, 5rem);
}
body.elegance .el-pagehead__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    color: var(--el-gold-soft);
    font-family: 'Source Sans Pro', sans-serif;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .42em;
    text-transform: uppercase;
    margin-bottom: 1.1rem;
}
body.elegance .el-pagehead__eyebrow::before {
    content: '';
    width: clamp(28px, 6vw, 52px);
    height: 1px;
    background: var(--el-gold-soft);
    opacity: .8;
}
body.elegance .el-pagehead__title {
    font-family: 'Playfair Display', serif;
    color: var(--el-porcelain);
    font-weight: 400;
    line-height: .98;
    font-size: clamp(2.8rem, 8vw, 6rem);
    margin: 0;
    letter-spacing: -0.01em;
}
body.elegance .el-pagehead__title em {
    font-style: italic;
    color: var(--el-gold-soft);
}
body.elegance .el-pagehead__sub {
    margin: 1.3rem 0 0;
    color: rgba(250,246,239,.82);
    font-family: 'Source Sans Pro', sans-serif;
    font-size: clamp(1rem, 1.6vw, 1.18rem);
    font-weight: 300;
    max-width: 46ch;
    line-height: 1.6;
}

/* ============================================================ */
/*  MENU INDEX — clear, tappable cards                          */
/* ============================================================ */
body.elegance .el-menuindex { background: var(--el-cream) !important; color: var(--el-ink); }
body.elegance .el-menuindex__head {
    text-align: center;
    max-width: 920px;
    margin: 0 auto clamp(2.6rem, 5vh, 4rem);
}
body.elegance .el-menuindex .el-eyebrow.dark { color: var(--el-burgundy); }
body.elegance .el-menuindex__head .el-title {
    color: var(--el-ink);
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: clamp(1.5rem, 3.4vw, 2.7rem);
    line-height: 1.1;
    white-space: nowrap;
}
body.elegance .el-menuindex__head .el-title em {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-style: italic !important;
}
body.elegance .el-menuindex__head .el-title .el-word {
    line-height: 1.18;
    padding-bottom: .12em;
}
body.elegance .el-menuindex__head .el-title .el-word__in {
    line-height: 1.18;
}
body.elegance .el-menuindex__head .el-title em { color: var(--el-gold); }
@media (max-width: 600px) {
    body.elegance .el-menuindex__head .el-title {
        white-space: normal;
        font-size: clamp(1.6rem, 8vw, 2.1rem);
        line-height: 1.18;
    }
    body.elegance .el-menuindex__head .el-title .el-word { padding-bottom: 0; }
}
body.elegance .el-menuindex__intro {
    margin: 1.3rem auto 0;
    color: var(--el-ink-mute);
    font-family: 'Source Sans Pro', sans-serif;
    font-size: clamp(1rem, 1.4vw, 1.12rem);
    font-weight: 300;
    line-height: 1.7;
    max-width: 50ch;
}
body.elegance .el-menugrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(1.4rem, 2.6vw, 2.2rem);
}
body.elegance .el-menucard {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1.5px solid var(--el-burgundy);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 6px 24px rgba(40,6,3,.05);
    transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s, border-color .4s;
}
body.elegance .el-menucard:hover,
body.elegance .el-menucard:focus-visible {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(40,6,3,.16);
    border-color: var(--el-gold);
    outline: none;
}
body.elegance .el-menucard__media {
    position: relative;
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: var(--el-cream);
}
body.elegance .el-menucard__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 1.1s cubic-bezier(.2,.8,.2,1);
}
body.elegance .el-menucard:hover .el-menucard__media img { transform: scale(1.06); }
body.elegance .el-menucard__badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .26em;
    text-transform: uppercase;
    color: var(--el-porcelain);
    background: rgba(20,4,3,.46);
    backdrop-filter: blur(6px);
    padding: .42rem .85rem;
    border-radius: 999px;
    border: 1px solid rgba(201,169,97,.5);
}
body.elegance .el-menucard__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: clamp(1.4rem, 2.4vw, 1.9rem);
    text-align: left;
}
body.elegance .el-menucard__title {
    font-family: 'Playfair Display', serif;
    font-weight: 400;
    color: var(--el-ink);
    font-size: clamp(1.5rem, 2.4vw, 1.9rem);
    line-height: 1.1;
    margin: 0 0 .7rem;
}
body.elegance .el-menucard__desc {
    color: var(--el-ink-mute);
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.6;
    margin: 0 0 1.6rem;
}
body.elegance .el-menucard__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    margin-top: auto;
    width: 100%;
    padding: .9rem 1.2rem;
    background: var(--el-burgundy);
    color: var(--el-porcelain);
    border-radius: 999px;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    transition: background .35s, gap .35s;
}
body.elegance .el-menucard__cta svg {
    width: 18px;
    height: 18px;
    transition: transform .35s;
}
body.elegance .el-menucard:hover .el-menucard__cta {
    background: var(--el-gold);
    gap: .85rem;
}
body.elegance .el-menucard:hover .el-menucard__cta svg { transform: translateX(4px); }
body.elegance .el-menuindex__foot {
    text-align: center;
    margin-top: clamp(2.6rem, 5vh, 4rem);
}

@media (max-width: 900px) {
    body.elegance .el-menugrid { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; }
    body.elegance .el-menucard__media { aspect-ratio: 16 / 10; }
}
