/* =========================================================
   Tematek Modern — feuille de style du thème WordPress.
   Tous les styles du thème vivent ici (chargée via functions.php).
   ========================================================= */

/* ---- POLICE SORA (auto-hébergée — RGPD : aucune requête vers Google) ----
   Police variable (un fichier par sous-ensemble couvre les poids 100→800).
   url() résolue relativement à ce fichier (assets/) → assets/fonts/…
   Sous-ensemble « latin » : couvre les accents français (U+0000–00FF). */
@font-face{
  font-family:'Sora';font-style:normal;font-weight:100 800;font-display:swap;
  src:url(fonts/sora-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Sora';font-style:normal;font-weight:100 800;font-display:swap;
  src:url(fonts/sora-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

*{box-sizing:border-box;margin:0;padding:0;}
:root{
  --rad:18px; --rad-card:14px; --rad-btn:12px; --rad-pill:30px; --rad-sm:10px; --rad-input:14px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --font-display:'Sora','Segoe UI',Verdana,Arial,sans-serif;
  --font-body:'Segoe UI',Verdana,Arial,sans-serif;
  /* Palette d'origine du site (repo 2026-Tematek-Theme) : cinq teintes feutrées,
     une par rubrique. Les variantes « mid » servent d'accents lumineux lisibles
     sur le fond sombre ; les teintes « deep » aux remplissages pleins / dégradés. */
  --cinema:#5a4d82; --serie:#1a88be; --jeux:#b07898; --livres:#a6826e; --accueil:#5b7a8f;
  --cinema-deep:#27213C; --serie-deep:#0471A6; --jeux-deep:#9D6381; --livres-deep:#96705B; --accueil-deep:#354857;
  /* Marque //Tematek — bleu ardoise, distinct des rubriques feutrées. */
  --brand-mark:#5b7a8f;
  --g-cinema:linear-gradient(135deg,#27213C 0%,#372f53 50%,#27213C 100%);
  --g-serie:linear-gradient(135deg,#0471A6 0%,#1a88be 50%,#0471A6 100%);
  --g-jeux:linear-gradient(135deg,#9D6381 0%,#b07898 50%,#9D6381 100%);
  --g-livres:linear-gradient(135deg,#96705B 0%,#a6826e 50%,#96705B 100%);
  --g-accueil:linear-gradient(135deg,#354857 0%,#435a6a 50%,#354857 100%);
}
/* ---- THEMES ---- */
[data-theme="dark"]{
  --bg-grad:radial-gradient(1200px 700px at 80% -10%,#26384a 0%,transparent 55%),linear-gradient(160deg,#141c24,#1d2a35 55%,#141c24);
  --txt:#eef3f7; --mut:#9fb1bd; --panel:rgba(255,255,255,.045); --panel2:rgba(255,255,255,.08);
  --bord:rgba(255,255,255,.09); --rail:rgba(10,15,20,.6); --shadow:0 18px 40px rgba(0,0,0,.45);
  --chip-on:#fff; --chip-on-txt:#16202a;
}
[data-theme="light"]{
  --bg-grad:radial-gradient(1100px 650px at 80% -10%,#52708a 0%,transparent 55%),linear-gradient(160deg,#34495a,#41596b 55%,#34495a);
  --txt:#f4f8fb; --mut:#c2d2dd; --panel:rgba(255,255,255,.08); --panel2:rgba(255,255,255,.14);
  --bord:rgba(255,255,255,.16); --rail:rgba(20,32,42,.55); --shadow:0 18px 40px rgba(0,0,0,.30);
  --chip-on:#fff; --chip-on-txt:#1d2a35;
}
html,body{height:100%;}
/* Stabilité horizontale (desktop + mobile) : aucun glissement latéral.
   `clip` n'établit pas de conteneur de défilement → ne casse pas le rail sticky. */
html{overflow-x:clip;}
body{font-family:var(--font-body);color:var(--txt);background:var(--bg-grad);
  background-attachment:fixed;min-height:100vh;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
.muted{color:var(--mut);}
/* ---- TITRES (Sora) ---- */
.rail .logo,.sec h2,.hero h1,.single-body h1,
.ph-big,.glabel .gname,.stat-total b,.stat b,.foot-about h4,
.err404 .err-code,.err404 .err-title{font-family:var(--font-display);}

/* ---- ICÔNES (Lucide inline) ---- */
.ico{display:inline-flex;align-items:center;justify-content:center;line-height:0;vertical-align:-.18em;}
.ico svg{display:block;}

/* ---- LAYOUT ---- */
.app{display:flex;min-height:100vh;position:relative;z-index:1;}
.main{flex:1;padding:26px 34px 60px;min-width:0;}
.wrap{max-width:1280px;margin:0 auto;}

/* ---- ICON RAIL ---- */
.rail{position:sticky;top:0;align-self:flex-start;height:100vh;width:84px;flex:0 0 84px;
  background:var(--rail);backdrop-filter:blur(14px);border-right:1px solid var(--bord);
  display:flex;flex-direction:column;align-items:center;padding:18px 0 76px;gap:6px;z-index:40;transition:width .22s var(--ease),flex-basis .22s var(--ease);}
/* Logo //Tematek — slash en couleur de marque, nom blanc une fois déployé. */
.rail .logo{font-weight:900;font-size:24px;letter-spacing:-1px;color:var(--brand-mark);margin-bottom:12px;
  display:flex;flex-direction:column;align-items:center;line-height:1;white-space:nowrap;}
.rail .logo .logo-word{display:none;color:var(--txt);font-weight:800;letter-spacing:-.02em;}
.rail .logo small,.rail .logo .logo-tmtk{display:block;font-size:9px;letter-spacing:3px;color:var(--mut);font-weight:700;margin-top:4px;}
.nav-i{width:60px;min-height:50px;border-radius:15px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:3px;color:var(--mut);font-size:19px;position:relative;transition:.18s;cursor:pointer;}
.nav-i b{font-size:8.5px;font-weight:700;letter-spacing:.3px;white-space:nowrap;}
/* Survol : pas de bulle de fond — l'icône rayonne dans la couleur de la rubrique. */
.nav-i .ico{transition:transform .18s var(--ease),color .18s,filter .18s;}
.nav-i:hover{color:var(--txt);}
.nav-i:hover .ico{color:var(--ac,var(--accueil));transform:scale(1.14);
  filter:drop-shadow(0 0 8px color-mix(in srgb,var(--ac,var(--accueil)) 80%,transparent));}
.nav-i:hover b{text-shadow:0 0 12px color-mix(in srgb,var(--ac,var(--accueil)) 55%,transparent);}
/* Actif : juste l'indicateur de couleur sur le côté (plus de bulle). */
.nav-i.active{color:var(--txt);}
.nav-i.active .ico{color:var(--ac,var(--accueil));}
.nav-i.active::before{content:'';position:absolute;left:-2px;top:11px;bottom:11px;width:4px;border-radius:4px;
  background:var(--ac,#fff);box-shadow:0 0 12px var(--ac,var(--accueil));}
.rail .sp{flex:1;}
/* séparateur entre rubriques et fonctions (archives) */
.rail-sep{width:36px;height:1px;background:var(--bord);margin:8px 0;flex:0 0 auto;}
/* bouton déplier / réduire (au clic, pas au survol) */
.rail-toggle{width:60px;min-height:42px;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  color:var(--mut);background:none;border:none;cursor:pointer;transition:.15s;font-family:var(--font-body);}
.rail-toggle:hover{background:var(--panel);color:var(--txt);}
.rail-toggle b{font-size:8.5px;font-weight:700;letter-spacing:.3px;}
.rail-toggle .ico{transition:transform .22s var(--ease);}
.rail-toggle:hover .ico{transform:translateX(2px);}
/* rail déployé (état épinglé, déclenché au clic) */
.rail.expanded{width:210px;flex-basis:210px;align-items:stretch;padding-left:14px;padding-right:14px;}
.rail.expanded .logo{font-size:22px;margin-left:14px;flex-direction:row;align-items:baseline;gap:1px;}
.rail.expanded .logo .logo-word{display:inline;}
.rail.expanded .logo .logo-tmtk{display:none;}
.rail.expanded .nav-i{flex-direction:row;justify-content:flex-start;gap:14px;width:100%;padding:0 14px;min-height:46px;}
.rail.expanded .nav-i b{font-size:14px;font-weight:600;}
.rail.expanded .nav-i.active::before{left:-14px;}
.rail.expanded .rail-sep{width:100%;}
.rail.expanded .rail-toggle{flex-direction:row;justify-content:flex-start;gap:14px;width:100%;padding:0 14px;}
.rail.expanded .rail-toggle b{font-size:14px;font-weight:600;letter-spacing:0;}
.rail.expanded .rail-toggle .ico{transform:rotate(180deg);}
.rail.expanded .rail-toggle:hover .ico{transform:rotate(180deg) translateX(2px);}

/* ---- BARRE DE RECHERCHE (sur la ligne du titre) ---- */
.search{margin-left:auto;display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--bord);
  border-radius:14px;padding:11px 16px;width:min(360px,46vw);color:var(--mut);font-size:14px;cursor:text;transition:.18s;}
.search:hover{background:var(--panel2);}
.search .kbd{margin-left:auto;font-size:11px;background:var(--panel2);border:1px solid var(--bord);border-radius:6px;padding:2px 7px;}
.tog{display:flex;background:var(--panel);border:1px solid var(--bord);border-radius:12px;overflow:hidden;}
.tog button{padding:9px 11px;font-size:14px;color:var(--mut);background:none;border:none;cursor:pointer;}
.tog button.on{background:var(--panel2);color:var(--txt);}

/* ---- SECTION TITLE ---- */
.sec{display:flex;align-items:baseline;gap:12px;margin:6px 0 16px;}
.sec h2{font-size:19px;font-weight:800;letter-spacing:-.3px;}
.sec .ln{flex:1;height:1px;background:var(--bord);}
.sec .more{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;color:var(--mut);cursor:pointer;}
.sec .more:hover{color:var(--txt);}

/* ---- HERO ---- */
.hero{position:relative;display:grid;grid-template-columns:300px 1fr;gap:30px;background:var(--panel);
  border:1px solid var(--bord);border-radius:var(--rad);padding:22px;margin-bottom:30px;box-shadow:var(--shadow);
  transition:transform .2s ease,box-shadow .2s ease;overflow:hidden;}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 260px at 16% -10%,var(--page-ac),transparent 68%);
  opacity:.18;pointer-events:none;}
.hero:hover{transform:translateY(-2px);}
/* Quand le héros vit dans l'encadré « À la une », on retire son propre panneau
   (fond/bordure/ombre) pour éviter le double cadre. */
.hero--inrow{margin:0;padding:0;background:transparent;border:none;box-shadow:none;overflow:visible;}
.hero--inrow::before{display:none;}
.hero--inrow:hover{transform:none;}
.hero .poster{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:2/3;
  box-shadow:0 0 0 1px rgba(255,255,255,.12),var(--shadow);}
.hero .poster,.hero .body{position:relative;z-index:1;}
.hero .body{display:flex;flex-direction:column;justify-content:center;}
.hero h1{font-size:clamp(26px,4vw,38px);font-weight:800;letter-spacing:-.022em;line-height:1.06;margin-bottom:14px;overflow-wrap:break-word;}
.meta{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:16px;}
.chip{font-size:12.5px;padding:5px 13px;border-radius:30px;background:var(--panel2);border:1px solid var(--bord);
  color:var(--txt);display:inline-flex;gap:6px;align-items:center;}
/* Chips cliquables (catégories du billet) : léger retour au survol. */
a.chip{transition:background .15s,border-color .15s;}
a.chip:hover{background:color-mix(in srgb,var(--txt) 6%,var(--panel2));border-color:color-mix(in srgb,var(--txt) 28%,transparent);}
.hero p{color:var(--mut);font-size:14.5px;line-height:1.6;max-width:560px;margin-bottom:20px;}
.cta{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;background:var(--chip-on);
  color:var(--chip-on-txt);font-weight:700;font-size:14px;padding:12px 22px;border-radius:var(--rad-btn);transition:.15s var(--ease);}
.cta:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.3);}
/* « Lire le billet » dans le héros « À la une » : compact, en verre, aligné à droite. */
.hero .cta{align-self:flex-end;background:var(--panel2);color:var(--txt);border:1px solid var(--bord);font-weight:600;}
.hero .cta:hover{background:var(--chip-on);color:var(--chip-on-txt);border-color:var(--chip-on);}

/* ---- POSTER ART ---- */
.art{position:absolute;inset:0;}
.art::after{content:'';position:absolute;inset:0;background:radial-gradient(120% 80% at 30% 0,rgba(255,255,255,.18),transparent 60%);}
.art.cinema{background:var(--g-cinema);} .art.serie{background:var(--g-serie);}
.art.jeux{background:var(--g-jeux);} .art.livres{background:var(--g-livres);}
.scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.1) 50%,transparent 72%);}

/* ---- GRID CARDS ---- */
.grid{display:grid;gap:18px;grid-template-columns:repeat(4,1fr);}
.card{position:relative;aspect-ratio:2/3;border-radius:14px;overflow:hidden;display:block;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
  transition:transform .2s var(--ease),box-shadow .2s var(--ease);}
.card:hover{transform:translateY(-4px);}
/* Cartes « verre teinté » : sans image, le dégradé de rubrique devient translucide
   et laisse passer l'aurora ; une vraie affiche le recouvre dès qu'elle existe. */
.card .art.cinema{background:linear-gradient(160deg,color-mix(in srgb,var(--cinema) 52%,transparent),color-mix(in srgb,var(--cinema) 16%,transparent));}
.card .art.serie {background:linear-gradient(160deg,color-mix(in srgb,var(--serie) 52%,transparent),color-mix(in srgb,var(--serie) 16%,transparent));}
.card .art.jeux  {background:linear-gradient(160deg,color-mix(in srgb,var(--jeux) 52%,transparent),color-mix(in srgb,var(--jeux) 16%,transparent));}
.card .art.livres{background:linear-gradient(160deg,color-mix(in srgb,var(--livres) 52%,transparent),color-mix(in srgb,var(--livres) 16%,transparent));}
.card .art{transition:transform .4s ease;}
.card:hover .art{transform:scale(1.05);}
.card .scrim{background:linear-gradient(to top,rgba(0,0,0,.92) 4%,rgba(0,0,0,.45) 32%,rgba(0,0,0,0) 60%);}
/* bandeau d'info bas, toujours visible */
.card .info{position:absolute;left:0;right:0;bottom:0;padding:13px 13px 14px;z-index:3;}
.card .info .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-weight:700;font-size:14px;line-height:1.22;text-shadow:0 1px 4px rgba(0,0,0,.6);}
.card .info .m{display:flex;align-items:center;gap:8px;margin-top:8px;}
.card .info .d{font-size:11px;color:#c4d0d9;white-space:nowrap;}
.card .ctag{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;line-height:1;
  padding:4px 8px;border-radius:20px;color:#fff;white-space:nowrap;}
.card .ctag.cinema{background:rgba(149,134,214,.34);box-shadow:inset 0 0 0 1px rgba(149,134,214,.7);}
.card .ctag.serie {background:rgba(54,176,230,.30);box-shadow:inset 0 0 0 1px rgba(54,176,230,.7);}
.card .ctag.jeux  {background:rgba(211,148,183,.32);box-shadow:inset 0 0 0 1px rgba(211,148,183,.7);}
.card .ctag.livres{background:rgba(205,162,131,.32);box-shadow:inset 0 0 0 1px rgba(205,162,131,.7);}
/* liseré couleur en haut de carte */
.card::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:3;opacity:.9;}
.card[data-cat="cinema"]::after{background:var(--cinema);}
.card[data-cat="serie"]::after{background:var(--serie);}
.card[data-cat="jeux"]::after{background:var(--jeux);}
.card[data-cat="livres"]::after{background:var(--livres);}
.card[data-cat="cinema"]:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cinema) 60%,transparent),0 0 0 1.5px var(--cinema);}
.card[data-cat="serie"]:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--serie) 60%,transparent),0 0 0 1.5px var(--serie);}
.card[data-cat="jeux"]:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--jeux) 60%,transparent),0 0 0 1.5px var(--jeux);}
.card[data-cat="livres"]:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--livres) 60%,transparent),0 0 0 1.5px var(--livres);}

/* ---- SINGLE ---- */
.single{position:relative;}
/* L'image de fond fond vers le transparent en bas (masque) : raccord net
   évité, l'image se fond dans la page quel que soit le fond. */
.backdrop{position:absolute;top:-26px;left:-34px;right:-34px;height:480px;z-index:0;background:var(--page-ac);isolation:isolate;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 46%,transparent 94%);
          mask-image:linear-gradient(to bottom,#000 0%,#000 46%,transparent 94%);}
/* Voile de lisibilité plus léger : sombre en haut (derrière le titre),
   l'image reste visible en dessous, puis disparaît avec le masque. */
.backdrop::after{content:'';position:absolute;inset:0;background:
  linear-gradient(to bottom,rgba(11,16,22,.60) 0%,rgba(11,16,22,.30) 34%,rgba(11,16,22,.12) 68%,transparent 100%),
  linear-gradient(to right,rgba(11,16,22,.50) 0%,rgba(11,16,22,.08) 52%,transparent 100%);}
[data-theme="light"] .backdrop::after{background:
  linear-gradient(to bottom,rgba(28,40,51,.55) 0%,rgba(28,40,51,.28) 34%,rgba(28,40,51,.10) 68%,transparent 100%),
  linear-gradient(to right,rgba(28,40,51,.46) 0%,rgba(28,40,51,.07) 52%,transparent 100%);}
.single .inner{position:relative;z-index:2;}
.single .inner .ph-eyebrow{text-shadow:0 1px 10px rgba(0,0,0,.5);}
.single-grid{display:grid;grid-template-columns:320px 1fr;gap:44px;margin-top:64px;align-items:start;}
.single-poster{width:100%;aspect-ratio:2/3;position:relative;border-radius:16px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(255,255,255,.22),0 24px 50px rgba(0,0,0,.5);}
.single-body{padding-top:34px;}
.single-body h1{font-size:clamp(30px,5vw,46px);font-weight:800;letter-spacing:-.024em;margin:14px 0 14px;overflow-wrap:break-word;
  text-shadow:0 2px 16px rgba(0,0,0,.5);}
.single-body p{color:var(--mut);font-size:16px;line-height:1.75;max-width:820px;margin-top:14px;}

/* ---- BOUTON RETOUR (billet) ---- */
.back{font-size:14px;color:var(--mut);display:inline-flex;gap:6px;align-items:center;
  background:var(--panel);border:1px solid var(--bord);padding:7px 13px;border-radius:10px;transition:.15s;}
.back:hover{color:var(--txt);background:var(--panel2);}

/* ---- SIGNATURE DE PAGE (commune à toutes les pages) ---- */
.page-head{position:relative;padding-left:18px;margin:2px 0 6px;}
.page-head::before{content:"";position:absolute;left:0;top:6px;bottom:8px;width:5px;border-radius:5px;background:var(--page-ac);}
.ph-eyebrow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--mut);font-weight:600;margin-bottom:8px;}
.ph-eyebrow a:hover{color:var(--txt);}
.ph-eyebrow .ico{opacity:.6;}
.ph-eyebrow .cur{color:var(--txt);font-weight:700;}
.ph-titleline{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.ph-big{font-size:clamp(40px,6.5vw,68px);font-weight:900;letter-spacing:-.03em;line-height:.94;overflow-wrap:break-word;min-width:0;
  background:linear-gradient(165deg,var(--txt) 38%,color-mix(in srgb,var(--page-ac) 42%,var(--mut)));
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.ph-meta{font-size:13px;color:var(--mut);background:var(--panel2);padding:6px 14px;border-radius:30px;}
.page-nav{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin:18px 0 26px;}

/* ---- SÉPARATEUR DE SECTION (eyebrow majuscule + filet) ---- */
.sec.kicker{margin:28px 0 16px;}
.sec.kicker h2{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);}

/* ---- ARCHIVES / navigation année ---- */
.yr-arrows{display:flex;gap:9px;flex:0 0 auto;}
.yr-sep{width:1px;align-self:stretch;min-height:30px;background:var(--bord);margin:0 7px;flex:0 0 auto;}
.yr-pills{display:flex;flex-wrap:wrap;gap:9px;flex:1;min-width:0;}
.yr-arrow{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--panel);border:1px solid var(--bord);color:var(--txt);cursor:pointer;transition:.15s;}
.yr-arrow:hover{background:var(--panel2);transform:scale(1.06);}
.yr-arrow.flip .ico{transform:rotate(180deg);}
.yr-arrow.is-off{opacity:.4;pointer-events:none;}
.yr-pill{padding:7px 14px;border-radius:30px;font-size:13px;font-weight:700;background:var(--panel);
  border:1px solid var(--bord);color:var(--mut);cursor:pointer;transition:.15s;}
.yr-pill:hover{color:var(--txt);background:var(--panel2);}
.yr-pill.on{background:var(--chip-on);color:var(--chip-on-txt);border-color:var(--chip-on);}
.arch-empty{padding:60px 0;text-align:center;color:var(--mut);font-style:italic;}

/* ---- RANGÉE DE GROUPE (mois OU sous-catégorie) ---- */
.grouprow{display:grid;grid-template-columns:152px 1fr;gap:24px;align-items:start;background:var(--panel);
  border:1px solid var(--bord);border-radius:var(--rad);padding:20px;margin-bottom:16px;}
.grouprow.solo{grid-template-columns:1fr;}
.glabel{position:sticky;top:18px;}
.glabel .glogo{color:var(--page-ac);display:flex;margin-bottom:6px;line-height:0;}
.glabel .gname{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--mut);margin-top:4px;
  display:flex;align-items:center;gap:7px;}
.glabel .gname .ico{color:var(--page-ac);}
.glabel .gcount{margin-top:12px;display:inline-block;font-size:12px;color:var(--mut);background:var(--panel2);padding:4px 11px;border-radius:30px;}
.glabel .gmore{margin-top:12px;font-size:12.5px;color:var(--txt);display:inline-flex;align-items:center;gap:4px;cursor:pointer;}
.glabel .gmore:hover{color:var(--page-ac);}
.gitems{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
/* rangée à un seul élément (ex. héros « À la une ») : ne pas découper en grille */
.gitems-1{grid-template-columns:1fr;}
@media(max-width:560px){
  .grouprow{grid-template-columns:1fr;gap:14px;padding:14px;}
  .glabel{position:static;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
  .glabel .gnum{font-size:30px;}
  .glabel .gcount,.glabel .gmore{margin-top:0;}
  .gitems{grid-template-columns:repeat(2,1fr);}
}

/* ---- COMMAND PALETTE (⌘K) ---- */
.cmdk{position:fixed;inset:0;z-index:100;display:none;align-items:flex-start;justify-content:center;
  padding-top:14vh;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);}
.cmdk.open{display:flex;}
.cmdk .box{width:min(560px,92vw);background:var(--rail);background-color:rgba(16,22,29,.97);border:1px solid var(--bord);
  border-radius:18px;overflow:hidden;box-shadow:var(--shadow);}
[data-theme="light"] .cmdk .box{background-color:rgba(34,48,59,.98);}
.cmdk-in{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--bord);}
.cmdk-in .ico{color:var(--mut);}
.cmdk input{flex:1;padding:0;background:none;border:none;color:var(--txt);font-size:16px;outline:none;}
.cmdk .res .ico{color:var(--mut);width:22px;}
/* Miniature (affiche) à côté du titre dans les résultats de recherche. */
.cmdk .res-thumb{flex:0 0 auto;width:34px;height:46px;border-radius:7px;overflow:hidden;background:var(--panel2);
  box-shadow:inset 0 0 0 1px var(--bord);}
.cmdk .res-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.cmdk .results{padding:8px;max-height:420px;overflow:auto;}
.cmdk .results:empty{display:none;}
.cmdk .res{display:flex;align-items:center;gap:13px;padding:11px 12px;border-radius:11px;cursor:pointer;}
.cmdk .res:hover,.cmdk .res.sel{background:var(--panel2);}
.cmdk .res .ic{font-size:18px;width:22px;text-align:center;}
.cmdk .res .t{font-size:14px;font-weight:600;}
.cmdk .res .s{font-size:11.5px;color:var(--mut);}
.cmdk .foot{padding:10px 18px;border-top:1px solid var(--bord);color:var(--mut);font-size:11px;display:flex;gap:16px;}

/* ---- MOBILE TAB BAR ---- */
.tabbar{display:none;}
@media(max-width:979px){
  /* Filet anti-débordement horizontal : aucun glissement latéral sur mobile. */
  html,body{overflow-x:hidden;}
  .rail{display:none;}
  .main{padding:18px 16px 96px;overflow-x:hidden;}
  .crumb b{font-size:22px;}
  .search{width:100%;margin-left:0;order:3;}
  .hero{grid-template-columns:170px 1fr;gap:18px;padding:14px;}
  /* Billet sur mobile : l'affiche et le texte occupent toute la largeur (empilés). */
  .single-grid{grid-template-columns:1fr;gap:20px;margin-top:40px;}
  .single-poster{width:100%;}
  .single-body{padding-top:0;}
  .grid{grid-template-columns:repeat(2,1fr)!important;gap:14px;}
  .gitems{grid-template-columns:repeat(2,1fr)!important;}
  .gitems-1{grid-template-columns:1fr!important;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .tabbar{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:50;justify-content:space-between;gap:4px;
    background:rgba(10,15,20,.86);border:1px solid var(--bord);border-radius:14px;padding:10px 8px;backdrop-filter:blur(14px);}
  [data-theme="light"] .tabbar{background:rgba(28,40,50,.9);}
  .tabbar a{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--mut);font-size:18px;}
  .tabbar a.on{color:var(--txt);}
  .tabbar a b{font-size:9px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
}
@media(max-width:560px){
  .grid{grid-template-columns:repeat(2,1fr)!important;}
  /* Héros empilé : l'affiche est centrée (sinon elle reste collée à gauche). */
  .hero{grid-template-columns:1fr;justify-items:center;text-align:center;}
  .hero .poster{max-width:240px;width:100%;justify-self:center;}
  .hero .body{align-items:center;}
  .hero p{margin-inline:auto;}
  .hero .cta{align-self:center;}
  .foot-grid{grid-template-columns:1fr!important;}
  .foot-legal{justify-content:center;text-align:center;gap:14px;}
  .foot-theme{justify-content:center;}
}

/* ---- TABLETTE (≈ iPad mini portrait) : palier intermédiaire ----
   Entre le mobile (rail caché + barre d'onglets + 2 colonnes) et le bureau.
   On réaffiche le rail d'icônes, on masque la barre d'onglets du bas et on
   passe les grilles en 3 colonnes pour des affiches à taille raisonnable.
   Placé après les blocs ≤979 / ≤560 pour les emporter sur la plage 601–979. */
@media(min-width:601px) and (max-width:979px){
  .rail{display:flex;}
  .tabbar{display:none;}
  .main{padding:22px 26px 60px;}
  /* Étiquette de groupe plus compacte pour laisser de la place aux colonnes. */
  .grouprow{grid-template-columns:120px 1fr;gap:20px;}
  .grid{grid-template-columns:repeat(2,1fr)!important;}
  .gitems{grid-template-columns:repeat(2,1fr)!important;}
  .gitems-1{grid-template-columns:1fr!important;}
  /* Footer empilé sur une seule colonne (le format portrait est trop étroit pour 2). */
  .foot-grid{grid-template-columns:1fr;}
  /* Billet : on garde une mise en page à deux colonnes (resserrée), pas l'empilement mobile. */
  .single-grid{grid-template-columns:240px 1fr;gap:30px;margin-top:52px;}
  .single-body{padding-top:24px;}
}

/* ---- ACCENT COULEUR PAR PAGE (audace) ---- */
body{--page-ac:var(--accueil);}
body[data-page="cinema"]{--page-ac:var(--cinema);}
body[data-page="serie"] {--page-ac:var(--serie);}
body[data-page="jeux"]  {--page-ac:var(--jeux);}
body[data-page="livres"]{--page-ac:var(--livres);}

/* ---- FOND ANIMÉ « AURORA » (décor dynamique, derrière le contenu) ----
   Deux halos flous teintés de la couleur d'accent de la page, qui dérivent
   lentement. Purement décoratif (pointer-events:none), coupé si l'utilisateur
   préfère réduire les animations. */
body::before{content:"";position:fixed;inset:-20vmax;z-index:0;pointer-events:none;
  background:
    radial-gradient(38vmax 38vmax at 82% 12%, color-mix(in srgb, var(--page-ac) 26%, transparent) 0%, transparent 60%),
    radial-gradient(32vmax 32vmax at 14% 6%,  color-mix(in srgb, var(--page-ac) 18%, transparent) 0%, transparent 62%),
    radial-gradient(30vmax 30vmax at 30% 88%, color-mix(in srgb, var(--page-ac) 14%, transparent) 0%, transparent 64%);
  filter:blur(30px);opacity:.9;
  animation:tmtk-aurora 26s ease-in-out infinite alternate;}
@keyframes tmtk-aurora{
  0%  {transform:translate3d(0,0,0) scale(1) rotate(0deg);}
  100%{transform:translate3d(2%,-3%,0) scale(1.12) rotate(4deg);}
}
@media (prefers-reduced-motion: reduce){ body::before{animation:none;} }

/* ---- ACCENT DE COIN PAR RUBRIQUE (page catégorie) ----
   Un halo doux dans le coin haut-droit, teinté de la couleur de la rubrique. */
.cat-corner{position:fixed;top:0;right:0;width:min(460px,100vw);height:380px;z-index:0;pointer-events:none;opacity:.9;
  background:radial-gradient(58% 58% at 97% 0%, color-mix(in srgb,var(--page-ac) 34%,transparent) 0%, transparent 70%);}

/* ---- ENTRÉE DES CARTES (apparition en fondu, une par une) ----
   Opacité pure, en ordre de lecture ; coupé si l'utilisateur réduit les animations. */
@keyframes tmtk-card-in{from{opacity:0;}to{opacity:1;}}
@media (prefers-reduced-motion: no-preference){
  .gitems>*,.grid>*{animation:tmtk-card-in .6s var(--ease) backwards;}
  .gitems>*:nth-child(1),.grid>*:nth-child(1){animation-delay:0s;}
  .gitems>*:nth-child(2),.grid>*:nth-child(2){animation-delay:.09s;}
  .gitems>*:nth-child(3),.grid>*:nth-child(3){animation-delay:.18s;}
  .gitems>*:nth-child(4),.grid>*:nth-child(4){animation-delay:.27s;}
  .gitems>*:nth-child(5),.grid>*:nth-child(5){animation-delay:.36s;}
  .gitems>*:nth-child(6),.grid>*:nth-child(6){animation-delay:.45s;}
  .gitems>*:nth-child(7),.grid>*:nth-child(7){animation-delay:.54s;}
  .gitems>*:nth-child(8),.grid>*:nth-child(8){animation-delay:.63s;}
  .gitems>*:nth-child(n+9),.grid>*:nth-child(n+9){animation-delay:.72s;}
}
.sec h2{position:relative;padding-left:14px;}
.sec h2::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:4px;
  border-radius:4px;background:var(--page-ac);}

/* ---- FOOTER ---- */
.site-footer{margin-top:56px;padding-top:38px;border-top:1px solid var(--bord);}
.foot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;text-align:center;justify-items:center;}
.foot-col{width:100%;max-width:300px;}
.foot-about p{color:var(--mut);font-size:13.5px;line-height:1.65;}
.foot-about p+p{margin-top:.6em;}
.foot-theme-lbl{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:1.5px;font-weight:700;}
.foot-theme .tog button{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;padding:8px 12px;line-height:1;}
.foot-theme .tog .ico{font-size:0;}
.foot-col h4{font-size:12px;text-transform:uppercase;letter-spacing:1.5px;color:var(--mut);margin-bottom:16px;font-weight:800;}
.stat-total{display:flex;justify-content:center;align-items:baseline;gap:8px;margin-bottom:14px;}
.stat-total b{font-size:34px;font-weight:800;letter-spacing:-.025em;color:var(--accueil);}
.stat-total span{font-size:13px;color:var(--mut);}
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;width:100%;}
.stat{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--bord);
  border-radius:12px;padding:10px 13px;transition:.15s;text-align:left;}
.stat:hover{background:var(--panel2);box-shadow:inset 0 0 0 1px var(--sc);}
.stat .lbl{flex:1;font-size:12.5px;color:var(--mut);}
.stat b{font-size:18px;font-weight:800;letter-spacing:-.3px;}
.foot-links{display:flex;flex-direction:column;gap:11px;align-items:center;}
.foot-links a{font-size:13.5px;color:var(--mut);cursor:pointer;transition:.15s;}
.foot-links a:hover{color:var(--txt);}
.foot-theme{display:flex;align-items:center;gap:12px;}
.foot-legal{display:flex;justify-content:space-between;align-items:center;gap:12px 18px;flex-wrap:wrap;margin-top:32px;padding-top:18px;
  border-top:1px solid var(--bord);font-size:12px;color:var(--mut);}
/* Dégagement pour la barre d'onglets : seulement quand elle est visible (≤600px). */
@media(max-width:600px){.site-footer{margin-bottom:90px;}}

/* ===========================================================
   Intégration WordPress (images réelles, contenu, pagination)
   =========================================================== */
.art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0;}
.hero .poster .art img,.single-poster .art img{z-index:0;}
/* Duotone : une couche de teinte rubrique (--page-ac) est posée PAR-DESSUS
   l'image en blend `color` → elle remplace teinte+saturation tout en gardant
   la luminance (nuances) de la photo. Plus robuste qu'un blend sur l'image
   (couche dédiée, pas de dépendance à l'ordre d'empilement de l'<img>).
   .backdrop a isolation:isolate pour confiner le groupe de fusion. */
.backdrop .art img{filter:contrast(1.05) brightness(.95);}
.backdrop .art::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:var(--page-ac);mix-blend-mode:color;}

/* contenu de l'article */
.single-content{color:var(--mut);font-size:16px;line-height:1.75;max-width:820px;margin-top:16px;}
.single-content p{margin:0 0 1em;}
.single-content a{color:var(--txt);text-decoration:underline;text-underline-offset:2px;}
.single-content h2,.single-content h3,.single-content h4{color:var(--txt);margin:1.3em 0 .5em;line-height:1.25;}
.single-content img{max-width:100%;height:auto;border-radius:12px;margin:1em 0;}
.single-content ul,.single-content ol{margin:0 0 1em 1.2em;}
.single-content blockquote{border-left:3px solid var(--page-ac);padding-left:14px;margin:1em 0;color:var(--txt);}
.single-content iframe,.single-content .embed-responsive{max-width:100%;border-radius:12px;}

/* Classes de couleur de la palette éditeur (Gutenberg) — rendu front.
   Doivent refléter la palette déclarée par add_theme_support('editor-color-palette'). */
.has-cinema-color{color:#5a4d82;}.has-serie-color{color:#1a88be;}.has-jeux-color{color:#b07898;}
.has-livres-color{color:#a6826e;}.has-accueil-color{color:#5b7a8f;}.has-txt-color{color:#eef3f7;}.has-mut-color{color:#9fb1bd;}
.has-cinema-background-color{background-color:#5a4d82;}.has-serie-background-color{background-color:#1a88be;}
.has-jeux-background-color{background-color:#b07898;}.has-livres-background-color{background-color:#a6826e;}
.has-accueil-background-color{background-color:#5b7a8f;}

/* Texte réservé aux lecteurs d'écran (titres injectés par WordPress :
   the_posts_pagination, formulaire de recherche…). Sans cette règle, le
   <h2 class="screen-reader-text"> s'affichait et cassait la mise en page. */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* Garde-fou : un titre long ne doit jamais élargir une colonne de grille
   (sinon débordement horizontal et layout poussé sur le côté). */
.grid>*,.gitems>*{min-width:0;}

/* pagination WordPress (the_posts_pagination) */
.pagination{margin-top:6px;}
.pagination .nav-links,.nav-links{display:flex;justify-content:center;gap:8px;margin:34px 0 4px;flex-wrap:wrap;}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;
  border-radius:12px;background:var(--panel);border:1px solid var(--bord);color:var(--mut);font-weight:700;font-size:14px;
  text-decoration:none;transition:.15s;}
.page-numbers:hover{background:var(--panel2);color:var(--txt);}
.page-numbers.current{background:var(--chip-on);color:var(--chip-on-txt);border-color:var(--chip-on);}

/* ===========================================================
   Page 404
   =========================================================== */
.err404{display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:64px 20px 40px;}
.err404 .err-code{font-size:clamp(96px,22vw,200px);font-weight:800;line-height:.85;letter-spacing:-.04em;
  background:linear-gradient(180deg,var(--txt),var(--mut));-webkit-background-clip:text;background-clip:text;color:transparent;
  position:relative;}
.err404 .err-code::after{content:"";position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);
  width:96px;height:5px;border-radius:5px;background:var(--page-ac);}
.err404 .err-title{font-size:clamp(20px,3.4vw,28px);font-weight:800;letter-spacing:-.5px;margin:34px 0 8px;}
.err404 .err-text{color:var(--mut);font-size:15px;line-height:1.6;max-width:440px;margin:0 auto 26px;}
.err404 .err-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;}
.err404 .err-ghost{display:inline-flex;align-items:center;gap:7px;padding:11px 18px;border-radius:14px;
  background:var(--panel);border:1px solid var(--bord);color:var(--txt);font-weight:700;font-size:14px;
  cursor:pointer;transition:.15s;}
.err404 .err-ghost:hover{background:var(--panel2);transform:translateY(-2px);}
@media(max-width:560px){.err404{padding:40px 16px 30px;}.err404 .err-actions{width:100%;}.err404 .err-actions>*{flex:1;justify-content:center;}}
.page-numbers.dots{background:none;border:none;}

/* ===========================================================
   Accessibilité : lien d'évitement (.screen-reader-text défini plus haut)
   =========================================================== */
/* « Aller au contenu » : invisible jusqu'à ce qu'il reçoive le focus clavier. */
.skip-link{position:fixed;top:12px;left:12px;z-index:1000;}
.skip-link:focus{width:auto;height:auto;margin:0;clip:auto;clip-path:none;overflow:visible;
  white-space:normal;padding:11px 18px;border-radius:12px;background:var(--chip-on);color:var(--chip-on-txt);
  font-weight:700;font-size:14px;box-shadow:var(--shadow);outline:2px solid var(--accueil);outline-offset:2px;}
/* Cible du lien d'évitement : pas de contour disgracieux au focus programmé. */
.main:focus{outline:none;}
/* Lien RSS du footer : icône + libellé alignés. */
.foot-links a.rss-link{display:inline-flex;align-items:center;gap:7px;}