@charset "UTF-8";
/*
Theme Name: Glass Alu Design
Theme URI: https://www.glass-alu-design.fr
Author: Agence Netlinqueen
Description: Magazine immobilier et BTP. Archetype BV, double vantail plein bord et meneaux.
Version: 1.0.3
License: GNU General Public License v2 or later
Text Domain: glass-alu-design
*/

/* ===============================================================
   GLASS ALU DESIGN - Archetype BV
   Double vantail / Meneaux / Aucun voile

   Troisieme site du reseau sur « Immobilier & BTP ». mt-placo le prend
   par la copropriete, etg-location par le materiel ; celui-ci par
   L ENVELOPPE, ce qui separe le dedans du dehors. Il fallait donc une
   troisieme structure, pas une variation des deux precedentes.

   1. AUCUN VOILE DANS TOUT LE THEME. Zero degrade pose sur une photo,
      zero texte ecrit par-dessus une image. Chaque « hero » est un
      DOUBLE VANTAIL plein bord : un panneau d encre qui porte le texte,
      un panneau de photographie laisse intact, separes par un meneau.
      C est le seul site du reseau ou les photos sont a plein contraste,
      et c est aussi ce qui supprime d un coup toute la classe de bugs de
      lisibilite sur voile.

   2. LE MENEAU. Une barre pleine de 6 px en accent separe tout ce qui
      doit etre separe : les deux vantaux du hero, les deux colonnes du
      flux (sur toute leur hauteur), le portrait de son texte, chaque
      panneau du sommaire. C est le montant d une fenetre, et c est le
      seul separateur du theme.

   3. AUCUN FILET DE 1 PX DECORATIF. La ou les deux sites freres separent
      au filet capillaire, celui-ci separe a la barre de 6 px ou ne separe
      pas. Mesure sur le rendu : 0 bordure de 1 px hors formulaire.

   4. LE MOT ACCENT DU H1 CHANGE DE COULEUR, il n est ni souligne (BT) ni
      allege en graisse (BU).

   LA GAMME EST NEUTRE, et sur le TROISIEME axe : mt-placo tire au rouge
   (pierre chaude), etg-location au bleu (ardoise froide), celui-ci au
   vert (#4C4D45, canal G majoritaire). Ecart entre canaux 8, plus neutre
   que ses deux voisins. La tranche d un verre float est verte : la
   justification est thematique autant que mesuree. 8,55:1 sur blanc,
   donc la meme valeur ecrit sur blanc ET porte du blanc en aplat, et
   elle est 1,63 fois plus contrastee que le gris de meta, ce qui la rend
   reconnaissable comme accent (sur etg-location, un premier choix a 1,04
   avait du etre jete pour cette raison).
   =============================================================== */

:root {
    --gad-papier:    #FFFFFF;
    --gad-surface:   #F4F4F3;
    --gad-surface-2: #E9E9E7;
    --gad-filet:     #E0E0DE;
    --gad-filet-2:   #C4C4C1;

    --gad-encre:     #181917;
    --gad-encre-2:   #0D0E0C;
    --gad-doux:      #3C3D3A;
    --gad-gris:      #6C6D64;
    --gad-clair:     #F2F2F0;
    --gad-clair-2:   #B5B6AF;

    --gad-vif:        #4C4D45;
    --gad-vif-fonce:  #34352F;
    --gad-vif-clair:  #C3C5B9;
    --gad-vif-voile:  #EFF0EC;

    /* Mesure de la colonne de lecture en PIXELS et non en ch : ch se
       calcule sur la taille de police de chaque bloc, donc deux blocs de
       corps different ne tomberaient pas sur la meme largeur. */
    --gad-mesure: 690px;
    --gad-cadre:  1320px;
    --gad-marge:  clamp(20px, 4.2vw, 58px);
    --gad-hh:     72px;

    /* le meneau : seul separateur du theme */
    --gad-meneau: 6px;

    --gad-display: "Red Hat Display", "Segoe UI", system-ui, -apple-system, sans-serif;
    --gad-corps:   "Encode Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    background: var(--gad-papier);
    color: var(--gad-doux);
    font-family: var(--gad-corps);
    font-size: 16.5px;
    line-height: 1.7;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    overflow-wrap: break-word;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--gad-vif); text-decoration: none; }
a:hover { color: var(--gad-vif-fonce); }
ul { list-style: none; margin: 0; padding: 0; }
figure { margin: 0; }

h1, h2, h3, h4 {
    font-family: var(--gad-display);
    color: var(--gad-encre);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -0.02em;
    margin: 0;
}
p { margin: 0; }

:focus-visible { outline: 3px solid var(--gad-vif); outline-offset: 3px; }
.gad-vantail-texte :focus-visible,
.gad-pied :focus-visible { outline-color: var(--gad-vif-clair); }

.gad-saut {
    position: absolute; left: -9999px; top: 0;
    background: var(--gad-encre); color: var(--gad-clair);
    padding: 12px 18px; z-index: 999;
}
.gad-saut:focus { left: 10px; top: 10px; }

.gad-cadre {
    width: 100%;
    max-width: var(--gad-cadre);
    margin-inline: auto;
    padding-inline: var(--gad-marge);
}

/* Libelle courant : petites capitales tracees precedees d un meneau
   court. Le motif du site a l echelle du texte. */
.gad-oeil {
    display: inline-flex; align-items: center; gap: 12px;
    font-family: var(--gad-display);
    font-size: .7rem; font-weight: 700;
    letter-spacing: .2em; text-transform: uppercase;
    color: var(--gad-vif);
}
.gad-oeil::before {
    content: ""; width: var(--gad-meneau); height: 15px;
    flex: 0 0 var(--gad-meneau);
    background: currentColor;
}
.gad-oeil--clair { color: var(--gad-vif-clair); }

/* ── En-tete ──────────────────────────────────────────────────────────── */

.gad-barre {
    position: sticky; top: 0; z-index: 60;
    background: var(--gad-papier);
    box-shadow: 0 var(--gad-meneau) 0 0 var(--gad-encre);
}
.gad-barre-int {
    display: flex; align-items: center; gap: 24px;
    height: var(--gad-hh);
}
.gad-marque { display: inline-flex; align-items: center; color: var(--gad-encre); }
.gad-marque svg { display: block; height: 30px; width: auto; }

/* Le meneau de l en-tete : il separe la marque de la navigation, comme
   un montant separe deux vantaux. */
.gad-barre-meneau {
    width: var(--gad-meneau); align-self: stretch;
    background: var(--gad-vif);
    margin-left: auto;
}

.gad-nav { display: flex; align-items: center; gap: 28px; }
.gad-nav-liens { display: flex; align-items: center; gap: 28px; }
.gad-nav-liens a {
    position: relative;
    font-family: var(--gad-display);
    font-size: .93rem; font-weight: 600;
    color: var(--gad-encre);
    padding: 8px 0;
}
.gad-nav-liens a::after {
    content: ""; position: absolute; left: 0; right: 100%; bottom: 0;
    height: 3px; background: var(--gad-vif);
    transition: right .24s ease;
}
.gad-nav-liens a:hover::after { right: 0; }

.gad-nav-contact {
    font-family: var(--gad-display);
    font-size: .9rem; font-weight: 700;
    background: var(--gad-vif); color: #fff;
    padding: 11px 22px;
    display: inline-flex; align-items: center; gap: 10px;
    white-space: nowrap; flex: 0 0 auto;
    transition: background .2s ease;
}
.gad-nav-contact:hover { background: var(--gad-vif-fonce); color: #fff; }

.gad-burger, .gad-nav-close, .gad-nav-logo { display: none; }

/* ── Le double vantail ────────────────────────────────────────────────── */
/* Plein bord : les deux panneaux touchent les bords du viewport, aucun
   conteneur ne les rogne. Le texte n est JAMAIS pose sur la photo, donc
   la photo n a besoin d aucun voile. */

.gad-vantaux {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--gad-meneau) minmax(0, 1fr);
    align-items: stretch;
    min-height: clamp(460px, 74vh, 760px);
}
.gad-meneau { background: var(--gad-vif); align-self: stretch; }
/* Entre deux surfaces sombres, l accent disparait : le meneau passe au clair. */
.gad-vantaux > .gad-meneau,
.gad-rubrique > .gad-meneau { background: var(--gad-vif-clair); }
.gad-releves { border-top-color: var(--gad-vif-clair); }
.gad-releve + .gad-releve { box-shadow: inset var(--gad-meneau) 0 0 0 var(--gad-vif-clair); }

.gad-vantail-texte {
    background: var(--gad-encre);
    color: var(--gad-clair);
    display: flex; flex-direction: column; justify-content: center;
    padding: clamp(36px, 5vw, 76px) clamp(24px, 4.4vw, 72px);
}
.gad-vantail-texte > * + * { margin-top: 22px; }

.gad-vantail-vue { position: relative; overflow: hidden; background: var(--gad-surface); }
.gad-vantail-vue img {
    position: absolute; inset: 0;
    width: 100%; height: 100%; object-fit: cover;
}

.gad-titre {
    font-family: var(--gad-display);
    font-weight: 800;
    font-size: clamp(2.05rem, 3.6vw, 3.4rem);
    line-height: 1.08;
    letter-spacing: -0.028em;
    color: var(--gad-clair);
}
/* Le mot accent change de COULEUR : ni souligne, ni allege, ni sur aplat. */
.gad-titre em { font-style: normal; color: var(--gad-vif-clair); }

.gad-deck { font-size: 1.03rem; line-height: 1.68; color: var(--gad-clair-2); max-width: 46ch; }

/* Les releves tiennent DANS le vantail sombre, en pied, separes par des
   meneaux verticaux. Pas de barre blanche pleine largeur sous le hero. */
.gad-releves {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-top: 34px;
    border-top: var(--gad-meneau) solid var(--gad-vif);
    padding-top: 22px;
}
.gad-releve { padding-right: 18px; }
.gad-releve + .gad-releve { padding-left: 18px; box-shadow: inset var(--gad-meneau) 0 0 0 var(--gad-vif); }
.gad-releve-n {
    font-family: var(--gad-display);
    font-size: clamp(1.5rem, 2.1vw, 2rem);
    font-weight: 800; line-height: 1;
    color: var(--gad-clair);
    letter-spacing: -0.03em;
}
.gad-releve-l {
    margin-top: 7px; display: block;
    font-family: var(--gad-display);
    font-size: .68rem; font-weight: 600;
    letter-spacing: .16em; text-transform: uppercase;
    color: var(--gad-clair-2);
}

.gad-bouton {
    display: inline-flex; align-items: center; gap: 12px;
    font-family: var(--gad-display);
    font-size: .95rem; font-weight: 700;
    background: var(--gad-vif); color: #fff;
    padding: 15px 28px;
    white-space: nowrap;
    align-self: flex-start;
    transition: background .2s ease;
}
.gad-bouton:hover { background: var(--gad-vif-fonce); color: #fff; }
.gad-bouton--clair { background: var(--gad-clair); color: var(--gad-encre); }
.gad-bouton--clair:hover { background: #fff; color: var(--gad-encre); }
.gad-bouton--fant {
    background: transparent; color: var(--gad-encre);
    box-shadow: inset 0 0 0 3px var(--gad-vif);
}
.gad-bouton--fant:hover { background: var(--gad-vif); color: #fff; }

/* ── Sections ─────────────────────────────────────────────────────────── */

.gad-section { padding-block: clamp(56px, 6.8vw, 92px); }
.gad-section--serree { padding-block: clamp(40px, 4.6vw, 60px); }

.gad-tete {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: 28px; flex-wrap: wrap;
    padding-bottom: 20px;
    border-bottom: var(--gad-meneau) solid var(--gad-encre);
    margin-bottom: clamp(28px, 3.4vw, 44px);
}
.gad-tete h2 { font-size: clamp(1.5rem, 2.4vw, 2.05rem); }
.gad-tete-note {
    font-family: var(--gad-display);
    font-size: .72rem; font-weight: 600;
    letter-spacing: .17em; text-transform: uppercase;
    color: var(--gad-gris);
}

/* ── Le flux : deux colonnes separees par un meneau plein hauteur ─────── */

.gad-vue { position: relative; overflow: hidden; background: var(--gad-surface); }
.gad-vue img { width: 100%; height: 100%; object-fit: cover; }

.gad-une {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--gad-meneau) minmax(0, 1fr);
    align-items: center;
    margin-bottom: clamp(30px, 3.6vw, 46px);
}
.gad-une .gad-vue { aspect-ratio: 4 / 3; }
.gad-une-corps { padding-left: clamp(20px, 2.6vw, 40px); min-width: 0; }
.gad-une h3 { margin-top: 14px; font-size: clamp(1.4rem, 2.2vw, 2rem); }
.gad-une h3 a { color: inherit; }
.gad-une h3 a:hover { color: var(--gad-vif); }
.gad-une-res { margin-top: 14px; color: var(--gad-doux); }

.gad-fiches {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--gad-meneau) minmax(0, 1fr);
    column-gap: 0;
    row-gap: clamp(34px, 4vw, 52px);
}
/* Le meneau du flux court sur TOUTE la hauteur de la grille, il ne
   s interrompt pas entre les rangs. */
.gad-fiches-meneau { grid-column: 2; grid-row: 1 / -1; background: var(--gad-vif); }
.gad-fiche { min-width: 0; }
.gad-fiche:nth-of-type(odd)  { grid-column: 1; padding-right: clamp(20px, 2.4vw, 38px); }
.gad-fiche:nth-of-type(even) { grid-column: 3; padding-left: clamp(20px, 2.4vw, 38px); }
.gad-fiche .gad-vue { aspect-ratio: 3 / 4; }
.gad-fiche h3 { margin-top: 14px; font-size: clamp(1.1rem, 1.4vw, 1.3rem); line-height: 1.22; }
.gad-fiche h3 a { color: inherit; }
.gad-fiche h3 a:hover { color: var(--gad-vif); }
.gad-fiche-res { margin-top: 10px; font-size: .95rem; color: var(--gad-gris); }

.gad-meta {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    font-family: var(--gad-display);
    font-size: .7rem; font-weight: 600;
    letter-spacing: .15em; text-transform: uppercase;
    color: var(--gad-gris);
    margin-top: 14px;
}
.gad-meta-cat { color: var(--gad-vif); }
.gad-meta-pt { width: 12px; height: 3px; background: var(--gad-filet-2); }

/* Etat sans article : un bloc redige, jamais une grille vide. */
.gad-vide {
    background: var(--gad-surface);
    padding: clamp(28px, 3.8vw, 50px);
    border-left: var(--gad-meneau) solid var(--gad-vif);
}
.gad-vide h3 { font-size: clamp(1.25rem, 1.9vw, 1.6rem); }
.gad-vide p { margin-top: 14px; max-width: 620px; color: var(--gad-doux); }
.gad-vide .gad-bouton { margin-top: 26px; }

/* ── Le sommaire : six panneaux vitres, meneaux jointifs ──────────────── */

.gad-sommaire {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--gad-meneau);
    background: var(--gad-vif);
    padding: var(--gad-meneau);
}
.gad-sujet {
    background: var(--gad-papier);
    padding: clamp(22px, 2.4vw, 32px);
}
.gad-sujet-n {
    font-family: var(--gad-display);
    font-size: .78rem; font-weight: 800;
    letter-spacing: .1em;
    color: var(--gad-vif);
}
.gad-sujet h3 { margin-top: 12px; font-size: 1.1rem; }
.gad-sujet p { margin-top: 10px; font-size: .93rem; color: var(--gad-gris); }

/* ── Le redacteur, sur BLANC (les deux sites freres le posent sur encre) ─ */

.gad-portrait {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) var(--gad-meneau) minmax(0, .7fr);
    gap: 0;
    align-items: center;
}
.gad-portrait-corps { padding-right: clamp(24px, 3.2vw, 52px); }
.gad-portrait h2 { font-size: clamp(1.7rem, 2.7vw, 2.4rem); margin-top: 14px; }
.gad-portrait-role {
    margin-top: 10px;
    font-family: var(--gad-display);
    font-size: .74rem; font-weight: 600;
    letter-spacing: .18em; text-transform: uppercase;
    color: var(--gad-vif);
}
.gad-portrait-bio { margin-top: 20px; color: var(--gad-doux); }
.gad-portrait-bio p + p { margin-top: 13px; }
.gad-portrait-bio strong { color: var(--gad-encre); font-weight: 600; }
.gad-portrait-bio ul { margin-top: 14px; }
.gad-portrait-bio li { position: relative; padding-left: 24px; margin-bottom: 9px; }
.gad-portrait-bio li::before {
    content: ""; position: absolute; left: 0; top: .6em;
    width: 13px; height: 10px;
    background: linear-gradient(to right,
        var(--gad-vif) 0 42%, transparent 42% 58%, var(--gad-vif) 58% 100%);
}
.gad-portrait .gad-bouton { margin-top: 26px; }

.gad-portrait-reperes {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 28px;
    border-top: var(--gad-meneau) solid var(--gad-vif);
    padding-top: 18px;
}
.gad-repere { padding-right: 16px; }
.gad-repere + .gad-repere { padding-left: 16px; box-shadow: inset var(--gad-meneau) 0 0 0 var(--gad-filet); }
.gad-repere-n { font-family: var(--gad-display); font-size: 1.4rem; font-weight: 800; color: var(--gad-encre); }
.gad-repere-l {
    margin-top: 5px; display: block;
    font-family: var(--gad-display);
    font-size: .66rem; font-weight: 600;
    letter-spacing: .15em; text-transform: uppercase;
    color: var(--gad-gris);
}

/* Le portrait est le SEUL visuel vertical du site : il a son propre
   cadrage et n est jamais soumis au 3:4 ni au 4:3 du flux. */
.gad-portrait-photo { aspect-ratio: 4 / 5; overflow: hidden; background: var(--gad-surface); }
.gad-portrait-photo img {
    width: 100%; height: 100%;
    object-fit: cover; object-position: center top;
}

/* ── La rubrique : un double vantail de plus, toujours sans voile ─────── */

.gad-rubrique {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--gad-meneau) minmax(0, 1fr);
    align-items: stretch;
    min-height: clamp(280px, 34vw, 420px);
    color: var(--gad-clair);
}
.gad-rubrique-vue { position: relative; overflow: hidden; background: var(--gad-surface); }
.gad-rubrique-vue img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gad-rubrique-corps {
    background: var(--gad-encre);
    padding: clamp(28px, 3.6vw, 52px);
    display: flex; flex-direction: column; justify-content: center;
}
.gad-rubrique-nom {
    display: block;
    font-family: var(--gad-display);
    font-weight: 700; line-height: 1.12; letter-spacing: -0.026em;
    color: var(--gad-clair);
    font-size: clamp(1.6rem, 2.7vw, 2.3rem);
    margin-top: 14px;
}
.gad-rubrique-nom:hover { color: var(--gad-vif-clair); }
.gad-rubrique-desc { margin-top: 14px; color: var(--gad-clair-2); }
.gad-rubrique-compte {
    margin-top: 20px;
    font-family: var(--gad-display);
    font-size: .72rem; font-weight: 700;
    letter-spacing: .17em; text-transform: uppercase;
    color: var(--gad-vif-clair);
}

/* ── Coiffe des pages interieures : le meme double vantail ────────────── */

.gad-coiffe { background: var(--gad-encre); }
.gad-coiffe .gad-vantaux { min-height: clamp(300px, 40vh, 460px); }
.gad-coiffe h1 {
    color: var(--gad-clair);
    font-family: var(--gad-display);
    font-size: clamp(1.8rem, 3.2vw, 2.9rem);
    letter-spacing: -0.028em;
    margin-top: 14px;
}
.gad-coiffe-desc { margin-top: 16px; color: var(--gad-clair-2); max-width: 46ch; }
.gad-coiffe-desc p { margin: 0; }

.gad-fil {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    font-family: var(--gad-display);
    font-size: .74rem; font-weight: 600;
    letter-spacing: .08em;
    margin-bottom: 20px;
}
.gad-fil a { color: var(--gad-vif-clair); }
.gad-fil a:hover { color: var(--gad-clair); }
.gad-fil-sep { width: 10px; height: 3px; background: rgba(242, 242, 240, .4); }
.gad-fil-courant { color: rgba(242, 242, 240, .68); }

/* ── Article ──────────────────────────────────────────────────────────── */

.gad-article { padding-block: clamp(38px, 4.6vw, 62px); }

/* Tous les blocs de l article partagent la meme mesure ET sont centres. */
.gad-article > .gad-cadre > * {
    max-width: var(--gad-mesure);
    margin-inline: auto;
}

.gad-plaque {
    box-sizing: border-box;
    width: 100%; max-width: var(--gad-mesure);
    margin: 0 auto clamp(28px, 3.6vw, 44px);
}
.gad-plaque img {
    display: block; width: 100%;
    aspect-ratio: 3 / 2; object-fit: cover;
    background: var(--gad-surface);
}
.gad-plaque figcaption {
    margin-top: 10px;
    font-family: var(--gad-display);
    font-size: .7rem; font-weight: 600;
    letter-spacing: .15em; text-transform: uppercase;
    color: var(--gad-gris);
}

.gad-lecture-meta {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding-bottom: 16px; margin-bottom: 26px;
    border-bottom: var(--gad-meneau) solid var(--gad-encre);
    font-family: var(--gad-display);
    font-size: .72rem; font-weight: 600;
    letter-spacing: .15em; text-transform: uppercase;
    color: var(--gad-gris);
}
.gad-lecture-meta a { color: var(--gad-vif); }

.entry-content { font-size: 1.03rem; line-height: 1.78; color: var(--gad-doux); }
.entry-content > * + * { margin-top: 1.25em; }
.entry-content h2 { font-size: clamp(1.3rem, 2.1vw, 1.75rem); margin-top: 1.9em; }
.entry-content h3 { font-size: clamp(1.08rem, 1.6vw, 1.3rem); margin-top: 1.6em; }
.entry-content a { color: var(--gad-vif); text-decoration: underline; text-underline-offset: 3px; }
.entry-content blockquote {
    border-left: var(--gad-meneau) solid var(--gad-vif);
    padding-left: 22px;
    color: var(--gad-encre);
}

/* ── Bullets decoratifs entry-content ─────────────────────────────────── */
/* Le reset global ul { list-style: none } supprime les marqueurs natifs :
   sans ces regles, les listes des articles n auraient aucune puce. */
.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.56em;
    width: 13px;
    height: 10px;
    /* Deux vantaux separes par un meneau : la fenetre a l echelle du
       texte. Un seul aplat, fendu par une gouttiere transparente. */
    background: linear-gradient(to right,
        var(--gad-vif) 0 42%, transparent 42% 58%, var(--gad-vif) 58% 100%);
    flex-shrink: 0;
}
.entry-content ol li { margin-bottom: 0.5em; }

.gad-etiquettes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.gad-etiquettes a {
    font-family: var(--gad-display);
    font-size: .72rem; font-weight: 600;
    letter-spacing: .09em;
    box-shadow: inset 0 0 0 3px var(--gad-filet);
    padding: 8px 15px;
    color: var(--gad-gris);
}
.gad-etiquettes a:hover { background: var(--gad-vif); color: #fff; box-shadow: none; }

.gad-auteur {
    margin-top: 42px;
    padding-left: 22px;
    border-left: var(--gad-meneau) solid var(--gad-vif);
    display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 22px;
    align-items: start;
}
.gad-auteur-photo { width: 92px; aspect-ratio: 4 / 5; overflow: hidden; background: var(--gad-surface); }
.gad-auteur-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.gad-auteur h2 { font-size: 1.12rem; }
.gad-auteur-role {
    margin-top: 5px;
    font-family: var(--gad-display);
    font-size: .68rem; font-weight: 600;
    letter-spacing: .16em; text-transform: uppercase;
    color: var(--gad-vif);
}
.gad-auteur-bio { margin-top: 12px; font-size: .95rem; color: var(--gad-gris); }

.gad-voisins { border-top: var(--gad-meneau) solid var(--gad-encre); padding-top: 36px; margin-top: 46px; }
.gad-voisins h2 { font-size: 1.3rem; margin-bottom: 22px; }
.gad-voisins-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gad-meneau); }
.gad-voisins h3 { font-size: 1rem; line-height: 1.28; margin-top: 12px; }
.gad-voisins h3 a { color: inherit; }
.gad-voisins h3 a:hover { color: var(--gad-vif); }
.gad-voisins .gad-vue { aspect-ratio: 3 / 2; }

/* ── Pages ────────────────────────────────────────────────────────────── */

.gad-page { padding-block: clamp(42px, 5vw, 70px); }
.gad-page-corps { max-width: var(--gad-mesure); margin-inline: auto; }
.gad-page-corps h2 { font-size: clamp(1.2rem, 1.9vw, 1.55rem); margin-top: 2em; }
.gad-page-corps h2:first-child { margin-top: 0; }
.gad-page-corps p { margin-top: 1em; }
.gad-page-corps a { color: var(--gad-vif); text-decoration: underline; text-underline-offset: 3px; }
.gad-page-corps ul { margin-top: 1em; }
.gad-page-corps li { position: relative; padding-left: 1.5em; margin-bottom: .5em; }
.gad-page-corps li::before {
    content: ''; position: absolute; left: 0; top: .56em;
    width: 13px; height: 10px;
    background: linear-gradient(to right,
        var(--gad-vif) 0 42%, transparent 42% 58%, var(--gad-vif) 58% 100%);
}

.gad-contact {
    display: grid;
    grid-template-columns: minmax(0, .85fr) var(--gad-meneau) minmax(0, 1fr);
    gap: 0;
}
.gad-contact-mot { padding-right: clamp(24px, 3.4vw, 56px); }
.gad-contact-mot p + p { margin-top: 1em; }
.gad-contact-form { padding-left: clamp(24px, 3.4vw, 56px); }

.wpcf7-form p { display: flex; flex-direction: column; margin-bottom: 16px; }
.wpcf7-form br { display: none; }
/* Contact Form 7 6.x enveloppe ses champs caches dans un <fieldset> que le
   plugin ne masque pas : le navigateur lui dessine sa bordure par defaut,
   et un rectangle vide apparait au-dessus du premier champ. */
.wpcf7-form fieldset.hidden-fields-container { display: none; }
.wpcf7-form label {
    font-family: var(--gad-display);
    font-size: .74rem; font-weight: 700;
    letter-spacing: .14em; text-transform: uppercase;
    color: var(--gad-encre);
    display: flex; flex-direction: column; gap: 9px;
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
    font-family: var(--gad-corps);
    font-size: 1rem;
    color: var(--gad-encre);
    background: var(--gad-papier);
    border: none;
    box-shadow: inset 0 0 0 3px var(--gad-filet-2);
    padding: 13px 15px;
    width: 100%;
}
.wpcf7-form textarea { min-height: 168px; resize: vertical; }
.wpcf7-form input:focus, .wpcf7-form textarea:focus {
    outline: none; box-shadow: inset 0 0 0 3px var(--gad-vif);
}
.wpcf7-form input.wpcf7-submit {
    font-family: var(--gad-display);
    font-size: .95rem; font-weight: 700;
    background: var(--gad-vif); color: #fff;
    border: none; box-shadow: none;
    padding: 15px 28px; width: 100%; cursor: pointer;
    transition: background .2s ease;
}
.wpcf7-form input.wpcf7-submit:hover { background: var(--gad-vif-fonce); }

.gad-plan-groupe { margin-bottom: 36px; }
.gad-plan-groupe h2 { font-size: 1.3rem; padding-bottom: 12px; border-bottom: var(--gad-meneau) solid var(--gad-encre); }
.gad-plan-groupe ul { margin-top: 18px; }
.gad-plan-groupe li { position: relative; padding-left: 1.5em; margin-bottom: .6em; }
.gad-plan-groupe li::before {
    content: ''; position: absolute; left: 0; top: .56em;
    width: 13px; height: 10px;
    background: linear-gradient(to right,
        var(--gad-vif) 0 42%, transparent 42% 58%, var(--gad-vif) 58% 100%);
}

/* ── Bloc editorial des archives ──────────────────────────────────────── */

.gad-edito { padding-block: clamp(48px, 5.6vw, 78px); background: var(--gad-surface); }
.gad-edito-titre { font-size: clamp(1.4rem, 2.3vw, 1.9rem); margin-bottom: 26px; }
.gad-edito-grille {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--gad-meneau) 420px;
    gap: 0; align-items: center;
}
.gad-edito-texte { padding-right: clamp(22px, 3vw, 48px); }
.gad-edito-texte p + p { margin-top: 1em; }
.gad-edito-liste { margin: 18px 0; }
.gad-edito-liste li { position: relative; padding-left: 28px; margin-bottom: 10px; color: var(--gad-doux); }
.gad-edito-liste li::before {
    content: ""; position: absolute; left: 0; top: .62em;
    width: 16px; height: 3px; background: var(--gad-vif);
}
.gad-edito-vue { padding-left: clamp(22px, 3vw, 48px); }
.gad-edito-vue .gad-vue { aspect-ratio: 4 / 3; }

/* ── Pied ─────────────────────────────────────────────────────────────── */

.gad-pied {
    background: var(--gad-encre-2); color: var(--gad-clair-2);
    padding-block: clamp(44px, 5vw, 68px);
    border-top: var(--gad-meneau) solid var(--gad-vif);
}
.gad-pied-grille {
    display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
    gap: clamp(26px, 3.6vw, 52px);
}
.gad-pied .gad-marque { color: var(--gad-clair); }
.gad-pied-desc { margin-top: 18px; font-size: .94rem; max-width: 330px; }
.gad-pied-titre {
    font-family: var(--gad-display);
    font-size: .72rem; font-weight: 700;
    letter-spacing: .17em; text-transform: uppercase;
    color: var(--gad-clair);
    margin-bottom: 16px;
}
.gad-pied li { position: relative; padding-left: 22px; margin-bottom: 10px; font-size: .94rem; }
.gad-pied li::before {
    content: ""; position: absolute; left: 0; top: .62em;
    width: 13px; height: 10px;
    background: linear-gradient(to right,
        var(--gad-vif-clair) 0 42%, transparent 42% 58%, var(--gad-vif-clair) 58% 100%);
}
.gad-pied a { color: var(--gad-clair-2); }
.gad-pied a:hover { color: var(--gad-clair); }
.gad-pied-bas {
    margin-top: clamp(32px, 3.8vw, 48px);
    padding-top: 20px;
    border-top: 3px solid rgba(242, 242, 240, .14);
    text-align: center;
    font-size: .86rem;
    color: rgba(242, 242, 240, .58);
}

/* ── 404 ──────────────────────────────────────────────────────────────── */

.gad-404 { padding-block: clamp(70px, 9vw, 130px); }
.gad-404 h1 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); }
.gad-404 p { margin-top: 16px; }
.gad-404 .gad-bouton { margin-top: 26px; }

/* ── Adaptations ──────────────────────────────────────────────────────── */

@media (max-width: 1080px) {
    .gad-edito-grille { grid-template-columns: minmax(0, 1fr); }
    .gad-edito-texte { padding-right: 0; }
    .gad-edito-vue { padding-left: 0; order: -1; margin-bottom: 26px; }
    .gad-portrait { grid-template-columns: minmax(0, 1fr); }
    .gad-portrait > .gad-meneau,
    .gad-contact > .gad-meneau,
    .gad-edito-grille > .gad-meneau { height: var(--gad-meneau); margin-block: 8px; }
    .gad-portrait-corps { padding-right: 0; }
    .gad-portrait-photo { max-width: 360px; margin-top: 30px; }
    .gad-contact { grid-template-columns: minmax(0, 1fr); }
    .gad-contact-mot { padding-right: 0; margin-bottom: 30px; }
    .gad-contact-form { padding-left: 0; }
    .gad-pied-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gad-sommaire { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .gad-nav-liens, .gad-nav-contact { display: none; }
    .gad-barre-meneau { display: none; }
    .gad-nav { margin-left: auto; }
    .gad-burger {
        display: inline-flex; align-items: center; justify-content: center;
        margin-left: auto;
        width: 44px; height: 44px;
        background: none; border: none; cursor: pointer; padding: 0;
        color: var(--gad-encre);
    }
    .gad-nav {
        position: fixed; inset: 0; z-index: 90;
        background: var(--gad-encre);
        flex-direction: column; align-items: flex-start;
        gap: 0;
        padding: 24px var(--gad-marge);
        /* le menu est retire du flux tant qu il est ferme, jamais masque
           en opacite : rien du contenu du site ne depend du JS */
        display: none;
    }
    body.gad-menu-ouvert { overflow: hidden; }
    body.gad-menu-ouvert .gad-nav { display: flex; }
    .gad-nav-logo { display: inline-flex; align-items: center; color: var(--gad-clair); margin-bottom: 34px; }
    .gad-nav-close {
        display: inline-flex; align-items: center; justify-content: center;
        position: absolute; top: 22px; right: var(--gad-marge);
        width: 44px; height: 44px;
        background: none; border: none; cursor: pointer; padding: 0;
        color: var(--gad-clair);
    }
    .gad-nav-liens { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; width: 100%; }
    .gad-nav-liens a { font-size: 1.45rem; padding: 12px 0; color: var(--gad-clair); }
    .gad-nav-liens a::after { background: var(--gad-vif-clair); }
    .gad-nav-contact { display: inline-flex; margin-top: 26px; }

    .gad-vantaux { grid-template-columns: minmax(0, 1fr); min-height: 0; }
    .gad-vantaux .gad-meneau { height: var(--gad-meneau); }
    .gad-vantail-vue { aspect-ratio: 4 / 3; }
    .gad-vantail-vue img { position: static; }
    .gad-coiffe .gad-vantaux { min-height: 0; }

    .gad-une { grid-template-columns: minmax(0, 1fr); }
    .gad-une .gad-meneau { height: var(--gad-meneau); }
    .gad-une-corps { padding-left: 0; padding-top: 22px; }

    .gad-fiches { grid-template-columns: minmax(0, 1fr); }
    .gad-fiches-meneau { display: none; }
    .gad-fiche:nth-of-type(odd), .gad-fiche:nth-of-type(even) {
        grid-column: 1; padding-left: 0; padding-right: 0;
    }

    .gad-rubrique { grid-template-columns: minmax(0, 1fr); }
    .gad-rubrique .gad-meneau { height: var(--gad-meneau); }
    .gad-rubrique-vue { aspect-ratio: 16 / 9; }
    .gad-rubrique-vue img { position: static; }

    .gad-voisins-grille { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}

@media (max-width: 620px) {
    body { font-size: 16px; }
    .gad-sommaire { grid-template-columns: minmax(0, 1fr); }
    .gad-pied-grille { grid-template-columns: minmax(0, 1fr); }
    .gad-auteur { grid-template-columns: minmax(0, 1fr); }
    .gad-releves, .gad-portrait-reperes { grid-template-columns: minmax(0, 1fr); }
    .gad-releve + .gad-releve, .gad-repere + .gad-repere {
        padding-left: 0; box-shadow: none;
        border-top: 3px solid rgba(242, 242, 240, .16);
        padding-top: 14px; margin-top: 14px;
    }
    .gad-repere + .gad-repere { border-top-color: var(--gad-filet); }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    * { transition: none !important; animation: none !important; }
}