/*
Theme Name: Refondation TV
Theme URI: https://refondation.cd
Author: Direction de Refondation TV
Description: Theme du site refondation.cd. Palette Bleu Congo et Or Kasai, titrage Oswald, corps Inter, chiffres Roboto Mono. Six pages, aucune dependance externe.
Version: 1.3.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: Proprietaire - usage reserve a Refondation TV
Text Domain: refondation
*/

@import url("assets/fonts/fonts.css");

/* La signature de la chaine : tous les chiffres en Roboto Mono, y compris
   dans le texte courant. Obtenu par une famille restreinte aux glyphes
   numeriques, placee en tete de chaque pile typographique. */
@font-face{font-family:'RFD Chiffres';font-style:normal;font-weight:400;font-display:swap;
  src:url(assets/fonts/roboto-mono-400-latin.woff2) format('woff2');
  unicode-range:U+0030-0039,U+0025,U+2030,U+00B0;}
@font-face{font-family:'RFD Chiffres';font-style:normal;font-weight:500;font-display:swap;
  src:url(assets/fonts/roboto-mono-500-latin.woff2) format('woff2');
  unicode-range:U+0030-0039,U+0025,U+2030,U+00B0;}
@font-face{font-family:'RFD Chiffres';font-style:normal;font-weight:700;font-display:swap;
  src:url(assets/fonts/roboto-mono-500-latin.woff2) format('woff2');
  unicode-range:U+0030-0039,U+0025,U+2030,U+00B0;}

:root{
  --bleu:#001E54;
  --bleu-clair:#0A3A7A;
  --accent:#D51823;
  --jaune:#FBD500;
  --cuivre:#D51823;
  --craie:#F4F1EA;
  --craie-fonce:#E4DFD3;
  --graphite:#1A1A1A;
  --titre:'RFD Chiffres','Oswald','Archivo Narrow','Helvetica Neue',Arial,sans-serif;
  --corps:'RFD Chiffres','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --mono:'Roboto Mono','SFMono-Regular',Menlo,Consolas,monospace;
  --lg:1180px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--craie);color:var(--graphite);
  font-family:var(--corps);font-size:17px;line-height:1.65;
  font-weight:400;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}

.wrap{width:100%;max-width:var(--lg);margin:0 auto;padding:0 24px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.skip{position:absolute;left:-9999px;}
.skip:focus{left:16px;top:16px;z-index:100;background:var(--accent);color:#fff;padding:10px 16px;}

h1,h2,h3,h4{font-family:var(--titre);font-weight:600;letter-spacing:.005em;margin:0 0 .5em;line-height:1.08;text-transform:uppercase;}
h1{font-size:clamp(2.2rem,5.4vw,4rem);letter-spacing:-.005em;}
h2{font-size:clamp(1.5rem,3vw,2.2rem);}
h3{font-size:clamp(1.1rem,2vw,1.35rem);}
p{margin:0 0 1.1em;}
strong{font-weight:600;}
ul{padding-left:1.15em;}
li{margin-bottom:.5em;}

.surtitre{font-family:var(--titre);text-transform:uppercase;letter-spacing:.14em;
  font-size:.78rem;font-weight:600;color:var(--cuivre);margin:0 0 .9em;}
.surtitre--clair{color:var(--craie);opacity:.7;}
.mono{font-family:var(--mono);font-size:.92em;letter-spacing:.01em;}

/* ---------- filet Or Kasai : l'accent, jamais un aplat ---------- */
.filet{width:72px;height:3px;background:var(--accent);border:0;margin:0 0 26px;}
.filet--centre{margin-left:auto;margin-right:auto;}

/* ---------- entete ---------- */
.entete{background:var(--bleu);color:var(--craie);position:sticky;top:0;z-index:50;
  border-bottom:1px solid rgba(244,241,234,.14);}
.entete .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:74px;}
.marque{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--craie);}
.marque__logo{height:44px;width:auto;display:block;flex-shrink:0;}
@media(max-width:520px){.marque__logo{height:36px;}}
.marque__nom{font-family:var(--titre);font-weight:600;font-size:1.18rem;letter-spacing:.05em;text-transform:uppercase;}
.marque__img{height:38px;width:auto;}

.nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;}
.nav li{margin:0;}
.nav a{font-family:var(--titre);text-transform:uppercase;letter-spacing:.08em;font-size:.86rem;
  font-weight:500;text-decoration:none;color:var(--craie);opacity:.86;padding:6px 0;
  border-bottom:2px solid transparent;display:block;}
.nav a:hover,.nav a:focus{opacity:1;border-bottom-color:var(--accent);}
.nav .current-menu-item>a,.nav .current_page_item>a{opacity:1;border-bottom-color:var(--accent);}

.burger{display:none;background:none;border:1px solid rgba(244,241,234,.4);color:var(--craie);
  font-family:var(--titre);text-transform:uppercase;letter-spacing:.1em;font-size:.78rem;
  padding:9px 13px;cursor:pointer;}
@media(max-width:860px){
  .burger{display:block;}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bleu);
    border-bottom:3px solid var(--accent);padding:8px 0 20px;}
  .nav.ouvert{display:block;}
  .nav ul{flex-direction:column;gap:0;}
  .nav a{padding:14px 24px;border-bottom:1px solid rgba(244,241,234,.1);}
  .entete .wrap{position:relative;}
}

/* ---------- sections ---------- */
.sect{padding:76px 0;}
.sect--serre{padding:56px 0;}
.sect--bleu{background:var(--bleu);color:var(--craie);}
.sect--craie{background:var(--craie);}
.sect--blanc{background:#FBFAF7;}
.sect--bleu a{color:var(--craie);}

/* ---------- ouverture ---------- */
.ouverture{background:var(--bleu);color:var(--craie);padding:104px 0 88px;position:relative;overflow:hidden;}
.ouverture::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--accent);}
.ouverture__sigle{font-family:var(--titre);letter-spacing:.28em;font-size:.82rem;font-weight:500;
  text-transform:uppercase;color:var(--craie);opacity:.7;margin:0 0 22px;}
.ouverture h1{font-size:clamp(2.4rem,7vw,5.2rem);margin-bottom:26px;max-width:16ch;}
.ouverture__signature{font-family:var(--titre);text-transform:uppercase;letter-spacing:.13em;
  font-size:clamp(.86rem,1.7vw,1rem);font-weight:500;color:var(--craie);opacity:.9;margin:0 0 34px;}
.ouverture__chapeau{font-size:clamp(1.05rem,2vw,1.28rem);line-height:1.6;max-width:62ch;
  color:var(--craie);opacity:.94;margin:0;}

/* ---------- bloc d'echelle ---------- */
.echelle{background:var(--bleu);color:var(--craie);padding:0 0 84px;}
.echelle__cadre{border-top:1px solid rgba(244,241,234,.18);padding-top:52px;}
.echelle__titre{font-family:var(--titre);font-weight:600;text-transform:uppercase;
  font-size:clamp(1.5rem,4vw,3rem);line-height:1.1;margin:0 0 22px;max-width:22ch;}
.echelle__titre em{font-style:normal;color:var(--craie);}
.echelle__sous{font-size:1.02rem;opacity:.86;max-width:56ch;margin:0;}
.echelle__filet{width:120px;height:3px;background:var(--accent);border:0;margin:26px 0 0;}

/* ---------- piliers ---------- */
.piliers{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:1px;
  background:var(--craie-fonce);border:1px solid var(--craie-fonce);}
.pilier{background:var(--craie);padding:34px 30px 36px;}
.pilier__num{font-family:var(--mono);font-size:.8rem;color:var(--cuivre);letter-spacing:.08em;margin:0 0 14px;}
.pilier h3{margin:0 0 14px;font-size:1.22rem;letter-spacing:.02em;}
.pilier__filet{width:38px;height:2px;background:var(--accent);border:0;margin:0 0 16px;}
.pilier p{margin:0;font-size:.97rem;line-height:1.62;}

/* ---------- principes ---------- */
.principes{list-style:none;margin:0;padding:0;counter-reset:p;}
.principes li{counter-increment:p;margin:0;padding:30px 0 30px 76px;position:relative;
  border-top:1px solid var(--craie-fonce);}
.principes li:last-child{border-bottom:1px solid var(--craie-fonce);}
.principes li::before{content:counter(p,decimal-leading-zero);position:absolute;left:0;top:30px;
  font-family:var(--mono);font-size:1.5rem;color:var(--accent);line-height:1;}
.principes h3{margin:0 0 10px;font-size:1.1rem;}
.principes p{margin:0;font-size:.98rem;}

/* ---------- programmes ---------- */
.bloc-pilier{margin-bottom:56px;}
.bloc-pilier__tete{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  border-bottom:2px solid var(--bleu);padding-bottom:12px;margin-bottom:8px;}
.bloc-pilier__tete h2{margin:0;font-size:clamp(1.2rem,2.4vw,1.7rem);}
.bloc-pilier__part{font-family:var(--mono);font-size:.82rem;color:var(--cuivre);letter-spacing:.06em;}
.prog{display:grid;grid-template-columns:minmax(0,1fr);border-bottom:1px solid var(--craie-fonce);padding:24px 0;}
@media(min-width:760px){.prog{grid-template-columns:280px minmax(0,1fr);gap:36px;align-items:start;}}
.prog__titre{font-family:var(--titre);text-transform:uppercase;font-weight:600;font-size:1.12rem;
  letter-spacing:.03em;margin:0 0 6px;}
.prog__rythme{font-family:var(--mono);font-size:.78rem;color:var(--cuivre);letter-spacing:.07em;
  text-transform:uppercase;margin:0;}
.prog__texte{margin:0;font-size:1rem;}
@media(max-width:759px){.prog__texte{margin-top:12px;}}

/* ---------- contact ---------- */
.cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px;}
.carte{background:#FBFAF7;border:1px solid var(--craie-fonce);border-top:3px solid var(--accent);padding:30px 28px;}
.carte h3{font-size:1.02rem;margin:0 0 12px;}
.carte p{margin:0 0 .6em;font-size:.97rem;}
.carte a{color:var(--bleu);text-decoration:underline;text-underline-offset:3px;}
.carte a:hover{color:var(--cuivre);}
.adresse{font-style:normal;font-size:1.05rem;line-height:1.75;}

/* ---------- pages de texte ---------- */
.texte{max-width:76ch;}
.texte h2{margin-top:2.2em;font-size:clamp(1.15rem,2.2vw,1.5rem);}
.texte h2:first-child{margin-top:0;}
.texte h3{margin-top:1.8em;font-size:1.02rem;}
.texte table{width:100%;border-collapse:collapse;margin:0 0 1.6em;font-size:.95rem;}
.texte th,.texte td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--craie-fonce);vertical-align:top;}
.texte th{font-family:var(--titre);text-transform:uppercase;letter-spacing:.07em;font-size:.78rem;
  font-weight:600;color:var(--bleu);width:40%;}
.texte a{color:var(--bleu);text-decoration:underline;text-underline-offset:3px;}
.encadre{background:#FBFAF7;border-left:3px solid var(--accent);padding:20px 24px;margin:0 0 1.6em;font-size:.97rem;}
.maj{font-family:var(--mono);font-size:.82rem;color:var(--cuivre);letter-spacing:.05em;margin:0 0 2.2em;}

/* ---------- bandeau de bas de page ---------- */
.rappel{background:var(--bleu);color:var(--craie);padding:64px 0;text-align:center;}
.rappel h2{margin:0 0 18px;font-size:clamp(1.3rem,3vw,2rem);}
.rappel p{margin:0;opacity:.88;}

.pied{background:var(--graphite);color:var(--craie);padding:56px 0 30px;font-size:.92rem;}
.pied__grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:36px;
  padding-bottom:34px;border-bottom:1px solid rgba(244,241,234,.16);}
.pied h4{font-family:var(--titre);text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;
  font-weight:600;color:var(--craie);opacity:.58;margin:0 0 14px;}
.pied ul{list-style:none;margin:0;padding:0;}
.pied li{margin:0 0 9px;}
.pied a{color:var(--craie);text-decoration:none;opacity:.84;}
.pied a:hover{opacity:1;text-decoration:underline;text-underline-offset:3px;}
.pied__bas{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;
  font-size:.84rem;opacity:.72;}
.pied__signature{font-family:var(--titre);text-transform:uppercase;letter-spacing:.1em;}

/* ---------- bandeau de consentement ---------- */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--bleu);
  color:var(--craie);border-top:3px solid var(--accent);padding:22px 0;
  box-shadow:0 -8px 30px rgba(0,0,0,.22);}
.consent[hidden]{display:none !important;}
.consent__in{display:flex;gap:26px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.consent p{margin:0;font-size:.93rem;max-width:70ch;line-height:1.55;}
.consent a{color:var(--craie);text-underline-offset:3px;}
.consent__btns{display:flex;gap:12px;flex-shrink:0;}
.btn{font-family:var(--titre);text-transform:uppercase;letter-spacing:.09em;font-size:.82rem;
  font-weight:600;padding:12px 22px;border:2px solid var(--accent);background:transparent;
  color:var(--craie);cursor:pointer;white-space:nowrap;}
.btn--plein{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn:hover{opacity:.88;}
@media(max-width:640px){.consent__btns{width:100%;}.btn{flex:1;}}

@media print{.entete,.consent,.pied{display:none;}body{background:#fff;}}
