/* Study Successful ,  peau « cahier de méthode annoté ».
   Préfixe : std-. Réglure bleue en tête/encadrés, marge rouge pour les cotes,
   encre violette pour les liens, encre de plume pour le corps. */

@font-face {
  font-family: 'STD Serif';
  src: url('/pt-serif-v12-latin-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'STD Sans';
  src: url('/questrial-v12-latin-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --std-feuille: #f7f3ee;
  --std-buvard: #ece1dc;
  --std-fiche: #fffdfa;
  --std-plume: #241f33;
  --std-plume-douce: #4b4159;
  --std-bleu-seyes: #b7c9e6;
  --std-marge-rouge: #a93b31;
  --std-violette: #4b3f96;
  --std-tampon: #c1873a;
  --std-tampon-clair: #f2d9a8;
  --std-menthe: #cfe6da;
  --std-menthe-fonce: #2f5c4d;

  --std-serre: 'STD Serif', 'Palatino Linotype', Palatino, Georgia, serif;
  --std-souple: 'STD Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;

  --std-pano: 21 / 9;
  --std-paysage: 4 / 3;
  --std-carre: 1 / 1;
  --std-portrait: 3 / 4;

  --std-band: min(72rem, 100% - 2rem);
  --std-mesure: 68ch;
  --std-ombre-carte: 0 18px 30px -22px rgba(75, 63, 150, .45), 0 4px 10px -6px rgba(169, 59, 49, .25);
  --std-ombre-une: 0 34px 60px -34px rgba(36, 31, 51, .5);
  --std-ombre-mini: 0 10px 20px -14px rgba(36, 31, 51, .4);
  --std-rayon: 16px;
  --std-rayon-lg: 20px;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--std-feuille);
  color: var(--std-plume);
  font-family: var(--std-souple);
  font-size: clamp(1rem, .96rem + .22vw, 1.12rem);
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, svg { max-width: 100%; height: auto; display: block; }
a { color: var(--std-violette); text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { color: var(--std-marge-rouge); }
h1, h2, h3, h4 { font-family: var(--std-serre); font-weight: 700; line-height: 1.15; letter-spacing: -0.01em; margin: 0 0 .4em; }
h1 { font-size: clamp(2rem, 1.5rem + 3vw, 3.6rem); }
h2 { font-size: clamp(1.4rem, 1.15rem + 1.4vw, 2rem); }
h3 { font-size: clamp(1.1rem, 1rem + .6vw, 1.35rem); }
h4 { font-size: 1rem; }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.2em; }
figure { margin: 0; }
::selection { background: var(--std-tampon-clair); color: var(--std-plume); }

:focus-visible { outline: 3px solid var(--std-marge-rouge); outline-offset: 3px; border-radius: 6px; }

/* la réglure bleue : identité, jamais dans le corps de lecture */
.std-reglure {
  height: 22px;
  background-image: repeating-linear-gradient(
    var(--std-bleu-seyes) 0 1px,
    transparent 1px 5px
  );
  background-size: 100% 5px;
  border-bottom: 1px solid var(--std-bleu-seyes);
}
/* le bleu de réglure et le rouge de marge ne portent JAMAIS de texte, ni l'un ni l'autre. */

.std-evitement {
  position: absolute; left: -9999px; top: 0;
  background: var(--std-plume); color: #fff;
  padding: .6rem 1rem; border-radius: 0 0 var(--std-rayon) 0; z-index: 20;
}
.std-evitement:focus { left: 0; }

.std-band {
  width: var(--std-band);
  margin: 0 auto;
  padding: 2rem 0;
  min-width: 0;
}

/* ---------- Manchette ---------- */
.std-manchette { background: var(--std-feuille); }
.std-manchette__interieur {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .75rem 1.5rem;
  padding-block: 1rem;
}
.std-enseigne { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--std-plume); }
.std-enseigne__marque { color: var(--std-violette); }
.std-enseigne__nom { font-family: var(--std-serre); font-weight: 700; font-size: clamp(1.4rem, 1.1rem + 1.3vw, 2rem); letter-spacing: -.01em; }
.std-devise { margin: 0; color: var(--std-plume-douce); font-size: .95rem; }
.std-devise__date { display: block; font-variant-numeric: tabular-nums; color: var(--std-marge-rouge); letter-spacing: .08em; text-transform: uppercase; font-size: .78rem; }
.std-pupitre { margin-left: auto; }
.std-pupitre ul { display: flex; flex-wrap: wrap; gap: .35rem .35rem; list-style: none; margin: 0; padding: 0; }
.std-pupitre__lien {
  display: inline-block;
  padding: .35rem .7rem;
  color: var(--std-plume);
  text-decoration: none;
  border-radius: 999px;
  font-size: .92rem;
  letter-spacing: .02em;
}
.std-pupitre__lien:hover, .std-pupitre__lien[aria-current="page"] {
  background: var(--std-fiche);
  color: var(--std-violette);
  box-shadow: var(--std-ombre-mini);
}

/* ---------- Ouverture ---------- */
.std-ouverture {
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  align-items: end;
  padding-top: 2.5rem;
}
.std-ouverture__texte { min-width: 0; }
.std-ouverture__intro { max-width: var(--std-mesure); color: var(--std-plume-douce); font-size: 1.08rem; }
.std-sur-titre {
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--std-marge-rouge);
  margin: 0 0 .6rem;
  font-family: var(--std-souple);
  font-weight: 700;
}
.std-ouverture h1 { text-shadow: 0 1px 0 rgba(255,255,255,.6), 0 8px 24px rgba(75,63,150,.12); }
.std-cotes { list-style: none; margin: 0; padding: 1rem; display: grid; gap: .5rem; border-radius: var(--std-rayon-lg); background: var(--std-menthe); box-shadow: var(--std-ombre-carte); }
.std-cote a { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--std-menthe-fonce); padding: .5rem .2rem; }
.std-cote__code { font-family: var(--std-serre); font-weight: 700; font-size: 1.2rem; letter-spacing: .05em; min-width: 2.4rem; color: var(--std-marge-rouge); background: var(--std-fiche); border-radius: 8px; padding: .1rem .35rem; text-align: center; box-shadow: var(--std-ombre-mini); }
.std-cote__label { font-weight: 600; }

/* ---------- Une ---------- */
.std-une { background: var(--std-fiche); border-radius: var(--std-rayon-lg); box-shadow: var(--std-ombre-une); padding: 1.5rem 1.5rem 2rem; margin-top: 2rem; }
.std-une__article { margin-top: 1rem; }
.std-une__titre { margin: 0 0 1rem; font-size: clamp(1.7rem, 1.3rem + 2.2vw, 2.9rem); }
.std-une__titre a { color: var(--std-plume); text-decoration: none; display: block; }
.std-une__titre-texte {
  display: block;
  text-shadow: 0 2px 14px rgba(36,31,51,.15);
  margin-bottom: .8rem;
}
.std-une__vignette { border-radius: var(--std-rayon-lg); overflow: hidden; box-shadow: var(--std-ombre-une); }
.std-une__vignette img { aspect-ratio: var(--std-pano); object-fit: cover; width: 100%; }
.std-une__chapeau { font-size: 1.1rem; color: var(--std-plume-douce); max-width: var(--std-mesure); }
.std-une__legende { font-size: .88rem; color: var(--std-plume-douce); font-style: italic; margin: 0; padding-top: .4rem; border-top: 1px solid var(--std-bleu-seyes); }
.std-une__second {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 2px solid var(--std-menthe);
}
.std-une__second > * { min-width: 0; }

/* ---------- Cartes d'entrée ---------- */
.std-entree {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .9rem;
  background: var(--std-fiche);
  border-radius: var(--std-rayon);
  padding: .9rem;
  box-shadow: var(--std-ombre-carte);
  min-width: 0;
}
.std-entree__vignette {
  border-radius: 14px;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
}
.std-entree__vignette img { width: 100%; aspect-ratio: var(--std-paysage); object-fit: cover; }
.std-entree__texte { min-width: 0; }
.std-entree__titre { margin: .1rem 0 .4rem; }
.std-entree__titre a { color: var(--std-plume); text-decoration: none; }
.std-entree__titre a:hover { color: var(--std-violette); }
.std-entree__abrege { color: var(--std-plume-douce); margin: 0; }

.std-cartouche {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .7rem;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  margin: 0 0 .5rem;
  border-left: 4px solid var(--std-marge-rouge);
  padding-left: .6rem;
  font-variant-numeric: tabular-nums;
  color: var(--std-plume-douce);
}
.std-cartouche__cote { color: var(--std-marge-rouge); font-weight: 700; }
.std-cartouche__mention { color: var(--std-violette); font-weight: 700; }
.std-cartouche__num { color: var(--std-tampon); font-weight: 700; }
.std-cartouche__date { color: inherit; }

/* ---------- Fil dense ---------- */
.std-fil { margin-top: 2.5rem; }
.std-band__tete { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.std-band__tete h2 { margin: 0; }
.std-band__phrase { margin: 0; color: var(--std-plume-douce); }
.std-compte { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--std-marge-rouge); font-weight: 700; font-size: .9rem; letter-spacing: .1em; }
.std-fil__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.std-fil__item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  background: var(--std-fiche);
  border-radius: var(--std-rayon);
  padding: .6rem;
  box-shadow: var(--std-ombre-mini);
  min-width: 0;
}
.std-fil__vignette { border-radius: 12px; overflow: hidden; width: 96px; max-width: 100%; }
.std-fil__vignette img { width: 100%; aspect-ratio: var(--std-carre); object-fit: cover; }
.std-fil__texte { min-width: 0; }
.std-fil__titre { margin: .05rem 0 .15rem; font-size: 1.1rem; }
.std-fil__titre a { color: var(--std-plume); text-decoration: none; }
.std-fil__extrait { margin: 0; color: var(--std-plume-douce); font-size: .93rem; }

/* ---------- Dossier de rubriques ---------- */
.std-dossier { margin-top: 2.5rem; }
.std-dossier__fiches { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr)); gap: 1.5rem; align-items: start; }
.std-dossier__fiches > * { min-width: 0; }
.std-fiche-rubrique {
  background: var(--std-buvard);
  border-radius: var(--std-rayon-lg);
  padding: 1.2rem 1.2rem 1.4rem;
  box-shadow: var(--std-ombre-carte);
  transform: translateY(var(--std-decal, 0));
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1fr);
  gap: .6rem;
}
.std-fiche-rubrique__marge {
  color: var(--std-marge-rouge);
  font-family: var(--std-serre); font-weight: 700; font-size: 1.4rem;
  writing-mode: vertical-rl; transform: rotate(180deg);
  letter-spacing: .1em;
}
.std-fiche-rubrique__corps { min-width: 0; }
.std-fiche-rubrique__intro { color: var(--std-plume-douce); margin: 0 0 .8rem; }
.std-fiche-rubrique__liste { list-style: none; margin: 0 0 .8rem; padding: 0; display: grid; gap: .6rem; }
.std-mini { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: .7rem; align-items: center; min-width: 0; background: var(--std-fiche); border-radius: 12px; padding: .4rem; box-shadow: var(--std-ombre-mini); }
.std-mini__vignette { border-radius: 10px; overflow: hidden; width: 84px; max-width: 100%; }
.std-mini__vignette img { width: 100%; aspect-ratio: var(--std-carre); object-fit: cover; }
.std-mini__titre { margin: 0 0 .1rem; font-size: .98rem; }
.std-mini__titre a { color: var(--std-plume); text-decoration: none; }
.std-mini__texte time { font-size: .78rem; color: var(--std-plume-douce); letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.std-renvoi { font-weight: 700; text-decoration: none; }

/* ---------- Méthode ---------- */
.std-methode { margin-top: 2.5rem; }
.std-methode__titre { border-top: 3px solid var(--std-menthe); padding-top: .8rem; display: inline-block; }
.std-methode__intro { color: var(--std-plume-douce); max-width: var(--std-mesure); }
.std-methode__grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); gap: 1rem; }
.std-methode__grille > * { min-width: 0; }
.std-note-methode {
  background: var(--std-fiche);
  border-radius: var(--std-rayon);
  padding: 1rem 1.2rem;
  box-shadow: var(--std-ombre-carte);
  border-top: 3px solid var(--std-violette);
}
.std-note-methode__num { font-family: var(--std-serre); font-weight: 700; color: var(--std-tampon); letter-spacing: .14em; margin: 0 0 .3rem; font-size: .78rem; }
.std-note-methode h3 { margin: 0 0 .4rem; }
.std-note-methode ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .65rem; }
.std-note-methode__lien { display: grid; grid-template-columns: 4.5rem 1fr; gap: .7rem; align-items: center; }
.std-note-methode__image { width: 4.5rem; aspect-ratio: 4/3; overflow: hidden; border-radius: .7rem; }
.std-note-methode__image picture, .std-note-methode__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- Renvois réseau ---------- */
.std-renvois { margin-top: 2.5rem; background: var(--std-menthe); border-radius: var(--std-rayon-lg); padding: 1.5rem 1.4rem; box-shadow: var(--std-ombre-carte); }
.std-band__tete + .std-renvois__liste { margin-top: 0; }
.std-renvois__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.std-renvois__item { min-width: 0; background: var(--std-fiche); border-radius: 12px; padding: .7rem .9rem; box-shadow: var(--std-ombre-mini); }
.std-renvois__item p { margin: 0; font-size: .95rem; }

/* ---------- Pied ---------- */
.std-pied { margin-top: 3rem; background: var(--std-buvard); }
.std-pied__colonnes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); gap: 1.5rem; padding-block: 2rem; }
.std-pied__colonne { min-width: 0; }
.std-pied__colonne h2 { font-size: 1.1rem; margin-bottom: .5rem; }
.std-pied__colonne ul { list-style: none; margin: 0; padding: 0; }
.std-pied__colonne li { margin-bottom: .35rem; }
.std-pied__note { font-size: .9rem; color: var(--std-plume-douce); }
.std-pied__ligne { padding-block: 1rem; border-top: 2px solid var(--std-bleu-seyes); font-size: .85rem; text-transform: uppercase; letter-spacing: .14em; color: var(--std-plume-douce); }

/* ---------- Rubrique ---------- */
.std-remontee ol { list-style: none; margin: 0; padding: .8rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem; font-size: .85rem; }
.std-remontee li + li::before { content: '›'; margin-right: .5rem; color: var(--std-marge-rouge); }
.std-ouverture--rubrique { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
.std-pupitre--onglets { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; }
.std-onglet { padding: .4rem .85rem; border-radius: 999px; background: var(--std-fiche); color: var(--std-plume); text-decoration: none; font-size: .9rem; letter-spacing: .02em; }
.std-onglet--courant { background: var(--std-violette); color: #fff; }
.std-grille-rubrique { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr)); gap: 1.5rem; align-items: start; }
.std-grille-rubrique > * { min-width: 0; }
.std-gcard {
  background: var(--std-fiche);
  border-radius: var(--std-rayon-lg);
  padding: 1rem;
  box-shadow: var(--std-ombre-carte);
  display: grid;
  gap: .8rem;
  transform: translateY(var(--std-decal, 0));
  min-width: 0;
}
.std-gcard__vignette { border-radius: 14px; overflow: hidden; width: 100%; max-width: 100%; }
.std-gcard__vignette img { width: 100%; object-fit: cover; aspect-ratio: var(--std-paysage); }
.std-gcard__titre { margin: .1rem 0 .4rem; }
.std-gcard__titre a { color: var(--std-plume); text-decoration: none; }
.std-gcard__abrege { color: var(--std-plume-douce); margin: 0; }

/* ---------- Article ---------- */
.std-lecture { background: var(--std-fiche); border-radius: var(--std-rayon-lg); padding: 0 0 2rem; margin-top: 1rem; box-shadow: var(--std-ombre-une); }
.std-entete-lecture { padding-top: 1.5rem; }
.std-lecture__titre { text-shadow: 0 2px 14px rgba(36,31,51,.14); }
.std-lecture__chapeau { font-size: 1.15rem; color: var(--std-plume-douce); max-width: var(--std-mesure); }
.std-lecture__note { border-top: 1px solid var(--std-bleu-seyes); padding-top: .5rem; font-size: .85rem; letter-spacing: .04em; color: var(--std-plume-douce); max-width: var(--std-mesure); }
.std-lecture__image { padding-block: 1rem; }
.std-lecture__image img { width: 100%; aspect-ratio: var(--std-pano); object-fit: cover; border-radius: var(--std-rayon); }
.std-lecture__image figcaption { font-size: .85rem; color: var(--std-plume-douce); font-style: italic; padding-top: .4rem; }
.std-lecture__colonnes { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 2rem; align-items: start; }
.std-lecture__colonnes > * { min-width: 0; }
.std-rail { position: sticky; top: 1rem; background: var(--std-buvard); border-radius: var(--std-rayon); padding: 1rem 1.1rem; box-shadow: var(--std-ombre-mini); }
.std-rail h2 { font-size: 1rem; text-transform: uppercase; letter-spacing: .14em; color: var(--std-marge-rouge); margin-top: 1rem; }
.std-rail h2:first-child { margin-top: 0; }
.std-rail ul, .std-rail ol { padding-left: 1.1rem; margin: 0 0 .5rem; }
.std-rail a { color: var(--std-violette); text-decoration: none; }
.std-rail a:hover { text-decoration: underline; }
.std-corps { max-width: var(--std-mesure); font-size: 1.02rem; line-height: 1.7; }
.std-corps > h2 { margin-top: 1.8rem; }
.std-corps > h2::before { content: counter(std-part, decimal-leading-zero) '. '; color: var(--std-tampon); font-size: .8em; letter-spacing: .1em; counter-increment: std-part; }
.std-corps { counter-reset: std-part; }
.std-corps > h2:first-child { margin-top: 0; }
.std-corps p:first-of-type::first-letter { font-family: var(--std-serre); font-weight: 700; float: left; font-size: 3.4em; line-height: .85; padding: .05em .12em 0 0; color: var(--std-violette); }
.std-corps img { border-radius: var(--std-rayon); margin: 1rem 0; }
.std-corps table { max-width: 100%; }
.std-corps .std-defilant, .std-corps table { width: 100%; }
.std-corps .std-defilant { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 12px; }
.std-corps blockquote { border-left: 4px solid var(--std-marge-rouge); padding-left: .9rem; margin: 1rem 0; color: var(--std-plume-douce); font-style: italic; }

/* ---------- Voisinage ---------- */
.std-voisinage { margin-top: 2.5rem; }
.std-voisinage__grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr)); gap: 1.5rem; align-items: start; }
.std-voisinage__grille > * { min-width: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 62rem) {
  .std-ouverture { grid-template-columns: minmax(0, 1fr); }
  .std-lecture__colonnes { grid-template-columns: minmax(0, 1fr); }
  .std-rail { position: static; }
  .std-fiche-rubrique, .std-gcard { transform: none; }
}
@media (max-width: 40rem) {
  :root { --std-band: min(72rem, 100% - 1.4rem); }
  .std-band { padding: 1.4rem 0; }
  .std-pupitre { margin-left: 0; width: 100%; }
  .std-fil__item { grid-template-columns: 72px minmax(0, 1fr); }
  .std-fil__vignette { width: 72px; }
  .std-mini { grid-template-columns: 68px minmax(0, 1fr); }
  .std-mini__vignette { width: 68px; }
  .std-fiche-rubrique { grid-template-columns: minmax(0, 1fr); }
  .std-fiche-rubrique__marge { writing-mode: horizontal-tb; transform: none; }
}
@media (max-width: 24rem) {
  .std-fil__item { grid-template-columns: minmax(0, 1fr); }
  .std-fil__vignette { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}
@media print {
  .std-manchette, .std-pied, .std-rail { display: none; }
  body { background: #fff; }
}
