/*
Theme Name: Astra Child - Console
Template: astra
Version: 1.0.0
Author: Adam Ould Aroussi
Description: Identite "console de supervision" - néon éditorial dark-only, portée sur Astra.
*/

:root{
  --bg:#05080F; --surface:#111827; --surface-2:#1B2333;
  --ink:#F3F4F6; --muted:#6B7280; --muted-2:#9CA3AF;
  --line:rgba(107,114,128,.18); --line-strong:rgba(107,114,128,.36);
  --signal:#00FF88; --signal-ink:#03140B; --signal-soft:rgba(0,255,136,.12);
  --display:'Bricolage Grotesque',system-ui,sans-serif;
  --sans:'IBM Plex Sans',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
}

/* Échelle fluide (rem) : tout le design est bâti en rem/ch/clamp() (Astra core inclus).
   En faisant grossir la police racine avec la largeur d'écran, texte, marges et gabarits
   grossissent ensemble jusqu'aux très grands écrans (1440p, 4K…) — sans quoi tout plafonne
   visuellement vers ~1100-1300px de large et paraît minuscule sur un moniteur 4K non zoomé.
   Bornes en rem : respecte le zoom navigateur (WCAG 1.4.4). 16px à ≤1280px → 22.4px à ≥3840px.
   Placé après le :root et avant les styles Astra du parent pour gagner la cascade (thème enfant). */
html{font-size:clamp(1rem, 0.8rem + 0.25vw, 1.4rem)!important;}

body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.6;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(55% 40% at 50% -6%, rgba(0,255,136,.07), transparent 72%),radial-gradient(150% 130% at 50% 8%, transparent 45%, rgba(0,0,0,.7) 100%);}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
::selection{background:var(--signal);color:var(--signal-ink)}

/* --- statusbar (Phase 3) --- */
.statusbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;
  padding:.55rem clamp(2rem,9vw,9rem);font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;
  color:var(--muted);text-transform:uppercase;border-bottom:1px solid var(--line);
  background:rgba(10,10,10,.72);backdrop-filter:blur(8px)}
.statusbar .live{display:inline-flex;align-items:center;gap:.45rem;color:var(--ink)}
.statusbar .dot{width:6px;height:6px;border-radius:50%;background:var(--signal);box-shadow:0 0 8px var(--signal);animation:console-pulse 2.4s ease-in-out infinite}
@keyframes console-pulse{0%,100%{opacity:.4}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.statusbar .dot{animation:none;opacity:1}}
.statusbar .sep{color:var(--line-strong)}.statusbar .push{margin-left:auto}
.statusbar a{color:inherit;text-decoration:none;transition:color .15s}.statusbar a:hover{color:var(--signal)}
.statusbar .tg{display:inline-flex;align-items:center;gap:.45rem;cursor:pointer;user-select:none}
.statusbar .tg input{display:none}
.statusbar .tg .sw{width:28px;height:14px;border:1px solid var(--line-strong);position:relative;transition:.2s;flex-shrink:0}
.statusbar .tg .sw::after{content:"";position:absolute;top:2px;left:2px;width:8px;height:8px;background:var(--muted);transition:.2s}
.statusbar .tg input:checked + .sw{border-color:var(--signal);background:var(--signal-soft)}
.statusbar .tg input:checked + .sw::after{left:16px;background:var(--signal)}
@media(max-width:820px){.statusbar .hide{display:none}}

/* --- navigation (Phase 3) --- */
.main-header-bar,.ast-mobile-header-content{background:var(--bg);border-color:var(--line)}
/* Astra genere aussi un trait clair (#eaeaea, theme clair) sur .main-header-menu (border-top) et
   .ast-primary-header-bar/.ast-above-header-bar (border-bottom), en plus de .main-header-bar : on
   les neutralise toutes plutot que de les recolorer une par une. */
.main-header-bar,.main-header-menu,.ast-primary-header-bar,.ast-above-header-bar,.ast-mobile-header-content{border:0!important}

/* --- Phase 13 : menu en onglets console (remplace la Phase 12, rendu "tout fusionne, meme
   poids" qui noyait le menu dans les donnees de statut). La marque + les onglets $ commande
   restent rendus directement dans .statusbar (hook astra_header_before) ; horloge + DISPO
   passent en repere discret a droite. La rangee Astra d'origine (#ast-desktop-header) reste
   masquee ; le menu mobile (#ast-mobile-header, bascule <=921.9px) n'est pas touche. --- */
#ast-desktop-header{display:none!important}
.statusbar.tabsbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:1.6rem}
.statusbar .sb-brand{font-family:var(--mono);font-weight:500;font-size:.82rem;letter-spacing:.02em;color:var(--ink);text-decoration:none;white-space:nowrap}
.statusbar .sb-brand b{color:var(--signal);font-weight:500}
.statusbar .sb-brand:hover{color:var(--signal)}
.statusbar .tabnav-list{display:flex;justify-content:center;list-style:none;margin:0;padding:0;gap:1.3rem}
.statusbar .tabnav-list .menu-link{display:inline-block;padding:.15rem 0;font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;text-transform:lowercase;color:var(--muted);text-decoration:none;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.statusbar .tabnav-list .menu-link::before{content:"$ ";color:var(--muted);opacity:.55}
.statusbar .tabnav-list .menu-link:hover{color:var(--ink)}
.statusbar .tabnav-list .current-menu-item .menu-link{color:var(--signal);border-bottom-color:var(--signal)}
.statusbar .tabnav-list .current-menu-item .menu-link::before{color:var(--signal);opacity:1}
@media(max-width:921px){.statusbar.tabsbar{display:flex}.statusbar .sb-brand,.statusbar .sb-nav{display:none}}
.main-header-menu .menu-item > .menu-link{font-family:var(--mono);font-size:.82rem;letter-spacing:.02em;color:var(--muted);text-transform:none}
.main-header-menu .menu-item > .menu-link:hover{color:var(--signal)}
.main-header-menu .current-menu-item > .menu-link,
.main-header-menu .current_page_item > .menu-link{color:var(--ink)}
.site-header,.ast-header-break-point,.main-header-bar-wrap{background:var(--bg)}

/* --- Bug menu mobile (tiroir <=921px) : le CSS dynamique d'Astra genere un fond blanc et un
   texte en couleurs globales (violettes), pense pour un theme clair, avec une specificite plus
   forte que nos regles desktop ci-dessus. On force nos tokens avec la meme specificite. --- */
.ast-mobile-header-wrap .ast-mobile-header-content,
.ast-desktop-header-content,
.ast-mobile-popup-content{background-color:var(--bg)!important}
@media(max-width:921px){
  .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item > .menu-link,
  .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item > .ast-menu-toggle{color:var(--muted)!important}
  .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item:hover > .menu-link,
  .ast-builder-menu-mobile .main-navigation .inline-on-mobile .menu-item:hover > .ast-menu-toggle,
  .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item.current-menu-item > .menu-link,
  .ast-builder-menu-mobile .main-navigation .inline-on-mobile .menu-item.current-menu-item > .ast-menu-toggle{color:var(--signal)!important}
  .ast-builder-menu-mobile .main-navigation .menu-item .menu-link,
  .ast-builder-menu-mobile .main-navigation .menu-item .sub-menu .menu-link{border-color:var(--line)!important}
}

/* --- homepage + index pages (Phase 4-5) : scopé à .wrap --- */
.wrap{margin:0 auto;max-width:1720px;padding:0 clamp(2rem,9vw,9rem);box-sizing:border-box}
.wrap *{box-sizing:border-box}
.wrap a{color:inherit;text-decoration:none}
.wrap .prompt{font-family:var(--mono);font-size:.8rem;color:var(--muted);letter-spacing:.02em;margin:0}
.wrap .prompt b{color:var(--signal);font-weight:400}
.wrap .rule{height:1px;background:var(--line);border:0;margin:0}
.wrap .section-no{font-family:var(--display);font-weight:700;font-size:clamp(3rem,7vw,5.5rem);line-height:1;color:transparent;-webkit-text-stroke:1px var(--line-strong)}

.wrap .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.wrap .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.wrap .reveal{opacity:1;transform:none;transition:none}.wrap .cursor{animation:none}}

.wrap .hero{padding:clamp(3rem,8vw,7rem) 0 clamp(2.5rem,6vw,5rem);display:grid;grid-template-columns:1.6fr minmax(300px,440px);gap:clamp(2rem,5vw,4.5rem);align-items:end;margin:0}
.wrap .hero .prompt{margin-bottom:1.4rem}
.wrap .cursor{display:inline-block;width:.5ch;height:1em;translate:0 .12em;background:var(--signal);animation:console-blink 1.15s steps(1,end) infinite}
@keyframes console-blink{0%,50%{opacity:1}50.01%,100%{opacity:0}}
.wrap .hero h1{font-family:var(--display);font-weight:700;font-size:clamp(3rem,8.5vw,6rem);line-height:.98;letter-spacing:-.03em;margin:0 0 1rem}
.wrap .hero .role{font-family:var(--mono);font-size:.92rem;color:var(--signal);letter-spacing:.01em;margin-bottom:1.8rem}
.wrap .hero .bio{max-width:46ch;color:var(--muted-2);font-size:1.05rem;line-height:1.75;margin:0}
.wrap .hero .bio strong{color:var(--ink);font-weight:500}
.wrap .cta{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2.2rem;font-family:var(--mono);font-size:.82rem}
.wrap .btn{display:inline-flex;align-items:center;gap:.6rem;padding:.85rem 1.35rem;letter-spacing:.02em;transition:.2s;cursor:pointer}
.wrap .btn-primary{background:var(--signal);color:var(--signal-ink);font-weight:500}
.wrap .btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px -12px rgba(0,255,136,.5)}
.wrap .btn-ghost{border:1px solid var(--line-strong);color:var(--ink)}
.wrap .btn-ghost:hover{border-color:var(--signal);color:var(--signal)}
.wrap .portrait{position:relative;width:100%;justify-self:end;aspect-ratio:3/4;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--bg)}
.wrap .portrait img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(65%) contrast(1.03);transition:transform .5s cubic-bezier(.16,1,.3,1),filter .5s ease}
.wrap .portrait:hover img{transform:scale(1.08);filter:grayscale(0%) contrast(1)}
@media(prefers-reduced-motion:reduce){.wrap .portrait img{transition:none}.wrap .portrait:hover img{transform:none}}

/* Vignette : la photo a un fond blanc uni qui tranchait comme un rectangle colle sur le theme
   sombre. On assombrit les bords vers --surface-2 (multiply) sans toucher au fichier original,
   le centre (visage) reste net. Au-dessus de l'image mais sous les reperes d'angle (z-index:2). */
.wrap .portrait::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 100% at 50% 32%, transparent 55%, var(--bg) 100%)}
.wrap .tick{position:absolute;width:12px;height:12px;border:1px solid var(--signal);z-index:2}
.wrap .tick.tl{top:8px;left:8px;border-right:0;border-bottom:0;transform-origin:top left}.wrap .tick.tr{top:8px;right:8px;border-left:0;border-bottom:0;transform-origin:top right}
.wrap .tick.bl{bottom:8px;left:8px;border-right:0;border-top:0;transform-origin:bottom left}.wrap .tick.br{bottom:8px;right:8px;border-left:0;border-top:0;transform-origin:bottom right}
.wrap .portrait .tick{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.wrap .portrait:hover .tick{transform:scale(1.35)}
@media(prefers-reduced-motion:reduce){.wrap .portrait .tick{transition:none}.wrap .portrait:hover .tick{transform:none}}

.wrap .stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line-strong);background:rgba(17,24,39,.35);margin:0 0 clamp(3rem,7vw,6rem)}
.wrap .stats .stat{padding:1.4rem 1.5rem;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:.25rem}
.wrap .stats .stat:last-child{border-right:0}
.wrap .stats .n{font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1;color:var(--signal)}
.wrap .stats .l{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
@media(max-width:720px){.wrap .stats{grid-template-columns:1fr}.wrap .stats .stat{border-right:0;border-bottom:1px solid var(--line)}.wrap .stats .stat:last-child{border-bottom:0}}

.wrap section.block{padding:clamp(3rem,7vw,6rem) 0}
.wrap .sec-head{display:flex;align-items:flex-start;gap:1.5rem;margin-bottom:2.4rem}
.wrap .sec-head .meta{flex:1}.wrap .sec-head .prompt{margin-bottom:.7rem}
.wrap .sec-head h2{font-family:var(--display);font-weight:600;font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.02;letter-spacing:-.02em;margin:0}

.wrap .feature{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:stretch;border:1px solid var(--line-strong);background:linear-gradient(180deg,var(--signal-soft),transparent)}
.wrap .feature .media{position:relative;min-height:340px;border-right:1px solid var(--line-strong);overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--surface-2)}
.wrap .feature .body{padding:clamp(1.5rem,3vw,2.5rem);display:flex;flex-direction:column;justify-content:center;gap:1rem}
.wrap .feature .kick{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--signal)}
.wrap .feature h3{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.5vw,2.6rem);line-height:1.04;letter-spacing:-.02em;margin:0}
.wrap .feature p{color:var(--muted-2);max-width:52ch;margin:0}
.wrap .feature .go{font-family:var(--mono);font-size:.78rem;color:var(--signal);margin-top:.6rem}

.wrap .pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0}
.wrap .card{border-top:1px solid var(--line-strong);padding:1.6rem 1.6rem 2rem;position:relative;transition:background .25s}
.wrap .card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--signal);transform:scaleY(0);transform-origin:top;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.wrap .card:hover::before{transform:scaleY(1)}
.wrap .card:hover{background:linear-gradient(90deg,var(--signal-soft),transparent 45%)}
.wrap .card .idx{font-family:var(--mono);font-size:.68rem;color:var(--muted);letter-spacing:.14em}
.wrap .card .thumb{position:relative;aspect-ratio:8/5;margin:1.1rem 0;overflow:hidden;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--surface-2)}
.wrap .card .thumb .tick{width:10px;height:10px}
.wrap .card .thumb .tick.tl{top:7px;left:7px}.wrap .card .thumb .tick.br{bottom:7px;right:7px}
.wrap .nosig{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--line);padding:.35rem .6rem}
.wrap .nosig .b{width:6px;height:6px;border-radius:50%;background:var(--signal);box-shadow:0 0 8px var(--signal)}
.wrap .card h3{font-family:var(--display);font-weight:600;font-size:1.4rem;line-height:1.12;margin:.5rem 0 .7rem;letter-spacing:-.015em}
.wrap .card:hover h3{color:var(--signal)}
.wrap .card p{color:var(--muted-2);font-size:.92rem;line-height:1.65;margin:0}
.wrap .card .more{font-family:var(--mono);font-size:.74rem;color:var(--muted);margin-top:1.1rem;display:inline-block}
.wrap .card:hover .more{color:var(--signal)}

.wrap .tech{border-top:1px solid var(--line-strong)}
.wrap .tech-row{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:1.6rem;align-items:center;padding:1.5rem 1.5rem 1.5rem 1.3rem;border-bottom:1px solid var(--line);position:relative;transition:background .25s}
.wrap .tech-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--signal);transform:scaleY(0);transform-origin:top;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.wrap .tech-row:hover::before{transform:scaleY(1)}
.wrap .tech-row:hover{background:linear-gradient(90deg,var(--signal-soft),transparent 45%)}
.wrap .tdom h3{font-family:var(--display);font-weight:600;font-size:1.25rem;letter-spacing:-.01em;margin:0 0 .15rem}
.wrap .tdesc{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.wrap .ttags{display:flex;flex-wrap:wrap;gap:.5rem}
.wrap .ttags span{font-family:var(--mono);font-size:.75rem;color:var(--ink);border:1px solid var(--line-strong);padding:.35rem .7rem;transition:.15s}
.wrap .ttags span:hover{border-color:var(--signal);color:var(--signal);background:var(--signal-soft)}
@media(max-width:720px){.wrap .tech-row{grid-template-columns:1fr;gap:.7rem;padding-top:1.3rem;padding-bottom:1.3rem}}

.wrap .chips{display:flex;flex-wrap:wrap;gap:.6rem}
.wrap .chip{font-family:var(--mono);font-size:.78rem;color:var(--ink);padding:.5rem .85rem;border:1px solid var(--line-strong);display:inline-flex;align-items:center;gap:.55rem;transition:.18s}
.wrap .chip::before{content:"▸";color:var(--signal);font-size:.7rem}
.wrap .chip:hover{border-color:var(--signal);background:var(--signal-soft)}

.wrap .timeline{border-left:1px solid var(--line-strong);padding-left:2rem;display:flex;flex-direction:column;gap:2.4rem}
.wrap .tl-item{position:relative}
.wrap .tl-item::before{content:"";position:absolute;left:-2.5rem;top:.35rem;width:9px;height:9px;background:var(--signal);border-radius:50%;box-shadow:0 0 0 4px var(--bg)}
.wrap .tl-item .date{font-family:var(--mono);font-size:.72rem;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.wrap .tl-item h3{font-family:var(--display);font-weight:600;font-size:1.3rem;margin:.4rem 0 .2rem;letter-spacing:-.01em}
.wrap .tl-item .org{color:var(--signal);font-family:var(--mono);font-size:.8rem}
.wrap .tl-item p{color:var(--muted-2);margin-top:.5rem;max-width:60ch;font-size:.96rem}

.wrap .certs{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.wrap .cert{display:flex;align-items:baseline;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.wrap .cert .st{font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;padding:.2rem .5rem;border:1px solid var(--line-strong);text-transform:uppercase;white-space:nowrap}
.wrap .cert .st.ok{color:var(--signal);border-color:rgba(0,255,136,.4)}
.wrap .cert .st.wip{color:var(--muted)}
.wrap .cert .nm{font-family:var(--display);font-weight:600;font-size:1.15rem}
.wrap .cert .iss{color:var(--muted);font-family:var(--mono);font-size:.78rem;margin-left:auto}

.wrap .contact{padding:clamp(3rem,8vw,6rem) 0}
.wrap .contact .prompt{margin-bottom:1.4rem}
.wrap .contact h2{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,6vw,4.5rem);line-height:1;letter-spacing:-.03em;max-width:16ch;margin:0}
.wrap .contact h2 em{font-style:normal;color:var(--signal)}
.wrap .contact .avail{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.78rem;color:var(--signal);margin:1.6rem 0}

@media(max-width:820px){.wrap .hero{grid-template-columns:1fr}.wrap .portrait{max-width:320px}.wrap .feature{grid-template-columns:1fr}.wrap .feature .media{border-right:0;border-bottom:1px solid var(--line-strong)}}

/* --- Phase 5 : fiches individuelles (projet + article) --- */
.entry-title{font-family:var(--display);font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.entry-content{font-family:var(--sans);color:var(--muted-2);line-height:1.75;max-width:72ch;margin-left:auto;margin-right:auto;padding-left:clamp(1rem,4vw,2rem);padding-right:clamp(1rem,4vw,2rem);box-sizing:content-box}
.entry-content h2{font-family:var(--display);font-weight:600;color:var(--ink);letter-spacing:-.015em;margin:2.2rem 0 1rem}
.entry-content h3{font-family:var(--display);font-weight:600;color:var(--ink);letter-spacing:-.01em;margin:1.8rem 0 .8rem}
.entry-content p{margin:0 0 1.2rem}
.entry-content a{color:var(--signal);text-decoration:underline;text-decoration-color:var(--signal-soft)}
.entry-content a:hover{text-decoration-color:var(--signal)}
.entry-content img{border:1px solid var(--line-strong);max-width:100%;height:auto}
.entry-content ul,.entry-content ol{padding-left:1.4rem;margin:0 0 1.2rem}
.entry-content li{margin-bottom:.4rem}
.entry-content code{font-family:var(--mono);background:var(--surface);color:var(--signal);padding:.1rem .4rem;font-size:.9em}
.entry-content blockquote{border-left:2px solid var(--signal);padding-left:1.2rem;color:var(--muted-2);font-style:normal}
.ast-single-post .ast-container,.single-portfolio .ast-container{background:var(--bg)}
.single-portfolio .entry-header,.single-post .entry-header{margin-bottom:1.5rem}
.entry-meta,.posted-on,.post-meta{font-family:var(--mono);font-size:.78rem;color:var(--muted);letter-spacing:.04em}
.entry-header,.entry-meta{max-width:72ch;margin-left:auto;margin-right:auto;padding-left:clamp(1rem,4vw,2rem);padding-right:clamp(1rem,4vw,2rem);box-sizing:content-box}

/* --- Bug lisibilite (page Confidentialite) : l'editeur de blocs a colore les titres avec les
   "couleurs globales" Astra (violet, pense pour un theme clair). WordPress genere ces classes
   avec !important dans le CSS du coeur, ce qui gagnait sur nos regles sans !important.
   On neutralise avec une regle plus specifique + !important pour revenir au blanc casse. --- */
.entry-content [class*="has-ast-global-color-"],
.entry-content.has-text-color,
.entry-content .has-text-color{color:var(--ink)!important}

/* --- Phase 9 : marque textuelle (remplace le logo image generique), fusionnee dans la meme
   rangee que le menu (au lieu d'une rangee separee au-dessus) : le logo Astra masque
   auparavant sert desormais de point d'accroche pour notre lien texte, injecte via le filtre
   get_custom_logo dans console-child-theme-enqueue.php. --- */
.ast-site-identity{display:flex;align-items:center;padding-left:10rem}
@media(max-width:921px){.ast-site-identity{padding-left:0}}
.ast-site-identity .ast-site-identity-logo{display:flex;align-items:center}
.console-brand{font-family:var(--mono);font-size:.82rem;font-weight:500;letter-spacing:.02em;color:var(--ink);text-decoration:none;line-height:1}
.console-brand b{color:var(--signal);font-weight:500}
.console-brand:hover{color:var(--signal)}

.wrap .tech-row p{color:var(--muted-2);font-size:.92rem;line-height:1.65;margin:0;max-width:56ch}

/* --- correction couleur des titres : Astra a une regle plus specifique (probablement #content h2) qui gagnait malgre la classe .wrap, donc !important ici. h4/h5/h6 ajoutes
   (bug lisibilite : les H4 heritaient de la couleur de titre sombre par defaut d'Astra, invisible sur fond fonce) --- */
.wrap .sec-head h2,.wrap .tdom h3,.wrap .card h3,.wrap .tl-item h3,.wrap .cert .nm,.wrap .feature h3,.wrap .hero h1,.wrap h1,.wrap h2,.wrap h3,.wrap h4,.wrap h5,.wrap h6{color:var(--ink)!important}
.wrap .card:hover h3{color:var(--signal)!important}

/* --- pied de page "colle" au bas de la fenetre quand le contenu est court (ex: page veille
   avec peu d'articles) : sans ca, le footer suit directement le contenu court et laisse un
   grand vide non maitrise sous lui jusqu'au bas de l'ecran, qui se lit comme un footer
   demesure. #content s'etire pour combler l'espace restant, le footer reste juste en dessous. --- */
#page{min-height:100vh;display:flex;flex-direction:column}
#content{flex:1 0 auto}

/* --- footer console (remplace le Footer Builder Astra), deux lignes centrees --- */
.site-below-footer-wrap{display:none!important}
.console-footer{margin-top:2rem;border-top:1px solid var(--line);padding:2rem clamp(2rem,9vw,9rem);display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center;font-family:var(--sans);font-size:.85rem;color:var(--muted-2)}
.console-footer b{color:var(--ink);font-weight:500}

.wrap .cert{flex-wrap:wrap}
.wrap .cert .badge-link{font-family:var(--mono);font-size:.72rem;color:var(--signal);text-decoration:none;white-space:nowrap}
.wrap .cert .badge-link:hover{text-decoration:underline}

/* --- halo lumineux qui suit le curseur (manquant depuis le debut - CSS jamais porte) --- */
#halo{position:fixed;left:0;top:0;width:240px;height:240px;border-radius:50%;pointer-events:none;z-index:100;opacity:0;transform:translate(-50%,-50%);background:radial-gradient(circle, rgba(0,255,136,.12), transparent 62%);filter:blur(6px);transition:opacity .5s}
@media(prefers-reduced-motion:reduce){#halo{display:none}}
@media(pointer:coarse){#halo{display:none}}
body.no-fx #halo{display:none}

/* --- survol du bloc Projet phare (feature), comme les cartes .card --- */
.wrap .feature{position:relative;transition:background .25s}
.wrap .feature::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--signal);transform:scaleY(0);transform-origin:top;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.wrap .feature:hover::before{transform:scaleY(1)}
.wrap .feature:hover{background:linear-gradient(180deg,var(--signal-soft),rgba(0,255,136,.04))}
.wrap .feature:hover h3{color:var(--signal)!important}

/* --- K2 : barre laterale (accent gauche + fond teinte, deja sur .feature) + zoom x3 sur l'image --- */
.wrap .feature .media{overflow:hidden}
.wrap .feature .media img{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.wrap .feature:hover .media img{transform:scale(1.18)}
@media(prefers-reduced-motion:reduce){.wrap .feature .media img{transition:none}.wrap .feature:hover .media img{transform:none}}

/* --- neutralise le conteneur etroit d'Astra (1240px), principe "full marges" du design system --- */
/* .entry-content garde son propre plafond de 72ch pour la lisibilite des articles */
.ast-container{max-width:100%!important}

/* --- Phase 10 : template article "journal" (integration de maquettes/journal/journal-base.html)
   pour les single articles de veille (post_type=post). Le chrome (statusbar, nav, footer) est
   deja fourni par les hooks astra_header_before/astra_footer_after ci-dessus ; ici uniquement
   les composants propres au corps de l'article : lien retour, metabar, bandeau image pleine
   largeur, colonne de lecture large (92ch) avec lettrine, marqueur de fin, pager precedent/suivant. --- */
.wrap .back{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:inline-flex;gap:.5rem;transition:color .15s;margin-top:1.5rem}
.wrap .back:hover{color:var(--signal)}

.wrap .article-title{font-family:var(--display);font-weight:700;font-size:clamp(2.6rem,6.5vw,5.2rem);line-height:.98;letter-spacing:-.03em;margin:1.4rem 0 1.8rem}

.wrap .metabar{display:flex;flex-wrap:wrap;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2.5rem}
.wrap .metabar span{padding:.65rem 1.1rem;border-right:1px solid var(--line);color:var(--muted)}
.wrap .metabar span:first-child{padding-left:0}
.wrap .metabar span:last-child{border-right:0;margin-left:auto;padding-right:0}
.wrap .metabar b{color:var(--signal);font-weight:400}

.wrap .spread{position:relative;aspect-ratio:1700/700;border:1px solid var(--line-strong);margin:1.5rem 0 2rem;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:linear-gradient(135deg,var(--signal-soft),transparent 55%),repeating-linear-gradient(-45deg,var(--surface) 0,var(--surface) 1px,transparent 1px,transparent 12px),var(--surface-2)}
.wrap .spread img{width:100%;height:100%;object-fit:cover;display:block}
.wrap .spread .cap{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;color:var(--muted);text-transform:uppercase}

/* --- Phase 11 : typographie de lecture retravaillee (police/style/taille uniquement) pour
   que le corps des articles et des projets soit facile a lire : corps de texte plus grand
   (1.15rem) avec un interlignage genereux (1.8) au lieu d'heriter du 1.6 compact du site,
   hierarchie de titres plus marquee (h2 a h6 nettement plus grands que le corps), emphase
   (gras/italique/liens) plus lisible. La largeur (92ch) et la mise en page ne changent pas. --- */
.wrap .paper{max-width:min(100%, 92ch);margin:0 auto;padding-bottom:2rem}
.wrap .paper p{color:var(--muted-2);margin-bottom:1.4em;font-size:1.15rem;line-height:1.8;font-weight:400}
.wrap .paper p:first-of-type::first-letter{font-family:var(--display);font-weight:700;font-size:3.4em;line-height:.82;float:left;padding:.04em .14em 0 0;color:var(--signal)}
.wrap .paper strong{color:var(--ink);font-weight:700}
.wrap .paper em{color:var(--ink);font-style:italic}
.wrap .paper h2{font-family:var(--display);font-weight:700;font-size:1.9rem;letter-spacing:-.02em;line-height:1.2;margin:1.7em 0 .8em;display:flex;gap:.6rem;align-items:baseline}
.wrap .paper h2::before{content:"##";font-family:var(--mono);font-size:.65em;color:var(--signal);font-weight:400}
.wrap .paper h3{font-family:var(--display);font-weight:600;font-size:1.4rem;letter-spacing:-.01em;line-height:1.3;margin:1.5em 0 .6em;color:var(--ink)}
.wrap .paper h4{font-family:var(--display);font-weight:600;font-size:1.2rem;letter-spacing:-.01em;line-height:1.35;margin:1.3em 0 .5em;color:var(--ink)}
.wrap .paper h5{font-family:var(--display);font-weight:600;font-size:1.05rem;letter-spacing:-.005em;line-height:1.4;margin:1.2em 0 .45em;color:var(--ink)}
.wrap .paper h6{font-family:var(--display);font-weight:600;font-size:.95rem;letter-spacing:0;line-height:1.4;margin:1.1em 0 .4em;color:var(--ink)}
.wrap .paper ul,.wrap .paper ol{padding-left:1.1rem;color:var(--muted-2);list-style:none;margin-bottom:1.4em;font-size:1.12rem;line-height:1.8}
.wrap .paper ul li,.wrap .paper ol li{position:relative;padding-left:1.15rem;margin-top:.6em}
.wrap .paper ul li::before{content:"▸";position:absolute;left:0;color:var(--signal);font-size:.8em;top:.3em}
.wrap .paper code{font-family:var(--mono);font-size:.88em;background:var(--surface-2);border:1px solid var(--line);padding:.15em .45em;color:var(--signal);border-radius:2px}
.wrap .paper pre{background:var(--surface);border:1px solid var(--line-strong);padding:1.2rem 1.4rem;overflow-x:auto;font-family:var(--mono);font-size:.86rem;line-height:1.8;color:var(--ink);margin-bottom:1.4em}
.wrap .paper pre code{background:none;border:0;padding:0;color:inherit}
.wrap .paper blockquote{border-left:3px solid var(--signal);padding-left:1.3rem;color:var(--ink);font-family:var(--display);font-weight:600;font-size:1.35rem;line-height:1.5;margin:1.7em 0}
.wrap .paper img{border:1px solid var(--line-strong);max-width:100%;height:auto;margin-bottom:1.4em}
.wrap .paper a{color:var(--signal);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--signal-soft);transition:text-decoration-color .15s}
.wrap .paper a:hover{text-decoration-color:var(--signal)}

.wrap .eof{display:flex;align-items:center;gap:1rem;margin:2rem 0;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
.wrap .eof::before,.wrap .eof::after{content:"";flex:1;height:1px;background:var(--line)}

.wrap .pager{display:grid;gap:1rem;grid-template-columns:1fr 1fr;padding-bottom:4rem}
.wrap .pcard{border:1px solid var(--line);padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.35rem;transition:.2s;position:relative;color:inherit;text-decoration:none}
.wrap .pcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--signal);transform:scaleY(0);transform-origin:top;transition:transform .3s}
.wrap .pcard:hover{border-color:var(--line-strong);background:linear-gradient(90deg,var(--signal-soft),transparent 50%)}
.wrap .pcard:hover::before{transform:scaleY(1)}
.wrap .pcard .k{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.wrap .pcard .t{font-family:var(--display);font-weight:600;font-size:.98rem;line-height:1.3}
.wrap .pcard:hover .t{color:var(--signal)}
.wrap .pcard.next{text-align:right;align-items:flex-end}
@media(max-width:640px){.wrap .pager{grid-template-columns:1fr}}