/* Articles du carnet (gabarit « article » de Divi), écrits dans l'éditeur WordPress.
   Classe <body> « lha-lecture » : posée par inc/articles.php, seulement quand le modèle est actif.
   Colonne de lecture de 720 px (≈ 68 caractères), photo à la une plus large. */

body.lha-lecture #main-content{background:var(--lha-surface);padding-bottom:88px}
body.lha-lecture #main-content .container{
  width:auto; max-width:1048px; margin:0 auto; padding:48px 24px 0;
}
body.lha-lecture #main-content .container:before{display:none}
body.lha-lecture #left-area{width:100%;float:none;margin:0;padding:0!important}
body.lha-lecture #sidebar{display:none}
body.lha-lecture #left-area .et_pb_post{margin:0;padding:0}

/* la colonne de lecture */
body.lha-lecture #left-area .lha-fil-art,
body.lha-lecture #left-area .et_post_meta_wrapper > h1,
body.lha-lecture #left-area .et_post_meta_wrapper > .post-meta,
body.lha-lecture #left-area .entry-content > *,
body.lha-lecture #left-area .lha-art-retour,
body.lha-lecture #left-area #comment-wrap{max-width:720px;margin-left:auto;margin-right:auto}

/* ---------- tête ---------- */
body.lha-lecture #left-area .lha-fil-art{
  font:400 14px/1.5 var(--lha-sans); color:var(--lha-muted); padding:0; margin-bottom:10px;
}
body.lha-lecture #left-area .lha-fil-art a{
  color:var(--lha-muted); text-decoration:underline; text-underline-offset:3px;
  display:inline-flex; align-items:center; min-height:28px;
}
body.lha-lecture #left-area h1.entry-title{
  font:600 clamp(34px,4.4vw,52px)/1.08 var(--lha-display); letter-spacing:-.02em;
  color:var(--lha-ink); padding:0; margin-top:0; margin-bottom:0;
}
body.lha-lecture #left-area .et_post_meta_wrapper > .post-meta{
  font:400 14px/1.5 var(--lha-sans); color:var(--lha-muted); padding:0; margin-top:14px; margin-bottom:0;
}
body.lha-lecture #left-area .post-meta a{color:var(--lha-muted);text-decoration:underline;text-underline-offset:3px}
body.lha-lecture #left-area .et_post_meta_wrapper > img{
  display:block; width:100%; max-width:100%; height:auto; aspect-ratio:16/9; object-fit:cover;
  border-radius:var(--lha-r-lg); background:var(--lha-sunken); margin:32px 0 0;
}

/* ---------- corps ---------- */
body.lha-lecture #left-area .entry-content{padding-top:36px}
body.lha-lecture #left-area .entry-content :where(p,li,td,th,figcaption,blockquote){font-family:var(--lha-sans);color:var(--lha-ink)}
body.lha-lecture #left-area .entry-content p{font-size:18px;line-height:1.7;padding:0;margin-top:0;margin-bottom:1.1em}
body.lha-lecture #left-area .entry-content > p:first-child{font-size:21px;line-height:1.6;color:var(--lha-muted);margin-bottom:1.4em}
body.lha-lecture #left-area .entry-content h2{
  font:600 clamp(26px,2.8vw,32px)/1.15 var(--lha-display); letter-spacing:-.015em;
  color:var(--lha-ink); padding:0; margin-top:1.7em; margin-bottom:.5em;
}
body.lha-lecture #left-area .entry-content h3{
  font:600 20px/1.3 var(--lha-sans); color:var(--lha-ink); padding:0; margin-top:1.5em; margin-bottom:.4em;
}
body.lha-lecture #left-area .entry-content a{color:var(--lha-accent);text-decoration:underline;text-underline-offset:3px}
body.lha-lecture #left-area .entry-content a:hover{color:var(--lha-accent-h)}
body.lha-lecture #left-area .entry-content :where(strong,b){font-weight:600}
body.lha-lecture #left-area :where(a,button,input,textarea):focus-visible{outline:3px solid var(--lha-accent);outline-offset:2px;border-radius:4px}

/* listes */
body.lha-lecture #left-area .entry-content ul,
body.lha-lecture #left-area .entry-content ol{list-style:none;padding:0;margin-top:0;margin-bottom:1.2em;line-height:inherit}
body.lha-lecture #left-area .entry-content li{font-size:18px;line-height:1.65;position:relative}
body.lha-lecture #left-area .entry-content li + li{margin-top:.45em}
body.lha-lecture #left-area .entry-content ul > li{padding-left:24px}
body.lha-lecture #left-area .entry-content ul > li::before{
  content:""; position:absolute; left:6px; top:.72em;
  width:6px; height:6px; border-radius:50%; background:var(--lha-sage400);
}
body.lha-lecture #left-area .entry-content ol{counter-reset:lha-ol}
body.lha-lecture #left-area .entry-content ol > li{counter-increment:lha-ol;padding-left:36px}
body.lha-lecture #left-area .entry-content ol > li::before{
  content:counter(lha-ol); position:absolute; left:0; top:.15em;
  width:26px; height:26px; border-radius:50%; background:var(--lha-sage100); color:var(--lha-primary);
  font:600 13px/26px var(--lha-sans); text-align:center;
}

/* tableaux (bloc « Tableau ») */
body.lha-lecture #left-area .entry-content figure.wp-block-table{margin-top:.4em;margin-bottom:1.6em;overflow-x:auto}
body.lha-lecture #left-area .entry-content table{
  width:100%; border:0; border-collapse:collapse; margin:0; text-align:left;
  background:var(--lha-raised); border-radius:var(--lha-r-md); overflow:hidden;
}
body.lha-lecture #left-area .entry-content th,
body.lha-lecture #left-area .entry-content td{
  border:0; border-bottom:1px solid var(--lha-border); padding:12px 18px;
  font-size:17px; line-height:1.4; text-align:left; background:transparent;
}
body.lha-lecture #left-area .entry-content thead th{font-size:14px;font-weight:600;color:var(--lha-muted);background:var(--lha-sunken)}
body.lha-lecture #left-area .entry-content tbody th{font-weight:400}
body.lha-lecture #left-area .entry-content td:last-child,
body.lha-lecture #left-area .entry-content th:last-child{text-align:right}
body.lha-lecture #left-area .entry-content tbody td:last-child{font-weight:600;font-variant-numeric:tabular-nums}
body.lha-lecture #left-area .entry-content tbody tr:last-child > *{border-bottom:0}
body.lha-lecture #left-area .entry-content figcaption{font-size:14px;line-height:1.5;color:var(--lha-muted);text-align:left;margin-top:8px}

/* encadré : bloc « Groupe » avec la classe « lha-encadre » */
body.lha-lecture #left-area .entry-content .lha-encadre{
  background:var(--lha-sunken); border-left:4px solid var(--lha-primary);
  border-radius:var(--lha-r-md); padding:22px 26px; margin-top:.4em; margin-bottom:1.6em;
}
body.lha-lecture #left-area .entry-content .lha-encadre :where(h2,h3):first-child{margin-top:0}
body.lha-lecture #left-area .entry-content .lha-encadre h3{font-family:var(--lha-display);font-size:21px}
body.lha-lecture #left-area .entry-content .lha-encadre li{font-size:17px}
body.lha-lecture #left-area .entry-content .lha-encadre > :last-child,
body.lha-lecture #left-area .entry-content .lha-encadre > .wp-block-group__inner-container > :last-child{margin-bottom:0}

/* citations, images, séparateur */
body.lha-lecture #left-area .entry-content blockquote{
  border:0; border-left:3px solid var(--lha-sage400); padding:4px 0 4px 22px; margin-top:1.4em; margin-bottom:1.6em;
}
body.lha-lecture #left-area .entry-content blockquote p{font:400 22px/1.5 var(--lha-display);color:var(--lha-ink)}
body.lha-lecture #left-area .entry-content blockquote cite{display:block;font:400 14px/1.5 var(--lha-sans);color:var(--lha-muted);font-style:normal}
body.lha-lecture #left-area .entry-content figure.wp-block-image{margin-top:.4em;margin-bottom:1.6em}
body.lha-lecture #left-area .entry-content figure.wp-block-image img{border-radius:var(--lha-r-lg);height:auto}
body.lha-lecture #left-area .entry-content hr{border:0;border-top:1px solid var(--lha-border);margin:2em auto}

/* ---------- fin d'article ---------- */
body.lha-lecture #left-area .lha-art-retour{padding:0;margin-top:40px;font:600 16px/1.4 var(--lha-sans)}
body.lha-lecture #left-area .lha-art-retour a{
  color:var(--lha-accent); text-decoration:none; display:inline-flex; align-items:center; min-height:44px;
}
body.lha-lecture #left-area .lha-art-retour a:hover{color:var(--lha-accent-h);text-decoration:underline}
body.lha-lecture #left-area .lha-art-fin{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  background:var(--lha-forest900); border-radius:var(--lha-r-lg); padding:32px 36px; margin-top:24px;
}
body.lha-lecture #left-area .lha-art-fin p{font:400 16px/1.55 var(--lha-sans);color:var(--lha-on-dark-muted);padding:0;margin:0}
body.lha-lecture #left-area .lha-art-fin .lha-art-fin-t{font:600 clamp(22px,2.2vw,28px)/1.2 var(--lha-display);color:#fff;margin-bottom:6px}
body.lha-lecture #left-area .lha-art-fin sup{font-size:.62em;line-height:0}
body.lha-lecture #left-area .lha-art-fin-b{display:flex;flex-wrap:wrap;gap:10px;flex:0 0 auto}
body.lha-lecture #left-area .lha-art-fin-b a{
  display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:14px 22px;
  border-radius:var(--lha-r-md); font:600 16px/1.2 var(--lha-sans); text-decoration:none;
}
body.lha-lecture #left-area .lha-art-btn{background:var(--lha-accent);color:#fff}
body.lha-lecture #left-area .lha-art-btn:hover{background:var(--lha-accent-h);color:#fff}
body.lha-lecture #left-area .lha-art-tel{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
body.lha-lecture #left-area .lha-art-tel:hover{color:#fff;box-shadow:inset 0 0 0 1px #fff}

/* commentaires (si Hadrien les laisse ouverts) */
body.lha-lecture #left-area #comment-wrap{padding-top:48px;font-family:var(--lha-sans)}
body.lha-lecture #left-area #comment-wrap :where(h1,h3){font:600 24px/1.25 var(--lha-display);color:var(--lha-ink);padding:0 0 12px}
body.lha-lecture #left-area #commentform :where(input[type=text],input[type=email],input[type=url],textarea){
  background:var(--lha-raised); border:1px solid var(--lha-border-strong); border-radius:var(--lha-r-md);
  font:400 16px/1.5 var(--lha-sans); color:var(--lha-ink); padding:12px 14px;
}

/* ---------- mobile ---------- */
@media (max-width:767px){
  body.lha-lecture #main-content .container{padding:32px 16px 0}
  body.lha-lecture #left-area .et_post_meta_wrapper > img{margin-top:24px;aspect-ratio:3/2}
  body.lha-lecture #left-area .entry-content{padding-top:28px}
  body.lha-lecture #left-area .entry-content p,
  body.lha-lecture #left-area .entry-content li{font-size:17px}
  body.lha-lecture #left-area .entry-content > p:first-child{font-size:19px}
  body.lha-lecture #left-area .entry-content th,
  body.lha-lecture #left-area .entry-content td{padding:11px 14px;font-size:16px}
  body.lha-lecture #left-area .entry-content .lha-encadre{padding:20px}
  /* tableau collé sans bloc « Tableau » : il défile dans sa largeur au lieu d'élargir la page */
  body.lha-lecture #left-area .entry-content > table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body.lha-lecture #left-area .lha-art-fin{flex-direction:column;align-items:stretch;padding:26px 22px}
  body.lha-lecture #left-area .lha-art-fin-b{flex-direction:column}
}