/* =====================================================================
   DIAG DÉMO — feuille de la maquette (site de démonstration 2026).
   Chargée en dernier : surcharge le moteur (style.css, devis-guide.css, parc.css…).
   Charte : encre #141B34, orange #FF5A2C, orange texte #B93A12, sable #F7F1E8,
   brume #DDE3F0. Titres Outfit, texte Inter (polices hébergées sur le site).
   ===================================================================== */

@font-face {
    font-family: "Outfit";
    src: url("/fonts/outfit-var-latin.woff2") format("woff2");
    font-weight: 500 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --dd-encre: #141B34;
    --dd-encre-2: #1C2545;
    --dd-encre-3: #2B3555;
    --dd-orange: #FF5A2C;
    --dd-orange-2: #FF7147;
    --dd-orange-3: #FF8863;
    --dd-orange-4: #FFA07F;
    --dd-orange-texte: #B93A12;
    --dd-orange-pale: #FFE9E1;
    --dd-sable: #F7F1E8;
    --dd-sable-2: #EFE7DA;
    --dd-brume: #DDE3F0;
    --dd-blanc: #FFFFFF;
    --dd-gris: #3B4260;
    --dd-gris-clair: #C9CCD8;
    --dd-gris-moyen: #A9AEC2;
    --dd-ligne: #E6DCCB;
    --dd-titre: "Outfit", "Inter", system-ui, sans-serif;
    --dd-texte: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --dd-gouttiere: clamp(18px, 3.6vw, 64px);
    --dd-max: 1440px;
    --dd-large: 1840px;
    --dd-barre-h: 40px;
    --dd-entete-h: 88px;
    --dd-haut: calc(var(--dd-barre-h) + var(--dd-entete-h));
    --dd-rayon: 28px;
    --dd-ombre: 0 24px 60px rgba(20, 27, 52, .12);
    --dd-fleche: polygon(0 0, calc(100% - var(--dd-pointe, 16px)) 0, 100% 50%, calc(100% - var(--dd-pointe, 16px)) 100%, 0 100%);

    /* Variables du moteur (devis guidé, maillage, données locales) recalées sur la charte. */
    --c-text: #141B34;
    --c-muted: #3B4260;
    --c-bg: #FFFFFF;
    --c-surface: #F7F1E8;
    --c-border: #E6DCCB;
    --c-accent: #FF5A2C;
    --c-accent-ink: #141B34;
    --radius: 22px;
    --font: var(--dd-texte);
}
@media (max-width: 1240px) {
    :root { --dd-barre-h: 0px; --dd-entete-h: 72px; }
}

/* --------------------------------------------------- Base */
html { overflow-x: clip; scroll-padding-top: calc(var(--dd-entete-h) + 16px); }
html.dd-nav-ouvert { overflow: hidden; }
body { margin: 0; background: var(--dd-sable); color: var(--dd-encre); font-family: var(--dd-texte); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
main { max-width: none; margin: 0; padding: 0; }
img, video { max-width: 100%; }
a { color: var(--dd-orange-texte); }
a:hover { color: var(--dd-encre); text-decoration: none; }
[class^="dd-"] > li, [class*=" dd-"] > li { margin: 0; }
:focus-visible { outline: 3px solid var(--dd-orange); outline-offset: 3px; }
::selection { background: var(--dd-orange); color: var(--dd-encre); }
h1, h2, h3, h4 { font-family: var(--dd-titre); font-weight: 700; color: inherit; letter-spacing: -.02em; }
.dd-evitement { position: absolute; left: 12px; top: -60px; z-index: 300; padding: 12px 18px; border-radius: 12px; background: var(--dd-orange); color: var(--dd-encre); font-weight: 600; text-decoration: none; }
.dd-evitement:focus { top: 12px; }
.dd-ico { width: 20px; height: 20px; flex-shrink: 0; }
.dd-symbole { display: block; width: 1em; height: 1em; }

.dd-conteneur { box-sizing: border-box; width: 100%; max-width: var(--dd-max); margin-inline: auto; padding-inline: var(--dd-gouttiere); }
/* Bandes qui respirent sur toute la largeur : barre du haut, en-tête, hauts de page, liens utiles,
   dernier appel à l'action, pied de page. */
.dd-barre .dd-conteneur, .dd-entete .dd-conteneur, .dd-hero > .dd-conteneur, .dd-utiles .dd-conteneur,
.dd-appel-final .dd-conteneur, .dd-pied .dd-conteneur { max-width: var(--dd-large); }
.dd-section { padding-block: clamp(72px, 9vw, 128px); position: relative; }
.dd-blanc { background: var(--dd-blanc); }
.dd-brume { background: var(--dd-brume); }
.dd-sombre { background: var(--dd-encre); color: var(--dd-sable); overflow: hidden; }

/* --------------------------------------------------- Typographie */
.dd-titre { margin: 0; font-family: var(--dd-titre); font-weight: 700; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; letter-spacing: -.025em; }
.dd-titre-grand { font-size: clamp(34px, 4.2vw, 60px); line-height: 1.02; }
.dd-titre-section h2 { margin: 0; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; letter-spacing: -.025em; }
.dd-accent { color: var(--dd-orange); }
.dd-surtitre { margin: 0 0 14px; font-family: var(--dd-texte); font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--dd-orange-texte); }
.dd-surtitre-orange { color: var(--dd-orange); }

.dd-prose { font-size: 17px; line-height: 1.75; color: #2A3150; }
.dd-prose > :first-child { margin-top: 0; }
.dd-prose h2 { margin: 1.6em 0 .55em; font-size: clamp(28px, 2.6vw, 38px); line-height: 1.12; color: var(--dd-encre); }
.dd-prose h3 { margin: 1.4em 0 .4em; font-size: clamp(20px, 1.7vw, 24px); line-height: 1.25; color: var(--dd-encre); }
.dd-prose p { margin: 0 0 1.05em; }
.dd-prose strong { color: var(--dd-encre); }
.dd-prose a { color: var(--dd-orange-texte); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.dd-prose a:hover { color: var(--dd-encre); text-decoration: underline; }
.dd-prose ul { list-style: none; margin: 0 0 1.2em; padding: 0; display: grid; gap: 10px; }
.dd-prose li { margin: 0; }
.dd-prose ul > li { position: relative; padding-left: 30px; }
.dd-prose ul > li::before { content: ""; position: absolute; left: 0; top: .42em; width: 18px; height: 14px; background: var(--dd-orange); clip-path: polygon(0 52%, 14% 38%, 38% 62%, 86% 0, 100% 14%, 38% 92%); }
.dd-prose ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.dd-prose img { height: auto; border-radius: 22px; }
.dd-prose figure { margin: 1.6em 0; }
.dd-prose table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: 15px; background: var(--dd-blanc); border-radius: 18px; overflow: hidden; }
.dd-prose th { background: var(--dd-encre); color: var(--dd-sable); font-family: var(--dd-titre); font-weight: 600; text-align: left; padding: 12px 14px; }
.dd-prose td { padding: 11px 14px; border-top: 1px solid var(--dd-ligne); vertical-align: top; }
.dd-prose-claire, .dd-prose-claire p { color: var(--dd-gris-clair); }
.dd-prose-claire h2, .dd-prose-claire h3, .dd-prose-claire strong { color: var(--dd-sable); }
.dd-prose-claire a { color: var(--dd-orange); }
.dd-prose-claire a:hover { color: var(--dd-sable); }

/* --------------------------------------------------- Boutons et liens */
.dd-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 14px 24px; border-radius: 999px; border: 2px solid transparent;
    font-family: var(--dd-titre); font-weight: 600; font-size: 16px; line-height: 1.2;
    text-decoration: none; white-space: nowrap; cursor: pointer;
    /* Survol : la couleur balaie le fond de gauche à droite, sans déplacement. Une seule couche
       (survol | fond) qui glisse : pas de couleur dessous, donc rien ne dépasse dans les coins. */
    background-color: transparent;
    background-image: linear-gradient(90deg, var(--dd-btn-survol, transparent) 50%, var(--dd-btn-fond, transparent) 50%);
    background-size: 202% 100%; background-position: 100% 0; background-repeat: no-repeat; background-origin: border-box;
    transition: background-position .5s cubic-bezier(.65, 0, .35, 1), color .3s ease, border-color .3s ease;
}
.dd-btn:hover, .dd-btn:focus-visible { background-position: 0 0; }
.dd-btn .dd-ico { width: 18px; height: 18px; transition: color .3s ease; }
.dd-btn-grand { padding: 17px 30px; font-size: 17px; }
.dd-btn-petit { padding: 10px 16px; font-size: 15px; }
.dd-btn-orange { --dd-btn-fond: var(--dd-orange); --dd-btn-survol: var(--dd-encre); color: var(--dd-encre); }
.dd-btn-orange:hover, .dd-btn-orange:focus-visible { color: var(--dd-sable); }
.dd-btn-orange:hover .dd-ico { color: var(--dd-orange); }
/* Sur fond encre, l'orange balaie vers le sable (l'encre s'y perdrait). */
.dd-hero .dd-btn-orange, .dd-entete .dd-btn-orange, .dd-sombre .dd-btn-orange, .dd-carte-contact .dd-btn-orange,
.dd-nav .dd-btn-orange, .dd-pied .dd-btn-orange { --dd-btn-survol: var(--dd-sable); }
.dd-hero .dd-btn-orange:hover, .dd-entete .dd-btn-orange:hover, .dd-sombre .dd-btn-orange:hover, .dd-carte-contact .dd-btn-orange:hover,
.dd-nav .dd-btn-orange:hover, .dd-pied .dd-btn-orange:hover { color: var(--dd-encre); }
.dd-hero .dd-btn-orange:hover .dd-ico, .dd-entete .dd-btn-orange:hover .dd-ico, .dd-carte-contact .dd-btn-orange:hover .dd-ico { color: var(--dd-orange-texte); }
.dd-btn-encre { --dd-btn-fond: var(--dd-encre); --dd-btn-survol: var(--dd-orange); color: var(--dd-sable); }
.dd-btn-encre .dd-ico { color: var(--dd-orange); }
.dd-btn-encre:hover, .dd-btn-encre:focus-visible { color: var(--dd-encre); }
.dd-btn-encre:hover .dd-ico { color: var(--dd-encre); }
.dd-btn-contour-clair { --dd-btn-survol: var(--dd-sable); border-color: rgba(247, 241, 232, .55); color: var(--dd-sable); }
.dd-btn-contour-clair .dd-ico { color: var(--dd-orange); }
.dd-btn-contour-clair:hover, .dd-btn-contour-clair:focus-visible { color: var(--dd-encre); border-color: var(--dd-sable); }
.dd-btn-contour-encre { --dd-btn-survol: var(--dd-encre); border-color: var(--dd-encre); color: var(--dd-encre); }
.dd-btn-contour-encre:hover, .dd-btn-contour-encre:focus-visible { color: var(--dd-sable); }
.dd-btn-contour-encre:hover .dd-ico { color: var(--dd-orange); }
.dd-rond { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; border: 1.5px solid rgba(247, 241, 232, .5); color: var(--dd-sable); flex-shrink: 0; transition: background-color .25s ease, color .25s ease; }
.dd-rond .dd-ico { width: 18px; height: 18px; }
.dd-rond-grand { width: 54px; height: 54px; }
.dd-rond-grand .dd-ico { color: var(--dd-orange); }
.dd-rond-orange { width: 36px; height: 36px; border: 0; background: var(--dd-orange); color: var(--dd-encre); }
.dd-lien-souligne { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 4px; border-bottom: 2px solid var(--dd-orange); font-family: var(--dd-titre); font-weight: 600; font-size: 16px; color: var(--dd-encre); text-decoration: none; }
.dd-lien-clair { color: var(--dd-sable); }
.dd-lien-clair:hover { color: var(--dd-orange); }
.dd-lien-orange { color: var(--dd-orange); font-weight: 600; text-decoration: none; }

/* Étiquette en forme de flèche (la pointe du logo). */
.dd-etiquette { display: inline-block; align-self: flex-start; margin: 0; padding: 8px 32px 8px 14px; background: var(--dd-orange); color: var(--dd-encre); font-family: var(--dd-titre); font-weight: 600; font-size: 14px; line-height: 1.2; --dd-pointe: 16px; clip-path: var(--dd-fleche); }
.dd-etiquette-petite { padding: 6px 26px 6px 11px; font-size: 13px; --dd-pointe: 13px; }

/* --------------------------------------------------- Barre du haut et en-tête */
.dd-barre { position: relative; z-index: 101; height: var(--dd-barre-h); background: rgba(10, 14, 30, .55); border-bottom: 1px solid rgba(247, 241, 232, .14); color: #E9E4F0; font-size: 13px; }
.dd-barre-in { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.dd-barre p { display: flex; align-items: center; gap: 22px; margin: 0; }
.dd-barre span, .dd-barre a { display: inline-flex; align-items: center; gap: 8px; color: #E9E4F0; text-decoration: none; }
.dd-barre a:hover { color: var(--dd-orange); }
.dd-barre .dd-ico { width: 16px; height: 16px; color: var(--dd-orange); }

.site-header.dd-entete { position: sticky; top: 0; z-index: 100; display: block; height: var(--dd-entete-h); padding: 0; background: transparent; box-shadow: none; color: var(--dd-sable); }
/* Fond au défilement : pseudo-élément, la hauteur de l'en-tête ne change jamais. */
.dd-entete::before { content: ""; position: absolute; inset: 0; background: rgba(20, 27, 52, .97); box-shadow: 0 12px 30px rgba(5, 8, 20, .25); opacity: 0; transition: opacity .3s ease; pointer-events: none; }
.dd-entete.is-defile::before { opacity: 1; }
.dd-entete-in { position: relative; height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.dd-logo { display: inline-flex; flex-shrink: 0; }
.dd-logo img { display: block; height: 38px; width: auto; }
.dd-nav { flex-grow: 1; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.dd-nav > nav { flex-grow: 1; display: flex; justify-content: center; }
.dd-entete .dd-menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; }
.dd-entete .dd-menu > li { position: relative; }
.dd-entete .dd-menu-lien, .dd-menu-bouton { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; border: 0; border-radius: 999px; background: none; color: var(--dd-sable); font-family: var(--dd-titre); font-weight: 600; font-size: 16px; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .2s ease, color .2s ease; }
.dd-entete .dd-menu-lien:hover, .dd-menu-bouton:hover, .dd-menu-groupe.is-ouvert .dd-menu-bouton { background: rgba(247, 241, 232, .1); color: var(--dd-sable); }
.dd-entete .dd-menu-lien[aria-current="page"] { color: var(--dd-orange); }
.dd-menu-chevron { width: 16px; height: 16px; transition: transform .25s ease; }
.dd-menu-groupe.is-ouvert .dd-menu-chevron { transform: rotate(180deg); }
.dd-mega { position: absolute; left: 50%; top: calc(100% + 14px); width: min(980px, 88vw); box-sizing: border-box; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; padding: 30px; border-radius: 28px; background: var(--dd-blanc); color: var(--dd-encre); box-shadow: 0 30px 70px rgba(5, 8, 20, .3); opacity: 0; visibility: hidden; transform: translateX(-38%); transition: opacity .2s ease, visibility .2s; }
.dd-menu-groupe.is-ouvert .dd-mega { opacity: 1; visibility: visible; }
.dd-mega-titre { margin: 0 0 12px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--dd-orange-texte); }
.dd-entete .dd-mega ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.dd-entete .dd-mega a { display: block; padding: 7px 10px; margin-left: -10px; border-radius: 10px; color: var(--dd-encre); font-size: 15px; font-weight: 500; line-height: 1.35; text-decoration: none; }
.dd-entete .dd-mega a:hover, .dd-entete .dd-mega a[aria-current="page"] { background: var(--dd-sable); color: var(--dd-orange-texte); }
.dd-entete-actions { display: flex; align-items: center; gap: 18px; flex-shrink: 0; }
.dd-entete-tel { display: inline-flex; align-items: center; gap: 8px; color: var(--dd-sable); font-family: var(--dd-titre); font-weight: 600; font-size: 16px; text-decoration: none; white-space: nowrap; }
.dd-entete-tel .dd-ico { width: 18px; height: 18px; color: var(--dd-orange); }
.dd-entete-tel:hover { color: var(--dd-orange); }
.dd-entete-mobile, .dd-nav-infos { display: none; }
.dd-burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 999px; background: var(--dd-sable); color: var(--dd-encre); cursor: pointer; }
.dd-burger .dd-ico { width: 20px; height: 20px; }
.dd-burger-fermer { display: none; }
.nav-open .dd-burger-ouvrir { display: none; }
.nav-open .dd-burger-fermer { display: block; }
.nav-scrim { display: none; }

@media (max-width: 1240px) {
    .dd-entete-tel { display: none; }
    .dd-entete .dd-menu-lien, .dd-menu-bouton { padding: 10px 11px; font-size: 15px; }
}
@media (max-width: 1240px) {
    .dd-barre { display: none; }
    .dd-logo img { height: 30px; }
    .dd-entete-mobile { display: flex; align-items: center; gap: 8px; margin-left: auto; }
    .dd-nav { position: fixed; z-index: 99; inset: var(--dd-entete-h) 0 0 0; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 22px; padding: 18px var(--dd-gouttiere) 40px; background: var(--dd-encre); overflow-y: auto; visibility: hidden; opacity: 0; transform: none; max-height: none; box-shadow: none; border-top: 0; transition: opacity .25s ease, visibility .25s; }
    .nav-open .dd-nav { visibility: visible; opacity: 1; }
    .nav-open .dd-entete::before { opacity: 1; }
    .dd-nav > nav { display: block; flex-grow: 0; }
    .dd-entete .dd-menu { flex-direction: column; align-items: stretch; gap: 0; }
    .dd-entete .dd-menu > li { border-bottom: 1px solid var(--dd-encre-3); }
    .dd-entete .dd-menu-lien, .dd-menu-bouton { width: 100%; justify-content: space-between; padding: 16px 2px; border-radius: 0; font-size: 20px; }
    .dd-entete .dd-menu-lien:hover, .dd-menu-bouton:hover, .dd-menu-groupe.is-ouvert .dd-menu-bouton { background: none; color: var(--dd-orange); }
    .dd-mega { position: static; width: auto; transform: none; display: none; grid-template-columns: 1fr; gap: 18px; padding: 4px 0 18px; border-radius: 0; background: none; color: var(--dd-sable); box-shadow: none; opacity: 1; visibility: visible; }
    .dd-menu-groupe.is-ouvert .dd-mega { display: grid; }
    .dd-mega-titre { color: var(--dd-orange); }
    .dd-entete .dd-mega a { color: var(--dd-gris-clair); font-size: 16px; }
    .dd-entete .dd-mega a:hover, .dd-entete .dd-mega a[aria-current="page"] { background: var(--dd-encre-2); color: var(--dd-sable); }
    .dd-entete-actions { flex-direction: column; align-items: stretch; }
    .dd-entete-actions .dd-btn { padding: 16px 24px; }
    .dd-entete-tel { display: inline-flex; justify-content: center; padding: 14px; border: 1.5px solid var(--dd-encre-3); border-radius: 999px; }
    .dd-nav-infos { display: block; margin: 0; text-align: center; color: var(--dd-gris-moyen); font-size: 14px; }
    .dd-nav-infos a { color: var(--dd-sable); }
}
@media (max-width: 400px) {
    .dd-logo img { height: 26px; }
    .dd-entete-mobile .dd-rond { display: none; }
}

/* --------------------------------------------------- Hauts de page (encre, D-flèche) */
.dd-hero { position: relative; overflow: hidden; margin-top: calc(-1 * var(--dd-haut)); padding-top: var(--dd-haut); background: var(--dd-encre); color: var(--dd-sable); display: flex; flex-direction: column; }
.dd-hero-panneau { position: absolute; left: 0; top: 0; bottom: 0; width: var(--dd-panneau, 64%); background: var(--dd-encre); clip-path: polygon(0 0, 80% 0, 100% 50%, 80% 100%, 0 100%); pointer-events: none; }
.dd-hero-pointe { position: absolute; left: 0; top: 0; height: 100%; width: var(--dd-panneau, 64%); color: var(--dd-orange); pointer-events: none;  -webkit-mask-image: linear-gradient(180deg, transparent calc(var(--dd-haut) - 8px), #000 calc(var(--dd-haut) + 70px)); mask-image: linear-gradient(180deg, transparent calc(var(--dd-haut) - 8px), #000 calc(var(--dd-haut) + 70px)); }
.dd-hero-voile { position: absolute; inset: 0; background: rgba(20, 27, 52, .18); pointer-events: none; }
/* Ombre en haut de chaque haut de page : menu et barre lisibles sur la vidéo ou la photo. */
.dd-hero::before { content: ""; position: absolute; z-index: 1; left: 0; right: 0; top: 0; height: calc(var(--dd-haut) + 80px); background: linear-gradient(180deg, rgba(20, 27, 52, .8) 0, rgba(20, 27, 52, .45) 55%, rgba(20, 27, 52, 0) 100%); pointer-events: none; }
.dd-hero > .dd-conteneur { position: relative; z-index: 2; }
.dd-hero-in { position: relative; flex-grow: 1; display: flex; align-items: center; padding-top: clamp(28px, 4vw, 56px); padding-bottom: clamp(28px, 4vw, 48px); }
.dd-hero-texte { max-width: 620px; display: flex; flex-direction: column; gap: 24px; }
.dd-hero-titre { margin: 0; font-size: clamp(36px, 4.4vw, 64px); line-height: 1; letter-spacing: -.03em; color: var(--dd-sable); text-wrap: balance; }
.dd-hero-titre-page { font-size: clamp(30px, min(3vw, 5.6svh), 52px); line-height: 1.06; }
.dd-hero-titre-mot-cle { font-size: clamp(34px, min(3.3vw, 6svh), 60px); line-height: 1.02; }
.dd-hero-accroche { max-width: 560px; font-size: clamp(17px, 1.3vw, 19px); line-height: 1.6; color: var(--dd-gris-clair); }
.dd-hero-accroche p { margin: 0; }
.dd-hero-accroche a { color: var(--dd-sable); }
.dd-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 22px; }
.dd-hero-note { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 15px; color: var(--dd-gris-clair); }
.dd-hero-note strong { color: var(--dd-blanc); }
.dd-appel { display: inline-flex; align-items: center; gap: 12px; color: var(--dd-sable); text-decoration: none; }
.dd-appel > span:last-child { display: flex; flex-direction: column; line-height: 1.25; }
.dd-appel-legende { font-size: 13px; color: var(--dd-gris-moyen); }
.dd-appel strong { font-family: var(--dd-titre); font-size: 20px; }
.dd-appel:hover strong { color: var(--dd-orange); }
.dd-ariane-claire.breadcrumb { max-width: none; margin: 0; padding: 0; }
.dd-ariane-claire li, .dd-ariane-claire li::after, .dd-ariane-claire a { color: var(--dd-gris-moyen); }
.dd-ariane-claire li:last-child a { color: var(--dd-sable); }

/* Vidéo de Paris : calée sur la hauteur du haut de page, la tour Eiffel juste après la pointe. */
.dd-hero-video { position: absolute; top: 0; height: 100%; width: auto; max-width: none; aspect-ratio: 1900 / 1068; left: calc(var(--dd-panneau, 64%) + 60px - .569 * var(--dd-hero-h, 800px)); background: var(--dd-encre); pointer-events: none; }
.dd-video-pause { position: absolute; z-index: 5; right: var(--dd-gouttiere); top: calc(var(--dd-haut) + 20px); display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 999px; border: 1.5px solid rgba(247, 241, 232, .6); background: rgba(20, 27, 52, .45); color: var(--dd-sable); cursor: pointer; }
.dd-video-pause .dd-ico { width: 16px; height: 16px; }
.dd-ico-lecture, .dd-video-pause[aria-pressed="true"] .dd-ico-pause { display: none; }
.dd-video-pause[aria-pressed="true"] .dd-ico-lecture { display: block; }

/* Petits D sur une grille (motif vivant, animé par maquette.js). */
.dd-motif { position: absolute; z-index: 1; left: calc(var(--dd-panneau, 64%) - 118px); top: calc(50% - 63px); display: none; grid-template-columns: repeat(2, 12px); gap: 26px; color: var(--dd-sable); pointer-events: none; }
@media (min-width: 1360px) { .dd-hero .dd-motif { display: grid; } }
.dd-motif .dd-symbole { width: 12px; height: 12px; opacity: .18; transition: opacity .8s ease, color .8s ease; }
.dd-motif .dd-symbole.is-allume { opacity: 1; color: var(--dd-orange); }

/* Accueil */
/* Le haut de l'accueil tient dans l'écran, barre de devis comprise. */
.dd-hero-accueil { --dd-hero-h: max(640px, 100svh); --dd-panneau: 64%; min-height: var(--dd-hero-h); box-sizing: border-box; }
.dd-hero-accueil .dd-hero-titre { font-size: clamp(34px, min(3.6vw, 6svh), 70px); line-height: 1.02; }
@media (min-width: 1600px) {
    .dd-hero-texte { max-width: 760px; }
    .dd-hero-mot-cle .dd-hero-texte { max-width: 700px; }
    .dd-hero-page .dd-hero-texte { max-width: 700px; }
    .dd-hero-accroche { max-width: 640px; }
}
.dd-hero-accueil .dd-hero-titre .dd-accent { color: var(--dd-orange); }
.dd-devis-barre-zone { position: relative; padding-bottom: clamp(24px, 3vw, 40px); }
.dd-devis-barre { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px; border-radius: 28px; background: var(--dd-blanc); color: var(--dd-encre); box-shadow: 0 24px 60px rgba(5, 8, 20, .35); }
.dd-devis-barre-titre { margin: 0; padding: 0 10px 0 14px; font-family: var(--dd-titre); font-weight: 700; font-size: 18px; white-space: nowrap; }
.dd-devis-barre-choix { flex: 1 1 440px; display: flex; flex-wrap: wrap; gap: 8px; }
.dd-devis-barre .dd-btn { border-radius: 18px; padding: 17px 26px; }
.dd-choix { flex: 1 1 130px; position: relative; display: flex; }
.dd-choix input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.dd-choix > span { flex-grow: 1; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 14px; border-radius: 18px; border: 2px solid #ECE6DC; background: var(--dd-blanc); font-family: var(--dd-titre); font-weight: 600; font-size: 16px; cursor: pointer; transition: border-color .2s ease, background-color .2s ease; }
.dd-choix .dd-ico { width: 20px; height: 20px; color: var(--dd-encre); }
.dd-choix input:checked + span { border-color: var(--dd-orange); background: #FFF4EF; }
.dd-choix input:checked + span .dd-ico { color: var(--dd-orange); }
.dd-choix input:focus-visible + span { outline: 3px solid var(--dd-orange); outline-offset: 2px; }
.dd-choix > span:hover { border-color: var(--dd-orange-3); }

/* Pages internes */
.dd-hero-page { --dd-panneau: 60%; min-height: 560px; }
.dd-hero-page .dd-hero-in { padding-bottom: clamp(48px, 6vw, 80px); }
.dd-hero-page .dd-hero-texte { max-width: 600px; gap: 20px; }
.dd-hero-visuel { position: absolute; top: 0; right: 0; width: 58%; height: 100%; object-fit: cover; }
.dd-hero-page:not(.dd-hero-avec-visuel) { min-height: 0; }
.dd-hero-page:not(.dd-hero-avec-visuel) .dd-hero-panneau { width: 100%; clip-path: none; }
.dd-hero-page:not(.dd-hero-avec-visuel) .dd-hero-texte { max-width: 820px; }
.dd-hero-compact { min-height: 0; }
.dd-hero-compact .dd-hero-in { padding-block: 24px 28px; }

/* Pages mots-clés */
.dd-hero-mot-cle { --dd-hero-h: max(640px, 100svh); --dd-panneau: 52%; min-height: var(--dd-hero-h); box-sizing: border-box; }
.dd-hero-mot-cle .dd-hero-panneau { background: var(--dd-encre); clip-path: polygon(0 0, 82% 0, 100% 50%, 82% 100%, 0 100%); }
.dd-hero-mot-cle-in { justify-content: space-between; gap: 40px; padding-bottom: clamp(40px, 5vw, 64px); }
.dd-hero-mot-cle .dd-hero-texte { max-width: 620px; gap: 18px; }
.dd-surtitre-maison { display: inline-flex; align-items: center; gap: 10px; margin: 0; }
.dd-surtitre-maison .dd-symbole { width: 16px; height: 16px; }
.dd-arguments { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dd-arguments li { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: rgba(247, 241, 232, .08); border: 1px solid rgba(247, 241, 232, .2); font-size: 14px; font-weight: 600; }
.dd-arguments .dd-ico { width: 16px; height: 16px; color: var(--dd-orange); }
.dd-seulement-mobile { display: none; }
.dd-carte-devis { flex: 0 1 400px; align-self: center; box-sizing: border-box; display: flex; flex-direction: column; gap: 16px; padding: clamp(22px, 2.4vw, 32px); border-radius: 28px; background: var(--dd-blanc); color: var(--dd-encre); box-shadow: 0 30px 70px rgba(5, 8, 20, .4); }
.dd-carte-devis-tete { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.dd-carte-devis-titre { margin: 0; font-family: var(--dd-titre); font-weight: 700; font-size: 23px; line-height: 1.15; }
.dd-carte-devis-tete .dd-symbole { width: 28px; height: 28px; color: var(--dd-orange); flex-shrink: 0; }
.dd-progression-etapes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.dd-progression-etapes span { height: 6px; border-radius: 999px; background: #ECE6DC; }
.dd-progression-etapes .is-actif { background: var(--dd-orange); }
.dd-carte-devis fieldset { margin: 0; padding: 0; border: 0; }
.dd-carte-devis legend { margin-bottom: 10px; padding: 0; font-size: 15px; font-weight: 600; }
.dd-carte-devis-choix { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dd-carte-devis-choix .dd-choix > span { justify-content: flex-start; padding: 14px; font-size: 15px; }
.dd-carte-devis .dd-btn { width: 100%; }
.dd-carte-devis-note { margin: 0; text-align: center; font-size: 13px; color: var(--dd-gris); }

/* --------------------------------------------------- En-tête de section */
.dd-tete-section { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px 32px; margin-bottom: 36px; }
.dd-tete-section > div { max-width: 700px; }
.dd-fleches { display: flex; gap: 10px; }
.dd-fleches[hidden] { display: none; }
.dd-fleche { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 999px; border: 1.5px solid var(--dd-encre); background: transparent; color: var(--dd-encre); cursor: pointer; transition: background-color .2s ease, color .2s ease; }
.dd-fleche:hover { background: var(--dd-encre); color: var(--dd-sable); }
.dd-fleche-claire { border-color: rgba(247, 241, 232, .4); color: var(--dd-sable); }
.dd-fleche-claire:hover { background: var(--dd-sable); color: var(--dd-encre); }
.dd-fleche-pleine { border-color: var(--dd-orange); background: var(--dd-orange); color: var(--dd-encre); }
.dd-fleche-pleine:hover { border-color: var(--dd-sable); background: var(--dd-sable); color: var(--dd-encre); }
.dd-fleche:disabled { opacity: .35; cursor: default; }

/* Piste défilante (carrousels) : lisible et défilable sans JavaScript. */
.dd-piste { list-style: none; margin: 0; padding: 0 0 6px; display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; }
.dd-piste::-webkit-scrollbar { display: none; }
.dd-piste > li { scroll-snap-align: start; flex-shrink: 0; }

/* --------------------------------------------------- Accueil : présentation */
.dd-presentation-in { display: flex; flex-wrap: wrap; align-items: flex-start; gap: clamp(48px, 7vw, 104px); }
.dd-presentation-visuels { flex: 1 1 440px; min-width: 0; position: sticky; top: calc(var(--dd-entete-h) + 40px); height: clamp(420px, 42vw, 600px); }
.dd-presentation-photo { position: absolute; left: 0; top: 0; width: 86%; height: 84%; object-fit: cover; clip-path: polygon(0 0, 74% 0, 100% 50%, 74% 100%, 0 100%); }
.dd-presentation-maison { position: absolute; right: 0; bottom: 0; width: 44%; height: 50%; object-fit: cover; clip-path: polygon(50% 0, 100% 32%, 100% 100%, 0 100%, 0 32%); }
.dd-presentation-badge { position: absolute; left: 0; bottom: 0; display: flex; align-items: baseline; gap: 12px; margin: 0; padding: 20px 24px; border-radius: 24px; background: var(--dd-encre); color: var(--dd-sable); }
.dd-presentation-badge strong { font-family: var(--dd-titre); font-size: 64px; line-height: .9; color: var(--dd-orange); }
.dd-presentation-badge span { font-family: var(--dd-titre); font-weight: 600; font-size: 16px; line-height: 1.25; }
.dd-presentation-texte { flex: 1 1 480px; min-width: 0; }
.dd-presentation-texte h2 { margin-top: 0; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; letter-spacing: -.025em; }
.dd-chiffres { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 28px 0 0; padding: 0; }
.dd-chiffres li { padding: 12px 0 0 !important; border-top: 3px solid var(--dd-encre); font-size: 14px; line-height: 1.4; color: var(--dd-gris); }
.dd-chiffres li::before { display: none; }
.dd-chiffres li:first-child { border-top-color: var(--dd-orange); }
.dd-chiffres strong { display: block; font-family: var(--dd-titre); font-size: 34px; line-height: 1.1; color: var(--dd-encre); }

/* --------------------------------------------------- Accueil : diagnostics (carrousel) */
.dd-diagnostics-deco { position: absolute; right: -140px; top: -120px; width: 520px; height: 520px; color: var(--dd-sable); opacity: .05; }
.dd-diagnostics .dd-titre-section h2 { color: var(--dd-sable); }
.dd-filtres { display: flex; flex-wrap: wrap; gap: 8px; margin: -12px 0 32px; }
.dd-filtre { padding: 11px 20px; border-radius: 999px; border: 1px solid var(--dd-encre-3); background: transparent; color: var(--dd-sable); font-family: var(--dd-titre); font-weight: 600; font-size: 15px; cursor: pointer; transition: background-color .2s ease, color .2s ease; }
.dd-filtre:hover { border-color: var(--dd-sable); }
.dd-filtre[aria-pressed="true"] { background: var(--dd-sable); border-color: var(--dd-sable); color: var(--dd-encre); }
.dd-piste-zone { max-width: none; padding-left: max(var(--dd-gouttiere), calc((100% - var(--dd-max)) / 2 + var(--dd-gouttiere))); padding-right: 0; }
.dd-piste-zone .dd-piste { scroll-padding-left: 0; }
.dd-piste-zone .dd-progression { padding-right: max(var(--dd-gouttiere), calc((100vw - var(--dd-max) - 16px) / 2 + var(--dd-gouttiere))); }
.dd-diag-carte { width: 340px; }
.dd-diag-carte[hidden] { display: none; }
.dd-diag-carte a { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 460px; border-radius: 28px; overflow: hidden; color: var(--dd-sable); text-decoration: none; isolation: isolate; }
.dd-diag-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.dd-diag-carte a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20, 27, 52, 0) 30%, rgba(20, 27, 52, .94) 80%); }
.dd-diag-carte a::after { content: ""; position: absolute; inset: 0; border-radius: 28px; border: 2px solid transparent; transition: border-color .25s ease; }
.dd-diag-carte a:hover::after, .dd-diag-carte a:focus-visible::after { border-color: var(--dd-orange); }
.dd-diag-carte .dd-etiquette { position: absolute; left: 18px; top: 18px; }
.dd-diag-corps { display: flex; flex-direction: column; gap: 8px; padding: 24px; }
.dd-diag-num { font-family: var(--dd-titre); font-weight: 700; font-size: 14px; color: var(--dd-orange); }
.dd-diag-nom { font-family: var(--dd-titre); font-weight: 700; font-size: 25px; line-height: 1.1; }
.dd-diag-plus { display: inline-flex; align-items: center; gap: 10px; margin-top: 6px; font-family: var(--dd-titre); font-weight: 600; font-size: 15px; }
.dd-progression { display: flex; align-items: center; gap: 20px; margin-top: 28px; padding-right: var(--dd-gouttiere); }
.dd-progression-compte { font-family: var(--dd-titre); font-weight: 600; font-size: 15px; color: var(--dd-orange); white-space: nowrap; }
.dd-progression-barre { flex-grow: 1; height: 3px; border-radius: 999px; background: var(--dd-encre-3); }
.dd-progression-barre span { display: block; height: 100%; width: 20%; border-radius: 999px; background: var(--dd-orange); transition: width .3s ease, margin .3s ease; }
.dd-diag-texte { margin-top: clamp(40px, 5vw, 64px); padding-top: clamp(32px, 4vw, 48px); border-top: 1px solid var(--dd-encre-3); max-width: 1000px; }
/* Listes de diagnostics en pastilles : compactes, le texte reste dans le HTML. */
.dd-diag-texte ul { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 1.4em; }
.dd-diag-texte ul > li { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--dd-encre-3); background: var(--dd-encre-2); font-size: 15px; color: var(--dd-sable); }
.dd-diag-texte ul > li::before { display: none; }

/* --------------------------------------------------- Engagements (étiquette « classe A ») */
.dd-engagements-in { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(40px, 6vw, 88px); }
.dd-engagements-texte { flex: 1 1 340px; min-width: 0; }
.dd-engagements-texte p:last-child { margin: 18px 0 0; font-size: 17px; line-height: 1.7; color: #2A3150; }
.dd-etiquette-a { flex: 1.3 1 520px; min-width: 0; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dd-barre-a { box-sizing: border-box; min-height: 92px; display: flex; align-items: center; gap: 18px; padding: 16px 64px 16px 20px; color: var(--dd-encre); --dd-pointe: 44px; clip-path: var(--dd-fleche); font-size: 15px; line-height: 1.45; }
.dd-barre-a strong { display: block; font-family: var(--dd-titre); font-size: 21px; line-height: 1.2; }
.dd-barre-a { background: var(--dd-bar, var(--dd-orange)); }
.dd-barre-a-1 { width: max(70%, 290px); --dd-bar: var(--dd-orange); }
.dd-barre-a-2 { width: max(78%, 300px); --dd-bar: var(--dd-orange-2); }
.dd-barre-a-3 { width: max(86%, 310px); --dd-bar: var(--dd-orange-3); }
.dd-barre-a-4 { width: max(94%, 320px); --dd-bar: var(--dd-orange-4); }
.dd-lettre-a { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; flex-shrink: 0; border-radius: 14px; background: var(--dd-encre); color: var(--dd-orange); font-family: var(--dd-titre); font-weight: 700; font-size: 26px; }
.dd-engagements-compact .dd-barre-a { min-height: 76px; padding: 12px 54px 12px 14px; --dd-pointe: 38px; }
.dd-engagements-compact .dd-barre-a strong { font-size: 18px; }
.dd-engagements-compact .dd-lettre-a { width: 44px; height: 44px; font-size: 22px; }

/* --------------------------------------------------- Étapes (flèches chaînées) */
.dd-chevrons { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dd-chevrons li { box-sizing: border-box; min-height: 230px; display: flex; flex-direction: column; gap: 12px; padding: 30px 52px 30px 58px; background: var(--dd-sable); font-size: 15px; line-height: 1.55; color: #2A3150; clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%, 30px 50%); }
.dd-chevrons li:first-child { padding-left: 30px; clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%); }
.dd-chevrons li:nth-child(2n) { background: var(--dd-brume); }
.dd-chevrons li:last-child { background: var(--dd-orange); color: var(--dd-encre); }
.dd-chevrons strong { font-family: var(--dd-titre); font-size: 21px; line-height: 1.2; color: var(--dd-encre); }
.dd-chevron-num { font-family: var(--dd-titre); font-weight: 700; font-size: 56px; line-height: .9; color: var(--dd-orange); }
.dd-chevrons li:last-child .dd-chevron-num { color: var(--dd-encre); }

/* --------------------------------------------------- Avis */
.dd-avis { padding-block: clamp(72px, 9vw, 120px); background: var(--dd-sable); overflow: hidden; }
.dd-avis-in { display: flex; flex-wrap: wrap; align-items: stretch; gap: clamp(28px, 4vw, 56px); }
.dd-avis-note { position: relative; flex: 0 1 400px; box-sizing: border-box; min-height: 420px; display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 40px 100px 40px 40px; background: var(--dd-encre); color: var(--dd-sable); --dd-pointe: 80px; clip-path: var(--dd-fleche); }
.dd-avis-deco { position: absolute; left: -60px; bottom: -70px; width: 220px; height: 220px; color: var(--dd-sable); opacity: .08; }
.dd-avis-chiffre { margin: 0; font-family: var(--dd-titre); font-weight: 700; font-size: 120px; line-height: .85; letter-spacing: -.04em; color: var(--dd-orange); }
.dd-avis-etoiles, .dd-avis-nombre { margin: 0; }
.dd-avis-nombre { color: var(--dd-gris-clair); }
.dd-avis-google { display: inline-flex; align-self: flex-start; align-items: center; gap: 10px; margin: 4px 0 0; padding: 8px 14px 8px 10px; border-radius: 999px; background: var(--dd-blanc); color: var(--dd-encre); font-size: 14px; font-weight: 600; }
.dd-avis-google svg { flex-shrink: 0; }
.dd-avis-note .dd-lien-souligne { align-self: flex-start; margin-top: 10px; }
.dd-avis-liste { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.dd-avis-liste .dd-tete-section { margin-bottom: 28px; flex-wrap: nowrap; }
.dd-avis .dd-titre { font-size: clamp(28px, 2.8vw, 40px); }
/* Avis : section large, 2 avis à la fois (3 sur très grand écran). */
.dd-avis .dd-conteneur { max-width: var(--dd-large); }
.dd-avis-piste { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 20px) / 2); gap: 20px; }
@media (min-width: 1700px) { .dd-avis-piste { grid-auto-columns: calc((100% - 40px) / 3); } }
@media (max-width: 720px) { .dd-avis-piste { grid-auto-columns: 100%; } }
.dd-avis-carte { box-sizing: border-box; width: auto; padding: 34px 36px !important; display: flex; flex-direction: column; gap: 14px; padding: 30px; border-radius: 28px; background: var(--dd-blanc); }
.dd-guillemet { height: 36px; font-family: var(--dd-titre); font-weight: 700; font-size: 80px; line-height: .6; color: var(--dd-orange); }
.dd-avis-texte { flex-grow: 1; margin: 0; font-size: 16px; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; }
.dd-avis-auteur { display: flex; align-items: center; gap: 12px; margin: 0; padding-top: 16px; border-top: 1px solid #ECE6DC; font-size: 15px; }
.dd-avis-auteur strong { display: block; }
.dd-avis-initiale { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; flex-shrink: 0; border-radius: 999px; background: var(--dd-brume); font-family: var(--dd-titre); font-weight: 700; }
.dd-avis-meta { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--dd-gris); }
.dd-etoiles { display: inline-flex; gap: 2px; }
.dd-etoile { display: inline-flex; color: #D7D0C3; }
.dd-etoile .dd-ico { width: 18px; height: 18px; fill: currentColor; stroke: none; }
.dd-etoile.is-pleine { color: var(--dd-orange); }
.dd-etoile.is-demie { color: var(--dd-orange); opacity: .55; }
.dd-avis-note .dd-etoile .dd-ico { width: 24px; height: 24px; }
.dd-avis-meta .dd-etoile .dd-ico { width: 13px; height: 13px; }
.dd-hero .dd-etoile { color: #5A6280; }
.dd-hero .dd-etoile.is-pleine, .dd-hero .dd-etoile.is-demie { color: var(--dd-orange); }

/* --------------------------------------------------- Accueil : secteur (carte radiale) */
.dd-secteur-in { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(40px, 6vw, 80px); }
.dd-secteur-texte { flex: 1 1 380px; min-width: 0; }
.dd-secteur-texte h2 { margin-top: 0; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; letter-spacing: -.025em; }
.dd-carte-zone { flex: 1.1 1 460px; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 28px; }
.dd-carte { position: relative; width: 100%; max-width: 580px; aspect-ratio: 1 / 1; }
.dd-carte-fond { position: absolute; inset: 0; width: 100%; height: 100%; }
.dd-carte-anneau { fill: none; stroke: var(--dd-encre-3); stroke-width: .3; stroke-dasharray: 1 1.4; }
.dd-carte-couronne { fill: #18213F; stroke: var(--dd-encre-3); stroke-width: .3; }
.dd-carte-paris { fill: #222C50; stroke: var(--dd-orange); stroke-width: .4; }
.dd-carte-axes { stroke: var(--dd-encre-3); stroke-width: .2; }
.dd-carte-dep { position: absolute; font-size: clamp(9px, .8vw, 11px); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #8A90A8; white-space: nowrap; }
.dd-carte-dep-93 { left: 50%; top: 16%; transform: translateX(-50%); }
.dd-carte-dep-92 { left: 17%; top: 50%; transform: translate(-50%, -50%) rotate(-90deg); }
.dd-carte-dep-94 { left: 50%; top: 84%; transform: translateX(-50%); }
.dd-carte-centre { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; color: var(--dd-sable); text-decoration: none; }
.dd-carte-centre .dd-symbole { width: clamp(26px, 3vw, 38px); height: clamp(26px, 3vw, 38px); color: var(--dd-orange); }
.dd-carte-centre strong { font-family: var(--dd-titre); font-size: clamp(18px, 1.8vw, 24px); }
.dd-carte-centre span { font-size: 12px; color: var(--dd-gris-clair); }
.dd-carte-centre:hover strong { color: var(--dd-orange); }
.dd-carte-ville { position: absolute; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px 7px 9px; border-radius: 999px; border: 1.5px solid var(--dd-sable); background: var(--dd-encre); color: var(--dd-sable); font-family: var(--dd-titre); font-weight: 600; font-size: clamp(11px, 1vw, 14px); text-decoration: none; white-space: nowrap; transition: background-color .45s ease, color .45s ease, border-color .45s ease; }
.dd-carte-ville::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--dd-orange); }
.dd-carte-ville:hover { background: var(--dd-sable); color: var(--dd-encre); }
.dd-carte-ville.is-agence { border-color: var(--dd-orange); background: var(--dd-orange); color: var(--dd-encre); }
.dd-carte-ville.is-agence::before { background: var(--dd-encre); }
.dd-home-secteurs { width: 100%; }
.dd-home-secteurs .home-secteurs { margin: 0; padding: 0; background: none; border: 0; }
.dd-home-secteurs .home-secteurs-in { padding: 0; background: none; border: 0; box-shadow: none; }
.dd-home-secteurs .home-secteurs-in h2 { margin: 0 0 6px; font-size: 18px; color: var(--dd-sable); }
.dd-home-secteurs .home-secteurs-in > p { color: var(--dd-gris-clair); font-size: 15px; }
.dd-home-secteurs .home-secteurs-links a { border: 1px solid var(--dd-encre-3); background: transparent; color: var(--dd-sable); }
.dd-home-secteurs .home-secteurs-links a:hover { background: var(--dd-sable); color: var(--dd-encre); }
.dd-home-secteurs .home-secteurs-all { color: var(--dd-orange); }

/* --------------------------------------------------- Accueil : mot-clé principal */
.dd-mot-cle-accueil-in { display: flex; flex-wrap: wrap; align-items: flex-start; gap: clamp(40px, 6vw, 88px); }
.dd-mot-cle-accueil-in > .dd-prose { flex: 1.2 1 480px; min-width: 0; }
.dd-mot-cle-accueil-in > .dd-prose > h2:first-child { margin-top: 0; font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; letter-spacing: -.025em; }
.dd-mot-cle-visuel { flex: 1 1 380px; min-width: 0; position: sticky; top: calc(var(--dd-entete-h) + 32px); }
.dd-mot-cle-visuel img { display: block; margin: 0; border-radius: 0; width: 100%; height: clamp(360px, 38vw, 540px); object-fit: cover; clip-path: polygon(50% 0, 100% 26%, 100% 100%, 0 100%, 0 26%); }
.dd-dpe-carte { position: absolute; left: -16px; bottom: 28px; width: 230px; box-sizing: border-box; display: flex; flex-direction: column; gap: 5px; padding: 18px; border-radius: 22px; background: var(--dd-blanc); box-shadow: 0 18px 40px rgba(20, 27, 52, .16); }
.dd-dpe-carte p { margin: 0 0 6px; font-family: var(--dd-titre); font-weight: 700; font-size: 14px; }
.dd-dpe-barre { display: block; height: 15px; --dd-pointe: 8px; clip-path: var(--dd-fleche); }
.dd-dpe-a { width: 34%; background: #009C6D; } .dd-dpe-b { width: 44%; background: #52B153; } .dd-dpe-c { width: 54%; background: #A5CC74; }
.dd-dpe-d { width: 64%; background: #F4E70F; } .dd-dpe-e { width: 74%; background: #F0B40F; } .dd-dpe-f { width: 84%; background: #EB8235; } .dd-dpe-g { width: 94%; background: #D7221F; }
.dd-texte-seul { max-width: 860px; }

/* --------------------------------------------------- Dernier appel à l'action */
.dd-appel-final { position: relative; overflow: hidden; background: var(--dd-orange); color: var(--dd-encre); }
.dd-appel-final-forme { position: absolute; left: 0; top: 0; bottom: 0; width: 56%; background: var(--dd-encre); clip-path: polygon(0 0, 82% 0, 100% 50%, 82% 100%, 0 100%); }
.dd-appel-final-in { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 36px; padding-block: clamp(64px, 8vw, 110px); }
.dd-appel-final-texte { flex: 1 1 420px; max-width: 600px; color: var(--dd-sable); }
.dd-appel-final-texte p:last-child { margin: 14px 0 0; font-size: 18px; color: var(--dd-gris-clair); }
.dd-appel-final-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.dd-appel-final .dd-btn-encre { --dd-btn-survol: var(--dd-sable); }
.dd-appel-final .dd-btn-encre:hover .dd-ico { color: var(--dd-orange-texte); }

/* --------------------------------------------------- Pages internes */
.dd-essentiel { background: var(--dd-blanc); border-bottom: 1px solid #ECE6DC; }
.dd-essentiel-in { list-style: none; margin-block: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.dd-essentiel li { display: flex; align-items: center; gap: 14px; padding: 24px 16px 24px 0; font-family: var(--dd-titre); font-weight: 600; font-size: 17px; }
.dd-essentiel li span { white-space: nowrap; }
.dd-essentiel .dd-symbole { width: 30px; height: 30px; color: var(--dd-orange); flex-shrink: 0; }
.dd-lecture { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: clamp(36px, 5vw, 96px); }
.dd-lecture-texte { flex: 999 1 560px; min-width: 0; max-width: 860px; }
.dd-lecture-aside { flex: 0 1 400px; min-width: 300px; position: sticky; top: calc(var(--dd-entete-h) + 24px); display: flex; flex-direction: column; gap: 20px; }
.dd-carte-contact { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 14px; padding: 30px; border-radius: 28px; background: var(--dd-encre); color: var(--dd-gris-clair); }
.dd-carte-contact[hidden] { display: none; }
.dd-carte-contact-deco { position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; color: var(--dd-sable); opacity: .1; }
.dd-carte-contact-titre { margin: 0; font-family: var(--dd-titre); font-weight: 700; font-size: 27px; line-height: 1.1; color: var(--dd-sable); }
.dd-carte-contact p { margin: 0; }
.dd-carte-contact .dd-btn { width: 100%; box-sizing: border-box; }
.dd-carte-contact-horaires { text-align: center; font-size: 13px; color: var(--dd-gris-moyen); }
.dd-coches { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: 15px; }
.dd-coches li { display: flex; gap: 10px; }
.dd-coches .dd-ico { width: 18px; height: 18px; color: var(--dd-orange); margin-top: 2px; }
.dd-soeurs { padding: 26px; border-radius: 28px; background: var(--dd-blanc); }
.dd-soeurs-titre { margin: 0 0 8px; font-family: var(--dd-titre); font-weight: 700; font-size: 18px; }
.dd-soeurs ul { list-style: none; margin: 0; padding: 0; }
.dd-soeurs li { border-top: 1px solid #ECE6DC; }
.dd-soeurs a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; color: var(--dd-encre); font-size: 15px; text-decoration: none; }
.dd-soeurs a .dd-ico { width: 16px; height: 16px; color: var(--dd-orange-texte); }
.dd-soeurs a:hover { color: var(--dd-orange-texte); }
.dd-page-legale .dd-lecture-texte, .dd-page-legale .dd-prose { max-width: 860px; }
.dd-zones-in { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 56px; }
.dd-zones-in .dd-titre { flex: 1 1 280px; font-size: clamp(28px, 2.6vw, 38px); }
.dd-fleches-liens { flex: 2 1 560px; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dd-fleches-liens a { display: inline-flex; align-items: center; padding: 12px 34px 12px 16px; background: var(--dd-encre); color: var(--dd-sable); font-family: var(--dd-titre); font-weight: 600; font-size: 15px; text-decoration: none; --dd-pointe: 16px; clip-path: var(--dd-fleche); transition: background-color .2s ease, color .2s ease; }
.dd-fleches-liens a:hover { background: var(--dd-orange); color: var(--dd-encre); }
.dd-voir-aussi .dd-titre { margin-bottom: 28px; font-size: clamp(28px, 2.6vw, 38px); }
.dd-cartes-liens { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.dd-cartes-liens a { display: flex; justify-content: space-between; align-items: center; gap: 16px; height: 100%; box-sizing: border-box; padding: 20px 22px; border-radius: 22px; border: 2px solid transparent; background: var(--dd-blanc); color: var(--dd-encre); font-family: var(--dd-titre); font-weight: 600; font-size: 18px; line-height: 1.25; text-decoration: none; transition: border-color .2s ease; }
.dd-cartes-liens a:hover { border-color: var(--dd-orange); }
.dd-module .dd-prose-module h1 { font-size: clamp(36px, 4.4vw, 60px); line-height: 1.04; }
.dd-bloc-moteur { margin-top: 32px; }

/* FAQ */
.dd-faq-in { display: flex; flex-wrap: wrap; gap: clamp(32px, 5vw, 72px); }
.dd-faq-tete { flex: 1 1 300px; min-width: 0; }
.dd-faq-tete h2 { margin-top: 0; font-size: clamp(32px, 3.4vw, 48px); line-height: 1.05; }
.dd-faq-liste { flex: 2 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.dd-question { border-radius: 22px; border: 1px solid var(--dd-encre-3); background: var(--dd-encre-2); }
.dd-question summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 24px; cursor: pointer; list-style: none; }
.dd-question summary::-webkit-details-marker { display: none; }
.dd-question h3 { margin: 0; font-size: 19px; font-weight: 600; line-height: 1.3; color: var(--dd-sable); letter-spacing: -.01em; }
.dd-question-signe { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 999px; background: var(--dd-sable); color: var(--dd-encre); }
.dd-question-signe .dd-ico { width: 16px; height: 16px; }
.dd-ico-moins, .dd-question[open] .dd-ico-plus { display: none; }
.dd-question[open] .dd-ico-moins { display: block; }
.dd-question[open] .dd-question-signe { background: var(--dd-orange); }
.dd-reponse { padding: 0 24px 20px; font-size: 16px; }

/* --------------------------------------------------- Pages mots-clés : données locales et maillage */
.dd-local .dd-bloc-moteur:first-of-type { margin-top: 0; }
.dd-local .parc { margin: 0; padding: clamp(22px, 3vw, 36px); border-radius: 28px; background: var(--dd-blanc); }
.dd-local .parc__title { font-family: var(--dd-titre); font-size: clamp(28px, 3vw, 42px); line-height: 1.08; letter-spacing: -.02em; }
.dd-local .service-mesh, .dd-local .related, .dd-local .zones { margin: 0; padding: clamp(22px, 3vw, 32px); border-radius: 28px; background: var(--dd-blanc); border: 0; box-shadow: none; }
.dd-local .mesh-title, .dd-local .related h2, .dd-local .zones h2 { margin: 0 0 14px; font-family: var(--dd-titre); font-size: 21px; color: var(--dd-encre); }
.dd-local .mesh-links, .dd-local .related ul { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dd-local .mesh-links a, .dd-local .related a { display: inline-flex; padding: 11px 32px 11px 15px; border: 0; border-radius: 0; background: var(--dd-orange); color: var(--dd-encre); font-family: var(--dd-titre); font-weight: 600; font-size: 15px; text-decoration: none; --dd-pointe: 15px; clip-path: var(--dd-fleche); }
.dd-local .mesh-links a:hover, .dd-local .related a:hover { background: var(--dd-encre); color: var(--dd-sable); }
.dd-local .mesh-block + .mesh-block { margin-top: 18px; }
.dd-local .dd-bloc-moteur + .dd-bloc-moteur { margin-top: 20px; }

/* Barre d'action mobile (pages mots-clés). */
.dd-barre-action { display: none; }

/* --------------------------------------------------- Devis guidé (module du moteur) */
.dd-devis-page { padding-top: clamp(40px, 5vw, 64px); }
.dd-devis-ancre { flex: 999 1 600px; min-width: 0; margin-top: -120px; padding-top: 120px; }
.dd-devis-carte { box-sizing: border-box; padding: clamp(22px, 3vw, 40px); border-radius: 32px; background: var(--dd-blanc); box-shadow: 0 20px 50px rgba(20, 27, 52, .08); }
.dd-devis-carte .dg { --dg-accent: #FF5A2C; --dg-accent-ink: #141B34; --dg-ink: #141B34; --dg-muted: #3B4260; --dg-page: #FFFFFF; --dg-card: #F7F1E8; --dg-card-hover: #FFF4EF; --dg-glow: rgba(255, 90, 44, .25); --dg-track: #ECE6DC; --dg-radius: 18px; max-width: none; margin: 0; padding: 0; font-family: var(--dd-texte); }
.dd-devis-carte .dg-step-title { font-family: var(--dd-titre); font-weight: 700; font-size: clamp(26px, 2.4vw, 32px); letter-spacing: -.02em; }
.dd-devis-carte .dg-choice-card { border-radius: 20px; font-family: var(--dd-titre); font-weight: 600; }
.dd-devis-carte .dg-btn { font-family: var(--dd-titre); font-weight: 600; border-radius: 999px; }
.dd-recap { display: grid; gap: 8px; margin: 0; font-size: 15px; }
.dd-recap > div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--dd-encre-3); }
.dd-recap dt { color: var(--dd-gris-moyen); }
.dd-recap dd { margin: 0; font-weight: 600; color: var(--dd-sable); text-align: right; }
.dd-diag-prevus { list-style: none; margin: -6px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.dd-diag-prevus li { padding: 6px 22px 6px 10px; background: var(--dd-orange); color: var(--dd-encre); font-family: var(--dd-titre); font-weight: 600; font-size: 13px; --dd-pointe: 10px; clip-path: var(--dd-fleche); }
.dd-recap-note { font-size: 12px; color: var(--dd-gris-moyen); }
.dd-aide { padding: 26px; border-radius: 28px; background: var(--dd-blanc); }
.dd-aide-titre { margin: 0 0 8px; font-family: var(--dd-titre); font-weight: 700; font-size: 18px; }
.dd-aide p { margin: 0 0 10px; font-size: 15px; color: var(--dd-gris); }
.dd-aide-tel { display: inline-flex; align-items: center; gap: 10px; font-family: var(--dd-titre); font-weight: 700; font-size: 22px; color: var(--dd-encre); text-decoration: none; }
.dd-aide-tel .dd-ico { color: var(--dd-orange); }

/* Formulaire de contact du moteur dans les pages internes. */
.dd-page-corps form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), .dd-page-corps form textarea, .dd-page-corps form select { box-sizing: border-box; width: 100%; padding: 14px 16px; border-radius: 12px; border: 2px solid #D9D2C5; background: var(--dd-blanc); font: inherit; font-size: 16px; color: var(--dd-encre); }
.dd-page-corps form input:focus, .dd-page-corps form textarea:focus, .dd-page-corps form select:focus { outline: none; border-color: var(--dd-orange); box-shadow: 0 0 0 4px #FFE1D7; }
.dd-page-corps form button[type="submit"] { display: inline-flex; align-items: center; gap: 10px; padding: 16px 28px; border: 0; border-radius: 999px; background: var(--dd-orange); color: var(--dd-encre); font-family: var(--dd-titre); font-weight: 600; font-size: 17px; cursor: pointer; }
.dd-page-corps form button[type="submit"]:hover { background: var(--dd-encre); color: var(--dd-sable); }

/* Page Avis (module du moteur) : couleurs de la charte. */
.dd-module .reviews, .dd-page-corps .reviews { --rev-star: #FF5A2C; --rev-soft: #FFFFFF; --rev-radius: 22px; }

.review-google-cta { display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; font-family: var(--dd-titre); font-weight: 600; text-decoration: none !important; background: var(--dd-encre); color: var(--dd-sable); transition: background-color .35s ease, color .35s ease; }
.review-google-cta:hover, .review-google-cta:focus-visible { background: var(--dd-orange); color: var(--dd-encre); text-decoration: none !important; }

/* Formulaire de contact : case de consentement alignée sur son texte. */
.dd-page-corps .form-consent label { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.6; }
.dd-page-corps .form-consent input[type="checkbox"] { flex: 0 0 20px; width: 20px; height: 20px; margin: 3px 0 0; padding: 0; accent-color: var(--dd-orange); }
.dd-page-corps form .btn-contact { margin-top: 8px; }

/* Actualités (module du moteur) : couleurs de la charte, article en pleine largeur
   (le moteur resserre <main> sur la largeur de lecture). */
.blog, [data-page-type="article"] { --blog-accent: var(--dd-orange-texte); }
[data-page-type="article"] main { max-width: none; padding: 0; }
[data-page-type="article"] .dd-lecture-texte { max-width: 820px; margin-inline: auto; }
.post-cover img { border-radius: 22px; }

/* Modules du moteur (réalisations, projets, actualités) : couleurs et formes de la charte. */
.dd-prose-module { color: #2A3150; }
.dd-prose-module h1 { margin: 0 0 12px; font-size: clamp(36px, 4.4vw, 60px); line-height: 1.04; color: var(--dd-encre); }
.galerie, .reals { --gal-ink: var(--dd-encre); --gal-muted: var(--dd-gris); --gal-accent: var(--dd-encre); --gal-soft: var(--dd-blanc); --gal-radius: 24px; --gal-gap: 22px; --gal-overlay: rgba(20, 27, 52, .6); }
.projs, .proj-detail { --pj-accent: var(--dd-encre); --pj-text: var(--dd-encre); --pj-muted: var(--dd-gris); --pj-card-bg: var(--dd-blanc); --pj-shadow: none; --pj-radius: 24px; }
.blog, [data-page-type="article"] { --blog-ink: var(--dd-encre); --blog-body: #2A3150; --blog-muted: var(--dd-gris); --blog-soft: var(--dd-sable-2); --blog-card: var(--dd-blanc); --blog-line: var(--dd-ligne); --blog-radius: 24px; }
.real-cat, .proj-cat, .post-cat { color: var(--dd-orange-texte) !important; }
.reals-filter, .projs-filter, .blog-cats a { font-family: var(--dd-titre); }
.reals-filter, .projs-filter, .blog-cats a { background: var(--dd-blanc); color: var(--dd-encre); border: 1px solid var(--dd-ligne); transition: background-color .35s ease, color .35s ease; }
.reals-filter:hover, .projs-filter:hover, .blog-cats a:hover { background: var(--dd-sable-2); color: var(--dd-encre); }
.reals-filter.is-active, .projs-filter.is-active, .blog-cats a[aria-current="page"] { background: var(--dd-encre); color: var(--dd-sable); border-color: var(--dd-encre); }
.dd-ancien-filtre { background: var(--dd-blanc); color: var(--dd-encre); border: 1px solid var(--dd-ligne); transition: background-color .35s ease, color .35s ease; }
.reals-filter:hover { background: var(--dd-sable-2); }
.reals-filter.is-active { background: var(--dd-encre); color: var(--dd-sable); border-color: var(--dd-encre); }
.real-card, .proj-card { outline: 2px solid transparent; outline-offset: -2px; transition: outline-color .45s ease; }
.real-card:hover, .proj-card:hover { outline-color: var(--dd-orange); }
.real-title { font-family: var(--dd-titre); font-size: 20px; }
/* Liste des actualités : rendue dans le texte courant, on y neutralise les styles du texte. */
.dd-prose .blog a { color: inherit; font-weight: inherit; text-decoration: none; }
.dd-prose .blog .blog-more, .dd-prose .blog .blog-eyebrow { color: var(--dd-orange-texte); font-weight: 700; }
.dd-prose .blog img { height: 100%; border-radius: 0; }
.dd-prose .blog h2, .dd-prose .blog h3 { margin: 0; font-family: var(--dd-titre); }
.dd-prose .blog ul > li { padding-left: 0; }
.dd-prose .blog .blog-cats a[aria-current="page"] { color: var(--dd-sable); }
.dd-lecture-texte:has(.blog), .dd-lecture-texte:has(.reviews) { max-width: none; }
.dd-prose .blog h3, .dd-prose .blog .blog-card h2 { font-size: 22px; line-height: 1.25; }
/* Page Avis : note et formulaire à gauche, avis en grille large, avec de l'air. */
.dd-prose .reviews { max-width: none; margin: 0; }
.dd-prose .reviews-layout { grid-template-columns: 400px minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); }
@media (max-width: 1023px) { .dd-prose .reviews-layout { grid-template-columns: 1fr; } }
.dd-prose .reviews h2, .dd-prose .reviews h3 { margin-top: 0; }
.dd-prose .reviews a:not(.review-google-cta) { text-decoration: none; }
.dd-prose .blog ul > li::before { display: none; }
.blog-feature, .blog-card { outline: 2px solid transparent; outline-offset: -2px; transition: outline-color .45s ease; }
.blog-feature:hover, .blog-card:hover { outline-color: var(--dd-orange); }
.real-count { background: var(--dd-encre); }

/* --------------------------------------------------- Liens utiles et pied de page */
.quick-access.dd-utiles { max-width: none; margin: 0; padding: 0; background: var(--dd-sable-2); }
.dd-utiles-in { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; padding-block: 18px; }
.dd-utiles-titre { margin: 0 8px 0 0; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--dd-orange-texte); }
.dd-utiles ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.dd-utiles a { display: inline-block; padding: 8px 14px; border-radius: 999px; border: 1px solid #E0D5C3; background: var(--dd-sable); color: var(--dd-encre); font-size: 14px; font-weight: 500; text-decoration: none; }
.dd-utiles a:hover { border-color: var(--dd-encre); }
.site-footer.dd-pied { position: relative; overflow: hidden; margin: 0; padding: clamp(48px, 6vw, 80px) 0 0; background: var(--dd-encre); color: var(--dd-gris-clair); }
.dd-pied-deco { position: absolute; right: -90px; bottom: -120px; width: 520px; height: 520px; color: var(--dd-sable); opacity: .06; }
.dd-pied-grille { position: relative; display: grid; grid-template-columns: 1.3fr 1fr 1.2fr 1fr; gap: 40px; }
.dd-pied-logo img { display: block; height: 38px; width: auto; }
.dd-pied .footer-tagline { margin: 18px 0 0; max-width: 320px; font-size: 15px; line-height: 1.6; color: var(--dd-gris-clair); }
.dd-pied nav.dd-pied-col { display: block; max-width: none; margin: 0; }
.dd-pied .dd-pied-titre { margin: 0 0 14px; font-family: var(--dd-titre); font-weight: 700; font-size: 18px; color: var(--dd-blanc); }
.dd-pied ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; font-size: 15px; }
.dd-pied a { color: var(--dd-gris-clair); font-size: 15px; text-decoration: none; }
.dd-pied a:hover { color: var(--dd-orange); }
.dd-pied .dd-pied-tel { font-family: var(--dd-titre); font-weight: 600; color: var(--dd-orange); }
.dd-pied-nav { margin-top: 18px !important; padding-top: 18px !important; border-top: 1px solid var(--dd-encre-3); }
.dd-social { display: flex !important; gap: 10px; margin-top: 18px !important; }
.footer-bottom.dd-pied-bas { position: relative; box-sizing: border-box; width: calc(100% - 2 * var(--dd-gouttiere)); max-width: calc(var(--dd-large) - 2 * var(--dd-gouttiere)); margin: 48px auto 0; padding: 22px 0 28px; border-top: 1px solid var(--dd-encre-3); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px; font-size: 13px; color: var(--dd-gris-moyen); }
.dd-pied-bas nav { display: flex; flex-wrap: wrap; gap: 8px 20px; max-width: none; margin: 0; }
.dd-pied-bas a { font-size: 13px; }
.dd-credit strong { color: var(--dd-sable); }

/* --------------------------------------------------- Animations
   Goûts de l'utilisateur : aucune translation au survol, boutons en balayage de fond, cartes
   en contour / ombre / couleur, apparitions en fondu seul. Tout est coupé avec
   prefers-reduced-motion. */

/* Chargement : le texte du haut de page apparaît en fondu, la pointe orange se dessine.
   CSS seul, joué dès le premier affichage : rien ne clignote, rien ne dépend du script. */
@keyframes dd-fondu { from { opacity: 0; } to { opacity: 1; } }
@keyframes dd-devoile { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes dd-pouls { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.5); opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
    .dd-hero-texte > * { animation: dd-fondu .9s ease both; }
    .dd-hero-texte > :nth-child(2) { animation-delay: .1s; }
    .dd-hero-texte > :nth-child(3) { animation-delay: .2s; }
    .dd-hero-texte > :nth-child(4) { animation-delay: .3s; }
    .dd-hero-texte > :nth-child(5) { animation-delay: .4s; }
    .dd-hero-texte > :nth-child(n+6) { animation-delay: .5s; }
    .dd-devis-barre, .dd-carte-devis { animation: dd-fondu 1s .5s ease both; }
    .dd-hero-pointe { animation: dd-devoile 1.4s .15s cubic-bezier(.65, 0, .35, 1) both; }
    .dd-carte-ville.is-agence::after { animation: dd-pouls 2.6s ease-out infinite; }
}
.dd-avis-deco, .dd-carte-contact-deco, .dd-pied-deco, .dd-diagnostics-deco { pointer-events: none; }
.dd-avis-note > :not(.dd-avis-deco) { position: relative; z-index: 1; }
.dd-carte-ville.is-agence::after { content: ""; position: absolute; inset: -2px; border-radius: 999px; border: 2px solid var(--dd-orange); pointer-events: none; }

/* En-tête : sous 1500 px, le téléphone laisse la place au menu (il reste dans la barre mobile et les pages). */
@media (max-width: 1500px) { .dd-entete-tel { display: none; } .dd-entete .dd-menu-lien, .dd-entete .dd-menu-bouton { padding-inline: 11px; font-size: 15px; } }
.dd-entete .dd-menu { flex-wrap: nowrap; }

/* Menu : un trait orange se déploie sous le lien (bureau). */
@media (min-width: 1241px) {
    .dd-entete .dd-menu-lien { position: relative; }
    .dd-entete .dd-menu-lien:hover { background: none; }
    .dd-entete .dd-menu-lien::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 5px; height: 2px; border-radius: 2px; background: var(--dd-orange); transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.65, 0, .35, 1); }
    .dd-entete .dd-menu-lien:hover::after, .dd-entete .dd-menu-lien[aria-current="page"]::after { transform: scaleX(1); }
}

/* Appel du haut de page : le rond du téléphone se remplit. */
.dd-appel:hover .dd-rond-grand { background: var(--dd-orange); border-color: var(--dd-orange); }
.dd-appel:hover .dd-rond-grand .dd-ico { color: var(--dd-encre); }
.dd-rond .dd-ico { transition: color .25s ease; }

/* Cartes des diagnostics : l'image s'approche, le contour s'allume, la flèche s'éclaire. */
.dd-diag-carte a:hover .dd-diag-image, .dd-diag-carte a:focus-visible .dd-diag-image { transform: scale(1.07); }
.dd-diag-carte .dd-rond-orange { transition: background-color .3s ease, color .3s ease; }
.dd-diag-carte a:hover .dd-rond-orange { background: var(--dd-sable); }

/* Présentation : les photos s'approchent doucement au survol. */
.dd-presentation-photo, .dd-presentation-maison { transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.dd-presentation-visuels:hover .dd-presentation-photo { transform: scale(1.03); }
.dd-presentation-visuels:hover .dd-presentation-maison { transform: scale(1.05); }

/* Avis, liens en cartes, questions : contour et ombre. */
.dd-avis-carte { outline: 2px solid transparent; outline-offset: -2px; transition: outline-color .45s ease, background-color .45s ease; }
.dd-avis-carte:hover { outline-color: var(--dd-orange); background: #FFFBF8; }
.dd-cartes-liens a { transition: border-color .3s ease, box-shadow .3s ease; }
.dd-cartes-liens a:hover { box-shadow: 0 16px 36px rgba(20, 27, 52, .1); }
.dd-cartes-liens .dd-rond-orange { transition: background-color .3s ease, color .3s ease; }
.dd-cartes-liens a:hover .dd-rond-orange { background: var(--dd-encre); color: var(--dd-orange); }
.dd-question { transition: border-color .3s ease, background-color .3s ease; }
.dd-question:hover { border-color: var(--dd-orange); }
.dd-carte-contact { transition: box-shadow .4s ease; }
.dd-carte-contact:hover { box-shadow: 0 24px 50px rgba(20, 27, 52, .22); }

/* Étapes et étiquette « classe A » : la couleur change au survol. */
.dd-chevrons li { transition: background-color .5s ease; }
.dd-chevrons li:hover { background: var(--dd-orange-pale); }
.dd-chevrons li:nth-child(2n):hover { background: #CDD5E8; }
.dd-chevrons li:last-child:hover { background: var(--dd-orange-2); }
.dd-lettre-a { transition: background-color .3s ease, color .3s ease; }
.dd-barre-a:hover .dd-lettre-a { background: var(--dd-sable); color: var(--dd-orange-texte); }

/* Liens : soulignement qui se déploie (pied de page), couleur (texte, liens utiles). */
.dd-pied ul a { background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 1px; padding-bottom: 2px; transition: background-size .35s ease, color .25s ease; }
.dd-pied ul a:hover { background-size: 100% 1px; }
.dd-prose a { text-decoration-color: rgba(185, 58, 18, .35); transition: color .25s ease, text-decoration-color .25s ease; }
.dd-prose a:hover { text-decoration-color: var(--dd-orange); }
.dd-utiles a { transition: background-color .25s ease, color .25s ease, border-color .25s ease; }
.dd-utiles a:hover { background: var(--dd-encre); border-color: var(--dd-encre); color: var(--dd-sable); }
.dd-soeurs a, .dd-soeurs a .dd-ico { transition: color .25s ease; }

/* Remplissage des barres « classe A » à l'apparition, comme une étiquette énergie. */
.dd-anime .dd-barre-a[data-dd-apparait] { opacity: 1; background: linear-gradient(var(--dd-bar), var(--dd-bar)) no-repeat 0 0 / 0% 100%; transition: background-size 1.1s cubic-bezier(.65, 0, .35, 1) var(--dd-delai, 0ms); }
.dd-anime .dd-barre-a[data-dd-apparait] > * { opacity: 0; transition: opacity .6s ease calc(var(--dd-delai, 0ms) + .5s); }
.dd-anime .dd-barre-a.is-vu { background-size: 100% 100%; }
.dd-anime .dd-barre-a.is-vu > * { opacity: 1; }

/* Motifs vivants hors du haut de page : dernier appel (sur l'orange), diagnostics (sur l'encre). */
.dd-motif-appel { display: grid; left: auto; right: var(--dd-gouttiere); top: 30px; grid-template-columns: repeat(5, 12px); color: var(--dd-encre); }
.dd-motif-appel .dd-symbole { opacity: .25; }
.dd-motif-appel .dd-symbole.is-allume { color: var(--dd-sable); }
.dd-motif-sombre { display: grid; left: auto; right: var(--dd-gouttiere); top: 64px; grid-template-columns: repeat(6, 12px); }

/* --------------------------------------------------- Apparitions au défilement (fondu seul) */
.dd-anime [data-dd-apparait] { opacity: 0; transition: opacity .8s ease var(--dd-delai, 0ms), background-color .45s ease, border-color .45s ease, outline-color .45s ease, box-shadow .45s ease, color .45s ease; }
.dd-anime [data-dd-apparait].is-vu { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
    .dd-anime [data-dd-apparait] { opacity: 1; transition: none; }
    .dd-btn, .dd-diag-image, .dd-motif .dd-symbole, .dd-presentation-photo, .dd-presentation-maison { transition: none; }
    .dd-anime .dd-barre-a[data-dd-apparait], .dd-anime .dd-barre-a[data-dd-apparait] > * { transition: none; background-size: 100% 100%; opacity: 1; }
    .dd-piste { scroll-behavior: auto; }
}

/* --------------------------------------------------- Tablettes et mobiles */
@media (max-width: 1180px) {
    /* Dernier appel : les boutons passent sous le texte, le D laisse place à un fond encre plein. */
    .dd-appel-final { background: var(--dd-encre); }
    .dd-motif-appel { display: none; }
    .dd-appel-final-forme { display: none; }
    .dd-appel-final .dd-btn-encre { --dd-btn-fond: var(--dd-orange); --dd-btn-survol: var(--dd-sable); color: var(--dd-encre); }
    .dd-appel-final .dd-btn-encre .dd-ico { color: var(--dd-encre); }
    .dd-appel-final .dd-btn-contour-encre { --dd-btn-survol: var(--dd-sable); border-color: rgba(247, 241, 232, .55); color: var(--dd-sable); }
    .dd-appel-final .dd-btn-contour-encre:hover { color: var(--dd-encre); }
}
@media (max-width: 1279px) {
    /* Page mot-clé : texte et carte de devis côte à côte, le D laisse place à un voile plein. */
    .dd-hero-mot-cle .dd-hero-panneau { width: 100%; clip-path: none; background: rgba(20, 27, 52, .84); }
    .dd-hero-mot-cle .dd-hero-pointe { display: none; }
    .dd-hero-mot-cle .dd-hero-video { left: 0; width: 100%; aspect-ratio: auto; object-fit: cover; object-position: 32% center; }
}
@media (max-width: 1180px) {
    .dd-devis-barre-titre { flex-basis: 100%; padding-top: 4px; }
}
@media (max-width: 1240px) {
    .dd-pied-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1023px) {
    .dd-hero .dd-hero-panneau { width: 100%; clip-path: none; background: rgba(20, 27, 52, .86); }
    .dd-hero-pointe, .dd-motif { display: none; }
    .dd-hero .dd-hero-video { left: 0; width: 100%; aspect-ratio: auto; object-fit: cover; object-position: 32% center; }
    .dd-hero-accueil, .dd-hero-mot-cle { height: auto; min-height: 0; }
    .dd-hero-visuel { width: 100%; }
    .dd-hero-page { min-height: 0; }
    .dd-hero-mot-cle-in { flex-wrap: wrap; }
    .dd-carte-devis { flex: 1 1 100%; }
    .dd-chevrons { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .dd-chevrons li, .dd-chevrons li:first-child { clip-path: none; padding: 26px 24px; min-height: 0; border-radius: 22px; }
    .dd-lecture-aside { position: static; flex: 1 1 100%; min-width: 0; }
    .dd-mot-cle-visuel { position: relative; top: 0; }
    .dd-presentation-visuels { position: relative; top: 0; }
}
@media (max-width: 720px) {
    body { font-size: 16px; }
    .dd-hero-in { padding-top: 24px; }
    .dd-hero-texte { gap: 18px; }
    .dd-hero-actions { gap: 12px; }
    .dd-hero-actions .dd-btn { width: 100%; box-sizing: border-box; }
    .dd-hero-texte > .dd-hero-actions { order: 2; }
    .dd-hero-texte > .dd-hero-accroche { order: 3; }
    .dd-hero-texte > .dd-arguments, .dd-hero-texte > .dd-hero-note { order: 4; }
    .dd-seulement-mobile { display: inline-flex; }
    .dd-seulement-bureau { display: none; }
    .dd-video-pause { display: none; }
    .dd-devis-barre { border-radius: 24px; }
    .dd-devis-barre-titre { padding: 4px 6px 0; }
    .dd-devis-barre-choix { flex-basis: 100%; }
    .dd-choix { flex-basis: calc(50% - 4px); }
    .dd-devis-barre .dd-btn { width: 100%; }
    .dd-chiffres { grid-template-columns: 1fr; }
    .dd-diag-carte { width: 280px; }
    .dd-diag-carte a { height: 420px; }
    .dd-chevrons { grid-template-columns: 1fr; }
    .dd-barre-a { padding-right: 52px; --dd-pointe: 34px; }
    .dd-avis-note { min-height: 0; padding: 32px 90px 32px 28px; }
    .dd-avis-chiffre { font-size: 96px; }
    .dd-carte-ville { padding: 5px 9px 5px 7px; gap: 5px; }
    .dd-carte-ville::before { width: 6px; height: 6px; }
    .dd-carte-centre span { display: none; }
    .dd-dpe-carte { left: 8px; width: 200px; }
    .dd-pied-grille { grid-template-columns: 1fr; }
    .dd-appel-final-actions, .dd-appel-final-actions .dd-btn { width: 100%; box-sizing: border-box; }
    .dd-diag-texte { columns: 1; }
    /* Barre d'action fixe : apparaît quand les boutons du haut sortent de l'écran. */
    .dd-barre-action { position: fixed; z-index: 90; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: var(--dd-blanc); box-shadow: 0 -10px 30px rgba(20, 27, 52, .16); transform: translateY(110%); transition: transform .3s ease; }
    .dd-barre-action.is-visible { transform: none; }
    .dd-barre-action .dd-btn { padding: 14px 12px; }
    .dd-vue-atterrissage .dd-pied { padding-bottom: 76px; }
}
.dd-prose .review-google-cta { color: var(--dd-sable); padding: 14px 26px; }
.dd-prose .review-google-cta:hover { color: var(--dd-encre); }

/* Accueil : dernières actualités centrées (la marge du moteur annulait margin-inline: auto). */
.dd-actus .home-actus { margin: 0 auto; }

/* Devis LicielWeb (module chargé depuis liciweb.com) : ses 5 étapes s'écrasent à côté de la colonne d'aide.
   Le formulaire prend toute la largeur, « Besoin d'aide ? » passe dessous en bandeau. */
.dd-lecture:has(#rdv_diag_erp) { flex-direction: column; align-items: stretch; gap: 24px; max-width: 1240px; }
.dd-devis-ancre:has(#rdv_diag_erp) { width: 100%; min-width: 0; }
.dd-lecture:has(#rdv_diag_erp) .dd-lecture-aside { position: static; flex: none; width: 100%; min-width: 0; }
.dd-lecture:has(#rdv_diag_erp) .dd-aide { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 28px; padding: 22px clamp(22px, 3vw, 40px); }
.dd-lecture:has(#rdv_diag_erp) .dd-aide p { margin: 0; }
.dd-lecture:has(#rdv_diag_erp) .dd-aide-tel { margin-left: auto; }
@media (max-width: 767px) { .dd-lecture:has(#rdv_diag_erp) .dd-aide-tel { margin-left: 0; } }
#rdv_diag_erp .menuStep { min-width: 0; }
/* Mobile : les intitulés des 5 étapes Liciel sont coupés (« PROPOSITIO ») : icônes seules. */
@media (max-width: 767px) { #rdv_diag_erp .menuStep .contentStepTitle { display: none; } }

/* Devis LicielWeb, étape « Proposition » (rendez-vous proposé) : Liciel y place le récapitulatif et le tarif
   (#step4), alors que override_erp_rdv_diag.css ne les habille que dans #step5. Mêmes règles, reprises pour #step4,
   puis mise en page du calendrier des rendez-vous (absente du moteur). Défaut de la Factory, à reporter chez elle. */
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--dv-s2);
    margin: 0 !important;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content > .row { display: contents; }
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-title {
    grid-column: 1 / -1;
    width: auto;
    left: auto;
    margin: 0 0 var(--dv-s1);
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-title::before { content: none; }
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content .d-lg-none { display: none !important; }
/* Adresse sur deux cases, diagnostics sur toute la largeur. */
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content .col-lg-8 { grid-column: span 2; }
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content .col-md-12:not(.col-lg-8) { grid-column: 1 / -1; }

#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content > .row > [class*="col-"] {
    display: flex;
    align-items: center;
    gap: var(--dv-s3);
    box-sizing: border-box;
    min-width: 0;
    padding: var(--dv-s3) !important;
    background: var(--dv-surface);
    border-radius: var(--dv-r);
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .content-icone {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    box-sizing: border-box;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: var(--dv-s2);
    background: var(--dv-bg);
    border-radius: 8px;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .content-icone svg {
    display: block;
    width: 100%;
    height: 100%;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .content-icone svg,
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .content-icone .cls-1,
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .content-icone path {
    fill: var(--dv-accent) !important;
    opacity: 1 !important;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .rappel-mission-content {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    text-align: left;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .rappel-mission-title {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    color: var(--dv-muted);
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .rappel-mission-value {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--dv-text);
    overflow-wrap: anywhere;
}

/* Le tarif : un panneau teinte, a hauteur du recapitulatif. */
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .tarif-box {
    display: flex;
    height: auto;
    margin: 0;
    padding: 0 !important;
    background: none;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .tarif-box > div {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    gap: var(--dv-s1);
    margin: 0;
    padding: var(--dv-s5);
    background: var(--dv-soft);
    border-radius: var(--dv-r);
    color: var(--dv-muted);
    font-size: 13px;
    line-height: 1.45;
    text-align: center;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .tarif-box h3 {
    margin: 0;
    color: var(--dv-text);
    font-size: 14px;
    font-weight: 600;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .tarif-box .tarif-presta {
    margin: var(--dv-s2) 0;
    color: var(--dv-accent);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
#rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .tarif-box .tarif-error-message {
    margin: var(--dv-s2) 0 0;
    color: var(--dv-text);
    font-size: 14px;
}
@media (max-width: 991px) {
    #rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row dense; }
    #rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content .col-lg-8 { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    #rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .fieldset-content { grid-template-columns: minmax(0, 1fr); }
    #rdv_diag_erp#rdv_diag_erp #step4 .result-tarif .tarif-box .tarif-presta { font-size: 32px; }
}
/* Calendrier : 5 jours en ligne, « Autres dates » à droite, créneaux du jour en colonnes dessous. */
#rdv_diag_erp#rdv_diag_erp #step4 > .fieldset-content { margin-top: var(--dv-s6) !important; }
#rdv_diag_erp#rdv_diag_erp #rdv-module { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: var(--dv-s3); align-items: stretch; margin-top: var(--dv-s4); }
#rdv_diag_erp#rdv_diag_erp #rdv-module > br { display: none; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--dv-s2); margin: 0; padding: 0; border: 0; list-style: none; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons::before, #rdv_diag_erp#rdv_diag_erp #rdv-buttons::after { content: none; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li { float: none; margin: 0; padding: 0; list-style: none; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li::marker { content: none; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li > a { display: block; height: 100%; box-sizing: border-box; margin: 0; padding: var(--dv-s3) var(--dv-s1); border: 1px solid var(--dv-border); border-radius: var(--dv-r); background: var(--dv-bg); color: var(--dv-text); font-size: 13px; line-height: 1.35; text-align: center; text-decoration: none; transition: border-color .15s ease, background-color .15s ease; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li > a:hover { border-color: var(--dv-border-hover); }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons .day-rdv { font-size: 22px; font-weight: 700; line-height: 1.3; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons small { color: var(--dv-muted); font-size: 12px; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li.active > a { background: var(--dv-accent); border-color: var(--dv-accent); color: var(--dv-accent-ink); }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li.active small { color: inherit; }
#rdv_diag_erp#rdv_diag_erp .date-rdv-selector { display: flex; flex-direction: column; justify-content: center; gap: var(--dv-s2); box-sizing: border-box; width: auto; margin: 0; text-align: center; }
#rdv_diag_erp#rdv_diag_erp .date-rdv-selecto-text { color: var(--dv-muted); font-size: 13px; }
#rdv_diag_erp#rdv_diag_erp .date-rdv-selector #date-rdv-selector { width: 100%; box-sizing: border-box; height: var(--dv-h); padding: 0 var(--dv-s3); background: var(--dv-bg); border: 1px solid var(--dv-border); cursor: pointer; }
#rdv_diag_erp#rdv_diag_erp #rdv-list { grid-column: 1 / -1; }
#rdv_diag_erp#rdv_diag_erp #rdv-list > .row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--dv-s2); }
#rdv_diag_erp#rdv_diag_erp #rdv-list > .row > .col-md-3 { display: flex; flex-direction: column; gap: var(--dv-s2); width: auto; }
#rdv_diag_erp#rdv_diag_erp #rdv-list > .row > .col-md-3:empty { display: none; }
#rdv_diag_erp#rdv_diag_erp #rdv-list .col-md-12 { width: auto; }
#rdv_diag_erp#rdv_diag_erp #rdv-list .btn-rdv-select { display: flex; align-items: center; justify-content: center; width: 100%; }
@media (max-width: 767px) {
    #rdv_diag_erp#rdv_diag_erp #rdv-module { grid-template-columns: minmax(0, 1fr); }
    #rdv_diag_erp#rdv_diag_erp #rdv-buttons { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--dv-s1); }
    #rdv_diag_erp#rdv_diag_erp #rdv-buttons > li { flex: 0 0 84px; scroll-snap-align: start; }
    #rdv_diag_erp#rdv_diag_erp .date-rdv-selector { flex-direction: row; align-items: center; }
    #rdv_diag_erp#rdv_diag_erp .date-rdv-selecto-text { flex: none; }
    #rdv_diag_erp#rdv_diag_erp #rdv-list > .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #rdv_diag_erp#rdv_diag_erp #rdv-list > .row > .col-md-3 { display: contents; }
}
/* La feuille de Liciel (servie depuis liciweb.com) force la liste des jours en flex et lui donne une largeur fixe. */
#rdv_diag_erp#rdv_diag_erp #dates-list { width: auto !important; max-width: none !important; float: none !important; margin: 0 !important; }
#rdv_diag_erp#rdv_diag_erp #rdv-buttons > li { width: auto !important; }
#rdv_diag_erp#rdv_diag_erp .date-rdv-selector { width: auto !important; float: none !important; }
@media (min-width: 768px) { #rdv_diag_erp#rdv_diag_erp #rdv-buttons { display: grid !important; width: auto !important; } }
@media (max-width: 767px) { #rdv_diag_erp#rdv_diag_erp #rdv-buttons { scrollbar-width: thin; } }

/* Devis LicielWeb : écran d'attente (js/maquette.js). L'envoi de la commande prend 20 à 30 s chez Liciel :
   anneau et barre qui avancent, messages qui changent, étapes cochées, consigne de ne pas fermer la page. */
html.dd-attente-active #rdv_diag_erp .liciel-loading { display: none !important; }
html.dd-attente-active { overflow: hidden; }
.dd-attente { position: fixed; inset: 0; z-index: 100001; display: grid; place-items: center; padding: 18px; background: rgba(20, 27, 52, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .3s ease; }
.dd-attente[hidden] { display: none; }
.dd-attente.is-visible { opacity: 1; }
.dd-attente-carte { box-sizing: border-box; width: min(440px, 100%); padding: 36px 32px 26px; border-radius: 28px; background: var(--dd-blanc); box-shadow: 0 30px 80px rgba(20, 27, 52, .35); text-align: center; transform: scale(.96); transition: transform .4s cubic-bezier(.2, .8, .2, 1); }
.dd-attente.is-visible .dd-attente-carte { transform: none; }
.dd-attente-anim { position: relative; width: 112px; height: 112px; margin: 0 auto 22px; color: var(--dd-orange); }
.dd-attente-anneau { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.dd-attente-piste, .dd-attente-arc { fill: none; stroke-width: 6; }
.dd-attente-piste { stroke: var(--dd-sable-2, #F1E8DA); }
.dd-attente-arc { stroke: var(--dd-orange); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset .4s linear; }
.dd-attente-maison { position: absolute; inset: 28px; width: 56px; height: 56px; color: var(--dd-encre); animation: dd-attente-souffle 2.4s ease-in-out infinite; }
.dd-attente-scan { position: absolute; left: 30px; right: 30px; top: 30px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, transparent, var(--dd-orange), transparent); box-shadow: 0 0 12px rgba(255, 90, 44, .6); animation: dd-attente-scan 1.8s ease-in-out infinite; }
.dd-attente-coche { position: absolute; inset: 28px; width: 56px; height: 56px; color: var(--dd-orange); opacity: 0; }
.dd-attente-coche path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.dd-attente.is-fini .dd-attente-maison, .dd-attente.is-fini .dd-attente-scan { opacity: 0; animation: none; transition: opacity .2s ease; }
.dd-attente.is-fini .dd-attente-coche { opacity: 1; }
.dd-attente.is-fini .dd-attente-coche path { stroke-dashoffset: 0; transition: stroke-dashoffset .5s .1s ease-out; }
.dd-attente.is-fini .dd-attente-anim { animation: dd-attente-pop .5s ease-out; }
.dd-attente-titre { min-height: 1.3em; margin: 0 0 6px; font-family: var(--dd-titre); font-size: 22px; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; color: var(--dd-encre); }
.dd-attente-texte { min-height: 2.9em; margin: 0 0 20px; font-size: 15px; line-height: 1.45; color: var(--dd-gris); }
.dd-attente.is-change .dd-attente-titre, .dd-attente.is-change .dd-attente-texte { animation: dd-attente-message .45s ease-out; }
.dd-attente-barre { position: relative; height: 6px; overflow: hidden; border-radius: 6px; background: var(--dd-sable-2, #F1E8DA); }
.dd-attente-barre span { position: absolute; inset: 0; transform-origin: left; transform: scaleX(0); border-radius: inherit; background: linear-gradient(90deg, var(--dd-orange), #FF8A5C); transition: transform .4s linear; }
.dd-attente-barre span::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); transform: translateX(-100%); animation: dd-attente-reflet 1.6s ease-in-out infinite; }
.dd-attente-etapes { display: none; margin: 22px 0 0; padding: 0; list-style: none; text-align: left; }
.dd-attente.is-commande .dd-attente-etapes { display: grid; gap: 10px; }
.dd-attente-etapes li { position: relative; padding-left: 32px; font-size: 14px; line-height: 22px; color: var(--dd-gris); opacity: .55; transition: opacity .3s ease, color .3s ease; }
.dd-attente-etapes li::before { content: ''; position: absolute; left: 0; top: 0; box-sizing: border-box; width: 22px; height: 22px; border: 2px solid var(--dd-ligne, #E6DED2); border-radius: 50%; transition: background-color .3s ease, border-color .3s ease; }
.dd-attente-etapes li.is-encours { opacity: 1; color: var(--dd-encre); font-weight: 600; }
.dd-attente-etapes li.is-encours::before { border-color: var(--dd-orange); border-right-color: transparent; animation: dd-attente-tourne .8s linear infinite; }
.dd-attente-etapes li.is-fait { opacity: 1; color: var(--dd-encre); }
.dd-attente-etapes li.is-fait::before { border-color: var(--dd-orange); background: var(--dd-orange); }
.dd-attente-etapes li.is-fait::after { content: ''; position: absolute; left: 7px; top: 5px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); animation: dd-attente-pop .3s ease-out; }
.dd-attente-note { display: none; align-items: center; justify-content: center; gap: 8px; margin: 22px 0 0; padding-top: 16px; border-top: 1px solid var(--dd-ligne, #E6DED2); font-size: 13px; color: var(--dd-gris); }
.dd-attente.is-commande .dd-attente-note { display: flex; }
.dd-attente-note svg { flex: none; width: 16px; height: 16px; color: var(--dd-orange); }
@keyframes dd-attente-souffle { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@keyframes dd-attente-scan { 0% { transform: translateY(0); opacity: 0; } 15%, 85% { opacity: 1; } 100% { transform: translateY(50px); opacity: 0; } }
@keyframes dd-attente-message { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes dd-attente-reflet { to { transform: translateX(100%); } }
@keyframes dd-attente-tourne { to { transform: rotate(360deg); } }
@keyframes dd-attente-pop { 0% { transform: scale(.6) rotate(45deg); opacity: 0; } 100% { opacity: 1; } }
.dd-attente.is-fini .dd-attente-anim { animation-name: dd-attente-rebond; }
@keyframes dd-attente-rebond { 0% { transform: scale(.9); } 60% { transform: scale(1.06); } 100% { transform: scale(1); } }
@media (max-width: 480px) { .dd-attente-carte { padding: 28px 22px 22px; } .dd-attente-titre { font-size: 20px; } }
@media (prefers-reduced-motion: reduce) {
    .dd-attente-maison, .dd-attente-scan, .dd-attente-barre span::after, .dd-attente-etapes li.is-encours::before { animation: none; }
    .dd-attente.is-change .dd-attente-titre, .dd-attente.is-change .dd-attente-texte, .dd-attente.is-fini .dd-attente-anim { animation: none; }
}

/* Devis LicielWeb, « Autres dates » : calendrier bootstrap-datetimepicker de Liciel, prévu pour la feuille Bootstrap 3
   (absente) : il s'ouvrait écrasé, sans fond ni flèches. Carte sous le champ, grille de 7 jours, flèches dessinées. */
#rdv_diag_erp#rdv_diag_erp .date-rdv-selector { position: relative; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget { position: absolute; top: calc(100% + 8px) !important; right: 0 !important; bottom: auto !important; left: auto !important; z-index: 50; display: block; box-sizing: border-box; width: 300px; max-width: calc(100vw - 36px); margin: 0; padding: 14px; border: 1px solid var(--dv-border); border-radius: 18px; background: var(--dv-bg); box-shadow: 0 18px 50px rgba(20, 27, 52, .18); color: var(--dv-text); font-size: 14px; text-align: center; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget.top { top: auto !important; bottom: calc(100% + 8px) !important; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget ul, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget li { margin: 0; padding: 0; list-style: none; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget li::marker { content: none; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget .collapse:not(.in), #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget .timepicker, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget .picker-switch.accordion-toggle { display: none; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 2px; table-layout: fixed; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td { height: 36px; padding: 0; border: 0; border-radius: 10px; background: none; line-height: 36px; text-align: center; vertical-align: middle; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.picker-switch { font-family: var(--dd-titre); font-size: 15px; font-weight: 700; text-transform: capitalize; cursor: pointer; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.dow { height: 28px; color: var(--dv-muted); font-size: 12px; font-weight: 600; text-transform: capitalize; cursor: default; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.prev, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.next { position: relative; cursor: pointer; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.prev span, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.next span { display: none; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.prev::after, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.next::after { content: ''; position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; margin: -4px 0 0 -3px; border: solid var(--dv-text); border-width: 0 0 2px 2px; transform: rotate(45deg); }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.next::after { margin-left: -6px; transform: rotate(-135deg); }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.disabled::after { opacity: .3; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.day, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td span { font-weight: 600; cursor: pointer; transition: background-color .15s ease, color .15s ease; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.prev:hover, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.next:hover, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget th.picker-switch:hover, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.day:hover, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td span:hover { background: var(--dv-surface); }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.old, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.new { color: var(--dv-muted); font-weight: 400; opacity: .55; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.today { position: relative; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.today::before { content: ''; position: absolute; bottom: 5px; left: 50%; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: var(--dv-accent); }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.active, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.active:hover, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td span.active { background: var(--dv-accent); color: var(--dv-accent-ink); opacity: 1; }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.active.today::before { background: var(--dv-accent-ink); }
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.disabled, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td.disabled:hover, #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td span.disabled { background: none; color: var(--dv-muted); opacity: .3; text-decoration: line-through; cursor: not-allowed; }
/* Vues mois et années : 4 cases par ligne. */
#rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget td span { display: inline-block; box-sizing: border-box; width: calc(25% - 4px); height: 44px; margin: 2px; border-radius: 10px; line-height: 44px; text-transform: capitalize; }
@media (max-width: 767px) { #rdv_diag_erp#rdv_diag_erp .bootstrap-datetimepicker-widget { left: 0 !important; right: 0 !important; width: auto; max-width: none; } }