/* Parcours « Comprendre pour agir » — VigiCrécy(R)
   Explications : voir notes-techniques.md */

.vcp-page { padding:24px 0 40px; }
.vcp-wrap { max-width:1040px; margin:0 auto; padding:0 18px; }
.vcp-article {
  background:#fff; border-radius:18px; overflow:hidden;
  box-shadow:0 6px 30px rgba(1,74,133,.10);
}

.vcp-bandeau {
  background:radial-gradient(ellipse at top right,#1486CC 0%,#3B6CB7 45%,#1A2E4A 100%);
  color:#fff; padding:28px 40px 26px;
}
.vcp-surtitre {
  font-size:11px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:#B8ECFF; margin:0 0 8px;
}
.vcp-titre {
  font-size:30px; font-weight:700; line-height:1.15;
  margin:0; color:#fff; letter-spacing:-.4px;
}
.vcp-soustitre { font-size:15px; line-height:1.5; color:rgba(255,255,255,.88); margin:12px 0 0; }

.vcp-fil { padding:14px 40px; background:#F8FBFE; border-bottom:1px solid #E3ECF5; }
.vcp-fil__ligne {
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:8px;
}
.vcp-fil__etape {
  font-size:11px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:#3B6CB7;
}
.vcp-fil__retour { font-size:12.5px; color:#6B9FCC; text-decoration:none; }
.vcp-fil__retour:hover { color:#3B6CB7; }
.vcp-fil__barre { height:4px; background:#E3ECF5; border-radius:2px; overflow:hidden; }
.vcp-fil__barre span {
  display:block; height:100%; border-radius:2px;
  background:linear-gradient(90deg,#3B6CB7,#5AADCF);
}

.vcp-corps {
  padding:32px 40px 28px;
  font-size:16.5px; line-height:1.75; color:#2B3A47;
  text-align:justify; hyphens:none; -webkit-hyphens:none;
}
.vcp-corps p { margin:0 0 18px; }
.vcp-corps h2 {
  font-size:21px; font-weight:700; color:#1A2E4A;
  margin:32px 0 14px; line-height:1.3; text-align:left;
}
.vcp-corps ul { margin:0 0 18px; padding-left:22px; }
.vcp-corps li { margin:0 0 8px; }
.vcp-corps strong { color:#1A2E4A; font-weight:700; }
.vcp-sep { border:none; border-top:1px solid #E3ECF5; margin:30px 0; }
.vcp-chapeau { font-size:18px; line-height:1.65; color:#1A2E4A; font-weight:500; }

.vcp-verite {
  margin:26px 0; padding:20px 24px;
  background:linear-gradient(135deg,#EEF4FB,#F6FAFE);
  border:1px solid #D6EAF8; border-radius:12px;
  font-size:19px; line-height:1.45; font-weight:600;
  color:#1A2E4A; text-align:center; font-style:normal;
}

.vcp-schema {
  display:block; width:100%; height:auto; margin:26px 0;
  background:#fff; border:1px solid #E3ECF5; border-radius:12px;
  padding:6px; box-sizing:border-box;
}

.vcp-retenir {
  margin:30px 0 0; padding:22px 26px;
  background:#F8FBFE; border:1px solid #D6EAF8; border-radius:12px;
}
.vcp-retenir__titre {
  font-size:11px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:#3B6CB7; margin:0 0 12px !important;
  text-align:left;
}
.vcp-retenir ul { list-style:none; margin:0; padding:0; }
.vcp-retenir li {
  position:relative; padding-left:22px; margin:0 0 10px;
  font-size:15.5px; line-height:1.55; text-align:left;
}

.vcp-retenir li::before {
  content:''; position:absolute; left:2px; top:8px;
  width:7px; height:7px;
  border-right:2px solid #3B6CB7;
  border-top:2px solid #3B6CB7;
  transform:rotate(45deg);
}

.vcp-nav {
  display:flex; flex-wrap:wrap; gap:12px; align-items:stretch;
  margin-top:28px;
}
.vcp-nav a {
  flex:1 1 240px; min-width:0;
  padding:14px 18px; border-radius:12px; text-decoration:none;
  border:1px solid #D6EAF8; background:#fff;
}
.vcp-nav a:hover { background:#F8FBFE; border-color:#B5D4F4; }
.vcp-nav__sens {
  display:block; font-size:11px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:#6B9FCC; margin-bottom:4px;
}
.vcp-nav__lib { display:block; font-size:15px; font-weight:600; color:#1A2E4A; line-height:1.35; }
.vcp-nav__suivant { background:linear-gradient(135deg,#EEF4FB,#F6FAFE); }
.vcp-nav__suivant .vcp-nav__sens { color:#3B6CB7; }

@media (max-width:700px) {
  .vcp-bandeau { padding:22px 22px 20px; }
  .vcp-titre   { font-size:24px; }
  .vcp-fil     { padding:12px 22px; }
  .vcp-corps   { padding:26px 22px 20px; font-size:16px; }
  .vcp-verite  { font-size:17px; padding:16px 18px; }
  .vcp-retenir { padding:18px 20px; }
}

/* N-1 */
#vcs-panel,
#vcs-toggle { display: none !important; }

body.home.mode-operationnel #vcs-panel,
body.home.mode-operationnel #vcs-toggle { display: block !important; }

/* N-19 */
.vcex-aleas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px;
  margin: 22px 0 8px;
}

.vcex-aleas__pave {
  display: flex;
  flex-direction: column;
  padding: 18px 20px 16px;
  background: #fff;
  border: 1px solid #E3ECF5;
  border-left: 5px solid var(--a, #3B6CB7);
  border-radius: 12px;
  text-decoration: none;
  transition: transform .16s, box-shadow .16s, border-color .16s;
}

.vcex-aleas__pave:hover,
.vcex-aleas__pave:focus-visible {
  transform: translateY(-2px);
  border-color: var(--a, #3B6CB7);
  box-shadow: 0 6px 20px rgba(1, 74, 133, .13);
}

.vcex-aleas__titre {
  margin-bottom: 8px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--a, #3B6CB7);
}

.vcex-aleas__texte {
  flex: 1;
  font-size: 14px;
  line-height: 1.62;
  color: #4A5763;
}

.vcex-aleas__lire {
  margin-top: 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--a, #3B6CB7);
}

.vcex-aleas__lire::after {
  content: ' →';
  transition: margin-left .16s;
}

.vcex-aleas__pave:hover .vcex-aleas__lire::after { margin-left: 4px; }

/* N-20 */
.vcex-aleas__pave--crue       { --a: #3B6CB7; }
.vcex-aleas__pave--secheresse { --a: #B07A2E; }
.vcex-aleas__pave--chaleur    { --a: #D9622B; }
.vcex-aleas__pave--hiver      { --a: #5A9BC4; }
.vcex-aleas__pave--route      { --a: #5F6B7A; }

@media (max-width: 640px) {
  .vcex-aleas { grid-template-columns: 1fr; gap: 11px; }
  .vcex-aleas__pave { padding: 16px 18px 14px; }
}

/* N-21 */
body:has(.vcex-page) .wpr-nav-menu > li:hover > ul,
body:has(.vcex-page) .wpr-nav-menu > li:hover > .wpr-mega-menu-content,
body:has(.vcex-page) .wpr-nav-menu > li:focus-within > ul,
body:has(.vcex-page) .wpr-nav-menu > li:focus-within > .wpr-mega-menu-content {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* N-22 */
body:has(.vcex-page) .wpr-nav-menu > li.menu-item-has-children::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 14px;
}
