/* HamsiFlix — thème "Cinéma sombre premium" (chargé en dernier, s'applique à tout le site) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Playfair+Display:wght@600;700;800&display=swap');

:root {
  --cn-bg: #060608;
  --cn-line: rgba(255, 255, 255, .08);
  --cn-text: #f4f2ee;
  --cn-muted: #9a98a3;
  --cn-red: #e50914;
  --cn-red-2: #ff3b47;
  --cn-gold: #e8c26a;
  --cn-radius: 18px;
  --cn-ease: cubic-bezier(.22, .9, .25, 1);
  --cn-serif: 'Playfair Display', Georgia, serif;
}

html { color-scheme: dark; scroll-behavior: smooth; }
body, button, input, select, textarea {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
body {
  color: var(--cn-text);
  background:
    radial-gradient(1100px 600px at 80% -10%, rgba(229, 9, 20, .16), transparent 65%),
    radial-gradient(900px 600px at -10% 40%, rgba(232, 194, 106, .05), transparent 65%),
    var(--cn-bg) !important;
  background-attachment: fixed !important;
}
::selection { background: rgba(229, 9, 20, .5); color: #fff; }

/* Titres : serif cinéma */
h1, h2, .zxm-rail__title, .hero-slide-body h1, .hero-slide-body h2 {
  font-family: var(--cn-serif) !important; letter-spacing: -.01em; font-weight: 700;
}
h1 { text-shadow: 0 6px 40px rgba(0, 0, 0, .7); }

/* Navigation : verre fumé */
.znx-pill {
  background: linear-gradient(180deg, rgba(14, 14, 18, .82), rgba(8, 8, 11, .7)) !important;
  border: 1px solid var(--cn-line) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  backdrop-filter: blur(26px) saturate(160%) !important; -webkit-backdrop-filter: blur(26px) saturate(160%) !important;
}
.znx-nav-link { font-weight: 600; letter-spacing: .01em; color: #cfcdd6; transition: color .25s, background .25s, transform .25s var(--cn-ease); }
.znx-nav-link:hover { color: #fff; transform: translateY(-1px); }
.znx-nav-link.active { color: #fff; background: linear-gradient(135deg, var(--cn-red), #9b0610) !important; box-shadow: 0 6px 22px rgba(229, 9, 20, .45); }

/* Héro */
.hero-slide-body { text-shadow: 0 2px 24px rgba(0, 0, 0, .8); }
.hero-slide-cta, .hero-slide-body a[class*="bg-white"], .hero-slide-body button[class*="bg-white"] {
  border-radius: 999px !important; font-weight: 800; letter-spacing: .02em;
  transition: transform .25s var(--cn-ease), box-shadow .25s;
}
.hero-slide-cta:hover, .hero-slide-body a[class*="bg-white"]:hover { transform: scale(1.05); box-shadow: 0 14px 40px rgba(255, 255, 255, .22); }

/* Rails */
.zxm-rail { margin-block: 38px; }
.zxm-rail__title { font-size: clamp(22px, 2.4vw, 30px) !important; background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--cn-text); }
.zxm-rail__more { border: 1px solid var(--cn-line) !important; border-radius: 999px !important; color: var(--cn-muted); transition: all .25s var(--cn-ease); }
.zxm-rail__more:hover { color: #fff; border-color: var(--cn-gold) !important; background: rgba(232, 194, 106, .08); }

/* Cartes d'affiches */
.zxm-card, .zenix-card { transition: transform .45s var(--cn-ease), filter .45s; }
.zxm-card:hover, .zenix-card:hover { transform: translateY(-10px) scale(1.045); z-index: 4; }
.zxm-card__link, .zenix-card__inner, .zenix-card__img-wrap { border-radius: var(--cn-radius) !important; overflow: hidden; }
.zxm-card__link { box-shadow: 0 10px 30px rgba(0, 0, 0, .5); transition: box-shadow .45s var(--cn-ease); }
.zxm-card:hover .zxm-card__link, .zenix-card:hover .zenix-card__inner { box-shadow: 0 30px 60px rgba(0, 0, 0, .75), 0 0 0 1px rgba(232, 194, 106, .45), 0 0 50px rgba(229, 9, 20, .22); }
.zxm-card__img, .zenix-card__img { transition: transform .8s var(--cn-ease), filter .5s; }
.zxm-card:hover .zxm-card__img, .zenix-card:hover .zenix-card__img { transform: scale(1.09); filter: brightness(1.08) contrast(1.05); }
.zxm-card__title, .zenix-card__title { font-weight: 700; letter-spacing: -.005em; }
.zxm-card__meta, .zenix-card__meta { color: var(--cn-muted); }
.zxm-card__score, .zenix-card__badge--rating {
  background: rgba(8, 8, 11, .72) !important; color: var(--cn-gold) !important; font-weight: 800;
  border: 1px solid rgba(232, 194, 106, .45); border-radius: 999px; backdrop-filter: blur(8px); box-shadow: none;
}
.zxm-card__add { backdrop-filter: blur(10px); background: rgba(8, 8, 11, .6) !important; border: 1px solid var(--cn-line); transition: background .25s, transform .25s var(--cn-ease); }
.zxm-card__add:hover { background: var(--cn-red) !important; transform: rotate(90deg) scale(1.1); }

/* Boutons */
a[class*="bg-red-"], button[class*="bg-red-"], .zx-chip-btn.is-active {
  background: linear-gradient(135deg, var(--cn-red-2), var(--cn-red) 55%, #8a0510) !important; color: #fff !important;
  border: 0 !important; border-radius: 12px; font-weight: 700; box-shadow: 0 10px 30px rgba(229, 9, 20, .38);
  transition: transform .25s var(--cn-ease), box-shadow .25s, filter .25s;
}
a[class*="bg-red-"]:hover, button[class*="bg-red-"]:hover { transform: translateY(-2px); filter: brightness(1.12); box-shadow: 0 16px 40px rgba(229, 9, 20, .55); }

/* Formulaires */
input[type="text"], input[type="search"], input[type="email"], input[type="password"], select, textarea {
  background: rgba(255, 255, 255, .05) !important; border: 1px solid var(--cn-line) !important; border-radius: 12px !important; color: var(--cn-text) !important;
  transition: border-color .25s, box-shadow .25s, background .25s;
}
input:focus, select:focus, textarea:focus { outline: 0 !important; border-color: var(--cn-gold) !important; box-shadow: 0 0 0 4px rgba(232, 194, 106, .14) !important; background: rgba(255, 255, 255, .08) !important; }

/* Panneaux, pages détail, lecteur */
.zx-section-block, .zx-tags-block, .zx-comments-block, .zx-now-panel, .zx-servers, .zx-tg__card {
  background: linear-gradient(160deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .012)) !important;
  border: 1px solid var(--cn-line) !important; border-radius: 22px !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .4); backdrop-filter: blur(16px);
}
iframe, video { border-radius: 16px; box-shadow: 0 30px 80px rgba(0, 0, 0, .65); }
a[class*="rounded-full"][class*="border"]:hover { border-color: var(--cn-gold) !important; background: rgba(232, 194, 106, .1) !important; }

/* Défilement, apparition, focus */
* { scrollbar-width: thin; scrollbar-color: rgba(232, 194, 106, .35) transparent; }
::-webkit-scrollbar-thumb:hover { background: var(--cn-gold) !important; background-clip: content-box !important; }
@keyframes cn-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
.zxm-rail { animation: cn-rise .8s var(--cn-ease) both; }
:focus-visible { outline: 2px solid var(--cn-gold); outline-offset: 3px; border-radius: 8px; }

@media (max-width: 768px) { .zxm-rail { margin-block: 26px; } }
@media (hover: none) { .zxm-card:hover, .zenix-card:hover { transform: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ===== Mobile / téléphone ===== */
html, body { max-width: 100%; overflow-x: clip; }
img, video, iframe { max-width: 100%; }
@media (max-width: 768px) {
  body { background-attachment: scroll !important; }
  .zxm-rail { margin-block: 22px; }
  .zxm-rail__head { flex-wrap: wrap; gap: 6px 10px; }
  .hero-slide-body > div, .hero-slide-body { padding-bottom: 40px !important; }
  .zxm-rail__title { font-size: 20px !important; flex-wrap: wrap; line-height: 1.15; }
  .zxm-rail__title small { display: block; width: 100%; font-size: 9px !important; letter-spacing: .12em; }
  .zxm-rail__more { padding: 6px 12px; font-size: 11px; }
  .zxm-track { scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; padding-inline: 12px; gap: 12px; }
  .zxm-card { scroll-snap-align: start; }
  .hero-slide-body h1, .hero-slide-body h2 { font-size: clamp(26px, 8vw, 36px) !important; }
  .hero-slide-cta, .hero-slide-body a[class*="bg-white"] { min-height: 46px; padding-inline: 22px; }
  .swiper-pagination, [class*="swiper-pagination"] { bottom: 6px !important; }
  .znx-nav-link, .zxm-card__add, button, a[class*="rounded"] { min-height: 40px; }
  .zx-section-block, .zx-tags-block, .zx-comments-block, .zx-now-panel, .zx-servers { border-radius: 16px !important; padding: 12px !important; }
  .zx-chip-btn { min-height: 44px; font-size: 13px; }
  iframe, video { border-radius: 10px; box-shadow: 0 12px 30px rgba(0, 0, 0, .55); }
  .zxp-bar { opacity: 1 !important; top: 6px; right: 6px; }
  .zxp-btn { width: 36px; height: 36px; }
  .anime-page { padding-top: 78px !important; }
  input, select, textarea { font-size: 16px !important; } /* évite le zoom auto sur iPhone */
}
@media (max-width: 768px) {
  .zx-chip-btn { font-size: 13px !important; min-height: 44px !important; }
  .zx-servers .zx-chip-btn { flex: 1 1 calc(50% - 8px); justify-content: center; }
  [class*="text-[9px]"], [class*="text-[10px]"], small { font-size: 11px !important; }
  .zxm-card__title { font-size: 14px; }
  .zx-btn, .zx-btn-primary { min-height: 48px; }
  .zx-content-page { padding-bottom: 28px; }
}
@media (max-width: 400px) { .zxm-card { width: 132px; } }
@supports (padding: max(0px)) { body { padding-bottom: env(safe-area-inset-bottom); } }