@charset "UTF-8";
/*
Theme Name: Desentec
Theme URI: https://www.desentec.fr
Author: Agence Netlinqueen
Description: Magazine maison, jardin, decoration, travaux et immobilier. Archetype BD, Plan libre / Travees et cloisons.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: desentec
*/

/* ═══════════════════════════════════════════════════════════════
   DESENTEC — Archetype BD « Plan libre / Travees et cloisons »
   Signature : des cloisons verticales continues traversent toute
   la page. Les blocs se calent sur des travees inegales
   (22 / 19 / 27 / 32). Un seul accent : le magenta.
   ═══════════════════════════════════════════════════════════════ */

:root {
    --dsn-papier:     #FFFFFF;
    --dsn-brume:      #F4F4F6;
    --dsn-encre:      #121317;
    --dsn-nuit:       #0B0C0F;
    --dsn-doux:       #3A3B42;
    --dsn-gris:       #56545E;
    --dsn-filet:      #E3E3E6;
    --dsn-filet-fort: #C9C9CE;
    --dsn-mag:        #B5179E;
    --dsn-mag-clair:  #F7E6F4;
    --dsn-clair:      #F2EFF3;

    --dsn-travees: 22fr 19fr 27fr 32fr;
    --dsn-max: 1320px;
    --dsn-pad: 32px;
    --dsn-hh: 74px;

    --dsn-display: 'Rethink Sans', 'Helvetica Neue', Arial, sans-serif;
    --dsn-corps:   'Faustina', Georgia, 'Times New Roman', serif;
}

/* ── Reset ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    background: var(--dsn-papier);
    color: var(--dsn-encre);
    font-family: var(--dsn-corps);
    font-size: 1.0625rem;
    line-height: 1.68;
    padding-top: var(--dsn-hh);
    overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
ul { list-style: none; margin: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { font-family: var(--dsn-display); margin: 0; line-height: 1.04; letter-spacing: -0.022em; font-weight: 800; }
p { margin: 0 0 1.05em; }
button { font: inherit; }

:focus-visible {
    outline: 3px solid var(--dsn-mag);
    outline-offset: 3px;
}
.dsn-sombre :focus-visible,
.dsn-pied :focus-visible { outline-color: #FFFFFF; }

.dsn-evitement {
    position: absolute; left: -9999px; top: 0;
    background: var(--dsn-encre); color: #fff;
    padding: 12px 20px; z-index: 300;
    font-family: var(--dsn-display); font-weight: 700;
}
.dsn-evitement:focus { left: 12px; top: 12px; }

/* ── Conteneur + travees ───────────────────────────────────────── */
.dsn-cadre {
    width: 100%;
    max-width: var(--dsn-max);
    margin: 0 auto;
    padding: 0 var(--dsn-pad);
}
.dsn-travees {
    display: grid;
    grid-template-columns: var(--dsn-travees);
    gap: 0;
}

/* ── LES CLOISONS (signature) ──────────────────────────────────── */
.dsn-cloisons {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.dsn-cloisons .dsn-cadre { height: 100%; }
.dsn-cloisons-grille {
    display: grid;
    grid-template-columns: var(--dsn-travees);
    height: 100%;
}
.dsn-cloisons-grille i:not(:last-child) {
    border-right: 1px solid var(--dsn-filet);
}
.dsn-page { position: relative; z-index: 1; }

/* ── Libelles ──────────────────────────────────────────────────── */
.dsn-oeil {
    font-family: var(--dsn-display);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.19em;
    text-transform: uppercase;
    color: var(--dsn-mag);
    margin: 0 0 18px;
    display: flex;
    align-items: center;
    gap: 11px;
}
.dsn-oeil::before {
    content: '';
    width: 3px; height: 13px;
    background: var(--dsn-mag);
    flex-shrink: 0;
}
.dsn-tete {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 24px;
    border-top: 2px solid var(--dsn-encre);
    padding-top: 16px;
    margin-bottom: 38px;
}
.dsn-tete h2 {
    font-size: clamp(1.5rem, 2.6vw, 2.1rem);
    text-transform: uppercase;
    letter-spacing: -0.01em;
}
.dsn-tete-note {
    font-family: var(--dsn-display);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--dsn-gris);
    white-space: nowrap;
}

/* ── Boutons ───────────────────────────────────────────────────── */
.dsn-bouton {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--dsn-display);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    padding: 15px 26px;
    background: var(--dsn-encre);
    color: #fff;
    border: 2px solid var(--dsn-encre);
    cursor: pointer;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.dsn-bouton::after { content: '\2192'; transition: transform .2s ease; }
.dsn-bouton:hover { background: var(--dsn-mag); border-color: var(--dsn-mag); color: #fff; }
.dsn-bouton:hover::after { transform: translateX(4px); }
.dsn-bouton--ligne { background: transparent; color: var(--dsn-encre); }
.dsn-bouton--ligne:hover { background: var(--dsn-encre); border-color: var(--dsn-encre); color: #fff; }
.dsn-bouton--clair { background: #fff; color: var(--dsn-encre); border-color: #fff; }
.dsn-bouton--clair:hover { background: var(--dsn-mag); border-color: var(--dsn-mag); color: #fff; }

/* ── Entete ────────────────────────────────────────────────────── */
.dsn-entete {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: var(--dsn-hh);
    background: var(--dsn-papier);
    border-bottom: 2px solid var(--dsn-encre);
    z-index: 120;
    display: flex;
    align-items: center;
    transition: box-shadow .2s ease;
}
.dsn-entete--scroll { box-shadow: 0 6px 22px rgba(18,19,23,.09); }
.dsn-entete .dsn-cadre {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}
.dsn-marque { display: flex; align-items: center; flex-shrink: 0; }
.dsn-marque svg { display: block; height: 26px; width: auto; }

.dsn-nav { display: flex; align-items: center; gap: 28px; }
.dsn-nav-liens { display: flex; align-items: center; gap: 26px; }
.dsn-nav-liens a {
    position: relative;
    font-family: var(--dsn-display);
    font-size: 0.79rem;
    font-weight: 600;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 6px 0;
    color: var(--dsn-encre);
    transition: color .18s ease;
}
.dsn-nav-liens a::before {
    counter-increment: dsn-nav;
    content: counter(dsn-nav, decimal-leading-zero);
    font-size: 0.58rem;
    color: var(--dsn-mag);
    vertical-align: super;
    margin-right: 5px;
    letter-spacing: 0;
}
.dsn-nav-liens { counter-reset: dsn-nav; }
.dsn-nav-liens a::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0;
    width: 100%; height: 2px;
    background: var(--dsn-mag);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .22s ease;
}
.dsn-nav-liens a:hover { color: var(--dsn-mag); }
.dsn-nav-liens a:hover::after { transform: scaleX(1); }

.dsn-nav-contact {
    font-family: var(--dsn-display);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    padding: 10px 18px;
    border: 2px solid var(--dsn-encre);
    transition: background .2s ease, color .2s ease;
}
.dsn-nav-contact:hover { background: var(--dsn-encre); color: #fff; }

/* Elements exclusivement mobiles : masques sur desktop */
.dsn-nav-close { display: none; }
.dsn-nav-logo  { display: none; }
.dsn-burger    { display: none; }

/* ── Hero « ouverture » ────────────────────────────────────────── */
.dsn-ouverture { padding: 62px 0 0; }
.dsn-ouverture-grille { align-items: start; }
.dsn-ouverture-titre { grid-column: 1 / 4; padding-right: 42px; }
.dsn-ouverture h1 {
    font-size: clamp(2.7rem, 6.4vw, 5.3rem);
    letter-spacing: -0.035em;
    margin: 0 0 26px;
}
.dsn-ouverture h1 .dsn-mag { color: var(--dsn-mag); }
.dsn-deck {
    font-size: clamp(1.08rem, 1.5vw, 1.28rem);
    line-height: 1.56;
    color: var(--dsn-doux);
    max-width: 40ch;
    margin: 0 0 30px;
}
.dsn-deck em { font-style: italic; }

/* Les trois releves se repartissent sur toute la hauteur du bloc :
   sans cela le magenta laisse un grand vide sous le dernier chiffre. */
.dsn-releves {
    grid-column: 4 / 5;
    background: var(--dsn-mag);
    color: #fff;
    padding: 30px 26px;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
}
.dsn-releve + .dsn-releve {
    border-top: 1px solid rgba(255,255,255,.32);
    padding-top: 20px;
}
.dsn-releve-num {
    display: block;
    font-family: var(--dsn-display);
    font-size: clamp(2rem, 3.4vw, 2.9rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
}
.dsn-releve-lib {
    display: block;
    font-family: var(--dsn-display);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-top: 7px;
    color: rgba(255,255,255,.9);
}

.dsn-ouverture-bande { margin-top: 54px; }
.dsn-ouverture-vue {
    grid-column: 2 / 5;
    position: relative;
    aspect-ratio: 21 / 8;
    overflow: hidden;
    background: var(--dsn-brume);
}
.dsn-ouverture-vue img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}
.dsn-ouverture-legende {
    grid-column: 1 / 2;
    align-self: end;
    padding: 0 22px 4px 0;
    font-family: var(--dsn-display);
    font-size: 0.71rem;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--dsn-gris);
}

/* ── Flux articles ─────────────────────────────────────────────── */
.dsn-flux { padding: 84px 0 0; }

.dsn-manchette {
    display: grid;
    grid-template-columns: 58fr 42fr;
    gap: 0;
    border-top: 2px solid var(--dsn-encre);
    margin-bottom: 4px;
}
.dsn-manchette-vue {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--dsn-brume);
}
.dsn-manchette-vue img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.dsn-manchette:hover .dsn-manchette-vue img { transform: scale(1.03); }
.dsn-manchette-corps {
    padding: 30px 0 30px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.dsn-manchette h3 {
    font-size: clamp(1.55rem, 2.7vw, 2.35rem);
    margin: 12px 0 14px;
}
.dsn-manchette p { color: var(--dsn-doux); margin: 0 0 16px; }

.dsn-lots {
    display: grid;
    grid-template-columns: var(--dsn-travees);
    gap: 0;
    grid-auto-flow: dense;
}
/* Padding symetrique : le texte ne touche jamais une cloison.
   Les bordures de cellule, elles, tombent pile sur les lignes. */
.dsn-lot {
    border-top: 1px solid var(--dsn-filet-fort);
    padding: 22px 22px 40px;
    display: flex;
    flex-direction: column;
}
.dsn-lot--l { grid-column: span 2; }
.dsn-lot--e { grid-column: span 1; }
.dsn-lot-vue {
    position: relative;
    overflow: hidden;
    background: var(--dsn-brume);
    margin-bottom: 16px;
}
.dsn-lot--l .dsn-lot-vue { aspect-ratio: 16 / 10; }
.dsn-lot--e .dsn-lot-vue { aspect-ratio: 4 / 5; }
.dsn-lot-vue img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .5s ease;
}
.dsn-lot:hover .dsn-lot-vue img { transform: scale(1.04); }
.dsn-lot-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--dsn-display);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.dsn-lot-cat { color: var(--dsn-mag); }
.dsn-lot-duree { color: var(--dsn-gris); font-weight: 600; }
.dsn-lot h3 {
    font-size: 1.18rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 10px;
}
.dsn-lot--l h3 { font-size: 1.52rem; }
.dsn-lot h3 a { background-image: linear-gradient(var(--dsn-mag), var(--dsn-mag)); background-size: 0 2px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .28s ease; }
.dsn-lot:hover h3 a { background-size: 100% 2px; }
.dsn-lot p { font-size: 0.96rem; color: var(--dsn-doux); margin: 0; }

/* Etat vide */
.dsn-vide { border-top: 1px solid var(--dsn-filet-fort); }
.dsn-vide-item {
    border-bottom: 1px solid var(--dsn-filet);
    padding: 26px 26px 26px 0;
}
.dsn-vide-item h3 { font-size: 1.3rem; margin: 0 0 8px; }
.dsn-vide-item p { font-size: .96rem; color: var(--dsn-doux); margin: 0; }

/* ── Persona ───────────────────────────────────────────────────── */
.dsn-plume {
    background: var(--dsn-brume);
    margin-top: 92px;
    padding: 76px 0;
}
.dsn-plume-grille { align-items: center; }
.dsn-plume-corps { grid-column: 1 / 3; padding-right: 48px; }
.dsn-plume-corps h2 {
    font-size: clamp(1.9rem, 3.2vw, 2.7rem);
    margin: 10px 0 6px;
}
.dsn-plume-role {
    font-family: var(--dsn-display);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--dsn-mag);
    margin: 0 0 22px;
}
.dsn-plume-bio { color: var(--dsn-doux); }
.dsn-plume-bio p { margin: 0 0 1em; }
.dsn-plume-bio ul { margin: 0 0 1.2em; }
.dsn-plume-bio li { position: relative; padding-left: 22px; margin-bottom: .5em; }
.dsn-plume-bio li::before {
    content: '';
    position: absolute; left: 0; top: .52em;
    width: 3px; height: 13px;
    background: var(--dsn-mag);
}
.dsn-plume-bio li::after {
    content: '';
    position: absolute; left: 6px; top: .52em;
    width: 3px; height: 7px;
    background: var(--dsn-mag);
    opacity: .5;
}
.dsn-plume-bio strong { color: var(--dsn-encre); font-weight: 600; }
.dsn-plume-vue {
    grid-column: 3 / 5;
    position: relative;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: var(--dsn-filet);
}
.dsn-plume-vue img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }

/* ── Rubriques ─────────────────────────────────────────────────── */
.dsn-rubriques { padding: 92px 0 0; }
.dsn-colonnes {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    border-top: 2px solid var(--dsn-encre);
}
.dsn-colonne {
    position: relative;
    overflow: hidden;
    padding: 26px 22px 34px;
    border-right: 1px solid var(--dsn-filet);
    display: flex;
    flex-direction: column;
    min-height: 300px;
    isolation: isolate;
}
.dsn-colonne:last-child { border-right: 0; }
.dsn-colonne::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--dsn-mag);
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform .34s cubic-bezier(.4,0,.2,1);
    z-index: -1;
}
.dsn-colonne:hover::before { transform: scaleY(1); }
.dsn-colonne-num {
    font-family: var(--dsn-display);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: var(--dsn-mag);
    transition: color .3s ease;
}
/* Le picto reste en flux (les h3 s alignent donc d une colonne a
   l autre) et seul le compteur est pousse en pied de colonne. */
.dsn-colonne-picto { margin: 20px 0 0; }
.dsn-colonne-picto svg { width: 32px; height: 32px; display: block; }
.dsn-colonne h3 {
    font-size: 1.32rem;
    text-transform: uppercase;
    margin: 22px 0 8px;
    transition: color .3s ease;
}
.dsn-colonne p {
    font-size: 0.93rem;
    color: var(--dsn-doux);
    margin: 0 0 14px;
    transition: color .3s ease;
}
.dsn-colonne-cpt {
    margin-top: auto;
    padding-top: 14px;
    font-family: var(--dsn-display);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--dsn-gris);
    transition: color .3s ease;
}
.dsn-colonne:hover .dsn-colonne-num,
.dsn-colonne:hover h3,
.dsn-colonne:hover p,
.dsn-colonne:hover .dsn-colonne-cpt { color: #fff; }
.dsn-colonne:hover .dsn-colonne-picto svg { stroke: #fff; }
.dsn-colonne-picto svg { stroke: var(--dsn-encre); transition: stroke .3s ease; }

/* ── Coiffe (heros internes) ───────────────────────────────────── */
.dsn-coiffe {
    position: relative;
    background: var(--dsn-encre);
    color: #fff;
    overflow: hidden;
}
.dsn-coiffe-fond { position: absolute; inset: 0; }
.dsn-coiffe-fond img { width: 100%; height: 100%; object-fit: cover; }
.dsn-coiffe-fond::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(11,12,15,.80) 0%, rgba(11,12,15,.88) 100%);
}
.dsn-coiffe-inner { position: relative; z-index: 2; padding: 78px 0 66px; }
.dsn-coiffe h1 {
    font-size: clamp(2.1rem, 4.4vw, 3.6rem);
    max-width: 22ch;
    margin: 0 0 16px;
}
.dsn-coiffe .dsn-oeil { color: #fff; }
.dsn-coiffe .dsn-oeil::before { background: var(--dsn-mag); }
.dsn-coiffe-desc { color: var(--dsn-clair); max-width: 62ch; margin: 0; }
.dsn-coiffe-desc p { color: var(--dsn-clair); margin: 0; }

.dsn-fil {
    font-family: var(--dsn-display);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 22px;
    color: rgba(255,255,255,.78);
}
.dsn-fil a:hover { color: #fff; text-decoration: underline; }
.dsn-fil span { color: rgba(255,255,255,.55); }
.dsn-fil-sep { margin: 0 8px; color: var(--dsn-mag); }

.dsn-meta-art {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 20px;
    font-family: var(--dsn-display);
    font-size: 0.73rem;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: rgba(255,255,255,.82);
}

/* ── Lecture (single / pages) ──────────────────────────────────── */
.dsn-lecture { padding: 62px 0 84px; }
.dsn-lecture-grille { display: grid; grid-template-columns: 22fr 78fr; gap: 0; }
.dsn-lecture-marge { padding-right: 28px; }
.dsn-lecture-marge-lib {
    font-family: var(--dsn-display);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--dsn-gris);
    border-top: 2px solid var(--dsn-encre);
    padding-top: 12px;
    position: sticky;
    top: calc(var(--dsn-hh) + 26px);
}
.dsn-lecture-corps { max-width: 74ch; }
.dsn-plaque { margin: 0 0 42px; }
.dsn-plaque img { width: 100%; max-height: 600px; object-fit: cover; }

.entry-content { font-size: 1.09rem; }
.entry-content h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); margin: 2em 0 .7em; }
.entry-content h3 { font-size: 1.25rem; margin: 1.7em 0 .6em; font-weight: 700; }
.entry-content a { color: var(--dsn-mag); text-decoration: underline; text-underline-offset: 3px; }
.entry-content img { margin: 1.6em 0; }
.entry-content blockquote {
    margin: 1.8em 0;
    padding: 4px 0 4px 26px;
    border-left: 3px solid var(--dsn-mag);
    font-style: italic;
    font-size: 1.14rem;
    color: var(--dsn-doux);
}

/* ── Bullets decoratifs entry-content ──────────────────────────── */
/* « la travee » : deux barres verticales inegales */
.entry-content ul { list-style: none; padding-left: 0; margin-bottom: 1.4em; }
.entry-content ol { list-style: decimal; padding-left: 1.5em; margin-bottom: 1.4em; }
.entry-content ul li { position: relative; padding-left: 1.5em; margin-bottom: 0.5em; }
.entry-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.46em;
    width: 3px;
    height: 14px;
    background: var(--dsn-mag);
    flex-shrink: 0;
}
.entry-content ul li::after {
    content: '';
    position: absolute;
    left: 6px;
    top: 0.46em;
    width: 3px;
    height: 7px;
    background: var(--dsn-mag);
    opacity: .5;
}
.entry-content ol li { margin-bottom: 0.5em; }

/* ── Signature auteur ──────────────────────────────────────────── */
.dsn-signature {
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 22px;
    align-items: start;
    border-top: 2px solid var(--dsn-encre);
    padding-top: 26px;
    margin-top: 52px;
}
.dsn-signature-vue { aspect-ratio: 1; overflow: hidden; background: var(--dsn-brume); }
.dsn-signature-vue img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.dsn-signature h2 { font-size: 1.22rem; margin: 0 0 3px; }
.dsn-signature-role {
    font-family: var(--dsn-display);
    font-size: 0.7rem; font-weight: 700;
    letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--dsn-mag); margin: 0 0 10px;
}
.dsn-signature-bio { font-size: 0.98rem; color: var(--dsn-doux); }
.dsn-signature-bio p { margin: 0; }

.dsn-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 34px; }
.dsn-tags a {
    font-family: var(--dsn-display);
    font-size: 0.7rem; font-weight: 600;
    letter-spacing: 0.11em; text-transform: uppercase;
    padding: 7px 13px; border: 1px solid var(--dsn-filet-fort);
    transition: border-color .2s ease, color .2s ease;
}
.dsn-tags a:hover { border-color: var(--dsn-mag); color: var(--dsn-mag); }

/* ── Voisins ───────────────────────────────────────────────────── */
.dsn-voisins { background: var(--dsn-brume); padding: 72px 0; }
.dsn-voisins-grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; }
.dsn-voisin-vue { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--dsn-filet); margin-bottom: 14px; }
.dsn-voisin-vue img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.dsn-voisin:hover .dsn-voisin-vue img { transform: scale(1.04); }
.dsn-voisin h3 { font-size: 1.14rem; font-weight: 700; line-height: 1.22; margin: 0; }
.dsn-voisin:hover h3 { color: var(--dsn-mag); }

/* ── Archive ───────────────────────────────────────────────────── */
.dsn-archive { padding: 62px 0 84px; }
.dsn-fiches { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 34px; }
.dsn-fiche-vue { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--dsn-brume); margin-bottom: 15px; }
.dsn-fiche-vue img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.dsn-fiche:hover .dsn-fiche-vue img { transform: scale(1.04); }
.dsn-fiche h2 { font-size: 1.2rem; font-weight: 700; line-height: 1.22; margin: 0 0 9px; }
.dsn-fiche:hover h2 { color: var(--dsn-mag); }
.dsn-fiche p { font-size: 0.95rem; color: var(--dsn-doux); margin: 0; }

/* ── Bloc SEO ──────────────────────────────────────────────────── */
.dsn-dossier { background: var(--dsn-brume); padding: 74px 0; margin-top: 78px; }
.dsn-dossier-inner { display: grid; grid-template-columns: 1fr 440px; gap: 52px; align-items: center; }
.dsn-dossier h2 { font-size: clamp(1.6rem, 2.7vw, 2.2rem); margin: 0 0 20px; }
.dsn-dossier-txt { color: var(--dsn-doux); }
.dsn-dossier-txt ul { margin: 1.1em 0; }
.dsn-dossier-txt li { position: relative; padding-left: 22px; margin-bottom: .5em; }
.dsn-dossier-txt li::before {
    content: '';
    position: absolute; left: 0; top: .52em;
    width: 3px; height: 13px; background: var(--dsn-mag);
}
.dsn-dossier-txt li::after {
    content: '';
    position: absolute; left: 6px; top: .52em;
    width: 3px; height: 7px; background: var(--dsn-mag); opacity: .5;
}
.dsn-dossier-vue { aspect-ratio: 4 / 3; overflow: hidden; background: var(--dsn-filet); }
.dsn-dossier-vue img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.dsn-dossier-vue:hover img { transform: scale(1.04); }

/* ── Contact ───────────────────────────────────────────────────── */
.dsn-contact { padding: 66px 0 88px; }
.dsn-contact-grille { display: grid; grid-template-columns: 41fr 59fr; gap: 56px; }
.dsn-contact-intro h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); margin: 0 0 18px; }
.dsn-contact-intro p { color: var(--dsn-doux); }
.dsn-contact-panneau { border: 2px solid var(--dsn-encre); padding: 34px; }

.wpcf7-form p { display: flex; flex-direction: column; gap: 7px; margin: 0 0 18px; }
.wpcf7-form br { display: none; }
.wpcf7-form label {
    display: flex; flex-direction: column; gap: 7px;
    font-family: var(--dsn-display);
    font-size: 0.72rem; font-weight: 700;
    letter-spacing: 0.13em; text-transform: uppercase;
}
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form textarea {
    width: 100%;
    padding: 13px 15px;
    border: 1px solid var(--dsn-filet-fort);
    background: #fff;
    font-family: var(--dsn-corps);
    font-size: 1rem;
    color: var(--dsn-encre);
}
.wpcf7-form input:focus, .wpcf7-form textarea:focus { outline: 2px solid var(--dsn-mag); outline-offset: 1px; border-color: var(--dsn-mag); }
.wpcf7-form textarea { min-height: 168px; resize: vertical; }
.wpcf7-submit {
    width: 100%;
    font-family: var(--dsn-display);
    font-size: 0.82rem; font-weight: 700;
    letter-spacing: 0.11em; text-transform: uppercase;
    padding: 16px 22px;
    background: var(--dsn-encre); color: #fff;
    border: 2px solid var(--dsn-encre);
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease;
}
.wpcf7-submit:hover { background: var(--dsn-mag); border-color: var(--dsn-mag); }

/* ── Pages statiques ───────────────────────────────────────────── */
.dsn-page-corps { padding: 62px 0 84px; max-width: 78ch; }
.dsn-page-corps h2 { font-size: clamp(1.35rem, 2.2vw, 1.8rem); margin: 1.9em 0 .6em; }
.dsn-page-corps h2:first-child { margin-top: 0; }
.dsn-page-corps a { color: var(--dsn-mag); text-decoration: underline; }

.dsn-plan { padding: 62px 0 84px; }
.dsn-plan-bloc { border-top: 2px solid var(--dsn-encre); padding-top: 18px; margin-bottom: 46px; }
.dsn-plan-bloc h2 { font-size: 1.42rem; text-transform: uppercase; margin: 0 0 16px; }
.dsn-plan-bloc li { position: relative; padding-left: 22px; margin-bottom: .55em; }
.dsn-plan-bloc li::before {
    content: '';
    position: absolute; left: 0; top: .55em;
    width: 3px; height: 13px; background: var(--dsn-mag);
}
.dsn-plan-bloc a:hover { color: var(--dsn-mag); }

/* ── Pied ──────────────────────────────────────────────────────── */
.dsn-pied {
    background: var(--dsn-nuit);
    color: var(--dsn-clair);
    border-top: 4px solid var(--dsn-mag);
    padding: 68px 0 30px;
    margin-top: 0;
}
.dsn-pied-grille { display: grid; grid-template-columns: var(--dsn-travees); gap: 0; }
.dsn-pied-col { padding-right: 30px; }
.dsn-pied-col + .dsn-pied-col { padding-left: 30px; border-left: 1px solid rgba(255,255,255,.13); }
.dsn-pied-titre {
    font-family: var(--dsn-display);
    font-size: 0.7rem; font-weight: 700;
    letter-spacing: 0.16em; text-transform: uppercase;
    color: #fff;
    margin: 0 0 18px;
}
.dsn-pied-marque svg { height: 24px; width: auto; display: block; margin-bottom: 16px; }
.dsn-pied p { font-size: 0.94rem; color: rgba(242,239,243,.72); }
.dsn-pied li { position: relative; padding-left: 18px; margin-bottom: .6em; font-size: 0.94rem; }
.dsn-pied li::before {
    content: '';
    position: absolute; left: 0; top: .58em;
    width: 3px; height: 11px; background: var(--dsn-mag);
}
.dsn-pied a { color: rgba(242,239,243,.82); transition: color .18s ease; }
.dsn-pied a:hover { color: #fff; }
.dsn-pied-bas {
    border-top: 1px solid rgba(255,255,255,.13);
    margin-top: 46px; padding-top: 22px;
    text-align: center;
    font-family: var(--dsn-display);
    font-size: 0.72rem; font-weight: 600;
    letter-spacing: 0.11em;
    color: rgba(242,239,243,.6);
}

/* ── Reveal ────────────────────────────────────────────────────── */
[data-dsn-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s ease; }
[data-dsn-reveal].is-vu { opacity: 1; transform: none; }

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 1080px) {
    .dsn-cloisons { display: none; }
    :root { --dsn-pad: 22px; }

    .dsn-ouverture-grille,
    .dsn-plume-grille,
    .dsn-ouverture-bande,
    .dsn-pied-grille { display: block; }

    .dsn-ouverture-titre { padding-right: 0; }
    .dsn-releves { margin-top: 30px; }
    .dsn-ouverture-legende { padding: 0 0 10px; }
    .dsn-plume-corps { padding-right: 0; margin-bottom: 34px; }
    .dsn-plume-vue { aspect-ratio: 3 / 2; }

    .dsn-lots { grid-template-columns: 1fr 1fr; }
    .dsn-lot--l, .dsn-lot--e { grid-column: span 1; }
    .dsn-lot--l .dsn-lot-vue, .dsn-lot--e .dsn-lot-vue { aspect-ratio: 4 / 3; }
    .dsn-lot { padding: 20px 16px 32px 0; }
    .dsn-lot + .dsn-lot { padding-left: 0; }

    .dsn-colonnes { grid-template-columns: repeat(2, 1fr); }
    .dsn-colonne { min-height: 0; border-bottom: 1px solid var(--dsn-filet); }

    .dsn-lecture-grille { display: block; }
    .dsn-lecture-marge { padding-right: 0; margin-bottom: 26px; }
    .dsn-lecture-marge-lib { position: static; }

    .dsn-dossier-inner,
    .dsn-contact-grille { grid-template-columns: 1fr; gap: 32px; }
    .dsn-dossier-vue { order: -1; }

    .dsn-pied-col { padding: 0 0 30px; }
    .dsn-pied-col + .dsn-pied-col { padding-left: 0; border-left: 0; }

    /* Nav mobile */
    .dsn-burger {
        display: flex; align-items: center; justify-content: center;
        width: 46px; height: 46px;
        background: transparent; border: 0; cursor: pointer; padding: 0;
    }
    .dsn-burger svg { display: block; stroke: var(--dsn-encre); }
    .dsn-nav {
        position: fixed;
        inset: 0;
        background: var(--dsn-papier);
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 0;
        padding: 22px var(--dsn-pad) 40px;
        transform: translateX(100%);
        transition: transform .3s cubic-bezier(.4,0,.2,1);
        z-index: 200;
        overflow-y: auto;
    }
    .dsn-nav--open { transform: translateX(0); }
    .dsn-nav-tete {
        display: flex; align-items: center; justify-content: space-between;
        width: 100%; margin-bottom: 34px;
    }
    .dsn-nav-logo { display: block; }
    .dsn-nav-logo svg { height: 24px; width: auto; display: block; }
    .dsn-nav-close {
        display: flex; align-items: center; justify-content: center;
        width: 46px; height: 46px;
        background: transparent; border: 0; cursor: pointer; padding: 0;
    }
    .dsn-nav-close svg { stroke: var(--dsn-encre); display: block; }
    .dsn-nav-liens { flex-direction: column; align-items: flex-start; gap: 0; width: 100%; }
    .dsn-nav-liens li { width: 100%; border-bottom: 1px solid var(--dsn-filet); }
    .dsn-nav-liens a { display: block; padding: 17px 0; font-size: 1rem; }
    .dsn-nav-liens a::after { display: none; }
    .dsn-nav-contact { margin-top: 26px; display: inline-block; }
}

@media (max-width: 720px) {
    body { font-size: 1.02rem; }
    .dsn-ouverture { padding-top: 44px; }
    .dsn-manchette { grid-template-columns: 1fr; }
    .dsn-manchette-corps { padding: 24px 0 30px; }
    .dsn-lots { grid-template-columns: 1fr; }
    .dsn-colonnes { grid-template-columns: 1fr; }
    .dsn-colonne { border-right: 0; }
    .dsn-voisins-grille, .dsn-fiches { grid-template-columns: 1fr; }
    .dsn-signature { grid-template-columns: 1fr; }
    .dsn-signature-vue { width: 96px; }
    .dsn-contact-panneau { padding: 22px; }
    .dsn-flux, .dsn-rubriques { padding-top: 58px; }
    .dsn-plume { padding: 54px 0; margin-top: 62px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
    [data-dsn-reveal] { opacity: 1; transform: none; }
}