/*
Theme Name: La Gazette de Lille Métropole
Theme URI: https://lagazettemetropolitaine.fr
Author: Pascal
Description: Thème du journal indépendant de la Métropole Européenne de Lille. Associations, tribunes citoyennes, annonces et fiches des 95 communes.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gazette-lille
*/

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

:root{
  --ink:#1a1008;--ink-light:#3d2e1a;--cream:#faf6ef;--cream-dark:#f0e9dc;
  --red:#c0000a;--red-dark:#8b0007;--gold:#b5860d;
  --blue:#1a3a6b;--green:#1a5c2a;--purple:#4a1a6b;
  --rule:#d4c8b4;
}

body{font-family:'Source Sans 3',sans-serif;background:var(--cream);color:var(--ink);min-height:100vh}
img{max-width:100%;height:auto}
a{color:var(--red)}

/* Les règles .btn et autres posent un display qui l'emporte sur celui du
   navigateur : sans cette ligne, un élément masqué par l'attribut hidden
   resterait visible (le bouton « Question suivante » du quiz, notamment). */
[hidden]{display:none!important}

/* Accessibilité */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:8px;left:8px;width:auto;height:auto;clip:auto;z-index:99999;background:var(--ink);color:#fff;padding:10px 16px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ── TOPBAR ── */
.topbar{background:var(--ink);display:flex;align-items:stretch;flex-wrap:wrap}
.topbar ul{list-style:none;display:flex;flex-wrap:wrap;margin:0;padding:0;flex:1 1 auto}
.topbar a{color:#e8e0d4;text-decoration:none;font-size:12px;font-weight:600;letter-spacing:.06em;padding:10px 14px;display:flex;align-items:center;gap:5px;transition:background .15s;white-space:nowrap}
.topbar a:hover{background:#2e2010}
.topbar .current-menu-item>a,.topbar a.active{background:var(--red);color:#fff}
.topbar .menu-item-jeux>a{background:var(--green);color:#fff}
.topbar .menu-item-jeux>a:hover{background:#0f3a1a}
/* Accès à la rédaction : discret, poussé à droite de la barre. */
.topbar-connexion{display:flex;margin-left:auto}
.topbar-connexion .lien-connexion{color:#b8ac9b;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.topbar-connexion .lien-connexion:hover{color:#e8e0d4;background:#2e2010}
.topbar-connexion .lien-redaction{color:#e8e0d4;background:#2e2010}
.topbar-connexion .lien-redaction:hover{background:var(--red);color:#fff}

/* ── FILTRE PAR COMMUNE ── */
.filtre-commune{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
.filtre-commune select{max-width:260px}
.filtre-resume{font-size:13px;color:var(--ink-light);margin-bottom:16px;font-style:italic}

/* ── MASTHEAD ── */
.masthead{background:var(--cream);border-bottom:3px double var(--ink);padding:20px 32px 0}
.masthead-inner{display:flex;align-items:center;justify-content:center;gap:28px;flex-wrap:wrap;padding-bottom:16px}
.masthead-text{text-align:center}
.masthead-eyebrow{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:5px}
.masthead h1,.masthead .site-title{font-family:'Playfair Display',serif;font-size:52px;font-weight:900;line-height:1;color:var(--ink);text-transform:uppercase}
.masthead .site-title a{color:inherit;text-decoration:none}
.masthead .site-title em{display:block;font-style:italic;font-size:24px;font-weight:400;color:var(--red);letter-spacing:.05em;margin-top:3px}
.masthead-tagline{font-size:13px;color:var(--ink-light);margin:6px 0 14px;font-style:italic;font-family:'Libre Baskerville',serif}
.search-bar{display:flex;align-items:center;justify-content:center;gap:0}
.search-label{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-light);margin-right:10px}
.search-bar input[type=search],.search-bar input[type=text]{border:1.5px solid var(--ink);border-right:none;padding:8px 14px;font-size:13px;font-family:'Source Sans 3',sans-serif;background:#fff;width:240px;outline:none;color:var(--ink)}
.search-bar input:focus{border-color:var(--red)}
.search-bar button{background:var(--red);color:#fff;border:1.5px solid var(--red);padding:8px 14px;font-size:13px;font-weight:700;cursor:pointer}

/* ── EDITION BAR ── */
.edition-bar{background:var(--ink);color:#e0d8cc;font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:6px 32px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.edition-bar strong{color:var(--gold)}

/* ── LAYOUT ── */
.wrapper{max-width:1100px;margin:0 auto;padding:28px 24px}

/* ── SECTION HEAD ── */
.section-head{border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:7px 0;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.section-head h2{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
/* Titre des jeux : même graisse et même police que « Les associations ». */
.section-head h2.titre-jeux{font-weight:900;color:#000;letter-spacing:.02em}
.slabel{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;padding:3px 10px;border-radius:2px;color:#fff}
.sl-red{background:var(--red)}.sl-blue{background:var(--blue)}.sl-green{background:var(--green)}.sl-gold{background:var(--gold)}.sl-purple{background:var(--purple)}

/* ── BOUTONS ── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border:1.5px solid;transition:all .15s;cursor:pointer;font-family:'Source Sans 3',sans-serif}
.btn-red{background:var(--red);color:#fff;border-color:var(--red)}.btn-red:hover{background:var(--red-dark);border-color:var(--red-dark)}
.btn-blue{background:var(--blue);color:#fff;border-color:var(--blue)}.btn-blue:hover{background:#0f2548}
.btn-green{background:var(--green);color:#fff;border-color:var(--green)}.btn-green:hover{background:#0f3a1a}
.btn-gold{background:var(--gold);color:#fff;border-color:var(--gold)}.btn-gold:hover{background:#8a6508}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--ink)}.btn-outline:hover{background:var(--ink);color:var(--cream)}

/* ── CARTES UNE ── */
.une-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.une-card{border:1.5px solid var(--ink);background:#fff;padding:22px;display:flex;flex-direction:column;gap:10px;position:relative;transition:box-shadow .15s}
.une-card:hover{box-shadow:4px 4px 0 var(--ink)}
.une-card-accent{position:absolute;top:0;left:0;right:0;height:4px}
.acc-red{background:var(--red)}.acc-blue{background:var(--blue)}.acc-gold{background:var(--gold)}
.acc-green{background:var(--green)}.acc-purple{background:var(--purple)}
.une-card-icon{font-size:30px;line-height:1}
.une-card h3{font-family:'Playfair Display',serif;font-size:19px;font-weight:700;line-height:1.2}
.une-card h3 a{color:var(--ink);text-decoration:none}
.une-card h3 a:hover{color:var(--red)}
.une-card p{font-family:'Libre Baskerville',serif;font-size:13px;line-height:1.75;color:var(--ink-light);flex:1}
.une-thumb{margin:-22px -22px 0;display:block}
.une-thumb img{width:100%;display:block}

/* ── UNE : ARTICLE PRINCIPAL ── */
.une-lead{display:grid;grid-template-columns:1.7fr 1fr;gap:20px;align-items:stretch}
.une-secondaires{display:flex;flex-direction:column;gap:20px}
.lead-card{padding:0;overflow:hidden}
/* Une photo seule en tête de une : elle s'étire sur la hauteur des cartes voisines. */
.lead-image-seule{display:flex;flex-direction:column}
.lead-image-seule .lead-figure{flex:1;display:flex;flex-direction:column;min-height:0}
.lead-image-seule .lead-thumb{flex:1;min-height:0}
.lead-image-seule .lead-thumb img{height:100%;aspect-ratio:auto;object-fit:cover}
.lead-image-seule .credit-photo{padding-bottom:10px}
.lead-figure{margin:0}
.lead-thumb{display:block;margin:0}
.lead-thumb img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
/* Crédit photo : discret, mais toujours présent sous l'image. */
.credit-photo{font-family:'Source Sans 3',sans-serif;font-size:11px;letter-spacing:.04em;
  color:#7a6b55;padding:6px 22px 0;text-align:right;font-style:normal}
.post-thumb .credit-photo{padding:6px 0 0}
.lead-corps{padding:22px;display:flex;flex-direction:column;gap:10px}
.lead-titre{font-family:'Playfair Display',serif;font-size:30px;font-weight:900;line-height:1.15}
.lead-titre a{color:var(--ink);text-decoration:none}
.lead-titre a:hover{color:var(--red)}
.lead-corps p{font-family:'Libre Baskerville',serif;font-size:14px;line-height:1.8;color:var(--ink-light)}
.lead-corps .btn{align-self:flex-start}

/* Cartes de rubrique, dans la colonne de droite de la une. */
.carte-jeux{background:linear-gradient(180deg,#fffdf7 0%,var(--cream) 100%)}
.carte-tribunes{background:linear-gradient(180deg,#fafbfd 0%,var(--cream) 100%)}
.carte-jeux h3 a,.carte-tribunes h3 a{color:var(--ink);text-decoration:none}
.carte-jeux h3 a:hover{color:var(--gold)}
.carte-tribunes h3 a:hover{color:var(--blue)}
.carte-accroche{font-family:'Libre Baskerville',serif!important;font-style:italic;
  font-size:15px!important;line-height:1.5!important;flex:none!important}
.carte-accroche-or{color:var(--gold)!important}
.carte-accroche-bleue{color:var(--blue)!important}

/* ── ACCROCHE DE RUBRIQUE ── */
.accroche{font-family:'Playfair Display',serif;font-size:23px;font-weight:700;line-height:1.3;
  color:var(--ink);margin-bottom:12px;text-wrap:balance;border-left:4px solid var(--green);padding-left:16px}
.accroche-texte{font-family:'Libre Baskerville',serif;font-size:14px;line-height:1.85;
  color:var(--ink-light);margin-bottom:18px;max-width:62ch}
.accroche-bleue{border-left-color:var(--blue)}
.accroche-bouton{margin:-4px 0 18px 20px}
.accroche-rouge{border-left-color:var(--red)}
.chapeau-rubrique{margin-bottom:26px}
/* Chapeau « à l'encre » : bleu, gras, italique, une phrase par ligne. */
.accroche-texte-encre{color:var(--red);font-weight:700;font-style:italic;
  font-size:15px;line-height:1.7;max-width:none}
.accroche-texte-encre .ligne{display:block}

/* ── ASSOCIATIONS EN EXERGUE ── */
.exergue{margin-top:32px;background:var(--cream-dark);border-top:4px solid var(--green);
  border-bottom:1px solid var(--rule);padding:24px;position:relative}
.exergue-tete{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;
  margin-bottom:20px;padding-bottom:18px;border-bottom:1px solid var(--rule)}
.exergue-surtitre{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--green);margin-bottom:4px;text-indent:.2em}
.exergue-titre{font-family:'Playfair Display',serif;font-size:28px;font-weight:900;
  text-transform:uppercase;letter-spacing:.02em;line-height:1}
.exergue-accroche{font-family:'Libre Baskerville',serif;font-style:italic;font-size:16px;
  color:var(--blue);margin-top:7px}
.exergue-grille{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.exergue-carte{background:#fff;border:1px solid var(--rule);padding:18px;display:flex;
  flex-direction:column;gap:7px;transition:border-color .15s,box-shadow .15s}
.exergue-carte:hover{border-color:var(--green);box-shadow:3px 3px 0 rgba(26,92,42,.18)}
.exergue-logo{width:48px;height:48px;border:1.5px solid var(--rule);background:var(--cream);
  display:flex;align-items:center;justify-content:center;font-size:24px;overflow:hidden}
.exergue-logo img{width:100%;height:100%;object-fit:cover}
.exergue-carte h3{font-family:'Playfair Display',serif;font-size:16px;font-weight:700;line-height:1.25}
.exergue-carte h3 a{color:var(--ink);text-decoration:none}
.exergue-carte h3 a:hover{color:var(--green)}
.exergue-lieu{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.exergue-texte{font-size:13px;line-height:1.65;color:var(--ink-light)}
.exergue-pied{margin-top:16px;text-align:right}
.exergue-pied a{font-size:13px;font-weight:700;color:var(--green);text-decoration:none}
.exergue-pied a:hover{text-decoration:underline}

/* ── ANNONCES ── */
.annonces-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ann-item{border:1px solid var(--rule);background:#fff;padding:14px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden;transition:all .15s}
.ann-item::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--cream-dark);transition:background .15s}
.ann-item:hover{border-color:var(--red)}.ann-item:hover::before{background:var(--red)}
.ann-icon{font-size:22px;margin-bottom:2px}
.ann-title{font-size:13px;font-weight:700}
.ann-desc{font-size:11px;color:#7a6b55;line-height:1.5}

/* ── COMMUNES ── */
.communes-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.commune-card{border:1px solid var(--rule);background:#fff;padding:14px 10px;text-align:center;transition:all .15s;text-decoration:none;display:block;color:inherit}
.commune-card:hover{border-color:var(--red);background:#fff8f8}
.c-name{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-top:4px;line-height:1.3}
.c-pop{display:block;font-size:10px;color:#7a6b55;margin-top:2px;white-space:nowrap}
.alpha-nav{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:18px}
.alpha-nav a{border:1px solid var(--rule);background:#fff;padding:4px 9px;font-size:12px;font-weight:700;text-decoration:none;color:var(--ink)}
.alpha-nav a:hover{border-color:var(--red);color:var(--red)}

/* Filtre de la liste des communes : le champ est le premier réflexe sur
   un téléphone, où la liste complète fait neuf écrans. */
.filtre-communes{margin-bottom:16px}
.filtre-communes input[type=search]{width:100%;max-width:420px;box-sizing:border-box;
  border:1.5px solid var(--ink);padding:10px 14px;font-size:15px;
  font-family:'Source Sans 3',sans-serif;background:#fff;color:var(--ink);outline:none}
.filtre-communes input[type=search]:focus{border-color:var(--red)}
.filtre-communes-etat{font-size:13px;color:var(--ink-light);font-style:italic;
  margin-top:7px;min-height:1.2em}

/* ── FORMULAIRES ── */
.form-section{max-width:680px}
.form-group{margin-bottom:18px}
.form-group label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-light);margin-bottom:5px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 14px;border:1.5px solid #c8baa4;font-size:14px;font-family:'Source Sans 3',sans-serif;background:#fff;color:var(--ink);outline:none;transition:border-color .15s}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--red)}
.form-group textarea{resize:vertical;min-height:120px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-note{font-size:12px;color:#7a6b55;margin-top:4px}
.hp-field{position:absolute;left:-9999px}
.form-success{background:#e8f5ec;border:1.5px solid var(--green);padding:20px;margin-bottom:16px}
.form-success h3{font-family:'Playfair Display',serif;font-size:20px;color:var(--green)}
.form-error{background:#fde8e8;border:1.5px solid var(--red);padding:16px 20px;margin-bottom:16px;color:var(--red-dark)}
.form-error ul{margin:8px 0 0 18px;font-size:14px}

/* ── ENCADRÉS ── */
.box{border:1.5px solid var(--ink);padding:18px;background:#fff;margin-bottom:16px}
.box-title{font-family:'Playfair Display',serif;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--ink);padding-bottom:8px;margin-bottom:12px}
.box ul{padding-left:16px;font-size:13px;line-height:2;color:var(--ink-light)}

/* ── QUIZ ── */
.quiz-card{border:1.5px solid var(--ink);background:#fff;padding:28px;max-width:700px;margin:0 auto}
.quiz-question{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;line-height:1.3;margin-bottom:20px}
.quiz-options{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.quiz-opt{border:1.5px solid #c8baa4;padding:12px 16px;cursor:pointer;font-size:14px;text-align:left;background:#fff;font-family:'Source Sans 3',sans-serif;transition:all .15s}
.quiz-opt:hover{border-color:var(--blue);background:var(--blue);color:#fff}
.quiz-opt.correct{border-color:var(--green)!important;background:var(--green)!important;color:#fff!important}
.quiz-opt.wrong{border-color:var(--red)!important;background:var(--red)!important;color:#fff!important}
.quiz-progress{display:flex;align-items:center;gap:12px;margin-bottom:20px;font-size:12px;color:var(--ink-light)}
.progress-bar{flex:1;height:6px;background:#e0d8cc}
.progress-fill{height:100%;background:var(--red);transition:width .3s}
.score-num{font-family:'Playfair Display',serif;font-size:56px;font-weight:900;color:var(--red)}

/* ── ASSOCIATIONS ── */
.asso-card{border:1px solid var(--rule);background:#fff;padding:18px;margin-bottom:12px;display:flex;gap:16px;align-items:flex-start}
.asso-logo{width:56px;height:56px;border:1.5px solid var(--rule);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;background:var(--cream);overflow:hidden}
.asso-logo img{width:100%;height:100%;object-fit:cover}
.asso-info h3{font-family:'Playfair Display',serif;font-size:16px;font-weight:700;margin-bottom:4px}
.asso-info h3 a{color:var(--ink);text-decoration:none}
.asso-info h3 a:hover{color:var(--red)}
.asso-commune{font-size:11px;color:var(--gold);font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.asso-info p{font-size:13px;color:var(--ink-light);line-height:1.6}
.tag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:2px 8px;margin-right:4px;margin-bottom:8px;text-decoration:none}
.tag-blue{background:#dde8f5;color:var(--blue)}.tag-green{background:#ddf0e3;color:var(--green)}.tag-red{background:#fde0e0;color:var(--red)}

/* ── TRIBUNES ── */
.tribune-card{border:1px solid var(--rule);background:#fff;padding:20px;margin-bottom:14px}
.tribune-card h3{font-family:'Playfair Display',serif;font-size:17px;font-weight:700;margin-bottom:6px}
.tribune-card h3 a{color:var(--ink);text-decoration:none}
.tribune-card h3 a:hover{color:var(--red)}
.tribune-meta{font-size:11px;color:var(--gold);font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.tribune-card p{font-family:'Libre Baskerville',serif;font-size:13px;line-height:1.75;color:var(--ink-light)}

/* ── ANNONCE LISTE ── */
.annonce-list{display:flex;flex-direction:column;gap:12px}
.ann-row{border:1px solid var(--rule);background:#fff;padding:16px 20px;display:flex;gap:16px;align-items:center;transition:all .15s;text-decoration:none;color:inherit}
.ann-row:hover{border-color:var(--red)}
.ann-row-icon{font-size:28px;flex-shrink:0}
.ann-row-thumb{width:64px;height:64px;object-fit:cover;flex-shrink:0;border:1px solid var(--rule)}
.ann-row-title{display:block;font-size:15px;font-weight:700;color:var(--ink)}
.ann-row-meta{display:block;font-size:12px;color:#7a6b55;margin-top:3px}
.ann-row-price{font-family:'Playfair Display',serif;font-size:18px;font-weight:700;color:var(--red);flex-shrink:0}

/* ── GRILLES ── */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
/* Les cartes de jeux : autant par rangée que la largeur le permet. */
.grid-jeux{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:16px}

/* ── COMMUNE HERO ── */
.commune-hero{background:var(--ink);color:#fff;padding:32px}
.commune-hero h1,.commune-hero h2{font-family:'Playfair Display',serif;font-size:38px;font-weight:900;text-transform:uppercase}
.commune-hero .hero-sub{color:var(--gold);font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin-top:4px}
.stats-row{display:flex;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.stat-box{flex:1;min-width:100px;border:1.5px solid var(--ink);background:#fff;padding:16px;text-align:center}
.stat-num{font-family:'Playfair Display',serif;font-size:28px;font-weight:900;color:var(--red)}
.stat-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-light);margin-top:2px}

/* ── BREADCRUMB ── */
.breadcrumb{background:var(--cream-dark);border-bottom:1px solid var(--rule);padding:8px 24px;font-size:12px;color:var(--ink-light)}
.breadcrumb a{color:var(--red);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}

/* ── ARTICLE ── */
.entry-content{font-family:'Libre Baskerville',serif;font-size:15px;line-height:1.85;color:var(--ink-light);max-width:68ch}
.entry-content p,.entry-content ul,.entry-content ol,.entry-content blockquote{margin-bottom:1.1em}
.entry-content ul,.entry-content ol{padding-left:22px}
.entry-content h2{font-family:'Playfair Display',serif;font-size:24px;color:var(--ink);margin:1.4em 0 .5em}
.entry-content h3{font-family:'Playfair Display',serif;font-size:19px;color:var(--ink);margin:1.3em 0 .4em}
.entry-content blockquote{border-left:3px solid var(--red);padding-left:18px;font-style:italic}
.entry-title-single{font-family:'Playfair Display',serif;font-size:36px;font-weight:900;line-height:1.15;margin-bottom:10px}
.entry-chapo{font-family:'Libre Baskerville',serif;font-size:16px;font-style:italic;color:var(--ink-light);margin-bottom:18px;max-width:68ch}
.post-thumb{margin-bottom:20px;border:1px solid var(--rule)}
.wp-caption-text,.entry-content figcaption{font-family:'Source Sans 3',sans-serif;font-size:11px;color:#7a6b55;padding-top:5px}
.alignleft{float:left;margin:0 20px 12px 0}
.alignright{float:right;margin:0 0 12px 20px}
.aligncenter{display:block;margin:0 auto 12px}

/* ── PAGINATION ── */
.pagination{margin:28px 0;display:flex;gap:6px;flex-wrap:wrap}
.pagination .page-numbers{border:1px solid var(--rule);background:#fff;padding:7px 13px;text-decoration:none;color:var(--ink);font-size:13px;font-weight:600}
.pagination .page-numbers.current{background:var(--red);border-color:var(--red);color:#fff}
.pagination a.page-numbers:hover{border-color:var(--red);color:var(--red)}

/* ── COMMENTAIRES ── */
.comments-area{margin-top:32px;border-top:3px solid var(--ink);padding-top:24px}
.comment-list{list-style:none}
.comment-list li{border:1px solid var(--rule);background:#fff;padding:16px;margin-bottom:12px}
.comment-meta{font-size:11px;color:var(--gold);font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}

/* ── FOOTER ── */
.site-footer{background:var(--ink);color:#e0d8cc;padding:28px 24px;margin-top:0}
.footer-inner{max-width:1100px;margin:0 auto;text-align:center}
.footer-brand{font-family:'Playfair Display',serif;font-size:18px;font-weight:700;text-transform:uppercase}
.footer-brand span{display:block;font-family:'Source Sans 3',sans-serif;font-size:11px;font-weight:400;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-top:5px}
.footer-nav{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:18px;margin-top:16px;padding:0}
.footer-nav a{color:#e0d8cc;font-size:12px;text-decoration:none;letter-spacing:.06em}
.footer-nav a:hover{color:var(--gold)}
.footer-widgets{max-width:1100px;margin:0 auto 22px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:left}
.footer-widgets .widget-title{font-family:'Playfair Display',serif;font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--gold);margin-bottom:10px}
.footer-widgets ul{list-style:none;font-size:13px;line-height:1.9}
.footer-widgets a{color:#e0d8cc;text-decoration:none}
.footer-widgets a:hover{color:#fff;text-decoration:underline}

/* ── SIDEBAR ── */
.layout-sidebar{display:grid;grid-template-columns:1fr 320px;gap:32px;align-items:start}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .communes-grid{grid-template-columns:repeat(3,1fr)}
  .annonces-grid{grid-template-columns:repeat(3,1fr)}
  .layout-sidebar{grid-template-columns:1fr}
  .footer-widgets{grid-template-columns:1fr}
  .une-lead{grid-template-columns:1fr}
  .une-secondaires{display:grid;grid-template-columns:1fr 1fr;gap:20px}
  .exergue-grille{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .masthead{padding:16px 16px 0}
  .masthead .site-title{font-size:32px}.masthead .site-title em{font-size:17px}
  .une-grid,.annonces-grid,.communes-grid{grid-template-columns:repeat(2,1fr)}
  .form-row,.grid-2,.grid-3{grid-template-columns:1fr}
  .stats-row{flex-direction:column}
  .search-label{display:none}
  .search-bar input[type=search],.search-bar input[type=text]{width:160px}
  .wrapper{padding:20px 16px}
  .entry-title-single{font-size:27px}
  .commune-hero{padding:22px 16px}
  .commune-hero h1{font-size:27px}
  .edition-bar{padding:6px 16px;font-size:10px}
}
@media(max-width:520px){
  /* Sur un téléphone, deux colonnes rendent les cartes de la une
     illisibles. Les vignettes de rubrique, elles, sont courtes : à une
     seule colonne, les treize rubriques feraient quatre écrans de haut. */
  .une-grid{grid-template-columns:1fr}
  .annonces-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .ann-title{font-size:13px}
  .ann-desc{font-size:11px}
  .une-secondaires,.exergue-grille{grid-template-columns:1fr}
  .communes-grid{grid-template-columns:repeat(2,1fr)}
  .masthead .site-title{font-size:26px}
  .lead-titre{font-size:23px}
  .exergue{padding:18px 16px}
  .exergue-titre{font-size:22px}
  .ann-row{flex-wrap:wrap}
  .ann-row-price{width:100%}
}

/* ── TÉLÉPHONE ──
   Un écran de poche fait environ 390 px de large et 840 px de haut. Tout ce
   que l'en-tête occupe, l'article ne l'occupe pas : le lecteur est venu pour
   les nouvelles de sa commune, pas pour le blason. On resserre donc le haut
   de page, on élargit les cibles du doigt, et on empêche les champs de
   formulaire de faire zoomer l'écran. */
@media(max-width:600px){

  /* Navigation : plus compacte, mais chaque lien garde une hauteur de
     frappe confortable — environ 44 px, la largeur d'un pouce. */
  .topbar a{font-size:11px;letter-spacing:.04em;padding:13px 11px;gap:4px}
  .topbar-connexion{margin-left:0;width:100%;justify-content:flex-end;
    border-top:1px solid #2e2010}
  .topbar-connexion .lien-connexion{padding:9px 14px;font-size:10px}

  /* Nameplate : le blason passe à côté du titre au lieu d'être au-dessus.
     Deux cents pixels de hauteur regagnés, soit un quart de l'écran. */
  .masthead{padding:12px 14px 0}
  .masthead-inner{gap:12px;padding-bottom:12px;flex-wrap:nowrap}
  .masthead-inner > a{flex-shrink:0}
  .masthead-inner svg,.masthead-inner .custom-logo{width:74px;height:74px}
  .masthead-text{flex:1;min-width:0}
  .masthead-eyebrow{font-size:8.5px;letter-spacing:.18em;margin-bottom:3px}
  .masthead .site-title{font-size:30px}
  .masthead .site-title em{font-size:14px;margin-top:1px}
  .masthead-tagline{font-size:11px;margin:4px 0 10px}

  /* Recherche : le champ prend la place disponible plutôt qu'une largeur fixe. */
  .search-bar{width:100%}
  .search-bar input[type=search],.search-bar input[type=text]{flex:1;width:auto;min-width:0}

  /* Bandeau d'édition : la mention de la métropole répète la devise du
     journal, trois lignes plus haut. On la retire ici. */
  .edition-bar{font-size:9.5px;letter-spacing:.06em;gap:8px}
  .edition-bar span:last-child{display:none}

  /* Champs de saisie : en dessous de 16 px, Safari zoome sur le champ au
     moment où on le touche, et la page reste décalée ensuite. */
  input[type=text],input[type=email],input[type=tel],input[type=url],
  input[type=number],input[type=search],input[type=date],select,textarea{
    font-size:16px}

  /* Boutons et vignettes : des cibles qu'on atteint sans viser. */
  .btn{padding:12px 18px;min-height:44px}
  .ann-item,.commune-card{padding:14px 10px}
  .galerie-vignette img{height:96px}

  /* Chiffres d'une commune : empilés, les quatre encadrés mangent la
     moitié de l'écran. En damier, ils tiennent sur deux rangs. */
  .stats-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .stat-box{padding:12px 8px;min-width:0}
  .stat-num{font-size:24px}
  .stat-label{font-size:10px}

  /* Fiches et cartes : moins de marge intérieure, plus de texte. */
  .box,.une-card,.tribune-card,.asso-card{padding:16px}
  .asso-card{gap:12px}
  .wrapper{padding:18px 14px}
}


/* ── MOTS FLÉCHÉS ── */
.fl-barre{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.fl-compteur{font-family:'Playfair Display',serif;font-size:15px;font-weight:700}
.fl-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.fl-actions .btn{font-size:11px;padding:7px 12px}

.fl-cadre{overflow-x:auto;padding-bottom:4px}
.fl-plateau{display:grid;grid-template-columns:repeat(var(--colonnes),minmax(0,1fr));
  gap:1px;background:var(--ink);border:2px solid var(--ink);
  min-width:624px;max-width:720px}
.fl-case{aspect-ratio:1;display:flex;align-items:center;justify-content:center;
  font-family:'Source Sans 3',sans-serif;text-align:center}
.fl-bloc{background:var(--ink)}
.fl-def{background:var(--cream-dark);flex-direction:column;justify-content:center;
  gap:1px;padding:2px;line-height:1.08;overflow:hidden}
.fl-def-txt{font-size:7.5px;font-weight:600;color:var(--ink-light);
  letter-spacing:-.01em;word-break:break-word;hyphens:auto}
.fl-fleche{color:var(--red);font-size:7px}

.fl-lettre{background:#fff;border:none;border-radius:0;width:100%;height:100%;
  font-family:'Playfair Display',serif;font-size:19px;font-weight:700;
  text-align:center;text-transform:uppercase;color:var(--ink);padding:0;
  outline:none;caret-color:var(--red)}
.fl-lettre:focus{background:#fff6cf;box-shadow:inset 0 0 0 2px var(--red)}
.fl-juste{color:var(--green)}
.fl-faux{color:var(--red);background:#fde8e8}
.fl-aide{color:var(--blue)}

.fl-message{margin-top:12px;padding:10px 14px;font-size:13px;font-weight:600;
  border-left:4px solid var(--ink-light);background:var(--cream-dark)}
.fl-message-ok{border-left-color:var(--green);background:#e8f5ec;color:var(--green)}
.fl-message-faux{border-left-color:var(--red);background:#fde8e8;color:var(--red-dark)}
.fl-aide-saisie{font-size:12px;color:var(--ink-light);margin-top:10px;line-height:1.6}

/* Sur petit écran la grille ne rétrécit pas : elle défile horizontalement,
   sinon les définitions ne tiendraient plus dans leur case. */
@media(max-width:700px){
  .fl-cadre{margin:0 -16px;padding:0 16px}
}


/* ── CHOIX DU DÉPOSANT (annonces) ── */
.choix-deposant{border:1.5px solid var(--ink);display:flex;flex-direction:column;gap:10px}
.choix-deposant legend{padding:0 8px;margin-left:-8px;background:#fff;border:none}
.choix{display:flex;gap:12px;align-items:flex-start;border:1.5px solid var(--rule);
  background:#fff;padding:14px 16px;cursor:pointer;transition:border-color .15s,background .15s}
.choix:hover{border-color:var(--red)}
.choix:has(input:checked){border-color:var(--red);background:#fff8f8;box-shadow:inset 3px 0 0 var(--red)}
.choix input{margin-top:3px;accent-color:var(--red);width:17px;height:17px;flex-shrink:0}
.choix-txt{display:flex;flex-direction:column;gap:3px}
.choix-txt strong{font-family:'Playfair Display',serif;font-size:16px;font-weight:700;color:var(--ink)}
.choix-txt span{font-size:12.5px;line-height:1.55;color:var(--ink-light)}

.bloc-pro{margin-top:18px;padding-top:16px;border-top:1px dashed var(--rule)}
.bloc-pro-titre{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--red);margin-bottom:12px}


/* ── DEUX RÉGIMES DE DÉPÔT (annonces) ── */
.box-surtitre{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-light);margin-bottom:10px}
.box-regime{margin-bottom:14px;border-top-width:4px;border-top-style:solid}
.box-regime-libre{border-top-color:var(--green)}
.box-regime-pro{border-top-color:var(--red)}
.box-tarif{font-family:'Playfair Display',serif;font-size:17px;font-weight:700;
  margin:-4px 0 12px}
.box-regime-libre .box-tarif{color:var(--green)}
.box-regime-pro .box-tarif{color:var(--red)}

/* ── PHOTOS ET VIDÉO D'UNE ANNONCE ── */
.galerie-annonce{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:10px;margin-top:20px}
.galerie-vignette{display:block;border:1px solid var(--rule);background:#fff;line-height:0;
  transition:border-color .15s}
.galerie-vignette:hover{border-color:var(--red)}
.galerie-vignette img{width:100%;height:120px;object-fit:cover;display:block}
.video-annonce{margin-top:22px}
.video-annonce video{width:100%;max-height:460px;background:var(--ink);display:block;
  border:1px solid var(--rule)}
.video-annonce figcaption{font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-light);margin-top:6px}

/* ── ÉCRAN DE RENOUVELLEMENT D'UNE ANNONCE ── */
.renouveau{border-top:4px solid var(--red);margin-bottom:24px}
.renouveau-titre{font-family:'Playfair Display',serif;font-size:19px;font-weight:700;
  color:var(--ink);margin:-4px 0 6px}
.renouveau-txt{font-size:13.5px;color:var(--ink-light);margin-bottom:14px}

/* ── LETTRE D'INFORMATION ── */
.lettre{background:var(--cream-dark);border-top:4px solid var(--red);margin-top:36px}
.lettre-inner{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;
  padding-top:26px;padding-bottom:26px}
.lettre-surtitre{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--red);margin-bottom:5px}
.lettre-accroche{font-family:'Playfair Display',serif;font-size:25px;font-weight:700;
  line-height:1.15;color:var(--ink)}
.lettre-note{font-size:13px;line-height:1.6;color:var(--ink-light);margin-top:7px;max-width:52ch}
.lettre-form{display:flex;gap:0;align-items:stretch}
.lettre-form input[type=email]{border:1.5px solid var(--ink);border-right:none;padding:11px 15px;
  font-family:'Source Sans 3',sans-serif;font-size:14px;background:#fff;color:var(--ink);
  outline:none;width:250px}
.lettre-form input[type=email]:focus{border-color:var(--red)}
.lettre-form .btn{white-space:nowrap}
.lettre-retour{grid-column:1/-1;font-size:13.5px;font-weight:600;padding:10px 14px;
  border-left:4px solid}
.lettre-retour-ok{background:#e8f5ec;border-left-color:var(--green);color:var(--green)}
.lettre-retour-erreur{background:#fde8e8;border-left-color:var(--red);color:var(--red-dark)}

@media(max-width:780px){
  .lettre-inner{grid-template-columns:1fr;gap:16px}
  .lettre-form{flex-direction:column;gap:8px}
  .lettre-form input[type=email]{width:100%;border-right:1.5px solid var(--ink)}
  .lettre-form .btn{justify-content:center}
}

/* ── MENTIONS DE COLLECTE ET LIENS LÉGAUX ──
   La loi veut que l'information soit donnée au moment où la donnée est
   recueillie. Cette mention est donc sous le bouton, pas dans une page
   annexe : c'est la dernière chose lue avant d'envoyer. */
.mention-donnees{font-size:12.5px;line-height:1.65;color:var(--ink-light);
  margin-top:12px;max-width:560px;border-left:2px solid var(--rule);padding-left:12px}
.mention-donnees a{color:var(--red)}
.footer-legal{font-size:12px;margin-top:14px}
.footer-legal a{color:#c8baa4;text-decoration:none;border-bottom:1px solid #4a3a26}
.footer-legal a:hover{color:#fff;border-bottom-color:#8a7a62}
