/* =====================================================================
   DOCTEUR FRANCE — Paul Montserrat
   Feuille de style partagée · Soigner la France pour un avenir radieux
   ===================================================================== */
:root{
  --navy:#16365c;          /* bleu de marque (rgb 25,60,102 affiné) */
  --navy-deep:#0f2845;
  --navy-night:#0a1d35;
  --ink:#1b1f24;
  --ivory:#f7f3ea;
  --paper:#fbf8f1;
  --bordeaux:#7c2b2f;
  --bordeaux-bright:#a23a3f;
  --gold:#8a6a30;          /* or assombri pour un contraste lisible sur fond clair */
  --gold-soft:#c9a567;     /* réservé aux fonds sombres */
  --muted:#4c525a;         /* gris de texte secondaire, contraste renforcé */
  --muted-light:#cdd8e4;   /* texte secondaire sur fond sombre */
  --line:rgba(22,54,92,.16);
  --line-soft:rgba(22,54,92,.09);
  --green:#2f6f5e;
  --maxw:1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"EB Garamond",Garamond,"Times New Roman",serif;
  font-size:20px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}
.wrap-narrow{max-width:880px;margin:0 auto;padding:0 32px;}
h1,h2,h3,h4,h5{font-weight:500;margin:0;line-height:1.12;letter-spacing:-.01em;}
a{color:inherit;}
img{max-width:100%;display:block;}
.label{font-family:"Archivo",sans-serif;font-size:12px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;}
.it{font-style:italic;}

/* ---------- En-tête ---------- */
/* Fond opaque par défaut (fiable sur tous les navigateurs, dont Safari),
   flou appliqué seulement si le navigateur le gère réellement. */
header.top{position:-webkit-sticky;position:sticky;top:0;z-index:60;background:rgba(251,248,241,.97);border-bottom:1px solid var(--line-soft);}
@supports ((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))){
  header.top{background:rgba(251,248,241,.88);-webkit-backdrop-filter:saturate(140%) blur(10px);backdrop-filter:saturate(140%) blur(10px);}
}
.top .wrap{max-width:1320px;display:flex;align-items:center;justify-content:space-between;gap:18px;height:70px;}
.brand{display:flex;align-items:baseline;gap:13px;text-decoration:none;white-space:nowrap;}
.brand .mark{font-family:"Archivo",sans-serif;font-weight:700;letter-spacing:.02em;font-size:18px;color:var(--navy);}
.brand .sub{font-size:16.5px;color:var(--bordeaux);font-style:italic;}
nav.main{display:flex;gap:19px;}
nav.main a{font-family:"Archivo",sans-serif;font-size:13.5px;font-weight:500;letter-spacing:.01em;white-space:nowrap;text-decoration:none;color:var(--ink);opacity:.92;transition:opacity .2s,color .2s;}
nav.main a:hover,nav.main a.active{opacity:1;color:var(--navy);}
nav.main a.active{border-bottom:2px solid var(--bordeaux);padding-bottom:3px;}
.top .cta{font-family:"Archivo",sans-serif;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--paper);background:var(--navy);padding:10px 16px;border-radius:2px;}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:2px;padding:8px 13px;font-family:"Archivo",sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);cursor:pointer;line-height:1;}
@media(max-width:1240px){
  nav.main{position:fixed;inset:70px 0 auto 0;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 0;transform:translateY(-130%);transition:transform .3s;}
  nav.main.open{transform:none;}
  nav.main a{padding:15px 32px;font-size:15px;opacity:.9;}
  .burger{display:block;}
  .top .cta{display:none;}
}

/* ---------- Sections génériques ---------- */
section{padding:92px 0;border-bottom:1px solid var(--line);}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:42px;}
.sec-head .num{font-family:"Archivo",sans-serif;font-weight:700;font-size:14px;color:var(--gold);letter-spacing:.08em;}
.sec-head h2{font-size:clamp(30px,3.8vw,46px);color:var(--navy);}
.lead{font-size:23px;max-width:64ch;color:#22262b;}
.kicker{display:flex;align-items:center;gap:16px;color:var(--bordeaux);margin-bottom:22px;}
.kicker .rule{height:1px;width:54px;background:var(--bordeaux);opacity:.5;}

/* ---------- Bandeau de page ---------- */
.page-banner{background:var(--navy-deep);color:var(--ivory);padding:70px 0 64px;border-bottom:none;}
.page-banner .label{color:var(--gold-soft);}
.page-banner h1{font-size:clamp(38px,5.4vw,68px);color:#fff;margin-top:18px;line-height:1;letter-spacing:-.02em;}
.page-banner h1 em{font-style:italic;color:var(--gold-soft);}
.page-banner p{font-size:21px;color:#cdd5df;max-width:60ch;margin-top:20px;}
.crumbs{font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.06em;color:#8ea0b6;}
.crumbs a{text-decoration:none;color:#8ea0b6;}
.crumbs a:hover{color:#fff;}

/* ---------- Ticker / devise ---------- */
.ticker{background:var(--navy);color:var(--ivory);}
.ticker .wrap{display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between;padding:20px 32px;}
.ticker span{font-family:"Archivo",sans-serif;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.92;}
.ticker span b{color:var(--gold-soft);font-weight:600;}

/* ---------- Boutons ---------- */
.btn{font-family:"Archivo",sans-serif;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;padding:15px 26px;border-radius:2px;display:inline-block;transition:transform .15s;}
.btn:hover{transform:translateY(-2px);}
.btn.solid{background:var(--gold);color:var(--navy-deep);}
.btn.navy{background:var(--navy);color:#fff;}
.btn.ghost{border:1px solid rgba(255,255,255,.45);color:#fff;}
.btn.ghost-navy{border:1px solid var(--line);color:var(--navy);}
.btnrow{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;}

/* ---------- Cartes / grilles ---------- */
.cards{display:grid;gap:24px;}
.cards.c2{grid-template-columns:1fr 1fr;}
.cards.c3{grid-template-columns:repeat(3,1fr);}
.card{border:1px solid var(--line);border-radius:3px;background:#fff;padding:34px;}
.card h3{font-size:25px;color:var(--navy);margin-bottom:10px;}
.card p{font-size:17.5px;color:#33383e;margin:0;}
.card .ic{font-family:"Archivo",sans-serif;font-weight:700;font-size:13px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase;margin-bottom:14px;}
@media(max-width:880px){.cards.c2,.cards.c3{grid-template-columns:1fr;}}

/* ---------- Citation ---------- */
.quote{background:var(--bordeaux);color:#fbeedf;text-align:center;}
.quote blockquote{margin:0 auto;max-width:26ch;font-size:clamp(27px,4.2vw,46px);line-height:1.16;font-style:italic;}
.quote .who{font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.22em;text-transform:uppercase;margin-top:28px;opacity:.85;}

/* =====================================================================
   INFOGRAPHIES
   ===================================================================== */
.info{border:1px solid var(--line);border-radius:4px;background:#fff;padding:38px 34px;}
.info .info-h{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-bottom:8px;flex-wrap:wrap;}
.info .info-t{font-size:24px;color:var(--navy);}
.info .info-s{font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);}
.info .info-note{font-size:15.5px;color:var(--muted);margin-top:18px;font-style:italic;}
.info.dark{background:var(--navy-deep);border-color:rgba(255,255,255,.12);}
.info.dark .info-t{color:#fff;}
.info.dark .info-note{color:#9fb0c4;}

/* Chiffres clés */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:3px;overflow:hidden;background:#fff;}
.stat{padding:36px 24px;border-right:1px solid var(--line-soft);}
.stat:last-child{border-right:none;}
.stat .fig{font-size:54px;color:var(--bordeaux);line-height:1;letter-spacing:-.02em;font-family:"EB Garamond",serif;}
.stat .fig sup{font-size:22px;top:-1.1em;}
.stat .txt{font-size:15.5px;color:#41464d;margin-top:12px;line-height:1.45;}
.stat .src{font-family:"Archivo",sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#6c665b;margin-top:12px;}
@media(max-width:900px){.stats{grid-template-columns:1fr 1fr;}.stat:nth-child(2){border-right:none;}.stat:nth-child(-n+2){border-bottom:1px solid var(--line-soft);}}
@media(max-width:520px){.stats{grid-template-columns:1fr;}.stat{border-right:none;border-bottom:1px solid var(--line-soft);}}

/* Grille des 100 communes */
.commune-grid{display:grid;grid-template-columns:repeat(20,1fr);gap:4px;margin-top:6px;}
.commune-grid i{aspect-ratio:1;border-radius:1px;background:var(--bordeaux);opacity:0;animation:popIn .5s forwards;}
.commune-grid i.ok{background:var(--green);}
@keyframes popIn{to{opacity:1;}}
.legend{display:flex;gap:22px;margin-top:18px;flex-wrap:wrap;}
.legend span{font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.04em;color:#41464d;display:flex;align-items:center;gap:8px;}
.legend b{width:12px;height:12px;border-radius:2px;display:inline-block;}
@media(max-width:560px){.commune-grid{grid-template-columns:repeat(10,1fr);}}

/* Barres comparatives (tunnel des études) */
.bars{margin-top:10px;}
.bar-row{display:grid;grid-template-columns:170px 1fr;gap:18px;align-items:center;margin:16px 0;}
.bar-row .bl{font-family:"Archivo",sans-serif;font-size:13px;color:var(--navy);font-weight:600;text-align:right;letter-spacing:.02em;}
.bar-track{background:var(--line-soft);border-radius:3px;height:34px;position:relative;overflow:hidden;}
.bar-fill{height:100%;border-radius:3px;width:0;transition:width 1.3s cubic-bezier(.2,.7,.2,1);display:flex;align-items:center;justify-content:flex-end;padding-right:12px;color:#fff;font-family:"Archivo",sans-serif;font-size:13px;font-weight:600;}
.bar-fill.long{background:linear-gradient(90deg,#6c2b2e,var(--bordeaux));}
.bar-fill.short{background:linear-gradient(90deg,#2f6f5e,var(--green));}
@media(max-width:640px){.bar-row{grid-template-columns:1fr;gap:6px;}.bar-row .bl{text-align:left;}}

/* Frise / timeline */
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:14px;}
.tl{position:relative;padding:30px 22px 8px 0;border-top:3px solid var(--line);}
.tl.on{border-top-color:var(--bordeaux);}
.tl::before{content:"";position:absolute;top:-8px;left:0;width:13px;height:13px;border-radius:50%;background:var(--paper);border:3px solid var(--bordeaux);}
.tl .yr{font-family:"Archivo",sans-serif;font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--bordeaux);}
.tl h4{font-size:20px;color:var(--navy);margin:8px 0 6px;}
.tl p{font-size:15.5px;color:#3c4147;margin:0;}
@media(max-width:820px){.timeline{grid-template-columns:1fr;}.tl{border-top:none;border-left:3px solid var(--line);padding:4px 0 24px 24px;}.tl.on{border-left-color:var(--bordeaux);}.tl::before{top:2px;left:-8px;}}

/* Donut */
.donut-wrap{display:flex;align-items:center;gap:40px;flex-wrap:wrap;}
.donut{flex:0 0 auto;}
.donut text{font-family:"EB Garamond",serif;}
.donut-leg{flex:1;min-width:240px;}
.donut-leg p{font-size:18px;color:#34383e;margin:0 0 10px;}

/* Vidéo */
.videoframe{position:relative;padding-top:56.25%;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:#000;box-shadow:0 30px 60px -40px rgba(15,40,69,.6);}
.videoframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.videolink{display:flex;flex-direction:column;gap:6px;padding:40px 36px;border:1px solid var(--line);border-radius:4px;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-deep) 100%);color:var(--ivory);text-decoration:none;box-shadow:0 30px 60px -40px rgba(15,40,69,.6);transition:transform .15s;}
.videolink:hover{transform:translateY(-2px);}
.videolink .vl-k{font-family:"Archivo",sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);}
.videolink .vl-t{font-size:25px;color:#fff;line-height:1.15;max-width:32ch;}
.videolink .vl-c{font-family:"Archivo",sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#cdd5df;margin-top:10px;}

/* Compte à rebours */
.countdown{background:var(--navy-deep);color:var(--ivory);border-bottom:none;}
.countdown .wrap{padding:28px 32px;display:flex;align-items:center;justify-content:center;gap:30px;flex-wrap:wrap;text-align:center;}
.cd-label{font-family:"Archivo",sans-serif;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);}
.cd-grid{display:flex;gap:16px;}
.cd-box{min-width:72px;}
.cd-n{font-family:"EB Garamond",serif;font-size:46px;line-height:1;color:#fff;display:block;font-variant-numeric:tabular-nums;}
.cd-u{font-family:"Archivo",sans-serif;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#9fb0c4;}
.cd-date{font-style:italic;color:#cdd5df;font-size:17px;}
@media(max-width:600px){.cd-n{font-size:34px;}.cd-box{min-width:54px;}.countdown .wrap{gap:18px;}}

/* Lignes animées (graphiques) */
.draw{stroke-dasharray:1600;stroke-dashoffset:1600;transition:stroke-dashoffset 2s ease;}
.donut-arc{transition:stroke-dashoffset 1.6s ease;}
.fade-pt{opacity:0;transition:opacity .6s ease .9s;}
.info.in .fade-pt{opacity:1;}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease;}
.reveal.in{opacity:1;transform:none;}

/* ---------- Bouton de retour rapide en haut de page ---------- */
.totop{position:fixed;right:22px;bottom:22px;z-index:70;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--navy);color:#fff;font-size:20px;line-height:1;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s,transform .3s,visibility .3s;box-shadow:0 10px 24px -12px rgba(15,40,69,.55);}
.totop.show{opacity:.92;visibility:visible;transform:none;}
.totop:hover{opacity:1;}

/* Message temporaire (toast) — confirmation de copie d'adresse e-mail */
#df-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);z-index:300;max-width:min(92vw,560px);background:var(--navy-night);color:var(--ivory);border:1px solid var(--gold);border-radius:4px;padding:14px 20px;font-family:"Archivo",sans-serif;font-size:14px;line-height:1.45;text-align:center;box-shadow:0 18px 50px -20px rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;}
#df-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* Bandeau de consentement aux cookies */
#cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--navy-night);color:var(--ivory);border-top:2px solid var(--gold);box-shadow:0 -12px 40px -22px rgba(0,0,0,.6);}
#cookie-banner .cb-in{max-width:1180px;margin:0 auto;padding:18px 32px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;justify-content:space-between;}
#cookie-banner .cb-txt{font-size:15px;color:#cdd5df;margin:0;max-width:74ch;line-height:1.5;}
#cookie-banner .cb-txt a{color:var(--gold-soft);}
#cookie-banner .cb-btns{display:flex;gap:12px;flex-shrink:0;}
#cookie-banner button{font-family:"Archivo",sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:12px 24px;border-radius:2px;cursor:pointer;border:1px solid transparent;transition:transform .15s;}
#cookie-banner button:hover{transform:translateY(-1px);}
#cookie-banner .cb-accept{background:var(--gold);color:var(--navy-deep);}
#cookie-banner .cb-refuse{background:transparent;border-color:rgba(255,255,255,.4);color:#fff;}
@media(max-width:640px){#cookie-banner .cb-in{padding:16px 20px;gap:14px;}#cookie-banner .cb-btns{width:100%;}#cookie-banner button{flex:1;}}

/* ---------- Pied de page ---------- */
footer{background:var(--navy-night);color:#aab6c4;padding:58px 0 38px;border-bottom:none;}
footer .grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;}
footer .mark{font-family:"Archivo",sans-serif;font-weight:700;color:#fff;font-size:19px;letter-spacing:.02em;}
footer .tag{font-style:italic;color:var(--gold-soft);margin-top:8px;}
footer h5{font-family:"Archivo",sans-serif;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#b7c3d2;margin:0 0 13px;font-weight:600;}
footer a{color:#c7d0db;text-decoration:none;font-size:15.5px;display:block;margin-bottom:7px;}
footer a:hover{color:#fff;}
.legal{margin-top:42px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-size:13px;color:#7d8794;line-height:1.6;}
@media(max-width:880px){footer .grid{grid-template-columns:1fr 1fr;gap:26px;}}
@media(max-width:520px){footer .grid{grid-template-columns:1fr;}}
