/* WordPress and native-dialog integration. The three reference stylesheets stay intact. */
.dci-dialog { position: fixed; inset: 0 0 0 auto; margin: 0; height: 100dvh; max-height: 100dvh; border: 0; border-left: 1px solid currentColor; gap: 16px; font-size: 14px; line-height: calc(20 / 14); box-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a; }
.dci-dialog:not([open]) { display: none; }
.dci-dialog[open] { display: flex; flex-direction: column; }
.dci-dialog::backdrop { background: rgb(0 0 0 / 10%); backdrop-filter: blur(4px); }
.dci-dialog > p:last-child { margin-top: auto; }
.dci-editorial h1 { margin-bottom: 48px; }
.dci-editorial article { margin-block: 50px; }
.dci-editorial p { margin-bottom: 24px; }
.dci-editorial img { max-width: 100%; height: auto; }
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }


/* ============================================================
   Diamond Modern Layer — sept. 2026
   Raffinement visuel global, sans toucher aux feuilles de
   reference. Chargee en dernier : ces regles priment.
   ============================================================ */

/* --- 1. Confort de lecture --- */
::selection { background: rgba(210, 183, 127, .30); color: #fff8e8; }

.intro-copy p,
.detail-intro p,
.contact-layout p,
.dci-contact-panel p { text-align: left; hyphens: none; }

.image-footnote,
.card-index,
.form-note,
.member-notice,
.footer-bottom,
.quiet-signature,
.caption-bottom { font-size: 12px; letter-spacing: .05em; }

.eyebrow { letter-spacing: .24em; }

/* --- 2. En-tete : verre depoli --- */
.site-header {
    background: linear-gradient(110deg, rgba(23,23,19,.82), rgba(12,14,13,.82) 55%);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    backdrop-filter: blur(14px) saturate(1.2);
}

/* --- 4. Boutons : lift + halo --- */
.button { will-change: transform; }
.button:hover, .button:focus-visible { transform: translateY(-2px); }
.button:active { transform: translateY(0); }
.button-light:hover, .button-light:focus-visible {
    box-shadow: inset 0 1px #fff4d6, 0 14px 40px rgba(181,145,67,.32);
}

/* --- 5. Cartes : profondeur + zoom image --- */
.card-grid > a,
.services-grid > a,
.listing-grid > a,
.image-card,
.journal-section a {
    transition: transform .55s cubic-bezier(.2,.6,.2,1), border-color .4s, box-shadow .55s;
}
.card-grid > a:hover,
.services-grid > a:hover,
.listing-grid > a:hover,
.image-card:hover,
.journal-section a:hover {
    transform: translateY(-6px);
    border-color: rgba(210,183,127,.45);
    box-shadow: 0 28px 70px -28px rgba(210,183,127,.28), 0 18px 50px -20px rgba(0,0,0,.6);
}
.card-visual, .campaign-image, .image-card, .gallery-item { overflow: hidden; }
.card-visual img, .campaign-image img, .image-card img, .gallery-image img, .editorial-image img {
    transition: transform 1.1s cubic-bezier(.2,.6,.2,1), filter .8s;
    will-change: transform;
}
a:hover .card-visual img,
a:hover .campaign-image img,
.image-card:hover img,
.gallery-item:hover .gallery-image img,
.editorial-image:hover img { transform: scale(1.05); }

.card-arrow { transition: background .35s, color .35s, transform .35s, border-color .35s; }
a:hover .card-arrow {
    background: var(--gold-metal);
    color: #1c1a14;
    border-color: transparent;
    transform: translate(4px, -4px);
}

/* --- 6. Formulaires : focus or --- */
.field input, .field textarea, .field select,
.contact-form input, .contact-form textarea, .contact-form select,
.request-summary input, .request-summary textarea {
    transition: border-color .3s, box-shadow .3s, background .3s;
}
.field :is(input, textarea, select):focus-visible,
.contact-form :is(input, textarea, select):focus-visible {
    outline: none;
    border-color: var(--champagne);
    box-shadow: 0 0 0 3px rgba(210, 183, 127, .18);
}

/* --- 7. Revelation douce au scroll (amelioration progressive) --- */
@keyframes dci-reveal {
    from { opacity: 0; transform: translateY(26px); }
    to   { opacity: 1; transform: none; }
}
@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
        .intro-section, .listing-section, .journal-section,
        .destination-section, .editorial, .membership-banner,
        .contact-cta, .destination-highlights, .experience-pair {
            animation: dci-reveal linear both;
            animation-timeline: view();
            animation-range: entry 0% entry 35%;
        }
    }
}

/* --- 8. Barre de defilement discrete --- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0d0e0e; }
::-webkit-scrollbar-thumb { background: #2e2c26; border-radius: 6px; border: 2px solid #0d0e0e; }
::-webkit-scrollbar-thumb:hover { background: #a9884f; }

/* --- 9. Focus visible accessible --- */
:focus-visible { outline: 1px solid rgba(210,183,127,.7); outline-offset: 3px; }


/* Complements plancher de lisibilite (hero) */
.hero-signature, .hero-bottom, .hero-explore { font-size: 12px; letter-spacing: .18em; }


/* --- 10. Menu plein ecran + nav etendue --- */
@media (max-width: 900px) {
    .mobile-menu {
        width: 100% !important;
        max-width: none !important;
        border-left: 0 !important;
        padding: 70px 34px 42px !important;
        background: radial-gradient(at 82% -5%, rgba(172,129,72,.10), transparent 45%), #0b0d0c !important;
    }
    .mobile-menu nav { gap: 2px; margin-top: 46px; }
    .mobile-menu nav a {
        font-size: clamp(30px, 8vw, 42px);
        padding: 14px 0;
        border-bottom-color: var(--gold-line);
        transition: color .3s, padding-left .35s;
    }
    .mobile-menu nav a:hover, .mobile-menu nav a:focus-visible { color: var(--champagne); padding-left: 12px; }
    .mobile-menu p { font-size: 14px; letter-spacing: .2em; text-transform: uppercase; }
}
@media (min-width: 901px) {
    .desktop-nav { flex: 1; justify-content: center; }
}



/* --- 11. Encadre guide de la demande personnalisee --- */
.dci-request-points {
    margin: 36px 0 6px;
    padding: 28px 30px;
    border: 1px solid rgb(211 185 136 / 24%);
    border-radius: 12px;
    background: linear-gradient(145deg, rgb(211 185 136 / 6%), rgb(255 255 255 / 1%));
}
.dci-request-points .eyebrow { text-align: left; margin: 0 0 18px; }
.dci-request-points ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 13px; }
.dci-request-points li {
    position: relative;
    padding-left: 24px;
    font-size: 15px;
    line-height: 1.7;
    color: #d6d3c9;
    text-align: left;
}
.dci-request-points li::before {
    content: "\25C6";
    position: absolute; left: 0; top: 4px;
    font-size: 8px;
    color: var(--champagne);
}
.dci-request-points strong { color: #e8d2a6; font-weight: 600; }
.dci-request-reply {
    margin: 28px 0 0;
    padding-left: 20px;
    border-left: 1px solid var(--gold-line);
    font-family: var(--font-display);
    font-style: italic;
    font-size: 20px;
    line-height: 1.6;
    color: #e2c58e;
    text-align: left;
}
@media (max-width: 700px) {
    .dci-request-points { padding: 24px 22px; }
    .dci-request-reply { font-size: 18px; }
}

/* 12. Expériences — descriptions des cartes activités */
.card-caption .card-desc{margin-top:.4em;font-size:.92em;line-height:1.6;opacity:.78;max-width:46ch;font-weight:400}
.image-card:hover .card-caption .card-desc{opacity:.92}

/* 13. Simulateur — puces de selection (prestations, enveloppe) */
.dci-chip-group{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:2px}
@media (max-width:900px){.dci-chip-group{grid-template-columns:repeat(2,1fr)}}
.dci-chip{appearance:none;border:1px solid var(--gold-line,#d3b27047);border-radius:999px;padding:13px 10px;text-align:center;font-size:13px;letter-spacing:.02em;font-family:inherit;color:var(--ivory,#f0ece3);background:rgba(255,255,255,.02);cursor:pointer;transition:border-color .25s,background .25s,color .25s,transform .25s,box-shadow .25s;user-select:none}
.dci-chip:hover{border-color:var(--champagne,#d2b77f);transform:translateY(-2px)}
.dci-chip.is-on{background:linear-gradient(135deg,var(--gold-light,#f2dfb5),var(--champagne,#d2b77f));color:#151515;border-color:transparent;font-weight:600;box-shadow:0 6px 18px rgba(210,183,127,.22)}
.dci-chip:focus-visible{outline:2px solid var(--champagne,#d2b77f);outline-offset:2px}
.dci-chip-group-wrap{}

/* 14. Contact — mini formulaire dans le panneau */
.contact-form-mini{gap:20px;margin-top:14px}
.contact-form-mini .dci-chip-group{grid-template-columns:repeat(2,1fr);gap:8px}
.contact-form-mini .dci-chip{padding:11px 8px;font-size:12.5px}
.contact-form-mini .button{justify-self:start}

/* 15. Logo — emblème diamant or */
.brand{display:inline-flex;align-items:center;gap:13px;text-decoration:none}
.brand-emblem{height:42px;width:auto;display:block;flex:none;filter:drop-shadow(0 2px 8px rgba(0,0,0,.4));transition:transform .35s ease}
.brand:hover .brand-emblem{transform:scale(1.06) rotate(-2deg)}
@media (max-width:1100px){.brand-emblem{height:36px}}
.footer-brand{display:inline-flex;flex-direction:column;align-items:flex-start;gap:14px;text-decoration:none}
.footer-emblem{height:58px;width:auto;display:block;filter:drop-shadow(0 3px 10px rgba(0,0,0,.45))}
.footer-contact-line{margin-top:10px}
.footer-contact-line a{color:var(--champagne,#d2b77f);text-decoration:none;border-bottom:1px solid var(--gold-line,#d3b27047);padding-bottom:2px;transition:border-color .3s,color .3s}
.footer-contact-line a:hover{color:var(--gold-light,#f2dfb5);border-color:var(--gold-light,#f2dfb5)}
