* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
  --navbar-height: 76px;
}

@font-face {
  font-family: 'ArsenalSC';
  src: url("../fonts/ArsenalSC-Regular.5b6296ee3985.ttf") format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'ArsenalSC-Fat';
  src: url("../fonts/ArsenalSC-Bold.f8cf66f0a799.ttf") format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Caveat';
  src: url("../fonts/Caveat-Regular.7c66865f58af.ttf") format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Caveat-large';
  src: url("../fonts/Caveat-Medium.bc3682f138a6.ttf") format('truetype');
  font-weight: 700;
  font-style: normal;
  font-size: 2rem;
}

@font-face {
  font-family: 'Ubuntu';
  src: url("../fonts/Ubuntu-Regular.84ea7c5c9d2f.ttf") format('truetype');
  font-weight: 500;
  font-style: normal;
}

/* Django message */
.django-messages {
  width: min(680px, 94%);
  margin: 12px auto 4px;
}
.django-messages ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.django-messages li {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: "ArsenalSC", sans-serif;
  font-size: 1rem;
  color: #f8ede3;
  background-color: #221c1cf2;
  border: 1px dashed #ea9ef0;
  border-left: 4px solid #ea9ef0;
  border-radius: 10px;
  box-shadow: 4px 4px 0px #ea9ef054;
  padding: 10px 16px;
  animation: django-message-in 0.35s ease;
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.django-messages li::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #ea9ef0;
  font-size: 1.05em;
}
.django-messages .success::before { content: "\f058"; }
.django-messages .error::before { content: "\58"; }
.django-messages .warning::before { content: "\f071"; }
.django-messages .info::before { content: "\f05a"; }
.django-messages .error {
  border-left-color: #e07a7a;
}
.django-messages .error::before {
  color: #e07a7a;
}
.django-messages .warning {
  border-left-color: #e0c37a;
}
.django-messages .warning::before {
  color: #e0c37a;
}
.django-messages li.django-message-out {
  opacity: 0;
  transform: translateY(-8px);
}
.django-messages li .django-message-close {
  margin-left: auto;
  background: none;
  border: none;
  color: #ea9ef0;
  font-size: 1.1em;
  cursor: pointer;
  padding: 0 2px;
}
.django-messages li .django-message-close:hover {
  color: #f8ede3;
}
@keyframes django-message-in {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* End Django messages */

body {
  min-height: 100vh;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%), url("../../vendors/img/les_petits_meurtres_saison_2_sans_titre.a857229bdd0c.jpg");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  color: white;
}

body a,
body button,
body .dropdown-item {
  color: white;
}

.sticky-top {
  background-color: transparent;
}


#navbar {
  align-items: center;
  width: 100%;
  max-width: 100%;
}
.navbar .container-fluid {
  align-items: center;
  max-width: 100%;
}
#navbar-nav {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  width: 100%;
}
.navbar-collapse {
  align-items: center;
}
#navbar-nav .nav-link,
#navbar-nav .custom-dropdown {
  margin-left: 0;
}
#navbar-nav .nav-cta {  margin-left: auto;}
.navbar-cta-button {
  font-family: "ArsenalSC", sans-serif;
  color: white;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  white-space: normal;
}
.navbar-cta-button a {
  color: white;
  text-decoration: none;
}
.navbar-cta-button:hover {
  background-color: #ea9ef0;
  color: white;
}
.navbar-cta-button:hover a {
  color: white;
}
.navbar-nav {
  width: 100%;
  margin-left: 0;
  z-index: 10;
}
.navbar-nav-left {
  align-items: flex-start;
  gap: 4px 12px;
}
.navbar-nav-left .nav-link,
.navbar-nav-left .custom-dropdown {
  margin-left: 0;
}
#navbar-nav .nav-link.navbar-nav-right,
.navbar-nav .navbar-nav-right {
  margin-left: auto;
  margin-right: 8px;
}

.navbar-nav .dropdown-menu {
  background-color: rgba(34, 28, 28, 0.95);
  border: 1px dashed #ea9ef0;
  border-radius: 10px;
  box-shadow: 4px 4px 0px #ea9ef054;
  padding: 6px 0;
  z-index: 1050;
}
.navbar-nav .dropdown-menu .dropdown-header {
  font-family: "ArsenalSC-Fat", cursive;
  font-size: 0.95rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #ea9ef0;
  border-bottom: 1px dashed #ea9ef066;
  padding-bottom: 6px;
  margin-bottom: 4px;
}
.navbar-nav .dropdown-menu .dropdown-header i {
  margin-right: 4px;
}
.navbar-nav .dropdown-menu .dropdown-item {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.95rem;
  color: white;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  border-radius: 6px;
  margin: 0 4px;
  padding: 6px 10px;
}
.navbar-nav .dropdown-menu .dropdown-item i {
  color: #ea9ef0;
  width: 18px;
  text-align: center;
}
.navbar-nav .dropdown-menu .dropdown-item:hover,
.navbar-nav .dropdown-menu .dropdown-item:focus {
  background-color: #ea9ef0;
  color: #221c1c;
}
.navbar-nav .dropdown-menu .dropdown-item:hover i,
.navbar-nav .dropdown-menu .dropdown-item:focus i {
  color: #221c1c;
}
.nav-item-icon {
  color: #ea9ef0;
  margin-right: 6px;
}
.navbar-nav-right .nav-item.dropdown-toggle {
  margin-top: 0;
}
.user-dropdown .dropdown-menu {
  left: auto;
  right: 0;
  max-width: min(320px, calc(100vw - 16px));
}
.navbar-collapse {
  overflow: visible;
}
@media (min-width: 992px) {
  .navbar-nav .navbar-nav-right {
    margin-left: auto;
    margin-right: 8px;
  }
}

.navbar-custom {
  background-color: transparent;
  border: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1040;
}
/* la navbar etant fixed, on reserve sa hauteur sous le header pour ne pas masquer le contenu */
body { padding-top: 76px; }
header { height: 0; }

.navbar-collapse {
  justify-content: space-between;
}
#navbar-nav .nav-cta {  margin-left: auto;  margin-right: 8px;}


.navbar-collapse {
  transition: opacity 0.3s ease;
}

.navbar-collapse.show {
  opacity: 1;
}

.navbar-collapse.collapsing {
  opacity: 0;
}

.navbar-toggler {
  color: black;
  position: absolute;
  top: 10px;
  right: 2%;
  padding: 1% 1%;
  margin-right: 6%;
  border: 1px solid white;
}

.navbar-brand {
  font-family: "Caveat-large", cursive;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-size: 24px;
  color: white !important;
}

.nav-link {
  padding: 0;
  display: flex;
  justify-content: center;
  font-family: "ArsenalSC-Fat", sans-serif;
  text-transform: uppercase;
}

.nav-link a {
  text-decoration: none;
}

.nav-link a:hover,
.nav-link a:active{
  color: blue;
}

.dropdown-item {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.image_profile {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.dropdown-menu {
  width: max-content;
  min-width: 230px;
  border: 1px dashed pink;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 1050;
}

.dropdown-header {
  display: flex;
  justify-content: center;
  color: pink;
}

.custom-dropdown {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.user-dropdown {
  margin-top: 2%;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "ArsenalSC", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: white;
}

section {
  border-bottom: 1px dashed pink;
  background-color: #0000007d;
}

.section btn {
  background-color: #00000042;
  border: 1px solid pink;
}

section .btn:hover {
  background-color: #4f5e4ac7;
  border: 1px solid pink;
}
.btn,
.btn-primary {
  font-family: "ArsenalSC", sans-serif;
  color: white;
  background-color: #221c1cd9;
  border: 1px solid #ea9ef066;
  white-space: normal;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
  padding: 8px 16px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
.btn a,
.btn-primary a {
  color: white;
  text-decoration: none;
}
.btn:hover,
.btn-primary:hover,
.btn:hover a,
.btn-primary:hover a {
  background-color: #ea9ef0;
  color: #221c1c;
  border-color: #ea9ef0;
  box-shadow: 0 6px 18px #ea9ef047;
  transform: translateY(-2px);
}
.btn:focus-visible,
.btn-primary:focus-visible {
  outline: 2px dashed #ea9ef0;
  outline-offset: 2px;
}
.btn:active,
.btn-primary:active {
  transform: translateY(0);
}

.login-container {
  margin-bottom: 0%;
}

.login-container .btn {
  width: 100%;
  background-color: #00000042;
  border: 1px solid pink;
}

.login-container .btn:hover {
  color: white;
  width: 100%;
  background-color: #4f5e4ac7;
  border: 1px solid pink;
}





.photos-feed-items {
  display: flex;
  flex-direction: row;
  width: 100%;
  border-bottom: 1px dashed pink;
}

.posts-feed-items {
  display: flex;
  flex-direction: column;
  width: 100%;
  border-bottom: 1px dashed pink;
}

.feed-item {
  width: 20%;
  background-color: #00000054;
}

.feed-item p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  color: pink;
  text-transform: uppercase;
  text-shadow: #E6CDDA 2px 0 10px;
  font-size: 1rem;
  margin: 0% 0%;
}

.feed-item btn {
  background-color: #0000;
  border: 1px solid white;
}

.feed-item btn:hover {
  background-color: #4f5e4ac7;
  border: 1px solid white;
}

.feed-item-elements {
  display: flex;
  flex-direction: column;
}


.feed-item-detail {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 5%;
}

.feed-intro,
.feed-section-photos,
.feed-section-posts,
.feed-section-personnages,
.feed-section-a-propos,
.feed-section-audiences {
  padding: 0% 0%;
  font-size: 1.5rem;
  font-family: "ArsenalSC-Fat", cursive;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}

.feed-intro {
  height: calc(100vh - var(--navbar-height, 76px));
  min-height: 480px;
  justify-content: flex-start;
  overflow: hidden;
}
/* Condense d'accueil : doit tenir dans le viewport sans deborder sur la section suivante */
.feed-intro > .d-flex { flex: 0 0 auto; }
.feed-intro > .d-flex h3 { font-size: 1.05em; margin: 0; }
.feed-intro > .d-flex .fa-house { display: none; }
.feed-intro-actors { gap: 12px; margin: 8px auto 4px; }
.feed-intro-actor-card { width: min(240px, 92%); padding: 8px 10px 10px; border-radius: 10px; }
.feed-intro-actor-card img { max-height: 84px; width: auto; object-fit: cover; }
.feed-intro-actor-name { font-size: 0.8em; }
.feed-intro-actor-teaser { font-size: 0.95em; min-height: 2.2em; }
/* liens de sommaire vers les autres sections */
.feed-condense-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 8px auto 0; padding: 8px 12px; width: fit-content; max-width: 96%; background-color: #221c1c8c; border: 1px dashed #ea9ef0; border-radius: 12px; box-shadow: 4px 4px 0px #ea9ef054; }
.feed-condense-nav a { font-family: "ArsenalSC", sans-serif; text-transform: uppercase; letter-spacing: 1px; font-size: 0.78em; color: #f8ede3; background-color: #170f0faa; border: 1px dashed #ea9ef07e; border-radius: 8px; padding: 6px 12px; text-decoration: none; white-space: nowrap; transition: transform 0.15s ease, box-shadow 0.15s ease, color 0.15s ease; }
.feed-condense-nav a i { color: #ea9ef0; margin-right: 5px; }
.feed-condense-nav a:hover { color: #ea9ef0; transform: translateY(-2px); box-shadow: 3px 3px 0px #ea9ef054; }
/* bureau plus compact dans le condense */
.feed-interrogation-label { font-size: 1.1em; margin-bottom: 4px; }
.feed-evidence-slot { width: min(520px, 94%); height: 240px; border-width: 7px; }
.feed-evidence-card { width: min(190px, 56%); top: 8px; }
.feed-evidence-card img { max-height: 168px; }

.feed-intro-actors {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 18px;
  flex-wrap: wrap;
  width: min(1100px, 100%);
  margin: 14px auto 6px;
}
.feed-actors-zone {
  width: min(1100px, 100%);
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.feed-interrogation-desk {
  margin-top: auto;
}
.feed-intro > .d-flex {
  flex: 0 0 auto;
}

.feed-intro-actor-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(300px, 92%);
  padding: 12px 14px 14px;
  text-decoration: none;
  color: #f8ede3;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 12px;
  box-shadow: 4px 4px 0px #ea9ef054;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.feed-intro-actor-card--laurence {
  width: min(340px, 92%);
  border-radius: 18px 4px 18px 4px;
  border-style: solid;
  background-image: repeating-linear-gradient(
    45deg,
    rgba(234, 158, 240, 0.07) 0px,
    rgba(234, 158, 240, 0.07) 2px,
    transparent 2px,
    transparent 8px
  );
}
.feed-intro-actor-card--laurence::before {
  content: "\2605\00a0 DOSSIER N\00b01";
  position: absolute;
  top: 6px;
  left: 10px;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.62em;
  letter-spacing: 0.08em;
  color: #ea9ef0;
}
.feed-intro-actor-card--laurence img {
  height: 200px;
  border-radius: 14px 2px 14px 2px;
}
.feed-intro-actor-card--avril {
  width: min(280px, 92%);
  border-radius: 50px 50px 12px 12px;
  border-style: dashed;
  transform: rotate(-1.5deg);
  background-color: rgba(34, 28, 28, 0.62);
}
.feed-intro-actor-card--avril::before {
  content: "\f1ea";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 8px;
  right: 12px;
  font-size: 1.1em;
  color: #ea9ef0;
}
.feed-intro-actor-card--avril img {
  height: 150px;
  border-radius: 45px;
  object-position: center 20%;
}
.feed-intro-actor-card--avril:hover {
  transform: rotate(0deg) translateY(-4px) scale(1.02);
}
.feed-intro-actor-card--marlene {
  width: min(320px, 92%);
  border-radius: 4px 26px 4px 26px;
  border-color: #ea9ef0;
  border-width: 2px;
  background-image: radial-gradient(
    circle at 15% 15%,
    rgba(234, 158, 240, 0.16) 0%,
    transparent 42%
  );
  box-shadow: 6px 6px 0px #ea9ef03d;
}
.feed-intro-actor-card--marlene::before {
  content: "\2665";
  position: absolute;
  bottom: 8px;
  right: 12px;
  font-size: 1.2em;
  color: #ea9ef0;
  opacity: 0.85;
}
.feed-intro-actor-card--marlene img {
  height: 185px;
  border-radius: 4px 24px 4px 24px;
}
.feed-intro-actor-card--marlene:hover {
  transform: translateY(-4px) rotate(1deg) scale(1.02);
}

.feed-intro-actor-card:hover,
.feed-intro-actor-card:focus {
  transform: translateY(-4px) scale(1.02);
  border-color: #f8ede3;
  box-shadow: 6px 8px 0px #ea9ef08c;
}

.feed-intro-actor-card img {
  width: 100%;
  height: 170px;
  object-fit: cover;
  object-position: top;
  border-radius: 8px;
  border: 1px solid #ea9ef066;
  margin-bottom: 10px;
  transition: transform 0.25s ease;
}

.feed-intro-actor-card:hover img,
.feed-intro-actor-card:focus img {
  transform: scale(1.04);
}

.feed-intro-actor-name {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.95em;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #ea9ef0;
  margin-bottom: 6px;
  text-align: center;
}

.feed-intro-actor-teaser {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 0.92em;
  color: #f8ede3;
  text-align: center;
  min-height: 2.6em;
}

.feed-intro-actor-card--laurence::after,
.feed-intro-actor-card--avril::after,
.feed-intro-actor-card--marlene::after {
  content: "" !important;
  display: none;
  opacity: 0;
}
.feed-intro-actor-card::after {
  content: "\2192 Ouvrir le dossier";
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.72em;
  color: #ea9ef0;
  margin-top: 8px;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.feed-intro-actor-card:hover::after,
.feed-intro-actor-card:focus::after {
  opacity: 1;
}

@media (max-width: 700px) {
  .feed-intro-actors {
    flex-direction: column;
    align-items: center;
  }
}

.feed-intro h3 {
  font-family: "Caveat-large", cursive;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  color: white;
}

.feed-section-photos {
  height: 100vh;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%), url("../../vendors/img/les_petits_meurtres_saison_2_feed_section_photos.1eaf76212473.jpg");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.feed-section-posts {
  height: 100vh;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%), url("../../vendors/img/les_petits_meurtres_saison_2_feed_section_posts.834d5d94a014.jpg");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.feed-section-personnages {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%), url("../../vendors/img/les_petits_meurtres_saison_2_feed_section_personnages.cf3ba937f664.jpg");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.feed-section-audiences {
  height: auto;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 100%), url("../../vendors/img/les_petits_meurtres_saison_2_feed_section_audiences.24e43ea489fc.jpg");
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}


.feed-smileys {
  color: pink;
  font-size: 1.5rem;
  margin-right: 1%;
}

.feed-button-zone {
  display: flex;
  flex-direction: row;
  padding: 1% 1%;
}

.feed-button-zone a{
  text-decoration: none;
}

feed-button-zone a:hover {
  color: pink;
}

.photo_miniature {
  width: 100%;
  height: 100%;
  max-height: 130px;
  border-radius: 15px;
  padding: 1% 1%;
}

.home-elements {
  color: white;
}
.home-comedie-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.footer-contact-admin svg {
  width: 22px;
  height: 22px;
}
.home-signin-button {
  white-space: normal;
}
.footer-contact-admin {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}
.footer-contact-admin svg {
  width: 18px;
  height: 18px;
}

.home-elements h2 {
  font-size: 2rem;
}

.home-elements-head {
  margin-top: 1%;
  margin-left: 5%;
}

.home-elements-middle {
  position: relative;
  margin: 1% 0% 0% 5%;
  padding: 1.5% 2% 1% 2%;
  max-width: 75%;
  width: fit-content;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 15px;
  box-shadow: 4px 4px 0px #ea9ef054;
}
.home-elements-middle blockquote {
  margin: 0;
}
.home-elements-middle p {
  margin: 0;
  font-size: 0.95rem;
}
.home-elements-middle cite {
  display: block;
  margin-top: 0.5%;
  text-align: right;
  font-size: 0.85rem;
  color: #ea9ef0;
}
.detective-magnifier {
  position: absolute;
  top: -16px;
  left: -16px;
  color: #ea9ef0;
  background-color: #221c1c;
  border: 1px dashed #ea9ef0;
  border-radius: 50%;
  padding: 4px;
  transform: rotate(-20deg);
  line-height: 0;
}
.detective-magnifier svg {
  width: 22px;
  height: 22px;
}













/* PERSONNAGES */
.personnages .section_container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.personnages_article {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  text-align: center;
  width: 80%;
}

.personnage_container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  width: 50%;
  font-size: 0.9em;
}


.personnage_container h4 {
  color: pink;
  text-align: center;
  text-shadow: #85586F 2px 0 10px;
}

.personnage_description p {
  text-align: left;
  font-size: 0.9rem;
  font-family: "Ubuntu", sans-serif;
  text-shadow: #85586F 2px 0 10px;
}

.personnage_container img {
  width: 200px;
  height: 150px;
  transition-duration: 0.7s;
}

.personnage_container img:hover{
  width: 300px;
  height: 225px;
  transition-duration: 0.7s;
}

.personnage_container figcaption{
  font-size: 1rem;
  font-family: "Ubuntu", sans-serif;
}

.personnage_description {
  margin: 0 10px 0 10px;
  font-size: 1.3em;
  font-family: "Ubuntu", sans-serif;
}

/* A PROPOS */
.a_propos_article {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.a_propos_container {
  padding: 0 2% 3% 2%;
  font-family: 'Ubuntu', sans-serif;
  font-size: 0.9rem;
  text-align: left;
}

.a_propos_container h4 {
  font-size: 1.3rem;
  font-family: "ArsenalSC-Fat", sans-serif;
  text-shadow: #85586F 2px 0 10px;
  text-transform: uppercase;
}

.a_propos_container p {
  font-family: 'Ubuntu', sans-serif;
  font-size: 1rem;
  text-align: left;
  padding: 0 0;
  margin: 0 0;
}

/* AUDIENCES */
.table {
  color: pink;
  margin-bottom: 5%;
  font-size: 1rem;
}

.audiences .table th,
.audiences .table tr,
.audiences .table td {
  color: #F8EDE3;
}

.audiences .table .topblog_tr:hover,
.audiences .table .topblog_tr:focus {
  background-color: #85586F;
}

footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  color: white;
  background-color: black;
  z-index: 1030;
}
body {
  padding-bottom: 90px;
}


footer .d-flex {
    flex: 1;
}

footer p {
  font-family: "ArsenalSC-Fat", sans-serif;
  font-size: 1rem;
  margin: 0;
}
.footer-row {
  flex-direction: column;
  gap: 6px;
  flex-wrap: wrap;
  padding: 10px 0 14px;
}
.footer-socials {
  gap: 10px;
  align-items: center;
}

footer a {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0;
}

.footer-container {
  display: flex;
  flex-direction: column;
}


.social-icons img {
    width: 20px;
    height: 20px;
    object-fit: contain; /* Ensures the image is scaled to fit within the specified dimensions */
}
footer .social-icons,
footer .footer-contact-admin {
    padding-bottom: 10px;
}


@media (max-width: 991.98px) {
  .user-dropdown {
    border-top: 1px solid pink;
    padding-top: 8px;
  }
  #navbar-nav {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 8px 0;
  }
  .navbar-nav-left {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px 0;
  }
  .navbar-nav-left .nav-link,
  .navbar-nav-left .custom-dropdown {
    width: 100%;
  }
  .navbar-nav .navbar-nav-right {
    margin-left: 0;
    margin-top: 8px;
  }
  .navbar-nav-right .nav-item.dropdown-toggle {
    margin-top: 0;
  }
  #navbar-nav .nav-link,
  #navbar-nav .custom-dropdown {
    width: 100%;
  }
  #navbar-nav .nav-cta {    margin-left: 0;  }
  .navbar-cta-button {
    width: 100%;
  }
}


@media (max-width: 576px) {



  .feed-item {
    width: 100%;
    background-color: #00000054;
  }

  .feed-item-elements {
    display: flex;
    flex-direction: column;
  }

  .photo_miniature {
    width: 100%;
    height: 100%;
    border-radius: 15px;
    padding: 1% 1%;
    max-height: 260px;
  }



  .personnages_article {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: nowrap;
  }

  .personnage_container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    width: 100%;
    font-size: 0.9em;
  }

  .personnage_container h4 {
    text-align: center;
  }

  .personnage_container img{
    width: 200px;
    height: auto;
    border-radius: 15px;
  }

  .personnage_container img:hover {
    width: 300px;
    transition-duration: 0.7s;
  }

  /* AUDIENCES */
  .table {
    color: pink;
    margin-bottom: 5%;
    font-size: 17px
  }
  .audiences {
    background-image: linear-gradient(rgba(0,0,0,0.8), rgba(0, 0, 0, 0.8)), url("../../vendors/img/audiences.65bc7659e362.jpg");
    padding-bottom: 3%;
  }

  .audiences .table th,
  .audiences .table tr,
  .audiences .table td {
    color: #F8EDE3;
    font-size: 0.9em;
    padding: 0;
  }
}
.feed-interrogation-table {  overflow: hidden;  width: 100%;  margin: 0;  position: relative;}
/* Effet "policier qui jette les photos une a une sur la table" */
.feed-interrogation-desk {  margin-top: auto;  display: flex;  flex-direction: column;  align-items: center;}
/* Le bureau suit immediatement le condense : pas d'espace mort, on soude nav et bureau */
.feed-interrogation-desk { margin-top: 10px; }
.feed-interrogation-label {  display: flex;  align-items: center;  gap: 10px;  font-family: "Caveat-large", "Caveat", cursive;  font-size: 1.35em;  color: #ea9ef0;  margin-bottom: 8px;}
.feed-interrogation-label .fa-hand-point-down {  animation: interrogation-tap 1.6s ease-in-out infinite;  display: inline-block;}
@keyframes interrogation-tap {  0%, 100% { transform: translateY(0); }  50% { transform: translateY(6px); } }
.feed-evidence-slot {  position: relative;  width: min(680px, 96%);  height: 380px;  margin: 0 auto;  background: linear-gradient(180deg, #2a3d33 0%, #22332a 60%, #1c2a22 100%);  border: 10px solid #5b3a24;  border-radius: 6px;  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.55), 0 14px 30px rgba(0, 0, 0, 0.6);  overflow: hidden;}
/* effet bois du bureau : veines discretes */
.feed-evidence-slot::after {  content: "";  position: absolute;  inset: 0;  background: repeating-linear-gradient(95deg, transparent 0 46px, rgba(0,0,0,0.06) 46px 48px), repeating-linear-gradient(0deg, transparent 0 120px, rgba(255,255,255,0.02) 120px 122px);  pointer-events: none;  z-index: 0;}
.feed-desk-stamp {  position: absolute;  bottom: 14px;  right: 18px;  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;  font-size: 0.8em;  letter-spacing: 2px;  text-transform: uppercase;  color: #c0392b;  border: 2px solid #c0392b;  border-radius: 4px;  padding: 4px 10px;  transform: rotate(-6deg);  opacity: 0.75;  z-index: 1;  pointer-events: none;}

.feed-evidence-pile {  position: absolute;  inset: 0;  pointer-events: none;  z-index: 4;}
.feed-evidence-pile .feed-evidence-card {  pointer-events: auto;}
.feed-evidence-deck .feed-evidence-card {  display: none;}
/* sans JS : premiere photo affichee en statique */
/* BUGFIX : le fallback statique doit rester SOUS la pile (z-index 1)
   sinon la 1ere photo masque toutes les photos jetees par la suite. */
.feed-evidence-deck .feed-evidence-card:first-child { display: none; }
/* bureau de Marlene : papier journal, machine a ecrire, bonbonne Treets */
.feed-evidence-card {  position: absolute;  top: 12px;  left: 50%;  width: min(240px, 60%);  z-index: 5;}
.feed-evidence-card img {  width: 100%;  height: auto;  max-height: 240px;  object-fit: cover;  border-radius: 6px;  border: 1px dashed #ea9ef0;  box-shadow: 6px 8px 18px rgba(0, 0, 0, 0.6);  background-color: #170f0f;}
/* etat "jetee sur la table" */
.feed-evidence-card.evidence-toss {  animation: evidence-toss 0.85s cubic-bezier(0.3, 0.7, 0.4, 1.15) forwards;}
@keyframes evidence-toss {
  0% {    opacity: 0;    transform: translate(-50%, -190px) rotate(calc(var(--toss-spin, -14deg) * -1.4)) scale(0.9);  }
  55% {    opacity: 1;  }
  70% {    transform: translate(-50%, 6px) rotate(var(--toss-spin, -14deg));  }
  85% {    transform: translate(-50%, -4px) rotate(calc(var(--toss-spin, -14deg) * 0.7));  }
  100% {    transform: translate(calc(-50% + var(--toss-x, 0px)), 0) rotate(var(--toss-spin, -14deg));  }
}
.feed-evidence-card.evidence-rest {  transform: translate(calc(-50% + var(--toss-x, 0px)), 0) rotate(var(--toss-spin, -14deg));}
@media (prefers-reduced-motion: reduce) {  .feed-evidence-card.evidence-toss {    animation: none;  } }
.feed-highlight {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 2% auto;
  width: 100%;
}
.feed-encadre {
  margin: 1% 0% 1% 0%;
  max-width: 75%;
}
.feed-encadre-photos-group {
  justify-content: center;
  gap: 12px;
  margin-top: 1%;
}
.feed-encadre-photo-item img {
  height: 80px;
  width: auto;
  border-radius: 8px;
  border: 1px dashed #ea9ef0;
  transform: rotate(-2deg);
  box-shadow: 4px 4px 0px #ea9ef054;
}
.feed-encadre-photo-item:nth-child(2) img { transform: rotate(2deg); }
.feed-encadre-photo-item:nth-child(3) img { transform: rotate(-1deg); }
.feed-encadre-posts-group {
  justify-content: center;
  gap: 16px;
  margin-top: 1.5%;
  flex-wrap: wrap;
}
.feed-case-file {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 220px;
  text-decoration: none;
  color: #f4e9d8;
  background-color: #d9c39a;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(93, 66, 38, 0.05) 0px,
    rgba(93, 66, 38, 0.05) 1px,
    transparent 1px,
    transparent 6px
  );
  border: 1px solid #6d4226;
  border-radius: 2px 2px 6px 6px;
  box-shadow: 4px 4px 0px rgba(34, 28, 28, 0.55);
  overflow: hidden;
  font-family: "Courier New", "ArsenalSC", monospace;
  transform: rotate(-1deg);
  transition: transform 0.2s ease;
}
.feed-case-file:nth-child(2) { transform: rotate(1deg); }
.feed-case-file:nth-child(3) { transform: rotate(-2deg); }
.feed-case-file:hover {
  transform: rotate(0deg) scale(1.05);
  z-index: 2;
}
.feed-case-file::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 10px;
  background: repeating-linear-gradient(
    90deg,
    #6d4226 0px,
    #6d4226 14px,
    transparent 14px,
    transparent 18px
  );
  border-bottom: 1px solid #6d4226;
}
.feed-case-file-tab {
  position: absolute;
  top: 10px;
  right: 0;
  background-color: #6d4226;
  color: #f4e9d8;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-left: 1px solid #6d4226;
  border-bottom: 1px solid #6d4226;
  box-shadow: -2px 2px 0px rgba(34, 28, 28, 0.4);
}
.feed-case-file-body {
  display: flex;
  flex-direction: column;
  padding: 22px 10px 10px 10px;
  gap: 6px;
}
.feed-case-file-body img {
  height: 80px;
  width: 100%;
  object-fit: cover;
  border-radius: 2px;
  border: 1px solid #6d4226;
  filter: sepia(0.45) contrast(0.95);
}
.feed-case-file-text {
  display: flex;
  flex-direction: column;
  font-size: 0.8rem;
  line-height: 1.25;
  color: #3d2c1a;
}
.feed-case-file-text em {
  color: #6d4226;
}
.feed-case-file-text strong {
  border-bottom: 1px dashed #6d4226;
}
.user-dropdown-profile {
  display: flex;
  justify-content: center;
  padding: 8px 0 4px 0;
}
.navbar-profile-in-menu {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.navbar-default-profile-badge {
  width: 50px;
  height: 50px;
  display: block;
  margin: 0 auto;
}

.feed-actors-spotlight {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  gap: 28px;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1100px;
  margin: 2.5% auto;
}

.feed-actor-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 340px;
  max-width: 480px;
  padding: 10px 14px;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 12px;
  box-shadow: 4px 4px 0px #ea9ef054;
}

.feed-actor-card::before,
.feed-actor-card::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  border: 2px solid #ea9ef0;
}

.feed-actor-card::before {
  top: -1px;
  left: -1px;
  border-right: none;
  border-bottom: none;
  border-top-left-radius: 12px;
}

.feed-actor-card::after {
  bottom: -1px;
  right: -1px;
  border-left: none;
  border-top: none;
  border-bottom-right-radius: 12px;
}

.feed-actor-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.feed-actor-card-header .fa-solid {
  color: #ea9ef0;
  font-size: 1em;
}

.feed-actor-card-header h4 {
  margin: 0;
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 0.9em;
}

.feed-actor-card-news {
  margin: 0;
  color: #f8ede3;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.78em;
  line-height: 1.3;
}

.feed-actor-card-role {
  margin: 0;
  color: #f8ede3;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.74em;
  font-style: italic;
  line-height: 1.25;
  border-top: 1px dashed #ea9ef06e;
  padding-top: 5px;
}

.feed-audiences-row-glow {
  background-color: #ea9ef033 !important;
  box-shadow: inset 0 0 18px #ea9ef05c, 4px 4px 0px #ea9ef054;
  animation: feed-audiences-row-glow 1.6s ease-in-out;
}
.feed-audiences-row-glow td {
  color: #ea9ef0;
  text-shadow: 0 0 8px #ea9ef066;
}

@keyframes feed-audiences-row-glow {
  0% { background-color: transparent; box-shadow: none; }
  40% { background-color: #ea9ef033; box-shadow: inset 0 0 18px #ea9ef05c; }
  100% { background-color: transparent; box-shadow: none; }
}

.feed-audiences-row-scan {
  background-color: #ea9ef01f;
  box-shadow: inset 0 0 12px #ea9ef042;
}

.feed-audiences-topcallout {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.92);
  z-index: 1080;
  width: fit-content;
  max-width: min(640px, 92vw);
  padding: 16px 24px;
  background-color: #221c1cf7;
  border: 1px dashed #ea9ef0;
  border-radius: 14px;
  box-shadow: 4px 4px 0px #ea9ef054, 0 0 30px #ea9ef044;
  color: #f8ede3;
  font-family: "ArsenalSC", sans-serif;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.25, 0.8, 0.35, 1.15);
}
.feed-audiences-topcallout::before {
  content: "DOSSIER D'AUDIENCE";
  position: absolute;
  top: -13px;
  left: 22px;
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.68em;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #221c1c;
  background-color: #ea9ef0;
  border-radius: 5px;
  padding: 3px 10px;
  transform: rotate(-2deg);
  box-shadow: 2px 2px 0px #ea9ef054;
}
.feed-audiences-topcallout.visible {
  opacity: 1;
}

.feed-audiences-topcallout strong {
  color: #ea9ef0;
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  text-transform: uppercase;
}

.site-scroll-nav {
  position: fixed;
  right: 14px;
  bottom: 24px;
  z-index: 1070;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.scroll-nav-btn {
  width: 42px;
  height: 42px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 10px;
  box-shadow: 3px 3px 0px #ea9ef054;
  cursor: pointer;
  transition: transform 0.15s ease, background-color 0.2s ease;
}

.scroll-nav-btn:hover {
  background-color: #221c1cf2;
  transform: translateY(-2px);
}

.scroll-nav-btn:active {
  transform: translateY(0);
}

.scroll-nav-btn svg {
  width: 24px;
  height: 24px;
}

@media (max-width: 820px) {
  .site-scroll-nav {
    right: 8px;
    bottom: 16px;
    gap: 6px;
  }

  .scroll-nav-btn {
    width: 36px;
    height: 36px;
  }

  .scroll-nav-btn svg {
    width: 20px;
    height: 20px;
  }
}

/* ===== POST DETAIL ===== */
.post-detail-section {
  padding-bottom: 2%;
}

.post-detail-header h2 {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 1.4em;
  margin-top: 4px;
}

.post-detail-card {
  margin: 1% auto;
  padding: 18px 24px;
  width: min(1000px, 94%);
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 14px;
  box-shadow: 4px 4px 0px #ea9ef054;
}

.post-detail-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  font-size: 1.5em;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.post-detail-meta {
  border-bottom: 1px dashed #ea9ef06e;
  padding-bottom: 10px;
  gap: 8px 16px;
}

.post-detail-meta-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.85em;
  color: #f8ede3;
}

.post-detail-meta-info i {
  color: #ea9ef0;
  margin-right: 5px;
}

.post-detail-body {
  gap: 20px;
  margin-top: 12px;
  align-items: flex-start;
}

.post-detail-text {
  flex: 1 1 320px;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.95em;
  line-height: 1.45;
  color: #f8ede3;
}

.post-detail-figure {
  flex: 0 1 340px;
  margin: 0;
  text-align: center;
}

.post-detail-figure img {
  width: 100%;
  max-height: 260px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px dashed #ea9ef0;
}

.post-detail-figure figcaption {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.75em;
  font-style: italic;
  color: #f8ede3;
  margin-top: 6px;
}

.post-detail-quote {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 14px 0 6px;
  padding: 10px 14px;
  background-color: #ea9ef00f;
  border-left: 3px solid #ea9ef0;
  border-radius: 0 10px 10px 0;
}

.post-detail-quote .detective-magnifier {
  color: #ea9ef0;
  font-size: 1.3em;
}

.post-detail-quote blockquote {
  margin: 0;
}

.post-detail-quote-text {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.05em;
  color: #f8ede3;
  margin: 0;
}

.post-detail-quote-author {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.78em;
  color: #ea9ef0;
  margin: 2px 0 0;
}

.post-detail-actions {
  margin-top: 10px;
}

/* ===== PHOTOS GRID ===== */
.photos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 22px;
  width: min(1400px, 100%);
  margin: 1% auto;
  align-items: stretch;
}

.photos-grid-card {
  display: flex;
  flex-direction: column;
  background-color: #221c1cf2;
  border: 1px solid #ea9ef055;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
  padding: 12px;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.photos-grid-card:hover {
  transform: translateY(-6px);
  border-color: #ea9ef0;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px #ea9ef066;
}

.photos-grid-figure {
  margin: 0 0 10px;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.photos-grid-figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(34, 28, 28, 0.55) 100%);
  pointer-events: none;
}

.photos-grid-figure img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 10px;
  transition: transform 0.4s ease;
}

.photos-grid-card:hover .photos-grid-figure img {
  transform: scale(1.05);
}

.photos-grid-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  font-size: 0.95em;
  margin-bottom: 4px;
}

.photos-grid-meta {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.8em;
  color: #f8ede3;
  margin-bottom: 2px;
}

.photos-grid-quote {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
  padding: 8px 12px;
  background-color: #ea9ef00f;
  border-left: 3px solid #ea9ef0;
  border-radius: 0 10px 10px 0;
}

.photos-grid-quote .detective-magnifier {
  color: #ea9ef0;
  font-size: 1.1em;
}

.photos-grid-quote blockquote {
  margin: 0;
}

.photos-grid-quote-text {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 0.95em;
  color: #f8ede3;
  margin: 0;
}

.photos-grid-quote-author {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.72em;
  color: #ea9ef0;
  margin: 2px 0 0;
}

.photos-grid-btn {
  margin-top: auto;
}

.posts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 22px;
  width: min(1400px, 100%);
  margin: 1% auto;
  align-items: stretch;
}

.posts-grid-card {
  display: flex;
  flex-direction: column;
  background-color: #221c1cf2;
  border: 1px solid #ea9ef055;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
  padding: 12px;
  position: relative;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.posts-grid-card::before {
  content: "\f15c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 18px;
  right: 16px;
  font-size: 1.2em;
  color: #ea9ef0;
  background-color: #221c1cf2;
  border: 1px dashed #ea9ef0;
  border-radius: 8px;
  padding: 6px 8px;
  z-index: 2;
}

.posts-grid-card:hover {
  transform: translateY(-6px);
  border-color: #ea9ef0;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px #ea9ef066;
}

.posts-grid-figure {
  margin: 0 0 10px;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.posts-grid-figure img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 10px;
  transition: transform 0.4s ease;
}

.posts-grid-card:hover .posts-grid-figure img {
  transform: scale(1.05);
}

.posts-grid-figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0;
  padding: 18px 12px 8px;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.75em;
  font-style: italic;
  color: #f8ede3;
  background: linear-gradient(180deg, transparent, rgba(34, 28, 28, 0.85));
}

.posts-grid-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  font-size: 1em;
  margin-bottom: 4px;
}

.posts-grid-meta {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.8em;
  color: #f8ede3;
  margin-bottom: 2px;
}

.posts-grid-meta i {
  color: #ea9ef0;
  margin-right: 4px;
}

.posts-grid-quote {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
  padding: 8px 12px;
  background-color: #ea9ef00f;
  border-left: 3px solid #ea9ef0;
  border-radius: 0 10px 10px 0;
}

.posts-grid-quote .detective-magnifier {
  color: #ea9ef0;
  font-size: 1.1em;
}

.posts-grid-quote blockquote {
  margin: 0;
}

.posts-grid-quote-text {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 0.95em;
  color: #f8ede3;
  margin: 0;
}

.posts-grid-quote-author {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.72em;
  color: #ea9ef0;
  margin: 2px 0 0;
}

@media (max-width: 700px) {
  .photos-grid,
  .posts-grid {
    grid-template-columns: 1fr;
  }

  .post-detail-body {
    flex-direction: column-reverse;
  }

  .post-detail-figure {
    flex-basis: auto;
  }
}

/* ===== ACTION PAGES (forms: add/update/delete/follow/auth) ===== */
.action-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: 1% 0 3%;
}

.action-page h2 {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 1.35em;
  margin-top: 4px;
  text-align: center;
}

.action-card {
  margin: 1% auto;
  padding: 18px 24px;
  width: min(760px, 94%);
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 14px;
  box-shadow: 4px 4px 0px #ea9ef054;
}

.action-card form {
  width: 100%;
}

.action-card label {
  font-family: "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  font-size: 0.8em;
  letter-spacing: 1px;
  margin-top: 10px;
  margin-bottom: 4px;
}

.action-card input[type="text"],
.action-card input[type="email"],
.action-card input[type="password"],
.action-card textarea,
.action-card select {
  width: 100%;
  background-color: #170f0faa;
  border: 1px dashed #ea9ef07e;
  border-radius: 8px;
  color: #f8ede3;
  font-family: "ArsenalSC", sans-serif;
  padding: 8px 10px;
  outline: none;
}

.action-card input:focus,
.action-card textarea:focus,
.action-card select:focus {
  border-color: #ea9ef0;
  box-shadow: 0 0 6px #ea9ef066;
}

.action-card input[type="file"] {
  margin-top: 10px;
  color: #f8ede3;
  font-family: "ArsenalSC", sans-serif;
}

.action-card p {
  font-family: "ArsenalSC", sans-serif;
  color: #f8ede3;
}

.action-card .button_container,

.action-card .btn + .btn,
.action-card form + form {
  margin-top: 10px;
}

.action-encart {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 auto 14px;
  padding: 10px 16px;
  width: fit-content;
  max-width: min(760px, 94%);
  background-color: #ea9ef00f;
  border-left: 3px solid #ea9ef0;
  border-radius: 0 12px 12px 0;
}

.action-encart .encart-icon {
  color: #ea9ef0;
  font-size: 1.25em;
}

.action-encart .encart-text {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.1em;
  color: #f8ede3;
  margin: 0;
}

.action-actions {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.action-card h3 {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: 1em;
  margin-top: 14px;
  margin-bottom: 4px;
}

.action-card-item-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #ea9ef0;
  font-size: 1.1em;
  letter-spacing: 1px;
  text-align: center;
}

.photo-delete-preview {
  max-width: 40%;
  border-radius: 10px;
  border: 1px dashed #ea9ef0;
  box-shadow: 4px 4px 0px #ea9ef054;
  margin-bottom: 12px;
}

footer .social-icons,
footer .footer-mistral,
footer .footer-contact-admin {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Bouton d'action du contenu de la page /home/ (indépendant de la navbar) */
.home-content-cta {
  font-family: "ArsenalSC", sans-serif;
  color: white;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  white-space: normal;
}
.home-content-cta a {
  color: white;
  text-decoration: none;
}
.home-content-cta:hover {
  background-color: #ea9ef0;
}
.home-content-cta:hover a {
  color: white;
}
.home-comedie-row {
  justify-content: space-between;
  margin-top: 10px;
}
.home-comedie-row .home-comedie-cta-zone {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
}

/* Portraits cerclés joints aux encarts de citation */
.quote-portrait {
  flex: none;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px dashed #ea9ef0;
  box-shadow: 2px 2px 0px #ea9ef054;
}
.action-encart .quote-portrait {
  width: 40px;
  height: 40px;
}
.quote-source {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.72em;
  color: #ea9ef0;
  margin: 2px 0 0;
}

/* Info-bulle audiences : image de l'épisode + source */
.feed-audiences-callout-flex {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 14px;
  text-align: left;
}
.feed-audiences-callout-img {
  flex: none;
  width: 150px;
  height: 100px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px dashed #ea9ef0;
  box-shadow: 3px 3px 0px #ea9ef054;
}
.feed-audiences-callout-body {
  flex: 1 1 auto;
  min-width: 0;
}
.feed-audiences-callout-source {
  font-size: 0.72em;
  color: #ea9ef0;
  font-family: "ArsenalSC", sans-serif;
}

/* Footer : boutons sociaux #ea9ef0 par défaut, blanc au survol */
footer .social-icons img,
footer .footer-mistral svg,
footer .footer-contact-admin svg {
  filter: invert(79%) sepia(36%) saturate(1378%) hue-rotate(216deg) brightness(96%) contrast(97%);
  transition: filter 0.25s ease;
}
footer .social-icons:hover img,
footer .footer-mistral:hover svg,
footer .footer-contact-admin:hover svg {
  filter: invert(100%) sepia(0%) saturate(0%) brightness(100%) contrast(100%);
}

.photo-detail-card {
  margin: 1% auto;
  padding: 18px 24px;
  width: min(880px, 94%);
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 14px;
  box-shadow: 4px 4px 0px #ea9ef054;
}

.photo-detail-figure {
  margin: 0 0 14px;
  text-align: center;
}

.photo-detail-figure img {
  width: 100%;
  max-height: 420px;
  object-fit: contain;
  border-radius: 10px;
  border: 1px dashed #ea9ef0;
}

.photo-detail-figure figcaption {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.8em;
  font-style: italic;
  color: #f8ede3;
  margin-top: 8px;
}

.photo-detail-meta {
  gap: 8px 16px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px dashed #ea9ef06e;
}

.photo-detail-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 1.2em;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #ea9ef0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.photo-detail-title i {
  color: #ea9ef0;
}

.photo-detail-actions {
  margin-top: 12px;
  gap: 8px;
}

/* ===== PHOTOS : PIECES A CONVICTION ===== */
.evidence-card {
  border: 1px solid #ea9ef055;
}
.evidence-stamp {
  position: absolute;
  top: 10px;
  left: -8px;
  z-index: 3;
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.72em;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #ea9ef0;
  background-color: #221c1cf2;
  border: 1px dashed #ea9ef0;
  border-radius: 6px;
  padding: 5px 10px;
  transform: rotate(-8deg);
  box-shadow: 3px 3px 0px #ea9ef054;
}
.evidence-card:hover {
  transform: translateY(-6px) rotate(0.6deg);
}

/* ===== CITATIONS : TAILLES PLUS GENEREUSES (lisibilite) ===== */
.post-detail-quote-text {
  font-size: 1.3em;
}
.post-detail-quote-author {
  font-size: 0.9em;
}
.photos-grid-quote-text {
  font-size: 1.25em;
}
.posts-grid-quote-text {
  font-size: 1.25em;
}
.photos-grid-quote-author,
.posts-grid-quote-author {
  font-size: 0.85em;
}
.action-encart .encart-text {
  font-size: 1.3em;
}
.feed-intro-actor-teaser {
  font-size: 1.15em;
}

/* ===== PHOTOS GRID : APPARITION "PROJETEE" UNE PAR UNE ===== */
.photos-grid .evidence-card {
  opacity: 0;
  animation: evidence-land 0.7s cubic-bezier(0.25, 0.8, 0.35, 1.1) forwards;
  animation-delay: calc(var(--card-index, 0) * 0.45s);
}
.photos-grid .evidence-card:nth-child(1) { --card-index: 0; }
.photos-grid .evidence-card:nth-child(2) { --card-index: 1; }
.photos-grid .evidence-card:nth-child(3) { --card-index: 2; }
.photos-grid .evidence-card:nth-child(4) { --card-index: 3; }
.photos-grid .evidence-card:nth-child(5) { --card-index: 4; }
.photos-grid .evidence-card:nth-child(6) { --card-index: 5; }
.photos-grid .evidence-card:nth-child(7) { --card-index: 6; }
.photos-grid .evidence-card:nth-child(8) { --card-index: 7; }
.photos-grid .evidence-card:nth-child(n+9) { --card-index: 8; }
@keyframes evidence-land {
  0% {
    opacity: 0;
    transform: translateY(-120px) rotate(calc(var(--land-spin, -6deg) * 2)) scale(0.92);
  }
  60% { opacity: 1; }
  75% { transform: translateY(8px) rotate(var(--land-spin, -6deg)) scale(1.01); }
  100% {
    opacity: 1;
    transform: translateY(0) rotate(0deg) scale(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .photos-grid .evidence-card { animation: none; opacity: 1; }
}

/* ===== PAGINATION STYLE DOSSIER D'ENQUETE ===== */
.pagination-dossier {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin: 26px auto 8px;
  padding: 14px 22px;
  width: fit-content;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 12px;
  box-shadow: 4px 4px 0px #ea9ef054;
}
.pagination-dossier-status {
  font-family: "ArsenalSC", sans-serif;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #ea9ef0;
  font-size: 0.9em;
}
.pagination-dossier-status strong {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #f8ede3;
}
.pagination-dossier-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}
.pagination-dossier-links a {
  font-family: "ArsenalSC", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 0.82em;
  color: #f8ede3;
  background-color: #170f0faa;
  border: 1px dashed #ea9ef07e;
  border-radius: 8px;
  padding: 7px 14px;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
.pagination-dossier-links a:hover {
  color: #ea9ef0;
  transform: translateY(-2px);
  box-shadow: 3px 3px 0px #ea9ef054;
}
.pagination-dossier-links a.disabled-link {
  opacity: 0.35;
  pointer-events: none;
}

/* ===== POSTS : "CASE INVESTIGATION FILES" ===== */
/* Remplace le rendu journal : chemise de dossier kraft, languette, agrafe,
   image entierement visible (pas de crop). */
.case-file-card {
  background-color: #d9c7a7;
  border: none;
  border-radius: 4px 4px 10px 4px;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.5);
  padding: 34px 16px 14px;
  position: relative;
  overflow: visible;
}
.case-file-card::before {
  content: none;
}
/* languette de chemise en haut */
.case-file-tab {
  position: absolute;
  top: 0;
  left: 14px;
  right: 40%;
  height: 26px;
  background-color: #c4b090;
  border: 1px solid #8a7a5c;
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.case-file-tab-label {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.72em;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #4a3f28;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* trombone en haut a droite */
.case-file-card::after {
  content: "\f0c6";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 8px;
  right: 14px;
  font-size: 1.5em;
  color: #6d6d6d;
  transform: rotate(18deg);
  z-index: 2;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.35);
}
.case-file-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 2px dashed #8a7a5c;
  padding: 4px 2px 8px;
  margin-bottom: 10px;
}
.case-file-bureau {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.68em;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #4a3f28;
}
.case-file-bureau i { color: #a4243b; margin-right: 3px; }
.case-file-confidential {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.6em;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #a4243b;
  border: 1.5px solid #a4243b;
  border-radius: 4px;
  padding: 2px 6px;
  transform: rotate(-4deg);
  white-space: nowrap;
}
/* image entierement visible : hauteur auto, pas de crop */
.case-file-figure {
  margin: 0 0 10px;
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  border: 1px solid #8a7a5c;
  background-color: #221c1c;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.case-file-figure img {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  display: block;
}
.case-file-figure figcaption {
  position: static;
  margin: 0;
  padding: 8px 10px;
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.15em;
  color: #4a3f28;
  background-color: #c4b090;
  text-align: center;
  border-top: 1px dashed #8a7a5c;
}
.case-file-headline {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif !important;
  color: #221c1c !important;
  text-transform: uppercase !important;
  font-size: 1.2em !important;
  text-align: center;
  letter-spacing: 0.5px;
  margin: 10px 0 6px;
  line-height: 1.2;
}
.case-file-meta {
  color: #4a3f28 !important;
  font-size: 0.75em !important;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}
.case-file-meta i { color: #a4243b !important; }
.case-file-card .posts-grid-quote {
  background-color: #221c1c10;
  border-left: 3px solid #a4243b;
}
.case-file-card .posts-grid-quote-text { color: #221c1c !important; }
.case-file-card .posts-grid-quote-author { color: #a4243b !important; }
.case-file-btn {
  background-color: #221c1c;
  border: 1px dashed #a4243b;
  color: #d9c7a7;
}
.case-file-card:hover {
  transform: translateY(-6px) rotate(-0.5deg);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.55);
}
.case-file-card .options_container .btn {
  background-color: #221c1c;
  border: 1px dashed #a4243b;
  color: #d9c7a7;
}
/* apparition "posage de dossier" une par une */
.posts-grid .case-file-card {
  opacity: 0;
  animation: case-file-drop 0.65s cubic-bezier(0.25, 0.8, 0.35, 1.05) forwards;
  animation-delay: calc(var(--card-index, 0) * 0.4s);
}
.posts-grid .case-file-card:nth-child(1) { --card-index: 0; }
.posts-grid .case-file-card:nth-child(2) { --card-index: 1; }
.posts-grid .case-file-card:nth-child(3) { --card-index: 2; }
.posts-grid .case-file-card:nth-child(4) { --card-index: 3; }
.posts-grid .case-file-card:nth-child(5) { --card-index: 4; }
.posts-grid .case-file-card:nth-child(6) { --card-index: 5; }
.posts-grid .case-file-card:nth-child(7) { --card-index: 6; }
.posts-grid .case-file-card:nth-child(8) { --card-index: 7; }
.posts-grid .case-file-card:nth-child(n+9) { --card-index: 8; }
@keyframes case-file-drop {
  0% { opacity: 0; transform: translateY(-90px) rotate(-4deg); }
  60% { opacity: 1; }
  80% { transform: translateY(4px) rotate(0.5deg); }
  100% { opacity: 1; transform: translateY(0) rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) {
  .posts-grid .case-file-card { animation: none; opacity: 1; }
}

/* ===== SECTION PERSONNAGES : FICHES SUSPECTS ===== */
.suspects-board {
  width: min(1200px, 100%);
  margin: 0 auto;
}
.suspects-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 16px;
  margin-bottom: 16px;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 12px;
  box-shadow: 4px 4px 0px #ea9ef054;
}
.suspects-header-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #ea9ef0;
  font-size: 0.95em;
}
.suspects-header-title i { margin-right: 8px; }
.suspects-header-note {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.2em;
  color: #f8ede3;
}
.suspects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
}
.suspect-card {
  display: flex;
  gap: 14px;
  background-color: #d9c7a7;
  border-radius: 4px 4px 10px 4px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
  padding: 14px;
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.suspect-card::after {
  content: "\f0c6";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 6px;
  right: 10px;
  font-size: 1.2em;
  color: #6d6d6d;
  transform: rotate(16deg);
  z-index: 2;
}
.suspect-card:hover {
  transform: translateY(-5px) rotate(-0.5deg);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.55);
}
.suspect-photo {
  flex: 0 0 110px;
  margin: 0;
  text-align: center;
}
.suspect-photo img {
  width: 110px;
  height: 130px;
  object-fit: cover;
  object-position: top;
  border-radius: 6px;
  border: 3px solid #f8ede3;
  box-shadow: 3px 4px 10px rgba(0, 0, 0, 0.4);
  transform: rotate(-2deg);
  transition: transform 0.2s ease;
}
.suspect-card:hover .suspect-photo img {
  transform: rotate(0deg) scale(1.03);
}
.suspect-photo figcaption {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 0.95em;
  color: #4a3f28;
  margin-top: 6px;
  transform: rotate(-1deg);
}
.suspect-body { flex: 1 1 auto; min-width: 0; }
.suspect-name {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #221c1c;
  font-size: 1em;
  border-bottom: 2px dashed #8a7a5c;
  padding-bottom: 4px;
  margin-bottom: 8px;
}
.suspect-file {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.15em;
  line-height: 1.3;
  color: #221c1cd9;
  margin: 0;
}

/* ===== SECTION A PROPOS : DOSSIER DE PRODUCTION (archives condensees) ===== */
.archives-board {
  width: min(1000px, 100%);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.archives-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 16px;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef0;
  border-radius: 12px;
  box-shadow: 4px 4px 0px #ea9ef054;
}
.archives-header-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #ea9ef0;
  font-size: 0.95em;
}
.archives-header-title i { margin-right: 8px; }
.archives-header-note {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.2em;
  color: #f8ede3;
}
.archives-section-title {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #ea9ef0;
  font-size: 0.85em;
  border-bottom: 2px dashed #ea9ef07e;
  padding-bottom: 6px;
  margin-bottom: 12px;
}
.archives-section-title i { margin-right: 6px; }
/* frise de tournage */
.archives-timeline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
}
.timeline-item {
  background-color: #d9c7a7;
  border-radius: 6px;
  padding: 12px 14px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
  border-left: 4px solid #a4243b;
}
.timeline-date {
  display: inline-block;
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  color: #a4243b;
  font-size: 0.9em;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.timeline-item p {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.1em;
  line-height: 1.25;
  color: #221c1cd9;
  margin: 0;
}
/* fiche technique */
.archives-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px;
}
.fact-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  background-color: #221c1c8c;
  border: 1px dashed #ea9ef07e;
  border-radius: 10px;
  padding: 10px 14px;
}
.fact-label {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #ea9ef0;
  font-size: 0.72em;
}
.fact-value {
  font-family: "ArsenalSC", sans-serif;
  color: #f8ede3;
  font-size: 0.85em;
  line-height: 1.3;
}
/* diffusion mondiale */
.archives-world {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.world-chip {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.8em;
  letter-spacing: 0.5px;
  color: #f8ede3;
  background-color: #170f0faa;
  border: 1px dashed #ea9ef07e;
  border-radius: 20px;
  padding: 6px 14px;
  transition: transform 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.world-chip:hover {
  color: #ea9ef0;
  transform: translateY(-2px);
  box-shadow: 3px 3px 0px #ea9ef054;
}
/* recompenses */
.archives-awards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
}
.award-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #d9c7a7;
  border-radius: 6px;
  padding: 10px 14px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
  font-family: "ArsenalSC", sans-serif;
  color: #221c1cd9;
  font-size: 0.85em;
}
.award-item i { color: #a4243b; font-size: 1.3em; }

/* ===== BUREAU 1950s (feed, 1ere section) ===== */
/* Recentrage vertical des photos deposees : elles atterrissent au milieu du bureau */
.feed-evidence-card { top: 50%; transform: translate(-50%, -50%); }
.feed-evidence-card.evidence-rest { transform: translate(calc(-50% + var(--toss-x, 0px)), -50%) rotate(var(--toss-spin, -14deg)); }
@keyframes evidence-toss-1950 {  0% {    opacity: 0;    transform: translate(-50%, -260%) rotate(calc(var(--toss-spin, -14deg) * -1.4)) scale(0.9);  }  55% { opacity: 1; }  70% {    transform: translate(-50%, -46%) rotate(var(--toss-spin, -14deg));  }  85% {    transform: translate(-50%, -54%) rotate(calc(var(--toss-spin, -14deg) * 0.7));  }  100% {    transform: translate(calc(-50% + var(--toss-x, 0px)), -50%) rotate(var(--toss-spin, -14deg));  }}
.feed-evidence-card.evidence-toss { animation: evidence-toss-1950 0.85s cubic-bezier(0.3, 0.7, 0.4, 1.15) forwards; }

/* limite de pile : les photos restent dans le cadre du bureau */
.feed-evidence-pile .feed-evidence-card img { max-height: 200px; }
/* Fallback statique compact */
.feed-evidence-slot { width: min(640px, 96%); height: 340px; }
/* Accessoires 1950s : telephone a cadran du standard, cafe, lampe */
/* Bureau d'ecriture central de Marlene, style secretaire 1950s */
.feed-desk-stamp { z-index: 6; }

/* ===== DOSSIERS D'ENQUETE (feed, section billets) ===== */
.feed-encadre-posts-group { align-items: flex-start; }
.feed-case-file {  background-color: #e8d5ae;  background-image: repeating-linear-gradient(0deg, rgba(93, 66, 38, 0.05) 0px, rgba(93, 66, 38, 0.05) 1px, transparent 1px, transparent 6px);  box-shadow: 4px 4px 0px rgba(34, 28, 28, 0.55), 2px 2px 8px rgba(0, 0, 0, 0.35);}
/* onglet lateral de classeur, comme un vrai dossier cartonne */
.feed-case-file-tab {  top: 0;  right: 14px;  background-color: #8a2b2b;  color: #f4e9d8;  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;  font-size: 0.68rem;  letter-spacing: 0.1em;  padding: 4px 12px;  border-radius: 0 0 6px 6px;  border: 1px solid #5e1d1d;  border-top: none;  box-shadow: -2px 2px 0px rgba(34, 28, 28, 0.4);  z-index: 3;}
/* cordelette + bouton pression du dossier */
.feed-case-file::after {  content: "AFFAIRE EN COURS";  position: absolute;  bottom: 8px;  left: 10px;  font-family: "ArsenalSC", sans-serif;  font-size: 0.6rem;  letter-spacing: 0.12em;  color: #8a2b2b;  border: 1px solid #8a2b2b;  border-radius: 3px;  padding: 2px 6px;  transform: rotate(-1.5deg);  opacity: 0.8;  z-index: 2;  pointer-events: none;}
.feed-case-file-body { padding: 26px 10px 22px 10px; }
.feed-case-file-body img { filter: sepia(0.5) contrast(0.95) brightness(0.98); }

/* ===== INFO-BULLE AUDIENCES : TOUJOURS AU CENTRE EXACT ===== */
.feed-audiences-topcallout {  transform: translate(-50%, -50%) scale(0.92) !important;  max-height: 86vh;  overflow: auto;}
.feed-audiences-topcallout.visible {  transform: translate(-50%, -50%) scale(1) !important;}

/* ===== NETTOYAGE BUREAU : uniquement les photos + tampon ===== */
/* Les accessoires (machine a ecrire, Treets, courrier du coeur, telephone, cafe, lampe) ont ete retires du template. */
.feed-evidence-slot { width: min(680px, 94%); height: 360px; }
.feed-evidence-pile .feed-evidence-card img { max-height: 240px; }

/* ===== SECTION PHOTOS : 3 GRANDES PHOTOS OCCUPANT L'ECRAN SANS DEBORDER ===== */
.feed-encadre-photos-group { gap: 24px; }
.feed-encadre-photo-item img { height: auto; width: min(360px, 28vw); max-height: 48vh; object-fit: cover; }

/* ===== RESPONSIVE : AUCUN ELEMENT NE DOIT SE SUPERPOSER ===== */
/* Le bureau et son label restent au-dessus de la section suivante sur petits ecrans */
.feed-intro { height: auto; min-height: 0; overflow: visible; }
/* Photos de la section photos : passage en colonne sous 900px, taille contrainte au viewport */
@media (max-width: 900px) {
  .feed-encadre-photos-group { flex-direction: column; align-items: center; }
  .feed-encadre-photo-item img { width: min(420px, 88vw); max-height: 40vh; }
}
/* Bureau : sur petits ecrans le plateau se resserre, photos plus petites */
@media (max-width: 700px) {
  .feed-evidence-slot { width: 94%; height: 300px; }
  .feed-evidence-card { width: min(190px, 62%); }
  .feed-evidence-pile .feed-evidence-card img { max-height: 190px; }
  .feed-evidence-deck .feed-evidence-card:first-child img { max-height: 190px; }
}
/* Info-bulle audiences : jamais plus haute que l'ecran, contenu scrollable, jamais sous les boutons de nav */
.feed-audiences-topcallout { max-height: 80vh; }
/* Dossiers de la section billets : passage en colonne, pas de chevauchement des rotations */
@media (max-width: 760px) {
  .feed-encadre-posts-group { flex-direction: column; align-items: center; }
  .feed-case-file { width: min(320px, 92vw); transform: none; }
  .feed-case-file:nth-child(2) { transform: none; }
  .feed-case-file:nth-child(3) { transform: none; }
}
/* Boutons de navigation fixe : remontes au-dessus du footer, jamais sur le contenu sur mobile */
@media (max-width: 700px) {
  .site-scroll-nav { bottom: 88px; right: 8px; }
  .scroll-nav-btn { width: 38px; height: 38px; }
}

/* Sections a hauteur flexible : le contenu ne peut plus deborder sur la section suivante */
.feed-section-photos, .feed-section-posts { height: auto; min-height: 100vh; }
/* background-attachment: fixed casse le scroll sur mobile : on le neutralise sous 900px */
@media (max-width: 900px) {
  .feed-section-photos, .feed-section-posts, .feed-section-personnages, .feed-section-a-propos {
    background-attachment: scroll;
  }
}

/* ===== FEED INTRO : 100vh SI L'ECRAN LE PERMET ===== */
/* Grand ecran : la 1ere section occupe tout l'ecran. Le contenu depasse seulement
   si le viewport est trop petit ; dans ce cas la section s'allonge (hauteur auto
   heritee de la regle responsive precedente) et rien ne se superpose. */
@media (min-height: 700px) and (min-width: 768px) {
  .feed-intro { height: calc(100vh - var(--navbar-height, 76px)); min-height: 480px; overflow: hidden; }
}

/* ===== INFO-BULLE AUDIENCES : VISIBLE EN INTEGRALITE, ADAPTEE A L'ECRAN ===== */
/* Plus de coupe : l'encadre entier tient dans le viewport grace a une taille fluide. */
.feed-audiences-topcallout { max-height: none; overflow: visible; }
.feed-audiences-callout-img { width: clamp(90px, 18vw, 150px); height: clamp(60px, 12vw, 100px); }
.feed-audiences-callout-flex { flex-wrap: wrap; justify-content: center; }
/* Travailler la largeur pour que tout le contenu soit visible meme sur grand texte */
.feed-audiences-topcallout { width: min(92vw, 620px); max-width: 92vw; }
.feed-audiences-callout-body { font-size: clamp(0.8em, 2.2vw, 1em); }
/* Sur tres petit ecran, l'image passe au-dessus du texte, l'encadre reste entier */
@media (max-width: 560px) {
  .feed-audiences-callout-flex { flex-direction: column; align-items: center; text-align: center; }
  .feed-audiences-callout-img { width: min(160px, 60vw); height: auto; }
  .feed-audiences-topcallout { padding: 18px 16px; }
}

/* ===== CHARGEMENT DES IMAGES : APPARITION THEMATIQUE UNE FOIS TELECHARGEES ===== */
/* JS pose .img-reveal-pending sur toute image du feed ; l'image n'apparait qu'une
   fois entierement telechargee, avec un developpement "pellicule photo" theme dossier. */
.img-reveal-pending {  opacity: 0;}
.img-reveal-pending ~ * {  /* rien : les autres elements restent intacts */}
img.img-reveal-in {  animation: img-reveal-develop 0.7s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;}
@keyframes img-reveal-develop {
  0% { opacity: 0; filter: sepia(1) contrast(1.4) brightness(0.7); transform: scale(1.04); }
  60% { opacity: 1; }
  100% { opacity: 1; filter: none; transform: scale(1); }
}
/* vignette "piece a conviction" pendant le telechargement */
.img-reveal-pending {  background: repeating-linear-gradient(45deg, #170f0f 0 12px, #1d1414 12px 24px);  min-height: 60px;}
@media (prefers-reduced-motion: reduce) {
  img.img-reveal-in { animation: none; opacity: 1; filter: none; transform: none; }
}

/* ===== ESPACEMENT RESPONSIVE ENTRE SECTIONS ===== */
/* Petit ecran : espace net entre la fin d'une section et la suivante */
@media (max-width: 900px) {
  .feed-intro { padding-bottom: 28px; }
  .feed-section-photos, .feed-section-posts, .feed-section-personnages, .feed-section-a-propos, .feed-section-audiences { padding-bottom: 28px; margin-bottom: 0; }
}
/* Ecran moyen et + : espace leger */
@media (min-width: 901px) {
  .feed-intro { padding-bottom: 12px; }
  .feed-section-photos, .feed-section-posts, .feed-section-personnages, .feed-section-audiences { padding-bottom: 12px; }
}

/* ===== ENCADRES feed-section-posts (photos / billets) : ALIGNEMENT SUR LE THEME DOSSIER ===== */
.feed-encadre {  background-color: #221c1c8c;  border: 1px dashed #ea9ef0;  border-radius: 14px;  box-shadow: 4px 4px 0px #ea9ef054;}
.feed-encadre blockquote { margin: 0; }
.feed-encadre-photos, .feed-encadre-posts { padding: 10px 18px; }

/* ===== A PROPOS : TRONCATURE AVEC BOUTON "LIRE LA SUITE" ===== */
.a_propos_truncated {  position: relative;  max-height: 6.5em;  overflow: hidden;  transition: max-height 0.45s ease;}
.a_propos_truncated::after {  content: "";  position: absolute;  bottom: 0;  left: 0;  right: 0;  height: 2.6em;  background: linear-gradient(180deg, transparent, #221c1c 85%);  pointer-events: none;}
.a_propos_truncated.a_propos_open::after { display: none; }
.a_propos_more-btn {  font-family: "ArsenalSC", sans-serif;  text-transform: uppercase;  letter-spacing: 1px;  font-size: 0.75em;  color: #ea9ef0;  background-color: #170f0faa;  border: 1px dashed #ea9ef07e;  border-radius: 8px;  padding: 4px 12px;  cursor: pointer;  margin-top: 4px;}
.a_propos_more-btn:hover { color: #f8ede3; box-shadow: 3px 3px 0px #ea9ef054; }

/* ===== FOOTER : footer_date centre sur petit ecran + suppression espace avant footer ===== */
@media (max-width: 900px) {
  .footer-row { align-items: center; }
  #footer_date { text-align: center; width: 100%; margin: 0; }
  footer.footer-container { margin-top: 0; }
  .feed-section-audiences { margin-bottom: 0; padding-bottom: 0; }
}

/* ===== BUREAU : ANNOTATIONS A LA CRAIE (theme tableau d'enqueteur) ===== */
.feed-chalk-arrow, .feed-chalk-cross, .feed-chalk-circle, .feed-chalk-link, .feed-chalk-note {  position: absolute;  pointer-events: none;  z-index: 1;  color: #e8e3d8;  opacity: 0.55;  filter: drop-shadow(0 0 1px rgba(0,0,0,0.4));}
/* fleche courbee tracee a la craie : tige + pointe */
.feed-chalk-arrow {  width: 72px;  height: 48px;  background: radial-gradient(circle 1.6px at 60% 78%, #e8e3d8 98%, transparent), radial-gradient(circle 1.6px at 66% 70%, #e8e3d8 98%, transparent), radial-gradient(circle 1.6px at 71% 62%, #e8e3d8 98%, transparent), radial-gradient(circle 1.6px at 62% 86%, #e8e3d8 98%, transparent), radial-gradient(circle 1.6px at 68% 82%, #e8e3d8 98%, transparent), radial-gradient(circle 1.6px at 74% 74%, #e8e3d8 98%, transparent), radial-gradient(circle 1.6px at 55% 88%, #e8e3d8 98%, transparent);  border: none;}
.feed-chalk-arrow-1 { bottom: 22%; left: 6%; transform: rotate(-18deg) scaleX(-1); }
.feed-chalk-arrow-2 { top: 14%; right: 8%; transform: rotate(24deg); width: 58px; height: 40px; }
/* point d'interrogation manuscrit */
.feed-chalk-question {  position: absolute;  pointer-events: none;  z-index: 1;  font-family: "Caveat-large", "Caveat", cursive;  font-size: 2em;  color: #e8e3d8;  opacity: 0.5;}
.feed-chalk-question-1 { bottom: 12%; right: 12%; transform: rotate(12deg); }
.feed-chalk-question-2 { top: 10%; left: 10%; transform: rotate(-8deg); font-size: 1.6em; }
/* croix d'enqueteur (exclu) : deux traits de craie */
.feed-chalk-cross {  width: 26px;  height: 26px;}
.feed-chalk-cross-1 { bottom: 18%; right: 26%; transform: rotate(8deg); background: linear-gradient(45deg, transparent 46%, #e8e3d8 46%, #e8e3d8 54%, transparent 54%), linear-gradient(-45deg, transparent 46%, #e8e3d8 46%, #e8e3d8 54%, transparent 54%); }
.feed-chalk-cross-2 { top: 20%; left: 22%; transform: rotate(-14deg) scale(0.8); background: linear-gradient(45deg, transparent 46%, #e8e3d8 46%, #e8e3d8 54%, transparent 54%), linear-gradient(-45deg, transparent 46%, #e8e3d8 46%, #e8e3d8 54%, transparent 54%); }
/* cercle entourant un indice */
.feed-chalk-circle {  width: 64px;  height: 40px;  border: 2px dashed #e8e3d8;  border-radius: 50%;  opacity: 0.35;}
.feed-chalk-circle-1 { top: 42%; left: 4%; transform: rotate(-10deg); }
/* trait de liaison entre deux indices */
.feed-chalk-link {  width: 90px;  height: 2px;  background: repeating-linear-gradient(90deg, #e8e3d8 0 7px, transparent 7px 11px);  opacity: 0.4;}
.feed-chalk-link-1 { top: 58%; right: 4%; transform: rotate(-32deg); }
/* mots griffonnes a la craie */
.feed-chalk-note {  font-family: "Caveat-large", "Caveat", cursive;  font-size: 1.15em;  letter-spacing: 1px;  bottom: 6%; left: 30%; transform: rotate(-4deg); }
.feed-chalk-note-2 { top: 6%; right: 28%; transform: rotate(3deg); }
/* sur petit ecran, on allège le tableau */
@media (max-width: 700px) {
  .feed-chalk-arrow, .feed-chalk-cross-2, .feed-chalk-link-1, .feed-chalk-note-2 { display: none; }
  .feed-chalk-note { left: 8%; }
  .feed-chalk-circle-1 { display: none; }
}

/* ===== FOND HTML : JAMAIS DE BLANC ENTRE DERNIERE SECTION ET FOOTER ===== */
html {  background-color: #170f0f;}
body {  background-color: #170f0f;}
footer.footer-container {  margin-top: 0; }

/* ===== FOOTER : footer_date centre aussi sur ecran moyen ===== */
@media (min-width: 901px) and (max-width: 1199px) {
  .footer-row { align-items: center; }
  #footer_date { text-align: center; width: 100%; margin: 0; }
}

/* ===== TRONCATURE A PROPOS : NOUVEAUX SEUILS ===== */
/* Les blocs p/li de plus de 150 caracteres sont tronques (moyen ecran : 75, petit : 25).
   Les seuils sont appliques en JS ; ici on ajoute la variante "3 lignes" du paragraphe Tournage. */
.a_propos_truncated--3lines { max-height: 5.2em; }

/* ===== CITATIONS INVENTEES : MENTION OBLIGATOIRE ===== */
.quote-fictional-note {  display: block;  font-family: "ArsenalSC", sans-serif;  font-size: 0.62em;  letter-spacing: 1px;  text-transform: uppercase;  color: #ea9ef0;  opacity: 0.85;  margin-top: 2px;}
.feed-encadre .quote-fictional-note,
.home-elements-middle .quote-fictional-note,
.post-detail-quote .quote-fictional-note,
.photos-grid-quote .quote-fictional-note,
.posts-grid-quote .quote-fictional-note { margin-top: 4px; }
/* ===== 1ERE DIVISION FEED : TABLEAU D'ENQUETE AGRANDI, SUSPECTS N&B LIES A LA CRAIE ===== */
/* Tableau plus grand sans redimensionner la section feed-intro : on elargit le slot
   et on reduit les marges verticales internes. */
.feed-evidence-slot { width: min(880px, 96%); height: 400px; }
.feed-evidence-slot::after { z-index: 1; }
.feed-evidence-pile { z-index: 3; }
.feed-evidence-pile .feed-evidence-card img { max-height: 250px; }
.feed-evidence-deck .feed-evidence-card:first-child img { max-height: 230px; }
@media (max-width: 900px) {
  .feed-evidence-slot { width: 96%; height: 360px; }
  .feed-evidence-pile .feed-evidence-card img { max-height: 210px; }
}
@media (max-width: 700px) {
  .feed-evidence-slot { width: 94%; height: 320px; }
  .feed-evidence-pile .feed-evidence-card img { max-height: 175px; }
}
/* Mur de suspects : portraits noir et blanc punaises au tableau, au-dessus du plateau */
.feed-suspects-wall {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 10px 12px 0;
  gap: 4px;
}
.feed-suspect {
  margin: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 17%;
  min-width: 0;
}
.feed-suspect img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  filter: grayscale(1) contrast(1.15) brightness(0.92) sepia(0.12);
  border: 4px solid #f4efea;
  border-radius: 2px;
  box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.55);
  background-color: #101410;
}
/* punaise rouge du tableau d'enquete */
.feed-suspect::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ff9d9d, #a4243b 60%, #6d1425);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
  z-index: 3;
}
.feed-suspect figcaption {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  color: #e8e3d8;
  margin-top: 2px;
  opacity: 0.85;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.feed-suspect--laurence { transform: rotate(-3deg); margin-top: 6px; }
.feed-suspect--marlene { transform: rotate(2deg); }
.feed-suspect--avril { transform: rotate(-2deg); margin-top: 10px; }
.feed-suspect--tricard { transform: rotate(3deg); margin-top: 4px; }
.feed-suspect--glissant { transform: rotate(-4deg); margin-top: 12px; }
/* Liaisons logiques tracees a la craie entre les portraits (SVG au-dessus du mur) */
.feed-chalk-links-svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 62%;
  pointer-events: none;
  z-index: 2;
}
.chalk-link-path {
  fill: none;
  stroke: #e8e3d8;
  stroke-width: 0.55;
  stroke-linecap: round;
  stroke-dasharray: 2.4 1.8;
  opacity: 0.6;
}
.chalk-link-label {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 3.2px;
  fill: #e8e3d8;
  opacity: 0.7;
}
@media (max-width: 700px) {
  .feed-suspect figcaption { font-size: 0.5rem; }
  .feed-suspect img { border-width: 3px; }
  .chalk-link-label { display: none; }
  .chalk-link-path { opacity: 0.45; }
}

/* ===== FOOTER : "Blog c LesPetitsMeurtres 2023-2026" centre sur toutes les pages, toutes tailles ===== */
.footer-row { align-items: center; }
#footer_date { text-align: center; width: 100%; margin: 0; }
/* ===== TABLEAU D'ENQUETE : PLAN DE LILLE (VERS 1920) + FICHE TECHNIQUE PUNAISEE ===== */
/* Le plateau devient le plan deplie de la ville de Lille, vu de haut, teinte sepiare. */
.feed-evidence-slot--lille { background: #2b241a; }
.feed-lille-plan {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(0.55) contrast(1.05) brightness(0.9) saturate(0.9);
  opacity: 0.85;
  z-index: 0;
}
/* loader thematique tant que le plan charge (petit tampon "plan en cour(s) d'inspection") */
.feed-lille-plan-loader {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 4;
  background: rgba(23, 15, 15, 0.35);
  transition: opacity 0.4s ease;
}
.feed-lille-plan-loader-inner {
  display: inline-block;
  padding: 10px 18px;
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.8rem;
  letter-spacing: 1px;
  color: #ea9ef0;
  background: #170f0fd9;
  border: 1px dashed #ea9ef07e;
  border-radius: 10px;
  box-shadow: 4px 4px 0px #ea9ef054;
  animation: plan-loader-pulse 1.2s ease-in-out infinite;
}
.feed-lille-plan-loader-inner::before { content: "PLAN DE LILLE EN COURS D'INSPECTION"; }
@keyframes plan-loader-pulse {
  0%, 100% { opacity: 0.75; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.04); }
}
/* le JS retire le loader quand le plan est charge */
.feed-lille-plan-loader.feed-lille-plan-ready { display: none; }
/* annotations craie de la fiche technique, disposees autour du plan */
.feed-chalk-note--titre { top: 3%; left: 4%; transform: rotate(-1.5deg); max-width: 44%; font-size: 1.05em; }
.feed-chalk-note--soc { top: 3%; right: 4%; transform: rotate(1deg); max-width: 40%; text-align: right; }
.feed-chalk-note--dist { top: 12%; right: 4%; transform: rotate(-0.5deg); }
.feed-chalk-note--pays { bottom: 4%; left: 4%; transform: rotate(0.6deg); }
.feed-chalk-note--genre { bottom: 4%; left: 36%; transform: rotate(-0.8deg); }
.feed-chalk-note--public { bottom: 4%; right: 4%; transform: rotate(1.2deg); max-width: 34%; text-align: right; }
/* personnes de la fiche technique : portraits N&B punaises sur le plan */
.feed-fiche-people {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.feed-fiche-person {
  position: absolute;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 96px;
  min-width: 0;
}
.feed-fiche-person img,
.feed-fiche-photo {
  width: 64px;
  height: 80px;
  object-fit: cover;
  filter: grayscale(1) contrast(1.12) brightness(0.95);
  border: 3px solid #f4efea;
  border-radius: 2px;
  box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.6);
  background-color: #170f0f;
}
/* visage inconnu : silhouette sombre + gros ? craie */
.feed-fiche-photo--unknown {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.feed-fiche-photo--unknown::before {
  content: "";
  position: absolute;
  inset: 4px;
  background: radial-gradient(ellipse 60% 45% at 50% 32%, #4a4238 0 38%, transparent 40%),
              linear-gradient(180deg, transparent 45%, #4a4238 46%, #4a4238 100%);
  border-radius: 2px;
  opacity: 0.9;
}
.feed-fiche-photo--unknown span {
  position: relative;
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: 1.9em;
  color: #e8e3d8;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
  z-index: 1;
}
/* punaise rouge de chaque personne */
.feed-fiche-person::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translateX(-50%);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ff9d9d, #a4243b 60%, #6d1425);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.6);
  z-index: 3;
}
.feed-fiche-person figcaption {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.56rem;
  letter-spacing: 0.06em;
  color: #e8e3d8;
  margin-top: 3px;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
  background: rgba(23, 15, 15, 0.35);
  border-radius: 4px;
  padding: 1px 3px;
}
/* repartition des personnes sur le plan (evite le centre ou les photos tombent) */
.feed-fiche-person--creation { top: 22%; left: 6%; transform: rotate(-4deg); }
.feed-fiche-person--real { top: 16%; left: 38%; transform: rotate(3deg); }
.feed-fiche-person--real2 { top: 20%; right: 8%; transform: rotate(-3deg); }
.feed-fiche-person--scenario { top: 52%; left: 12%; transform: rotate(2deg); }
.feed-fiche-person--musique { top: 48%; right: 12%; transform: rotate(-2deg); }
.feed-fiche-person--production { top: 30%; left: 58%; transform: rotate(4deg); }
/* les photos deposees par le commissaire restent au centre, au-dessus du plan */
.feed-evidence-pile { z-index: 3; }
/* nettoyage : l'ancien mur de suspects et le punaisage statique n'existent plus */
.feed-suspects-wall { display: none; }
.feed-evidence-card.evidence-pinned { display: none; }
@media (max-width: 700px) {
  .feed-fiche-person { width: 74px; }
  .feed-fiche-person img, .feed-fiche-photo { width: 46px; height: 58px; }
  .feed-fiche-person figcaption { font-size: 0.46rem; }
  .feed-chalk-note--titre, .feed-chalk-note--soc { font-size: 0.85em; }
  .feed-chalk-note--genre { display: none; }
  .chalk-link-label { display: none; }
}
/* ===== BUREAU AGRANDI : CARTE ELRT CENTREE + FICHE TECHNIQUE AUTOUR ===== */
/* Le plateau s'agrandit ; la carte de l'agglomeration reste centree et ne recouvre
   PAS tout le bureau : les annotations craie restent visibles sur le bois. */
.feed-evidence-slot--lille {
  width: min(1080px, 97%);
  height: 480px;
  background:
    radial-gradient(ellipse at 20% 15%, rgba(91, 58, 36, 0.35) 0%, transparent 55%),
    linear-gradient(180deg, #3a2c22 0%, #33261d 55%, #2b2018 100%);
}
@media (max-width: 900px) { .feed-evidence-slot--lille { width: 96%; height: 420px; } }
@media (max-width: 700px) { .feed-evidence-slot--lille { width: 94%; height: 380px; } }
/* carte centree : ~72% du plateau, bord papier, ombre portee */
.feed-lille-map {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-1.2deg);
  width: min(72%, 620px);
  margin: 0;
  z-index: 1;
  border: 6px solid #e8dcc8;
  border-radius: 3px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.4);
  background: #e8dcc8;
  overflow: hidden;
}
.feed-lille-plan { position: static; width: 100%; height: auto; display: block; filter: sepia(0.45) contrast(1.02) brightness(1.02) saturate(0.85); opacity: 1; }
.feed-lille-map figcaption {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.55rem;
  letter-spacing: 0.08em;
  text-align: center;
  color: #6d5137;
  padding: 3px 6px 5px;
  background: #efe4cd;
  border-top: 1px solid #d9c8a8;
}
.feed-lille-map figcaption small { font-size: 0.8em; opacity: 0.75; }
/* les annotations craie restent au-dessus de la carte : z-index plus eleve */
.feed-chalk-note { z-index: 3; }
.feed-fiche-people { z-index: 4; }
.feed-chalk-links-svg { z-index: 3; opacity: 0.75; }
/* les vignettes se posent SUR le croquis : conteneur cale sur la carte centree */
.feed-fiche-people {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: min(78%, 860px);
  transform: translate(-50%, -50%);
  aspect-ratio: 1500 / 1100;
  max-height: 100%;
}
/* nouveaux emplacements notes (carte centree plus petite) */
.feed-chalk-note--titre { top: 3%; left: 3%; max-width: 30%; font-size: 1em; }
.feed-chalk-note--soc { top: 3%; right: 3%; max-width: 30%; text-align: right; }
.feed-chalk-note--dist { top: 14%; right: 3%; }
.feed-chalk-note--format { top: 25%; left: 3%; }
.feed-chalk-note--diff { top: 33%; left: 3%; }
.feed-chalk-note--pays { bottom: 4%; left: 3%; }
.feed-chalk-note--genre { bottom: 4%; left: 36%; }
.feed-chalk-note--public { bottom: 4%; right: 3%; max-width: 28%; text-align: right; }
/* noms des personnes : liens wikipedia thematiques */
.feed-fiche-person figcaption a {
  color: #ea9ef0;
  text-decoration: underline dotted #ea9ef07e;
  text-underline-offset: 2px;
}
.feed-fiche-person figcaption a:hover { color: #f8ede3; text-decoration: underline solid #ea9ef0; }
/* decorations 1950s punaisees sur le bois, hors carte */
.feed-desk-deco { position: absolute; pointer-events: none; z-index: 2; }
.feed-desk-deco--ruler {
  bottom: 12%; left: 6%;
  width: 120px; height: 16px;
  background: repeating-linear-gradient(90deg, #d9c8a8 0 11px, transparent 11px 12px),
             linear-gradient(180deg, #e8dcc8, #c9b490);
  border: 1px solid #8a7358;
  border-radius: 2px;
  transform: rotate(-8deg);
  box-shadow: 0 3px 6px rgba(0,0,0,0.4);
  opacity: 0.9;
}
.feed-desk-deco--magnifier {
  top: 44%; right: 5%;
  width: 44px; height: 44px;
  border: 4px solid #b89c72;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, rgba(255,255,255,0.35), rgba(120,100,70,0.25));
  box-shadow: 0 4px 8px rgba(0,0,0,0.45), inset 0 0 8px rgba(0,0,0,0.2);
  transform: rotate(14deg);
}
.feed-desk-deco--magnifier::after {
  content: "";
  position: absolute;
  bottom: -14px; right: -6px;
  width: 6px; height: 20px;
  background: linear-gradient(180deg, #8a6b48, #6d5137);
  border-radius: 2px;
  transform: rotate(-40deg);
}
.feed-desk-deco--clip {
  top: 16%; left: 42%;
  width: 16px; height: 30px;
  border: 3px solid #9c8262;
  border-radius: 8px 8px 3px 3px;
  background: transparent;
  transform: rotate(22deg);
  box-shadow: 0 2px 4px rgba(0,0,0,0.35);
}
@media (max-width: 700px) {
  .feed-lille-map { width: 82%; border-width: 4px; }
  .feed-chalk-note--titre, .feed-chalk-note--soc { font-size: 0.8em; }
  .feed-chalk-note--dist, .feed-chalk-note--format, .feed-chalk-note--diff { display: none; }
  .feed-desk-deco--ruler { display: none; }
  .feed-desk-deco--magnifier { top: auto; bottom: 18%; right: 4%; width: 34px; height: 34px; }
  .feed-fiche-person--real2, .feed-fiche-person--musique { display: none; }
}
/* ===== FICHE TECHNIQUE COMPLETE : NOUVELLES NOTES + RENOUVELLEMENT A CHAQUE CHARGEMENT ===== */
/* positions des elements manquants (Decors, Costumes, Photographie, Montage, Casting, Generique) */
.feed-chalk-note--decors { top: 14%; left: 3%; }
.feed-chalk-note--costumes { top: 22%; right: 3%; }
.feed-chalk-note--photo { top: 30%; right: 3%; }
.feed-chalk-note--montage { top: 38%; right: 3%; }
.feed-chalk-note--casting { top: 46%; right: 3%; }
.feed-chalk-note--generique { top: 54%; right: 3%; }
/* les personnes sont positionnees par le JS a chaque chargement : on neutralise
   les anciennes positions CSS fixes pour eviter tout conflit */
.feed-fiche-person--creation,
.feed-fiche-person--real,
.feed-fiche-person--real2,
.feed-fiche-person--scenario,
.feed-fiche-person--musique,
.feed-fiche-person--production { top: auto; left: auto; right: auto; transform: none; }
/* la colonne gauche reste legere : Format/Diffusion descendent pour laisser la place a Decors */
.feed-chalk-note--format { top: 40%; }
.feed-chalk-note--diff { top: 47%; }
@media (max-width: 900px) {
  .feed-chalk-note--decors, .feed-chalk-note--costumes, .feed-chalk-note--photo,
  .feed-chalk-note--montage, .feed-chalk-note--casting, .feed-chalk-note--generique { display: none; }
}
/* ===== NOTES VISITEURS HORS TABLEAU + POST-IT FICHE TECHNIQUE ===== */
/* indications a la craie en travers, au-dessus du tableau : pour les visiteurs */
.feed-visitor-notes {
  position: relative;
  width: min(1080px, 97%);
  margin: 0 auto 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 26px;
  padding: 10px 16px 8px;
  border: 1px dashed rgba(232, 227, 216, 0.25);
  border-radius: 10px;
  background: repeating-linear-gradient(100deg, transparent 0 34px, rgba(232, 227, 216, 0.03) 34px 36px);
}
.feed-visitor-note {
  font-family: "Caveat-large", "Caveat", cursive;
  font-size: clamp(1.05rem, 1.7vw, 1.5rem);
  letter-spacing: 0.6px;
  color: #f2ecdd;
  opacity: 1;
  white-space: nowrap;
  text-shadow: 1px 1px 0 rgba(0,0,0,0.6);
}
.feed-visitor-note i { color: #ea9ef0; margin-right: 7px; }
.feed-visitor-note--a { transform: rotate(-1.4deg); }
.feed-visitor-note--b { transform: rotate(0.8deg); }
.feed-visitor-note--c { transform: rotate(-0.6deg); }
.feed-visitor-note--d { transform: rotate(1.1deg); }
.feed-visitor-note--e { transform: rotate(-1deg); }
.feed-visitor-note--f { transform: rotate(0.5deg); }
/* post-it equipes techniques : notes jaunes punaisees a cote du tableau */
.feed-fiche-sticky {
  position: absolute;
  left: -8px;
  top: 10%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 3;
  width: 148px;
  pointer-events: auto;
}
.feed-sticky-note {
  display: block;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.62rem;
  line-height: 1.25;
  color: #3a2c22;
  background: linear-gradient(180deg, #f4e6a2 0%, #ecd88f 100%);
  padding: 7px 9px 9px;
  box-shadow: 2px 3px 8px rgba(0, 0, 0, 0.4);
  transform: rotate(-2deg);
  border-radius: 1px;
  position: relative;
}
.feed-sticky-note:nth-child(even) { transform: rotate(1.6deg); }
.feed-sticky-note:nth-child(3n) { transform: rotate(-1.2deg); background: linear-gradient(180deg, #f4dfae 0%, #e8cf8d 100%); }
.feed-sticky-note strong { font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif; letter-spacing: 0.4px; }
.feed-sticky-note::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ff9d9d, #a4243b 60%, #6d1425);
  box-shadow: 0 1px 2px rgba(0,0,0,0.5);
}
/* tableau agrandi : la carte occupe le centre, les post-it restent a gauche */
.feed-evidence-slot--lille { width: min(1080px, 97%); height: 500px; }
@media (max-width: 900px) { .feed-evidence-slot--lille { width: 96%; height: 430px; } }
@media (max-width: 700px) { .feed-evidence-slot--lille { width: 94%; height: 390px; } }
/* navbar : z-index superieur a tout, background quasi-opaque quand on n'est pas tout en haut */
.navbar-custom { z-index: 2000; }
.navbar-custom.nav-scrolled {
  background-color: #221c1cf2 !important;
  box-shadow: 0 6px 18px 6px rgba(0, 0, 0, 0.55);
  transition: background-color 0.25s ease, box-shadow 0.25s ease;
}
/* icones recompenses modernes, en phase avec le theme */
.awards-list { list-style: none; padding: 0; margin: 8px 0 0; display: flex; flex-direction: column; gap: 10px; }
.award-item { display: flex; align-items: center; gap: 14px; }
.award-icon { width: 34px; height: 34px; flex: 0 0 34px; filter: drop-shadow(2px 2px 0px #ea9ef054); }
.award-text { font-size: 0.92em; line-height: 1.35; }
.award-text strong { color: #ea9ef0; font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif; font-size: 0.95em; }
@media (max-width: 700px) {
  .feed-fiche-sticky { position: static; width: 100%; flex-direction: row; flex-wrap: wrap; margin: 0 0 8px; }
  .feed-sticky-note { font-size: 0.58rem; padding: 5px 7px; }
  .feed-visitor-notes { gap: 4px 14px; }
  .feed-visitor-note { font-size: 0.85em; }
}
/* ===== FEED INTRO : SECTION ENTIÈREMENT VISIBLE A L'ECRAN ===== */
/* Le tableau est dimensionne pour que la 1ere section (bandeau + tableau) tienne
   dans le viewport sur les ecrans qui le permettent. */
.feed-intro {
  height: calc(100vh - var(--navbar-height, 76px));
  min-height: 480px;
  overflow: visible;
}
/* hauteur du tableau pilotee par le viewport : bandeau ~90px + marges */
.feed-evidence-slot--lille { width: min(1080px, 97%); height: clamp(300px, calc(100vh - 76px - 200px), 520px); }
@media (max-width: 900px) { .feed-evidence-slot--lille { width: 96%; height: clamp(280px, calc(100vh - 76px - 190px), 440px); } }
@media (max-width: 700px) { .feed-evidence-slot--lille { width: 94%; height: clamp(260px, calc(100vh - 76px - 180px), 400px); } }

/* ===== FICHES D'EQUIPES : dispersees autour du tableau, formes elaborees ===== */
/* cartes inclinees, papier kraft, punaisees autour du tableau (gauche et droite) */
.feed-fiche-cards {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 6;
}
.feed-fiche-card {
  position: absolute;
  width: clamp(96px, 11vw, 138px);
  padding: 10px 10px 12px;
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.6rem;
  line-height: 1.3;
  letter-spacing: 0.3px;
  color: #2b2018;
  background:
    repeating-linear-gradient(0deg, rgba(93, 66, 38, 0.05) 0 1px, transparent 1px 7px),
    linear-gradient(160deg, #f4ecdc 0%, #eadfc6 100%);
  border-radius: 2px 8px 3px 7px / 6px 3px 7px 2px;
  box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.5), 1px 1px 0 rgba(255,255,255,0.35) inset;
  border-left: 3px solid #8a2b2b;
  transform: rotate(-3deg);
  pointer-events: auto;
}
.feed-fiche-card i {
  display: block;
  font-size: 0.95rem;
  color: #8a2b2b;
  margin-bottom: 3px;
  opacity: 0.85;
}
.feed-fiche-card strong { font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif; letter-spacing: 0.5px; color: #3a2c22; }
/* punaise rouge */
.feed-fiche-card::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translateX(-50%) rotate(8deg);
  width: 9px; height: 9px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ff9d9d, #a4243b 60%, #6d1425);
  box-shadow: 0 2px 3px rgba(0,0,0,0.55);
}
/* dispersion autour du tableau : gauche haut/bas, droite haut/bas, coins */
.feed-fiche-card--1 { top: 4%; left: 1%; transform: rotate(-4deg); }
.feed-fiche-card--2 { top: 12%; left: 9%; transform: rotate(2.5deg); z-index: 7; }
.feed-fiche-card--3 { top: 3%; right: 8%; transform: rotate(3deg); }
.feed-fiche-card--4 { top: 12%; right: 1%; transform: rotate(-2.5deg); }
.feed-fiche-card--5 { bottom: 5%; left: 6%; transform: rotate(2deg); }
.feed-fiche-card--6 { bottom: 3%; right: 10%; transform: rotate(-3deg); }
.feed-fiche-card--7 { bottom: 10%; left: 26%; transform: rotate(1.5deg); }
/* responsive : les fiches passent en flux (grille horizontale scrollable) sous 1100px */
@media (max-width: 1100px) {
  .feed-fiche-cards {
    position: static;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    padding: 8px 0;
    margin-bottom: 8px;
  }
  .feed-fiche-card { position: static; transform: rotate(-1.5deg); }
  .feed-fiche-card:nth-child(even) { transform: rotate(1.5deg); }
}
@media (max-width: 700px) {
  .feed-fiche-card { width: min(130px, 44%); font-size: 0.55rem; }
}

/* ===== A PROPOS / RECOMPENSES : PAS DE FOND COLORE ===== */
.a_propos .section_container,
.a_propos_article,
.a_propos_container {
  background: none;
  background-color: transparent;
  background-image: none;
}
/* blocs internes (listes, hr) : pas de fond beige herite */
.a_propos_container ul,
.a_propos_container li,
.a_propos_container hr,
.awards-list,
.award-item,
.award-text {
  background: none;
  background-color: transparent;
  background-image: none;
}
/* TOURNAGE : dimension fixe — la section garde la taille maximale par defaut ;
   le bouton LIRE LA SUITE ne redimensionne pas la section : le texte masque
   s'affiche dans la meme boite, la hauteur ne bouge pas. */
.a_propos_container { min-height: 0; }
.tournage-zone { position: relative; }
.tournage-collapsed { overflow: hidden; }

/* ===== TOURNAGE : paragraphe reduit masque, LIRE LA SUITE redimensionne ===== */
.tournage-zone { position: relative; }
.tournage-hidden { display: none; }

/* ===== NOTES CRAIE DU DETECTIVE : bloc unique sous le bureau, lisibles ===== */
.feed-visitor-notes {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 18px;
  max-width: min(1180px, 96%);
  margin: 14px auto 6px;
  padding: 10px 14px;
}
.feed-visitor-note {
  font-family: "Caveat", "ArsenalSC", cursive;
  font-size: clamp(1.05rem, 1.6vw, 1.45rem);
  line-height: 1.25;
  color: #e8e2d5;
  letter-spacing: 0.5px;
  transform: rotate(-1deg);
  text-shadow: 0 0 6px rgba(234, 158, 240, 0.25), 1px 1px 0 rgba(0,0,0,0.6);
  white-space: nowrap;
}
.feed-visitor-note:nth-child(even) { transform: rotate(1.2deg); }
.feed-visitor-note i { color: #ea9ef0; margin-right: 6px; }
.feed-visitor-note sup { font-size: 0.6em; }

/* ===== FICHES D'EQUIPES : lisibilite renforcee (grand ecran) ===== */
.feed-fiche-card {
  font-size: clamp(0.72rem, 0.95vw, 0.95rem);
  line-height: 1.45;
  width: clamp(150px, 13vw, 210px);
  padding: 14px 14px 16px;
}
.feed-fiche-card i { font-size: 1.25rem; }
.feed-fiche-card strong { font-size: 0.92rem; }

/* ===== VIGNETTES PERSONNES : positions pour les 8 dedicaces ===== */
.feed-fiche-person--creation2 { top: 8%; left: 26%; transform: rotate(2deg); }
.feed-fiche-person--production2 { top: 36%; right: 6%; transform: rotate(-3deg); }

/* ===== AUDIENCES : lignes clickables ===== */
.topblog_tr { cursor: pointer; }
.feed-audiences-row-click:hover td { background: rgba(234, 158, 240, 0.08); }

/* ===== ENCART AUDIENCES : plus grand, adaptatif, fermeture ===== */
.feed-audiences-topcallout { width: min(92vw, 720px); }
.feed-audiences-callout-img { width: 200px; height: 135px; }
.feed-audiences-callout-body { font-size: 1.05em; line-height: 1.5; }
.feed-audiences-callout-close {
  position: absolute;
  top: 8px; right: 10px;
  width: 34px; height: 34px;
  border-radius: 50%;
  border: 1px dashed #ea9ef07e;
  background: #170f0faa;
  color: #ea9ef0;
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
}
.feed-audiences-callout-close:hover { color: #f8ede3; box-shadow: 2px 2px 0px #ea9ef054; }

/* ===== TABLEAU AGRANDI + CROQUIS ELARGI (sans recouvrir le tableau) ===== */
.feed-evidence-slot--lille { width: min(1240px, 97%); height: clamp(320px, calc(100vh - 76px - 170px), 560px); }
@media (max-width: 900px) { .feed-evidence-slot--lille { width: 96%; height: clamp(280px, calc(100vh - 76px - 190px), 440px); } }
@media (max-width: 700px) { .feed-evidence-slot--lille { width: 94%; height: clamp(260px, calc(100vh - 76px - 180px), 400px); } }
/* le croquis occupe l'essentiel du plateau sans le recouvrir entierement */
.feed-lille-map { width: min(78%, 860px); }
.feed-lille-plan { filter: sepia(0.32) contrast(1.04) brightness(1.04) saturate(0.9); }

/* ===== VIGNETTES PERSONNES : 4x4, effet deposer/jeter ===== */
.feed-fiche-people { inset: 0; }
.person-toss { animation: person-toss-anim 0.62s cubic-bezier(0.3, 0.7, 0.4, 1.15) forwards; }
@keyframes person-toss-anim {
  0%   { opacity: 0; transform: translate(-50%, -260%) rotate(calc(var(--toss-spin, 4deg) * -2)) scale(1.15); }
  55%  { opacity: 1; }
  72%  { transform: translate(calc(-50% + var(--toss-x, 0px)), -42%) rotate(var(--toss-spin, 4deg)) scale(1.02); }
  88%  { transform: translate(calc(-50% + var(--toss-x, 0px)), -56%) rotate(calc(var(--toss-spin, 4deg) * 0.6)); }
  100% { transform: translate(calc(-50% + var(--toss-x, 0px)), -50%) rotate(var(--toss-spin, 4deg)); }
}
.person-rest { transform: translate(calc(-50% + var(--toss-x, 0px)), -50%) rotate(var(--toss-spin, 4deg)); }
@media (prefers-reduced-motion: reduce) { .person-toss { animation: none; } }

/* ===== FICHES EQUIPES : punaisees SUR le tableau ===== */
.feed-fiche-cards {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 6;
}
.feed-fiche-card {
  position: absolute;
  width: clamp(140px, 12vw, 190px);
  font-size: clamp(0.68rem, 0.85vw, 0.85rem);
  line-height: 1.4;
  padding: 12px 12px 14px;
  pointer-events: auto;
}
.card-pinned { opacity: 0; transform-origin: 50% 8%; transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.2, 1.4, 0.4, 1); }
.card-pinned--set { opacity: 1; }

/* ===== ENCARTS PUBLICITAIRES VISITEURS : gauches/droites du bureau ===== */
.feed-visitor-notes {
  position: absolute;
  inset: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  pointer-events: none;
  z-index: 2;
}
.feed-visitor-note {
  position: absolute;
  width: clamp(150px, 12.5vw, 200px);
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 12px 14px;
  font-family: "ArsenalSC", sans-serif;
  white-space: normal;
  pointer-events: auto;
  color: #f2ecdd;
  background: linear-gradient(160deg, rgba(46, 36, 49, 0.96), rgba(30, 23, 32, 0.96));
  border: 1px solid rgba(234, 158, 240, 0.4);
  border-left: 3px solid #ea9ef0;
  border-radius: 4px 12px 4px 10px;
  box-shadow: 4px 4px 0px #ea9ef054, 0 8px 22px rgba(0, 0, 0, 0.55);
  text-shadow: none;
  opacity: 1;
  transform: rotate(-1.5deg);
}
.feed-visitor-note i {
  font-size: 1.05rem;
  color: #ea9ef0;
  margin-bottom: 4px;
}
.feed-visitor-note strong {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.8px;
  color: #f2ecdd;
  line-height: 1.3;
}
.feed-visitor-note em {
  font-family: "Caveat", "ArsenalSC", cursive;
  font-size: 0.95rem;
  color: #ea9ef0;
  line-height: 1.25;
}
/* punaise : marque les encarts comme affiches par le commissaire */
.feed-visitor-note::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ff9d9d, #a4243b 60%, #6d1425);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.55);
}
/* dispersion : 3 a gauche, 3 a droite, bandes laterales hors du plateau */
.feed-visitor-note[data-side="L"] { left: 0; }
.feed-visitor-note[data-side="R"] { right: 0; }
.feed-visitor-note[data-lane="0"] { top: 10%; }
.feed-visitor-note[data-lane="1"] { top: 42%; }
.feed-visitor-note[data-lane="2"] { top: 74%; }
/* responsive : sous 1400px les bandes laterales passent sous le tableau en flux */
@media (max-width: 1400px) {
  .feed-visitor-notes {
    position: static;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 12px auto 4px;
    max-width: min(1100px, 96%);
    padding: 0 10px;
  }
  .feed-visitor-note { position: static; width: min(240px, 45%); }
  .feed-visitor-note[data-side="L"] { left: auto; }
  .feed-visitor-note[data-side="R"] { right: auto; }
}
@media (max-width: 700px) {
  .feed-visitor-note { width: 100%; max-width: 320px; }
  .feed-visitor-note strong { font-size: 0.68rem; }
  .feed-visitor-note em { font-size: 0.88rem; }
}
/* fiche-cards en flux sous 1100px (deja gere) reste prioritaire pour la lisibilite mobile */
@media (max-width: 1100px) {
  .feed-fiche-cards {
    position: static;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    padding: 8px 0;
    margin-bottom: 8px;
  }
  .feed-fiche-card { position: static; transform: rotate(-1.5deg) !important; top: auto !important; left: auto !important; right: auto !important; }
  .feed-fiche-card:nth-child(even) { transform: rotate(1.5deg) !important; }
}

/* ===== 1ERE SECTION : EQUIPE TECHNIQUE COMPLETE (23 encarts) ===== */
/* Les 23 encarts sont punaises autour du croquis : le conteneur couvre le plateau,
   les encarts sont repartis en flux absolument ancre dans une grille de bords
   (jamais sous la navbar : le plateau est sous le bandeau nav). */
.feed-fiche-people {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
  display: grid;
  grid-template-columns: repeat(3, minmax(72px, 104px));
  grid-template-rows: repeat(6, auto);
  gap: 6px 10px;
  justify-content: space-between;
  align-content: center;
  padding: 6px 8px;
}
.feed-fiche-person {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: auto;
  max-width: 104px;
  min-width: 72px;
  pointer-events: auto;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: rotate(var(--hand-spin, 0deg));
  background: linear-gradient(165deg, #f6efdf 0%, #ead9bd 100%);
  border: 1px solid #c9b28c;
  border-radius: 3px 8px 3px 7px / 7px 3px 8px 3px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
  padding: 7px 6px 6px;
}
.feed-fiche-person img,
.feed-fiche-photo {
  width: 52px;
  height: 62px;
  object-fit: cover;
  border-radius: 2px;
  border: 2px solid #fdf6e6;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
  filter: grayscale(0.7) contrast(1.05);
}
.feed-fiche-photo--unknown {
  display: flex;
  align-items: center;
  justify-content: center;
  background: repeating-linear-gradient(45deg, #3a3330 0 6px, #2c2624 6px 12px);
}
.feed-fiche-photo--unknown span {
  font-family: "Caveat", cursive;
  font-size: 1.5rem;
  color: #ea9ef0;
}
.feed-fiche-person figcaption {
  font-family: "ArsenalSC", sans-serif;
  font-size: 0.46rem;
  letter-spacing: 0.4px;
  text-align: center;
  color: #3a2c22;
  margin-top: 3px;
  line-height: 1.35;
}
.feed-fiche-person figcaption a { color: #3a2c22; }
/* PUNAISES VARIEES : rouge / laiton / bleu / kraft */
.feed-fiche-person::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translateX(-50%) rotate(var(--pin-tilt, 0deg));
  width: 9px;
  height: 9px;
  border-radius: 50%;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.55);
  z-index: 2;
}
.feed-fiche-person.pin-red::before   { background: radial-gradient(circle at 35% 30%, #ff9d9d, #a4243b 60%, #6d1425); --pin-tilt: -6deg; }
.feed-fiche-person.pin-brass::before { background: radial-gradient(circle at 35% 30%, #ffe6a8, #b8860b 60%, #7a5205); --pin-tilt: 5deg; }
.feed-fiche-person.pin-blue::before  { background: radial-gradient(circle at 35% 30%, #a8d8ff, #2a5f9e 60%, #173a63); --pin-tilt: -4deg; }
.feed-fiche-person.pin-kraft::before { background: radial-gradient(circle at 35% 30%, #e8d2ac, #8a6a3c 60%, #55381b); --pin-tilt: 7deg; }
/* les 4 jetes sur le croquis passent en absolu, plus grands */
.person-tossed, .person-rest {
  position: absolute !important;
  max-width: 120px;
  min-width: 92px;
  z-index: 7;
}
.person-tossed .feed-fiche-person img, .person-rest .feed-fiche-photo,
.person-rest .feed-fiche-person img, .person-rest img { width: 62px; height: 74px; }
.person-tossed { animation: person-toss-anim 0.62s cubic-bezier(0.3, 0.7, 0.4, 1.15) forwards; }
.person-rest { transform: rotate(var(--toss-spin, 4deg)); }
/* grille responsive : sous 1400px la grille passe en flux sous le plateau */
@media (max-width: 1400px) {
  .feed-fiche-people {
    position: static;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    padding: 10px 0 2px;
    pointer-events: auto;
  }
  .feed-fiche-person { max-width: 96px; min-width: 66px; }
  .person-tossed, .person-rest { position: static !important; top: auto !important; left: auto !important; transform: rotate(var(--hand-spin, 0deg)); }
}
@media (max-width: 700px) {
  .feed-fiche-person img, .feed-fiche-photo { width: 40px; height: 50px; }
  .feed-fiche-person figcaption { font-size: 0.42rem; }
}

/* ===== SECTION PHOTOS : bureau de depot cote a cote avec les encadres personnages ===== */
.feed-photos-desk-row {
  align-items: stretch;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
  width: 100%;
}
.feed-evidence-slot--photos {
  position: relative;
  width: min(560px, 94%);
  height: 340px;
  margin: 0 auto;
  background: linear-gradient(180deg, #2a3d33 0%, #22332a 60%, #1c2a22 100%);
  border: 8px solid #5b3a24;
  border-radius: 6px;
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.55), 0 14px 30px rgba(0, 0, 0, 0.6);
  overflow: hidden;
}
.feed-evidence-slot--photos::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(95deg, transparent 0 46px, rgba(0,0,0,0.06) 46px 48px);
  pointer-events: none;
  z-index: 0;
}
@media (max-width: 1100px) {
  .feed-evidence-slot--photos { width: min(560px, 96%); height: 300px; }
  .feed-photos-desk-row { flex-direction: column; align-items: center; }
}

/* ===== SECURITE SUPERPOSITION : rien ne couvre la navbar ni le condense-nav ===== */
/* Les encarts absolus (grille, jetes, notes visiteurs) vivent DANS le plateau
   (.feed-evidence-slot, overflow:hidden en flux) : ils ne peuvent ni sortir du
   plateau ni passer sous la navbar. Le z-index navbar (2000) reste superieur
   a tous les elements de section (max 7). */
.feed-condense-nav { position: relative; z-index: 8; }
.feed-intro { position: relative; }
/* la 1ere section reste visible a 100vh si l'ecran le permet */
.feed-intro {
  height: calc(100vh - var(--navbar-height, 76px));
  min-height: 560px;
  overflow: visible;
}

/* ===== PETITS POST-IT NOTES : colles au bureau, ne masquent ni carte ni personnes ===== */
/* ancrees au bureau : le conteneur positionne sur la zone du plateau ; les
   post-it flottent aux coins/bords du plateau sans toucher la carte centrale
   (positions en % EPURES : jamais dans la zone 20-80% horizontale au centre). */
.feed-interrogation-desk { position: relative; }
.feed-visitor-notes {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 0;
  pointer-events: none;
}
.feed-visitor-note {
  position: absolute;
  width: clamp(118px, 9vw, 150px);
  padding: 8px 10px 9px;
  display: flex;
  flex-direction: column;
  gap: 1px;
  pointer-events: auto;
  background: linear-gradient(168deg, #f8e9a0 0%, #efd868 100%);
  border: 1px solid #d4b84e;
  border-radius: 2px 10px 2px 9px / 9px 2px 10px 2px;
  box-shadow: 2px 3px 8px rgba(0, 0, 0, 0.5);
  transform: rotate(-2deg);
  z-index: 2;
}
.feed-visitor-note i { font-size: 0.85rem; color: #8a2b2b; margin-bottom: 2px; }
.feed-visitor-note strong {
  font-family: "ArsenalSC-Fat", "ArsenalSC", sans-serif;
  font-size: 0.58rem;
  letter-spacing: 0.4px;
  color: #3a2c22;
  line-height: 1.25;
}
.feed-visitor-note em {
  font-family: "Caveat", cursive;
  font-size: 0.8rem;
  color: #6b4d1e;
  line-height: 1.15;
}
/* petit scotch en haut au lieu de la punaise : look post-it colle */
.feed-visitor-note::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%) rotate(-2deg);
  width: 34px;
  height: 11px;
  background: rgba(232, 226, 213, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.25);
}
/* positionnement : 2 post-it au-dessus du plateau (coins), 4 colles aux coins du plateau */
.feed-visitor-note--a { top: -4px; left: 2%; z-index: 2; }
.feed-visitor-note--b { top: -4px; right: 2%; transform: rotate(2deg); }
.feed-visitor-note--c { top: 2.5%; right: 0.4%; transform: rotate(1.5deg); z-index: 6; }
.feed-visitor-note--d { top: 2.5%; left: 0.4%; transform: rotate(-1.5deg); z-index: 6; }
.feed-visitor-note--e { bottom: 3%; right: 0.4%; transform: rotate(2.2deg); z-index: 6; }
.feed-visitor-note--f { bottom: 3%; left: 0.4%; transform: rotate(-2.2deg); z-index: 6; }
/* sous 1400px : les post-it passent en bandeau compact au-dessus du plateau */
@media (max-width: 1400px) {
  .feed-visitor-notes {
    position: static;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 6px auto 2px;
    max-width: min(1100px, 96%);
    padding: 4px 8px;
    pointer-events: auto;
  }
  .feed-visitor-note { position: static; transform: rotate(-1deg); }
  .feed-visitor-note:nth-child(even) { transform: rotate(1deg); }
}
@media (max-width: 700px) {
  .feed-visitor-note { width: min(160px, 46%); }
  .feed-visitor-note strong { font-size: 0.54rem; }
  .feed-visitor-note em { font-size: 0.74rem; }
}

/* ===== PERSONNES : 5 par refresh, bien visibles, plus grandes ===== */
.feed-fiche-person { max-width: 118px; min-width: 84px; }
.person-tossed, .person-rest { max-width: 132px; min-width: 104px; }
.person-rest img, .person-rest .feed-fiche-photo { width: 74px; height: 88px; }
.person-rest figcaption { font-size: 0.5rem; }