/* Bloc d'accueil « La Nuit des Yōkai » (pages/accueil/halloween-2026.php) : top produits d'horreur, décor léger animé */
@keyframes hwHomeGlow { 0%, 100% { box-shadow: 0 0 40px 12px rgba(255, 243, 196, .3), 0 0 120px 40px rgba(255, 170, 60, .12); } 50% { box-shadow: 0 0 56px 16px rgba(255, 243, 196, .45), 0 0 150px 60px rgba(255, 170, 60, .2); } }
@keyframes hwHomeBat { 0% { transform: translate(-10vw, 0) scale(var(--s, 1)); } 25% { transform: translate(20vw, -18px) scale(var(--s, 1)); } 50% { transform: translate(50vw, 12px) scale(var(--s, 1)); } 75% { transform: translate(80vw, -22px) scale(var(--s, 1)); } 100% { transform: translate(110vw, 0) scale(var(--s, 1)); } }
@keyframes hwHomeFlapL { from { transform: rotate(18deg); } to { transform: rotate(-32deg); } }
@keyframes hwHomeFlapR { from { transform: rotate(-18deg); } to { transform: rotate(32deg); } }
@keyframes hwHomeGhost { 0%, 100% { transform: translateY(0) rotate(-3deg); opacity: .8; } 50% { transform: translateY(-16px) rotate(3deg); opacity: .95; } }
@keyframes hwHomeFlicker { 0%, 18%, 22%, 25%, 53%, 57%, 100% { opacity: 1; filter: drop-shadow(0 0 6px #ffb703); } 20%, 24%, 55% { opacity: .55; filter: none; } }

.hw-home { position: relative; overflow: hidden; margin: 10px 0 30px; padding: 40px 20px 44px; background: radial-gradient(ellipse at 75% 0%, #3a1d5e 0%, #1a0f2e 45%, #0b0614 100%); color: #f3eefb; box-sizing: border-box; }
.hw-home *, .hw-home *::before, .hw-home *::after { box-sizing: border-box; }
.hw-home__sky { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hw-home__moon { position: absolute; top: 24px; right: 6%; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle at 36% 34%, #fffbe8 0%, #fff3c4 45%, #e9d395 100%); animation: hwHomeGlow 6s ease-in-out infinite; }
.hw-home__bat { position: absolute; left: 0; width: 44px; height: 22px; color: #0a0510; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .5)); animation: hwHomeBat linear infinite; }
.hw-home__wing { transform-box: fill-box; animation: hwHomeFlapL .35s ease-in-out infinite alternate; }
.hw-home__wing--l { transform-origin: right center; }
.hw-home__wing--r { transform-origin: left center; animation-name: hwHomeFlapR; }
.hw-home__bat--1 { top: 10%; --s: 1; animation-duration: 20s; animation-delay: -3s; }
.hw-home__bat--2 { top: 22%; --s: .65; animation-duration: 27s; animation-delay: -12s; }
.hw-home__bat--3 { top: 6%; --s: .8; animation-duration: 23s; animation-delay: -18s; }
.hw-home__ghost { position: absolute; right: 17%; top: 26px; width: 56px; height: 70px; filter: drop-shadow(0 0 12px rgba(255, 255, 255, .3)); animation: hwHomeGhost 5s ease-in-out infinite; }
.hw-home__pumpkin { position: absolute; left: 2%; bottom: -6px; width: 92px; height: 84px; }
.hw-home__face { animation: hwHomeFlicker 3.2s linear infinite; }
.hw-home__inner { position: relative; max-width: 1400px; margin: 0 auto; }
.hw-home__head { text-align: center; margin-bottom: 28px; }
.hw-home__badge { display: inline-flex; align-items: center; background: rgba(255, 122, 26, .14); border: 1px solid #ff7a1a; color: #ffa14d; padding: .35rem .9rem; border-radius: 50px; font-size: .78rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.hw-home__title { font-family: "Dela Gothic One", cursive; font-size: clamp(1.9rem, 5vw, 3.2rem); color: #fff; margin: 12px 0 8px; letter-spacing: 1px; line-height: 1.1; text-shadow: 0 4px 24px rgba(0, 0, 0, .6); }
.hw-home__title span { color: #ff7a1a; text-shadow: 0 0 10px rgba(255, 122, 26, .8), 0 0 30px rgba(255, 122, 26, .5); }
.hw-home__sub { color: #d8d0ea; font-size: 1.05rem; margin: 0; }
.hw-home__sub b { color: #8dff5a; }
.hw-home__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (min-width: 700px) { .hw-home__grid { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
@media (min-width: 1200px) { .hw-home__grid { gap: 20px; } }
.hw-card { position: relative; display: flex; flex-direction: column; background: #1d1333; border: 1px solid rgba(255, 255, 255, .08); border-radius: 14px; overflow: hidden; transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s ease, border-color .3s ease; }
.hw-card:hover { transform: translateY(-6px); border-color: rgba(255, 122, 26, .6); box-shadow: 0 20px 40px -10px rgba(0, 0, 0, .7), 0 0 24px rgba(255, 122, 26, .25); }
.hw-card--manga:hover { border-color: rgba(139, 92, 246, .7); box-shadow: 0 20px 40px -10px rgba(0, 0, 0, .7), 0 0 24px rgba(139, 92, 246, .3); }
.hw-card__img { display: block; background: #fff; aspect-ratio: 1 / 1; overflow: hidden; }
.hw-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.hw-card:hover .hw-card__img img { transform: scale(1.06); }
.hw-card__badge { position: absolute; top: 10px; right: 10px; background: #ff7a1a; color: #1a0b2e; font-weight: 800; font-size: .8rem; padding: .2rem .7rem; border-radius: 50px; box-shadow: 0 0 18px rgba(255, 122, 26, .6); z-index: 2; }
.hw-card__body { padding: 12px 12px 14px; display: flex; flex-direction: column; flex: 1; }
.hw-card__type { font-size: .68rem; text-transform: uppercase; letter-spacing: 1px; color: #ffa14d; font-weight: 700; margin-bottom: 4px; }
.hw-card--manga .hw-card__type { color: #c4b5fd; }
.hw-card__title { color: #fff; font-weight: 700; font-size: .9rem; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.7em; text-decoration: none; }
.hw-card__title:hover { color: #ffa14d; }
.hw-card__prices { display: flex; align-items: baseline; gap: 8px; margin: 8px 0 10px; flex-wrap: wrap; }
.hw-card__old { color: #a79cc4; text-decoration: line-through; font-size: .8rem; }
.hw-card__price { color: #ffa14d; font-weight: 900; font-size: 1.25rem; }
.hw-card__form { margin: auto 0 0; }
.hw-card__btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .65rem .5rem; border: 1px solid rgba(255, 255, 255, .12); border-radius: 8px; background: rgba(255, 255, 255, .08); color: #fff; font-weight: 700; font-size: .82rem; font-family: inherit; cursor: pointer; transition: all .15s ease; }
.hw-card__btn:hover { background: #ff7a1a; border-color: #ff7a1a; color: #1a0b2e; }
.hw-home__more { text-align: center; margin-top: 28px; }
.hw-home__cta { display: inline-flex; align-items: center; gap: .5rem; background: linear-gradient(135deg, #ff8c2a 0%, #e8641b 100%); color: #1a0b2e; padding: .9rem 2rem; border-radius: 50px; font-weight: 800; font-size: .95rem; text-transform: uppercase; letter-spacing: 1px; box-shadow: 0 8px 30px rgba(255, 122, 26, .35); text-decoration: none; transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s ease; }
.hw-home__cta:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(255, 122, 26, .55); color: #1a0b2e; }
@media (max-width: 699px) {
    .hw-home { padding: 28px 12px 32px; }
    .hw-home__moon { width: 56px; height: 56px; top: 8px; right: 3%; }
    .hw-home__badge { font-size: .66rem; letter-spacing: .5px; padding: .3rem .7rem; }
    .hw-home__ghost { display: none; }
    .hw-home__pumpkin { width: 60px; height: 54px; }
    .hw-home__sub { font-size: .95rem; }
    .hw-card__body { padding: 10px; }
    .hw-card__btn span { font-size: .78rem; }
}
@media (prefers-reduced-motion: reduce) {
    .hw-home__moon, .hw-home__bat, .hw-home__wing, .hw-home__ghost, .hw-home__face { animation: none !important; }
    .hw-home__bat { left: 30%; }
}
/* Largeurs intermédiaires : le titre centré passe sous la lune et le fantôme, on les écarte */
@media (max-width: 1099px) {
    .hw-home__ghost { display: none; }
    .hw-home__moon { width: 84px; height: 84px; top: 12px; right: 2%; }
}
