/* ============================================================
   _footer.css — Le parvis · le pied de page de la famille flamme
   Le visiteur arrive ici au sortir de chaque page : un bandeau qui dit
   si l'appel est ouvert, la marque et ses passerelles, trois colonnes de
   navigation, un filet bas. Une seule génération, aucune correction posée
   par-dessus : la coquille (largeur, gouttière) se règle dans main.css,
   tout le reste est ici.
   ============================================================ */

/* ── 1. Jetons et armure ────────────────────────────────────── */
.parvis{
  --pv-ink: #f8ede8;
  --pv-soft: #d6bcb6;
  --pv-muted: #a1848a;
  --pv-ruby: #ff4d63;
  --pv-ember: #ff8a4c;
  --pv-amber: #ffb340;
  --pv-gold: #ffdc9a;
  --pv-line: #ffb9a326;
  --pv-line-soft: #ffb9a312;
  --pv-plate: linear-gradient(178deg, #ffffff0a, #ffffff02 34%), #140c0ae0;
  --pv-chip: #17110e9c;
  --pv-inset: linear-gradient(158deg, #ffffff0d, #ffffff03 46%), #1b1210cc;
  --pv-flame: linear-gradient(96deg, #ff4d63 0%, #ff8a4c 46%, #ffdc9a 100%);

  --pv-ease: cubic-bezier(.16, 1, .3, 1);
  position: relative; z-index: 1; isolation: isolate;
  display: block; width: 100%; min-width: 0; margin: 0; padding: 0;
  overflow: clip;
  container-type: inline-size;
  background: var(--pv-plate); color: var(--pv-ink);
  font-family: var(--font-body); line-height: 1.68;
  -webkit-font-smoothing: antialiased;
}
/* La couche de base bride les éléments nus où qu'ils soient : p, ul et ol à
   68ch, les titres à 22-36ch. Sur un parvis de trois colonnes, ces plafonds
   coupent les rangées. `:where()` laisse gagner les respirations en ch posées
   plus bas sur les classes. */
.parvis :where(h1, h2, h3, h4, p, ul, ol, li, figure){ margin: 0; padding: 0; max-width: none }
.parvis :where(ul, ol){ list-style: none }
.parvis :where(a){ color: inherit; text-decoration: none }
.parvis :where(img){ display: block }
.parvis :where(i){ font-style: normal }
.parvis :where(small){ color: inherit }
.parvis :is(a, button):focus-visible{ outline: 2px solid var(--pv-gold); outline-offset: 4px; border-radius: 12px }

/* Le liseré brûlant qui ferme la page, et un souffle de braise sous la colonne
   de marque. Deux pseudo-éléments, rien de plus : la couche globale d'ombres
   suffit au reste. */
.parvis-seam{
  position: absolute; z-index: 3; inset: 0 0 auto; height: 2px;
  background: linear-gradient(90deg, transparent, #ff4d634d 11%, #ff8a4cb3 33%, #ffdc9acc 50%, #ff8a4cb3 67%, #ff4d634d 89%, transparent);
}
.parvis::before{
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  inset: auto 42% -46% -10%;
  background: radial-gradient(ellipse 62% 58% at 30% 100%, #ff8a4c17, transparent 72%);
}
.parvis-watermark{
  position: absolute; z-index: 0; right: -.055em; bottom: -.28em;
  pointer-events: none; user-select:none;
  font-size: clamp(120px, 19cqi, 460px); font-weight: 800; line-height: .74;
  letter-spacing: -.055em; text-transform: uppercase;
  color: transparent; -webkit-text-stroke: 1px #ffb9a321;
}
.parvis-shell{
  position: relative; z-index: 1;
  display: grid; gap: clamp(24px, 2.8vw, 44px);
  padding-block: clamp(34px, 5vh, 72px) clamp(22px, 2.6vh, 34px);
}

/* ── 2. Le bandeau d'appel ──────────────────────────────────── */
.parvis-call{
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: clamp(15px, 1.7vw, 26px);
  padding: clamp(17px, 1.9vw, 27px) clamp(18px, 2.1vw, 32px);
  border: 1px solid var(--pv-line); border-radius: 24px;
  background: var(--pv-inset);
  box-shadow: inset 0 1px 0 #ffffff0d;
}
.parvis-flame{
  position: relative; flex: 0 0 auto;
  width: clamp(38px, 3.1vw, 50px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 50% 64%, #ffdc9a, #ff8a4c 40%, #ff4d63 70%, #ff4d6300 74%);
  box-shadow: 0 0 0 1px #ff8a4c33, 0 0 26px #ff6a4c47;
}
.parvis-flame i{
  position: absolute; inset: -5px; border-radius: 50%;
  border: 1px solid #ff8a4c4d; animation: pv-pulse 3.4s var(--pv-ease) infinite;
}
.parvis-flame i:nth-child(2){ animation-delay: 1.13s }
.parvis-flame i:nth-child(3){ animation-delay: 2.26s }
@keyframes pv-pulse { from { scale: .74; opacity: .7 } to { scale: 1.55; opacity: 0 } }
.parvis-kicker{
  display: block; margin-bottom: 5px;
  font-size: 11.4px; font-weight: 650; letter-spacing: .13em; text-transform: uppercase;
  color: var(--pv-amber);
}
.parvis-call h2{ font-size: clamp(19px, 1.62vw, 27px); font-weight: 600; line-height: 1.28; letter-spacing: -.018em }
.parvis-call-note{ margin-top: 5px; font-size: 13.8px; color: var(--pv-muted) }
.parvis-call-btn{
  display: inline-flex; align-items: center; gap: 9px; white-space: nowrap;
  padding: 13px 21px; border-radius: 14px;
  background: var(--pv-flame); color: #2b0d10;
  font-size: 14.2px; font-weight: 650;
  box-shadow: 0 12px 26px #ff5a3d2e, inset 0 1px 0 #ffffff3d;
  transition: translate .35s var(--pv-ease), box-shadow .35s, filter .35s;
}
.parvis-call-btn:hover{ translate: 0 -2px; filter: brightness(1.06); box-shadow: 0 18px 34px #ff5a3d3d, inset 0 1px 0 #ffffff4d }
.parvis-call-btn > .bi{ font-size: 13px }
/* Guichet clos : plus de pouls, une braise éteinte, et le renvoi vers le
   conseil plutôt que vers un formulaire de candidature qui refuserait. */
.parvis-call--closed{ border-color: var(--pv-line-soft) }
.parvis-call--closed .parvis-flame{ filter: saturate(.28) brightness(.72) }
.parvis-call--closed .parvis-flame i{ animation: none; opacity: .22 }
.parvis-call--closed .parvis-kicker{ color: var(--pv-muted) }
.parvis-call-btn--ghost{
  background: none; color: var(--pv-soft);
  border: 1px solid var(--pv-line); box-shadow: none;
}
.parvis-call-btn--ghost:hover{ color: var(--pv-ink); border-color: #ff8a4c59; box-shadow: 0 12px 26px #05020630 }

/* ── 3. La grille ───────────────────────────────────────────── */
.parvis-grid{
  display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 2.9vw, 62px);
}
.parvis-lead{ display: grid; align-content: start; gap: clamp(14px, 1.4vw, 20px); min-width: 0 }
.parvis-brand{ display: inline-block; width: fit-content }
.parvis-brand img{ width: min(100%, 218px); height: auto }
.parvis-tag{ max-width: 36ch; font-size: 15px; line-height: 1.74; color: var(--pv-soft) }

/* Quatre tuiles jumelles : même géométrie, la hiérarchie vient de la couleur
   de l'icône, pas de la taille. */
.parvis-bridges{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; width: 100%; max-width: 372px }
.parvis-bridge{
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px;
  padding: 11px 13px; border: 1px solid var(--pv-line-soft); border-radius: 14px;
  background: var(--pv-chip);
  transition: border-color .35s, background-color .35s, translate .35s var(--pv-ease);
}
.parvis-bridge > .bi:first-child{ font-size: 17px; color: var(--pv-muted); transition: color .35s }
.parvis-bridge-copy{ display: grid; min-width: 0 }
.parvis-bridge strong{ font-size: 13.6px; font-weight: 600; letter-spacing: -.005em }
.parvis-bridge small{ font-size: 11.6px; color: var(--pv-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.parvis-bridge-out{ font-size: 10.5px; color: var(--pv-amber); opacity: 0; translate: -5px 0; transition: opacity .35s, translate .35s var(--pv-ease) }
.parvis-bridge:hover{ border-color: #ff8a4c40; background: #1f1613d1; translate: 0 -2px }
.parvis-bridge:hover > .bi:first-child{ color: var(--pv-amber) }
.parvis-bridge:hover .parvis-bridge-out{ opacity: 1; translate: 0 0 }

.parvis-mail{
  display: inline-flex; align-items: center; gap: 9px; width: fit-content;
  font-size: 13.4px; color: var(--pv-soft);
  border-bottom: 1px solid transparent;
  transition: color .3s, border-color .3s;
}
.parvis-mail > .bi{ font-size: 14px; color: var(--pv-muted); transition: color .3s }
.parvis-mail:hover{ color: var(--pv-gold); border-bottom-color: #ffdc9a59 }
.parvis-mail:hover > .bi{ color: var(--pv-amber) }

.parvis-col{ min-width: 0; align-self: start }
.parvis-col-title{
  padding-bottom: 11px; margin-bottom: 11px;
  border-bottom: 1px solid var(--pv-line-soft);
  font-size: 11.4px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase;
  color: var(--pv-gold);
}
.parvis-list{ display: grid; gap: 1px }
.parvis-link{
  display: grid; grid-template-columns: 21px minmax(0, 1fr); align-items: baseline;
  padding: 6px 0; font-size: 14.2px; line-height: 1.5; color: var(--pv-soft);
  transition: color .3s var(--pv-ease);
}
.parvis-link-mark{ font-size: 12.5px; color: var(--pv-muted); transition: color .3s, translate .3s var(--pv-ease) }
.parvis-link:hover{ color: var(--pv-ink) }
.parvis-link:hover .parvis-link-mark{ color: var(--pv-amber); translate: 3px 0 }
.parvis-link[aria-current="page"]{ color: var(--pv-gold) }
.parvis-link[aria-current="page"] .parvis-link-mark{ color: var(--pv-amber) }

/* ── 4. Le filet bas ────────────────────────────────────────── */
.parvis-base{
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 12px 24px; padding-top: clamp(16px, 1.9vw, 24px);
  border-top: 1px solid var(--pv-line-soft);
}
.parvis-rights{ font-size: 12.6px; color: var(--pv-muted) }
.parvis-dot{ margin-inline: 3px; color: var(--pv-line) }
.parvis-heart{ color: var(--pv-ruby); font-size: 11.5px }
.parvis-quick{ display: flex; flex-wrap: wrap; gap: 18px; font-size: 12.4px; color: var(--pv-muted) }
.parvis-quick a{ transition: color .3s }
.parvis-quick a:hover{ color: var(--pv-ink) }

/* ── 5. Échelle du parvis ───────────────────────────────────── */
@media (min-width: 1500px) {
  .parvis-shell{ gap: clamp(30px, 2.6vw, 46px) }
  .parvis-grid{ padding-block-end: clamp(10px, 1.4vh, 22px) }
  .parvis-brand img{ width: 244px }
  .parvis-tag{ font-size: 16px; max-width: 38ch }
  .parvis-bridges{ gap: 11px; max-width: 420px }
  .parvis-bridge{ padding: 13px 15px }
  .parvis-bridge strong{ font-size: 14.6px }
  .parvis-bridge small{ font-size: 12.6px }
  .parvis-link{ font-size: 15.2px; padding: 7px 0 }
  .parvis-col-title{ font-size: 12px }
  .parvis-rights,.parvis-quick{ font-size: 13.2px }
}
@media (min-width: 1900px) {
  .parvis-call{ padding: clamp(22px, 1.7vw, 32px) clamp(24px, 1.9vw, 38px) }
  .parvis-kicker{ font-size: 12.2px }
  .parvis-call h2{ font-size: clamp(24px, 1.7vw, 32px) }
  .parvis-call-note{ font-size: 15px }
  .parvis-call-btn{ padding: 15px 25px; font-size: 15.4px }
  .parvis-brand img{ width: 288px }
  .parvis-tag{ font-size: 16.8px }
  /* La colonne de marque fait alors plus de 700 px : les tuiles prennent toute
     sa mesure au lieu de s'arrêter à leur plafond de 420 px. */
  .parvis-bridges{ max-width: none; gap: 14px }
  .parvis-bridge{ padding: 16px 19px }
  .parvis-bridge > .bi:first-child{ font-size: 19px }
  .parvis-bridge strong{ font-size: 15.6px }
  .parvis-bridge small{ font-size: 13.4px }
  .parvis-bridge-out{ font-size: 12px }
  .parvis-mail{ font-size: 14.6px }
  .parvis-link{ font-size: 16px }
  .parvis-link-mark{ font-size: 13.5px }
  .parvis-col-title{ font-size: 12.6px }
  .parvis-watermark{ font-size: clamp(220px, 17cqi, 420px); -webkit-text-stroke-width: 1.6px }
}

/* ── 6. Quand le cadre se resserre ──────────────────────────── */
@media (max-width: 1180px) {
  .parvis-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px }
  .parvis-lead{ grid-column: 1 / -1 }
}
@media (max-width: 760px) {
  .parvis-call{ grid-template-columns: auto minmax(0, 1fr); row-gap: 14px }
  .parvis-call-btn{ grid-column: 1 / -1; justify-content: center }
  .parvis-grid{ grid-template-columns: minmax(0, 1fr); row-gap: 26px }
  .parvis-watermark{ font-size: 34vw; bottom: -.2em }
  .parvis-base{ justify-content: flex-start }
}

/* ── 7. Thème clair ─────────────────────────────────────────── */
html[data-theme="light"] .parvis{
  --pv-ink: #2c1618;
  --pv-soft: #6b4a49;
  --pv-muted: #93736f;
  --pv-ruby: #d8303f;
  --pv-amber: #cf750b;
  --pv-gold: #a4560d;
  --pv-line: #b9544638;
  --pv-line-soft: #b954461a;
  --pv-plate: linear-gradient(178deg, #ffffffd9, #ffffff8c 34%), #f7e7dc;
  --pv-chip: #fffaf5d9;
  --pv-inset: linear-gradient(158deg, #fffffff2, #ffffffc9 46%), #fff4ec;
  --pv-flame: linear-gradient(96deg, #d8303f 0%, #e0763a 52%, #c98a1a 100%);
}
html[data-theme="light"] .parvis::before{ opacity: .55 }
html[data-theme="light"] .parvis-watermark{ -webkit-text-stroke-color: #b9544626 }
html[data-theme="light"] .parvis-call{ box-shadow: inset 0 1px 0 #fff, 0 14px 32px #7b3a2a14 }
html[data-theme="light"] .parvis-call-btn{ color: #fff6f1; box-shadow: 0 12px 26px #b0371f2e, inset 0 1px 0 #ffffff38 }
html[data-theme="light"] .parvis-bridge:hover{ background: #fff; border-color: #cf750b52 }
html[data-theme="light"] .parvis-flame{ box-shadow: 0 0 0 1px #cf750b33, 0 0 22px #e0763a40 }
html[data-theme="light"] .parvis-call-btn--ghost{ color: var(--pv-soft); box-shadow: none }
html[data-theme="light"] .parvis-call-btn--ghost:hover{ color: #2c1618; background: #ffffffa8; box-shadow: 0 12px 26px #7b3a2a14 }

/* ── 8. Mouvement et transparence réduits ───────────────────── */
@media (prefers-reduced-motion: reduce) {
  .parvis-flame i{ animation: none; opacity: .3 }
  .parvis :is(.parvis-call-btn, .parvis-bridge, .parvis-link, .parvis-mail){ transition: none }
  .parvis-call-btn:hover,.parvis-bridge:hover{ translate: none }
  .parvis-link:hover .parvis-link-mark{ translate: none }
}
@media (prefers-reduced-transparency: reduce) {
  .parvis{ --pv-plate: #140c0a; --pv-inset: #1b1210; --pv-chip: #17110e }
  html[data-theme="light"] .parvis{ --pv-plate: #f7e7dc; --pv-inset: #fffaf6; --pv-chip: #fff }
}