.hero-bases {
    background: linear-gradient(rgba(0,0,0,0.72), rgba(0,0,0,0.72)),
                url('img/vocabulaire.jpg') center/cover no-repeat;
    padding: clamp(50px,9vw,90px) 0; text-align: center;
}
.hero-bases h1 { font-size: clamp(1.8rem,5vw,3.5rem); font-weight:700; }
.hero-bases p  { font-size: clamp(1rem,2vw,1.2rem); color:#cbd5e1; }
.bases-section { margin-bottom:60px; }
.bases-section-title {
    font-size: clamp(1.3rem,3vw,1.8rem); font-weight:700;
    border-left:5px solid #dc2626; padding-left:16px;
    margin-bottom:28px; color:#fff;
}

/* Layout image + tableau */
.body-layout { display:grid; grid-template-columns:220px 1fr; gap:32px; align-items:start; }
@media(max-width:700px){ .body-layout { grid-template-columns:1fr; } }
.body-img-wrap {
    position:sticky; top:80px;
    background:#1e293b; border-radius:16px; padding:20px;
    text-align:center; border:1px solid rgba(255,255,255,.08);
}
.body-img-wrap img {
    max-width:100%; border-radius:10px;
    filter:drop-shadow(0 0 12px rgba(220,38,38,.3));
    cursor:zoom-in; transition:transform .25s, filter .25s;
}
.body-img-wrap img:hover { transform:scale(1.06); filter:drop-shadow(0 0 20px rgba(220,38,38,.5)); }
.body-img-caption { font-size:.78rem; color:#94a3b8; margin-top:8px; }

/* Lightbox */
#lightbox {
    display:none; position:fixed; inset:0; z-index:9999;
    background:rgba(0,0,0,.88); align-items:center; justify-content:center;
    cursor:zoom-out;
}
#lightbox.open { display:flex; }
#lightbox img {
    max-width:90vw; max-height:90vh; border-radius:14px;
    box-shadow:0 0 60px rgba(220,38,38,.4);
    animation:lb-in .2s ease;
}
@keyframes lb-in { from{transform:scale(.85);opacity:0} to{transform:scale(1);opacity:1} }
#lightbox-close {
    position:absolute; top:18px; right:24px;
    font-size:2rem; color:#fff; background:none; border:none;
    cursor:pointer; line-height:1; opacity:.7;
}
#lightbox-close:hover { opacity:1; }

/* Tableau */
.table-bases { width:100%; border-collapse:separate; border-spacing:0; border-radius:16px; overflow:hidden; }
.table-bases thead tr { background:#dc2626; }
.table-bases thead th { padding:12px 16px; color:#fff; font-weight:700; font-size:.88rem; text-align:left; border:none; }
.table-bases tbody tr { background:#1e293b; transition:background .15s; }
.table-bases tbody tr:nth-child(even) { background:#162032; }
.table-bases tbody tr:hover { background:#27374d; }
.table-bases td { padding:10px 16px; color:#e2e8f0; font-size:.93rem; border-top:1px solid rgba(255,255,255,.05); }
.table-bases td.jp { font-family:'Noto Sans JP',sans-serif; font-size:1.1rem; color:#f87171; font-weight:600; }
.table-bases td.romaji { color:#94a3b8; font-size:.85rem; }
.zone-badge {
    display:inline-block; font-size:.7rem; font-weight:700; padding:2px 8px;
    border-radius:10px; margin-right:4px; vertical-align:middle;
}
.badge-tete  { background:#7c3aed22; color:#a78bfa; border:1px solid #7c3aed44; }
.badge-buste { background:#dc262622; color:#f87171; border:1px solid #dc262644; }
.badge-bras  { background:#0d9488aa; color:#5eead4; border:1px solid #0d948844; }
.badge-jambe { background:#d97706aa; color:#fbbf24; border:1px solid #d9770644; }

/* Santé */
.health-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; }
.health-card {
    background:#1e293b; border-radius:14px; padding:16px;
    border:1px solid rgba(255,255,255,.07); text-align:center;
}
.health-icon { font-size:2.2rem; margin-bottom:8px; }
.health-fr   { font-size:.95rem; font-weight:700; color:#f1f5f9; }
.health-jp   { font-family:'Noto Sans JP',sans-serif; font-size:1.15rem; color:#f87171; font-weight:700; }
.health-kanji{ font-family:'Noto Sans JP',sans-serif; font-size:.82rem; color:#94a3b8; }
.health-romaji{ font-size:.78rem; color:#cbd5e1; background:#0f172a; border-radius:6px; padding:2px 8px; display:inline-block; }

.memo-bloc {
    background:#0f172a; border-left:5px solid #dc2626;
    border-radius:0 12px 12px 0; padding:14px 18px;
    margin-bottom:22px; font-size:.93rem; color:#cbd5e1; line-height:1.8;
}
.memo-bloc strong { color:#f87171; }