/* Rédactions : le fil entrant défile avec son statut, la une du jour publie l'image vérifiée
   et signée. Hero clair : dès 1100px, titre, chapô et actions à gauche, scène à droite ;
   en dessous, titre puis chapô, scène pleine largeur dessous. */

.sl-hero--nw {
  background:
    radial-gradient(ellipse 60% 70% at 85% 30%, rgba(255, 150, 100, 0.22), transparent 70%),
    #f1ebe1;
}

.sl-hero--nw .sl-hero-inner {
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
}

.sl-hero--nw .sl-hero-copy {
  flex: 1 1 560px;
}

.ps-page .sl-hero--nw .sl-h1 {
  font-size: clamp(46px, 6.6vw, 108px);
}

/* Assez large pour garder le bouton et le lien secondaire sur une ligne, en français aussi. */
.nw-hero-side {
  display: flex;
  flex: 0 1 34em;
  flex-direction: column;
  gap: 22px;
  min-width: 0;
}

.sl-hero--nw .sl-scene-col {
  flex: 1 1 100%;
  padding-top: 20px;
}

.sl-hero--nw .sl-scene {
  max-width: 1100px;
  margin: 0 auto;
}

.nw-desk {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  align-items: start;
  gap: 22px;
}

/* ---------- Fil entrant ---------- */

.nw-wire {
  overflow: hidden;
  border: 1px solid #d9cfc2;
  border-radius: 6px;
  background: #fffdf8;
}

.nw-wire-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: var(--ps-ink);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.nw-wire-live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ps-orange-light);
  font-weight: 400;
}

.nw-live {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ps-orange-light);
  animation: nw-blink 1.2s steps(1) infinite;
}

@keyframes nw-blink {
  50% { opacity: 0.2; }
}

.nw-wire-window {
  overflow: hidden;
  height: 360px;
  -webkit-mask-image: linear-gradient(#000 80%, transparent);
  mask-image: linear-gradient(#000 80%, transparent);
}

.nw-feed {
  animation: nw-feed 18s linear infinite;
}

@keyframes nw-feed {
  to { transform: translateY(-50%); }
}

.nw-it {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border-bottom: 1px solid #ece3d8;
}

.nw-it-meta {
  color: #8a7266;
  font-size: 11px;
}

.nw-it-title {
  color: var(--ps-ink);
  font-size: 14px;
  font-weight: 700;
}

.nw-it-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #3a2a22;
  font-size: 12px;
  font-weight: 700;
}

.nw-it-status .ps-status-dot {
  width: 8px;
  height: 8px;
  box-shadow: none;
}

/* ---------- La une ---------- */

.nw-paper {
  padding: 22px 26px;
  border: 1px solid #d9cfc2;
  border-radius: 4px;
  background: #fbf8f2;
  box-shadow: 0 40px 70px -40px rgba(60, 30, 10, 0.4);
}

.nw-paper-top {
  display: flex;
  justify-content: space-between;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--ps-ink);
  color: #8a7266;
  font-size: 10px;
}

.nw-paper-name {
  padding: 10px 0 8px;
  border-bottom: 3px double var(--ps-ink);
  color: var(--ps-ink);
  font-family: var(--ps-font-serif);
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-align: center;
}

.nw-paper-body {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 18px;
  padding-top: 16px;
}

.nw-paper-main {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.nw-paper-head {
  color: var(--ps-ink);
  font-family: var(--ps-font-serif);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.1;
}

.nw-photo {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  border-radius: 2px;
}

.nw-photo > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: nw-in 9s cubic-bezier(0.23, 1, 0.32, 1) infinite;
}

@keyframes nw-in {
  0%, 6% { opacity: 0; transform: translateX(-30px); }
  16%, 92% { opacity: 1; transform: none; }
  100% { opacity: 0; }
}

.nw-chip {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 4px 9px;
  border-radius: 5px;
  background: var(--ps-status-trusted);
  color: #fff;
  font-size: 11px;
  animation: nw-chip 9s ease infinite both;
}

@keyframes nw-chip {
  0%, 22% { opacity: 0; transform: translateY(-6px); }
  30%, 92% { opacity: 1; transform: none; }
  100% { opacity: 0; }
}

.nw-seal {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 3px var(--ps-orange);
  animation: nw-seal 9s cubic-bezier(0.2, 1.6, 0.4, 1) infinite both;
}

.nw-seal img {
  display: block;
  width: 26px;
  height: 26px;
}

@keyframes nw-seal {
  0%, 48% { opacity: 0; transform: scale(2); }
  56%, 92% { opacity: 1; transform: none; }
  100% { opacity: 0; }
}

.nw-paper-credit {
  color: var(--ps-muted-light);
  font-size: 10px;
}

/* Colonne de texte simulée. */
.nw-paper-col {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding-left: 16px;
  border-left: 1px solid #d9cfc2;
}

.nw-paper-col span {
  width: 100%;
  height: 6px;
  border-radius: 2px;
  background: #d9cfc2;
}

.nw-paper-col span:nth-child(2) { width: 94%; }
.nw-paper-col span:nth-child(3) { width: 98%; }
.nw-paper-col span:nth-child(4) { width: 90%; }
.nw-paper-col span:nth-child(6) { width: 86%; }
.nw-paper-col span:nth-child(7) { width: 96%; }
.nw-paper-col span:nth-child(8) { width: 70%; }
.nw-paper-col span:nth-child(10) { width: 92%; }
.nw-paper-col span:nth-child(11) { width: 88%; }
.nw-paper-col span:nth-child(12) { width: 97%; }
.nw-paper-col span:nth-child(13) { width: 64%; }

/* ---------- Bureau : texte à gauche, scène à droite ---------- */

@media (min-width: 1100px) {
  .sl-hero--nw .sl-hero-inner {
    display: grid;
    grid-template-columns: minmax(520px, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    gap: 26px 48px;
  }

  .sl-hero--nw .sl-hero-copy {
    grid-column: 1;
    grid-row: 1;
    align-self: end;
  }

  .nw-hero-side {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
  }

  .sl-hero--nw .sl-scene-col {
    grid-column: 2;
    grid-row: 1 / span 2;
    padding-top: 0;
  }

  .sl-hero--nw .sl-scene {
    max-width: 640px;
    margin: 0 0 0 auto;
  }

  .nw-desk {
    grid-template-columns: 196px minmax(0, 1fr);
    gap: 14px;
  }

  .nw-wire-window {
    height: 330px;
  }

  .nw-paper {
    padding: 16px 18px;
  }

  .nw-paper-top {
    gap: 8px;
    font-size: 9px;
  }

  .nw-paper-name {
    font-size: 32px;
  }

  .nw-paper-body {
    gap: 12px;
    padding-top: 12px;
  }

  .nw-paper-head {
    font-size: 19px;
  }

  .nw-paper-col {
    padding-left: 12px;
  }
}

/* Entre 1100 et 1279px la colonne est plus étroite : la scène est réduite d'un cran. */
@media (min-width: 1100px) and (max-width: 1279px) {
  .sl-scene .nw-desk {
    zoom: 0.86;
  }
}

/* ---------- Mobile et mouvement réduit ---------- */

@media (max-width: 900px) {
  .sl-hero--nw .sl-scene-col {
    padding-top: 0;
  }

  .nw-desk {
    grid-template-columns: minmax(0, 1fr);
  }

  .sl-scene .nw-desk {
    zoom: 0.62;
  }
}

@media (max-width: 420px) {
  .sl-scene .nw-desk {
    zoom: 0.54;
  }
}

@media (max-width: 900px), (hover: none), (prefers-reduced-motion: reduce) {
  .nw-feed,
  .nw-live,
  .nw-photo > img,
  .nw-chip,
  .nw-seal {
    animation: none;
  }
}