/* ==========================================================================
   SB MASSAGE — Thème WordPress · Système de design luxe (vanilla CSS)
   --------------------------------------------------------------------------
   Réplique exacte de la maquette de référence (tokens --sb-*).
   Ivoire · crème · champagne · sable · or · espresso · charbon.
   Typographies : Cormorant Garamond (titres) · Manrope (texte).
   Mobile-first — breakpoints : sm 640 / md 768 / lg 1024 / xl 1280 / 2xl 1536.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens & base
   -------------------------------------------------------------------------- */

:root {
        --sb-ivory: #faf7f1;        /* fond principal — ivoire chaud */
        --sb-cream: #f3ecdf;        /* fond alternatif — crème */
        --sb-champagne: #e7dcc6;    /* bordures, accents doux */
        --sb-sand: #cbb896;         /* accent profond — sable */
        --sb-gold: #b3924f;         /* or champagne (éléments graphiques) */
        --sb-gold-deep: #8a6d3b;    /* or foncé (petits textes, contraste AA) */
        --sb-espresso: #2a2118;     /* sections sombres, titres */
        --sb-espresso-2: #342a1e;   /* espresso éclairci (cartes sombres) */
        --sb-charcoal: #1b1510;     /* footer — charbon */
        --sb-ink-soft: #6b5f4f;     /* texte secondaire sur clair */
        --sb-ivory-soft: #d9cfbc;   /* texte secondaire sur sombre */
        --sb-wa: #25d366;           /* vert WhatsApp */
        --sb-wa-deep: #1faa53;      /* vert WhatsApp foncé */

        --sb-font-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
        --sb-font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

        --sb-container: 80rem;      /* 1280px */
        --sb-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
        --sb-header-h: 5rem;        /* hauteur header non défilé */
        --sb-header-h-scrolled: 4rem;
}

html {
        scroll-behavior: smooth;
        scroll-padding-top: calc(var(--sb-header-h) + 1.5rem);
}

body {
        margin: 0;
        background: var(--sb-ivory);
        color: var(--sb-espresso);
        font-family: var(--sb-font-sans);
        font-size: 15px;
        font-weight: 300;
        line-height: 1.65;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        overflow-x: hidden; /* garde — aucune mise en page ne devrait déborder */
}

img,
video {
        max-width: 100%;
        height: auto;
}

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

/* Titres globaux (Gutenberg) */
h1, h2, h3, h4, h5, h6 {
        font-family: var(--sb-font-serif);
        font-weight: 500;
        line-height: 1.15;
        color: inherit;
        margin: 0 0 0.6em;
}

p {
        margin: 0 0 1em;
}

a {
        color: var(--sb-gold-deep);
        text-decoration: none;
        transition: color 0.3s ease;
}

a:hover {
        color: var(--sb-espresso);
}

/* Focus visible accessible et discret */
:focus-visible {
        outline: 2px solid var(--sb-gold);
        outline-offset: 3px;
        border-radius: 2px;
}

/* Lien d'évitement */
.sb-skip-link {
        position: absolute;
        left: 1rem;
        top: -4rem;
        z-index: 200;
        background: var(--sb-espresso);
        color: var(--sb-ivory);
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        padding: 0.75rem 1.25rem;
        transition: top 0.3s ease;
}
.sb-skip-link:focus {
        top: 1rem;
        color: var(--sb-ivory);
}

/* Utilitaires */
.sr-only,
.screen-reader-text {
        position: absolute !important;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
}

.sb-serif { font-family: var(--sb-font-serif); }
.sb-sans  { font-family: var(--sb-font-sans); }

.sb-container {
        max-width: var(--sb-container);
        margin-inline: auto;
        padding-inline: 1.25rem;
}
@media (min-width: 640px) {
        .sb-container { padding-inline: 2rem; }
}

.sb-section {
        position: relative;
        padding-block: 5rem;
        overflow: hidden;
}
@media (min-width: 640px) {
        .sb-section { padding-block: 7rem; }
}

.sb-section--ivory   { background: var(--sb-ivory); }
.sb-section--cream   { background: var(--sb-cream); }
.sb-section--espresso{ background: var(--sb-espresso); }
.sb-section--charcoal{ background: var(--sb-charcoal); }

/* Filet champagne avec lotus (séparateur de section) */
.sb-divider {
        display: flex;
        align-items: center;
        gap: 1rem;
        color: var(--sb-gold);
        width: 10rem;
}
.sb-divider::before,
.sb-divider::after {
        content: "";
        height: 1px;
        flex: 1;
        background: linear-gradient(90deg, transparent, var(--sb-champagne) 20%, var(--sb-champagne) 80%, transparent);
}
.sb-divider__lotus {
        width: 22px;
        height: auto;
        opacity: 0.8;
        flex: 0 0 auto;
}

/* En-tête de section éditorial */
.sb-section-head {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        max-width: 42rem;
        margin-inline: auto;
        text-align: center;
        align-items: center;
}
.sb-section-head--left {
        text-align: left;
        align-items: flex-start;
        margin-inline: 0;
}
.sb-section-head__text {
        font-size: 15px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
        max-width: 40rem;
}
.sb-section-head--dark .sb-section-head__text { color: var(--sb-ivory-soft); }

/* Sur-titre espacé */
.sb-eyebrow {
        font-family: var(--sb-font-sans);
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.32em;
        color: var(--sb-gold-deep);
        margin: 0;
}
.sb-eyebrow--sand { color: var(--sb-sand); }

/* Grand titre serif de section */
.sb-title {
        font-family: var(--sb-font-serif);
        font-size: 1.875rem;
        font-weight: 500;
        line-height: 1.15;
        margin: 0;
}
@media (min-width: 640px) { .sb-title { font-size: 2.25rem; } }
@media (min-width: 1024px) { .sb-title { font-size: 2.75rem; } }

/* Ancre cible pour scroll-padding */
.sb-anchor {
        display: block;
        position: absolute;
        top: -6rem;
        left: 0;
}

/* --------------------------------------------------------------------------
   2. Boutons
   -------------------------------------------------------------------------- */

.sb-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.75rem;
        font-family: var(--sb-font-sans);
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        padding: 0.875rem 1.75rem;
        border: 1px solid transparent;
        cursor: pointer;
        text-decoration: none;
        white-space: nowrap;
        border-radius: 0;
        transition: color 0.4s ease, border-color 0.4s ease, background-color 0.35s ease, transform 0.3s ease;
}
.sb-btn--lg { padding: 1rem 2.25rem; letter-spacing: 0.22em; }
.sb-btn--sm { padding: 0.5rem 1rem; font-size: 10px; letter-spacing: 0.18em; }
.sb-btn--full { width: 100%; }

/* Bouton or — remplissage progressif */
.sb-btn--gold {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        border-color: var(--sb-gold);
        color: var(--sb-gold);
}
.sb-btn--gold::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(120deg, #c9a45e, #b3924f 55%, #9c7c3f);
        transform: translateY(101%);
        transition: transform 0.45s var(--sb-ease);
}
.sb-btn--gold:hover,
.sb-btn--gold:focus-visible {
        color: var(--sb-espresso);
}
.sb-btn--gold:hover::before,
.sb-btn--gold:focus-visible::before {
        transform: translateY(0);
}

/* Bouton fantôme clair (sur fond sombre) */
.sb-btn--ghost-light {
        border-color: rgba(255, 255, 255, 0.25);
        background: rgba(255, 255, 255, 0.04);
        color: var(--sb-ivory);
}
.sb-btn--ghost-light:hover,
.sb-btn--ghost-light:focus-visible {
        border-color: rgba(255, 255, 255, 0.5);
        background: rgba(255, 255, 255, 0.1);
        color: var(--sb-ivory);
}

/* Bouton fantôme sombre (sur fond clair) */
.sb-btn--ghost-dark {
        border-color: rgba(42, 33, 24, 0.25);
        color: var(--sb-espresso);
}
.sb-btn--ghost-dark:hover,
.sb-btn--ghost-dark:focus-visible {
        border-color: rgba(42, 33, 24, 0.6);
        color: var(--sb-espresso);
}

/* Bouton WhatsApp */
.sb-btn--whatsapp {
        background: var(--sb-wa-deep);
        border-color: var(--sb-wa-deep);
        color: #fff;
}
.sb-btn--whatsapp:hover,
.sb-btn--whatsapp:focus-visible {
        background: #189a47;
        border-color: #189a47;
        color: #fff;
}

/* Bouton contour WhatsApp (alternatif du formulaire) */
.sb-btn--whatsapp-outline {
        border-color: rgba(31, 170, 83, 0.5);
        color: var(--sb-wa-deep);
}
.sb-btn--whatsapp-outline:hover,
.sb-btn--whatsapp-outline:focus-visible {
        background: rgba(31, 170, 83, 0.1);
        color: var(--sb-wa-deep);
}

/* Lien éditorial souligné */
.sb-link {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        font-family: var(--sb-font-sans);
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        color: var(--sb-gold-deep);
}
.sb-link::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -3px;
        height: 1px;
        width: 100%;
        background: currentColor;
        transform: scaleX(0.35);
        transform-origin: left;
        transition: transform 0.45s var(--sb-ease);
}
.sb-link:hover,
.sb-link:focus-visible {
        color: var(--sb-gold-deep);
}
.sb-link:hover::after,
.sb-link:focus-visible::after {
        transform: scaleX(1);
}

/* Groupe de CTA (héro) */
.sb-cta-group {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: 2.5rem;
}
@media (min-width: 640px) {
        .sb-cta-group {
                flex-direction: row;
                align-items: center;
        }
}

/* --------------------------------------------------------------------------
   3. En-tête : bandeau d'annonce + navigation sticky
   -------------------------------------------------------------------------- */

.sb-announcement {
        position: fixed;
        inset-inline: 0;
        top: 0;
        z-index: 50;
        display: none;
        height: 2rem;
        align-items: center;
        justify-content: center;
        background: var(--sb-charcoal);
}
@media (min-width: 768px) {
        .sb-announcement { display: flex; }
}
.sb-announcement__text {
        font-size: 10.5px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.28em;
        color: var(--sb-ivory-soft);
        margin: 0;
        text-align: center;
        padding-inline: 1rem;
}

.sb-site-header {
        position: fixed;
        inset-inline: 0;
        top: 0;
        z-index: 40;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.45), transparent);
        border-bottom: 1px solid transparent;
        transition: background-color 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease, top 0.5s ease;
}
@media (min-width: 768px) {
        .sb-site-header { top: 2rem; }
}
.sb-site-header.is-scrolled {
        background: rgba(42, 33, 24, 0.95);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        border-bottom-color: rgba(255, 255, 255, 0.05);
        box-shadow: 0 10px 40px -15px rgba(20, 14, 8, 0.55);
}

.sb-site-header__inner {
        max-width: var(--sb-container);
        margin-inline: auto;
        padding-inline: 1.25rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: var(--sb-header-h);
        transition: height 0.5s ease;
}
@media (min-width: 640px) {
        .sb-site-header__inner { padding-inline: 2rem; }
}
.sb-site-header.is-scrolled .sb-site-header__inner {
        height: var(--sb-header-h-scrolled);
}

/* Bloc marque : lotus + nom */
.sb-brand {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        color: var(--sb-ivory);
}
.sb-brand:hover { color: var(--sb-ivory); }
.sb-brand__logo img,
.sb-brand__logo .sb-logo__img {
        width: 40px;
        height: auto;
        transition: width 0.5s ease;
        display: block;
}
.is-scrolled .sb-brand__logo img,
.is-scrolled .sb-brand__logo .sb-logo__img {
        width: 34px;
}
.sb-brand__name {
        font-family: var(--sb-font-serif);
        font-size: 19px;
        font-weight: 600;
        letter-spacing: 0.14em;
        color: var(--sb-ivory);
        line-height: 1;
}
.sb-brand__sub {
        margin: 4px 0 0;
        font-size: 8.5px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.34em;
        color: var(--sb-sand);
        line-height: 1;
}

/* Navigation desktop */
.sb-nav {
        display: none;
        align-items: center;
        gap: 1.75rem;
}
@media (min-width: 1024px) {
        .sb-nav { display: flex; }
}
.sb-nav__link {
        position: relative;
        padding-block: 0.5rem;
        font-size: 12.5px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.18em;
        color: rgba(250, 247, 241, 0.85);
}
.sb-nav__link::after {
        content: "";
        position: absolute;
        inset-inline: 0;
        bottom: 0;
        height: 1px;
        background: var(--sb-gold);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.4s var(--sb-ease);
}
.sb-nav__link:hover,
.sb-nav__link:focus-visible {
        color: var(--sb-ivory);
}
.sb-nav__link:hover::after,
.sb-nav__link:focus-visible::after {
        transform: scaleX(1);
}

/* Actions d'en-tête */
.sb-header-actions {
        display: flex;
        align-items: center;
        gap: 0.75rem;
}
@media (min-width: 1024px) {
        .sb-header-actions--mobile { display: none; }
}

.sb-icon-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        background: transparent;
        color: var(--sb-ivory);
        cursor: pointer;
        transition: border-color 0.3s ease, background-color 0.3s ease, color 0.3s ease;
        flex: 0 0 auto;
}
.sb-icon-btn:hover,
.sb-icon-btn:focus-visible {
        border-color: rgba(37, 211, 102, 0.6);
        background: rgba(37, 211, 102, 0.1);
}
.sb-icon-btn--wa { color: var(--sb-wa); }

.sb-icon-btn--burger,
.sb-icon-btn--close { display: inline-flex; }
@media (min-width: 1024px) {
        .sb-icon-btn--burger { display: none; }
}

/* Tiroir mobile plein écran */
.sb-mobile-drawer {
        position: fixed;
        inset: 0;
        z-index: 60;
        display: flex;
        flex-direction: column;
        background: var(--sb-espresso);
        visibility: hidden;
        opacity: 0;
        transition: visibility 0.5s ease, opacity 0.5s ease;
}
.sb-mobile-drawer.is-open {
        visibility: visible;
        opacity: 1;
}
.sb-mobile-drawer__head {
        display: flex;
        height: 5rem;
        align-items: center;
        justify-content: space-between;
        padding-inline: 1.25rem;
        flex: 0 0 auto;
}
.sb-mobile-drawer__brand {
        display: flex;
        align-items: center;
        gap: 0.75rem;
}
.sb-mobile-drawer__brand img { width: 34px; height: auto; display: block; }
.sb-mobile-drawer__brand span {
        font-family: var(--sb-font-serif);
        font-size: 17px;
        font-weight: 600;
        letter-spacing: 0.14em;
        color: var(--sb-ivory);
}
.sb-mobile-drawer__nav {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        justify-content: center;
        gap: 0.25rem;
        padding-inline: 2rem;
}
.sb-mobile-drawer__link {
        display: block;
        padding-block: 1rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        font-family: var(--sb-font-serif);
        font-size: 1.875rem;
        font-weight: 300;
        color: var(--sb-ivory);
        opacity: 0;
        transform: translateY(1rem);
        transition: opacity 0.5s ease, transform 0.5s ease, color 0.3s ease, padding-left 0.3s ease;
}
.sb-mobile-drawer.is-open .sb-mobile-drawer__link {
        opacity: 1;
        transform: translateY(0);
}
.sb-mobile-drawer__link:hover,
.sb-mobile-drawer__link:focus-visible {
        color: var(--sb-sand);
        padding-left: 0.5rem;
}
.sb-mobile-drawer__foot {
        padding: 0 2rem 2.5rem;
}
.sb-mobile-drawer__foot .sb-btn { width: 100%; }
.sb-mobile-drawer__phone {
        margin: 1.25rem 0 0;
        text-align: center;
        font-size: 11px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.22em;
        color: var(--sb-ivory-soft);
}

/* --------------------------------------------------------------------------
   4. Héro plein écran
   -------------------------------------------------------------------------- */

.sb-hero {
        position: relative;
        display: flex;
        min-height: 100svh;
        align-items: center;
        overflow: hidden;
        background: var(--sb-espresso);
}
.sb-hero-media {
        position: absolute;
        inset: 0;
}
.sb-hero-media video {
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0;
        transition: opacity 1s ease;
        display: block;
}
.sb-hero-media video.is-ready { opacity: 1; }
.sb-hero-media__img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
}
/* Voiles espresso pour la lisibilité */
.sb-hero-media::after {
        content: "";
        position: absolute;
        inset: 0;
        background:
                linear-gradient(to bottom, rgba(42, 33, 24, 0.8), rgba(42, 33, 24, 0.45) 50%, rgba(42, 33, 24, 0.85)),
                radial-gradient(ellipse at center, transparent 35%, rgba(26, 19, 11, 0.55) 100%);
}

.sb-hero__watermark { z-index: 1; }

.sb-hero-content {
        position: relative;
        z-index: 10;
        width: 100%;
        max-width: var(--sb-container);
        margin-inline: auto;
        padding: 10rem 1.25rem 7rem;
}
@media (min-width: 640px) {
        .sb-hero-content { padding-inline: 2rem; }
}
@media (min-width: 768px) {
        .sb-hero-content { padding-bottom: 8rem; }
}
.sb-hero-content__inner { max-width: 48rem; }

.sb-hero__eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 0.75rem;
        margin: 0 0 1.5rem;
        font-size: 11px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.34em;
        color: var(--sb-sand);
}
.sb-hero__eyebrow::before {
        content: "";
        width: 2.5rem;
        height: 1px;
        background: rgba(179, 146, 79, 0.7);
}

.sb-hero__title {
        font-family: var(--sb-font-serif);
        font-size: 2.6rem;
        font-weight: 300;
        line-height: 1.08;
        color: var(--sb-ivory);
        margin: 0;
}
@media (min-width: 640px) { .sb-hero__title { font-size: 3.75rem; } }
@media (min-width: 1024px) { .sb-hero__title { font-size: 4.4rem; } }
.sb-hero__title em {
        font-weight: 500;
        font-style: italic;
        color: var(--sb-sand);
}

.sb-hero__subtitle {
        margin: 1.75rem 0 0;
        max-width: 36rem;
        font-size: 15px;
        font-weight: 300;
        line-height: 1.65;
        color: rgba(250, 247, 241, 0.8);
}
@media (min-width: 640px) { .sb-hero__subtitle { font-size: 16px; } }

/* Indicateurs de confiance */
.sb-hero__trust {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.75rem 2rem;
        margin: 3.5rem 0 0;
        padding: 0;
        list-style: none;
}
.sb-hero__trust li {
        font-size: 10.5px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.26em;
        color: rgba(250, 247, 241, 0.6);
}
.sb-hero__trust-dot {
        width: 4px;
        height: 4px;
        border-radius: 999px;
        background: rgba(179, 146, 79, 0.6);
}

/* Indicateur de défilement */
@keyframes sb-scroll-dot {
        0%   { transform: translateY(0); opacity: 0; }
        35%  { opacity: 1; }
        100% { transform: translateY(14px); opacity: 0; }
}
.sb-hero__scroll {
        position: absolute;
        bottom: 6rem;
        left: 50%;
        transform: translateX(-50%);
        z-index: 10;
        display: none;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
        color: rgba(250, 247, 241, 0.6);
        transition: color 0.3s ease;
}
@media (min-width: 1024px) {
        .sb-hero__scroll { display: flex; bottom: 4rem; }
}
.sb-hero__scroll:hover,
.sb-hero__scroll:focus-visible { color: var(--sb-ivory); }
.sb-hero__scroll-frame {
        position: relative;
        display: flex;
        width: 1.25rem;
        height: 2.25rem;
        justify-content: center;
        border: 1px solid currentColor;
        border-radius: 999px;
}
.sb-scroll-dot {
        margin-top: 6px;
        width: 5px;
        height: 5px;
        border-radius: 999px;
        background: currentColor;
        animation: sb-scroll-dot 2.2s ease-in-out infinite;
}

/* Filigrane lotus */
.sb-watermark {
        position: absolute;
        pointer-events: none;
        user-select: none;
        z-index: 1;
}
.sb-watermark--hero {
        right: -6rem;
        top: 50%;
        transform: translateY(-50%);
        opacity: 0.07;
}
.sb-watermark--left {
        left: -8rem;
        bottom: 0;
        opacity: 0.05;
}
.sb-watermark--right {
        right: -10rem;
        top: 0;
        opacity: 0.06;
}
.sb-watermark--right-low {
        right: -9rem;
        top: 2.5rem;
        opacity: 0.05;
}
.sb-watermark--left-low {
        left: -7rem;
        bottom: 0;
        opacity: 0.05;
}
.sb-watermark--gift {
        right: -4rem;
        top: -2.5rem;
        opacity: 0.08;
}
.sb-watermark--center {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        opacity: 0.06;
}

/* --------------------------------------------------------------------------
   5. Bandeau d'introduction (intro)
   -------------------------------------------------------------------------- */

.sb-intro {
        position: relative;
        background: var(--sb-ivory);
        padding-block: 4rem;
}
@media (min-width: 640px) { .sb-intro { padding-block: 5rem; } }

.sb-intro__grid {
        display: grid;
        gap: 2.5rem;
        align-items: center;
}
@media (min-width: 1024px) {
        .sb-intro__grid {
                grid-template-columns: 1.4fr 1fr;
                gap: 2.5rem;
        }
}
.sb-intro__lead {
        margin: 1.25rem 0 0;
        font-family: var(--sb-font-serif);
        font-size: 1.5rem;
        font-weight: 300;
        line-height: 1.4;
        color: var(--sb-espresso);
        max-width: 42rem;
}
@media (min-width: 640px) { .sb-intro__lead { font-size: 1.7rem; } }

.sb-facts {
        display: grid;
        gap: 1px;
        overflow: hidden;
        border: 1px solid var(--sb-champagne);
        background: var(--sb-champagne);
}
@media (min-width: 640px) {
        .sb-facts { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
        .sb-facts { grid-template-columns: 1fr; }
}
.sb-fact {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        background: var(--sb-ivory);
        padding: 1rem 1.25rem;
        font-size: 12px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.14em;
        color: var(--sb-ink-soft);
}
.sb-fact img {
        width: 16px;
        height: auto;
        opacity: 0.7;
        flex: 0 0 auto;
}

/* --------------------------------------------------------------------------
   6. Cartes de soins (grille éditoriale)
   -------------------------------------------------------------------------- */

.sb-services-grid {
        display: grid;
        gap: 1.5rem;
        margin-top: 3.5rem;
}
@media (min-width: 1024px) {
        .sb-services-grid { grid-template-columns: 2fr 3fr; }
}
.sb-services-grid__others {
        display: grid;
        gap: 1.5rem;
}
@media (min-width: 640px) {
        .sb-services-grid__others { grid-template-columns: repeat(2, 1fr); }
}
/* Version simple (shortcode / archive) */
.sb-services-grid--simple {
        grid-template-columns: 1fr;
}
@media (min-width: 640px) {
        .sb-services-grid--simple { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
        .sb-services-grid--simple { grid-template-columns: repeat(3, 1fr); }
}

.sb-service-card {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        border: 1px solid var(--sb-champagne);
        background: rgba(255, 255, 255, 0.6);
        border-radius: 2px;
        transition: border-color 0.5s ease, box-shadow 0.5s ease;
}
.sb-service-card:hover,
.sb-service-card:focus-within {
        border-color: var(--sb-sand);
        box-shadow: 0 24px 60px -30px rgba(42, 33, 24, 0.35);
}

.sb-card-media {
        position: relative;
        display: block;
        width: 100%;
        overflow: hidden;
        padding: 0;
        border: 0;
        background: none;
        cursor: pointer;
}
.sb-card-media--tall { aspect-ratio: 4 / 5; }
.sb-card-media--wide { aspect-ratio: 16 / 10; }
@media (min-width: 1024px) {
        .sb-card-media--tall {
                aspect-ratio: auto;
                min-height: 430px;
        }
}
.sb-card-media img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 1.2s var(--sb-ease);
}
.sb-zoom { overflow: hidden; }
.sb-zoom img { transition: transform 1.2s var(--sb-ease); }
.sb-zoom:hover img,
.sb-zoom:focus-within img { transform: scale(1.045); }

.sb-card-media__shade {
        position: absolute;
        inset: 0;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.35), transparent 55%);
        opacity: 0;
        transition: opacity 0.5s ease;
}
.sb-service-card:hover .sb-card-media__shade,
.sb-card-media:focus-visible .sb-card-media__shade { opacity: 1; }

.sb-card-media__arrow {
        position: absolute;
        right: 0.75rem;
        bottom: 0.75rem;
        display: flex;
        width: 2.25rem;
        height: 2.25rem;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: rgba(42, 33, 24, 0.85);
        color: var(--sb-ivory);
        opacity: 0;
        transition: opacity 0.5s ease;
}
.sb-service-card:hover .sb-card-media__arrow,
.sb-card-media:focus-visible .sb-card-media__arrow { opacity: 1; }

.sb-service-card__body {
        display: flex;
        flex: 1;
        flex-direction: column;
        gap: 0.75rem;
        padding: 1.25rem;
}
@media (min-width: 640px) { .sb-service-card__body { padding: 1.5rem; } }

.sb-meta-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        font-size: 10.5px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        color: var(--sb-gold-deep);
}
.sb-meta-row__duration {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
}
.sb-meta-row__price { color: var(--sb-ink-soft); }

.sb-service-card__title {
        font-family: var(--sb-font-serif);
        font-size: 1.5rem;
        font-weight: 500;
        line-height: 1.2;
        margin: 0;
}
.sb-service-card__title a,
.sb-service-card__title button {
        font: inherit;
        color: inherit;
        text-align: left;
        padding: 0;
        border: 0;
        background: none;
        cursor: pointer;
}

.sb-service-card__excerpt {
        font-size: 13.5px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
        margin: 0;
}

/* Bienfaits avec puce dorée */
.sb-benefits {
        display: flex;
        flex-wrap: wrap;
        gap: 0.375rem 1rem;
        list-style: none;
        margin: 0;
        padding: 0;
}
.sb-benefits li {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 11.5px;
        font-weight: 300;
        color: var(--sb-ink-soft);
}
.sb-benefits--dark li { color: var(--sb-ivory-soft); }
.sb-benefits__dot {
        width: 4px;
        height: 4px;
        border-radius: 999px;
        background: var(--sb-gold);
        flex: 0 0 auto;
}

.sb-service-card__footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        margin-top: auto;
        padding-top: 1rem;
        border-top: 1px solid var(--sb-champagne);
}

/* Mini-carte WhatsApp ronde */
.sb-wa-mini {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2rem;
        height: 2rem;
        border-radius: 999px;
        border: 1px solid var(--sb-champagne);
        color: var(--sb-wa-deep);
        flex: 0 0 auto;
        transition: border-color 0.3s ease, background-color 0.3s ease;
}
.sb-wa-mini:hover,
.sb-wa-mini:focus-visible {
        border-color: rgba(37, 211, 102, 0.6);
        background: rgba(37, 211, 102, 0.1);
        color: var(--sb-wa-deep);
}

/* Soins complémentaires */
.sb-secondary-label {
        margin: 3.5rem 0 1.25rem;
        text-align: center;
        font-size: 10.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.3em;
        color: var(--sb-ink-soft);
}
.sb-secondary-grid {
        display: grid;
        gap: 1rem;
}
@media (min-width: 768px) {
        .sb-secondary-grid { grid-template-columns: repeat(3, 1fr); }
}
.sb-secondary-card {
        display: flex;
        align-items: center;
        gap: 1rem;
        padding: 1rem;
        border: 1px solid var(--sb-champagne);
        background: rgba(250, 247, 241, 0.7);
        border-radius: 2px;
        text-align: left;
        cursor: pointer;
        transition: border-color 0.4s ease, background-color 0.4s ease;
        color: inherit;
}
.sb-secondary-card:hover,
.sb-secondary-card:focus-visible {
        border-color: var(--sb-sand);
        background: var(--sb-ivory);
}
.sb-secondary-card__thumb {
        position: relative;
        width: 64px;
        height: 64px;
        flex: 0 0 auto;
        overflow: hidden;
        border-radius: 2px;
}
.sb-secondary-card__thumb img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
}
.sb-secondary-card__title {
        display: block;
        font-family: var(--sb-font-serif);
        font-size: 1.125rem;
        font-weight: 500;
        line-height: 1.25;
        color: var(--sb-espresso);
}
.sb-secondary-card__text {
        display: block;
        margin: 0.25rem 0 0;
        font-size: 12px;
        font-weight: 300;
        line-height: 1.45;
        color: var(--sb-ink-soft);
}

/* --------------------------------------------------------------------------
   7. Expérience — 4 étapes
   -------------------------------------------------------------------------- */

.sb-steps {
        display: grid;
        gap: 1px;
        overflow: hidden;
        border: 1px solid var(--sb-champagne);
        background: var(--sb-champagne);
        border-radius: 2px;
        list-style: none;
        margin: 4rem 0 0;
        padding: 0;
        counter-reset: step;
}
@media (min-width: 640px) { .sb-steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .sb-steps { grid-template-columns: repeat(4, 1fr); } }

.sb-step {
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
        background: var(--sb-ivory);
        padding: 2rem;
}
@media (min-width: 640px) { .sb-step { padding: 2.5rem; } }

.sb-step__top {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
}
.sb-step__number {
        font-family: var(--sb-font-serif);
        font-size: 3.4rem;
        font-weight: 300;
        line-height: 1;
        color: var(--sb-champagne);
}
.sb-step__icon {
        display: flex;
        width: 2.75rem;
        height: 2.75rem;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--sb-champagne);
        border-radius: 999px;
        color: var(--sb-gold-deep);
}
.sb-step__title {
        font-family: var(--sb-font-serif);
        font-size: 1.45rem;
        font-weight: 500;
        line-height: 1.3;
        margin: 0 0 0.75rem;
}
.sb-step__text {
        font-size: 13px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
        margin: 0;
}

/* --------------------------------------------------------------------------
   8. À propos (section espresso sombre)
   -------------------------------------------------------------------------- */

.sb-about__grid {
        display: grid;
        gap: 3.5rem;
        align-items: center;
}
@media (min-width: 1024px) {
        .sb-about__grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 5rem;
        }
}

.sb-about__title {
        margin: 1.25rem 0 0;
        font-family: var(--sb-font-serif);
        font-size: 1.875rem;
        font-weight: 500;
        line-height: 1.15;
        color: var(--sb-ivory);
}
@media (min-width: 640px) { .sb-about__title { font-size: 2.25rem; } }
@media (min-width: 1024px) { .sb-about__title { font-size: 2.75rem; } }

.sb-about__text {
        margin: 1.25rem 0 0;
        font-size: 14.5px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ivory-soft);
}

/* Valeurs : icônes en cercle fin */
.sb-values {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem 2rem;
        list-style: none;
        margin: 2.25rem 0 0;
        padding: 0;
}
@media (min-width: 640px) { .sb-values { grid-template-columns: repeat(3, 1fr); } }
.sb-values li {
        display: flex;
        align-items: center;
        gap: 0.75rem;
}
.sb-values__icon {
        display: flex;
        width: 2.25rem;
        height: 2.25rem;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(179, 146, 79, 0.35);
        border-radius: 999px;
        color: var(--sb-sand);
        flex: 0 0 auto;
}
.sb-values__label {
        font-size: 12px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.12em;
        color: rgba(250, 247, 241, 0.9);
}

/* Callout prix réel */
.sb-price-callout {
        display: inline-flex;
        align-items: baseline;
        gap: 0.5rem;
        margin: 2.5rem 0 0;
        padding-left: 1rem;
        border-left: 2px solid var(--sb-gold);
}
.sb-price-callout__label {
        font-size: 10.5px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.24em;
        color: var(--sb-ivory-soft);
}
.sb-price-callout__value {
        font-family: var(--sb-font-serif);
        font-size: 1.5rem;
        font-weight: 500;
        color: var(--sb-sand);
}

/* Cadre champagne décalé (photos) */
.sb-frame {
        position: relative;
}
.sb-frame__media {
        position: relative;
        overflow: hidden;
        border-radius: 2px;
        aspect-ratio: 4 / 5;
        max-height: 620px;
}
.sb-frame__media img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
}
.sb-frame__border {
        position: absolute;
        bottom: -1.25rem;
        left: -1.25rem;
        z-index: 0;
        width: 100%;
        height: 100%;
        border: 1px solid rgba(179, 146, 79, 0.3);
        border-radius: 2px;
}
.sb-frame--flip .sb-frame__border {
        left: auto;
        right: -1.25rem;
        bottom: auto;
        top: -1.25rem;
}
@media (max-width: 639px) {
        .sb-frame__border { display: none; }
}
.sb-frame__caption {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin: 1.5rem 0 0;
        font-size: 11px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.22em;
        color: var(--sb-ivory-soft);
}
.sb-frame__caption--ink { color: var(--sb-ink-soft); }
.sb-frame__caption .sbm-icon { color: var(--sb-gold-deep); }

/* --------------------------------------------------------------------------
   9. Marrakech (section crème, split + puces lieux)
   -------------------------------------------------------------------------- */

.sb-split {
        display: grid;
        gap: 3.5rem;
        align-items: center;
}
@media (min-width: 1024px) {
        .sb-split { grid-template-columns: repeat(2, 1fr); gap: 5rem; }
}
.sb-split__media { order: 2; }
.sb-split__text  { order: 1; }
@media (min-width: 1024px) {
        .sb-split__media { order: 1; }
        .sb-split__text  { order: 2; }
}

.sb-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 0.625rem;
        list-style: none;
        margin: 2rem 0 0;
        padding: 0;
}
.sb-chip {
        border: 1px solid rgba(203, 184, 150, 0.6);
        background: rgba(250, 247, 241, 0.7);
        border-radius: 999px;
        padding: 0.5rem 1rem;
        font-size: 11px;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 0.14em;
        color: var(--sb-espresso);
}
.sb-chip--cream {
        background: var(--sb-cream);
        border-color: transparent;
}

/* Liens internes SEO (maillage) */
.sb-seo-links {
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        gap: 0.625rem 1.5rem;
        margin: 0;
        padding: 0;
}
.sb-seo-links .sb-link {
        font-size: 12px;
        font-weight: 300;
        text-transform: none;
        letter-spacing: 0.04em;
}
.sb-seo-links--footer .sb-link {
        color: rgba(217, 207, 188, 0.7);
}
.sb-seo-links--footer .sb-link:hover,
.sb-seo-links--footer .sb-link:focus-visible {
        color: var(--sb-sand);
}

.sb-split__links {
        margin-top: 2rem;
        padding-top: 1.5rem;
        border-top: 1px solid var(--sb-champagne);
}

.sb-split__ctas {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: 2.25rem;
}
@media (min-width: 640px) {
        .sb-split__ctas { flex-direction: row; }
}

/* --------------------------------------------------------------------------
   10. Équipe — cartes thérapeutes
   -------------------------------------------------------------------------- */

.sb-team-grid {
        display: grid;
        gap: 2rem;
        margin-top: 3.5rem;
}
@media (min-width: 768px) { .sb-team-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .sb-team-grid { gap: 3rem; } }

.sb-team-card {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: hidden;
        border: 1px solid var(--sb-champagne);
        background: rgba(255, 255, 255, 0.6);
        border-radius: 2px;
        transition: border-color 0.5s ease, box-shadow 0.5s ease;
}
.sb-team-card:hover,
.sb-team-card:focus-within {
        border-color: var(--sb-sand);
        box-shadow: 0 24px 60px -30px rgba(42, 33, 24, 0.35);
}
@media (min-width: 640px) {
        .sb-team-card { flex-direction: row; }
}

.sb-team-card__portrait {
        position: relative;
        display: block;
        width: 100%;
        aspect-ratio: 4 / 5;
        flex: 0 0 auto;
        overflow: hidden;
        padding: 0;
        border: 0;
        background: none;
        cursor: pointer;
}
@media (min-width: 640px) {
        .sb-team-card__portrait {
                width: 46%;
                aspect-ratio: auto;
        }
}
.sb-team-card__portrait img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top center;
}

.sb-team-card__info {
        display: flex;
        flex: 1;
        flex-direction: column;
        gap: 1rem;
        padding: 1.5rem;
}
@media (min-width: 640px) { .sb-team-card__info { padding: 1.75rem; } }

.sb-team-card__role {
        font-size: 10px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.26em;
        color: var(--sb-gold-deep);
        margin: 0;
}
.sb-team-card__name {
        font-family: var(--sb-font-serif);
        font-size: 1.7rem;
        font-weight: 500;
        line-height: 1.2;
        margin: 0.5rem 0 0;
        color: var(--sb-espresso);
}
.sb-team-card__bio {
        font-size: 13px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
}
.sb-team-card__footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        margin-top: auto;
        padding-top: 1rem;
        border-top: 1px solid var(--sb-champagne);
}

/* --------------------------------------------------------------------------
   11. Tarifs
   -------------------------------------------------------------------------- */

.sb-pricing-grid {
        display: grid;
        gap: 1.5rem;
        margin: 3.5rem auto 0;
        max-width: 56rem;
}
@media (min-width: 768px) { .sb-pricing-grid { grid-template-columns: repeat(3, 1fr); } }

.sb-pricing-card {
        position: relative;
        display: flex;
        flex-direction: column;
        padding: 2rem;
        border: 1px solid var(--sb-champagne);
        background: var(--sb-ivory);
        border-radius: 2px;
}
.sb-pricing-card.is-featured {
        border-color: rgba(179, 146, 79, 0.6);
        background: var(--sb-espresso);
        box-shadow: 0 30px 70px -35px rgba(42, 33, 24, 0.7);
}

.sb-pricing-card__badge {
        position: absolute;
        top: -0.75rem;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
        background: var(--sb-gold);
        padding: 0.25rem 1rem;
        font-size: 9.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.24em;
        color: var(--sb-espresso);
}

.sb-pricing-card__duration {
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.3em;
        color: var(--sb-gold-deep);
        margin: 0;
}
.sb-pricing-card.is-featured .sb-pricing-card__duration { color: var(--sb-sand); }

.sb-pricing-card__name {
        font-family: var(--sb-font-serif);
        font-size: 1.65rem;
        font-weight: 500;
        line-height: 1.2;
        margin: 0.75rem 0 0;
        color: var(--sb-espresso);
}
.sb-pricing-card.is-featured .sb-pricing-card__name { color: var(--sb-ivory); }

.sb-pricing-card__price {
        display: flex;
        align-items: baseline;
        gap: 0.5rem;
        margin-top: 1.25rem;
}
.sb-pricing-card__note {
        font-size: 10px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.18em;
        color: var(--sb-ink-soft);
}
.sb-pricing-card.is-featured .sb-pricing-card__note { color: var(--sb-ivory-soft); }
.sb-pricing-card__amount {
        font-family: var(--sb-font-serif);
        font-size: 2rem;
        font-weight: 500;
        line-height: 1;
        color: var(--sb-espresso);
}
.sb-pricing-card.is-featured .sb-pricing-card__amount { color: var(--sb-sand); }

.sb-pricing-card__features {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        list-style: none;
        margin: 1.75rem 0 0;
        padding-top: 1.5rem;
        border-top: 1px solid var(--sb-champagne);
}
.sb-pricing-card.is-featured .sb-pricing-card__features {
        border-top-color: rgba(255, 255, 255, 0.1);
}
.sb-pricing-card__features li {
        display: flex;
        align-items: flex-start;
        gap: 0.75rem;
        font-size: 13px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
}
.sb-pricing-card.is-featured .sb-pricing-card__features li { color: var(--sb-ivory-soft); }
.sb-pricing-card__features .sbm-icon {
        flex: 0 0 auto;
        margin-top: 0.2rem;
        color: var(--sb-gold-deep);
}
.sb-pricing-card.is-featured .sb-pricing-card__features .sbm-icon {
        color: var(--sb-gold);
}

.sb-pricing-card__cta { margin-top: 2rem; }

.sb-pricing-note {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        margin: 2rem auto 0;
        max-width: 36rem;
        text-align: center;
        font-size: 11.5px;
        font-weight: 300;
        color: var(--sb-ink-soft);
}
.sb-pricing-note img { width: 14px; height: auto; opacity: 0.6; }

/* --------------------------------------------------------------------------
   12. Témoignages — carrousel éditorial
   -------------------------------------------------------------------------- */

.sb-carousel {
        position: relative;
        outline: none;
        max-width: 48rem;
        margin: 3.5rem auto 0;
}
.sb-carousel__track { position: relative; }

.sb-t-slide {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-inline: 0.5rem;
        text-align: center;
        transition: opacity 0.7s ease, transform 0.7s ease;
}
.sb-t-slide[data-active="false"] {
        opacity: 0;
        transform: translateY(10px);
        pointer-events: none;
        position: absolute;
        inset: 0;
}
.sb-t-slide__avatar {
        width: 88px;
        height: 88px;
        border-radius: 999px;
        object-fit: cover;
}
.sb-t-slide__stars {
        width: 120px;
        height: auto;
        margin-top: 1.25rem;
}
.sb-t-slide__quote {
        font-family: var(--sb-font-serif);
        font-size: 1.35rem;
        font-weight: 300;
        font-style: italic;
        line-height: 1.5;
        color: var(--sb-ivory);
        margin: 1.5rem 0 0;
}
@media (min-width: 640px) { .sb-t-slide__quote { font-size: 1.55rem; } }
.sb-t-slide__name {
        font-size: 13px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.22em;
        color: var(--sb-sand);
        margin: 1.5rem 0 0;
}
.sb-t-slide__service {
        margin: 0.25rem 0 0;
        font-size: 11px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.18em;
        color: var(--sb-ivory-soft);
}

.sb-carousel-controls {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1.5rem;
        margin-top: 2.5rem;
}
.sb-carousel-controls__btn {
        display: flex;
        width: 2.75rem;
        height: 2.75rem;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        background: transparent;
        color: rgba(250, 247, 241, 0.8);
        cursor: pointer;
        transition: border-color 0.3s ease, color 0.3s ease;
}
.sb-carousel-controls__btn:hover,
.sb-carousel-controls__btn:focus-visible {
        border-color: rgba(179, 146, 79, 0.6);
        color: var(--sb-ivory);
}

.sb-dots {
        display: flex;
        align-items: center;
        gap: 0.625rem;
}
.sb-dot {
        width: 7px;
        height: 7px;
        padding: 0;
        border-radius: 999px;
        border: 0;
        background: rgba(255, 255, 255, 0.25);
        cursor: pointer;
        transition: width 0.4s var(--sb-ease), background-color 0.4s ease;
}
.sb-dot:hover { background: rgba(255, 255, 255, 0.45); }
.sb-dot.is-active {
        width: 1.75rem;
        background: var(--sb-gold);
}

/* --------------------------------------------------------------------------
   13. Galerie masonry + visionneuse
   -------------------------------------------------------------------------- */

.sb-gallery {
        margin-top: 3.5rem;
        columns: 2;
        column-gap: 1rem;
}
@media (min-width: 768px) { .sb-gallery { columns: 3; } }
@media (min-width: 1024px) { .sb-gallery { columns: 4; } }
.sb-gallery__item {
        display: block;
        break-inside: avoid;
        margin-bottom: 1rem;
        position: relative;
        width: 100%;
        overflow: hidden;
        border: 1px solid var(--sb-champagne);
        border-radius: 2px;
        padding: 0;
        background: none;
        cursor: zoom-in;
}
.sb-gallery__item img {
        display: block;
        width: 100%;
        height: auto;
        transition: transform 1.2s var(--sb-ease);
}
.sb-gallery__item:hover img,
.sb-gallery__item:focus-visible img {
        transform: scale(1.045);
}
.sb-gallery__caption {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 0.5rem;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.55), transparent 55%);
        padding: 0.75rem;
        opacity: 0;
        transition: opacity 0.5s ease;
        color: #fff;
}
.sb-gallery__item:hover .sb-gallery__caption,
.sb-gallery__item:focus-visible .sb-gallery__caption {
        opacity: 1;
}
.sb-gallery__caption span {
        font-size: 11px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.18em;
}

/* Visionneuse plein écran */
.sb-lightbox {
        position: fixed;
        inset: 0;
        z-index: 90;
        display: none;
        flex-direction: column;
        background: rgba(20, 15, 9, 0.94);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
}
.sb-lightbox.is-open { display: flex; }

.sb-lightbox__bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1rem 1.25rem;
}
.sb-lightbox__counter {
        font-size: 11px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.24em;
        color: var(--sb-ivory-soft);
        margin: 0;
}
.sb-lightbox__close {
        display: flex;
        width: 2.75rem;
        height: 2.75rem;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        background: transparent;
        color: #fff;
        cursor: pointer;
        transition: border-color 0.3s ease;
}
.sb-lightbox__close:hover,
.sb-lightbox__close:focus-visible { border-color: rgba(255, 255, 255, 0.6); }

.sb-lightbox__stage {
        position: relative;
        display: flex;
        flex: 1;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        padding: 0 3.5rem 1rem;
}
@media (min-width: 640px) { .sb-lightbox__stage { padding: 0 6rem 1rem; } }
.sb-lightbox__img {
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        object-fit: contain;
        box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}

.sb-lightbox__controls {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 2rem;
        padding-bottom: 2rem;
}
.sb-lightbox__nav {
        display: flex;
        width: 3rem;
        height: 3rem;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        background: transparent;
        color: #fff;
        cursor: pointer;
        transition: border-color 0.3s ease;
}
.sb-lightbox__nav:hover,
.sb-lightbox__nav:focus-visible { border-color: rgba(179, 146, 79, 0.7); }

/* --------------------------------------------------------------------------
   14. Bon cadeau
   -------------------------------------------------------------------------- */

.sb-gift-banner {
        position: relative;
        overflow: hidden;
        border: 1px solid rgba(203, 184, 150, 0.5);
        background: var(--sb-ivory);
        border-radius: 2px;
}
.sb-gift-banner__inner {
        position: relative;
        display: grid;
        gap: 2rem;
        padding: 2rem;
        align-items: center;
}
@media (min-width: 640px) { .sb-gift-banner__inner { padding: 3rem; } }
@media (min-width: 1024px) {
        .sb-gift-banner__inner { grid-template-columns: auto 1fr auto; }
}
.sb-gift-banner__icon {
        display: flex;
        width: 4rem;
        height: 4rem;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(179, 146, 79, 0.5);
        border-radius: 999px;
        color: var(--sb-gold-deep);
}
.sb-gift-banner__title {
        font-family: var(--sb-font-serif);
        font-size: 1.875rem;
        font-weight: 500;
        line-height: 1.15;
        margin: 0;
        color: var(--sb-espresso);
}
@media (min-width: 640px) { .sb-gift-banner__title { font-size: 2.1rem; } }
.sb-gift-banner__text {
        margin: 0.75rem 0 0;
        max-width: 36rem;
        font-size: 13.5px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
}

/* --------------------------------------------------------------------------
   15. FAQ — accordéon
   -------------------------------------------------------------------------- */

.sb-faq-list {
        max-width: 48rem;
        margin: 3rem auto 0;
        border-top: 1px solid var(--sb-champagne);
        border-bottom: 1px solid var(--sb-champagne);
}
.sb-faq-item + .sb-faq-item { border-top: 1px solid var(--sb-champagne); }

.sb-faq-item__heading {
        margin: 0;
        font-family: var(--sb-font-sans);
        font-weight: 400;
        font-size: inherit;
        line-height: inherit;
}

.sb-faq-item__button {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
        gap: 1.5rem;
        padding-block: 1.25rem;
        border: 0;
        background: none;
        text-align: left;
        cursor: pointer;
}
.sb-faq-item__question {
        font-family: var(--sb-font-serif);
        font-size: 1.125rem;
        font-weight: 500;
        line-height: 1.35;
        color: var(--sb-espresso);
        transition: color 0.3s ease;
}
@media (min-width: 640px) { .sb-faq-item__question { font-size: 1.25rem; } }
.sb-faq-item.is-open .sb-faq-item__question { color: var(--sb-gold-deep); }

.sb-faq-item__toggle {
        display: flex;
        width: 2rem;
        height: 2rem;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        border: 1px solid var(--sb-champagne);
        color: var(--sb-ink-soft);
        transition: transform 0.4s var(--sb-ease), border-color 0.4s ease, color 0.4s ease;
}
.sb-faq-item.is-open .sb-faq-item__toggle {
        transform: rotate(45deg);
        border-color: var(--sb-gold);
        color: var(--sb-gold-deep);
}

.sb-faq-item__panel {
        display: grid;
        grid-template-rows: 0fr;
        opacity: 0;
        transition: grid-template-rows 0.5s ease, opacity 0.5s ease;
}
.sb-faq-item.is-open .sb-faq-item__panel {
        grid-template-rows: 1fr;
        opacity: 1;
}
.sb-faq-item__panel-inner { overflow: hidden; }
.sb-faq-item__answer {
        max-width: 42rem;
        margin: 0 0 1.5rem;
        font-size: 13.5px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
}

/* --------------------------------------------------------------------------
   16. Réservation — formulaire premium
   -------------------------------------------------------------------------- */

.sb-booking__grid {
        display: grid;
        gap: 2.5rem;
        margin-top: 3.5rem;
}
@media (min-width: 1024px) {
        .sb-booking__grid {
                grid-template-columns: 1fr 1.35fr;
                gap: 3.5rem;
        }
}

.sb-contact-card {
        border: 1px solid rgba(255, 255, 255, 0.1);
        background: rgba(255, 255, 255, 0.04);
        padding: 1.75rem;
        border-radius: 2px;
}
@media (min-width: 640px) { .sb-contact-card { padding: 2rem; } }
.sb-contact-card__title {
        font-family: var(--sb-font-serif);
        font-size: 1.5rem;
        font-weight: 500;
        margin: 0;
        color: var(--sb-ivory);
}
.sb-contact-card__list {
        list-style: none;
        margin: 1.5rem 0 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
}
.sb-contact-card__row {
        display: flex;
        align-items: center;
        gap: 1rem;
        color: inherit;
}
.sb-contact-card__icon {
        display: flex;
        width: 2.75rem;
        height: 2.75rem;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(179, 146, 79, 0.35);
        border-radius: 999px;
        color: var(--sb-sand);
}
.sb-contact-card__label {
        display: block;
        font-size: 10px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.22em;
        color: var(--sb-ivory-soft);
}
.sb-contact-card__value {
        font-size: 15px;
        font-weight: 400;
        color: var(--sb-ivory);
        transition: color 0.3s ease;
}
a.sb-contact-card__row:hover .sb-contact-card__value { color: var(--sb-sand); }
.sb-contact-card__value--small { font-size: 14px; }
.sb-contact-card__cta { margin-top: 2rem; }

.sb-quote-card {
        display: none;
        align-items: center;
        gap: 1rem;
        margin-top: 2rem;
        padding: 1.25rem;
        border: 1px solid rgba(179, 146, 79, 0.25);
        border-radius: 2px;
}
@media (min-width: 1024px) { .sb-quote-card { display: flex; } }
.sb-quote-card img { width: 40px; height: auto; }
.sb-quote-card p {
        margin: 0;
        font-family: var(--sb-font-serif);
        font-size: 1.125rem;
        font-weight: 300;
        font-style: italic;
        line-height: 1.4;
        color: var(--sb-ivory-soft);
}

/* Carte formulaire ivoire */
.sb-form-card {
        border: 1px solid var(--sb-champagne);
        background: var(--sb-ivory);
        padding: 1.75rem;
        box-shadow: 0 40px 90px -40px rgba(0, 0, 0, 0.6);
        border-radius: 2px;
}
@media (min-width: 640px) { .sb-form-card { padding: 2.5rem; } }

.sb-form-card__eyebrow {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 10px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.26em;
        color: var(--sb-gold-deep);
        margin: 0;
}
.sb-form-card__title {
        font-family: var(--sb-font-serif);
        font-size: 1.8rem;
        font-weight: 500;
        line-height: 1.2;
        margin: 0.75rem 0 0;
        color: var(--sb-espresso);
}

.sb-form {
        display: grid;
        gap: 1rem;
        margin-top: 1.75rem;
}
@media (min-width: 640px) { .sb-form { grid-template-columns: repeat(2, 1fr); } }

.sb-field {
        display: flex;
        flex-direction: column;
        gap: 0.375rem;
}
.sb-field--full { grid-column: 1 / -1; }
.sb-field__label {
        font-size: 10.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.18em;
        color: var(--sb-ink-soft);
}

.sb-input,
.sb-select,
.sb-textarea {
        width: 100%;
        height: 3rem;
        border: 1px solid var(--sb-champagne);
        background: rgba(255, 255, 255, 0.8);
        padding: 0 1rem;
        font-family: var(--sb-font-sans);
        font-size: 14px;
        font-weight: 300;
        color: var(--sb-espresso);
        border-radius: 0;
        outline: none;
        transition: border-color 0.3s ease;
        -webkit-appearance: none;
        appearance: none;
}
.sb-textarea {
        height: auto;
        padding: 0.75rem 1rem;
        resize: vertical;
        min-height: 5.5rem;
}
.sb-input::placeholder,
.sb-textarea::placeholder {
        color: rgba(107, 95, 79, 0.6);
}
.sb-input:focus,
.sb-select:focus,
.sb-textarea:focus {
        border-color: var(--sb-gold);
}
.sb-select {
        padding-right: 2.5rem;
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%228%22%3E%3Cpath d=%22M1 1l5 5 5-5%22 stroke=%22%238a6d3b%22 stroke-width=%221.5%22 fill=%22none%22/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 1rem center;
}
.sb-input[type="date"] { color-scheme: light; }

.sb-form__actions {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        grid-column: 1 / -1;
        margin-top: 0.75rem;
}
@media (min-width: 640px) { .sb-form__actions { flex-direction: row; } }
.sb-form__actions .sb-btn { flex: 1; }

.sb-form__privacy {
        grid-column: 1 / -1;
        margin: 0.5rem 0 0;
        font-size: 11px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
}

/* Champs cachés (honeypot) */
.sb-hp {
        position: absolute !important;
        left: -9999px !important;
        width: 1px;
        height: 1px;
        overflow: hidden;
}

/* Panneau de succès */
.sb-form-success {
        display: flex;
        min-height: 420px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1.25rem;
        text-align: center;
}
.sb-form-success__icon {
        display: flex;
        width: 4rem;
        height: 4rem;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--sb-gold);
        border-radius: 999px;
        color: var(--sb-gold-deep);
}
.sb-form-success__title {
        font-family: var(--sb-font-serif);
        font-size: 1.875rem;
        font-weight: 500;
        margin: 0;
        color: var(--sb-espresso);
}
.sb-form-success__text {
        max-width: 24rem;
        font-size: 13.5px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ink-soft);
        margin: 0;
}
.sb-form-success__actions {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: 0.5rem;
}
@media (min-width: 640px) { .sb-form-success__actions { flex-direction: row; } }

/* --------------------------------------------------------------------------
   17. Pied de page — CTA + footer 4 colonnes
   -------------------------------------------------------------------------- */

.sb-footer-cta {
        position: relative;
        overflow: hidden;
        background: var(--sb-charcoal);
        padding-block: 5rem;
        text-align: center;
}
@media (min-width: 640px) { .sb-footer-cta { padding-block: 6rem; } }
.sb-footer-cta__inner {
        position: relative;
        max-width: 48rem;
        margin-inline: auto;
        padding-inline: 1.25rem;
}
@media (min-width: 640px) { .sb-footer-cta__inner { padding-inline: 2rem; } }
.sb-footer-cta__logo {
        margin: 0 auto;
        display: block;
        width: 56px;
        height: auto;
        opacity: 0.9;
}
.sb-footer-cta__title {
        font-family: var(--sb-font-serif);
        font-size: 1.875rem;
        font-weight: 300;
        line-height: 1.15;
        color: var(--sb-ivory);
        margin: 1.5rem 0 0;
}
@media (min-width: 640px) { .sb-footer-cta__title { font-size: 2.9rem; } }
.sb-footer-cta__title em {
        font-weight: 500;
        font-style: italic;
        color: var(--sb-sand);
}
.sb-footer-cta__text {
        max-width: 28rem;
        margin: 1rem auto 0;
        font-size: 13.5px;
        font-weight: 300;
        line-height: 1.65;
        color: var(--sb-ivory-soft);
}

.sb-footer {
        background: var(--sb-charcoal);
        color: var(--sb-ivory-soft);
}
.sb-footer__top {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.sb-footer__cols {
        display: grid;
        gap: 3rem;
        max-width: var(--sb-container);
        margin-inline: auto;
        padding: 4rem 1.25rem;
}
@media (min-width: 640px) { .sb-footer__cols { padding-inline: 2rem; } }
@media (min-width: 1024px) {
        .sb-footer__cols {
                grid-template-columns: 1.3fr 0.8fr 0.9fr 1.1fr;
                gap: 2.5rem;
        }
}

.sb-footer__brand {
        display: flex;
        align-items: center;
        gap: 0.75rem;
}
.sb-footer__brand img { width: 48px; height: auto; display: block; }
.sb-footer__name {
        font-family: var(--sb-font-serif);
        font-size: 1.25rem;
        font-weight: 600;
        letter-spacing: 0.12em;
        color: var(--sb-ivory);
        margin: 0;
        line-height: 1;
}
.sb-footer__baseline {
        margin: 6px 0 0;
        font-size: 8.5px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.34em;
        color: var(--sb-sand);
        line-height: 1;
}
.sb-footer__text {
        margin: 1.5rem 0 0;
        max-width: 20rem;
        font-size: 13px;
        font-weight: 300;
        line-height: 1.65;
}

.sb-footer__heading {
        font-family: var(--sb-font-sans);
        font-size: 10.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.28em;
        color: var(--sb-sand);
        margin: 0 0 1.25rem;
}
.sb-footer__links {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0.625rem;
}
.sb-footer__links a {
        font-size: 13px;
        font-weight: 300;
        color: var(--sb-ivory-soft);
}
.sb-footer__links a:hover,
.sb-footer__links a:focus-visible {
        color: var(--sb-ivory);
}

/* Réseaux sociaux ronds */
.sb-socials {
        display: flex;
        align-items: center;
        gap: 0.625rem;
        list-style: none;
        margin: 1.75rem 0 0;
        padding: 0;
}
.sb-socials a {
        display: flex;
        width: 2.5rem;
        height: 2.5rem;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 999px;
        color: var(--sb-ivory-soft);
        transition: border-color 0.3s ease, color 0.3s ease;
}
.sb-socials a:hover,
.sb-socials a:focus-visible {
        border-color: rgba(179, 146, 79, 0.6);
        color: var(--sb-sand);
}

/* Liste contact du footer */
.sb-footer__contact {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 0.875rem;
        font-size: 13px;
        font-weight: 300;
}
.sb-footer__contact li {
        display: flex;
        align-items: center;
        gap: 0.625rem;
}
.sb-footer__contact a { color: inherit; }
.sb-footer__contact a:hover,
.sb-footer__contact a:focus-visible { color: var(--sb-ivory); }
.sb-footer__contact .sbm-icon {
        color: var(--sb-sand);
        flex: 0 0 auto;
}
.sb-footer__contact .email { word-break: break-all; }

/* Bandeau maillage interne */
.sb-footer__seo {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.sb-footer__seo-inner {
        max-width: var(--sb-container);
        margin-inline: auto;
        padding: 1.25rem 1.25rem;
}
@media (min-width: 640px) { .sb-footer__seo-inner { padding-inline: 2rem; } }
.sb-footer__seo-list {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.5rem 0.5rem;
        list-style: none;
        margin: 0;
        padding: 0;
}
.sb-footer__seo-list li {
        display: flex;
        align-items: center;
        gap: 0.5rem;
}
.sb-footer__seo-dot {
        width: 4px;
        height: 4px;
        border-radius: 999px;
        background: rgba(179, 146, 79, 0.4);
}

/* Barre inférieure */
.sb-footer__bottom {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        max-width: var(--sb-container);
        margin-inline: auto;
        padding: 1.5rem 1.25rem;
}
@media (min-width: 640px) {
        .sb-footer__bottom {
                flex-direction: row;
                padding-inline: 2rem;
        }
}
.sb-footer__copy {
        font-size: 11px;
        font-weight: 300;
        color: rgba(217, 207, 188, 0.6);
        margin: 0;
}
.sb-footer__legal {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.5rem 1.25rem;
        list-style: none;
        margin: 0;
        padding: 0;
}
.sb-footer__legal a {
        font-size: 11px;
        font-weight: 300;
        color: rgba(217, 207, 188, 0.6);
}
.sb-footer__legal a:hover,
.sb-footer__legal a:focus-visible { color: var(--sb-sand); }
.sb-footer__langs {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        list-style: none;
        margin: 0;
        padding: 0;
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.14em;
}
.sb-footer__langs li[aria-current="true"],
.sb-footer__langs .is-current { color: var(--sb-sand); }
.sb-footer__langs li { color: rgba(217, 207, 188, 0.6); }
.sb-footer__langs .sep { color: rgba(217, 207, 188, 0.3); }

/* --------------------------------------------------------------------------
   18. Actions flottantes — WhatsApp FAB + barre mobile
   -------------------------------------------------------------------------- */

@keyframes sb-wa-pulse {
        0%   { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.28); }
        70%  { box-shadow: 0 0 0 16px rgba(37, 211, 102, 0); }
        100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

.sb-wa-fab {
        position: fixed;
        right: 1.25rem;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 5.5rem);
        z-index: 40;
        display: flex;
        width: 3.5rem;
        height: 3.5rem;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: var(--sb-wa);
        color: #fff;
        box-shadow: 0 12px 30px -8px rgba(37, 211, 102, 0.55);
        animation: sb-wa-pulse 3.2s ease-out infinite;
        opacity: 0;
        transform: translateY(1rem);
        pointer-events: none;
        transition: opacity 0.5s ease, transform 0.5s ease, background-color 0.3s ease;
}
.sb-wa-fab.is-visible {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
}
.sb-wa-fab:hover,
.sb-wa-fab:focus-visible {
        background: #20df60;
        color: #fff;
}
@media (min-width: 768px) {
        .sb-wa-fab { bottom: 1.75rem; }
}

.sb-wa-green { color: var(--sb-wa); }

.sb-mobile-bar {
        position: fixed;
        inset-inline: 0;
        bottom: 0;
        z-index: 40;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        background: rgba(42, 33, 24, 0.95);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        padding-bottom: env(safe-area-inset-bottom, 0px);
        transform: translateY(100%);
        transition: transform 0.5s ease;
}
@media (min-width: 768px) {
        .sb-mobile-bar { display: none; }
}
.sb-mobile-bar.is-visible { transform: translateY(0); }
.sb-mobile-bar__grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
}
.sb-mobile-bar__btn {
        display: flex;
        min-height: 58px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.25rem;
        padding-block: 0.5rem;
        color: #fff;
        font-size: 9.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.16em;
}
.sb-mobile-bar__btn + .sb-mobile-bar__btn {
        border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.sb-mobile-bar__btn:active { background: rgba(255, 255, 255, 0.05); }
.sb-mobile-bar__btn--gold {
        background: var(--sb-gold);
        color: var(--sb-espresso);
}
.sb-mobile-bar__btn--gold:active { background: #c9a45e; }
.sb-mobile-bar__star {
        font-family: var(--sb-font-serif);
        font-size: 1.125rem;
        font-weight: 600;
        line-height: 1;
}

/* --------------------------------------------------------------------------
   19. Révélations au défilement & zooms
   -------------------------------------------------------------------------- */

.reveal {
        opacity: 0;
        transform: translateY(26px);
        transition:
                opacity 0.8s var(--sb-ease),
                transform 0.8s var(--sb-ease);
        will-change: opacity, transform;
}
.reveal.is-visible {
        opacity: 1;
        transform: translateY(0);
}

/* --------------------------------------------------------------------------
   20. Pages intérieures (archives, fiches, pages, 404, recherche)
   -------------------------------------------------------------------------- */

.sb-page {
        padding-top: calc(var(--sb-header-h) + 4rem);
        padding-bottom: 5rem;
}
.sb-page-header {
        text-align: center;
        padding-block: 3rem 2rem;
}
.sb-page-header .sb-breadcrumb { justify-content: center; }

.sb-breadcrumb ol {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        list-style: none;
        margin: 0 0 1rem;
        padding: 0;
        font-size: 11px;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 0.16em;
        color: var(--sb-ink-soft);
}
.sb-breadcrumb li + li::before {
        content: "—";
        margin-right: 0.5rem;
        color: var(--sb-sand);
}
.sb-breadcrumb a { color: var(--sb-gold-deep); }
.sb-breadcrumb a:hover,
.sb-breadcrumb a:focus-visible { color: var(--sb-espresso); }

/* Fiche soin : héros 16/8 */
.sb-single-hero {
        position: relative;
        aspect-ratio: 16 / 8;
        min-height: 320px;
        overflow: hidden;
}
.sb-single-hero img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
}
.sb-single-hero::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(to top, rgba(42, 33, 24, 0.85), rgba(42, 33, 24, 0.25) 55%, rgba(42, 33, 24, 0.15));
}
.sb-single-hero__content {
        position: absolute;
        inset-inline: 0;
        bottom: 2rem;
        z-index: 2;
}
.sb-single-hero__meta {
        font-size: 10.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.3em;
        color: var(--sb-gold-deep);
        margin: 0 0 0.5rem;
}
.sb-single-hero .sb-title { color: #fff; }

.sb-single-body {
        max-width: 48rem;
        margin-inline: auto;
        padding-top: 3rem;
}
.sb-single-body .sb-prose { margin-top: 1.25rem; }
.sb-prose {
        font-size: 14.5px;
        font-weight: 300;
        line-height: 1.75;
        color: var(--sb-ink-soft);
}
.sb-prose h2, .sb-prose h3 {
        color: var(--sb-espresso);
        margin-top: 2em;
}
.sb-prose a { text-decoration: underline; text-underline-offset: 3px; }

.sb-single-label {
        font-size: 10.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.28em;
        color: var(--sb-espresso);
        margin: 1.75rem 0 0.75rem;
}

.sb-single-actions {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        margin-top: 2rem;
        padding-top: 1.5rem;
        border-top: 1px solid var(--sb-champagne);
}
@media (min-width: 640px) { .sb-single-actions { flex-direction: row; } }

.sb-single-note {
        margin: 1.25rem 0 0;
        font-size: 11px;
        font-weight: 300;
        color: var(--sb-ink-soft);
}

/* Articles / archives génériques */
.sb-post-grid {
        display: grid;
        gap: 1.5rem;
}
@media (min-width: 640px) { .sb-post-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .sb-post-grid { grid-template-columns: repeat(3, 1fr); } }

.sb-loop-card {
        display: flex;
        flex-direction: column;
        border: 1px solid var(--sb-champagne);
        background: rgba(255, 255, 255, 0.6);
        border-radius: 2px;
        overflow: hidden;
        transition: border-color 0.4s ease;
}
.sb-loop-card:hover { border-color: var(--sb-sand); }
.sb-loop-card__media {
        display: block;
        aspect-ratio: 16 / 10;
        overflow: hidden;
}
.sb-loop-card__media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 1.2s var(--sb-ease);
}
.sb-loop-card:hover .sb-loop-card__media img { transform: scale(1.045); }
.sb-loop-card__body {
        padding: 1.25rem 1.5rem 1.5rem;
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
}
.sb-loop-card__title {
        font-family: var(--sb-font-serif);
        font-size: 1.375rem;
        font-weight: 500;
        margin: 0;
}
.sb-loop-card__title a { color: inherit; }
.sb-loop-card__excerpt {
        font-size: 13.5px;
        font-weight: 300;
        color: var(--sb-ink-soft);
        margin: 0;
}
.sb-loop-card__meta {
        font-size: 10.5px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.2em;
        color: var(--sb-gold-deep);
}

/* Pagination */
.sb-pagination {
        display: flex;
        justify-content: center;
        margin-top: 3rem;
}
.sb-pagination .nav-links {
        display: flex;
        gap: 0.5rem;
        align-items: center;
}
.sb-pagination .page-numbers {
        display: inline-flex;
        min-width: 2.5rem;
        height: 2.5rem;
        align-items: center;
        justify-content: center;
        padding-inline: 0.5rem;
        border: 1px solid var(--sb-champagne);
        font-size: 12px;
        color: var(--sb-ink-soft);
}
.sb-pagination .page-numbers.current {
        border-color: var(--sb-gold);
        color: var(--sb-gold-deep);
        font-weight: 600;
}
.sb-pagination a.page-numbers:hover {
        border-color: var(--sb-sand);
        color: var(--sb-espresso);
}

/* 404 & recherche */
.sb-404 {
        text-align: center;
        padding-block: 6rem;
}
.sb-404__logo { width: 72px; height: auto; margin-inline: auto; display: block; opacity: 0.9; }
.sb-404__code {
        font-family: var(--sb-font-serif);
        font-size: 5rem;
        font-weight: 300;
        color: var(--sb-champagne);
        line-height: 1;
        margin: 1.5rem 0 0.5rem;
}
.sb-404__text { color: var(--sb-ink-soft); max-width: 28rem; margin-inline: auto; }

.sb-searchform {
        display: flex;
        max-width: 28rem;
        margin: 0 auto;
        border-bottom: 1px solid var(--sb-gold-deep);
}
.sb-searchform input[type="search"] {
        flex: 1;
        border: 0;
        background: transparent;
        padding: 0.625rem 0.25rem;
        font-family: var(--sb-font-sans);
        font-size: 14px;
        font-weight: 300;
        color: var(--sb-espresso);
        outline: none;
}
.sb-searchform button {
        border: 0;
        background: none;
        color: var(--sb-gold-deep);
        cursor: pointer;
        padding: 0.5rem;
        display: inline-flex;
}

/* Cartes page contact */
.sb-info-cards {
        display: grid;
        gap: 1.5rem;
}
@media (min-width: 640px) { .sb-info-cards { grid-template-columns: repeat(2, 1fr); } }
.sb-info-card {
        border: 1px solid var(--sb-champagne);
        background: rgba(255, 255, 255, 0.6);
        padding: 1.75rem;
        border-radius: 2px;
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
}
.sb-info-card__label {
        font-size: 10.5px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.24em;
        color: var(--sb-gold-deep);
        margin: 0;
}
.sb-info-card__value {
        font-family: var(--sb-font-serif);
        font-size: 1.25rem;
        color: var(--sb-espresso);
        margin: 0;
}
.sb-info-card__sub { font-size: 12.5px; color: var(--sb-ink-soft); margin: 0; }

.sb-map {
        position: relative;
        aspect-ratio: 16 / 9;
        border: 1px solid var(--sb-champagne);
        background: var(--sb-cream);
        overflow: hidden;
        border-radius: 2px;
}
.sb-map iframe {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        border: 0;
}
.sb-map__placeholder {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.75rem;
        color: var(--sb-ink-soft);
        text-align: center;
        padding: 1rem;
}

/* Cartes thérapeute (fiche) */
.sb-profile-grid {
        display: grid;
        gap: 2.5rem;
}
@media (min-width: 1024px) { .sb-profile-grid { grid-template-columns: 1fr 1fr; } }
.sb-profile-portrait {
        position: relative;
        aspect-ratio: 4 / 5;
        overflow: hidden;
        border-radius: 2px;
        max-height: 620px;
}
.sb-profile-portrait img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top center;
}
.sb-profile-meta {
        display: grid;
        gap: 1rem;
}
@media (min-width: 640px) { .sb-profile-meta { grid-template-columns: repeat(2, 1fr); } }
.sb-profile-meta .sb-info-card { background: var(--sb-ivory); }

/* Page de contenu (page.php) */
.sb-page-content {
        max-width: 48rem;
        margin-inline: auto;
}

/* Barre de défilement personnalisée (listes longues) */
.sb-scroll::-webkit-scrollbar { width: 8px; }
.sb-scroll::-webkit-scrollbar-track { background: var(--sb-cream); }
.sb-scroll::-webkit-scrollbar-thumb {
        background: var(--sb-sand);
        border-radius: 4px;
}
.sb-scroll::-webkit-scrollbar-thumb:hover { background: var(--sb-gold); }

/* --------------------------------------------------------------------------
   21. Gutenberg — alignements et captions
   -------------------------------------------------------------------------- */

.wp-block-image figcaption,
.wp-caption-text {
        font-size: 11px;
        font-weight: 300;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--sb-ink-soft);
        text-align: center;
        margin-top: 0.5rem;
}

.alignwide {
        max-width: 64rem;
        margin-inline: auto;
}
.alignfull {
        max-width: none;
        width: 100vw;
        margin-inline: calc(50% - 50vw);
}

/* Contenu pleine largeur (Elementor / template fullwidth) */
.sb-canvas {
        min-height: 60vh;
}
.sb-canvas .elementor,
.sb-canvas .entry-content { width: 100%; }

/* --------------------------------------------------------------------------
   22. Réduction des animations (prefers-reduced-motion)
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
        html { scroll-behavior: auto; }

        *,
        *::before,
        *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;
        }

        .reveal {
                opacity: 1;
                transform: none;
                transition: none;
        }
        .sb-zoom img,
        .sb-zoom video,
        .sb-gallery__item img {
                animation: none !important;
                transform: none !important;
                transition: none !important;
        }
        .sb-wa-pulse,
        .sb-scroll-dot { animation: none; }
        .sb-t-slide[data-active="false"] { transition: none; }
}

/* --------------------------------------------------------------------------
   23. Corrections responsive fines (320–430px)
   -------------------------------------------------------------------------- */

@media (max-width: 430px) {
        .sb-hero__title { font-size: 2.2rem; }
        .sb-cta-group .sb-btn { width: 100%; }
        .sb-section { padding-block: 4rem; }
        .sb-card-media--tall { aspect-ratio: 4 / 5; }
        .sb-lightbox__stage { padding: 0 1rem 1rem; }
        .sb-mobile-drawer__link { font-size: 1.6rem; }
        .sb-gift-banner__inner { grid-template-columns: 1fr; text-align: left; }
        .sb-footer-cta .sb-cta-group .sb-btn { width: 100%; }
        .sb-pricing-card { padding: 1.5rem; }
        .sb-form-card { padding: 1.25rem; }
        .sb-contact-card { padding: 1.25rem; }
}

/* ============================================================
   Compléments — pied de page collant, marque, légende visionneuse
   (ajoutés lors de la revue qualité du 22/09)
   ============================================================ */

/* Pied de page toujours ancré en bas, même sur pages courtes (404…) */
body {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
}
.sb-main {
        flex: 1 0 auto;
}

/* Bloc texte de la marque (flex column, comme la maquette) */
.sb-brand__text {
        display: flex;
        flex-direction: column;
        line-height: 1;
}

/* Légende de la visionneuse galerie (si présente dans le markup) */
.sb-lightbox__caption {
        font-family: var(--sb-font-sans);
        font-size: 11px;
        font-weight: 300;
        letter-spacing: 0.24em;
        text-transform: uppercase;
        color: var(--sb-ivory-soft);
        margin: 0;
}

/* Variants orientation des contrôles carrousel / visionneuse */
.sb-carousel-controls__btn--prev,
.sb-lightbox__nav--prev { /* sémantique ; les deux boutons partagent la base */ }
.sb-carousel-controls__btn--next,
.sb-lightbox__nav--next { /* sémantique ; les deux boutons partagent la base */ }

/* RTL : garde-fous supplémentaires pour les éléments absolus */
[dir="rtl"] .sb-watermark--right { right: auto; left: 0; }
[dir="rtl"] .sb-watermark--left { left: auto; right: 0; }
