/*
Theme Name: Lab Éditorial
Description: Habillage éditorial du Lab de la Transfo, le média de la transformation au travail.
Author: Le Lab de la Transfo
Template: astra
Version: 1.0.0
Text Domain: lab-editorial
*/

:root{
  --lab-violet:#7451eb; --lab-violet-f:#6740d8;
  --lab-violet-05:#f6f4fd; --lab-violet-10:#ece9fb; --lab-violet-20:#dad3f8;
  --lab-encre:#271a38; --lab-gris:#605b68; --lab-filet:#e7e3df;
  --lab-creme:#fffaee; --lab-blanc:#ffffff;
  --lab-jaune:#f2e93f; --lab-orange:#ff5722; --lab-vert:#2e7e32; --lab-bleu:#0277bd; --lab-corail:#e96b7c;
  --lab-r:16px; --lab-r-s:12px; --lab-ombre:0 18px 40px -24px rgba(39,26,56,.28);
  --lab-cont:1180px;
}

/* ---- Fond & typo globale (override du random Astra) ---- */
body,
.ast-separate-container,
.ast-plain-container,
.ast-page-builder-template .site-content{
  background-color:var(--lab-creme);
}
/* Pas de carte blanche boxée : le contenu respire sur le crème. */
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-separate-container #primary,
.ast-separate-container .comment-respond{
  background:transparent; box-shadow:none;
}
/* Accueil : le container Astra laisse la main à .lab-wrap. */
.home .site-content > .ast-container{ max-width:none; padding-left:0; padding-right:0; }
.home #primary{ padding:0; margin:0; }

/* En-tête de rubrique */
.lab-cat-tete{ padding:52px 0 8px; max-width:var(--lab-cont); margin:0 auto; }
.lab-cat-tete h1{ font-size:clamp(30px,4.4vw,46px); font-weight:800; }
.lab-cat-tete .lab-cat-desc{ color:var(--lab-gris); font-size:19px; max-width:60ch; margin-top:12px; }
.lab-pagination{ margin:38px 0 8px; display:flex; gap:8px; flex-wrap:wrap; }
.lab-pagination .page-numbers{ padding:9px 15px; border:1px solid var(--lab-filet); border-radius:10px; text-decoration:none; color:var(--lab-encre); }
.lab-pagination .page-numbers.current{ background:var(--lab-violet); color:#fff; border-color:var(--lab-violet); }
.lab-ailleurs{ margin:48px 0 0; padding:32px 0 0; border-top:1px solid var(--lab-filet); }
.lab-ailleurs h2{ font-size:22px; font-weight:800; margin:0 0 16px; }
.lab-ailleurs-liens{ display:flex; flex-wrap:wrap; gap:10px; }
.lab-ailleurs-liens a{ background:#fff; border:1px solid var(--lab-filet); border-radius:999px; padding:9px 16px; font-weight:600; font-size:14.5px; text-decoration:none; color:var(--lab-encre); }
.lab-ailleurs-liens a:hover{ border-color:var(--lab-violet); color:var(--lab-violet); }
body{ color:var(--lab-encre); font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif; }
h1,h2,h3,h4,.entry-title,.ast-archive-title,.site-title{
  font-family:'Inter',sans-serif; color:var(--lab-encre); letter-spacing:-.02em; line-height:1.12;
}
a{ color:var(--lab-violet); }
a:hover{ color:var(--lab-violet-f); }
::selection{ background:var(--lab-violet-20); }

/* ---- En-tête Astra restylé ---- */
.main-header-bar, .ast-primary-header-bar{
  background:rgba(255,250,238,.9); border-bottom:1px solid var(--lab-filet);
}
.site-title a{ color:var(--lab-encre)!important; font-weight:800; letter-spacing:-.02em; }
.main-header-menu .menu-item > a,
.ast-builder-menu .menu-item > a{ color:var(--lab-encre); font-weight:600; }
.main-header-menu .menu-item > a:hover,
.ast-builder-menu .menu-item > a:hover{ color:var(--lab-violet); }
/* item pilule "La newsletter" */
.menu-item.lab-cta > a{
  background:var(--lab-violet); color:#fff!important; border-radius:999px;
  padding:9px 20px!important; margin-left:8px; transition:transform .18s ease,background .18s ease;
}
.menu-item.lab-cta > a:hover{ background:var(--lab-violet-f); transform:translateY(-2px); }

/* ---- Conteneur & boutons ---- */
.lab-wrap{ max-width:var(--lab-cont); margin:0 auto; padding:0 24px; }
.lab-bouton{
  display:inline-flex; align-items:center; gap:9px; font-weight:600; font-size:16px;
  padding:14px 26px; border-radius:999px; border:2px solid transparent; cursor:pointer; text-decoration:none;
  transition:transform .18s ease, background .18s ease;
}
.lab-bouton--plein{ background:var(--lab-violet); color:#fff; box-shadow:0 10px 22px -12px rgba(116,81,235,.7); }
.lab-bouton--plein:hover{ background:var(--lab-violet-f); color:#fff; transform:translateY(-2px); }
.lab-bouton--ligne{ background:transparent; color:var(--lab-encre); border-color:var(--lab-encre); }
.lab-bouton--ligne:hover{ background:var(--lab-encre); color:#fff; transform:translateY(-2px); }
.lab-bouton--clair{ background:#fff; color:var(--lab-violet); }
.lab-bouton--clair:hover{ transform:translateY(-2px); color:var(--lab-violet-f); }

.lab-sur{ color:var(--lab-violet); font-weight:700; font-size:14px; margin:0 0 14px; }
.lab-tete{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:32px; flex-wrap:wrap; }
.lab-tete h2{ font-size:clamp(26px,3.4vw,38px); font-weight:800; max-width:22ch; margin:0; }
.lab-tete .lab-plus{ font-weight:700; font-size:15px; }

/* ---- Hero ---- */
.lab-heros{ padding:72px 0 40px; }
.lab-heros-grille{ display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
.lab-heros h1{ font-size:clamp(34px,5vw,56px); font-weight:800; }
.lab-heros .souligne{ color:var(--lab-violet); position:relative; white-space:nowrap; }
.lab-heros .souligne svg{ position:absolute; left:0; right:0; bottom:-9px; width:100%; height:11px; }
.lab-heros p.lab-chapo{ font-size:20px; color:var(--lab-gris); max-width:34ch; margin:22px 0 30px; }
.lab-heros-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.lab-heros-preuve{ display:flex; align-items:center; gap:16px; margin-top:32px; color:var(--lab-gris); font-size:14px; }
.lab-heros-preuve .pastilles{ display:flex; }
.lab-heros-preuve .pastilles span{ width:34px; height:34px; border-radius:50%; border:2.5px solid var(--lab-creme); margin-left:-10px; }

/* ---- Univers (rubriques) ---- */
.lab-bloc{ padding:60px 0; }
.lab-univers{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.lab-tuile{ background:var(--lab-blanc); border:1px solid var(--lab-filet); border-radius:var(--lab-r);
  padding:26px; display:flex; flex-direction:column; gap:14px; text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease; }
.lab-tuile:hover{ transform:translateY(-4px); box-shadow:var(--lab-ombre); }
.lab-tuile .rond{ width:56px; height:56px; border-radius:14px; display:grid; place-items:center; }
.lab-tuile h3{ font-size:20px; font-weight:750; margin:0; }
.lab-tuile p{ margin:0; color:var(--lab-gris); font-size:15.5px; }
.lab-tuile .fleche{ margin-top:auto; color:var(--lab-violet); font-weight:700; font-size:14.5px; }

/* ---- À la une (cartes) ---- */
.lab-unes-grille{ display:grid; grid-template-columns:1.35fr 1fr; gap:26px; }
.lab-grande{ background:var(--lab-blanc); border:1px solid var(--lab-filet); border-radius:var(--lab-r);
  overflow:hidden; display:flex; flex-direction:column; text-decoration:none; transition:transform .2s,box-shadow .2s; }
.lab-grande:hover{ transform:translateY(-4px); box-shadow:var(--lab-ombre); }
.lab-couv{ height:230px; position:relative; }
.lab-couv img{ width:100%; height:100%; object-fit:cover; }
.lab-corps{ padding:26px; }
.lab-etiq{ display:inline-block; font-weight:700; font-size:12.5px; padding:5px 12px; border-radius:999px;
  background:var(--lab-violet-10); color:var(--lab-violet); }
.lab-grande h3{ font-size:26px; font-weight:800; margin:14px 0 10px; line-height:1.15; color:var(--lab-encre); }
.lab-grande p{ margin:0; color:var(--lab-gris); }
.lab-meta{ margin-top:16px; color:var(--lab-gris); font-size:13.5px; font-weight:600; }
.lab-colonne{ display:flex; flex-direction:column; gap:16px; }
.lab-mini{ display:grid; grid-template-columns:96px 1fr; gap:16px; background:var(--lab-blanc);
  border:1px solid var(--lab-filet); border-radius:var(--lab-r-s); padding:14px; text-decoration:none;
  transition:transform .2s,box-shadow .2s; }
.lab-mini:hover{ transform:translateY(-3px); box-shadow:var(--lab-ombre); }
.lab-mini .vignette{ border-radius:9px; height:78px; overflow:hidden; }
.lab-mini .vignette img{ width:100%; height:100%; object-fit:cover; }
.lab-mini h4{ font-size:16.5px; font-weight:750; margin:2px 0 6px; line-height:1.2; color:var(--lab-encre); }

/* cartes génériques (archives) */
.lab-cartes{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.lab-carte{ background:var(--lab-blanc); border:1px solid var(--lab-filet); border-radius:var(--lab-r);
  overflow:hidden; display:flex; flex-direction:column; transition:transform .2s,box-shadow .2s; }
.lab-carte:hover{ transform:translateY(-4px); box-shadow:var(--lab-ombre); }
.lab-carte .lab-couv{ height:170px; }
.lab-carte-corps{ padding:20px; display:flex; flex-direction:column; gap:9px; }
.lab-carte-cat{ font-weight:700; font-size:12.5px; color:var(--lab-violet); text-decoration:none; }
.lab-carte h3{ font-size:18.5px; font-weight:750; margin:0; line-height:1.22; }
.lab-carte h3 a{ color:var(--lab-encre); text-decoration:none; }
.lab-carte p{ margin:0; color:var(--lab-gris); font-size:15px; }
.lab-carte-date{ color:var(--lab-gris); font-size:13px; }

/* ---- Notre regard ---- */
.lab-regard{ background:var(--lab-violet-05); border:1px solid var(--lab-violet-10); border-radius:24px;
  padding:44px; display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center; }
.lab-regard h2{ font-size:clamp(24px,3vw,32px); font-weight:800; margin:0 0 14px; }
.lab-regard p{ color:var(--lab-gris); margin:0 0 12px; }
.lab-jetons{ display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; }
.lab-jeton{ background:#fff; border:1px solid var(--lab-violet-10); border-radius:999px; padding:8px 15px; font-weight:600; font-size:14px; }

/* ---- Infolettre ---- */
.lab-infolettre{ background:var(--lab-violet); border-radius:24px; padding:48px; color:#fff;
  display:grid; grid-template-columns:1.1fr .9fr; gap:36px; align-items:center; position:relative; overflow:hidden; }
.lab-infolettre h2{ color:#fff; font-size:clamp(24px,3vw,34px); font-weight:800; margin:0; }
.lab-infolettre p{ color:rgba(255,255,255,.9); margin:14px 0 0; }
.lab-infolettre form{ display:flex; gap:12px; background:#fff; border-radius:999px; padding:7px 7px 7px 20px; }
.lab-infolettre input{ flex:1; border:0; outline:0; font-size:16px; color:var(--lab-encre); background:transparent; font-family:inherit; }
.lab-infolettre .fin{ font-size:13px; color:rgba(255,255,255,.72); margin-top:14px; }
.lab-infolettre .bulle{ position:absolute; border-radius:50%; opacity:.5; }

/* ---- Pied ---- */
.lab-pied{ border-top:1px solid var(--lab-filet); margin-top:20px; padding:54px 0 40px; background:var(--lab-creme); }
.lab-pied-grille{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px; }
.lab-pied h5{ font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--lab-gris); margin:0 0 16px; font-weight:700; }
.lab-pied ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.lab-pied ul a{ color:var(--lab-encre); opacity:.82; font-size:15px; text-decoration:none; }
.lab-pied ul a:hover{ opacity:1; color:var(--lab-violet); }
.lab-pied .marque{ font-weight:800; font-size:19px; color:var(--lab-encre); }
.lab-pied .desc{ color:var(--lab-gris); font-size:15px; max-width:34ch; margin:12px 0 0; }
.lab-pied-bas{ max-width:var(--lab-cont); margin:38px auto 0; padding:22px 24px 0; border-top:1px solid var(--lab-filet);
  display:flex; justify-content:space-between; gap:16px; color:var(--lab-gris); font-size:13.5px; flex-wrap:wrap; }

/* ---- Marque (logo texte) ---- */
.lab-logo{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.lab-logo .signe{ width:32px; height:32px; border-radius:9px; background:var(--lab-violet); display:grid; place-items:center;
  color:#fff; font-size:17px; transform:rotate(-6deg); }

/* ---- Single post : lisible, pas sur-optimisé ---- */
.single-post .entry-title{ font-size:clamp(28px,4vw,44px); font-weight:800; }
.single-post .entry-content{ font-size:18px; }
.single-post .entry-content a{ color:var(--lab-violet-f); }
.ast-archive-description .ast-archive-title{ font-weight:800; }

/* ---- Illustrations ---- */
.lab-illus svg{ width:100%; height:auto; display:block; }

/* ---- Sections toujours visibles (pas de reveal masquant, robuste sans JS) ---- */
.lab-vue{ opacity:1; }

/* ---- Responsive ---- */
@media(max-width:900px){
  .lab-heros-grille,.lab-unes-grille,.lab-regard,.lab-infolettre{ grid-template-columns:1fr; }
  .lab-illus{ order:-1; max-width:460px; margin:0 auto; }
  .lab-univers,.lab-cartes{ grid-template-columns:repeat(2,1fr); }
  .lab-pied-grille{ grid-template-columns:1fr 1fr; }
}
@media(max-width:560px){
  .lab-univers,.lab-cartes{ grid-template-columns:1fr; }
  .lab-regard,.lab-infolettre{ padding:30px; }
  .lab-heros{ padding:40px 0 20px; }
}
@media(prefers-reduced-motion:reduce){
  .js .lab-vue{ opacity:1; transform:none; transition:none; }
  .lab-bouton,.lab-tuile,.lab-mini,.lab-grande,.lab-carte{ transition:none; }
}
