/* ============================================================================
   minecraft.fr — Bloc "Dernières mises à jour" (HP) — slider de cartes.
   CSS du bloc dont le MARKUP est collé dans un module Code (.mcu-band).
   Bande sombre (tokens --mc-dark* : reste sombre en clair ET dark), accents
   turquoise/or via tokens. Replis var(--mc-*, …) pour le public.
   ============================================================================ */

.mcu-band{
  background:var(--mc-dark,#161D1B);
  background-image:
    linear-gradient(45deg, rgba(255,255,255,.02) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.02) 75%),
    linear-gradient(45deg, rgba(255,255,255,.02) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.02) 75%);
  background-size:40px 40px; background-position:0 0,20px 20px;
  border-top:3px solid var(--mc-tq,#1AA995); border-bottom:1px solid var(--mc-dark-line,#2E3A36);
  margin:36px 0; padding:22px 0 26px;
}
.mcu-in{ max-width:1180px; margin:0 auto; padding:0 18px; }

/* en-tête */
.mcu-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:0 0 16px; }
.mcu-eyebrow{ display:flex; align-items:center; gap:9px; font-family:var(--mc-display,"Space Grotesk",system-ui,sans-serif); font-weight:700; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--mc-tq-l,#34CBB2); margin:0 0 6px; }
.mcu-eyebrow .sq{ width:12px; height:12px; background:var(--mc-tq,#1AA995); box-shadow:inset -3px -3px 0 rgba(0,0,0,.25); }
.mcu-title-main{ font-family:var(--mc-display,"Space Grotesk",system-ui,sans-serif); font-weight:700; font-size:clamp(22px,2.6vw,30px); line-height:1; color:#fff; margin:0; }
.mcu-arrows{ display:flex; gap:8px; flex:0 0 auto; }
.mcu-arrow{ width:40px; height:40px; display:grid; place-items:center; background:var(--mc-dark-2,#202A27); border:2px solid var(--mc-dark-line,#2E3A36); color:#fff; font-size:22px; line-height:1; cursor:pointer; padding:0; transition:background .15s ease,border-color .15s ease,color .15s ease,opacity .15s ease; }
.mcu-arrow:hover{ background:var(--mc-tq,#1AA995); border-color:var(--mc-tq,#1AA995); color:#06231E; }
.mcu-arrow[disabled]{ opacity:.35; cursor:default; }
.mcu-arrow[disabled]:hover{ background:var(--mc-dark-2,#202A27); border-color:var(--mc-dark-line,#2E3A36); color:#fff; }

/* rangée scrollable */
.mcu-row{ display:flex; gap:16px; overflow-x:auto; scroll-behavior:smooth; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:4px 0 2px; }
.mcu-row::-webkit-scrollbar{ display:none; }

/* carte */
.mcu-card,.mcu-card:link,.mcu-card:visited{
  flex:0 0 224px; scroll-snap-align:start; text-decoration:none;
  background:var(--mc-dark-2,#202A27); border:2px solid var(--mc-dark-line,#2E3A36); box-shadow:4px 4px 0 #000;
  display:flex; flex-direction:column; color:#EAF1EE;
  transition:transform .08s ease, box-shadow .08s ease, border-color .15s ease;
}
.mcu-card:hover{ transform:translate(-1px,-1px); box-shadow:6px 6px 0 #000; border-color:var(--mc-tq,#1AA995); }
.mcu-thumb{ position:relative; display:block; aspect-ratio:16/9; background:var(--mc-dark,#161D1B); border-bottom:2px solid var(--mc-dark-line,#2E3A36); overflow:hidden; }
.mcu-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.mcu-new{ position:absolute; top:10px; left:10px; font-family:var(--mc-display,"Space Grotesk",system-ui,sans-serif); font-weight:700; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:#06231E; background:var(--mc-tq-l,#34CBB2); border:2px solid #06231E; box-shadow:2px 2px 0 rgba(0,0,0,.5); padding:2px 8px; }
.mcu-body{ padding:12px 14px 14px; display:flex; flex-direction:column; gap:9px; }
.mcu-ct{ font-family:var(--mc-display,"Space Grotesk",system-ui,sans-serif); font-weight:700; font-size:15.5px; line-height:1.16; color:#fff; }
.mcu-card:hover .mcu-ct{ color:var(--mc-tq-l,#34CBB2); }
.mcu-meta{ display:flex; align-items:center; gap:10px; }
.mcu-ver{ font-family:var(--mc-sans,"IBM Plex Sans",system-ui,sans-serif); font-weight:700; font-size:12.5px; color:#2A1D02; background:var(--mc-gold,#E8A93B); border:2px solid #06231E; box-shadow:2px 2px 0 rgba(0,0,0,.4); padding:1px 8px; }
.mcu-date{ font-family:var(--mc-sans,"IBM Plex Sans",system-ui,sans-serif); font-weight:600; font-size:12.5px; color:#8A968F; }

@media(max-width:780px){
  .mcu-head{ align-items:flex-start; }
  .mcu-arrows{ display:none; }
  .mcu-card{ flex-basis:200px; }
}