/**
 * GATARD Pro Pages v1.12.33
 * CMS 9 — largeur 1800px + refonte complète du bloc Projet.
 *
 * Cette feuille est chargée après tous les anciens styles Événement afin
 * d'annuler proprement les limites 1480px et l'ancien design du projet.
 */

html body.cms-id-9 #gatard-events {
  --gev-page-max: 1800px;
  --gev-page-gutter: 15px;
  --gev-ink: #211b14;
  --gev-soft: #6f6559;
  --gev-gold: #c99749;
  --gev-gold-dark: #a8742d;
  --gev-cream: #fbf7f2;
  --gev-cream-deep: #f2eadf;
  --gev-line: rgba(133,118,80,.18);
}

/* =========================================================
   LARGEUR GLOBALE : 1800px
   ========================================================= */
html body.cms-id-9 #gatard-events .gatard-events__inner,
html body.cms-id-9 #gatard-events .gatard-events__inner.gatard-events__inner--premium {
  width: min(var(--gev-page-max), calc(100% - (var(--gev-page-gutter) * 2))) !important;
  max-width: var(--gev-page-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.cms-id-9 #gatard-events #gatard-events-types,
html body.cms-id-9 #gatard-events .gatard-events-values,
html body.cms-id-9 #gatard-events #gatard-events-project,
html body.cms-id-9 #gatard-events #gatard-events-gallery,
html body.cms-id-9 #gatard-events .gatard-events__quicknav,
html body.cms-id-9 #gatard-events .gatard-events__features--cards {
  width: 100% !important;
  max-width: none !important;
}

/* Les cartes événements suivent désormais réellement la largeur 1800px. */
html body.cms-id-9 #gatard-events #gatard-events-types {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* =========================================================
   PROJECT — nouveau design
   ========================================================= */
html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(520px, .96fr) !important;
  grid-template-areas: "copy image" !important;
  width: 100% !important;
  min-height: 540px !important;
  margin: clamp(70px, 5vw, 96px) 0 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(133,118,80,.18) !important;
  border-radius: 18px !important;
  background: #fffdf9 !important;
  box-shadow:
    0 24px 60px rgba(45,35,23,.09),
    0 1px 0 rgba(255,255,255,.9) inset !important;
}

/* Contenu à gauche : plus éditorial, plus aéré. */
html body.cms-id-9 #gatard-events .gatard-events__project-copy {
  grid-area: copy !important;
  position: relative !important;
  z-index: 2 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(52px, 4.2vw, 78px) clamp(46px, 4.7vw, 86px) !important;
  background:
    radial-gradient(circle at 8% 2%, rgba(216,167,72,.11), transparent 28%),
    linear-gradient(145deg, #fffdf9 0%, #f8f2e9 100%) !important;
  text-align: left !important;
}

/* Petit trait doré vertical, mais très discret. */
html body.cms-id-9 #gatard-events .gatard-events__project-copy::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 3px !important;
  height: 62% !important;
  transform: translateY(-50%) !important;
  border-radius: 0 999px 999px 0 !important;
  background: linear-gradient(180deg, transparent, #d6aa61 18%, #b77f31 82%, transparent) !important;
  opacity: .9 !important;
}

/* Nettoie complètement l'ancien habillage. */
html body.cms-id-9 #gatard-events .gatard-events__project-copy::after {
  display: none !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-kicker {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  min-height: 30px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--gev-gold-dark) !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-kicker::before {
  content: "" !important;
  width: 34px !important;
  height: 1.5px !important;
  margin-right: 12px !important;
  border-radius: 99px !important;
  background: currentColor !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-copy > h2 {
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  margin: 0 !important;
  color: var(--gev-ink) !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: clamp(34px, 2.7vw, 52px) !important;
  font-weight: 700 !important;
  line-height: 1.04 !important;
  letter-spacing: -.045em !important;
  text-align: left !important;
  text-transform: none !important;
  text-wrap: balance !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-copy > p {
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  margin: 18px 0 0 !important;
  color: #6c6256 !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: clamp(13.5px, .86vw, 15.5px) !important;
  font-weight: 400 !important;
  line-height: 1.72 !important;
  text-align: left !important;
}

/* Les trois infos ne sont plus des grosses mini-cards :
   elles deviennent une vraie liste de prestation, plus légère. */
html body.cms-id-9 #gatard-events .gatard-events__project-points {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  margin: clamp(26px, 2.1vw, 34px) 0 0 !important;
  padding: 0 !important;
  border-top: 1px solid var(--gev-line) !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-points > span {
  position: relative !important;
  min-width: 0 !important;
  min-height: 64px !important;
  display: grid !important;
  grid-template-columns: 38px 1fr auto !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 13px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--gev-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #4f473d !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  line-height: 1.38 !important;
  text-align: left !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-points > span img {
  width: 38px !important;
  height: 38px !important;
  padding: 9px !important;
  object-fit: contain !important;
  border: 1px solid rgba(201,151,73,.24) !important;
  border-radius: 10px !important;
  background: #fff9ee !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-points > span::after {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  border: 1px solid rgba(201,151,73,.20) !important;
  border-radius: 999px !important;
  background: rgba(216,167,72,.08) !important;
  color: #ad7d35 !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-points > span:nth-child(1)::after { content: "01" !important; }
html body.cms-id-9 #gatard-events .gatard-events__project-points > span:nth-child(2)::after { content: "02" !important; }
html body.cms-id-9 #gatard-events .gatard-events__project-points > span:nth-child(3)::after { content: "03" !important; }

html body.cms-id-9 #gatard-events .gatard-events__project-copy > .gatard-events__small-btn {
  width: fit-content !important;
  min-width: 0 !important;
  min-height: 52px !important;
  margin: clamp(27px, 2vw, 34px) 0 0 !important;
  padding: 0 24px !important;
  border: 1px solid rgba(184,131,41,.35) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #d8a748 0%, #b88329 100%) !important;
  color: #fffdf8 !important;
  box-shadow: 0 12px 26px rgba(126,88,30,.16) !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project-copy > .gatard-events__small-btn:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.025) !important;
  box-shadow: 0 16px 32px rgba(126,88,30,.22) !important;
}

/* Image à droite : vraie présence visuelle, sans effet "carte dans une carte". */
html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure {
  grid-area: image !important;
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 540px !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #1b1712 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure::before {
  content: "" !important;
  position: absolute !important;
  z-index: 2 !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255,253,249,.14) 0%, transparent 18%),
    linear-gradient(180deg, transparent 55%, rgba(11,8,5,.24) 100%) !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure::after {
  content: "" !important;
  position: absolute !important;
  z-index: 3 !important;
  left: 22px !important;
  bottom: 20px !important;
  width: 86px !important;
  height: 3px !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, #d8a748, rgba(216,167,72,.15)) !important;
  opacity: .9 !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 540px !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.001) !important;
  filter: saturate(.96) contrast(1.02) brightness(.98) !important;
  transition: transform .7s cubic-bezier(.2,.65,.25,1), filter .35s ease !important;
}

html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project:hover > figure img {
  transform: scale(1.025) !important;
  filter: saturate(1) contrast(1.03) brightness(1) !important;
}

/* =========================================================
   TABLETTE
   ========================================================= */
@media (min-width: 768px) and (max-width: 1199.98px) {
  html body.cms-id-9 #gatard-events .gatard-events__inner,
  html body.cms-id-9 #gatard-events .gatard-events__inner.gatard-events__inner--premium {
    width: calc(100% - 30px) !important;
    max-width: none !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "image"
      "copy" !important;
    min-height: 0 !important;
    border-radius: 17px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure,
  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure img {
    min-height: 0 !important;
    height: clamp(330px, 46vw, 430px) !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy {
    align-items: center !important;
    padding: clamp(38px, 5vw, 54px) clamp(30px, 6vw, 66px) clamp(44px, 6vw, 62px) !important;
    text-align: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy::before {
    top: 0 !important;
    left: 50% !important;
    width: 96px !important;
    height: 3px !important;
    transform: translateX(-50%) !important;
    border-radius: 0 0 999px 999px !important;
    background: linear-gradient(90deg, transparent, #d6aa61 20%, #b77f31 80%, transparent) !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-kicker {
    justify-content: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy > h2,
  html body.cms-id-9 #gatard-events .gatard-events__project-copy > p {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-points {
    width: min(100%, 760px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-points > span {
    text-align: left !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy > .gatard-events__small-btn {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 767.98px) {
  html body.cms-id-9 #gatard-events .gatard-events__inner,
  html body.cms-id-9 #gatard-events .gatard-events__inner.gatard-events__inner--premium {
    width: calc(100% - 30px) !important;
    max-width: none !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "image"
      "copy" !important;
    min-height: 0 !important;
    margin-top: 54px !important;
    border-radius: 15px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure,
  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure img {
    min-height: 0 !important;
    height: clamp(230px, 67vw, 310px) !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure::after {
    left: 15px !important;
    bottom: 14px !important;
    width: 62px !important;
    height: 2px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy {
    align-items: center !important;
    padding: 28px 16px 30px !important;
    text-align: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy::before {
    top: 0 !important;
    left: 50% !important;
    width: 78px !important;
    height: 3px !important;
    transform: translateX(-50%) !important;
    border-radius: 0 0 999px 999px !important;
    background: linear-gradient(90deg, transparent, #d6aa61 20%, #b77f31 80%, transparent) !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-kicker {
    min-height: 0 !important;
    margin-bottom: 12px !important;
    font-size: 9px !important;
    letter-spacing: .12em !important;
    text-align: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-kicker::before {
    width: 24px !important;
    margin-right: 9px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy > h2 {
    width: 100% !important;
    max-width: 560px !important;
    font-size: clamp(28px, 8.2vw, 36px) !important;
    line-height: 1.06 !important;
    text-align: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy > p {
    width: 100% !important;
    max-width: 560px !important;
    margin-top: 13px !important;
    font-size: 13px !important;
    line-height: 1.58 !important;
    text-align: center !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-points {
    width: 100% !important;
    margin-top: 20px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-points > span {
    min-height: 58px !important;
    grid-template-columns: 36px minmax(0,1fr) 28px !important;
    gap: 10px !important;
    padding: 11px 0 !important;
    font-size: 11.5px !important;
    text-align: left !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-points > span img {
    width: 36px !important;
    height: 36px !important;
    padding: 8px !important;
    border-radius: 9px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-points > span::after {
    width: 28px !important;
    height: 28px !important;
    font-size: 8px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy > .gatard-events__small-btn {
    width: min(100%, 320px) !important;
    min-height: 49px !important;
    margin: 22px auto 0 !important;
    padding: 0 18px !important;
    font-size: 12.5px !important;
  }
}

@media (max-width: 380px) {
  html body.cms-id-9 #gatard-events .gatard-events__project-copy {
    padding-left: 13px !important;
    padding-right: 13px !important;
  }

  html body.cms-id-9 #gatard-events .gatard-events__project-copy > h2 {
    font-size: 27px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body.cms-id-9 #gatard-events .gatard-events__project.gatard-events-project > figure img,
  html body.cms-id-9 #gatard-events .gatard-events__project-copy > .gatard-events__small-btn {
    transition: none !important;
  }
}