/* Blog Honoré : en-tête noir et jaune, cartes en colonnes décalées (façon 66 Origin), article de lecture */
.blog-tete{background:var(--encre);color:#fff;padding:clamp(36px,5vw,64px) 0 clamp(32px,4vw,52px)}
.blog-tete .surtitre{color:var(--gris-clair);margin-bottom:16px}
.blog-tete h1{font-size:clamp(30px,3.6vw,52px);font-weight:800;letter-spacing:-.04em;line-height:1.05}
.blog-tete h1 span{color:var(--jaune)}
.blog-intro{margin-top:14px;max-width:640px;font-size:17px;line-height:1.55;color:#c9c7c0}

.blog-liste-zone{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(80px,10vw,140px)}
.blog-liste{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px);align-items:stretch}


.billet{display:flex;flex-direction:column;border:1px solid var(--encre);border-radius:var(--rayon);padding:14px;background:#fff;transition:transform .3s,box-shadow .3s}
.billet:hover{transform:translateY(-4px);box-shadow:0 30px 50px -34px rgba(0,0,0,.45)}
.billet:hover .billet-titre{color:var(--jaune)}
.billet-visuel{display:block;border-radius:12px;overflow:hidden;aspect-ratio:4/5;background:var(--encre)}
.billet-visuel img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.billet:hover .billet-visuel img{transform:scale(1.04)}
.billet-texte{display:grid;gap:10px;padding:20px 6px 8px}
.billet-meta{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--jaune-fonce)}
.billet-titre{font:700 clamp(22px,2vw,28px)/1.18 var(--titre);letter-spacing:-.025em;transition:color .2s}
.billet-chapo{font-size:15.5px;line-height:1.5;color:var(--gris)}
.billet-date{font-size:13px;color:var(--gris-clair);margin-top:4px}

/* Article */
.article-tete{background:var(--encre);color:#fff;padding:clamp(48px,7vw,90px) 0 clamp(150px,18vw,260px)}
.article-tete-in>*{max-width:980px}
.article-retour{display:inline-block;color:var(--gris-clair);font-size:14px;margin-bottom:36px}.article-retour:hover{color:#fff}
.article-theme{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--jaune);margin-bottom:18px}
.article-tete h1{font-size:clamp(38px,5.6vw,80px);font-weight:800;letter-spacing:-.045em;line-height:1}
.article-chapo{margin-top:26px;font-size:clamp(19px,1.7vw,23px);line-height:1.5;color:#c9c7c0;max-width:760px}
.article-chapo a{text-decoration:underline}
.article-meta{margin-top:24px;font-size:14px;color:var(--gris-clair)}
.article-corps-zone{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,96px);align-items:start;margin-top:clamp(-220px,-14vw,-110px);padding-bottom:clamp(64px,8vw,120px)}
.article-visuel{margin:0;position:sticky;top:110px;border-radius:var(--rayon);overflow:hidden;box-shadow:0 40px 70px -40px rgba(0,0,0,.6)}
.article-corps{padding-top:clamp(130px,15vw,230px);font-size:18.5px;line-height:1.75;color:var(--encre-2);max-width:700px}
.article-corps p{margin:0 0 22px}
.article-corps h2{font-size:clamp(24px,2.3vw,32px);font-weight:800;letter-spacing:-.025em;margin:44px 0 16px;color:var(--encre)}
.article-corps blockquote{margin:40px 0;padding:6px 0 6px 26px;border-left:4px solid var(--jaune);font:700 clamp(21px,2vw,27px)/1.35 var(--titre);letter-spacing:-.02em;color:var(--encre)}
.article-suite{padding-bottom:clamp(70px,9vw,120px);border-top:1px solid var(--ligne);padding-top:clamp(48px,6vw,80px)}
.blog-liste-courte .billet:nth-child(n){margin-top:0}
.article-appel{background:var(--encre);color:#fff;padding:clamp(70px,9vw,120px) 0}
.article-appel-in{display:grid;gap:30px;justify-items:start}
.article-appel h2{font-size:clamp(36px,5vw,72px);font-weight:800;letter-spacing:-.05em;line-height:1}
.article-appel h2 span{color:var(--jaune)}

/* Bloc blog de l'accueil */
.carnets .entete{display:flex;justify-content:space-between;align-items:end;gap:24px;max-width:none}
/* 4 articles sur l'accueil : le 4e ne s'affiche qu'en deux colonnes (tablette, téléphone). */
.carnets .blog-liste .billet:nth-child(4){display:none}
@media (max-width:1080px){.carnets .blog-liste .billet:nth-child(4){display:flex}}


@media (max-width:1080px){
  .blog-liste{grid-template-columns:1fr 1fr}
  .blog-liste .billet:nth-child(n){margin-top:0}

  .article-corps-zone{grid-template-columns:1fr;margin-top:clamp(-200px,-20vw,-110px)}
  .article-visuel{position:static;max-width:520px}
  .article-corps{padding-top:0}
}
@media (max-width:720px){
  .blog-liste{grid-template-columns:1fr}
  .blog-liste .billet:nth-child(n){margin-top:0}
  .carnets .entete{flex-direction:column;align-items:start}
  .article-corps{font-size:17px}
}
.billet{height:100%}.billet-texte{flex:1;display:flex;flex-direction:column;gap:10px}.billet-date{margin-top:auto;padding-top:6px}

/* Téléphone : deux articles par ligne, cartes compactes */
@media (max-width:720px){
  .blog-liste{grid-template-columns:1fr 1fr;gap:12px}
  .billet{padding:8px;border-radius:14px}
  .billet-visuel{border-radius:9px}
  .billet-texte{padding:12px 4px 4px;gap:6px}
  .billet-meta{font-size:10px;letter-spacing:.06em}
  .billet-titre{font-size:16px;line-height:1.2}
  .billet-chapo{display:none}
  .billet-date{font-size:11px}
}
/* Pages à petit en-tête (produits, cas clients, équipe) : la première section démarre près de l'en-tête, comme sur Contact */
.blog-tete+.section,.blog-tete+.equipe-grille,.blog-tete+section{padding-top:clamp(32px,4vw,56px)}