/* =========================================================
   PAGE PROJETS — reference pixel : Page-Projets.dc.html (handoff).
   ========================================================= */

/* ===================== HERO ===================== */
.pj-hero { padding: 40px 48px 64px; box-sizing: border-box; }
.pj-eyebrow-row { display: flex; justify-content: space-between; gap: 16px; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #8A8A8A; margin-bottom: 14px; }
.pj-title { margin: 0; overflow: hidden; font-family: 'Archivo', sans-serif; font-variation-settings: 'wdth' 100; font-weight: 400; line-height: .9; letter-spacing: -0.035em; white-space: nowrap; font-size: min(15vw, 230px); padding-bottom: .04em; }
.pj-title__inner { display: inline-block; }
.pj-title__num { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -0.02em; color: #0136FE; font-size: .32em; vertical-align: top; margin-left: .15em; }
.pj-lead-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 28px 48px; margin-top: 28px; }
.pj-lead { margin: 0; font-size: 48px; line-height: 1.05; letter-spacing: -0.04em; font-weight: 700; max-width: 760px; }
.pj-lead__it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -0.02em; color: #0136FE; }
.pj-filters { display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 699px) {
  .pj-hero { padding: 32px 16px 48px; }
  .pj-lead-row { margin-top: 20px; }
  .pj-lead { font-size: 30px; }
}
@media (min-width: 700px) and (max-width: 999px) { .pj-lead { font-size: 40px; } }

/* ===================== GRILLE ===================== */
.pj-grid-section { padding: 8px 48px 120px; box-sizing: border-box; }
.pj-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 64px 28px; align-items: start; }
@media (max-width: 699px) { .pj-grid-section { padding: 8px 16px 80px; } .pj-grid { grid-template-columns: 1fr; gap: 44px 16px; } }
@media (min-width: 700px) and (max-width: 999px) { .pj-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.pj-card-name { margin: 0; font-size: 24px; font-weight: 700; letter-spacing: -0.035em; line-height: 1.1; }
@media (max-width: 699px) { .pj-card-name { font-size: 22px; } }
.pj-card-num { font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #0136FE; white-space: nowrap; }
.pj-card-cat { margin: 6px 0 0; font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: .1em; color: #8A8A8A; text-transform: uppercase; }

/* ===================== VIDÉOS ===================== */
.pj-video-section { background: #1C1C1C; color: #F2F2F2; padding: 110px 48px; box-sizing: border-box; }
.pj-video-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 48px; }
.pj-video-title { font-family: 'Archivo', sans-serif; font-variation-settings: 'wdth' 100; font-weight: 400; text-transform: uppercase; line-height: .88; letter-spacing: -0.035em; margin: 0; font-size: 88px; }
.pj-video-title__it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -0.02em; color: #6E8CFF; }
.pj-video-lead { margin: 0; font-size: 19px; line-height: 1.5; color: #BDBDBD; max-width: 460px; }
.pj-video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 20px; }
.pj-video-thumb { display: block; aspect-ratio: 16 / 9; }
.pj-video-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pj-video-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.12); }
.pj-video-play { position: absolute; right: 16px; bottom: 16px; }
.pj-video-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-top: 16px; }
.pj-video-name { font-size: 24px; line-height: 1.1; font-weight: 700; letter-spacing: -0.03em; }
.pj-video-tag { font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #6E8CFF; white-space: nowrap; }
.pj-video-sub { display: block; font-size: 15px; color: #BDBDBD; margin-top: 6px; }
@media (max-width: 699px) {
  .pj-video-section { padding: 80px 16px; }
  .pj-video-title { font-size: 56px; }
  .pj-video-grid { grid-template-columns: 1fr; }
  .pj-video-name { font-size: 22px; }
}
@media (min-width: 700px) and (max-width: 999px) { .pj-video-grid { grid-template-columns: 1fr; } .pj-video-title { font-size: 72px; } }

/* ===================== ENCART CONTACT ===================== */
.pj-cta-section { background: #0136FE; color: #FFFFFF; padding: 110px 48px; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 32px; }
.pj-cta-title { margin: 0; font-size: 104px; line-height: .92; letter-spacing: -0.05em; font-weight: 700; }
.pj-cta-title__it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -0.02em; }
.pj-cta-btn { align-self: flex-start; }
@media (max-width: 699px) { .pj-cta-section { padding: 80px 16px; } .pj-cta-title { font-size: 44px; } }
@media (min-width: 700px) and (max-width: 999px) { .pj-cta-title { font-size: 72px; } .pj-cta-section { padding: 110px 48px; } }
