/* CNS-JOJ V5 : meme systeme de bandeaux, photos remplacees et carte de garnissement ajoutee. */
.security-portal main .cns-sites-v4-hero { overflow:hidden; isolation:isolate; }
.security-portal main .cns-sites-v4-hero > .cns-sites-v4-layout {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(300px,36%) !important;
  align-items:stretch !important;
  gap:clamp(12px,2vw,30px) !important;
  padding-block:0 !important;
  min-height:220px;
}
.security-portal main .cns-sites-v4-hero .cns-sites-v4-copy {
  display:flex; flex-direction:column; justify-content:center; min-width:0;
  padding-block:clamp(22px,3vw,38px) !important;
}
.security-portal main .cns-sites-v4-hero .cns-sites-v4-photo {
  align-self:stretch !important; justify-self:stretch !important; position:relative !important;
  isolation:isolate; display:block !important; height:100% !important; min-height:220px !important;
  margin:0 !important; padding:0 !important; overflow:hidden !important; border:none !important;
  border-radius:0 !important; box-shadow:none !important; background:#e6efea;
}
.security-portal main .cns-sites-v4-hero .cns-sites-v4-photo > img {
  display:block !important; width:100% !important; height:100% !important; min-height:220px !important;
  object-fit:cover !important; object-position:var(--cns-v4-position,center 50%) !important;
  border:0 !important; border-radius:0 !important; box-shadow:none !important; filter:none !important; transform:none !important;
}
.security-portal main .cns-sites-v4-hero .cns-sites-v4-photo::before {
  content:"" !important; display:block !important; position:absolute !important; inset:0 auto 0 0 !important;
  width:clamp(70px,28%,160px) !important; z-index:2; pointer-events:none;
  background:linear-gradient(90deg,#ecf6ee 0%,rgba(236,246,238,.84) 30%,rgba(236,246,238,.28) 74%,transparent 100%) !important;
}
.security-portal main .cns-sites-v4-hero .cns-sites-v4-photo::after {
  content:"" !important; position:absolute !important; inset:0 auto 0 0 !important; width:22px !important;
  background:linear-gradient(90deg,rgba(24,58,44,.10),rgba(24,58,44,0)) !important; z-index:1; pointer-events:none;
}
.security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid.cns-sites-v4-layout {
  grid-template-columns:minmax(0,1fr) minmax(300px,36%) !important;
  grid-template-rows:auto auto; column-gap:clamp(12px,2vw,30px) !important; align-items:stretch !important;
}
.security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid > .cns-sites-v4-copy { grid-column:1; grid-row:1; padding-bottom:8px !important; }
.security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid > .committee-seal { grid-column:1; grid-row:2; max-width:330px; margin-bottom:22px; }
.security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid > .cns-sites-v4-photo { grid-column:2; grid-row:1 / span 2; }

.security-portal main .cns-sites-v5-garnish {
  display:grid; grid-template-columns:minmax(260px, 36%) minmax(0,1fr); gap:20px; align-items:stretch;
  margin:28px auto 12px; width:min(100%, 1180px); background:#fff; border:1px solid #dce7e1; border-radius:18px;
  overflow:hidden; box-shadow:0 8px 24px rgba(15,46,33,.06);
}
.security-portal main .cns-sites-v5-garnish__media { min-height:220px; }
.security-portal main .cns-sites-v5-garnish__media img { display:block; width:100%; height:100%; min-height:220px; object-fit:cover; }
.security-portal main .cns-sites-v5-garnish__copy { padding:24px 24px 24px 4px; display:flex; flex-direction:column; justify-content:center; }
.security-portal main .cns-sites-v5-garnish__eyebrow { font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#21824e; margin-bottom:8px; }
.security-portal main .cns-sites-v5-garnish h3 { margin:0 0 10px; font-size:1.35rem; line-height:1.2; color:#173b32; }
.security-portal main .cns-sites-v5-garnish p { margin:0; color:#5a7066; line-height:1.6; }

@media (max-width:820px) {
  .security-portal main .cns-sites-v4-hero > .cns-sites-v4-layout,
  .security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid.cns-sites-v4-layout {
    grid-template-columns:minmax(0,1fr) !important; grid-template-rows:auto !important; width:min(100% - 32px,1440px); gap:0 !important;
  }
  .security-portal main .cns-sites-v4-hero .cns-sites-v4-copy { padding-block:24px 16px !important; }
  .security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid > .cns-sites-v4-copy,
  .security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid > .committee-seal,
  .security-portal main .committee-hero.cns-sites-v4-hero .committee-hero-grid > .cns-sites-v4-photo { grid-column:1; grid-row:auto; }
  .security-portal main .cns-sites-v4-hero .cns-sites-v4-photo,
  .security-portal main .cns-sites-v4-hero .cns-sites-v4-photo > img { min-height:178px !important; height:178px !important; }
  .security-portal main .cns-sites-v4-hero .cns-sites-v4-photo::before { background:linear-gradient(90deg,rgba(236,246,238,.55),transparent 100%) !important; width:20% !important; }
  .security-portal main .cns-sites-v5-garnish { grid-template-columns:1fr; gap:0; margin-top:20px; }
  .security-portal main .cns-sites-v5-garnish__copy { padding:18px 18px 20px; }
}
@media print {
  .security-portal main .cns-sites-v4-hero .cns-sites-v4-photo,
  .security-portal main .cns-sites-v5-garnish { display:none !important; }
}
