/* ==========================================================================
   Dinner Data — charte graphique (octobre 2026)
   Chargée après app.min.css et custom.min.css : elle remplace les couleurs,
   polices et images du thème Velzon sans modifier ses fichiers.
   Référence : artefact « Charte Dinner Data ».
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Saira+Condensed:wght@600;700;800;900&family=Manrope:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500&display=swap");

:root,
[data-bs-theme="light"],
[data-theme="default"] {
    /* Couleurs de la charte */
    --dd-creme: #fde5c9;
    --dd-creme-claire: #fff4e6;
    --dd-creme-soutenue: #f7d6ae;
    --dd-creme-menu: #f9dcbb;
    --dd-encre: #00243c;
    --dd-encre-douce: #5b4a3a;
    --dd-marine: #00243c;
    --dd-sur-marine: #fde5c9;
    --dd-petrole: #055966;
    --dd-sarcelle: #0ab1a5;
    --dd-sur-sarcelle: #00243c;
    --dd-sarcelle-texte: #05766e;
    --dd-argent: #b0aca5;
    --dd-filet: #e8c9a2;
    --dd-bordure: #8c6f4e;
    --dd-focus: #00243c;
    --dd-positif: #05766e;
    --dd-attention: #8f5306;
    --dd-critique: #a1261b;

    --dd-font-titre: "Saira Condensed", "Arial Narrow", system-ui, sans-serif;
    --dd-font-texte: Manrope, "Segoe UI", system-ui, sans-serif;
    --dd-font-donnee: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;

    /* Variables du thème Velzon / Bootstrap */
    --vz-font-sans-serif: var(--dd-font-texte);
    --vz-body-font-family: var(--dd-font-texte);
    --vz-body-bg: var(--dd-creme);
    --vz-body-bg-rgb: 253, 229, 201;
    --vz-body-color: var(--dd-encre);
    --vz-body-color-rgb: 0, 36, 60;
    --vz-heading-color: var(--dd-encre);
    --vz-secondary-color: var(--dd-encre-douce);
    --vz-emphasis-color: var(--dd-encre);
    --vz-card-bg: var(--dd-creme-claire);
    --vz-card-bg-custom: var(--dd-creme-claire);
    --vz-secondary-bg: var(--dd-creme-claire);
    --vz-tertiary-bg: var(--dd-creme-soutenue);
    --vz-light: var(--dd-creme-soutenue);
    --vz-light-rgb: 247, 214, 174;
    --vz-border-color: var(--dd-filet);
    --vz-input-bg: var(--dd-creme-claire);
    --vz-input-border-custom: var(--dd-bordure);
    --vz-header-bg: var(--dd-creme);
    --vz-footer-bg: var(--dd-creme-soutenue);
    --vz-link-color: var(--dd-sarcelle-texte);
    --vz-link-color-rgb: 5, 118, 110;
    --vz-link-hover-color: var(--dd-encre);
    --vz-primary: var(--dd-marine);
    --vz-primary-rgb: 0, 36, 60;
    --vz-primary-text-emphasis: var(--dd-marine);
    --vz-primary-bg-subtle: var(--dd-creme-soutenue);
    --vz-success: var(--dd-sarcelle-texte);
    --vz-success-rgb: 5, 118, 110;
    --vz-info: var(--dd-petrole);
    --vz-info-rgb: 5, 89, 102;
    --vz-warning: var(--dd-attention);
    --vz-danger: var(--dd-critique);
}

/* --- Base -------------------------------------------------------------- */
body {
    background-color: var(--dd-creme);
    color: var(--dd-encre);
    font-family: var(--dd-font-texte);
}

:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6),
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6,
.ff-secondary.fw-semibold {
    font-family: var(--dd-font-titre);
    color: inherit;
    letter-spacing: 0.005em;
}

h1, .h1, .display-4 { font-weight: 800; }
h2, .h2, h3, .h3 { font-weight: 700; }

.ff-secondary, .ff-primary { font-family: var(--dd-font-texte) !important; }

a { color: var(--dd-sarcelle-texte); }
a:hover { color: var(--dd-encre); }

:focus-visible {
    outline: 2px solid var(--dd-focus);
    outline-offset: 2px;
}

/* Fonds : le blanc devient crème partout */
.bg-white, .bg-light, .section.bg-white, .layout-wrapper.landing,
.main-content, .page-content, #page-topbar {
    background-color: var(--dd-creme) !important;
}

.card, .modal-content, .dropdown-menu, .accordion-item, .list-group-item {
    background-color: var(--dd-creme-claire);
    border-color: var(--dd-filet);
}

.card {
    border: 0;
    box-shadow: 0 1px 0 rgba(0, 36, 60, 0.08), 0 8px 24px rgba(0, 36, 60, 0.08);
}

.form-control, .form-select {
    background-color: var(--dd-creme-claire);
    border-color: var(--dd-bordure);
    color: var(--dd-encre);
}

.form-control:focus, .form-select:focus {
    border-color: var(--dd-encre);
    box-shadow: 0 0 0 2px var(--dd-creme), 0 0 0 4px var(--dd-focus);
}

.text-muted { color: var(--dd-encre-douce) !important; }
.text-primary { color: var(--dd-encre) !important; }
.text-success { color: var(--dd-positif) !important; }
.text-green { color: var(--dd-sarcelle) !important; }

/* --- Boutons ----------------------------------------------------------- */
.btn { font-family: var(--dd-font-texte); font-weight: 700; border-radius: 8px; }

.btn-primary {
    --vz-btn-bg: var(--dd-marine);
    --vz-btn-border-color: var(--dd-marine);
    --vz-btn-hover-bg: var(--dd-petrole);
    --vz-btn-hover-border-color: var(--dd-petrole);
    --vz-btn-active-bg: var(--dd-petrole);
    --vz-btn-active-border-color: var(--dd-petrole);
    --vz-btn-focus-shadow-rgb: 0, 36, 60;
    --vz-btn-color: var(--dd-sur-marine);
    --vz-btn-hover-color: var(--dd-sur-marine);
    --vz-btn-active-color: var(--dd-sur-marine);
}

/* Bouton d'accent (anciennement vert) : sarcelle, texte marine */
.btn-success1, .btn-success {
    --vz-btn-bg: var(--dd-sarcelle);
    --vz-btn-border-color: var(--dd-sur-sarcelle);
    --vz-btn-hover-bg: #13c4b7;
    --vz-btn-hover-border-color: var(--dd-sur-sarcelle);
    --vz-btn-active-bg: #099a8f;
    --vz-btn-active-border-color: var(--dd-sur-sarcelle);
    --vz-btn-focus-shadow-rgb: 10, 177, 165;
    --vz-btn-color: var(--dd-sur-sarcelle);
    --vz-btn-hover-color: var(--dd-sur-sarcelle);
    --vz-btn-active-color: var(--dd-sur-sarcelle);
    background-image: none !important;
    border-width: 2px;
}

/* Ancien bouton dégradé marine-vert */
.colobtn {
    background: var(--dd-marine) !important;
    color: var(--dd-sur-marine) !important;
}

/* --- En-tête du site public ------------------------------------------- */
.navbar-landing, #navbar.navbar-landing {
    background: var(--dd-creme-menu) !important;
    border-bottom: 1px solid var(--dd-filet);
    box-shadow: none !important;
}

.navbar-landing .navbar-nav .nav-item .nav-link {
    font-family: var(--dd-font-titre);
    font-weight: 700;
    font-size: 17px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--dd-encre);
}

.navbar-landing .navbar-nav .nav-item .nav-link:hover,
.navbar-landing .navbar-nav .nav-item .nav-link.active {
    color: var(--dd-encre);
    box-shadow: inset 0 -2px 0 var(--dd-sarcelle);
}

/* --- Bandeau d'accueil -------------------------------------------------- */
.nft-hero {
    background-image: url(../images/charte/dd-accueil-bandeau.jpg?v=3) !important;
    background-position: center center !important;
    background-size: cover !important;
}

/* Sur ordinateur, le bandeau s'ajuste à son contenu (texte + tableau de bord) :
   plus de grand vide sous le bouton ; l'image est légèrement recadrée. */
@media (min-width: 992px) {
    .nft-hero {
        min-height: 0;
        display: flex;
        align-items: center;
        padding-top: 120px !important;
        padding-bottom: 40px !important;
    }
    .nft-hero > .container { width: 100%; }
}

.nft-hero .bg-overlay {
    background: linear-gradient(90deg,
        rgba(0, 36, 60, 0.95) 0%,
        rgba(0, 36, 60, 0.90) 38%,
        rgba(0, 36, 60, 0.62) 56%,
        rgba(0, 36, 60, 0.18) 74%,
        rgba(0, 36, 60, 0) 88%) !important;
    opacity: 1 !important;
}

/* Lisibilité du texte sur la photo : colonne plus étroite (le texte reste
   sur la partie sombre), légère ombre portée, texte plus clair. */
.nft-hero .dd-hero-text { max-width: 640px; }
.nft-hero h1, .nft-hero h6, .nft-hero .display-6, .nft-hero .lead {
    text-shadow: 0 2px 14px rgba(0, 18, 30, .55);
}

.nft-hero h1 {
    font-family: var(--dd-font-titre);
    font-weight: 900;
    text-transform: uppercase;
    line-height: 0.95 !important;
    color: var(--dd-sur-marine) !important;
}

.nft-hero h6, .nft-hero .display-6 {
    font-family: var(--dd-font-texte);
    font-weight: 700;
    color: var(--dd-sur-marine) !important;
}

.nft-hero .lead { color: rgba(253, 229, 201, 0.97) !important; font-weight: 500; text-align: left !important; hyphens: manual !important; }

@media (max-width: 991.98px) {
    .nft-hero .bg-overlay {
        background: rgba(0, 36, 60, 0.86) !important;
    }
}

/* --- Bandeaux marine (appel à l'action en bas de page, sections bg-primary) */
.bg-primary {
    background-color: var(--dd-marine) !important;
}

.bg-primary .bg-overlay-pattern, .bg-overlay-pattern {
    background-image: none !important;
}

/* --- Pied de page ------------------------------------------------------- */
footer.SurveyForm, .custom-footer {
    background-color: var(--dd-creme-soutenue) !important;
    color: var(--dd-encre);
    border-top: 1px solid var(--dd-filet);
}

footer.SurveyForm a, .footer-list a { color: var(--dd-encre); }
footer.SurveyForm a:hover, .footer-list a:hover { color: var(--dd-sarcelle-texte); }

/* --- Pages connexion / inscription / mot de passe ----------------------- */
.auth-one-bg {
    background-image: url(../images/charte/dd-connexion-fond.jpg) !important;
    background-position: center !important;
    background-size: cover !important;
}

.auth-one-bg .bg-overlay {
    background: rgba(0, 36, 60, 0.55) !important;
    opacity: 1 !important;
}

.auth-page-content .card, .auth-page-wrapper .card {
    background-color: var(--dd-creme-claire);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
}

/* --- Tableau de bord (_Admin) ------------------------------------------ */
.app-menu.navbar-menu, .navbar-menu {
    background: var(--dd-marine) !important;
}

/* --- Chiffres ---------------------------------------------------------- */
.counter-value, .fs-22.fw-semibold, .ff-data {
    font-family: var(--dd-font-donnee);
    font-variant-numeric: tabular-nums;
}

/* --- Page « Comment ça marche » : captures d'écran manquantes ----------
   Le dossier assets/images/Howitworks n'existe pas : on masque ces images
   jusqu'à ce que de nouvelles captures de la plateforme soient prêtes. */
img[src*="Howitworks"] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; }
}


/* --- Fonds crème vivants : la data rencontre la cuisine ---------------
   - Motif « croquis » : ustensiles (fouet, toque, fourchette, verre, louche)
     mêlés à des graphiques (barres, camembert, courbe), en très léger.
   - Filigranes alternés : graphique dont la courbe se dessine (sections
     impaires) et carte de recette à l'ancienne annotée d'un graphique
     (sections paires).
   - Apparition douce des contenus au défilement (dd-anim.js).
   ------------------------------------------------------------------------ */
.layout-wrapper.landing .section:not(.nft-hero),
.job-hero-section {
    position: relative;
    isolation: isolate;
}

.layout-wrapper.landing .section:not(.nft-hero)::before,
.job-hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22360%22 height=%22360%22 viewBox=%220 0 360 360%22 fill=%22none%22 stroke=%22%2300243c%22 stroke-opacity=%22.13%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E %3Cg transform=%22translate(28 22) rotate(-20)%22%3E%3Cpath d=%22M14 0v34%22/%3E%3Cpath d=%22M14 34c-10 10-12 30 0 40c12-10 10-30 0-40z%22/%3E%3Cpath d=%22M14 34c-5 12-5 28 0 40c5-12 5-28 0-40z%22/%3E%3C/g%3E %3Cg transform=%22translate(178 26)%22%3E%3Cpath d=%22M6 34h40v10H6z%22/%3E%3Cpath d=%22M8 34c-10-4-10-22 4-22c2-12 26-12 28 0c14 0 14 18 4 22%22/%3E%3C/g%3E %3Cg transform=%22translate(292 18)%22%3E%3Cpath d=%22M0 44h48%22/%3E%3Cpath d=%22M6 44V30M18 44V20M30 44V26M42 44V8%22/%3E%3C/g%3E %3Cg transform=%22translate(96 132) rotate(15)%22%3E%3Cpath d=%22M10 0v22M18 0v22M26 0v22M2 0v22%22/%3E%3Cpath d=%22M2 22c0 8 24 8 24 0%22/%3E%3Cpath d=%22M14 28v42%22/%3E%3C/g%3E %3Cg transform=%22translate(222 150)%22%3E%3Ccircle cx=%2222%22 cy=%2222%22 r=%2220%22/%3E%3Cpath d=%22M22 2v20h20%22/%3E%3C/g%3E %3Cg transform=%22translate(26 246)%22%3E%3Cpath d=%22M4 0h28c0 18-6 26-14 26S4 18 4 0z%22/%3E%3Cpath d=%22M18 26v22M8 48h20%22/%3E%3C/g%3E %3Cg transform=%22translate(128 262)%22%3E%3Cpath d=%22M0 40l18-14 16 8 22-22 20 6%22/%3E%3Ccircle cx=%2218%22 cy=%2226%22 r=%223%22/%3E%3Ccircle cx=%2234%22 cy=%2234%22 r=%223%22/%3E%3Ccircle cx=%2256%22 cy=%2212%22 r=%223%22/%3E%3Ccircle cx=%2276%22 cy=%2218%22 r=%223%22/%3E%3C/g%3E %3Cg transform=%22translate(290 236) rotate(25)%22%3E%3Ccircle cx=%2212%22 cy=%2210%22 r=%2210%22/%3E%3Cpath d=%22M12 20v46%22/%3E%3C/g%3E %3Cg fill=%22%2300243c%22 fill-opacity=%22.14%22 stroke=%22none%22%3E%3Ccircle cx=%22160%22 cy=%2296%22 r=%221.6%22/%3E%3Ccircle cx=%2260%22 cy=%22196%22 r=%221.6%22/%3E%3Ccircle cx=%22320%22 cy=%22150%22 r=%221.6%22/%3E%3Ccircle cx=%22210%22 cy=%22330%22 r=%221.6%22/%3E%3Ccircle cx=%22330%22 cy=%22330%22 r=%221.6%22/%3E%3Ccircle cx=%2290%22 cy=%22330%22 r=%221.6%22/%3E%3C/g%3E %3C/svg%3E");
    background-size: 360px 360px;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 30%, rgba(0,0,0,.35) 70%, #000 100%);
            mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 30%, rgba(0,0,0,.35) 70%, #000 100%);
}

/* Filigrane « graphique » (sections impaires), en bas à droite */
.layout-wrapper.landing .section:not(.nft-hero):nth-of-type(odd)::after,
.job-hero-section::after {
    content: "";
    position: absolute;
    right: 2%;
    bottom: 24px;
    width: min(440px, 40vw);
    aspect-ratio: 420 / 260;
    z-index: -1;
    pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 420 260%22 fill=%22none%22%3E %3Cg stroke=%22%2300243c%22 stroke-opacity=%22.1%22 stroke-width=%221%22%3E%3Cpath d=%22M0 220H420M0 170H420M0 120H420M0 70H420M0 20H420%22/%3E%3C/g%3E %3Cg fill=%22%230ab1a5%22 fill-opacity=%22.18%22%3E %3Crect x=%2240%22 y=%22170%22 width=%2234%22 height=%2250%22 rx=%223%22/%3E%3Crect x=%22110%22 y=%22140%22 width=%2234%22 height=%2280%22 rx=%223%22/%3E %3Crect x=%22180%22 y=%22150%22 width=%2234%22 height=%2270%22 rx=%223%22/%3E%3Crect x=%22250%22 y=%22100%22 width=%2234%22 height=%22120%22 rx=%223%22/%3E %3Crect x=%22320%22 y=%2260%22 width=%2234%22 height=%22160%22 rx=%223%22/%3E%3C/g%3E %3Cpath d=%22M57 150 L127 118 L197 128 L267 78 L337 36%22 stroke=%22%2305766e%22 stroke-opacity=%22.45%22 stroke-width=%223%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 stroke-dasharray=%22420%22 stroke-dashoffset=%22420%22%3E %3Canimate attributeName=%22stroke-dashoffset%22 from=%22420%22 to=%220%22 dur=%222.4s%22 begin=%22.4s%22 fill=%22freeze%22/%3E%3C/path%3E %3Cg fill=%22%23fde5c9%22 stroke=%22%2305766e%22 stroke-opacity=%22.55%22 stroke-width=%223%22%3E %3Ccircle cx=%2257%22 cy=%22150%22 r=%227%22/%3E%3Ccircle cx=%22127%22 cy=%22118%22 r=%227%22/%3E%3Ccircle cx=%22197%22 cy=%22128%22 r=%227%22/%3E%3Ccircle cx=%22267%22 cy=%2278%22 r=%227%22/%3E%3Ccircle cx=%22337%22 cy=%2236%22 r=%227%22/%3E%3C/g%3E %3C/svg%3E") no-repeat center / contain;
}

/* Filigrane « carte de recette » (sections paires), en haut à gauche */
.layout-wrapper.landing .section:not(.nft-hero):nth-of-type(even)::after {
    content: "";
    position: absolute;
    left: 1%;
    top: 28px;
    width: min(400px, 38vw);
    aspect-ratio: 400 / 300;
    z-index: -1;
    pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 400 300%22 fill=%22none%22%3E %3Cg transform=%22rotate(-5 200 150)%22%3E %3Crect x=%2230%22 y=%2230%22 width=%22340%22 height=%22230%22 rx=%226%22 fill=%22%23fff4e6%22 fill-opacity=%22.55%22 stroke=%22%238c6f4e%22 stroke-opacity=%22.3%22 stroke-width=%221.5%22/%3E %3Cpath d=%22M70 30v230%22 stroke=%22%23a1261b%22 stroke-opacity=%22.22%22 stroke-width=%221.2%22/%3E %3Cg stroke=%22%2300243c%22 stroke-opacity=%22.1%22 stroke-width=%221%22%3E%3Cpath d=%22M30 100h340M30 126h340M30 152h340M30 178h340M30 204h340M30 230h340%22/%3E%3C/g%3E %3Ctext x=%2284%22 y=%2276%22 font-family=%22Georgia, %27Times New Roman%27, serif%22 font-style=%22italic%22 font-size=%2230%22 fill=%22%235b4a3a%22 fill-opacity=%22.4%22%3ERecette%3C/text%3E %3Ctext x=%22210%22 y=%2274%22 font-family=%22Georgia, serif%22 font-style=%22italic%22 font-size=%2215%22 fill=%22%235b4a3a%22 fill-opacity=%22.32%22%3En%C2%B0 12 %C2%B7 4 couverts%3C/text%3E %3Cg stroke=%22%235b4a3a%22 stroke-opacity=%22.3%22 stroke-width=%221.6%22 stroke-linecap=%22round%22%3E %3Cpath d=%22M84 96c10-6 18 4 28-2s16 4 26-1 14 3 24 0%22/%3E %3Cpath d=%22M84 122c12-5 20 3 30-1s18 3 28-1 12 2 22 0 14 2 24 0%22/%3E %3Cpath d=%22M84 148c10-5 18 3 28-1s16 4 26 0%22/%3E %3Cpath d=%22M84 174c12-4 20 3 30-1s18 3 28-1 12 2 24 0 16 3 26 0%22/%3E %3Cpath d=%22M84 200c10-5 18 3 28-1s16 3 24 0%22/%3E%3C/g%3E %3Cg transform=%22translate(262 112)%22 stroke=%22%2305766e%22 stroke-opacity=%22.45%22 stroke-width=%222%22 stroke-linecap=%22round%22%3E %3Cpath d=%22M0 100h88%22 stroke-opacity=%22.3%22/%3E %3Cpath d=%22M10 100V76M30 100V62M50 100V70M70 100V40%22 stroke-width=%2210%22 stroke-opacity=%22.18%22/%3E %3Cpath d=%22M10 70L30 54L50 62L70 30%22 fill=%22none%22/%3E %3Ccircle cx=%2270%22 cy=%2230%22 r=%223.5%22 fill=%22%2305766e%22 fill-opacity=%22.45%22 stroke=%22none%22/%3E%3C/g%3E %3C/g%3E %3Ccircle cx=%22338%22 cy=%22242%22 r=%2230%22 stroke=%22%238c6f4e%22 stroke-opacity=%22.14%22 stroke-width=%225%22/%3E %3C/svg%3E") no-repeat center / contain;
}

/* Trait sarcelle et marine sous les titres de section */
.layout-wrapper.landing .section:not(.nft-hero) h2:not(.card h2)::after {
    content: "";
    display: block;
    width: 56px;
    height: 4px;
    margin: 14px 0 0;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--dd-sarcelle) 0 70%, var(--dd-marine) 70% 100%);
}
.layout-wrapper.landing .section:not(.nft-hero) .text-center h2:not(.card h2)::after,
.layout-wrapper.landing .section:not(.nft-hero) h2.text-center:not(.card h2)::after {
    margin-left: auto;
    margin-right: auto;
}

/* Barre de menu : le même croquis data/cuisine en très léger, et un filet
   sarcelle-marine en bas */
.navbar-landing, #navbar.navbar-landing {
    background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22360%22 height=%22360%22 viewBox=%220 0 360 360%22 fill=%22none%22 stroke=%22%2300243c%22 stroke-opacity=%22.13%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E %3Cg transform=%22translate(28 22) rotate(-20)%22%3E%3Cpath d=%22M14 0v34%22/%3E%3Cpath d=%22M14 34c-10 10-12 30 0 40c12-10 10-30 0-40z%22/%3E%3Cpath d=%22M14 34c-5 12-5 28 0 40c5-12 5-28 0-40z%22/%3E%3C/g%3E %3Cg transform=%22translate(178 26)%22%3E%3Cpath d=%22M6 34h40v10H6z%22/%3E%3Cpath d=%22M8 34c-10-4-10-22 4-22c2-12 26-12 28 0c14 0 14 18 4 22%22/%3E%3C/g%3E %3Cg transform=%22translate(292 18)%22%3E%3Cpath d=%22M0 44h48%22/%3E%3Cpath d=%22M6 44V30M18 44V20M30 44V26M42 44V8%22/%3E%3C/g%3E %3Cg transform=%22translate(96 132) rotate(15)%22%3E%3Cpath d=%22M10 0v22M18 0v22M26 0v22M2 0v22%22/%3E%3Cpath d=%22M2 22c0 8 24 8 24 0%22/%3E%3Cpath d=%22M14 28v42%22/%3E%3C/g%3E %3Cg transform=%22translate(222 150)%22%3E%3Ccircle cx=%2222%22 cy=%2222%22 r=%2220%22/%3E%3Cpath d=%22M22 2v20h20%22/%3E%3C/g%3E %3Cg transform=%22translate(26 246)%22%3E%3Cpath d=%22M4 0h28c0 18-6 26-14 26S4 18 4 0z%22/%3E%3Cpath d=%22M18 26v22M8 48h20%22/%3E%3C/g%3E %3Cg transform=%22translate(128 262)%22%3E%3Cpath d=%22M0 40l18-14 16 8 22-22 20 6%22/%3E%3Ccircle cx=%2218%22 cy=%2226%22 r=%223%22/%3E%3Ccircle cx=%2234%22 cy=%2234%22 r=%223%22/%3E%3Ccircle cx=%2256%22 cy=%2212%22 r=%223%22/%3E%3Ccircle cx=%2276%22 cy=%2218%22 r=%223%22/%3E%3C/g%3E %3Cg transform=%22translate(290 236) rotate(25)%22%3E%3Ccircle cx=%2212%22 cy=%2210%22 r=%2210%22/%3E%3Cpath d=%22M12 20v46%22/%3E%3C/g%3E %3Cg fill=%22%2300243c%22 fill-opacity=%22.14%22 stroke=%22none%22%3E%3Ccircle cx=%22160%22 cy=%2296%22 r=%221.6%22/%3E%3Ccircle cx=%2260%22 cy=%22196%22 r=%221.6%22/%3E%3Ccircle cx=%22320%22 cy=%22150%22 r=%221.6%22/%3E%3Ccircle cx=%22210%22 cy=%22330%22 r=%221.6%22/%3E%3Ccircle cx=%22330%22 cy=%22330%22 r=%221.6%22/%3E%3Ccircle cx=%2290%22 cy=%22330%22 r=%221.6%22/%3E%3C/g%3E %3C/svg%3E"), linear-gradient(var(--dd-creme-menu), var(--dd-creme-menu)) !important;
    background-size: 240px 240px, auto !important;
    background-position: 0 -40px, 0 0 !important;
    border-bottom: 0 !important;
}
.navbar-landing::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--dd-marine) 0 18%, var(--dd-sarcelle) 18% 60%, var(--dd-filet) 60% 100%);
    pointer-events: none;
}

/* --- Texte justifié (comme « Justifier » dans Word) ----------------------
   Paragraphes et listes du site public et du tableau de bord. La césure
   automatique (langue de la page) évite les grands blancs entre les mots.
   Les zones centrées, alignées à droite, menus et pieds de page gardent
   leur alignement. */
:where(.layout-wrapper, .main-content, .job-hero-section) :where(p, li, .lead):not(
    .text-center, .text-center *, .text-end, .text-end *, .text-start,
    nav *, .nav *, .navbar *, .navbar-menu *, .dropdown-menu *, .pagination *, .text-uppercase, .card-animate *,
    .list-inline *, footer *, table *, .btn *, .form-check *) {
    text-align: justify;
    -webkit-hyphens: auto;
            hyphens: auto;
    hyphenate-limit-chars: 7 3 3;
}

/* Portraits : hauteur limitée pour éviter les grands vides à côté du texte */
img[src*="charte/dd-sommeliere"],
img[src*="charte/dd-client"],
img[src*="charte/dd-chef"] {
    width: 100% !important;
    max-height: 480px;
    object-fit: cover;
    object-position: 50% 12%;
    box-shadow: 0 18px 40px rgba(0, 36, 60, .18);
}

/* Apparition au défilement */
.dd-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
}
.dd-reveal.dd-visible {
    opacity: 1;
    transform: none;
}

@media (max-width: 767.98px) {
    .layout-wrapper.landing .section:not(.nft-hero)::after,
    .job-hero-section::after { opacity: .55; width: 70vw; }
    img[src*="charte/dd-sommeliere"],
    img[src*="charte/dd-client"],
    img[src*="charte/dd-chef"] { max-height: 360px; }
}

@media (prefers-reduced-motion: reduce) {
    .dd-reveal { opacity: 1; transform: none; transition: none; }
}

/* --- Compteur en direct (accueil) ---------------------------------------- */
.dd-counter {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 28px;
    align-items: center;
    padding: 28px 32px;
    border-radius: 14px;
    background: var(--dd-marine);
    color: var(--dd-sur-marine);
    box-shadow: 0 18px 40px rgba(0, 36, 60, .22);
    position: relative;
    overflow: hidden;
}
.dd-counter::after {           /* courbe montante discrète en fond */
    content: "";
    position: absolute;
    right: -20px; bottom: -10px;
    width: 280px; height: 140px;
    background: linear-gradient(135deg, transparent 48%, rgba(10,177,165,.18) 49%, rgba(10,177,165,.18) 51%, transparent 52%);
    pointer-events: none;
}
.dd-counter-label {
    font-family: var(--dd-font-titre);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: 15px;
    color: rgba(253, 229, 201, .8);
    display: flex;
    align-items: center;
    gap: 10px;
}
.dd-counter-label::before {    /* point « en direct » qui pulse */
    content: "";
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #e5484d;
    box-shadow: 0 0 0 0 rgba(229, 72, 77, .6);
    animation: dd-pulse 1.6s infinite;
}
@keyframes dd-pulse {
    0% { box-shadow: 0 0 0 0 rgba(229, 72, 77, .55); }
    70% { box-shadow: 0 0 0 10px rgba(229, 72, 77, 0); }
    100% { box-shadow: 0 0 0 0 rgba(229, 72, 77, 0); }
}
.dd-counter-value {
    font-family: var(--dd-font-donnee);
    font-variant-numeric: tabular-nums;
    font-size: clamp(40px, 6vw, 64px);
    line-height: 1.05;
    color: var(--dd-sarcelle);
    margin: 6px 0 4px;
}
.dd-counter-unit { font-weight: 600; font-size: 16px; }
.dd-counter-ytd { margin-top: 8px; font-size: 14px; color: rgba(253, 229, 201, .72); }
.dd-counter-punch {
    font-family: var(--dd-font-titre);
    font-weight: 700;
    font-size: clamp(20px, 2.2vw, 26px);
    line-height: 1.2;
    color: var(--dd-sur-marine);
    margin-bottom: 12px;
    text-align: left !important;
    hyphens: manual !important;
}
.dd-counter-source { margin: 0; font-size: 12px; text-align: left !important; }
.dd-counter-source a { color: rgba(253, 229, 201, .65); text-decoration: underline; }
.dd-counter-source a:hover { color: var(--dd-sur-marine); }
.dd-counter--solo { grid-template-columns: 1fr; gap: 6px; }
.dd-counter--solo .dd-counter-punch { margin-bottom: 4px; }
@media (max-width: 767.98px) {
    .dd-counter { grid-template-columns: 1fr; padding: 22px; }
}

/* Compteur placé dans le bandeau d'accueil : carte vitrée bien visible sur la photo */
.dd-hero-counter {
    position: relative;
    padding: 26px 28px 22px;
    border-radius: 18px;
    background: rgba(0, 36, 60, .82);
    -webkit-backdrop-filter: blur(6px);
            backdrop-filter: blur(6px);
    border: 1px solid rgba(10, 177, 165, .55);
    box-shadow: 0 24px 50px rgba(0, 18, 30, .45);
    color: var(--dd-sur-marine);
    overflow: hidden;
}
.dd-hero-counter::before {      /* fin liseré sarcelle en haut */
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px;
    background: linear-gradient(90deg, var(--dd-sarcelle), rgba(10,177,165,.15));
}
.dd-hero-counter .dd-counter-value {
    font-size: clamp(56px, 7vw, 92px);
    line-height: 1;
    margin: 10px 0 8px;
    text-shadow: 0 0 28px rgba(10, 177, 165, .35);
}
.dd-hero-counter .dd-counter-unit { font-size: 18px; line-height: 1.35; text-align: left; }
.dd-hero-counter .dd-counter-ytd { font-size: 15px; }
.dd-hero-counter .dd-counter-source { margin-top: 14px; }
@media (max-width: 991.98px) {
    .dd-hero-counter { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .dd-counter-label::before { animation: none; }
}

/* --- Mini-benchmark « Situez votre restaurant » --------------------------- */
.dd-bench { border-radius: 14px; }
.dd-bench .form-label { font-weight: 600; font-size: 14px; }
.dd-bench-results { min-height: 120px; }
.dd-bench-empty { color: var(--dd-encre-douce); font-style: italic; text-align: left !important; }
.dd-bench-row { padding: 12px 0; border-bottom: 1px solid var(--dd-filet); }
.dd-bench-row:last-of-type { border-bottom: 0; }
.dd-bench-name { font-weight: 700; margin-bottom: 6px; }
.dd-bar { display: grid; grid-template-columns: 110px 1fr 120px; align-items: center; gap: 10px; margin: 4px 0; font-size: 14px; }
.dd-bar-label { color: var(--dd-encre-douce); }
.dd-bar-track { height: 12px; border-radius: 6px; background: rgba(0, 36, 60, .08); overflow: hidden; }
.dd-bar-fill { display: block; height: 100%; border-radius: 6px; background: var(--dd-bordure); transition: width .5s ease; }
.dd-bar-you.is-good .dd-bar-fill { background: var(--dd-sarcelle); }
.dd-bar-you.is-bad .dd-bar-fill { background: var(--dd-attention); }
.dd-bar-you.is-inline .dd-bar-fill { background: var(--dd-petrole); }
.dd-bar-avg .dd-bar-fill { background: rgba(0, 36, 60, .35); }
.dd-bar-value { font-family: var(--dd-font-donnee); font-variant-numeric: tabular-nums; text-align: right; }
.dd-bench-verdict { font-weight: 700; font-size: 14px; margin-top: 4px; }
.dd-bench-verdict.is-good { color: var(--dd-sarcelle-texte); }
.dd-bench-verdict.is-bad { color: var(--dd-attention); }
.dd-bench-verdict.is-inline { color: var(--dd-petrole); }
.dd-bench-cta { margin-top: 18px; padding: 16px 18px; border-radius: 10px; background: var(--dd-creme-soutenue); }
.dd-bench-cta p { text-align: left !important; }
.dd-bench-note { margin: 12px 0 0; font-size: 12px; color: var(--dd-encre-douce); }
@media (max-width: 575.98px) {
    .dd-bar { grid-template-columns: 70px 1fr 96px; font-size: 13px; }
}

/* --- Offre de lancement : barre au-dessus du menu, pastilles, bannières --- */
.dd-offer-bar {
    display: block;
    width: 100%;
    order: -1;
    padding: 7px 16px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--dd-marine) !important;
    background: var(--dd-sarcelle);
    text-decoration: none;
}
.dd-offer-bar:hover { background: #13c4b7; }
.dd-offer-bar-link { margin-left: 8px; text-decoration: underline; white-space: nowrap; }
#navbar.navbar-landing { padding-top: 0 !important; flex-wrap: wrap; }
@media (max-width: 575.98px) { .dd-offer-bar { font-size: 12px; padding: 6px 10px; } }

.dd-offer-pill {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .02em;
    color: var(--dd-marine);
    background: var(--dd-sarcelle);
}
.dd-offer-band {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    padding: 28px 32px;
    border-radius: 14px;
    background: var(--dd-marine);
    color: var(--dd-sur-marine);
}
.dd-offer-band h3 { color: var(--dd-sur-marine); }
.dd-offer-banner {
    display: flex;
    gap: 20px;
    align-items: center;
    padding: 26px 30px;
    border-radius: 14px;
    background: var(--dd-sarcelle);
    color: var(--dd-marine);
    box-shadow: 0 14px 34px rgba(10, 177, 165, .28);
}
.dd-offer-banner h2 { color: var(--dd-marine); }
.dd-offer-banner h2::after { display: none !important; }
.dd-offer-banner p { text-align: left !important; font-weight: 600; }
.dd-offer-banner-icon { font-size: 46px; line-height: 1; }

/* Bandeau d'accueil : signature et bouton secondaire */
.dd-signature { font-family: var(--dd-font-titre); font-weight: 700; font-size: 20px; letter-spacing: .02em; color: var(--dd-sarcelle); text-align: left !important; }
.nft-hero h1 .text-green { display: block; }
.dd-btn-ghost-light { border: 2px solid rgba(253, 229, 201, .7); color: var(--dd-sur-marine) !important; background: transparent; }
.dd-btn-ghost-light:hover { background: rgba(253, 229, 201, .12); }

/* En-tête des pages produits */
.dd-page-hero { padding-top: 170px !important; }
.dd-page-sub { font-family: var(--dd-font-titre); font-weight: 700; font-size: clamp(20px, 2.4vw, 28px); color: var(--dd-sarcelle-texte); text-align: left !important; }
.dd-page-hero .text-center .dd-page-sub { text-align: center !important; }
.dd-hero-img { width: 100%; max-height: 520px; object-fit: cover; object-position: 50% 15%; border-radius: 16px; box-shadow: 0 22px 50px rgba(0, 36, 60, .22); }

/* Cartes des deux outils */
.dd-tool-card { display: flex; flex-direction: column; height: 100%; border-radius: 16px; overflow: hidden; background: var(--dd-creme-claire); box-shadow: 0 1px 0 rgba(0,36,60,.08), 0 14px 34px rgba(0,36,60,.10); }
.dd-tool-card img[src*="dd-client.jpg"].dd-tool-img { object-position: 50% 62%; }
.dd-tool-card img[src*="dd-client-mystere"].dd-tool-img { object-position: 50% 50%; }
.dd-tool-card img.dd-tool-img { width: 100% !important; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 24%; max-height: none !important; box-shadow: none !important; border-radius: 0 !important; }
.dd-tool-body { padding: 26px 28px 30px; display: flex; flex-direction: column; flex: 1; }
.dd-tool-body h3 { font-size: 28px; }
.dd-tool-body .btn { align-self: flex-start; margin-top: auto; }

/* Listes avec coches */
.dd-check { list-style: none; padding: 0; margin: 0 0 22px; }
.dd-check li { position: relative; padding-left: 30px; margin: 8px 0; text-align: left !important; }
.dd-check li::before { content: "\2713"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--dd-sarcelle); color: var(--dd-marine); font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.dd-check-lg li { font-size: 17px; margin: 14px 0; }

/* Étapes */
.dd-step { height: 100%; padding: 26px; border-radius: 14px; background: var(--dd-creme-claire); box-shadow: 0 1px 0 rgba(0,36,60,.08), 0 10px 26px rgba(0,36,60,.08); }
.dd-step-n { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--dd-marine); color: var(--dd-sarcelle); font-family: var(--dd-font-donnee); font-size: 20px; margin-bottom: 14px; }
.dd-step p { text-align: left !important; margin-bottom: 0; }

/* Tableaux comparatifs */
.dd-cmp { width: 100%; border-collapse: separate; border-spacing: 0; border-radius: 12px; overflow: hidden; background: var(--dd-creme-claire); box-shadow: 0 10px 26px rgba(0,36,60,.08); }
.dd-cmp th { background: var(--dd-marine); color: var(--dd-sur-marine); padding: 12px 16px; font-family: var(--dd-font-titre); font-size: 17px; }
.dd-cmp td { padding: 12px 16px; border-top: 1px solid var(--dd-filet); }
.dd-cmp td:first-child { color: var(--dd-encre-douce); }
.dd-cmp td:last-child { font-weight: 600; }
.dd-cmp-plans td:not(:first-child), .dd-cmp-plans th:not(:first-child) { text-align: center; }
.dd-cmp-plans td:first-child { color: var(--dd-encre); }
.dd-cmp .ri-check-line { color: var(--dd-sarcelle-texte); font-size: 22px; }
.dd-cmp .ri-close-line { color: var(--dd-bordure); font-size: 20px; }

/* Exemple de résultats */
.dd-example { padding: 24px; border-radius: 14px; background: var(--dd-creme-claire); box-shadow: 0 10px 26px rgba(0,36,60,.08); }
.dd-example-row { display: grid; grid-template-columns: 150px 1fr 40px; gap: 12px; align-items: center; margin: 10px 0; }
.dd-example-row b { font-family: var(--dd-font-donnee); text-align: right; }
.dd-example-bar { height: 12px; border-radius: 6px; background: rgba(0,36,60,.08); overflow: hidden; }
.dd-example-bar i { display: block; height: 100%; background: var(--dd-sarcelle); border-radius: 6px; }
.dd-example-bar.is-low i { background: var(--dd-attention); }
.dd-example-comment { margin: 16px 0 6px; font-style: italic; text-align: left !important; }
.dd-example-note { margin: 0; font-size: 12px; color: var(--dd-encre-douce); }

/* Questions fréquentes */
.dd-faq { max-width: 820px; margin: 0 auto; }
.dd-faq-item { border-radius: 12px; background: var(--dd-creme-claire); margin-bottom: 12px; box-shadow: 0 6px 18px rgba(0,36,60,.06); }
.dd-faq-item summary { cursor: pointer; padding: 16px 20px; font-weight: 700; list-style: none; position: relative; padding-right: 48px; }
.dd-faq-item summary::-webkit-details-marker { display: none; }
.dd-faq-item summary::after { content: "+"; position: absolute; right: 20px; top: 12px; font-size: 22px; color: var(--dd-sarcelle-texte); }
.dd-faq-item[open] summary::after { content: "\2212"; }
.dd-faq-item p { padding: 0 20px 18px; margin: 0; }

/* Note « sources » */
.dd-note-card { padding: 26px 28px; border-radius: 14px; background: var(--dd-marine); color: var(--dd-sur-marine); }
.dd-note-card h3 { color: var(--dd-sur-marine); }
.dd-note-card p { color: rgba(253,229,201,.9); }

/* Cartes d'abonnement */
.dd-plan { height: 100%; display: flex; flex-direction: column; padding: 30px; border-radius: 16px; background: var(--dd-creme-claire); border: 2px solid var(--dd-filet); box-shadow: 0 12px 30px rgba(0,36,60,.10); }
.dd-plan.is-featured { border-color: var(--dd-sarcelle); }
.dd-plan .btn { margin-top: auto; }
.dd-plan .dd-offer-pill { align-self: flex-start; }
.dd-plan-price { display: flex; flex-direction: column; margin: 10px 0 4px; }
.dd-plan-now { font-family: var(--dd-font-donnee); font-size: 34px; color: var(--dd-sarcelle-texte); line-height: 1.1; }
.dd-plan-then { font-size: 15px; color: var(--dd-encre-douce); }

/* Page d'inscription : rappel de l'offre sous le récapitulatif */
.dd-sub-offer { padding: 14px 16px; border-radius: 10px; background: var(--dd-sarcelle); color: var(--dd-marine); font-size: 14px; }
.dd-sub-offer div { text-align: left !important; }

/* --- Export PDF de l'espace connecté (bouton « Télécharger en PDF », dd-pdf.js) ----
   Seulement pendant l'export (classe dd-printing) : Ctrl+P garde son comportement habituel. */
.dd-print-head { display: none; }
@media print {
    @page { size: A4; margin: 12mm; }
    body.dd-printing, body.dd-printing * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    body.dd-printing { background: #fff !important; }
    body.dd-printing #page-topbar, body.dd-printing .app-menu, body.dd-printing .navbar-menu, body.dd-printing .vertical-overlay,
    body.dd-printing .footer, body.dd-printing #back-to-top, body.dd-printing .dd-no-print, body.dd-printing .btn,
    body.dd-printing .alert, body.dd-printing .dropdown-menu, body.dd-printing select, body.dd-printing .tooltip,
    body.dd-printing #preloader, body.dd-printing .customizer-setting,
    body.dd-printing #navbar, body.dd-printing .dd-offer-bar, body.dd-printing .dd-offer-band, body.dd-printing .layout-wrapper > footer { display: none !important; }
    body.dd-printing .layout-wrapper .my-5 { margin-top: 0 !important; }
    body.dd-printing .main-content { margin-left: 0 !important; width: 100% !important; }
    body.dd-printing .page-content { padding: 0 !important; margin: 0 !important; }
    body.dd-printing .container-fluid { padding: 0 !important; max-width: none !important; }
    body.dd-printing .col-md-8 { flex: 0 0 100%; max-width: 100%; }
    body.dd-printing .card { box-shadow: none !important; border: 1px solid var(--dd-filet) !important; break-inside: avoid; }
    body.dd-printing .collapse { display: block !important; height: auto !important; }
    body.dd-printing .overlay-enabled::after, body.dd-printing .overlay-enabled::before { display: none !important; }
    body.dd-printing a[href]::after { content: none !important; }
    body.dd-printing .dd-print-head { display: grid !important; gap: 2px; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 3px solid var(--dd-sarcelle); }
    body.dd-printing .dd-print-brand { font-family: var(--dd-font-titre); font-weight: 800; font-size: 26px; letter-spacing: .04em; color: var(--dd-marine); }
    body.dd-printing .dd-print-title { font-family: var(--dd-font-titre); font-weight: 700; font-size: 20px; color: var(--dd-marine); }
    body.dd-printing .dd-print-sub { font-weight: 700; color: var(--dd-marine); }
    body.dd-printing .dd-print-sub:empty { display: none; }
    body.dd-printing .dd-print-meta { font-size: 12px; color: var(--dd-encre-douce); }
}
/* --- Avatar de l'utilisateur dans l'en-tête : initiale par défaut, photo par-dessus si elle existe */
.dd-avatar {
    position: relative; display: inline-flex; align-items: center; justify-content: center; flex: none;
    width: 36px; height: 36px; border-radius: 50%; overflow: hidden;
    background: var(--dd-marine); color: var(--dd-sarcelle);
    font-family: var(--dd-font-titre); font-weight: 800; font-size: 18px; line-height: 1;
}
.dd-avatar-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dd-avatar { font-size: 15px; letter-spacing: .02em; box-shadow: 0 0 0 2px var(--dd-creme-claire); }
/* Bloc utilisateur de l'en-tête : sans fond gris, pastille discrète au survol */
.topbar-user { background: transparent !important; }
.topbar-user > .btn { border-radius: 999px; padding: 4px 14px 4px 4px; border: 0; transition: background-color .15s; }
.topbar-user > .btn:hover, .topbar-user > .btn[aria-expanded="true"] { background: rgba(0,36,60,.07); }
.topbar-user .user-name-text { color: var(--dd-marine); font-weight: 700; font-size: 14px; line-height: 1.15; }
.topbar-user .user-name-sub-text { color: var(--dd-encre-douce); font-size: 12px !important; line-height: 1.2; }

/* --- Accueil : les deux besoins, les deux produits, le Pack (oct. 2026) ------- */
.dd-counter-bridge { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid rgba(253,229,201,.18); font-family: var(--dd-font-titre); font-weight: 700; font-size: 19px; line-height: 1.2; color: var(--dd-sur-marine); text-align: left !important; hyphens: manual !important; }
.dd-hero-counter .dd-counter-source { margin-top: 10px; }
.dd-need { display: flex; flex-direction: column; gap: 10px; height: 100%; padding: 28px; border-radius: 16px; background: var(--dd-creme-claire); color: var(--dd-marine); text-decoration: none; box-shadow: 0 1px 0 rgba(0,36,60,.08), 0 14px 34px rgba(0,36,60,.08); border: 2px solid transparent; transition: border-color .15s, transform .15s; }
.dd-need:hover { border-color: var(--dd-sarcelle); transform: translateY(-2px); color: var(--dd-marine); }
.dd-need h3 { font-size: 30px; margin: 0; }
.dd-need p { margin: 0; color: var(--dd-encre-douce); }
.dd-need-icon { width: 52px; height: 52px; border-radius: 50%; background: var(--dd-marine); color: var(--dd-sarcelle); display: inline-flex; align-items: center; justify-content: center; font-size: 26px; }
.dd-need-answer { margin-top: auto; padding-top: 6px; font-weight: 800; color: var(--dd-sarcelle-texte); }
.dd-tool-for { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--dd-sarcelle-texte); margin-bottom: 4px; }
.dd-tool-actions { margin-top: auto; display: flex; flex-wrap: wrap; gap: 10px; }
.dd-tool-body .dd-tool-actions .btn { margin-top: 0; }
.dd-pack { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; padding: 26px 30px; border-radius: 16px; background: var(--dd-marine); color: var(--dd-sur-marine); box-shadow: 0 18px 40px rgba(0,36,60,.2); }
.dd-pack-logos { display: flex; align-items: center; gap: 8px; font-size: 30px; color: var(--dd-sarcelle); }
.dd-pack-logos span { font-family: var(--dd-font-titre); font-weight: 800; color: var(--dd-sur-marine); }
.dd-pack-text { flex: 1 1 320px; }
.dd-pack-text h3 { color: var(--dd-sur-marine); margin: 0 0 4px; }
.dd-pack-text p { margin: 0; color: rgba(253,229,201,.85); text-align: left !important; }
.dd-hero-note { font-size: 14px; color: var(--dd-encre-douce); text-align: left !important; }
.dd-sold { font-weight: 700; color: var(--dd-sarcelle-texte); text-align: left !important; }
.dd-principle-intro { max-width: 760px; margin-left: auto; margin-right: auto; text-align: center !important; }
.dd-plan { position: relative; }
.dd-plan-best { position: absolute; top: -14px; right: 20px; padding: 4px 12px; border-radius: 999px; background: var(--dd-marine); color: var(--dd-sarcelle); font-size: 13px; font-weight: 800; letter-spacing: .02em; }

/* --- Accueil : les deux produits mis en avant dans le bandeau ------------- */
.dd-hero-products { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 4px 0 18px; }
.dd-hero-product { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: rgba(0, 36, 60, .72); border: 1px solid rgba(10, 177, 165, .55); text-decoration: none; transition: border-color .15s, background .15s, transform .15s; }
.dd-hero-product:hover { border-color: var(--dd-sarcelle); background: rgba(0, 36, 60, .9); transform: translateY(-2px); }
.dd-hero-product-icon { flex: none; width: 42px; height: 42px; border-radius: 50%; background: var(--dd-sarcelle); color: var(--dd-marine); display: inline-flex; align-items: center; justify-content: center; font-size: 22px; }
.dd-hero-product-text { display: grid; gap: 2px; }
.dd-hero-product-name { white-space: nowrap; font-family: var(--dd-font-titre); font-weight: 800; font-size: clamp(20px, 1.9vw, 26px); line-height: 1; text-transform: uppercase; letter-spacing: .02em; color: var(--dd-sarcelle); }
.dd-hero-product-desc { font-size: 14px; line-height: 1.35; color: rgba(253, 229, 201, .92); }
@media (max-width: 575.98px) { .dd-hero-products { grid-template-columns: 1fr; } }

/* ==========================================================================
   Deux produits, deux identités (oct. 2026)
   Mystery Guest = bordeaux (l'expérience du client) · Benchmark = pétrole (les chiffres).
   La marque Dinner Data (marine, crème, logo) reste commune.
   ========================================================================== */
:root {
    --dd-mg: #7b2338;  --dd-mg-fonce: #5e1729;  --dd-mg-teinte: #f8e4e8;
    --dd-bm: #055966;  --dd-bm-fonce: #03434d;  --dd-bm-teinte: #d9f0ec;
}
.dd-mg { --dd-prod: var(--dd-mg); --dd-prod-fonce: var(--dd-mg-fonce); --dd-prod-teinte: var(--dd-mg-teinte); }
.dd-bm { --dd-prod: var(--dd-bm); --dd-prod-fonce: var(--dd-bm-fonce); --dd-prod-teinte: var(--dd-bm-teinte); }

/* Portes d'entrée (accueil) */
.dd-doors { background: var(--dd-marine); padding: 8px 0 56px; }
.dd-door { display: flex; flex-direction: column; gap: 14px; height: 100%; min-height: 300px; padding: 30px; border-radius: 20px; background: var(--dd-prod); color: #fff4e6 !important; text-decoration: none; box-shadow: 0 22px 46px rgba(0, 0, 0, .28); transition: transform .15s, box-shadow .15s; }
.dd-door:hover { transform: translateY(-3px); box-shadow: 0 28px 56px rgba(0, 0, 0, .34); }
.dd-prod-mark { display: flex; align-items: center; gap: 14px; }
.dd-prod-mark > span:last-child { display: flex; flex-direction: column; }
.dd-prod-icon { flex: none; width: 54px; height: 54px; border-radius: 16px; background: #fff4e6; color: var(--dd-prod); display: inline-flex; align-items: center; justify-content: center; font-size: 28px; }
.dd-prod-name { font-family: var(--dd-font-titre); font-weight: 900; font-size: clamp(34px, 3.4vw, 46px); line-height: .95; text-transform: uppercase; white-space: nowrap; }
.dd-prod-by { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; opacity: .8; }
.dd-door-q { font-family: var(--dd-font-titre); font-weight: 700; font-size: 28px; line-height: 1.1; }
.dd-door-x { font-size: 16px; line-height: 1.5; opacity: .92; }
.dd-door-foot { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.dd-door-price { font-family: var(--dd-font-donnee); font-size: 15px; }
.dd-door-cta { padding: 12px 20px; border-radius: 10px; background: #fff4e6; color: var(--dd-prod); font-weight: 800; }
.dd-pack-strip { margin-top: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; padding: 18px 22px; border-radius: 16px; border: 1px solid rgba(253, 229, 201, .28); color: var(--dd-sur-marine) !important; text-decoration: none; }
a.dd-pack-strip:hover { border-color: var(--dd-sarcelle); }
.dd-pack-chips { display: inline-flex; border-radius: 999px; overflow: hidden; font-family: var(--dd-font-titre); font-weight: 800; font-size: 16px; text-transform: uppercase; }
.dd-pack-chips span { padding: 6px 12px; background: var(--dd-prod); color: #fff4e6; }
.dd-pack-strip-text { flex: 1 1 320px; font-size: 16px; }
.dd-pack-strip-cta { padding: 10px 18px; border-radius: 10px; background: var(--dd-sarcelle); color: var(--dd-marine); font-weight: 800; }

/* Bandes produit (accueil) */
.dd-band { background: var(--dd-prod); color: #fff4e6; padding: 80px 0; }
.dd-band-kicker { display: block; font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; opacity: .85; margin-bottom: 10px; }
.dd-band .dd-band-title { font-family: var(--dd-font-titre); font-weight: 900; font-size: clamp(48px, 6vw, 76px); line-height: .9; text-transform: uppercase; color: #fff4e6 !important; margin: 0 0 16px; }
.dd-band .dd-band-title::after { display: none; }
.dd-band .dd-band-text { font-size: 18px; line-height: 1.55; color: #fff4e6; text-align: left !important; hyphens: manual !important; }
.dd-band-list { list-style: none; padding: 0; margin: 18px 0 26px; display: grid; gap: 8px; }
.dd-band-list li { position: relative; padding-left: 30px; font-size: 16px; text-align: left !important; }
.dd-band-list li::before { content: "\2713"; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: #fff4e6; color: var(--dd-prod); font-size: 12px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.dd-band-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.dd-band-btn { display: inline-flex; align-items: center; gap: 6px; padding: 13px 22px; border-radius: 10px; background: #fff4e6; color: var(--dd-prod) !important; font-weight: 800; text-decoration: none; border: 2px solid #fff4e6; }
.dd-band-btn:hover { background: #ffffff; }
.dd-band-btn.ghost { background: transparent; color: #fff4e6 !important; }
.dd-band-btn.ghost:hover { background: rgba(255, 244, 230, .12); }
.dd-viz { background: #fff4e6; color: var(--dd-marine); border-radius: 18px; padding: 26px; display: grid; gap: 14px; box-shadow: 0 24px 50px rgba(0, 0, 0, .25); }
.dd-viz-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 17px; }
.dd-viz-score { font-family: var(--dd-font-donnee); font-size: 26px; color: var(--dd-prod); }
.dd-viz-row { display: grid; grid-template-columns: 130px minmax(0, 1fr) 40px; gap: 10px; align-items: center; font-size: 14px; }
.dd-viz-bar { height: 10px; border-radius: 6px; background: #f1dcc3; overflow: hidden; }
.dd-viz-bar span { display: block; height: 100%; background: var(--dd-prod); border-radius: 6px; }
.dd-viz-v { font-family: var(--dd-font-donnee); text-align: right; }
.dd-viz-quote { margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--dd-prod-teinte); font-size: 14px; font-style: italic; text-align: left !important; }
.dd-viz-note { font-size: 12px; color: var(--dd-encre-douce); }
.dd-viz-pos { display: grid; gap: 6px; font-size: 14px; }
.dd-viz-track { position: relative; height: 14px; border-radius: 8px; background: #f1dcc3; }
.dd-viz-mid { position: absolute; top: 0; bottom: 0; left: 30%; width: 40%; border-radius: 8px; background: #e6c9a6; }
.dd-viz-dot { position: absolute; top: -4px; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; background: var(--dd-prod); border: 3px solid #fff4e6; box-sizing: border-box; }
@media (max-width: 575.98px) {
    .dd-door { padding: 24px; min-height: 0; }
    .dd-prod-name { font-size: 30px; white-space: normal; }
    .dd-band { padding: 56px 0; }
    .dd-viz-row { grid-template-columns: 100px minmax(0, 1fr) 36px; }
}

/* Menu du site : un point de couleur par produit */
#LMystery, #LDatabase { display: inline-flex !important; align-items: center; gap: 7px; }
#LMystery::before, #LDatabase::before { content: ""; width: 9px; height: 9px; border-radius: 50%; flex: none; }
#LMystery::before { background: var(--dd-mg); }
#LDatabase::before { background: var(--dd-bm); }
#LMystery.active { box-shadow: inset 0 -3px 0 var(--dd-mg) !important; }
#LDatabase.active { box-shadow: inset 0 -3px 0 var(--dd-bm) !important; }

/* Pages produits : bandeau à la couleur du produit */
.dd-prod-hero { position: relative; background: linear-gradient(var(--dd-prod-teinte), var(--dd-prod-teinte)); }
.dd-prod-hero::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--dd-prod); }
.dd-prod-hero h1 { color: var(--dd-prod) !important; }
.dd-prod-hero h1::after { background: var(--dd-prod) !important; }
.dd-prod-hero .btn-success1 { background: var(--dd-prod) !important; border-color: var(--dd-prod) !important; color: #fff4e6 !important; }
.dd-prod-hero .btn-outline-primary { color: var(--dd-prod) !important; border-color: var(--dd-prod) !important; }
.dd-prod-hero .btn-outline-primary:hover { background: var(--dd-prod) !important; color: #fff4e6 !important; }
.dd-prod-hero .dd-sold { color: var(--dd-prod); }
.dd-prod-badge { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 6px; border-radius: 999px; background: var(--dd-prod); color: #fff4e6; font-family: var(--dd-font-titre); font-weight: 800; font-size: 15px; text-transform: uppercase; letter-spacing: .04em; }
.dd-prod-badge i { width: 26px; height: 26px; border-radius: 50%; background: #fff4e6; color: var(--dd-prod); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }

/* Tarifs : chaque carte à la couleur de son produit */
.dd-plan.dd-mg, .dd-plan.dd-bm { border-top: 8px solid var(--dd-prod); }
.dd-plan.dd-mg h3, .dd-plan.dd-bm h3 { color: var(--dd-prod); }
.dd-plan.dd-mg .btn-primary, .dd-plan.dd-bm .btn-primary { background: var(--dd-prod) !important; border-color: var(--dd-prod) !important; color: #fff4e6 !important; }
.dd-cmp th.dd-mg, .dd-cmp th.dd-bm { background: var(--dd-prod) !important; color: #fff4e6 !important; }

/* Espace connecté : icônes du menu à la couleur du produit */

/* Rapports PDF : filet de couleur selon le produit */
body.dd-printing .dd-print-head.dd-print-evaluation, body.dd-printing .dd-print-head.dd-print-results { border-bottom-color: var(--dd-mg) !important; }
body.dd-printing .dd-print-head.dd-print-evaluation .dd-print-title, body.dd-printing .dd-print-head.dd-print-results .dd-print-title { color: var(--dd-mg); }

/* --- Accueil : « Dans le noir / à la lumière » (curseur avant / après) ------- */
.dd-lumiere { position: relative; border-radius: 18px; overflow: hidden; box-shadow: 0 26px 56px rgba(0, 0, 0, .4); user-select: none; touch-action: pan-y; }
.dd-lumiere-off { filter: grayscale(1) blur(2.5px); opacity: .9; }
.dd-lumiere-off .dd-dash { background: #c9c3bb; }
.dd-lumiere-on { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
.dd-lumiere-handle { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 3px; margin-left: -1.5px; background: #fff4e6; pointer-events: none; }
.dd-lumiere-handle i { position: absolute; top: 50%; left: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px; border-radius: 50%; background: #fff4e6; color: var(--dd-marine); display: flex; align-items: center; justify-content: center; font-size: 22px; box-shadow: 0 6px 16px rgba(0, 0, 0, .35); }
.dd-lumiere-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; -webkit-appearance: none; appearance: none; }
.dd-lumiere-range:focus-visible + .dd-lumiere-handle, .dd-lumiere:focus-within .dd-lumiere-handle i { outline: 3px solid var(--dd-sarcelle); outline-offset: 2px; }
.dd-lumiere-tag { position: absolute; top: 12px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: .04em; pointer-events: none; }
.dd-lumiere-tag-on { left: 12px; background: var(--dd-sarcelle); color: var(--dd-marine); }
.dd-lumiere-tag-off { right: 12px; background: rgba(0, 36, 60, .75); color: #fff4e6; }
.dd-lumiere-hint { margin: 12px 0 0; font-size: 14px; color: rgba(253, 229, 201, .85); text-align: center !important; }
.dd-dash { background: #fff4e6; color: var(--dd-marine); padding: 52px 22px 22px; display: grid; gap: 14px; }
.dd-dash-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: 15px; }
.dd-dash-ex { font-size: 11px; color: var(--dd-encre-douce); }
.dd-dash-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dd-dash-tile { border-radius: 12px; padding: 12px 14px; background: var(--dd-prod); color: #fff4e6; display: grid; gap: 2px; }
.dd-dash-prod { font-family: var(--dd-font-titre); font-weight: 800; font-size: 14px; text-transform: uppercase; letter-spacing: .04em; opacity: .9; }
.dd-dash-big { font-family: var(--dd-font-titre); font-weight: 900; font-size: 36px; line-height: 1; }
.dd-dash-big small { font-size: 16px; font-weight: 700; opacity: .8; }
.dd-dash-sub { font-size: 12px; opacity: .85; }
.dd-dash-rows { display: grid; gap: 8px; }
.dd-dash-row { display: grid; grid-template-columns: 82px minmax(0, 1fr) 30px; gap: 8px; align-items: center; font-size: 13px; }
.dd-dash-bar { height: 8px; border-radius: 5px; background: #f1dcc3; overflow: hidden; }
.dd-dash-bar span { display: block; height: 100%; border-radius: 5px; background: var(--dd-prod); }
.dd-dash-v { font-family: var(--dd-font-donnee); font-size: 13px; text-align: right; }
.dd-dash-pos { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 8px; align-items: center; font-size: 13px; }
.dd-dash-track { position: relative; height: 10px; border-radius: 6px; background: #f1dcc3; }
.dd-dash-mid { position: absolute; top: 0; bottom: 0; left: 30%; width: 40%; border-radius: 6px; background: #e6c9a6; }
.dd-dash-dot { position: absolute; top: -4px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: var(--dd-prod); border: 3px solid #fff4e6; box-sizing: border-box; }
@media (max-width: 991.98px) { .dd-lumiere { margin-top: 8px; } }
.dd-hero-img.dd-hero-img-bm { aspect-ratio: 379 / 391; height: auto; object-position: 50% 50%; max-width: 560px; }

/* --- Textes juridiques (confidentialité, conditions générales, mentions légales) */
.dd-legal { max-width: 860px; margin: 0 auto; padding: 36px 40px; border-radius: 16px; background: var(--dd-creme-claire); box-shadow: 0 1px 0 rgba(0,36,60,.08), 0 14px 34px rgba(0,36,60,.08); }
.dd-legal h2 { font-size: 24px; margin: 30px 0 10px; }
.dd-legal h2::after { display: none !important; }
.dd-legal h2:first-child { margin-top: 0; }
.dd-legal p, .dd-legal li { font-size: 16px; line-height: 1.65; }
.dd-legal ul, .dd-legal ol { padding-left: 22px; display: grid; gap: 6px; }
.dd-legal-meta { font-size: 14px !important; color: var(--dd-encre-douce); }
@media (max-width: 575.98px) { .dd-legal { padding: 24px 20px; } }
.dd-plan-cancel { display: block; margin-top: 6px; font-size: 13px; font-weight: 700; color: var(--dd-sarcelle-texte); }
.dd-accept { text-align: left; }
.dd-accept .form-check-label { font-size: 14px; }
.dd-accept a { text-decoration: underline; }

/* --- Mystery Guest : page de fin de questionnaire (évaluateur) */
.dd-thanks { max-width: 620px; margin: 0 auto; padding: 40px 32px; border-radius: 18px; background: var(--dd-creme-claire); box-shadow: 0 14px 34px rgba(0,36,60,.1); border-top: 6px solid var(--dd-prod); text-align: center; display: grid; gap: 14px; justify-items: center; }
.dd-thanks-icon { width: 72px; height: 72px; border-radius: 50%; background: var(--dd-prod-teinte); color: var(--dd-prod); display: inline-flex; align-items: center; justify-content: center; font-size: 38px; }
.dd-thanks h1 { font-size: clamp(28px, 4vw, 40px); margin: 0; color: var(--dd-prod) !important; }
.dd-thanks h1::after { display: none !important; }
.dd-thanks p { margin: 0; font-size: 17px; text-align: center !important; }
.dd-thanks-close { font-size: 14px !important; color: var(--dd-encre-douce); }

/* Logo de la barre latérale : version claire, plus grande, non rognée */
.navbar-menu .navbar-brand-box.dd-brand { height: auto !important; padding-top: 18px !important; padding-bottom: 10px !important; line-height: 1 !important; }
.navbar-brand-box.dd-brand .logo-lg img { width: 170px !important; max-width: 85% !important; height: auto !important; display: block; }
.navbar-brand-box.dd-brand .logo-sm img { width: 36px !important; height: auto !important; }

/* --- Menu latéral de l'espace connecté (charte : marine, crème, couleurs produit) --- */
.navbar-menu .dd-nav { padding: 4px 12px 24px !important; gap: 2px; }
.navbar-menu .dd-nav .menu-title { padding: 18px 12px 6px !important; margin: 0 !important; list-style: none; }
.navbar-menu .dd-nav .menu-title span, .navbar-menu .dd-nav .dd-group-btn { font-family: var(--dd-font-texte) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase; color: rgba(253, 229, 201, .62) !important; }
.navbar-menu .dd-nav .nav-link.menu-link {
    display: flex !important; align-items: center !important; gap: 0; min-height: 44px; padding: 8px 12px !important; border-radius: 8px !important;
    font-family: var(--dd-font-texte) !important; font-size: 15px !important; font-weight: 600 !important; color: rgba(253, 229, 201, .86) !important;
    background: transparent !important; transition: background .15s, color .15s; text-decoration: none !important;
}
.navbar-menu .dd-nav .nav-link.menu-link:hover { background: rgba(253, 229, 201, .08) !important; color: #fde5c9 !important; }
.navbar-menu .dd-nav .nav-link.menu-link:focus-visible { outline: 2px solid #fde5c9; outline-offset: 2px; }
.navbar-menu .dd-nav .dd-ico { flex: none; width: 30px; height: 30px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: rgba(253, 229, 201, .08); }
.navbar-menu .dd-nav .dd-ico i { font-size: 17px !important; line-height: 1 !important; color: #fde5c9 !important; margin: 0 !important; min-width: 0 !important; }
.navbar-menu .dd-nav .dd-prod-mg .dd-ico { background: var(--dd-mg); }
.navbar-menu .dd-nav .dd-prod-bm .dd-ico { background: var(--dd-bm); }
.navbar-menu .dd-nav .dd-tag { margin-left: auto; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 4px; background: rgba(253, 229, 201, .14); color: #fde5c9; }
/* Page ouverte : pastille crème, texte marine */
.navbar-menu .dd-nav .nav-link.menu-link.active { background: #fde5c9 !important; color: #00243c !important; }
.navbar-menu .dd-nav .nav-link.menu-link.active .dd-ico { background: #00243c; }
.navbar-menu .dd-nav .dd-prod-mg > .nav-link.active .dd-ico { background: var(--dd-mg); }
.navbar-menu .dd-nav .dd-prod-bm > .nav-link.active .dd-ico { background: var(--dd-bm); }
/* Flèche des rubriques dépliables */
.navbar-menu .dd-nav .nav-link[data-bs-toggle=collapse]::after { margin-left: auto !important; color: currentColor !important; opacity: .7; }
/* Sous-menu */
.navbar-menu .dd-nav .menu-dropdown .nav { padding: 4px 0 6px 54px !important; gap: 0; }
.navbar-menu .dd-nav .menu-dropdown .nav-link {
    position: relative; display: block; padding: 8px 10px !important; border-radius: 6px; font-family: var(--dd-font-texte) !important; font-size: 14px !important; font-weight: 500 !important;
    color: rgba(253, 229, 201, .72) !important; text-decoration: none !important; background: transparent !important;
}
.navbar-menu .dd-nav .menu-dropdown .nav-link::before { content: ""; position: absolute; left: -14px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: rgba(253, 229, 201, .3); }
.navbar-menu .dd-nav .menu-dropdown .nav-link:hover { color: #fde5c9 !important; background: rgba(253, 229, 201, .06) !important; }
.navbar-menu .dd-nav .menu-dropdown .nav-link.active { color: #fde5c9 !important; font-weight: 700 !important; }
.navbar-menu .dd-nav .menu-dropdown .nav-link.active::before { background: #fde5c9; width: 8px; height: 8px; margin-top: -4px; left: -15px; }
/* La rubrique parente d'une page ouverte reste lisible sans pastille pleine */
.navbar-menu .dd-nav .nav-link.menu-link.active[data-bs-toggle=collapse] { background: rgba(253, 229, 201, .1) !important; color: #fde5c9 !important; }
.navbar-menu .dd-nav .nav-link.menu-link.active[data-bs-toggle=collapse] .dd-ico { background: rgba(253, 229, 201, .12); }
.navbar-menu .dd-nav .dd-prod-mg > .nav-link.active[data-bs-toggle=collapse] .dd-ico { background: var(--dd-mg); }
.navbar-menu .dd-nav .dd-prod-bm > .nav-link.active[data-bs-toggle=collapse] .dd-ico { background: var(--dd-bm); }
/* Menu replié (icônes seules) */
[data-sidebar-size=sm] .navbar-menu .dd-nav .menu-title { display: none; }
[data-sidebar-size=sm] .navbar-menu .dd-nav .dd-tag { display: none; }

/* Icône séparée du texte, quel que soit l'affichage du thème */
.navbar-menu .dd-nav .nav-link.menu-link .dd-ico { margin-right: 14px !important; }
.navbar-menu .dd-nav .nav-link.menu-link .dd-ico + span { margin-left: 0 !important; }
/* Rubriques repliables */
.navbar-menu .dd-nav .dd-group { padding: 14px 4px 4px !important; }
.navbar-menu .dd-nav .dd-group-btn { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 32px; padding: 4px 8px; border: 0; border-radius: 6px; background: transparent; cursor: pointer; text-align: left;
    font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase; color: rgba(253, 229, 201, .62) !important; }
.navbar-menu .dd-nav .dd-group-btn:hover { color: #fde5c9 !important; background: rgba(253, 229, 201, .06); }
.navbar-menu .dd-nav .dd-group-btn:focus-visible { outline: 2px solid #fde5c9; outline-offset: 2px; }
.navbar-menu .dd-nav .dd-group-btn i { font-size: 16px; transition: transform .2s; }
.navbar-menu .dd-nav .dd-group.dd-closed .dd-group-btn i { transform: rotate(-90deg); }
.navbar-menu .dd-nav li[hidden] { display: none !important; }
.navbar-menu .dd-nav .menu-title .dd-group-btn i { display: inline-block !important; color: inherit !important; opacity: 1 !important; line-height: 1 !important; }

/* Pieds de page sur une seule ligne (texte réduit si nécessaire) */
.footer .dd-foot-line { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 16px; white-space: nowrap; font-size: clamp(9px, 0.92vw, 13px); }
.footer .dd-foot-line > span { white-space: nowrap; }
.footer .dd-foot-line a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 760px) { .footer .dd-foot-line .dd-foot-links { display: none; } .footer .dd-foot-line { justify-content: center; font-size: clamp(8px, 2.3vw, 12px); } }
.dd-foot-one { white-space: nowrap; font-size: clamp(8px, 2.3vw, 14px); }

/* Accueil : cartes chiffrées de même hauteur, libellés alignés à gauche */
.row > [class*="col-"]:has(> .card.card-animate) { display: flex; flex-direction: column; }
.row > [class*="col-"] > .card.card-animate { flex: 1 1 auto; }
.card-animate .text-uppercase { text-align: left !important; hyphens: manual; }
/* Boutons côte à côte, même hauteur */
.ddm .tools .dd-pdf-btn { min-height: 44px; display: inline-flex; align-items: center; border-radius: 8px; font-weight: 700; }

/* Menu du site : page ouverte en pastille (pas de soulignement, pour ne pas doubler la ligne du bandeau) */
.navbar-landing .navbar-nav .nav-item .nav-link { border-radius: 8px; padding-left: 12px !important; padding-right: 12px !important; transition: background .15s, color .15s; }
.navbar-landing .navbar-nav .nav-item .nav-link:hover { box-shadow: none !important; background: var(--dd-creme-soutenue); color: var(--dd-encre) !important; }
.navbar-landing .navbar-nav .nav-item .nav-link.active,
.navbar-landing .navbar-nav .nav-item .nav-link.active:hover { box-shadow: none !important; background: var(--dd-marine); color: var(--dd-creme) !important; }
#LMystery.active, #LMystery.active:hover { box-shadow: none !important; background: var(--dd-mg) !important; color: #fff4e6 !important; }
#LDatabase.active, #LDatabase.active:hover { box-shadow: none !important; background: var(--dd-bm) !important; color: #fff4e6 !important; }
#LMystery.active::before, #LDatabase.active::before { background: #fff4e6; }

/* --- Accueil : objection Mystery Guest, impact en francs --- */
.dd-band .dd-band-faq { margin: 4px 0 20px; padding: 14px 16px; border-left: 3px solid #fde5c9; background: rgba(253, 229, 201, .08); border-radius: 0 10px 10px 0; }
.dd-band .dd-band-faq strong { display: block; color: #fde5c9; font-size: 16px; margin-bottom: 4px; }
.dd-band .dd-band-faq p { margin: 0; color: #fff4e6; font-size: 15px; line-height: 1.55; }
.dd-bench-impact { margin-top: 4px; font-size: 14px; font-weight: 700; text-align: left !important; }
.dd-bench-impact.is-bad { color: var(--dd-attention); }
.dd-bench-impact.is-good { color: var(--dd-sarcelle-texte, #05766e); }
.dd-plan-save { display: block; margin-top: 4px; font-size: 14px; font-weight: 700; color: var(--dd-sarcelle-texte); }

/* Inscription : choix mensuel / annuel, nombre de restaurants, total */
.dd-bill { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dd-bill-opt { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border: 2px solid var(--dd-filet); border-radius: 12px; cursor: pointer; background: var(--dd-creme-claire); }
.dd-bill-opt input { position: absolute; opacity: 0; pointer-events: none; }
.dd-bill-opt:has(input:checked) { border-color: var(--dd-sarcelle); box-shadow: 0 0 0 1px var(--dd-sarcelle); }
.dd-bill-opt:has(input:focus-visible) { outline: 2px solid var(--dd-sarcelle); outline-offset: 2px; }
.dd-bill-name { font-weight: 600; color: var(--dd-marine); }
.dd-bill-price { font-size: 14px; color: var(--dd-encre-douce); }
.dd-bill-gift { align-self: flex-start; margin-top: 4px; padding: 2px 8px; border-radius: 999px; background: var(--dd-sarcelle); color: var(--dd-marine); font-size: 12px; font-weight: 600; }
.dd-qty { display: flex; align-items: center; gap: 6px; max-width: 170px; }
.dd-qty .form-control { -moz-appearance: textfield; }
.dd-qty .form-control::-webkit-inner-spin-button, .dd-qty .form-control::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.dd-sum-total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 12px; border-top: 1px dashed var(--dd-filet); }
.dd-sum-total { gap: 12px; }
.dd-sum-total b { font-family: var(--dd-font-donnee); font-size: 20px; color: var(--dd-marine); white-space: nowrap; }
@media (max-width: 420px) { .dd-bill { grid-template-columns: 1fr; } }

/* Tarifs : bascule mensuel / annuel */
.dd-billing-switch { display: inline-flex; padding: 4px; border-radius: 999px; background: var(--dd-creme-claire); border: 1px solid var(--dd-filet); gap: 4px; }
.dd-billing-switch button { border: 0; background: transparent; padding: 8px 18px; border-radius: 999px; font-weight: 600; color: var(--dd-encre-douce); }
.dd-billing-switch button.is-on { background: var(--dd-marine); color: #fff; }
.dd-billing-switch .dd-bill-gift { margin: 0 0 0 6px; vertical-align: middle; }
.dd-plan-supp { font-size: 13px; color: var(--dd-encre-douce); margin-top: 6px; }
[data-bill="year"] .dd-when-month, [data-bill="month"] .dd-when-year { display: none !important; }
/* Résumé d'inscription et cartes Tarifs : pas de texte justifié (grands blancs dans les lignes courtes) */
.dd-sum p, .dd-plan-supp, .dd-plan p { text-align: left !important; hyphens: manual !important; }

/* « Situez votre restaurant » : version condensée (libellé à gauche, petite case à droite) */
.dd-bench { max-width: 1040px; margin: 0 auto; }
.dd-bench > .card-body { padding: 20px 24px; }
.dd-bench-field { display: grid; grid-template-columns: 1fr 128px; gap: 12px; align-items: center; padding: 7px 0; border-bottom: 1px dashed var(--dd-filet); }
.dd-bench-field:last-child { border-bottom: 0; }
.dd-bench-field label { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--dd-marine); }
.dd-bench-field .form-control { height: 34px; padding: 4px 10px; text-align: right; font-size: 15px; }
.dd-bench-field .form-control::placeholder { color: rgba(0, 36, 60, .35); }
.dd-bench-results { min-height: 0; }
.dd-bench-empty { margin: 4px 0 0; padding: 14px 16px; border: 1px dashed var(--dd-filet); border-radius: 10px; font-size: 14px; }
.dd-bench-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 14px; padding: 12px 14px; }
.dd-bench-cta p { flex: 1 1 260px; margin: 0 !important; font-size: 14px; line-height: 1.4; }
.dd-bench-note, .dd-bench-note * { text-align: left !important; hyphens: manual !important; line-height: 1.45; }
@media (max-width: 420px) { .dd-bench-field { grid-template-columns: 1fr 104px; } }

/* Accueil : « Où vont 100 francs » (chiffres GastroSuisse) — remplace le tableau « avec / sans données » */
.dd-franc { background: var(--dd-creme-claire); color: var(--dd-marine); border-radius: 16px; padding: 22px 22px 16px; box-shadow: 0 18px 40px rgba(0, 0, 0, .28); }
.dd-franc-kicker { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--dd-encre-douce); }
.dd-franc-big { font-family: var(--dd-font-titre); font-size: 30px; line-height: 1.1; margin: 6px 0 16px; text-align: left !important; color: var(--dd-marine); }
.dd-franc-big strong { color: var(--dd-critique); }
.dd-franc-chart { margin-bottom: 14px; }
.dd-franc-row { display: grid; grid-template-columns: 74px 1fr; align-items: center; gap: 10px; margin-bottom: 8px; }
.dd-franc-lab { font-size: 13px; font-weight: 700; }
.dd-franc-bar { position: relative; display: flex; height: 28px; }
.dd-franc-seg { display: flex; align-items: center; justify-content: center; height: 100%; font-family: var(--dd-font-donnee); font-size: 13px; font-weight: 700; color: #fff4e6; transform-origin: left; animation: ddFrancGrow .9s ease-out both; }
.dd-franc-seg:first-child { border-radius: 6px 0 0 6px; }
.dd-franc-seg:last-of-type { border-radius: 0 6px 6px 0; }
.dd-franc-in { background: var(--dd-sarcelle); color: var(--dd-marine); border-radius: 6px !important; }
.dd-franc-goods { background: var(--dd-attention); }
.dd-franc-staff { background: var(--dd-petrole); animation-delay: .15s; }
.dd-franc-other { background: #8c6f4e; animation-delay: .3s; }
.dd-franc-fin { background: #4a3a2a; animation-delay: .45s; }
.dd-franc-src a { color: inherit; text-decoration: underline; }
.dd-franc-over { position: absolute; top: -6px; bottom: -6px; right: 0; border-left: 2px dashed var(--dd-critique); background: repeating-linear-gradient(135deg, rgba(161, 38, 27, .28) 0 4px, transparent 4px 8px); border-radius: 0 6px 6px 0; }
.dd-franc-loss { position: absolute; left: 100%; margin-left: 6px; top: 50%; transform: translateY(-50%); font-family: var(--dd-font-donnee); font-size: 13px; font-weight: 700; color: var(--dd-critique); white-space: nowrap; }
.dd-franc-row { padding-right: 30px; }
.dd-franc-lab.dd-mg, .dd-franc-lab.dd-bm { color: var(--dd-prod); border-left: 4px solid var(--dd-prod); padding-left: 6px; line-height: 1.1; }
.dd-franc-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 8px 0 0 84px; font-size: 12px; color: var(--dd-encre-douce); }
.dd-franc-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.dd-franc-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dd-franc-tool { display: block; padding: 10px 12px; border-radius: 10px; background: var(--dd-prod); color: #fff4e6 !important; text-decoration: none; transition: transform .15s; }
.dd-franc-tool:hover { transform: translateY(-2px); }
.dd-franc-name { display: block; font-family: var(--dd-font-titre); font-size: 17px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
.dd-franc-what { display: block; font-size: 13px; line-height: 1.35; text-align: left !important; }
.dd-franc-bridge { margin: 12px 0 10px; font-family: var(--dd-font-titre); font-weight: 700; font-size: 17px; line-height: 1.25; color: var(--dd-marine); text-align: left !important; hyphens: manual !important; }
.dd-franc-verb { display: block; margin: 2px 0 4px; font-weight: 700; font-size: 14px; line-height: 1.25; color: #fff; text-align: left !important; }
.dd-franc-ex { display: block; margin-top: 6px; padding-top: 6px; border-top: 1px solid rgba(255,244,230,.25); font-size: 12px; line-height: 1.35; font-style: italic; opacity: .92; text-align: left !important; }
.dd-franc-src { margin: 12px 0 0; font-size: 11px; line-height: 1.4; color: var(--dd-encre-douce); text-align: left !important; hyphens: manual !important; }
@keyframes ddFrancGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .dd-franc-seg { animation: none; } }
@media (max-width: 420px) { .dd-franc-tools { grid-template-columns: 1fr; } .dd-franc-big { font-size: 26px; } }

/* --- Choix de la langue : FR | EN (remplace les drapeaux) */
.dd-lang { display: inline-flex; align-items: center; gap: 2px; padding: 3px; margin-right: 8px; border-radius: 999px; background: rgba(0,36,60,.07); height: auto !important; }
.dd-lang-opt { display: inline-block; min-width: 34px; padding: 4px 9px; border-radius: 999px; font-family: var(--dd-font-titre); font-weight: 700; font-size: 13px; letter-spacing: .04em; line-height: 1.2; text-align: center; color: var(--dd-marine) !important; text-decoration: none; opacity: .7; transition: background-color .15s, opacity .15s; }
.dd-lang-opt:hover { opacity: 1; }
.dd-lang-opt.active { background: var(--dd-marine); color: var(--dd-creme-claire) !important; opacity: 1; }

/* Pied de page : présentation en texte justifié */
.dd-footer-about { max-width: 30rem; margin-bottom: .6rem; line-height: 1.55; text-align: left !important; hyphens: manual !important; -webkit-hyphens: manual; text-wrap: pretty; } /* aligné à gauche, sans coupure de mots (29.10.2026) */

/* --- Bandeau de confiance (Benchmark, Mystery Guest) */
.dd-trust { padding: 8px 0 40px; }
.dd-trust-box { position: relative; padding: 28px 32px; border-radius: 18px; background: var(--dd-marine); color: var(--dd-creme-claire); box-shadow: 0 18px 40px rgba(0,36,60,.18); overflow: hidden; }
.dd-trust-box::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 6px; background: var(--dd-sarcelle); }
.dd-trust-mg .dd-trust-box::before { background: var(--dd-mg, #7a2333); }
.dd-trust-head { display: flex; gap: 16px; align-items: center; margin-bottom: 20px; }
.dd-trust-shield { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 14px; background: rgba(253,229,201,.12); color: var(--dd-sarcelle); font-size: 28px; }
.dd-trust-head h2 { margin: 0; color: var(--dd-creme-claire); font-size: 28px; }
.dd-trust-head p { margin: 4px 0 0; color: rgba(253,229,201,.8); text-align: left !important; }
.dd-trust-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.dd-trust-list li { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border-radius: 12px; background: rgba(253,229,201,.07); }
.dd-trust-list i { flex: none; font-size: 22px; color: var(--dd-sarcelle); line-height: 1.1; }
.dd-trust-list strong { display: block; color: var(--dd-creme-claire); font-size: 15px; line-height: 1.25; margin-bottom: 3px; }
.dd-trust-list span { display: block; font-size: 13px; line-height: 1.4; color: rgba(253,229,201,.82); text-align: left !important; hyphens: manual !important; }
.dd-trust-link { display: inline-block; margin-top: 16px; color: var(--dd-sarcelle) !important; font-weight: 600; text-decoration: none; }
.dd-trust-link:hover { text-decoration: underline; }
@media (max-width: 991px) { .dd-trust-list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575px) { .dd-trust-list { grid-template-columns: 1fr; } .dd-trust-box { padding: 22px 18px 22px 24px; } .dd-trust-head h2 { font-size: 23px; } }

/* Bandeau de confiance dans le haut de page Benchmark (à la place de l'image) */
.dd-trust-compact { padding: 0; }
.dd-trust-compact .dd-trust-box { padding: 24px 24px 22px 28px; }
.dd-trust-compact .dd-trust-head { margin-bottom: 16px; }
.dd-trust-compact .dd-trust-head h2 { font-size: 25px; }
.dd-trust-compact .dd-trust-list { grid-template-columns: 1fr 1fr; gap: 10px; }
.dd-trust-compact .dd-trust-list li { padding: 12px; }
@media (max-width: 575px) { .dd-trust-compact .dd-trust-list { grid-template-columns: 1fr; } }
.dd-trust, .dd-trust * { text-align: left !important; hyphens: manual !important; }
.dd-trust-head h2::after, .dd-trust-head h2::before { display: none !important; content: none !important; }
.dd-trust-compact .dd-trust-head p { font-size: 15px; }

/* --- Exemple fictif de résultats Benchmark (accueil, page Benchmark) */
.dd-bx { gap: 16px; }
.dd-bx * { text-align: left !important; hyphens: manual !important; }
.dd-bx-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.dd-bx-head strong { display: block; font-size: 17px; }
.dd-bx-sub { display: block; font-size: 13px; color: var(--dd-encre-douce); margin-top: 2px; }
.dd-bx-badge { flex: none; padding: 3px 10px; border-radius: 999px; background: var(--dd-prod-teinte); color: var(--dd-prod); font-size: 12px; font-weight: 700; }
.dd-bx-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dd-bx-kpi { display: grid; gap: 2px; padding: 12px; border-radius: 12px; background: #fbeedd; }
.dd-bx-kl { font-size: 12px; color: var(--dd-encre-douce); }
.dd-bx-you { font-family: var(--dd-font-donnee); font-size: 22px; font-weight: 700; color: var(--dd-marine); }
.dd-bx-mkt { font-size: 12px; color: var(--dd-encre-douce); }
.dd-bx-mkt em { font-style: normal; font-weight: 700; margin-left: 4px; }
.dd-bx-mkt em.is-bad { color: var(--dd-critique); }
.dd-bx-mkt em.is-ok { color: var(--dd-prod); }
.dd-bx-block { display: grid; gap: 7px; }
.dd-bx-bt { font-size: 13px; font-weight: 700; color: var(--dd-marine); }
.dd-bx-row { display: grid; grid-template-columns: 150px minmax(0, 1fr) 30px; gap: 10px; align-items: center; font-size: 13px; }
.dd-bx-row .dd-viz-bar span { background: #9fc9c6; }
.dd-bx-you-row { font-weight: 700; }
.dd-bx-you-row .dd-viz-bar span { background: var(--dd-prod); }
.dd-bx-trend { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; height: 92px; align-items: end; }
.dd-bx-q { display: grid; gap: 4px; height: 100%; grid-template-rows: 1fr auto; }
.dd-bx-cols { display: flex; gap: 4px; align-items: flex-end; justify-content: center; height: 100%; }
.dd-bx-col { width: 16px; border-radius: 4px 4px 0 0; }
.dd-bx-col-you { background: var(--dd-prod); }
.dd-bx-col-mkt { background: #9fc9c6; }
.dd-bx-ql { font-size: 11px; color: var(--dd-encre-douce); text-align: center !important; }
.dd-bx-legend { display: flex; gap: 14px; font-size: 12px; color: var(--dd-encre-douce); }
.dd-bx-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.dd-bx-wrap { max-width: 640px; margin: 0 auto; }
@media (max-width: 575px) { .dd-bx-row { grid-template-columns: 110px minmax(0, 1fr) 26px; } .dd-bx-you { font-size: 19px; } }

/* Bandeau de confiance, version courte (haut de page Benchmark, sous le bouton) */
.dd-trust-mini { margin-top: 28px; padding: 18px 20px; border-radius: 14px; background: rgba(255,244,230,.75); border: 1px solid rgba(0,36,60,.08); max-width: 520px; }
.dd-trust-mini, .dd-trust-mini * { text-align: left !important; hyphens: manual !important; }
.dd-trust-mini-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.dd-trust-mini-head i { font-size: 24px; color: var(--dd-prod); }
.dd-trust-mini-head strong { font-family: var(--dd-font-titre); font-size: 20px; color: var(--dd-marine); }
.dd-trust-mini ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.dd-trust-mini li { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--dd-marine); }
.dd-trust-mini li i { font-size: 18px; color: var(--dd-prod); }
.dd-trust-mini a { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 600; color: var(--dd-prod) !important; text-decoration: none; }
.dd-trust-mini a:hover { text-decoration: underline; }
@media (max-width: 420px) { .dd-trust-mini ul { grid-template-columns: 1fr; } }

/* « Un chiffre seul ne dit rien » (accueil, bande Benchmark) */
.dd-ba { gap: 16px; }
.dd-ba * { text-align: left !important; hyphens: manual !important; }
.dd-ba-title { font-family: var(--dd-font-titre); font-size: 24px !important; line-height: 1.1; }
.dd-ba-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.dd-ba-tab { border: 1px solid #e3cfb4; background: transparent; color: var(--dd-encre-douce); border-radius: 999px; padding: 4px 12px; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s; }
.dd-ba-tab:hover { border-color: var(--dd-prod); color: var(--dd-prod); }
.dd-ba-tab.is-on { background: var(--dd-prod); border-color: var(--dd-prod); color: #fff; }
.dd-ba-panel { display: none; }
.dd-ba-panel.is-on { display: grid; gap: 4px; }
.dd-ba-label { font-size: 14px; color: var(--dd-encre-douce); }
.dd-ba-big { font-family: var(--dd-font-donnee); font-size: 44px; font-weight: 700; color: var(--dd-marine); line-height: 1.1; }
.dd-ba-stage { position: relative; min-height: 168px; margin-top: 10px; }
.dd-ba-alone, .dd-ba-market { position: absolute; inset: 0; transition: opacity .5s ease; }
.dd-ba-alone { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: 14px; background: #fbeedd; border: 2px dashed #e3cfb4; font-size: 16px; font-weight: 600; color: var(--dd-encre-douce); }
.dd-ba-qm { flex: none; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #f1dcc3; font-family: var(--dd-font-titre); font-size: 34px; font-weight: 700; color: var(--dd-marine); text-align: center !important; }
.dd-ba-market { opacity: 0; pointer-events: none; padding-top: 30px; }
.dd-ba[data-step="1"] .dd-ba-alone { opacity: 1; }
.dd-ba[data-step="2"] .dd-ba-alone { opacity: 0; pointer-events: none; }
.dd-ba[data-step="2"] .dd-ba-market { opacity: 1; pointer-events: auto; }
.dd-ba-scale { position: relative; height: 14px; }
.dd-ba-track { position: absolute; inset: 0; border-radius: 8px; background: linear-gradient(90deg, #d9f0ec, #9fc9c6 50%, #d9f0ec); }
.dd-ba-avg { position: absolute; top: -6px; bottom: -6px; width: 2px; margin-left: -1px; background: var(--dd-marine); }
.dd-ba-avg em { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 4px; white-space: nowrap; font-style: normal; font-size: 11px; color: var(--dd-encre-douce); text-align: center !important; line-height: 1.2; }
.dd-ba-avg em b { color: var(--dd-marine); font-family: var(--dd-font-donnee); }
.dd-ba-dot { position: absolute; top: 50%; left: 0; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; background: var(--dd-prod); border: 3px solid #fff4e6; box-shadow: 0 2px 8px rgba(0,36,60,.35); transition: left 1.1s cubic-bezier(.2,.8,.2,1) .25s; }
.dd-ba-dot.is-bad { background: var(--dd-critique); }
.dd-ba[data-step="2"] .dd-ba-dot { left: var(--to); }
.dd-ba-dot em { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); margin-top: 4px; font-style: normal; font-size: 12px; font-weight: 700; color: var(--dd-marine); }
.dd-ba-ends { display: flex; justify-content: space-between; margin-top: 26px; font-size: 11px; color: var(--dd-encre-douce); line-height: 1.2; }
.dd-ba-ends span:last-child, .dd-ba-ends span:last-child * { text-align: right !important; }
.dd-ba-ends b { font-family: var(--dd-font-donnee); color: var(--dd-marine); }
.dd-ba-verdict { margin: 10px 0 0; padding: 10px 14px; border-radius: 10px; background: var(--dd-prod-teinte); font-size: 14px; font-weight: 700; color: var(--dd-prod); }
.dd-ba-verdict.is-bad { background: #f8e4e1; color: var(--dd-critique); }
.dd-ba-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: var(--dd-encre-douce); }
.dd-ba-steps span { display: inline-flex; align-items: center; gap: 6px; opacity: .55; transition: opacity .3s; }
.dd-ba-steps b { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: #f1dcc3; font-size: 11px; text-align: center !important; }
.dd-ba[data-step="1"] .dd-ba-s1, .dd-ba[data-step="2"] .dd-ba-s2 { opacity: 1; font-weight: 700; color: var(--dd-marine); }
.dd-ba[data-step="1"] .dd-ba-s1 b, .dd-ba[data-step="2"] .dd-ba-s2 b { background: var(--dd-prod); color: #fff; }
.dd-ba-replay { margin-left: auto; border: 0; background: none; color: var(--dd-prod); font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; }
.dd-ba-replay:hover { text-decoration: underline; }
@media (prefers-reduced-motion: reduce) { .dd-ba-dot, .dd-ba-alone, .dd-ba-market { transition: none; } }
@media (max-width: 575px) { .dd-ba-big { font-size: 34px; } .dd-ba-stage { min-height: 190px; } .dd-ba-replay { margin-left: 0; } }

/* Prix à côté du bouton de chaque bande (accueil) et Pack seul en fin de page */
.dd-band-actions { align-items: center; }
.dd-band-price { font-size: 15px; font-weight: 700; opacity: .9; }
.dd-pack-only { padding: 40px 0 56px; }
.dd-pack-only .dd-pack-strip { margin-top: 0; }

/* Titre d'accueil plus long (deux promesses) : taille ajustée pour tenir sur 2 à 3 lignes */
.nft-hero h1.display-4, .nft-hero .dd-hero-text h1 { font-size: clamp(34px, 4.1vw, 50px) !important; }

/* Point rouge dans le menu (ex. objectifs à fixer) */
.dd-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #a1261b; margin-left: 8px; vertical-align: middle; flex: none; }

/* À propos : logo dans une carte (remplace la photo, 28.10.2026) */
.dd-about-logo { background: var(--dd-creme-claire); border: 1px solid var(--dd-filet); border-radius: 16px;
    box-shadow: 0 18px 40px rgba(0, 36, 60, .12); padding: 48px 32px; text-align: center; }
.dd-about-logo img { width: 100%; max-width: 320px; height: auto; display: block; margin: 0 auto; }
.dd-about-logo .dd-signature { color: var(--dd-sarcelle-texte); text-align: center !important; margin: 24px 0 0; }
@media (max-width: 767.98px) { .dd-about-logo { padding: 32px 24px; } .dd-about-logo img { max-width: 240px; } }
.dd-name-mg { color: var(--dd-mg); font-weight: 700; }
.dd-name-bm { color: var(--dd-bm); font-weight: 700; }

/* Benchmark, résultats : vous / marché Dinner Data / repère national (28.10.2026) */
.dd-bm-stat { height: calc(100% - 1.5rem); }
.dd-bm-stat-title { font-weight: 700; color: var(--dd-encre); margin-bottom: 10px; }
.dd-bm-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 4px 0; }
.dd-bm-row span { color: var(--dd-encre-douce); font-size: 13px; }
.dd-bm-row strong { font-family: var(--dd-font-donnee); font-size: 17px; color: var(--dd-encre); white-space: nowrap; }
.dd-bm-nat { border-top: 1px solid var(--dd-filet); margin-top: 6px; padding-top: 8px; }
.dd-bm-nat strong { color: var(--dd-bm); }
.dd-bm-sub { font-size: 12px; color: var(--dd-encre-douce); line-height: 1.4; text-align: left !important; }
.dd-bm-sub a { color: var(--dd-sarcelle-texte); text-decoration: underline; }
.dd-bm-note { font-size: 12px; color: var(--dd-encre-douce); margin: -4px 0 16px; }

/* Benchmark : lecture de la carte (28.10.2026) */
.dd-menu-read { margin-top: 8px; padding: 10px 12px; border: 1px dashed var(--dd-bm); border-radius: 10px; background: var(--dd-bm-teinte); }
.dd-menu-btn { background: var(--dd-bm); color: #fff !important; border: 0; font-weight: 600; }
.dd-menu-btn:hover { background: var(--dd-bm-fonce); }
.dd-menu-btn[disabled] { opacity: .6; }
.dd-menu-hint { font-size: 12px; color: var(--dd-encre-douce); margin-top: 6px; text-align: left !important; }
.dd-menu-status { font-size: 13px; margin-top: 6px; text-align: left !important; }
.dd-menu-status:empty { display: none; }
.dd-menu-status.ok { color: var(--dd-bm-fonce); font-weight: 600; }
.dd-menu-status.err { color: var(--dd-critique); }
.dd-menu-status details { font-weight: 400; margin-top: 4px; }
.dd-menu-status ul { margin: 4px 0 0; padding-left: 18px; }
.dd-menu-status li span { font-family: var(--dd-font-donnee); }
input.ai-filled { border-color: var(--dd-bm) !important; box-shadow: 0 0 0 2px rgba(5, 89, 102, .18); }
.dd-acc-result { margin-top: 10px; background: #fff; border-radius: 8px; padding: 10px 12px; }
.dd-acc-title { font-weight: 700; color: var(--dd-bm-fonce); margin: 0 0 6px; text-align: left !important; }
.dd-acc-table { width: 100%; font-size: 13px; border-collapse: collapse; }
.dd-acc-table th, .dd-acc-table td { padding: 5px 0; border-bottom: 1px solid var(--dd-filet); vertical-align: top; }
.dd-acc-table th { font-weight: 600; color: var(--dd-encre); }
.dd-acc-table th small { display: block; font-weight: 400; color: var(--dd-encre-douce); }
.dd-acc-table td { text-align: right !important; font-family: var(--dd-font-donnee); white-space: nowrap; }
.dd-acc-table em { font-family: var(--dd-font-texte); color: var(--dd-encre-douce); }
.dd-acc-out { list-style: none; padding: 0; margin: 10px 0; font-size: 14px; }
.dd-acc-out li { display: flex; justify-content: space-between; padding: 2px 0; }
.dd-acc-out b { font-family: var(--dd-font-donnee); color: var(--dd-bm-fonce); }

/* ---- Retours testeuse, 2.11.2026 ---- */
/* Accueil : une puce par outil sous l'accroche (fond sombre : couleurs éclaircies) */
.dd-hero-tools { list-style: none; padding: 0; margin: 0 0 14px; }
.dd-hero-tools li { position: relative; padding-left: 22px; margin: 6px 0; color: rgba(253,229,201,.97); font-size: 18px; line-height: 1.45; text-align: left !important; hyphens: manual !important; }
.dd-hero-tools li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: #2aa79b; }
.nft-hero .dd-name-mg { color: #f0a9bb; }
.nft-hero .dd-name-bm { color: #7fd6da; }
/* Tarifs : le Pack a sa propre couleur (bleu marine + liseré des deux outils), distincte du pétrole de Benchmark */
.dd-plan.is-featured { border-color: var(--dd-marine); background-image: linear-gradient(90deg, var(--dd-mg) 0 50%, var(--dd-bm) 50% 100%); background-size: 100% 8px; background-repeat: no-repeat; }
.dd-plan.is-featured h3 { color: var(--dd-marine); }
.dd-plan.is-featured .btn-success1 { background: var(--dd-marine) !important; border-color: var(--dd-marine) !important; color: #fff4e6 !important; }
.dd-plan.is-featured .btn-success1:hover { filter: brightness(1.25); }
.dd-plan.is-featured .dd-plan-now, .dd-plan.is-featured .dd-plan-save, .dd-plan.is-featured .dd-plan-cancel { color: var(--dd-marine); }
.dd-plan-best { color: #fff4e6 !important; }
/* Pages de texte (À propos, Contact…) : pas de graphique en filigrane derrière le texte */
.job-hero-section::after { display: none !important; }
.headerbutton { white-space: nowrap; }