/* Onima /projets : la liste publique des projets en cours. Reprend les
   jetons et composants d'onima.css (.container, .page-hero, .section, .btn,
   .chip, .blason-inline) et les puces de region d'actualites.css
   (.actu-langues) : ce fichier n'ajoute que ce qu'ils ne couvrent pas, il
   se charge apres eux. */

/* ---------- Deux colonnes : la liste, la colonne collante ---------- */
.projets-pub {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 36px;
  align-items: start;
}
.projets-pub__main { min-width: 0; }
.projets-pub__regions { margin-bottom: 10px; flex-wrap: wrap; }
.projets-pub__compte { margin: 0 0 18px; color: var(--ink-soft); font-size: 14px; font-weight: 600; }

/* La colonne suit le defilement au bureau (sous l'en-tete collant de 72px). */
.projets-pub__side { min-width: 0; }
.projets-pub__sticky {
  position: sticky;
  top: 88px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* ---------- L'entree d'un projet ---------- */
.projets-pub__liste { display: flex; flex-direction: column; gap: 16px; }
.projet-pub {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  /* LOI DU SURVOL IMMOBILE (Bible DESIGN) : la carte s'eclaire, elle ne monte pas. */
  transition: box-shadow .15s ease, border-color .15s ease;
  /* L'ancre (#pid) atterrit sous l'en-tete collant : la marge est celle du site. */
  scroll-margin-top: 92px;
}
.projet-pub:hover { border-color: var(--green); box-shadow: var(--shadow-lg); }
/* Le projet vise par un lien profond (?p=) se distingue d'un liseré vert. */
.projet-pub--cible { border-color: var(--green); box-shadow: 0 0 0 3px var(--green-tint), var(--shadow); }

/* LOI DU TERROIR : blason + canton (code), puis la commune. */
.projet-pub__lieu {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 10px;
  color: var(--ink-faint);
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.projet-pub__lieu .blason-inline { margin-right: 6px; vertical-align: -3px; }
.projet-pub__commune { color: var(--green-deep); letter-spacing: .08em; }

.projet-pub__titre {
  font-size: 19px;
  font-weight: 800;
  color: var(--navy-2);
  letter-spacing: -0.01em;
  line-height: 1.28;
}

.projet-pub__desc {
  color: var(--ink-soft);
  font-size: 14.5px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Le pied : stade, opportunites et dernier signal a gauche, le bouton a droite. */
.projet-pub__pied {
  margin-top: 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.projet-pub__chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
/* Le stade : la meme pastille que le statut d'une carte projet (point de
   couleur du registre, texte centre), en version inline. */
.projet-pub__statut {
  position: relative;
  display: inline-flex; align-items: center;
  background: var(--bg-alt); color: var(--ink);
  font-weight: 600; font-size: 12.5px;
  padding: 5px 11px 5px 24px; border-radius: var(--radius-pill);
}
.projet-pub__statut::before {
  content: ""; position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
  width: 9px; height: 9px; border-radius: 50%; background: var(--status-color, var(--green));
}
.projet-pub__signal { color: var(--ink-faint); font-size: 12.5px; white-space: nowrap; }
.projet-pub__cta { flex: 0 0 auto; }

/* ---------- Les appels de la colonne ---------- */
.pub-cta {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 22px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pub-cta__kicker {
  color: var(--green-deep); font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; font-size: 12px;
}
.pub-cta__titre { font-size: 19px; font-weight: 800; line-height: 1.25; color: var(--navy-2); }
.pub-cta__texte { color: var(--ink-soft); font-size: 14.5px; line-height: 1.5; }
.pub-cta .btn { margin-top: 6px; }
/* LOI DES SURFACES SOMBRES : la seconde carte porte la surface navy du site.
   Le fond est redit ICI : .pub-cta pose var(--card) PLUS BAS dans la cascade
   que .surface-navy (onima.css), et la carte restait blanche sous ses textes
   blancs (bug de lisibilite, 09.09). Meme degrade navy que le hero de la
   landing, fondu vers le vert de la marque en bas ; le halo de la surface
   est resserre a la taille de la carte. */
.pub-cta--navy {
  border-color: transparent; color: #fff;
  background: linear-gradient(150deg, #000a16 0%, #0a1628 58%, #2e7d26 100%);
  --halo-size: 340px; --halo-right: -120px; --halo-bottom: -150px;
}
.pub-cta--navy .pub-cta__kicker { color: var(--green-soft); }
.pub-cta--navy .pub-cta__titre { color: #fff; }
.pub-cta--navy .pub-cta__texte { color: rgba(255, 255, 255, .8); }

/* ---------- Responsive : on empile, on ne compresse jamais ---------- */
@media (max-width: 960px) {
  .projets-pub { grid-template-columns: 1fr; gap: 28px; }
  .projets-pub__sticky { position: static; }
}
@media (max-width: 640px) {
  .projet-pub { padding: 18px 16px; }
  .projet-pub__pied { flex-direction: column; align-items: stretch; }
  .projet-pub__cta { width: 100%; text-align: center; }
  .projet-pub__signal { white-space: normal; }
}