/* VM MANGAS — carrousel, cartes et bandeau de réassurance (maquette 02). */
/* ---------- CARROUSEL DES SÉRIES ---------- */
.vm-carousel{display:flex;align-items:stretch;gap:8px;margin:12px 0 14px}
.vm-arrow{flex:0 0 34px;display:grid;place-items:center;border:1px solid #3a3a44;border-radius:8px;background:linear-gradient(180deg,#1a1a22,#0b0b10);color:#e6e6ea;cursor:pointer}
.vm-arrow svg{width:22px;height:22px}.vm-arrow.prev svg{transform:scaleX(-1)}
.vm-arrow:hover{border-color:var(--neon);box-shadow:0 0 10px #ff1f3d88}
.vm-strip{flex:1 1 auto;min-width:0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth;padding:5px 3px}
.vm-strip::-webkit-scrollbar{display:none}
.vm-tile{flex:0 0 calc((100% - 80px)/11);min-width:112px;display:flex;flex-direction:column;border:2px solid #34343e;border-radius:8px;overflow:hidden;background:linear-gradient(180deg,#16161c,#0b0b10);text-decoration:none;color:#fff;box-shadow:0 4px 10px #000a}
.vm-tile img,.vm-tile .vm-placeholder{display:block;width:100%;aspect-ratio:16/11.5;height:auto;object-fit:cover;border-bottom:1px solid #000}
.vm-tile b{flex:1;display:grid;place-items:center;text-align:center;padding:5px 4px 6px;min-height:2.6em;font:700 14px/1.05 'Barlow Condensed','Arial Narrow',sans-serif;text-transform:uppercase;letter-spacing:.01em}
.vm-tile.on,.vm-tile:hover,.vm-tile:focus-visible{border-color:var(--neon);box-shadow:0 0 14px #ff1f3dcc,inset 0 0 10px #ff1f3d44}
.vm-placeholder{position:relative;display:grid!important;place-items:center;text-align:center;font:400 clamp(15px,1.25vw,19px)/.95 Knewave,Impact,sans-serif;text-transform:uppercase;color:#fff;text-shadow:2px 2px 0 #000;padding:6px}
.vm-placeholder::after{content:"Bientôt";position:absolute;right:4px;top:4px;background:#000c;border:1px solid #ffc21a88;color:#ffc21a;font:700 10px/1 'Barlow Condensed',sans-serif;text-transform:uppercase;padding:2px 4px;border-radius:3px;text-shadow:none}
.vm-placeholder.c1{background:linear-gradient(135deg,#1b2a55,#0a0f20 60%,#3a0a10)}
.vm-placeholder.c2{background:linear-gradient(135deg,#d0367a,#5a1a6a 60%,#1a0a30)}
.vm-placeholder.c3{background:linear-gradient(135deg,#d0301a,#7a1a10 55%,#2a0a08)}
.vm-placeholder.c4{background:linear-gradient(135deg,#ff8a1a,#9a3a08 55%,#1a1a3a)}
.vm-placeholder.c5{background:linear-gradient(135deg,#ff6a1a,#2a2a30 55%,#0a0a10)}
.vm-placeholder.c6{background:linear-gradient(135deg,#2a5ad0,#122a6a 55%,#300a10)}
.vm-placeholder.c7{background:linear-gradient(135deg,#7a2ad0,#2a0a5a 55%,#d0a01a)}
.vm-placeholder.c8{font-size:clamp(12px,1vw,15px);padding-top:16px;background:linear-gradient(135deg,#ffc21a,#9a5a08 50%,#1a2a6a)}
/* ---------- 3 COLONNES ---------- */
.vm-featured{display:grid;grid-template-columns:1fr 1fr .92fr;gap:14px;margin:0 0 14px}
.vm-feature,.vm-new{display:flex;flex-direction:column;min-width:0;border:2px solid var(--neon2);border-radius:10px;background:linear-gradient(180deg,#131318,#09090d);box-shadow:0 0 14px #ff1f3d55,inset 0 0 18px #ff1f3d14;padding:10px 12px 12px}
.vm-new{border-color:#3a3a44;box-shadow:0 0 10px #0008}
.vm-feature h2,.vm-new h2{display:flex;align-items:center;gap:9px;margin:0 0 9px;font:italic 800 clamp(22px,2vw,30px)/1 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase;color:#fff}
.vm-new h2{font-style:normal;font-weight:700}
.h-ico{width:32px;height:32px;flex:0 0 auto}.h-ico.gold{color:var(--vm-gold);filter:drop-shadow(0 0 6px #ff9a0088)}.h-ico.red{color:var(--neon);filter:drop-shadow(0 0 6px #ff1f3d88)}
.vm-cover{position:relative;display:block;aspect-ratio:16/6.6;overflow:hidden;border-radius:6px;border:1px solid #2b2b33;background:#14141a}
.vm-cover img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:scale(1.02)}
.vm-play{position:absolute;left:50%;top:50%;width:60px;height:60px;transform:translate(-50%,-50%);display:grid;place-items:center;border-radius:50%;border:3px solid #fff;background:#000a;box-shadow:0 0 14px #000}
.vm-play svg{width:26px;height:26px;margin-left:4px;color:#fff}
.vm-badge{position:absolute;left:8px;bottom:8px;background:#000c;border:1px solid #fff3;border-radius:5px;color:#fff;font:700 14px/1 'Barlow Condensed',sans-serif;font-style:normal;padding:5px 8px;text-transform:uppercase}
.vm-cover:hover .vm-play{background:var(--neon)}
.vm-feature h3{margin:10px 0 6px;font:800 clamp(18px,1.6vw,23px)/1.05 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase;color:#fff}
.vm-feature p{margin:0 0 10px;color:#e0e0e6;font:500 14px/1.35 system-ui,sans-serif}
.vm-btn{margin-top:auto;align-self:flex-end;display:inline-flex;align-items:center;padding:10px 18px;border-radius:7px;border:1px solid #ff5a6e;background:linear-gradient(180deg,#e0102c,#a8061c);box-shadow:0 0 12px #ff1f3d88;color:#fff;text-decoration:none;font:700 clamp(15px,1.3vw,19px)/1 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase}
.vm-btn:hover{background:var(--neon)}
.vm-new-list{display:grid}
.vm-new-list a{display:grid;grid-template-columns:clamp(96px,7.6vw,118px) minmax(0,1fr) 16px;gap:12px;align-items:center;padding:7px 0;border-bottom:1px solid #26262e;color:#fff;text-decoration:none}
.vm-new-list a:last-child{border-bottom:0}
.vm-new-list .th{position:relative;display:block;aspect-ratio:16/9.5;overflow:hidden;border-radius:5px;border:1px solid #33333c}
.vm-new-list .th img{width:100%;height:100%;object-fit:cover}
.vm-new-list .th em{position:absolute;right:4px;bottom:4px;background:#000c;border-radius:4px;color:#fff;font:700 13px/1 'Barlow Condensed',sans-serif;font-style:normal;padding:3px 5px}
.vm-new-list .copy strong,.vm-new-list .copy b{display:block;font:700 15px/1.25 system-ui,sans-serif}
.vm-new-list .copy small{display:block;color:#d0d0d6;font:500 13.5px/1.3 system-ui,sans-serif}
.vm-new-list .chev{width:16px;height:16px;color:#c9c9d0}
.vm-new-list a:hover strong{color:#ffd36a}
/* ---------- BANDEAU DE RÉASSURANCE ---------- */
.vm-benefits{list-style:none;margin:0;padding:12px clamp(10px,2vw,30px);display:flex;justify-content:space-between;align-items:center;gap:10px 18px;flex-wrap:wrap;border:1px solid #2a2a33;border-radius:8px;background:linear-gradient(180deg,#121217,#0a0a0e)}
.vm-benefits li{display:flex;align-items:center;gap:10px;font:700 clamp(15px,1.35vw,20px)/1 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.02em;color:#fff}
.vm-benefits svg{width:28px;height:28px;color:#fff}.vm-benefits svg.gold{color:var(--vm-gold)}
.vm-fine{margin:7px 4px 10px}
.vm-fine a{color:#ffd36a}
/* ---------- BAS DE PAGE ---------- */
.vm-mini-section{padding:20px 0}
.vm-mini-section h2{font:italic 800 clamp(24px,2.4vw,32px)/1.05 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase;margin:8px 0}
.vm-mini-section .episode-catalogue{grid-template-columns:repeat(4,minmax(0,1fr))}
.vm-mini-section .panel{border:2px solid #3a1018!important;background:linear-gradient(180deg,#131318,#09090d);box-shadow:0 6px 16px #000a}
.vm-mini-section .panel:hover{border-color:var(--neon)!important;box-shadow:0 0 14px #ff1f3d77}
.vm-mini-section .poster{border-bottom:2px solid var(--neon);aspect-ratio:16/9;height:auto;min-height:0;width:100%;object-fit:cover}
.vm-mini-section .eyebrow{color:var(--vm-gold)}
.vm-mangas-page .note{background:linear-gradient(110deg,#200810,#0b0b10);border-color:#3a1018;border-left:5px solid var(--neon)}
.vm-wish{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:12px 0}
.vm-wish article,.vm-adults{border:1px solid #3a1018;border-radius:12px;padding:16px;background:linear-gradient(180deg,#131318,#09090d)}
.vm-wish h3,.vm-adults h3{margin:0 0 8px;font:italic 800 22px 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase}
.vm-adults{border:2px solid #d6a45e;background:#1d1414;margin:14px 0}
.vm-readmore{color:#e8e8ee;background:#120a0e;padding:13px 16px;border-left:4px solid var(--neon);border-radius:7px;margin-top:16px}
.vm-readmore a,.vm-foot a{color:#ffd36a}
.vm-foot{padding:25px clamp(10px,1.1vw,18px)}
@media(max-width:1100px){.vm-featured{grid-template-columns:1fr 1fr}.vm-new{grid-column:1/-1}.vm-mini-section .episode-catalogue{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:730px){
 .vm-featured,.vm-wish{grid-template-columns:1fr}
 .vm-arrow{flex-basis:28px}
 .vm-tile{flex-basis:108px;min-width:108px}
 .vm-cover{aspect-ratio:16/8.5}
 .vm-benefits{justify-content:flex-start}.vm-benefits li{flex:1 1 calc(50% - 18px)}
 .vm-mini-section .episode-catalogue{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.vm-strip{scroll-behavior:auto}}
