/* =========================================================
   Thème B — « Nuit Lavande » : sombre, chic, cadres dorés,
   ciel étoilé en fond (dessiné en CSS, aucune image).
   ========================================================= */
:root {
    --bg: #1c1426;
    --bg-alt: #211830;
    --surface: #251b33;
    --surface-2: #2e2240;
    --text: #ece4f7;
    --text-soft: #b8abc9;
    --heading: #f6f1fc;
    --accent: #c9b6f5;
    --accent-hover: #dccdfa;
    --on-accent: #1c1426;
    --accent-2: #d9bc8c;
    --border: rgba(217, 188, 140, .22);
    --focus: #d9bc8c;

    --font-display: "Playfair Display", Georgia, serif;
    --font-script: "Parisienne", cursive;
    --font-body: "Montserrat", system-ui, sans-serif;
    --display-weight: 500;
    --script-size: clamp(1.8rem, 1.4rem + 1.2vw, 2.5rem);

    --radius: 6px;
    --radius-lg: 10px;
    --radius-btn: 999px;
    --shadow: 0 14px 40px rgba(0, 0, 0, .35);
    --header-bg: rgba(28, 20, 38, .82);
}

body.theme-nuit { font-size: .97rem; }
.theme-nuit .site-nav a { text-transform: uppercase; font-size: .76rem; letter-spacing: .16em; }

/* --- Ciel étoilé : trois couches de points scintillants --- */
.theme-nuit .hero::before,
.theme-nuit .hero::after {
    content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
    background-repeat: repeat;
}
.theme-nuit .hero::before {
    background-image:
        radial-gradient(1px 1px at 20px 30px, #fff, transparent),
        radial-gradient(1px 1px at 120px 80px, rgba(255, 255, 255, .8), transparent),
        radial-gradient(1.5px 1.5px at 200px 150px, #d9bc8c, transparent),
        radial-gradient(1px 1px at 60px 190px, rgba(255, 255, 255, .7), transparent),
        radial-gradient(1px 1px at 260px 40px, rgba(201, 182, 245, .9), transparent);
    background-size: 300px 220px;
    opacity: .55;
}
.theme-nuit .hero::after {
    background-image:
        radial-gradient(1.5px 1.5px at 90px 120px, #fff, transparent),
        radial-gradient(2px 2px at 310px 60px, rgba(217, 188, 140, .9), transparent),
        radial-gradient(1px 1px at 180px 260px, #fff, transparent);
    background-size: 420px 320px;
    animation: twinkle 5s ease-in-out infinite alternate;
}
@keyframes twinkle { from { opacity: .25; } to { opacity: .85; } }
.theme-nuit .hero { background: radial-gradient(ellipse 80% 60% at 75% 40%, rgba(201, 182, 245, .14), transparent 70%); }
.theme-nuit .hero-inner { position: relative; z-index: 1; }

.theme-nuit .hero-title { font-weight: 500; }
.theme-nuit .hero-title::first-line { font-style: italic; }

/* --- Cadres dorés : filet fin décalé autour des photos --- */
.theme-nuit .frame::before {
    content: ""; position: absolute; inset: -14px; z-index: 0;
    border: 1px solid var(--accent-2); border-radius: calc(var(--radius-lg) + 8px);
    pointer-events: none;
}
.theme-nuit .frame > * { position: relative; z-index: 1; }
.theme-nuit .hero-media .frame::after {
    content: ""; position: absolute; inset: -26px; z-index: 0;
    border: 1px solid rgba(217, 188, 140, .35); border-radius: calc(var(--radius-lg) + 16px);
    pointer-events: none;
}
.theme-nuit .frame-sm::before { inset: -6px; border-color: rgba(217, 188, 140, .45); border-radius: calc(var(--radius-lg) + 2px); }
.theme-nuit .frame-arch::before { border-radius: 999px 999px calc(var(--radius-lg) + 8px) calc(var(--radius-lg) + 8px); }
.theme-nuit .hero-media, .theme-nuit .about-media { padding: 26px; }

/* --- Sections alternées --- */
.theme-nuit .packages, .theme-nuit .about { background: var(--bg-alt); }
.theme-nuit .section-head::after {
    content: "✦"; display: block; margin-top: 1.2rem; color: var(--accent-2); font-size: .9rem; letter-spacing: 1em;
}

/* --- Cartes --- */
.theme-nuit .card { background: linear-gradient(180deg, var(--surface), #20172c); border-color: var(--border); }
.theme-nuit .service-card { padding: 14px; transition: transform .35s, border-color .35s; }
.theme-nuit .service-card:hover { transform: translateY(-4px); border-color: rgba(217, 188, 140, .55); }
.theme-nuit .card-title { font-style: italic; }
.theme-nuit .package-card.is-highlighted {
    border-color: var(--accent-2);
    box-shadow: 0 0 0 1px var(--accent-2), 0 20px 50px rgba(217, 188, 140, .12);
}
.theme-nuit .price-value { font-style: italic; }

/* --- Boutons : primaire lavande, secondaire filet doré --- */
.theme-nuit .btn { text-transform: uppercase; font-size: .78rem; letter-spacing: .16em; }
.theme-nuit .btn-ghost { color: var(--accent-2); border-color: rgba(217, 188, 140, .6); }
.theme-nuit .btn-ghost:hover { background: rgba(217, 188, 140, .1); border-color: var(--accent-2); }
.theme-nuit .btn-primary { box-shadow: 0 0 28px rgba(201, 182, 245, .25); }

.theme-nuit .filter { color: var(--text-soft); border-color: var(--border); }
.theme-nuit .filter[aria-pressed="true"] { color: var(--on-accent); }

.theme-nuit .field input, .theme-nuit .field select, .theme-nuit .field textarea {
    background: rgba(28, 20, 38, .7); color-scheme: dark; border-color: rgba(201, 182, 245, .2);
}
.theme-nuit .site-footer { background: #160f1f; }