/* ============================================================================
   The Peer Review Quarterly ,  « La Vitrine de Quincaillerie », version entraide
   Préfixe : qc-
   Polices : Open Sans 700 (titres) + Crimson Text 400 (texte) ,  2 fichiers woff2
   Palette : kraft / calcaire, vert atelier, rouille de référence, laiton
   ============================================================================ */
@font-face{
  font-family:'OpenSansQC';
  src:url('/open-sans-latin-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'CrimsonQC';
  src:url('/crimson-text-v11-latin-regular.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}

:root{
  --qc-kraft:#E8E0D2;
  --qc-calcaire:#F6F1E7;
  --qc-encre:#241F1A;
  --qc-encre-douce:#5C544A;
  --qc-vert:#1F4D3D;
  --qc-vert-clair:#2C6B54;
  --qc-sauge:#A8C0B0;
  --qc-rouille:#A83224;
  --qc-laiton:#C9971B;
  --qc-ardoise:#2F3B37;
  --qc-filet:rgba(31,77,61,.22);
  --qc-titre:'OpenSansQC','Segoe UI',system-ui,sans-serif;
  --qc-texte:'CrimsonQC','Iowan Old Style',Georgia,serif;
  --qc-travee:78rem;
  --qc-mesure:68ch;
  --qc-arrondi:16px;
  --qc-arrondi-s:12px;
  --qc-ombre-1:0 6px 18px -6px rgba(31,77,61,.28);
  --qc-ombre-2:0 14px 32px -12px rgba(36,31,26,.30);
  --qc-ombre-3:0 4px 14px -4px rgba(168,50,36,.24);
  --qc-ombre-4:0 24px 48px -20px rgba(31,77,61,.35);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--qc-kraft);
  color:var(--qc-encre);
  font-family:var(--qc-texte);
  font-size:clamp(1.0625rem,.98rem + .28vw,1.1875rem);
  line-height:1.65;
  overflow-x:hidden;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--qc-rouille);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--qc-titre);font-weight:700;line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,1.2rem + 3vw,3rem);letter-spacing:.01em}
h2{font-size:clamp(1.25rem,.95rem + 1.2vw,1.7rem);letter-spacing:.02em}
h3{font-size:clamp(1.05rem,.95rem + .6vw,1.3rem)}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--qc-laiton);outline-offset:3px;border-radius:6px}

/* ------------------------------------------------------------------ LAYOUT */
.qc-travee{
  width:100%;
  max-width:var(--qc-travee);
  margin-inline:auto;
  padding-inline:clamp(1rem,4vw,3rem);
  min-width:0;
}
.qc-acces-direct{
  position:absolute;left:-9999px;
  background:var(--qc-vert);color:var(--qc-kraft);
  padding:.75rem 1rem;border-radius:0 0 var(--qc-arrondi-s) 0;z-index:20;
}
.qc-acces-direct:focus{left:0;top:0}

/* ----------------------------------------------------------------- FRONTON */
.qc-fronton{background:var(--qc-calcaire);border-bottom:1px solid var(--qc-filet);box-shadow:var(--qc-ombre-1)}
.qc-fronton__barre{height:6px;background:linear-gradient(90deg,var(--qc-vert) 0 55%,var(--qc-rouille) 55% 70%,var(--qc-laiton) 70% 100%)}
.qc-fronton__interieur{
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem;
  padding-block:1rem;min-width:0;
}
.qc-enseigne{display:flex;align-items:center;gap:.25rem;color:var(--qc-vert);font-family:var(--qc-titre);font-weight:700;text-decoration:none;min-width:0}
.qc-enseigne__nom{font-size:1.15rem;letter-spacing:.04em;text-transform:uppercase}
.qc-embleme{
  flex:0 0 auto;width:40px;height:40px;border-radius:12px;
  box-shadow:var(--qc-ombre-1);
}
.qc-devise{
  margin:0;font-family:var(--qc-titre);font-weight:700;
  font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--qc-encre-douce);
}
.qc-parcours{margin-inline-start:auto;min-width:0}
.qc-parcours ul{display:flex;flex-wrap:wrap;gap:.35rem .5rem;list-style:none;margin:0;padding:0;min-width:0}
.qc-parcours__lien{
  display:inline-block;padding:.4rem .8rem;border-radius:999px;
  background:rgba(31,77,61,.06);
  color:var(--qc-vert);font-family:var(--qc-titre);font-weight:700;
  font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
}
.qc-parcours__lien:hover{background:var(--qc-vert);color:var(--qc-calcaire);text-decoration:none}
.qc-parcours__lien[aria-current="page"]{background:var(--qc-vert);color:var(--qc-calcaire)}

/* ------------------------------------------------------------------ PREAMBULE */
.qc-preambule{padding-block:clamp(2rem,5vw,3.5rem) clamp(1.5rem,3vw,2.25rem);min-width:0}
.qc-preambule p{max-width:var(--qc-mesure);color:var(--qc-encre-douce);font-size:1.06rem}
.qc-preambule--planche{background:linear-gradient(180deg,rgba(31,77,61,.06),transparent 90%);border-radius:var(--qc-arrondi);padding-inline:clamp(1rem,2vw,1.5rem)}

/* --------------------------------------------------------------------- BILAN */
.qc-bilan{
  list-style:none;margin:1.5rem 0 0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));
  gap:.9rem;min-width:0;
}
.qc-bilan__poste{
  background:var(--qc-calcaire);border-radius:var(--qc-arrondi-s);
  padding:.9rem 1.1rem;box-shadow:var(--qc-ombre-1);min-width:0;
}
.qc-bilan__chiffre{
  display:block;font-family:var(--qc-titre);font-weight:700;color:var(--qc-rouille);
  font-size:1.35rem;line-height:1.1;
}
.qc-bilan__libelle{
  display:block;font-family:var(--qc-titre);font-weight:700;font-size:.72rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--qc-encre-douce);
}

/* --------------------------------------------------------------------- RAYON */
.qc-rayon{padding-block:clamp(1.5rem,3.2vw,2.75rem);min-width:0}
.qc-rayon__tete{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1rem;
  border-top:3px double var(--qc-vert);border-bottom:1px solid var(--qc-vert);
  padding:.7rem 0 .9rem;margin-bottom:1.5rem;min-width:0;
}
.qc-rayon__tete h2{margin:0}
.qc-rayon__tete h2 a{color:var(--qc-vert)}
.qc-rayon__phrase{margin:0;flex:1 1 16rem;min-width:0;font-size:.95rem;color:var(--qc-encre-douce)}
.qc-rayon__decompte{margin-inline-start:auto;font-family:var(--qc-titre);font-weight:700;font-size:.75rem;letter-spacing:.08em;color:var(--qc-encre-douce)}

/* -----------------------------------------------------------------PLANCHE TITRE */
.qc-planche__titre{
  font-family:var(--qc-titre);font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;font-size:1.2rem;margin:0;
}
.qc-planche__titre a{color:var(--qc-vert)}
.qc-planche__usage{margin:.4rem 0 0;font-style:italic;color:var(--qc-encre-douce);font-size:.95rem;flex-basis:100%}
.qc-planche__entete{min-width:0}

/* ---------------------------------------------------- VEDETTE (grande photo) */
.qc-vedette{
  background:var(--qc-vert);
  border-radius:var(--qc-arrondi);
  padding:clamp(1rem,2.5vw,2rem);
  box-shadow:var(--qc-ombre-4);
  min-width:0;
}
.qc-vedette .qc-rayon__tete{border-top-color:var(--qc-kraft);border-bottom-color:rgba(232,224,210,.35)}
.qc-vedette .qc-rayon__tete h2{color:var(--qc-kraft)}
.qc-vedette .qc-rayon__decompte{color:var(--qc-kraft)}
.qc-vedette__lien{display:block;min-width:0}
.qc-vedette__vignette{
  margin:0;width:100%;max-width:100%;aspect-ratio:16/9;overflow:hidden;
  border-radius:var(--qc-arrondi);
  box-shadow:var(--qc-ombre-2);
}
.qc-vedette__vignette img{width:100%;height:100%;object-fit:cover;display:block}
.qc-vedette__texte{padding-top:1.25rem;min-width:0}
.qc-vedette__texte .qc-entree__cote{--qc-encre-local:var(--qc-kraft)}
.qc-vedette__texte .qc-cote{color:var(--qc-laiton);border-color:rgba(201,151,27,.45)}
.qc-vedette__texte .qc-mention{background:var(--qc-kraft);color:var(--qc-vert)}
.qc-vedette__intitule{
  font-size:clamp(1.5rem,1.1rem + 2vw,2.4rem);
  margin:.35rem 0 .6rem;
  text-shadow:0 2px 8px rgba(0,0,0,.28);
}
.qc-vedette__intitule a{color:var(--qc-kraft);text-decoration:none}
.qc-vedette__intitule a:hover{text-decoration:underline}
.qc-vedette__abrege{color:rgba(246,241,231,.92);max-width:var(--qc-mesure);font-size:1.05rem}
.qc-vedette__legende{
  color:rgba(246,241,231,.78);font-size:.85rem;font-style:italic;
  text-shadow:0 1px 4px rgba(0,0,0,.35);margin-bottom:.5rem;
}
.qc-vedette .qc-entree__datation{color:rgba(246,241,231,.85);font-family:var(--qc-titre);font-weight:700;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}

/* ---------------------------------------------------------------- CASIER GRID */
.qc-casier{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr));
  gap:clamp(1rem,2vw,1.75rem);
  min-width:0;
}
.qc-casier--serre{grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr))}

/* -------------------------------------------------------------------- ENTRÉE */
.qc-entree{
  display:flex;flex-direction:column;min-width:0;
  background:var(--qc-calcaire);
  border-radius:var(--qc-arrondi);
  overflow:hidden;
  box-shadow:var(--qc-ombre-1);
  transition:box-shadow .2s ease,transform .2s ease;
}
.qc-entree:hover{box-shadow:var(--qc-ombre-2);transform:translateY(-3px)}
.qc-entree__vignette{
  margin:0;width:100%;max-width:100%;aspect-ratio:1/1;
  overflow:hidden;background:var(--qc-sauge);flex:0 0 auto;
}
.qc-entree__vignette img{width:100%;height:100%;object-fit:cover;display:block}
.qc-entree__texte{padding:1rem 1.15rem 1.25rem;display:flex;flex-direction:column;min-width:0;flex:1 1 auto}
.qc-entree__cote{
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;
  margin:0 0 .5rem;font-family:var(--qc-titre);font-size:.75rem;min-width:0;
}
.qc-cote{
  color:var(--qc-rouille);font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;
}
.qc-mention{
  display:inline-block;padding:.15rem .6rem;border-radius:999px;
  background:rgba(31,77,61,.1);color:var(--qc-vert);
  font-family:var(--qc-titre);font-weight:700;font-size:.7rem;
  letter-spacing:.06em;text-transform:uppercase;
}
.qc-mention:hover{background:var(--qc-vert);color:var(--qc-calcaire);text-decoration:none}
.qc-entree__intitule{margin:.1rem 0 .5rem;font-size:1.12rem}
.qc-entree__intitule a{color:var(--qc-encre)}
.qc-entree__intitule a:hover{color:var(--qc-vert)}
.qc-entree__abrege{color:var(--qc-encre-douce);font-size:.98rem;margin:0 0 .65rem}
.qc-entree__devise{
  margin:auto 0 .55rem;
  border-left:3px solid var(--qc-sauge);
  padding-left:.7rem;font-style:italic;font-size:.88rem;color:var(--qc-encre-douce);
}
.qc-devise-mot{color:var(--qc-rouille);font-style:normal;font-weight:700;font-family:var(--qc-titre)}
.qc-entree__datation{margin:0;font-family:var(--qc-titre);font-weight:700;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--qc-encre-douce)}

/* Variante ligne (rail) */
.qc-entree--ligne{flex-direction:row;align-items:stretch}
.qc-entree--ligne .qc-entree__vignette{
  flex:0 0 clamp(6rem,22vw,9.5rem);width:clamp(6rem,22vw,9.5rem);
  max-width:45%;aspect-ratio:4/3;border-radius:0;
}
.qc-entree--ligne .qc-entree__intitule{font-size:1.02rem}
.qc-entree--ligne .qc-entree__devise{border-left-width:0;padding-left:0;font-size:.85rem}
.qc-entree--petite .qc-entree__abrege{display:none}

/* -----------------------------------------------------------------REGISTRE */
.qc-registre{
  display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,26rem),1fr));
  min-width:0;
}

/* --------------------------------------------------------------------- DUO */
.qc-duo{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(1.25rem,3vw,2.5rem);
  min-width:0;padding-block:clamp(1.5rem,3vw,2.5rem);
}
@media (min-width:64rem){
  .qc-duo{grid-template-columns:minmax(0,1fr) minmax(0,17rem)}
  .qc-releve{position:sticky;top:1.25rem;align-self:start}
}

/* ------------------------------------------------------------- FICHE / CORPS */
.qc-fiche{min-width:0}
.qc-entete-fiche{padding-block:clamp(1.25rem,3vw,2rem) 1rem;min-width:0}
.qc-entete-fiche h1{max-width:22ch;text-shadow:0 2px 10px rgba(36,31,26,.10)}
.qc-chapeau{
  max-width:var(--qc-mesure);font-size:1.1rem;color:var(--qc-encre-douce);
  border-left:3px solid var(--qc-laiton);padding-left:.9rem;
}
.qc-datation{margin:0;font-family:var(--qc-titre);font-weight:700;font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;color:var(--qc-encre-douce)}
.qc-planche-image{
  margin:0;width:100%;max-width:100%;min-width:0;
}
.qc-planche-image img{
  width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  border-radius:var(--qc-arrondi);box-shadow:var(--qc-ombre-2);
}
.qc-planche-image figcaption{
  margin-top:.6rem;font-size:.86rem;color:var(--qc-encre-douce);font-style:italic;max-width:var(--qc-mesure);
}

.qc-corps{max-width:var(--qc-mesure);min-width:0}
.qc-corps h2{margin-top:2rem;border-top:3px double var(--qc-vert);padding-top:.8rem;color:var(--qc-vert)}
.qc-corps h3{margin-top:1.5rem}
.qc-corps p{margin:0 0 1.05em}
.qc-corps ul,.qc-corps ol{padding-left:1.25rem;margin:0 0 1.1em}
.qc-corps li{margin-bottom:.4em}
.qc-corps blockquote{
  margin:1.3rem 0;padding:.9rem 1.1rem;
  background:rgba(168,192,176,.28);border-radius:var(--qc-arrondi-s);
  border-left:4px solid var(--qc-vert);font-style:italic;
}
.qc-corps img{border-radius:var(--qc-arrondi-s);margin:1rem 0}
.qc-corps a{border-bottom:1px solid currentColor}
.qc-corps table{border-collapse:collapse;width:100%;min-width:0}
.qc-tableau-defilant{overflow-x:auto;margin:1.25rem 0;border-radius:var(--qc-arrondi-s);box-shadow:var(--qc-ombre-1);min-width:0}

/* ------------------------------------------------------------------- RELEVE */
.qc-releve{min-width:0}
.qc-releve h2{
  font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--qc-encre-douce);margin:1.4rem 0 .5rem;
}
.qc-releve__fiche{
  margin:0;background:var(--qc-calcaire);border-radius:var(--qc-arrondi-s);
  padding:1rem 1.1rem;box-shadow:var(--qc-ombre-1);
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:.35rem 1rem;min-width:0;
}
.qc-releve__fiche dt{
  font-family:var(--qc-titre);font-weight:700;font-size:.7rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--qc-encre-douce);padding-top:.2rem;
}
.qc-releve__fiche dd{margin:0;font-size:.92rem;min-width:0}
.qc-releve__sommaire,.qc-releve__sources{list-style:none;margin:0;padding:0;font-size:.9rem}
.qc-releve__sommaire li,.qc-releve__sources li{padding:.3rem 0;border-bottom:1px solid var(--qc-filet);min-width:0}
.qc-releve__sommaire li:last-child,.qc-releve__sources li:last-child{border-bottom:0}

/* ------------------------------------------------------------ FICHE D'USAGE */
.qc-fiche-usage{
  margin-top:1.5rem;background:var(--qc-ardoise);color:var(--qc-kraft);
  border-radius:var(--qc-arrondi);padding:1.1rem 1.2rem;
  box-shadow:var(--qc-ombre-2);min-width:0;
}
.qc-fiche-usage__titre{
  margin:0 0 .5rem;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--qc-laiton);
}
.qc-fiche-usage p{margin:.35rem 0;font-size:.9rem}
.qc-fiche-usage__limite{color:rgba(232,224,210,.72);font-size:.8rem;font-style:italic}

/* ------------------------------------------------------------- ONGLETS / NAV */
.qc-onglets{
  display:flex;flex-wrap:wrap;gap:.5rem;
  padding-block:.5rem 1.25rem;min-width:0;
}
.qc-onglet{
  display:inline-block;padding:.45rem .95rem;border-radius:999px;
  background:var(--qc-calcaire);color:var(--qc-vert);
  border:1px solid var(--qc-filet);
  font-family:var(--qc-titre);font-weight:700;font-size:.78rem;
  letter-spacing:.06em;text-transform:uppercase;
}
.qc-onglet:hover{background:var(--qc-vert);color:var(--qc-calcaire);text-decoration:none}
.qc-onglet--courant{background:var(--qc-vert);color:var(--qc-calcaire);box-shadow:var(--qc-ombre-3)}

/* ---------------------------------------------------------------- REMONTÉE */
.qc-remontee{padding-top:1.25rem;min-width:0}
.qc-remontee ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem .6rem;font-size:.82rem;font-family:var(--qc-titre);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.qc-remontee li+li::before{content:"/";color:var(--qc-encre-douce);margin-right:.5rem}
.qc-remontee a{color:var(--qc-encre-douce)}
.qc-remontee [aria-current="page"]{color:var(--qc-vert)}

/* ------------------------------------------------------------------ RENVOI */
.qc-entree__renvoi{margin-top:1rem;text-align:end}
.qc-renvoi{font-family:var(--qc-titre);font-weight:700;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}

/* ------------------------------------------------------------------ AILLEURS */
.qc-ailleurs{
  background:var(--qc-ardoise);color:var(--qc-kraft);
  border-radius:var(--qc-arrondi);padding:clamp(1.25rem,3vw,2rem);
  box-shadow:var(--qc-ombre-4);margin-block:2rem;min-width:0;
}
.qc-ailleurs .qc-rayon__tete{border-top-color:var(--qc-kraft);border-bottom-color:rgba(232,224,210,.3)}
.qc-ailleurs .qc-rayon__tete h2{color:var(--qc-kraft)}
.qc-ailleurs .qc-rayon__phrase{color:rgba(232,224,210,.78)}
.qc-ailleurs__liste{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr));min-width:0}
.qc-ailleurs__item{background:rgba(232,224,210,.07);border-radius:var(--qc-arrondi-s);padding:.85rem 1rem;min-width:0}
.qc-ailleurs__item p{margin:0;font-size:.94rem}
.qc-ailleurs__item a{color:var(--qc-laiton);font-weight:700;font-family:var(--qc-titre);text-decoration:underline}

/* --------------------------------------------------------------------- PIED */
.qc-pied{background:var(--qc-vert);color:var(--qc-kraft);margin-top:3rem;box-shadow:var(--qc-ombre-4)}
.qc-pied__colonnes{
  display:grid;gap:1.5rem 2rem;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));
  padding-block:clamp(1.75rem,4vw,2.75rem);min-width:0;
}
.qc-pied__colonne{min-width:0}
.qc-pied__colonne h2{
  font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--qc-laiton);margin-bottom:.6rem;
}
.qc-pied__colonne p{font-size:.9rem;color:rgba(232,224,210,.88)}
.qc-pied__colonne ul{list-style:none;margin:0;padding:0}
.qc-pied__colonne li{margin-bottom:.35rem;font-size:.9rem}
.qc-pied__colonne a{color:var(--qc-kraft);border-bottom:1px solid rgba(232,224,210,.35)}
.qc-pied__colonne a:hover{color:var(--qc-laiton);text-decoration:none}
.qc-pied__colonne--note{grid-column:1/-1}
.qc-pied__note{font-size:.82rem;color:rgba(232,224,210,.72);max-width:var(--qc-mesure)}
.qc-pied__ligne{
  border-top:1px solid rgba(232,224,210,.28);
  padding-block:1rem;font-family:var(--qc-titre);font-weight:700;
  font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;
  color:rgba(232,224,210,.72);
}

/* ------------------------------------------------------------- SMALL SCREEN */
@media (max-width:48rem){
  .qc-vedette__vignette{aspect-ratio:4/3}
  .qc-entree--ligne{flex-direction:column}
  .qc-entree--ligne .qc-entree__vignette{
    flex:0 0 auto;width:100%;max-width:100%;aspect-ratio:4/3;border-radius:0;
  }
  .qc-entree__renvoi{text-align:start}
}
@media (max-width:26rem){
  .qc-bilan{grid-template-columns:1fr}
  .qc-parcours__lien{font-size:.72rem;padding:.35rem .6rem}
  .qc-enseigne__nom{font-size:1rem}
}
@media (prefers-reduced-motion:reduce){
  .qc-entree{transition:none}
  .qc-entree:hover{transform:none}
}
