/*
Theme Name: Labguide
Theme URI: https://labsoftwareguide.com
Author: Thibaut Desseignes
Description: Thème éditorial léger pour les sites Lab Software Guide et Logiciel Labo. Design system partagé, gabarits article, pilier, blog et accueil, pensé pour la publication par API (blocs natifs) et le SEO.
Version: 1.0.3
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: labguide
*/

/* ---------- Tokens ---------- */
:root{
  --paper:#FFFFFF; --panel:#F2F5F3; --panel-2:#E8EEEA; --ink:#17212B; --ink-2:#4A5966; --muted:#7A8792; --line:#D9DFDA;
  --teal:#0F7B78; --teal-ink:#0B5F5D; --teal-soft:#D9EEEC; --navy:#14213D; --navy-ink:#E9EEF5; --amber:#A86A0B; --amber-soft:#F6E8CC;
  --t1:#DCEBE9; --t2:#E4E9F3; --t3:#F0E9DA; --t4:#E9E4F1; --t5:#E3EFE0; --t6:#F3E4E2;
  --font-head:"Libre Franklin","Helvetica Neue",Arial,sans-serif;
  --font-body:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1160px; --measure:720px; --radius:10px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 var(--font-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:var(--font-head);margin:0;letter-spacing:-.012em;line-height:1.15;text-wrap:balance}
p{margin:0}
a{color:var(--teal-ink)}
img{max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:24px}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.eyebrow{font-family:var(--font-head);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.btn{display:inline-block;font:600 15px var(--font-body);padding:10px 16px;border-radius:8px;border:1px solid transparent;text-decoration:none;white-space:nowrap;cursor:pointer}
.btn-p{background:var(--teal);color:#fff}
.btn-p:hover{background:var(--teal-ink)}
.btn-s{border-color:var(--line);color:var(--ink);background:var(--paper)}
.btn-sm{padding:7px 12px;font-size:14px}
section.block{padding-block:56px}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.sec-head h2{font-size:28px;font-weight:800}
.sec-head p{color:var(--ink-2);max-width:60ch}
.sec-head a{color:var(--teal);font-weight:600;white-space:nowrap;text-decoration:none}

/* ---------- Header ---------- */
.site-header{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;gap:28px;min-height:64px}
.brand{font-family:var(--font-head);font-weight:800;font-size:19px;letter-spacing:-.02em;white-space:nowrap;text-decoration:none;color:var(--ink)}
.brand em{font-style:normal;color:var(--teal)}
.brand img{height:34px;width:auto;display:block}
.nav-main{flex:1}
.nav-main ul{list-style:none;margin:0;padding:0;display:flex;gap:22px}
.nav-main a{font-weight:600;font-size:15px;text-decoration:none;color:var(--ink);padding:20px 0;display:inline-block}
.nav-main .current-menu-item>a,.nav-main .current-menu-ancestor>a,.nav-main .current_page_parent>a{color:var(--teal);box-shadow:inset 0 -2px 0 var(--teal)}
.site-search{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;padding:0 10px;width:200px}
.site-search input{border:0;background:transparent;font:14px var(--font-body);padding:7px 4px;width:100%;color:var(--ink)}
.site-search button{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:4px}
.nav-toggle{display:none;border:1px solid var(--line);background:var(--paper);border-radius:8px;padding:8px 10px;font:600 14px var(--font-body);cursor:pointer;color:var(--ink)}

/* ---------- Home ---------- */
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding-block:64px 56px}
.hero h1{font-size:clamp(34px,4.4vw,54px);font-weight:800;margin-top:12px}
.hero h1 span{color:var(--teal)}
.hero .lede{font-size:19px;color:var(--ink-2);margin-top:18px;max-width:52ch}
.hero .ctas{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:26px;font-size:14px;color:var(--ink-2)}
.trust span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--teal);margin-right:8px;vertical-align:1px}
.trust a{color:inherit}
.datacard{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px 22px;position:relative;overflow:hidden}
.datacard .cap{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:12px}
.datacard .cap b{font-family:var(--font-head);font-size:15px}
.datacard .cap span{font-size:12px;color:var(--muted)}
.datacard table{font-size:14px;width:100%;table-layout:fixed}
.datacard td,.datacard th{overflow-wrap:anywhere}
.datacard td a{text-decoration:none;color:var(--ink);font-weight:600}
.datacard .plate{position:absolute;right:-30px;bottom:-30px;opacity:.5;pointer-events:none}
.vend{display:flex;align-items:center;gap:10px;font-weight:600}
.tile{width:30px;height:30px;border-radius:7px;display:grid;place-items:center;font-family:var(--font-head);font-weight:800;font-size:12px;color:var(--ink);flex:none}
.pill{display:inline-block;font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--teal-soft);color:var(--teal-ink);white-space:nowrap}
.pill-am{background:var(--amber-soft);color:var(--amber)}
.paths{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.path{border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;flex-direction:column;gap:10px;background:var(--paper)}
.path h3{font-size:19px;font-weight:700}
.path p{color:var(--ink-2);font-size:15px;flex:1}
.path .links{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600}
.path .links a{text-decoration:none}
.path .ico{width:44px;height:44px;border-radius:10px;background:var(--teal-soft);display:grid;place-items:center;color:var(--teal-ink)}
.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:20px 0 28px}
.stat-strip .stat{background:var(--paper);padding:16px 18px}
.stat-strip b{display:block;font-family:var(--font-mono);font-size:24px;font-weight:500;color:var(--teal-ink);font-variant-numeric:tabular-nums}
.stat-strip span{font-size:13px;color:var(--muted)}
.bench{background:var(--navy);color:var(--navy-ink);border-radius:14px;padding:36px 40px;display:grid;grid-template-columns:1.1fr 2fr;gap:36px;align-items:center}
.bench h2{font-size:26px;font-weight:800}
.bench p{opacity:.8;margin-top:10px;font-size:15px}
.bench .btn{margin-top:18px;background:#fff;color:var(--navy)}
.bench .eyebrow{color:#7ED3CE}
.bench .stat-strip{margin:0;background:rgba(255,255,255,.12);border:0}
.bench .stat-strip .stat{background:var(--navy)}
.bench .stat-strip b{color:#7ED3CE}
.bench .stat-strip span{opacity:.8;color:var(--navy-ink)}

/* ---------- Cards ---------- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{display:flex;flex-direction:column;gap:10px}
.card a{text-decoration:none;color:inherit}
.thumb{aspect-ratio:16/9;border-radius:var(--radius);display:flex;align-items:flex-end;padding:16px;position:relative;overflow:hidden;background:var(--panel)}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb .name{font-family:var(--font-head);font-weight:800;font-size:22px;letter-spacing:-.02em;line-height:1.05;position:relative;color:var(--ink)}
.thumb .type{position:absolute;top:12px;left:14px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.thumb svg{position:absolute;right:-10px;top:-10px;opacity:.55}
.card h3{font-size:18px;font-weight:700}
.card h3 a:hover{color:var(--teal-ink)}
.card .meta{font-size:13px;color:var(--muted)}
.card .meta a{color:var(--teal);font-weight:600}
.card .excerpt{font-size:15px;color:var(--ink-2)}
.guides{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.guides a{display:grid;grid-template-columns:1fr auto;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);align-items:center;text-decoration:none;color:inherit}
.guides a b{font-weight:600}
.guides a small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.guides a span{color:var(--teal);font-weight:700}

/* ---------- Author / newsletter / footer ---------- */
.author-box{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:24px 28px;background:var(--panel)}
.avatar{width:72px;height:72px;border-radius:50%;background:var(--teal-soft);display:grid;place-items:center;font-family:var(--font-head);font-weight:800;color:var(--teal-ink);font-size:22px;overflow:hidden;flex:none}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.author-box h3{font-size:19px}
.author-box p{color:var(--ink-2);font-size:15px;margin-top:4px;max-width:70ch}
.author-box .links{display:flex;gap:10px;flex-wrap:wrap}
.newsletter{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:36px}
.newsletter .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.newsletter h3{font-size:20px}
.newsletter p{color:var(--ink-2);font-size:15px}
.site-footer{background:var(--panel);padding-block:40px;font-size:14px;color:var(--ink-2);margin-top:40px}
.site-footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.site-footer h4{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.site-footer a{color:inherit;text-decoration:none}
.site-footer a:hover{color:var(--teal-ink)}
.site-footer .legal{grid-column:1/-1;border-top:1px solid var(--line);padding-top:16px;font-size:13px;color:var(--muted)}

/* ---------- Blog / archives ---------- */
.page-head{padding-block:48px 8px}
.crumb{font-size:13px;color:var(--muted);margin-bottom:14px}
.crumb a{color:inherit;text-decoration:none}
.crumb .rank-math-breadcrumb p{margin:0}
.page-head h1{font-size:clamp(30px,3.6vw,44px);font-weight:800;max-width:22ch}
.page-head .lede{font-size:18px;color:var(--ink-2);margin-top:14px;max-width:62ch}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 30px}
.filters a{font-size:14px;font-weight:600;padding:7px 12px;border-radius:999px;border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.filters a.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.filters a i{font-style:normal;color:var(--muted);font-weight:400;margin-left:4px}
.filters a.on i{color:inherit;opacity:.7}
.feat{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center;padding:0 0 40px;border-bottom:1px solid var(--line);margin-bottom:8px}
.feat .thumb{aspect-ratio:3/2}
.feat h2{font-size:32px;font-weight:800}
.feat h2 a{text-decoration:none;color:inherit}
.feat p{color:var(--ink-2);font-size:16px;margin-top:12px}
.list{display:grid;grid-template-columns:1fr 320px;gap:40px}
.row{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--line)}
.row .thumb{aspect-ratio:16/10;padding:12px}
.row .thumb .name{font-size:16px}
.row h3{font-size:19px}
.row h3 a{text-decoration:none;color:inherit}
.row p{color:var(--ink-2);font-size:15px;margin-top:6px}
.row .meta{font-size:13px;color:var(--muted);margin-top:8px}
.side{display:flex;flex-direction:column;gap:22px}
.box{border:1px solid var(--line);border-radius:12px;padding:20px}
.box h4{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.box ol{margin:0;padding-left:18px;display:grid;gap:8px;font-size:15px;font-weight:600}
.box ol a{text-decoration:none;color:inherit}
.box ol small{display:block;font-weight:400;color:var(--muted);font-size:13px}
.box.panel{background:var(--panel)}
.pagination{display:flex;gap:6px;justify-content:center;padding:28px 0;flex-wrap:wrap}
.pagination .page-numbers{padding:8px 12px;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink);font-weight:600;font-size:14px}
.pagination .current{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* ---------- Article / pilier ---------- */
.byline{display:flex;gap:12px;align-items:center;margin-top:20px;font-size:14px;color:var(--ink-2);flex-wrap:wrap}
.byline .avatar{width:32px;height:32px;font-size:12px}
.byline a{color:var(--teal);font-weight:600;text-decoration:none}
.byline .sep{color:var(--line)}
.jump{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.jump a{font-size:14px;font-weight:600;padding:7px 12px;border-radius:8px;background:var(--panel);border:1px solid var(--line);text-decoration:none;color:var(--ink)}
.article-head{padding-block:40px 28px;border-bottom:1px solid var(--line)}
.article-head .cat{margin-bottom:12px}
.article-head h1{font-size:clamp(30px,3.6vw,44px);font-weight:800;max-width:24ch}
.article-head .lede{font-size:18px;color:var(--ink-2);margin-top:14px;max-width:62ch}
.article-layout{display:grid;grid-template-columns:240px 1fr;gap:48px;padding-block:40px}
.article-layout.no-toc{grid-template-columns:1fr}
.toc{position:sticky;top:84px;align-self:start;font-size:14px}
.toc h4{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.toc ol{list-style:none;padding:0;margin:0;border-left:2px solid var(--line)}
.toc li{padding:6px 0 6px 14px;color:var(--ink-2)}
.toc li.h3{padding-left:26px;font-size:13px}
.toc a{color:inherit;text-decoration:none}
.toc li.on{color:var(--teal-ink);font-weight:600;border-left:2px solid var(--teal);margin-left:-2px}
.toc-toggle{display:none}
.entry{max-width:var(--measure)}
.entry .featured{margin:0 0 28px}
.entry .featured img{border-radius:var(--radius);width:100%}
.entry h2{font-size:26px;font-weight:800;margin:44px 0 14px;scroll-margin-top:84px}
.entry h3{font-size:20px;font-weight:700;margin:30px 0 10px;scroll-margin-top:84px}
.entry h4{font-size:17px;margin:22px 0 8px}
.entry p{font-size:17px;line-height:1.6;margin-bottom:16px}
.entry ul,.entry ol{margin:0 0 18px;padding-left:22px}
.entry li{margin-bottom:6px}
.entry a{text-decoration:underline;text-underline-offset:2px}
.entry img{border-radius:var(--radius)}
.entry figure{margin:22px 0}
.entry figcaption{font-size:13px;color:var(--muted);margin-top:6px}
.entry blockquote{border-left:4px solid var(--teal);margin:22px 0;padding:6px 20px;color:var(--ink-2);font-style:italic}
.entry hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.entry .wp-block-table,.entry table{margin:18px 0 26px}
.entry .wp-block-table{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius)}
.entry .wp-block-table table{margin:0}
table{border-collapse:collapse;width:100%;font-size:15px}
th{text-align:left;font-family:var(--font-head);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);background:var(--panel)}
td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
tr:last-child td{border-bottom:0}
.entry table.has-fixed-layout{table-layout:auto}
.quick-verdict,.callout{background:var(--panel);border-left:4px solid var(--teal);border-radius:0 var(--radius) var(--radius) 0;padding:18px 22px;margin:0 0 28px}
.quick-verdict .eyebrow,.callout-title{display:block;font-family:var(--font-head);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:6px}
.quick-verdict p,.callout p{font-size:16px;margin:0}
.callout ul{margin:6px 0 0;padding-left:18px;font-size:15px}
.callout-warn{border-color:var(--amber)} .callout-warn .callout-title{color:var(--amber)}
.callout-key{border-color:var(--navy)} .callout-key .callout-title{color:var(--navy)}
.callout-related{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--teal)}
.spec-table th{width:34%}
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0 26px}
.pros-cons > div{border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;font-size:15px}
.pros-cons > div > b{display:block;font-family:var(--font-head);font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px;color:var(--teal)}
.pros-cons > div.lim > b{color:var(--amber)}
.pros-cons ul{margin:0;padding-left:18px;color:var(--ink-2)}
.faq h3{font-size:18px}
.sources{font-size:14px;color:var(--ink-2)}
.sources ol{padding-left:20px}
.updated-note{font-size:14px;color:var(--ink-2);background:var(--panel);padding:12px 16px;border-radius:8px;margin-top:24px}
.independence{margin-top:36px;padding-top:18px;border-top:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.byind{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:18px 0 26px}
.byind a{border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;font-size:15px;text-decoration:none;color:inherit}
.byind a b{display:block;font-weight:600}
.byind a small{color:var(--muted);font-size:13px}
.byind .ico{width:36px;height:36px;border-radius:9px;background:var(--teal-soft);display:grid;place-items:center;color:var(--teal-ink)}
.related{padding-block:40px;border-top:1px solid var(--line)}
.related h2{font-size:24px;font-weight:800;margin-bottom:20px}
.entry-page{max-width:var(--measure);padding-block:40px}
.error-404{padding-block:80px;text-align:center}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .hero,.bench,.feat,.list,.article-layout,.guides{grid-template-columns:1fr}
  .paths,.grid,.stat-strip{grid-template-columns:1fr 1fr}
  .site-footer .wrap{grid-template-columns:1fr 1fr}
  .nav-main{display:none;position:absolute;left:0;right:0;top:64px;background:var(--paper);border-bottom:1px solid var(--line);padding:8px 24px 16px}
  .nav-main.open{display:block}
  .nav-main ul{flex-direction:column;gap:0}
  .nav-main a{padding:10px 0;display:block}
  .nav-toggle{display:inline-block;margin-left:auto}
  .site-search{display:none}
  .toc{position:static}
  .toc-toggle{display:inline-block;margin-bottom:10px}
  .toc ol,.toc h4{display:none} .toc.open ol,.toc.open h4{display:block}
}
@media (max-width:600px){
  .paths,.grid,.stat-strip,.pros-cons,.byind,.site-footer .wrap{grid-template-columns:1fr}
  .row{grid-template-columns:1fr}
  .author-box{grid-template-columns:1fr}
  .wrap{padding-inline:18px}
  section.block{padding-block:40px}
  .hero{padding-block:40px 32px}
  .bench{padding:28px 22px}
  body{font-size:16px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Encadrés issus des tableaux Google Docs (inc/docs-tables.php) */
.callout p+p{margin-top:8px}
.callout-card .callout-title{text-transform:none;letter-spacing:0;font-size:18px;color:var(--ink);margin-bottom:2px}
.callout-sub{display:block;font-size:14px;color:var(--muted);margin-bottom:10px}