/* ==========================================================================
   CP Peinture (cordinel-peinture.fr) – template enfant de Cassiopeia
   Ce fichier remplace le user.css de Cassiopeia pour ce template.
   Couleurs reprises du logo : rouge CP + bleu marine.
   ========================================================================== */

:root {
  --cp-red: #E3262B;
  --cp-red-dark: #B91D22;
  --cp-navy: #1D2252;
  --cp-navy-soft: #2C3373;
  --cp-text: #23263D;
  --cp-muted: #5A5F78;
  --cp-bg: #F5F6FA;
  --cp-white: #FFFFFF;
  --cp-line: #E2E5EE;
  --cp-radius: 16px;
  --cp-shadow: 0 1px 2px rgba(29, 34, 82, .06), 0 8px 24px rgba(29, 34, 82, .08);
  --cp-max: 72rem;
  --cp-gutter: max(1rem, calc((100% - var(--cp-max)) / 2));
  --cp-font: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --cp-font-title: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Variables de Cassiopeia */
  --cassiopeia-color-primary: var(--cp-navy);
  --cassiopeia-color-link: var(--cp-red-dark);
  --cassiopeia-color-hover: var(--cp-navy);
  --cassiopeia-font-family-body: var(--cp-font);
  --cassiopeia-font-family-headings: var(--cp-font-title);
  --cassiopeia-font-weight-headings: 800;
  --link-color: var(--cp-red-dark);
  --link-color-rgb: 185, 29, 34;
  --link-hover-color: var(--cp-navy);
  --link-hover-color-rgb: 29, 34, 82;
  --body-bg: var(--cp-bg);
  --body-color: var(--cp-text);
}

body {
  background: var(--cp-bg);
  color: var(--cp-text);
  font-family: var(--cp-font);
  font-size: 1.0625rem;
  line-height: 1.65;
}

h1, h2, h3, h4, .h1, .h2, .h3 {
  font-family: var(--cp-font-title);
  font-weight: 800;
  color: var(--cp-navy);
  letter-spacing: -0.015em;
  line-height: 1.2;
}
h1, .h1 { font-size: clamp(2rem, 3vw + 1rem, 3.1rem); }
h2, .h2 { font-size: clamp(1.5rem, 1.5vw + 1rem, 2.1rem); }
h3, .h3 { font-size: 1.3rem; }

/* Couleurs saisies à la main dans l'éditeur : on les neutralise pour garder un
   rendu homogène (le contenu des articles n'a pas besoin d'être modifié). */
.site-grid [style*="color: #3598db"],
.site-grid [style*="color: #34495e"],
.site-grid [style*="color: #000000"],
.footer [style*="color"] {
  color: inherit !important;
}

a { color: var(--cp-red-dark); text-underline-offset: .2em; }
a:hover, a:focus { color: var(--cp-navy); }

:focus-visible {
  outline: 3px solid var(--cp-red);
  outline-offset: 2px;
}

/* ---------- Boutons ---------- */
.cp-btn,
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .8rem 1.4rem;
  border: 2px solid var(--cp-red);
  border-radius: 999px;
  background: var(--cp-red);
  color: #fff;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color .2s, border-color .2s, color .2s, transform .2s;
}
.cp-btn:hover, .cp-btn:focus,
.btn-primary:hover, .btn-primary:focus {
  background: var(--cp-red-dark);
  border-color: var(--cp-red-dark);
  color: #fff;
}
.cp-btn--ghost {
  background: transparent;
  border-color: currentColor;
  color: inherit;
}
.cp-btn--ghost:hover, .cp-btn--ghost:focus {
  background: #fff;
  border-color: #fff;
  color: var(--cp-navy);
}
.cp-btn.cp-ico-phone::before {
  content: "";
  flex: none;
  width: 1.15em;
  height: 1.15em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.cp-btn.cp-ico-phone:hover::before,
.cp-btn.cp-ico-phone:focus::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231D2252' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E"); }

/* ==========================================================================
   En-tête
   ========================================================================== */
.container-header {
  position: sticky;
  top: 0;
  z-index: 1020;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  margin: 0;
  padding: .5rem var(--cp-gutter);
  background: rgba(255, 255, 255, .97);
  background-image: none;
  box-shadow: 0 1px 0 var(--cp-line);
}
@supports (backdrop-filter: blur(8px)) {
  .container-header { background: rgba(255, 255, 255, .88); backdrop-filter: blur(8px); }
}
.container-header > .grid-child {
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
}
.container-header .navbar-brand {
  margin: 0;
  padding: 0;
}
.container-header .brand-logo img {
  display: block;
  width: auto;
  height: 60px;
  max-height: 60px;
}
.container-header .site-description { display: none; }

.container-header .container-nav { flex: 1 1 auto; justify-content: flex-end; padding: 0; }
.container-header .navbar { padding: 0; justify-content: flex-end; }
.container-header .mod-menu {
  display: flex;
  align-items: center;
  gap: .25rem;
  margin: 0;
  padding: 0;
}
.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span {
  display: block;
  padding: .55rem .9rem;
  border-radius: 999px;
  color: var(--cp-navy);
  font-weight: 600;
  text-decoration: none;
  transition: background-color .2s, color .2s;
}
.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li > a:focus {
  background: var(--cp-bg);
  color: var(--cp-red-dark);
}
.container-header .mod-menu > li.active > a,
.container-header .mod-menu > li.current > a {
  color: var(--cp-red-dark);
  box-shadow: inset 0 -3px 0 var(--cp-red);
  border-radius: 0;
}
/* Bouton « Appeler » : élément de menu de type URL (tel:) avec la classe cp-cta */
.container-header .mod-menu > li > a.cp-cta {
  margin-left: .5rem;
  background: var(--cp-red);
  color: #fff;
  box-shadow: none;
  border-radius: 999px;
  padding-inline: 1.15rem;
}
.container-header .mod-menu > li > a.cp-cta:hover,
.container-header .mod-menu > li > a.cp-cta:focus {
  background: var(--cp-red-dark);
  color: #fff;
}

.container-header .navbar-toggler {
  border: 1px solid var(--cp-line);
  border-radius: 10px;
  padding: .45rem .7rem;
  color: var(--cp-navy);
  background: #fff;
}

@media (max-width: 767.98px) {
  .container-header { flex-wrap: wrap; position: relative; }
  .container-header > .grid-child,
  .container-header .container-nav,
  .container-header .navbar { position: static; }
  .container-header .brand-logo img { height: 48px; }
  .container-header .navbar-collapse {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: .5rem 1rem 1rem;
    background: #fff;
    box-shadow: 0 12px 24px rgba(29, 34, 82, .12);
  }
  .container-header .mod-menu { flex-direction: column; align-items: stretch; }
  .container-header .mod-menu > li > a { border-radius: 10px; padding: .8rem 1rem; }
  .container-header .mod-menu > li.active > a,
  .container-header .mod-menu > li.current > a { box-shadow: inset 4px 0 0 var(--cp-red); }
  .container-header .mod-menu > li > a.cp-cta { margin: .5rem 0 0; text-align: center; }
}

/* ==========================================================================
   Mise en page générale
   ========================================================================== */
.site-grid {
  grid-gap: 0 1.5rem;
}
.container-component {
  padding-block: 2rem;
}
.container-component > *:last-child { margin-bottom: 0; }

/* Les pages sont des « Articles en vedette » : on enlève l'aspect liste de blog */
.blog-featured .blog-item,
.blog .blog-item {
  background: transparent;
  box-shadow: none;
  margin-bottom: 0;
}
.blog-featured .item-content > :first-child { margin-top: 0; }

.item-content img,
.com-content-article__body img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

/* Titre de la page (menu › Affichage de la page › Afficher l'en-tête de page = Oui) */
.page-header { margin-bottom: 1.5rem; text-align: center; }
.page-header h1 { margin: 0; }

/* Titres de sections saisis comme « paragraphe en gras » (classe ajoutée par user.js) */
.cp-subtitle {
  margin: 0 0 .75rem;
  font-family: var(--cp-font-title);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1.25;
  color: var(--cp-navy);
}

/* Bloc d'introduction (titre de la page d'accueil, etc.) */
.cp-section-head {
  max-width: 48rem;
  margin: 0 auto 1rem;
  text-align: center;
}
.cp-section-head h2 { margin-bottom: .5rem; }
.cp-section-head p { color: var(--cp-muted); margin: 0; }
.cp-eyebrow {
  display: inline-block;
  margin-bottom: .5rem;
  color: var(--cp-red-dark);
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* ==========================================================================
   Accueil – bandeau (module Personnalisé en position banner)
   ========================================================================== */
.container-banner { margin: 0; }
.cp-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(3.5rem, 8vw, 6.5rem) var(--cp-gutter);
  background: var(--cp-navy);
  color: #fff;
}
.cp-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 !important;
}
.cp-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(100deg, rgba(29, 34, 82, .96) 0%, rgba(29, 34, 82, .88) 45%, rgba(29, 34, 82, .35) 100%);
}
.cp-hero__inner { max-width: 40rem; }
.cp-hero .cp-eyebrow { color: #FF8A8D; }
.cp-hero h1 {
  margin: 0 0 1rem;
  color: #fff;
}
.cp-hero h1 em {
  font-style: normal;
  color: #FF6B6F;
}
.cp-hero__lead {
  margin: 0 0 1.75rem;
  font-size: 1.15rem;
  color: rgba(255, 255, 255, .88);
}
.cp-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}
.cp-hero__facts {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.5rem;
  margin: 2rem 0 0;
  padding: 0;
  list-style: none;
  font-size: .95rem;
  color: rgba(255, 255, 255, .85);
}
.cp-hero__facts li {
  display: flex;
  align-items: center;
  gap: .45rem;
}
.cp-hero__facts li::before {
  content: "";
  flex: none;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background: var(--cp-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M4 8.5l2.5 2.5L12 5.5'/%3E%3C/svg%3E") center / 80% no-repeat;
}

/* ==========================================================================
   Accueil – prestations (modules « carte » en position bottom-a)
   ========================================================================== */
.container-bottom-a {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  padding-bottom: 3rem;
}
.container-bottom-a > .card {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--cp-line);
  border-radius: var(--cp-radius);
  background: #fff;
  box-shadow: var(--cp-shadow);
  transition: transform .25s, box-shadow .25s;
}
.container-bottom-a > .card:hover {
  transform: translateY(-3px);
  box-shadow: 0 2px 4px rgba(29, 34, 82, .06), 0 16px 32px rgba(29, 34, 82, .12);
}
.container-bottom-a .card-header { display: none; }
.container-bottom-a .card-body { padding: 0; }
.container-bottom-a .mod-custom { display: flex; flex-direction: column; height: 100%; }
.container-bottom-a .mod-custom > * { margin-inline: 1.4rem; }
.container-bottom-a .mod-custom > p:first-child {
  margin: 0 0 1.25rem;
}
.container-bottom-a .mod-custom > p:first-child img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 0;
  margin: 0 !important;
}
.container-bottom-a h3 {
  margin-top: 0;
  margin-bottom: .6rem;
  font-size: 1.25rem;
  text-align: left !important;
}
.container-bottom-a p,
.container-bottom-a li {
  text-align: left !important;
  color: var(--cp-muted);
  font-size: 1rem;
}
.container-bottom-a .mod-custom > :last-child { margin-bottom: 1.5rem; }

@media (min-width: 768px) {
  .container-bottom-a { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Première carte (« Votre artisan peintre à votre écoute ») : bloc large de présentation */
.container-bottom-a > .card:first-child {
  grid-column: 1 / -1;
}
@media (min-width: 768px) {
  .container-bottom-a > .card:first-child .mod-custom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    grid-auto-rows: min-content;
    column-gap: 2.5rem;
    align-content: center;
  }
  .container-bottom-a > .card:first-child .mod-custom > p:first-child {
    grid-column: 1;
    grid-row: 1 / span 10;
    margin: 0;
  }
  .container-bottom-a > .card:first-child .mod-custom > p:first-child img {
    height: 100%;
    aspect-ratio: auto;
    min-height: 22rem;
  }
  .container-bottom-a > .card:first-child .mod-custom > :not(:first-child) {
    grid-column: 2;
    margin-left: 0;
    margin-right: 2.5rem;
  }
  .container-bottom-a > .card:first-child h3 {
    margin-top: 2.5rem;
    font-size: clamp(1.5rem, 1.5vw + 1rem, 2rem);
  }
  .container-bottom-a > .card:first-child:hover { transform: none; }
}
.container-bottom-a > .card:first-child ul {
  padding-left: 0;
  list-style: none;
}
.container-bottom-a > .card:first-child li {
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: .6rem;
}
.container-bottom-a > .card:first-child li::before {
  content: "?";
  position: absolute;
  left: 0;
  top: .15rem;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 50%;
  background: var(--cp-red);
  color: #fff;
  font-size: .75rem;
  font-weight: 800;
  line-height: 1.15rem;
  text-align: center;
}
.container-bottom-a > .card:first-child .mod-custom > p:last-child {
  text-align: left !important;
  font-weight: 700;
  color: var(--cp-navy);
  font-size: 1.1rem;
}

/* ==========================================================================
   Galeries (Réalisations, Avant / Après) – structure créée par user.js
   ========================================================================== */
.cp-has-gallery.blog-items,
.cp-has-gallery .blog-items {
  display: block;
}
.cp-has-gallery .blog-item + .blog-item { margin-top: 1.5rem; }
.cp-projects {
  display: grid;
  gap: 1.5rem;
}
.cp-project {
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--cp-line);
  border-radius: var(--cp-radius);
  background: #fff;
  box-shadow: var(--cp-shadow);
}
.cp-project > :last-child { margin-bottom: 0; }
.cp-project > p:empty { display: none; }
.cp-project p:not(.cp-subtitle) { color: var(--cp-muted); margin-bottom: .5rem; }

.cp-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
}
.cp-tags li {
  padding: .3rem .8rem;
  border-radius: 999px;
  background: var(--cp-bg);
  border: 1px solid var(--cp-line);
  color: var(--cp-navy);
  font-size: .9rem;
  font-weight: 600;
  text-align: left !important;
}

.cp-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
  gap: .75rem;
  margin: 0 0 1rem;
}
@media (max-width: 575.98px) {
  .cp-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .cp-gallery img { border-radius: 8px; }
}
.cp-gallery > a,
.cp-gallery > img {
  display: block;
  overflow: hidden;
  border-radius: 12px;
  background: var(--cp-line);
}
.cp-gallery img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 12px;
  margin: 0;
}

/* ---------- Zoom : remplace l'ancien agrandissement au survol ---------- */
img.zoom {
  cursor: zoom-in;
  transition: transform .35s ease, filter .35s ease;
}
img.zoom:hover {
  transform: scale(1.04);
  filter: brightness(1.05);
}
.cp-gallery img.zoom:hover { transform: scale(1.06); }

.cp-lightbox {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgba(10, 12, 30, .94);
  color: #fff;
  overscroll-behavior: contain;
}
.cp-lightbox::backdrop { background: rgba(10, 12, 30, .94); }
.cp-lightbox[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}
.cp-lightbox__figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  margin: 0;
  max-width: calc(100vw - 8rem);
}
.cp-lightbox__img {
  display: block;
  max-width: 100%;
  max-height: calc(100dvh - 7rem);
  width: auto;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
  touch-action: pan-y pinch-zoom;
}
.cp-lightbox__caption {
  font-size: .95rem;
  color: rgba(255, 255, 255, .8);
  text-align: center;
}
.cp-lightbox__btn {
  position: absolute;
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s;
}
.cp-lightbox__btn:hover, .cp-lightbox__btn:focus-visible { background: var(--cp-red); }
.cp-lightbox__btn svg { width: 1.4rem; height: 1.4rem; }
.cp-lightbox__close { top: 1rem; right: 1rem; }
.cp-lightbox__prev { left: 1rem; top: 50%; transform: translateY(-50%); }
.cp-lightbox__next { right: 1rem; top: 50%; transform: translateY(-50%); }
.cp-lightbox__count {
  position: absolute;
  top: 1.6rem;
  left: 1.25rem;
  font-size: .9rem;
  color: rgba(255, 255, 255, .7);
}
@media (max-width: 767.98px) {
  .cp-lightbox__figure { max-width: 100vw; padding: 0 .5rem; }
  .cp-lightbox__prev, .cp-lightbox__next { top: auto; bottom: 1rem; transform: none; }
  .cp-lightbox__img { max-height: calc(100dvh - 10rem); }
}

/* ==========================================================================
   Page Devis / Contact (voir articles/devis-contact.html)
   ========================================================================== */
.cp-contact {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 1.5rem;
  margin-top: 2rem;
}
@media (max-width: 767.98px) {
  .cp-contact { grid-template-columns: 1fr; }
}
.cp-contact__list {
  display: grid;
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cp-contact__item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1.1rem 1.25rem;
  border: 1px solid var(--cp-line);
  border-radius: var(--cp-radius);
  background: #fff;
  box-shadow: var(--cp-shadow);
}
.cp-contact__item::before {
  content: "";
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 12px;
  background: rgba(227, 38, 43, .1) center / 1.4rem no-repeat;
}
.cp-contact__item.cp-ico-phone::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23E3262B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E"); }
.cp-contact__item.cp-ico-mail::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23E3262B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 6h18v12H3zM3 7l9 6 9-6'/%3E%3C/svg%3E"); }
.cp-contact__item.cp-ico-pin::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23E3262B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 21s-7-6.1-7-11.5a7 7 0 0 1 14 0C19 14.9 12 21 12 21zM12 12a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'/%3E%3C/svg%3E"); }
.cp-contact__item strong {
  display: block;
  color: var(--cp-navy);
}
.cp-contact__item p { margin: 0; color: var(--cp-muted); }
.cp-contact__item a { font-weight: 700; font-size: 1.1rem; }

.cp-map {
  position: relative;
  overflow: hidden;
  min-height: 22rem;
  border-radius: var(--cp-radius);
  background: var(--cp-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M0 20h40M20 0v40' stroke='%23ffffff' stroke-opacity='.06'/%3E%3C/svg%3E");
  box-shadow: var(--cp-shadow);
}
.cp-map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.cp-map__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 1.5rem;
  color: #fff;
  text-align: center;
}
.cp-map__placeholder p { margin: 0; color: rgba(255, 255, 255, .85); }
.cp-map__placeholder small { color: rgba(255, 255, 255, .6); }

/* ==========================================================================
   Pied de page
   ========================================================================== */
.container-footer {
  margin-top: 0;
  background: var(--cp-navy);
  background-image: none;
  color: rgba(255, 255, 255, .8);
  font-size: .95rem;
}
.container-footer > .grid-child {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 2rem;
  align-items: start;
  max-width: none;
  padding: 3rem var(--cp-gutter) 2rem;
}
.container-footer p { margin-bottom: .35rem; }
.container-footer strong,
.container-footer b { color: #fff; }
.container-footer .mod-custom > p:first-child strong,
.container-footer .mod-custom > p:first-child b {
  font-size: 1.15rem;
}
.container-footer a { color: #fff; }
.container-footer a:hover, .container-footer a:focus { color: #FF8A8D; }
.container-footer .mod-menu {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.container-footer .mod-menu a { text-decoration: none; }

/* Bouton « retour en haut » */
.back-to-top-link {
  background: var(--cp-red);
  border-radius: 50%;
  width: 2.75rem;
  height: 2.75rem;
  display: grid;
  place-items: center;
  padding: 0;
}
.back-to-top-link:hover, .back-to-top-link:focus { background: var(--cp-red-dark); }

/* ==========================================================================
   Bandeau cookies (plugin Cookiehint) aux couleurs du site
   ========================================================================== */
#redim-cookiehint .redim-cc-btn.redim-cc-accept-all,
#redim-cookiehint .redim-cc-btn.redim-cc-reject {
  background: var(--cp-navy) !important;
  border-color: var(--cp-navy) !important;
  color: #fff !important;
  border-radius: 999px !important;
}
#redim-cookiehint .redim-cc-btn.redim-cc-toggle-details { border-radius: 999px !important; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
  img.zoom:hover, .container-bottom-a > .card:hover { transform: none; }
}