/* COMBIEN - feuille de style unique.
   Papier mat, encre d'imprimerie, un seul rouge.
   Logotype et chiffres : Archivo. Titres : Newsreader. */

@font-face{font-family:Archivo;src:url(fonts/archivo-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-500-normal.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo-latin-800-normal.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-latin-500-normal.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-latin-600-normal.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-latin-400-italic.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}

:root{
  --papier:#F7F6F2;
  --panneau:#EEECE4;
  --encre:#111111;
  --encre-clair:#57554E;
  --filet:#CFCBC0;
  --rouge:#D32F2F;
  --colonne:33rem;
  --serif:Newsreader,"Times New Roman",Georgia,serif;
  --sans:Archivo,"Helvetica Neue",Arial,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--papier);color:var(--encre);
  font-family:var(--sans);font-size:17.5px;line-height:1.68;
  font-synthesis-weight:none;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}

a{color:var(--rouge);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--rouge);outline-offset:3px}
.saut{position:absolute;left:-9999px}
.saut:focus{position:fixed;left:1rem;top:.6rem;z-index:9;background:var(--encre);color:var(--papier);
  padding:.6rem .9rem;text-decoration:none;font-family:var(--sans);font-weight:600}

.wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem}
.colonne{max-width:var(--colonne);margin:0 auto}
.neg{color:var(--rouge)}

.etiquette{
  font-family:var(--sans);font-weight:600;font-size:.68rem;text-transform:uppercase;
  letter-spacing:.14em;color:var(--encre);margin:0;
}
.etiquette .sep{color:var(--filet);padding:0 .5em}

.masthead{border-bottom:1px solid var(--encre)}
.masthead-in{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;padding:1.3rem 0 1rem}
.wordmark{font-family:var(--sans);font-weight:800;font-size:2rem;line-height:.9;letter-spacing:-.045em;
  text-transform:uppercase;color:var(--encre);text-decoration:none;display:block}
.wordmark .q{color:var(--rouge);margin-left:.1em;letter-spacing:0}
.devise{font-family:var(--sans);font-size:.78rem;letter-spacing:.04em;color:var(--encre-clair);margin:.45rem 0 0}
.masthead nav{display:flex;gap:1.6rem;flex-wrap:wrap;padding-bottom:.2rem}
.masthead nav a{font-family:var(--sans);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;
  color:var(--encre);text-decoration:none;padding-bottom:.2rem;border-bottom:2px solid transparent}
.masthead nav a:hover{border-bottom-color:var(--rouge)}
.masthead nav a[aria-current]{border-bottom-color:var(--encre)}
.dateline{border-top:3px solid var(--encre);border-bottom:1px solid var(--encre);padding:.5rem 0}

.une{padding:2.6rem 0 0}
.une-grille{display:grid;grid-template-columns:1fr;gap:2.6rem}
@media (min-width:60rem){
  .une-grille{grid-template-columns:minmax(0,1.85fr) minmax(19rem,1fr);gap:0}
  .une-texte{padding-right:3rem;border-right:1px solid var(--filet)}
  .une-cote{padding-left:3rem}
}
h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.7rem,6.6vw,5.1rem);line-height:.98;
  letter-spacing:-.028em;margin:.6rem 0 1.1rem;max-width:16ch}
h1 a{color:var(--encre);text-decoration:none}
h1 a:hover{color:var(--rouge)}
.chapeau{font-family:var(--serif);font-weight:400;font-size:1.32rem;line-height:1.45;margin:0 0 1.8rem;max-width:42rem;color:var(--encre)}
.signature{font-family:var(--sans);font-weight:600;font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;
  color:var(--encre-clair);margin:0 0 1.8rem;padding-top:.9rem;border-top:1px solid var(--filet);max-width:20rem}

.choc{border-top:3px solid var(--encre);border-bottom:1px solid var(--encre);padding:1.1rem 0 1.2rem;margin:0 0 1.4rem}
.choc-valeur{display:block;font-family:var(--sans);font-weight:700;font-size:clamp(2.6rem,7.4vw,4.6rem);
  line-height:.95;letter-spacing:-.035em;font-variant-numeric:tabular-nums lining-nums}
.choc-legende{display:block;font-size:.85rem;color:var(--encre-clair);margin-top:.7rem;max-width:34rem}
.lire{font-family:var(--sans);font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;margin:0}
.lire a{text-decoration:none;border-bottom:2px solid var(--rouge);padding-bottom:.15rem}

.encart-abo{border:2px solid var(--encre);padding:1.5rem 1.4rem 1.4rem;background:var(--papier)}
.encart-abo .titre{font-family:var(--serif);font-weight:700;font-size:1.5rem;line-height:1.15;letter-spacing:-.015em;margin:.5rem 0 .7rem}
.encart-abo p{font-size:.92rem;margin:0 0 1.1rem;color:var(--encre)}
form.abo{margin:0}
form.abo label{display:block;font-family:var(--sans);font-weight:600;font-size:.66rem;text-transform:uppercase;letter-spacing:.13em;margin:0 0 .45rem}
input[type=email]{width:100%;font-family:var(--sans);font-size:1rem;padding:.85rem .9rem;
  border:2px solid var(--encre);border-radius:0;background:var(--papier);color:var(--encre)}
input[type=email]::placeholder{color:#8C897F}
button.cta{width:100%;margin-top:.6rem;font-family:var(--sans);font-weight:700;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.1em;padding:.95rem 1rem;cursor:pointer;
  background:var(--rouge);color:#fff;border:2px solid var(--rouge);border-radius:0}
button.cta:hover{background:var(--encre);border-color:var(--encre)}
button.cta.creux{background:transparent;color:var(--encre);border-color:var(--encre);margin-top:.5rem}
button.cta.creux:hover{background:var(--encre);color:var(--papier)}
.msg{font-family:var(--sans);font-size:.85rem;color:var(--rouge);margin:.7rem 0 0;min-height:1.1em}
.mention{font-family:var(--sans);font-size:.75rem;color:var(--encre-clair);margin:.6rem 0 0}

.fiche{margin:3.2rem 0;border-top:3px solid var(--encre);border-bottom:3px solid var(--encre)}
.fiche-tete{display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;padding:1rem 0 .9rem;border-bottom:1px solid var(--encre)}
.fiche-tete h2{font-family:var(--sans);font-weight:700;font-size:1.05rem;letter-spacing:.02em;margin:0;text-transform:uppercase}
.fiche-tete p{font-family:var(--sans);font-size:.78rem;color:var(--encre-clair);margin:.3rem 0 0}
table.compte{width:100%;border-collapse:collapse}
table.compte th,table.compte td{text-align:left;padding:.75rem 0;border-bottom:1px solid var(--filet)}
table.compte thead th{font-family:var(--sans);font-weight:600;font-size:.66rem;text-transform:uppercase;
  letter-spacing:.13em;color:var(--encre-clair);padding:.7rem 0 .5rem;border-bottom:1px solid var(--encre)}
table.compte td{font-family:var(--sans);font-size:.98rem}
table.compte th.v,table.compte td.v{text-align:right;font-variant-numeric:tabular-nums lining-nums;white-space:nowrap;padding-left:1.5rem}
table.compte tr.fort td{font-weight:700;font-size:1.3rem;letter-spacing:-.02em;border-bottom:2px solid var(--encre);padding:.9rem 0}
table.compte tr:last-child td{border-bottom:0}
.fiche-pied{font-family:var(--sans);font-size:.76rem;color:var(--encre-clair);margin:0;padding:.9rem 0 1rem;border-top:1px solid var(--filet)}

.format{max-width:46rem;margin:0 auto}
.format h1{max-width:none;font-size:clamp(2.5rem,5.6vw,4.2rem)}
.format .une{padding:2.4rem 0 0}
.format .fiche{margin:2.8rem 0 3.4rem}

article h2{font-family:var(--serif);font-weight:700;font-size:1.85rem;line-height:1.15;letter-spacing:-.018em;margin:3.2rem 0 1rem;max-width:22ch}
article p{margin:0 0 1.3rem}
article ul,article ol{margin:0 0 1.4rem;padding-left:1.3rem}
article li{margin:0 0 .7rem}
article strong{font-weight:700}

p.premier::first-letter{font-family:var(--serif);font-weight:700;float:left;font-size:4.1em;line-height:.78;padding:.06em .1em 0 0;color:var(--encre)}

p.exergue{font-family:var(--serif);font-weight:600;font-size:1.75rem;line-height:1.22;letter-spacing:-.015em;
  text-align:left;margin:2.8rem 0;padding:1.5rem 0;border-top:3px solid var(--encre);border-bottom:3px solid var(--encre)}

.doute{position:relative;overflow:hidden;background:var(--panneau);border-top:3px solid var(--encre);
  border-bottom:3px solid var(--encre);padding:1.7rem 1.5rem 1.5rem;margin:3.2rem 0}
.doute::before{content:"?";position:absolute;right:.4rem;top:-2.6rem;font-family:var(--sans);font-weight:800;
  font-size:11rem;line-height:1;color:var(--rouge);opacity:.12;pointer-events:none}
.doute h2{font-family:var(--sans);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;margin:0 0 1rem;max-width:none;position:relative}
.doute ul{list-style:none;margin:0;padding:0;position:relative}
.doute li{font-size:.95rem;line-height:1.6;padding:.7rem 0;border-top:1px solid var(--filet);margin:0}
.doute li:first-child{border-top:0;padding-top:0}

.sources{font-family:var(--sans);font-size:.8rem;line-height:1.6;color:var(--encre-clair);border-top:1px solid var(--encre);padding:1rem 0 0;margin:3rem 0 0}

.bande{background:var(--encre);color:var(--papier);padding:4.2rem 0;margin:4.5rem 0 0}
.bande a{color:var(--papier)}
.bande h2{font-family:var(--serif);font-weight:700;font-size:clamp(2rem,4.8vw,3.3rem);line-height:1.04;letter-spacing:-.025em;margin:0 0 2.4rem;max-width:20ch}
.regles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid rgba(247,246,242,.28)}
.regles li{padding:1.3rem 0;border-bottom:1px solid rgba(247,246,242,.28);font-size:.95rem;line-height:1.6}
@media (min-width:52rem){
  .regles{grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(247,246,242,.28)}
  .regles li{padding:1.4rem 1.6rem 1.6rem 0;border-bottom:0;border-right:1px solid rgba(247,246,242,.28)}
  .regles li:last-child{border-right:0;padding-right:0}
}
.bande .lire a{border-bottom-color:var(--papier)}

section.bloc{padding:3.6rem 0 0}
.rubrique{border-bottom:1px solid var(--encre);padding-bottom:.5rem;margin:0 0 1.8rem}
section.bloc > h2{font-family:var(--serif);font-weight:700;font-size:1.9rem;line-height:1.1;letter-spacing:-.02em;margin:0 0 1.4rem}

.aune{display:grid;grid-template-columns:1fr;gap:1.6rem;padding:2rem 0;border-top:1px solid var(--filet)}
@media (min-width:52rem){.aune{grid-template-columns:minmax(0,1.6fr) minmax(15rem,1fr);gap:3rem}}
.aune h3{font-family:var(--serif);font-weight:700;font-size:clamp(1.7rem,3.4vw,2.4rem);line-height:1.08;letter-spacing:-.022em;margin:.5rem 0 .8rem}
.aune h3 a{color:var(--encre);text-decoration:none}
.aune h3 a:hover{color:var(--rouge)}
.aune p{margin:0 0 1.1rem;max-width:38rem}
.chiffres{list-style:none;margin:0;padding:0;border-top:1px solid var(--encre)}
.chiffres li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--filet)}
.chiffres span{font-family:var(--sans);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--encre-clair)}
.chiffres b{font-family:var(--sans);font-weight:700;font-size:1.12rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}

ul.sommaire{list-style:none;margin:0;padding:0;border-top:1px solid var(--encre)}
ul.sommaire li{display:grid;grid-template-columns:3.2rem 1fr;gap:1rem;align-items:baseline;padding:1.1rem 0;border-bottom:1px solid var(--filet)}
ul.sommaire .st{font-family:var(--sans);font-weight:700;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--encre-clair)}
ul.sommaire .q2{font-family:var(--serif);font-size:1.22rem;line-height:1.3;max-width:40rem}

footer.bas{margin:4.5rem 0 0;border-top:3px solid var(--encre);padding:1.6rem 0 3.5rem}
footer.bas nav{display:flex;gap:1.5rem;flex-wrap:wrap;margin:0 0 1.2rem}
footer.bas nav a{font-family:var(--sans);font-weight:600;font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;
  color:var(--encre);text-decoration:none;border-bottom:1px solid var(--filet);padding-bottom:.15rem}
footer.bas nav a:hover{border-bottom-color:var(--rouge)}
footer.bas p{font-family:var(--sans);font-size:.78rem;line-height:1.65;color:var(--encre-clair);margin:0 0 .7rem;max-width:56rem}

.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:1.1rem;margin:1.8rem 0}
.grille label{display:block;font-family:var(--sans);font-weight:600;font-size:.66rem;text-transform:uppercase;letter-spacing:.13em;margin:0 0 .4rem}
.grille input{width:100%;font-family:var(--sans);font-size:.95rem;padding:.6rem .7rem;border:2px solid var(--encre);border-radius:0;background:var(--papier);color:var(--encre)}
.boutons{display:flex;gap:.8rem;flex-wrap:wrap}
.boutons button.cta{width:auto;margin-top:0;padding:.85rem 1.6rem}
#canvasFiche{display:block;margin:1.8rem 0 0;max-width:min(100%,22rem);height:auto;border:1px solid var(--encre)}

.page-titre{padding:3rem 0 2.4rem;border-bottom:3px solid var(--encre);margin:0 0 2.6rem}
.page-titre h1{margin:.5rem 0 0;max-width:20ch}
.texte h2{font-family:var(--serif);font-weight:700;font-size:1.5rem;line-height:1.2;margin:2.6rem 0 .9rem}
.texte p{margin:0 0 1.2rem}
.texte ol{padding-left:1.4rem}
.texte li{margin:0 0 1rem}
.inverse{background:var(--encre);color:var(--papier);padding:3.4rem 0;margin:3rem 0}
.inverse a{color:var(--papier)}
.inverse h2{font-family:var(--serif);font-weight:700;font-size:2rem;margin:0 0 1.6rem;letter-spacing:-.02em}
.inverse ol{padding-left:1.4rem;max-width:46rem;margin:0}
.inverse li{margin:0 0 1.1rem;line-height:1.6}
