/* =========================================================
   Royale Extermination — Page Nouvelles (nouvelles.php)
   Styles propres à cette page uniquement.
   ========================================================= */

:root{
  --nw-rouge:      #e11611;
  --nw-noir:       #1a1a1a;
  --nw-noir-texte: #111111;
  --nw-gris-texte: #404040;
  --nw-gris-pale:  #f1f1f1;
  --nw-blanc:      #ffffff;
}

/* =========================================================
   HERO
   ========================================================= */
.nw-hero{
  position:relative;
  padding:120px 60px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  isolation:isolate;
  min-height:320px;
}
.nw-hero__media{
  position:absolute;
  left:0;
  top:-380px;
  width:100%;
  min-width:1920px;
  height:856px;
  z-index:-1;
}
.nw-hero__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scaleX(-1);
}
.nw-hero__media::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(221,30,22,.8);
}
.nw-hero__title{
  font-size:60px;
  font-weight:800;
  line-height:1.2;
  letter-spacing:1.8px;
  text-align:center;
  color:var(--nw-noir);
  margin:0;
  -webkit-text-stroke:3px var(--nw-blanc);
  paint-order:stroke fill;
}

/* =========================================================
   ÉTAT VIDE — "Articles à venir"
   ========================================================= */
.nw-empty{
  background:var(--nw-gris-pale);
  padding:120px 60px;
  text-align:center;
}
.nw-empty__inner{
  max-width:640px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}
.nw-empty__icon{
  width:64px; height:64px;
  border-radius:50%;
  background:var(--nw-blanc);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:8px;
}
.nw-empty__icon svg{ width:28px; height:28px; }
.nw-empty__title{
  font-size:28px;
  font-weight:800;
  line-height:1.2;
  color:var(--nw-noir-texte);
  margin:0;
}
.nw-empty__text{
  font-size:16px;
  line-height:1.5;
  color:var(--nw-gris-texte);
  margin:0;
}

/* =========================================================
   BANDE FACEBOOK
   ========================================================= */
.nw-fb{
  background:var(--nw-rouge);
  overflow:hidden;
}
.nw-fb__art img{
  width:100%;
  height:auto;
  aspect-ratio:2880/948;
  object-fit:cover;
  display:block;
}
.nw-fb__link{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:40px 15px;
  font-size:24px;
  font-weight:800;
  line-height:24px;
  color:var(--nw-blanc);
  text-align:center;
}
.nw-fb__link img{ width:36px; height:auto; display:block; }
.nw-fb__link:hover span{ text-decoration:underline; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:900px){
  .nw-hero{ padding:80px 30px; min-height:260px; }
  .nw-hero__title{ font-size:44px; letter-spacing:1.2px; }
  .nw-hero__media{ top:0; height:100%; min-width:0; }
  .nw-empty{ padding:80px 24px; }
  .nw-empty__title{ font-size:24px; }
  .nw-fb__link{ font-size:20px; padding:32px 15px; }
}

@media (max-width:640px){
  .nw-hero{ padding:60px 20px; }
  .nw-hero__title{ font-size:34px; letter-spacing:.8px; }
  .nw-empty{ padding:64px 16px; }
}

@media (prefers-reduced-motion:reduce){
  .nw-hero__media img{ transform:none; }
}
