body.elementor-page-1746 h1.entry-title{margin-top:1px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-b5180a8 *//* =========================================================
   HERO — PAGE LE PARCOURS
========================================================= */

.parcours-hero {
  --parcours-green: #204736;
  --parcours-green-dark: #0c271c;
  --parcours-gold: #d8b66f;
  --parcours-white: #ffffff;

  position: relative;

  display: flex;
  align-items: flex-end;

  width: 100%;
  min-height: clamp(650px, 79vh, 830px);
  padding: 135px 48px 76px;

  overflow: hidden;
  isolation: isolate;

  background: var(--parcours-green-dark);
}

.parcours-hero,
.parcours-hero *,
.parcours-hero *::before,
.parcours-hero *::after {
  box-sizing: border-box;
}

/* =========================================================
   PHOTO EN ARRIÈRE-PLAN
========================================================= */

.parcours-hero__media {
  position: absolute;
  inset: 0;
  z-index: -3;

  width: 100%;
  height: 100%;

  background-image:
    url("https://golfsaintroman.fr/wp-content/uploads/2026/07/PHOTOHERO-scaled.png");

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 43%;

  filter:
    saturate(0.97)
    contrast(1.02)
    brightness(1.01);

  transform: scale(1.025);

  animation:
    parcours-hero-zoom 14s
    cubic-bezier(0.22, 0.61, 0.36, 1)
    forwards;
}

/* =========================================================
   VOILE PREMIUM PLUS LÉGER
========================================================= */

.parcours-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: -2;

  background:
    linear-gradient(
      90deg,
      rgba(5, 24, 16, 0.58) 0%,
      rgba(5, 24, 16, 0.37) 35%,
      rgba(5, 24, 16, 0.11) 72%,
      rgba(5, 24, 16, 0.04) 100%
    ),
    linear-gradient(
      180deg,
      rgba(4, 17, 11, 0.08) 0%,
      rgba(4, 17, 11, 0.02) 43%,
      rgba(4, 17, 11, 0.35) 100%
    );
}

/* Vignettage très discret */

.parcours-hero::before {
  content: "";

  position: absolute;
  inset: 0;
  z-index: -1;

  background:
    radial-gradient(
      circle at 68% 35%,
      transparent 0%,
      transparent 47%,
      rgba(3, 15, 9, 0.05) 78%,
      rgba(3, 15, 9, 0.13) 100%
    );

  pointer-events: none;
}

/* Cadre intérieur */

.parcours-hero::after {
  content: "";

  position: absolute;
  inset: 21px;
  z-index: 1;

  border: 1px solid rgba(255, 255, 255, 0.18);

  pointer-events: none;
}

/* =========================================================
   CONTENU
========================================================= */

.parcours-hero__container {
  position: relative;
  z-index: 2;

  width: min(1280px, 100%);
  margin: 0 auto;
}

.parcours-hero__content {
  width: min(690px, 100%);
}

/* =========================================================
   SURTITRE
========================================================= */

.parcours-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;

  margin-bottom: 18px;

  color: var(--parcours-gold);

  font-family: "Manrope", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.23em;
  text-transform: uppercase;
}

.parcours-hero__eyebrow::before {
  content: "";

  width: 42px;
  height: 1px;

  flex: 0 0 42px;

  background: var(--parcours-gold);
}

/* =========================================================
   TITRE
========================================================= */

.parcours-hero__title {
  margin: 0;

  color: var(--parcours-white);

  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(76px, 7.5vw, 116px);
  font-weight: 500;
  line-height: 0.88;
  letter-spacing: -0.052em;

  text-shadow:
    0 5px 28px rgba(0, 0, 0, 0.3);
}

/* =========================================================
   DESCRIPTION
========================================================= */

.parcours-hero__description {
  width: min(600px, 100%);
  margin: 25px 0 0;

  color: rgba(255, 255, 255, 0.91);

  font-family: "Manrope", Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.68;

  text-shadow:
    0 2px 15px rgba(0, 0, 0, 0.34);
}

/* =========================================================
   BOUTONS
========================================================= */

.parcours-hero__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 11px;

  margin-top: 31px;
}

.parcours-hero__button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;

  min-width: 220px;
  min-height: 54px;
  padding: 7px 8px 7px 21px;

  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 999px;

  font-family: "Manrope", Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  transition:
    color 0.3s ease,
    background-color 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}

.parcours-hero__button--primary {
  color: var(--parcours-green);
  background: rgba(255, 255, 255, 0.97);
}

.parcours-hero__button--secondary {
  color: var(--parcours-white);
  background: rgba(10, 41, 29, 0.28);
}

.parcours-hero__button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 36px;
  height: 36px;

  flex: 0 0 36px;

  border-radius: 50%;

  font-family: Arial, sans-serif;
  font-size: 15px;
  line-height: 1;

  transition:
    color 0.3s ease,
    background-color 0.3s ease,
    transform 0.3s ease;
}

.parcours-hero__button--primary
.parcours-hero__button-icon {
  color: var(--parcours-white);
  background: var(--parcours-green);
}

.parcours-hero__button--secondary
.parcours-hero__button-icon {
  color: var(--parcours-green);
  background: var(--parcours-white);
}

.parcours-hero__button:hover {
  transform: translateY(-2px);
}

.parcours-hero__button:hover
.parcours-hero__button-icon {
  transform: translateX(3px);
}

.parcours-hero__button--primary:hover {
  color: var(--parcours-white);
  border-color: var(--parcours-green);
  background: var(--parcours-green);
}

.parcours-hero__button--primary:hover
.parcours-hero__button-icon {
  color: var(--parcours-green);
  background: var(--parcours-white);
}

.parcours-hero__button--secondary:hover {
  color: var(--parcours-green);
  background: var(--parcours-white);
}

/* =========================================================
   INDICATEUR DE DÉFILEMENT
========================================================= */

.parcours-hero__scroll {
  position: absolute;
  right: 47px;
  bottom: 60px;
  z-index: 3;

  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;

  color: rgba(255, 255, 255, 0.75);

  text-decoration: none;
}

.parcours-hero__scroll-label {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;

  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.parcours-hero__scroll-line {
  position: relative;

  width: 1px;
  height: 47px;

  overflow: hidden;

  background: rgba(255, 255, 255, 0.25);
}

.parcours-hero__scroll-line::after {
  content: "";

  position: absolute;
  top: -60%;
  left: 0;

  width: 100%;
  height: 55%;

  background: var(--parcours-gold);

  animation: parcours-scroll-line 2.2s ease-in-out infinite;
}

/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes parcours-hero-zoom {

  from {
    transform: scale(1.035);
  }

  to {
    transform: scale(1);
  }

}

@keyframes parcours-scroll-line {

  0% {
    top: -60%;
  }

  55%,
  100% {
    top: 100%;
  }

}

/* =========================================================
   TABLETTE
========================================================= */

@media (max-width: 1024px) {

  .parcours-hero {
    min-height: 710px;
    padding: 125px 36px 72px;
  }

  .parcours-hero__media {
    background-position: 57% 44%;
  }

  .parcours-hero__content {
    width: min(620px, 100%);
  }

  .parcours-hero__title {
    font-size: clamp(70px, 10vw, 96px);
  }

}

/* =========================================================
   MOBILE — RECONCEPTION COMPLÈTE
========================================================= */

@media (max-width: 767px) {

  .parcours-hero {
    align-items: flex-end;

    min-height: clamp(570px, 145vw, 650px);
    padding: 92px 19px 31px;

    background: var(--parcours-green-dark);
  }

  .parcours-hero__media {
    background-position: 57% center;

    filter:
      saturate(0.98)
      contrast(1.02)
      brightness(1);
  }

  .parcours-hero__overlay {
    background:
      linear-gradient(
        180deg,
        rgba(5, 20, 13, 0.08) 0%,
        rgba(5, 20, 13, 0.07) 24%,
        rgba(5, 20, 13, 0.24) 49%,
        rgba(5, 20, 13, 0.64) 73%,
        rgba(5, 20, 13, 0.86) 100%
      ),
      linear-gradient(
        90deg,
        rgba(5, 20, 13, 0.18) 0%,
        rgba(5, 20, 13, 0.03) 70%,
        rgba(5, 20, 13, 0.08) 100%
      );
  }

  .parcours-hero::before {
    background:
      radial-gradient(
        circle at 58% 30%,
        transparent 0%,
        transparent 48%,
        rgba(3, 15, 9, 0.05) 79%,
        rgba(3, 15, 9, 0.13) 100%
      );
  }

  .parcours-hero::after {
    inset: 9px;

    border-color: rgba(255, 255, 255, 0.17);
  }

  .parcours-hero__container {
    width: 100%;
  }

  .parcours-hero__content {
    width: 100%;
    max-width: 470px;
  }

  .parcours-hero__eyebrow {
    gap: 9px;

    margin-bottom: 12px;

    font-size: 7.5px;
    letter-spacing: 0.17em;
  }

  .parcours-hero__eyebrow::before {
    width: 27px;

    flex-basis: 27px;
  }

  .parcours-hero__title {
    font-size: clamp(50px, 14.5vw, 62px);
    line-height: 0.91;
    letter-spacing: -0.045em;
  }

  .parcours-hero__description {
    max-width: 390px;
    margin-top: 17px;

    font-size: 12.5px;
    line-height: 1.55;
  }

  .parcours-hero__actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;

    width: 100%;
    margin-top: 22px;
  }

  .parcours-hero__button {
    width: 100%;
    min-width: 0;
    min-height: 49px;
    padding: 6px 7px 6px 17px;

    font-size: 10.5px;
  }

  .parcours-hero__button-icon {
    width: 35px;
    height: 35px;

    flex-basis: 35px;
  }

  .parcours-hero__scroll {
    display: none;
  }

}

/* =========================================================
   MOBILES ÉTROITS
========================================================= */

@media (max-width: 390px) {

  .parcours-hero {
    min-height: 585px;
    padding-right: 15px;
    padding-bottom: 27px;
    padding-left: 15px;
  }

  .parcours-hero__media {
    background-position: 59% center;
  }

  .parcours-hero__title {
    font-size: 50px;
  }

  .parcours-hero__description {
    max-width: 330px;

    font-size: 12px;
  }

  .parcours-hero__button {
    min-height: 48px;
  }

}

/* =========================================================
   TRÈS PETITS MOBILES
========================================================= */

@media (max-width: 350px) {

  .parcours-hero {
    min-height: 570px;
  }

  .parcours-hero__eyebrow {
    font-size: 7px;
  }

  .parcours-hero__title {
    font-size: 45px;
  }

  .parcours-hero__description {
    font-size: 11.5px;
  }

}

/* =========================================================
   ACCESSIBILITÉ
========================================================= */

.parcours-hero__button:focus-visible,
.parcours-hero__scroll:focus-visible {
  outline: 2px solid var(--parcours-gold);
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {

  .parcours-hero__media,
  .parcours-hero__scroll-line::after,
  .parcours-hero__button,
  .parcours-hero__button-icon {
    animation: none !important;
    transition: none !important;
  }

  .parcours-hero__media {
    transform: none !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ade0042 *//* =========================================================
   SECTION 2 — PRÉSENTATION DU PARCOURS
========================================================= */

.course-presentation {
  --course-green: #204736;
  --course-green-dark: #0d2b1f;
  --course-green-soft: #547463;
  --course-gold: #d6b370;
  --course-cream: #f8f6f0;
  --course-white: #ffffff;
  --course-text: #30483d;
  --course-border: rgba(32, 71, 54, 0.14);

  position: relative;

  width: 100%;
  padding:
    clamp(90px, 8vw, 132px)
    46px
    clamp(78px, 7vw, 112px);

  overflow: hidden;

  background: var(--course-cream);
}

.course-presentation,
.course-presentation *,
.course-presentation *::before,
.course-presentation *::after {
  box-sizing: border-box;
}

/* Halo décoratif */

.course-presentation::before {
  content: "";

  position: absolute;
  top: -180px;
  right: -160px;

  width: 520px;
  height: 520px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(214, 179, 112, 0.12) 0%,
      rgba(214, 179, 112, 0) 70%
    );

  pointer-events: none;
}

/* =========================================================
   CONTENEUR
========================================================= */

.course-presentation__container {
  position: relative;
  z-index: 1;

  width: min(1280px, 100%);
  margin: 0 auto;
}

/* =========================================================
   GRILLE PRINCIPALE
========================================================= */

.course-presentation__grid {
  display: grid;
  grid-template-columns:
    minmax(0, 0.82fr)
    minmax(520px, 1.18fr);

  align-items: center;

  gap: clamp(55px, 7vw, 105px);
}

/* =========================================================
   CONTENU
========================================================= */

.course-presentation__content {
  width: 100%;
  max-width: 520px;
}

/* =========================================================
   SURTITRE
========================================================= */

.course-presentation__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 13px;

  margin-bottom: 23px;

  color: #b68d48;

  font-family: "Manrope", Arial, sans-serif;
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.23em;
  text-transform: uppercase;
}

.course-presentation__eyebrow::before {
  content: "";

  width: 37px;
  height: 1px;

  flex: 0 0 37px;

  background: var(--course-gold);
}

/* =========================================================
   TITRE
========================================================= */

.course-presentation__title {
  max-width: 530px;
  margin: 0;

  color: var(--course-green-dark);

  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(50px, 4.3vw, 69px);
  font-weight: 500;
  line-height: 0.99;
  letter-spacing: -0.047em;

  text-wrap: balance;
}

.course-presentation__title em {
  display: block;

  margin-top: 4px;

  color: var(--course-green);
  font-weight: 400;
}

/* =========================================================
   SÉPARATEUR
========================================================= */

.course-presentation__divider {
  width: 48px;
  height: 1px;
  margin-top: 27px;

  background: var(--course-gold);
}

/* =========================================================
   TEXTE
========================================================= */

.course-presentation__text {
  max-width: 500px;
  margin-top: 25px;
}

.course-presentation__text p {
  margin: 0;

  color: rgba(48, 72, 61, 0.8);

  font-family: "Manrope", Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.75;
}

.course-presentation__text p + p {
  margin-top: 17px;
}

/* =========================================================
   LIEN D’ACTION
========================================================= */

.course-presentation__cta {
  display: inline-flex;
  align-items: center;
  gap: 22px;

  margin-top: 31px;
  padding-bottom: 9px;

  border-bottom: 1px solid var(--course-gold);

  color: var(--course-green);

  font-family: "Manrope", Arial, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;

  transition:
    color 0.3s ease,
    border-color 0.3s ease;
}

.course-presentation__cta-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 38px;
  height: 38px;

  flex: 0 0 38px;

  margin-bottom: -20px;

  border-radius: 50%;

  color: var(--course-white);
  background: var(--course-green);

  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 1;

  box-shadow:
    0 10px 24px rgba(32, 71, 54, 0.2);

  transition:
    color 0.3s ease,
    background-color 0.3s ease,
    transform 0.3s ease;
}

.course-presentation__cta:hover {
  color: var(--course-green-soft);
  border-color: var(--course-green);
}

.course-presentation__cta:hover
.course-presentation__cta-icon {
  color: var(--course-green);
  background: var(--course-gold);

  transform: translateY(4px);
}

/* =========================================================
   PHOTO
========================================================= */

.course-presentation__visual {
  min-width: 0;
  margin: 0;
}

.course-presentation__image-box {
  position: relative;
  isolation: isolate;

  width: 100%;
  aspect-ratio: 1.56 / 1;

  overflow: hidden;

  border-radius: 14px;

  /*
   * La photo est utilisée comme background.
   * Cela évite les problèmes Elementor sur la balise img
   * ainsi que la zone transparente située en bas du PNG.
   */
  background-color: var(--course-green-dark);

  background-image:
    url("https://golfsaintroman.fr/wp-content/uploads/2026/07/c69846cc-afc3-4870-b6f3-22e91162e1bf.png");

  background-repeat: no-repeat;

  /*
   * Le zoom permet de faire sortir la zone transparente
   * du cadre visible.
   */
  background-size: 128% auto;
  background-position: center top;

  box-shadow:
    0 28px 64px rgba(15, 47, 33, 0.16),
    0 8px 20px rgba(15, 47, 33, 0.08);

  transition:
    background-size 7s
    cubic-bezier(0.22, 0.61, 0.36, 1);
}

/*
 * On masque la balise img du HTML.
 * Elle reste présente pour conserver le texte alternatif.
 */

.course-presentation__image {
  position: absolute !important;

  width: 1px !important;
  height: 1px !important;

  margin: -1px !important;
  padding: 0 !important;

  overflow: hidden !important;

  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;

  white-space: nowrap !important;

  border: 0 !important;

  opacity: 0 !important;
  pointer-events: none !important;
}

/* =========================================================
   FILTRE PHOTO
========================================================= */

.course-presentation__image-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;

  background:
    linear-gradient(
      90deg,
      rgba(5, 24, 16, 0.13) 0%,
      rgba(5, 24, 16, 0.04) 45%,
      rgba(5, 24, 16, 0) 100%
    ),
    linear-gradient(
      180deg,
      rgba(4, 17, 11, 0.02) 0%,
      rgba(4, 17, 11, 0.01) 70%,
      rgba(4, 17, 11, 0.1) 100%
    );

  pointer-events: none;
}

/* =========================================================
   CADRE INTÉRIEUR DE LA PHOTO
========================================================= */

.course-presentation__image-border {
  position: absolute;
  inset: 10px;
  z-index: 2;

  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 9px;

  pointer-events: none;
}

/* Zoom discret */

.course-presentation__image-box:hover {
  background-size: 132% auto;
}

/* =========================================================
   STATISTIQUES
========================================================= */

.course-presentation__stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));

  margin-top: clamp(70px, 6.5vw, 95px);

  border-top: 1px solid var(--course-border);
  border-bottom: 1px solid var(--course-border);
}

.course-presentation__stat {
  position: relative;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  min-width: 0;
  min-height: 154px;
  padding: 23px 13px;

  text-align: center;
}

.course-presentation__stat:not(:last-child)::after {
  content: "";

  position: absolute;
  top: 27px;
  right: 0;
  bottom: 27px;

  width: 1px;

  background: var(--course-border);
}

.course-presentation__stat-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 39px;
  height: 39px;

  margin-bottom: 13px;

  border-radius: 50%;

  color: var(--course-gold);
  background: var(--course-green);

  font-family: Georgia, serif;
  font-size: 17px;
  line-height: 1;

  box-shadow:
    0 8px 20px rgba(32, 71, 54, 0.14);
}

.course-presentation__stat-value {
  color: var(--course-green);

  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(40px, 3.5vw, 51px);
  font-weight: 500;
  line-height: 0.83;
  letter-spacing: -0.045em;
  white-space: nowrap;
}

.course-presentation__stat-value small {
  font-size: 0.55em;
  letter-spacing: 0;
}

.course-presentation__stat-label {
  margin-top: 14px;

  color: #b68d48;

  font-family: "Manrope", Arial, sans-serif;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}

/* =========================================================
   TABLETTE
========================================================= */

@media (max-width: 1050px) {

  .course-presentation {
    padding-right: 34px;
    padding-left: 34px;
  }

  .course-presentation__grid {
    grid-template-columns:
      minmax(0, 0.88fr)
      minmax(450px, 1.12fr);

    gap: 52px;
  }

  .course-presentation__title {
    font-size: clamp(47px, 5.5vw, 61px);
  }

  .course-presentation__image-box {
    background-size: 132% auto;
    background-position: center top;
  }

  .course-presentation__image-box:hover {
    background-size: 135% auto;
  }

}

/* =========================================================
   TABLETTE PORTRAIT
========================================================= */

@media (max-width: 860px) {

  .course-presentation__grid {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .course-presentation__content {
    max-width: 650px;
  }

  .course-presentation__text {
    max-width: 620px;
  }

  .course-presentation__visual {
    width: min(700px, 100%);
    margin-left: auto;
  }

  .course-presentation__image-box {
    aspect-ratio: 1.45 / 1;

    background-size: 130% auto;
    background-position: center top;
  }

  .course-presentation__image-box:hover {
    background-size: 133% auto;
  }

  .course-presentation__stats {
    grid-template-columns: repeat(3, 1fr);
  }

  .course-presentation__stat:nth-child(3)::after {
    display: none;
  }

  .course-presentation__stat:nth-child(n + 4) {
    border-top: 1px solid var(--course-border);
  }

}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

  .course-presentation {
    padding:
      68px
      16px
      64px;
  }

  .course-presentation::before {
    top: -110px;
    right: -210px;

    width: 420px;
    height: 420px;
  }

  .course-presentation__grid {
    display: flex;
    flex-direction: column;
    gap: 35px;
  }

  .course-presentation__content {
    width: 100%;
    max-width: none;
  }

  /* Surtitre */

  .course-presentation__eyebrow {
    gap: 9px;

    margin-bottom: 16px;

    font-size: 7.5px;
    letter-spacing: 0.18em;
  }

  .course-presentation__eyebrow::before {
    width: 27px;

    flex-basis: 27px;
  }

  /* Titre */

  .course-presentation__title {
    max-width: 500px;

    font-size: clamp(40px, 11.5vw, 51px);
    line-height: 1;
    letter-spacing: -0.042em;
  }

  .course-presentation__title em {
    margin-top: 2px;
  }

  .course-presentation__divider {
    width: 34px;
    margin-top: 21px;
  }

  /* Texte */

  .course-presentation__text {
    max-width: none;
    margin-top: 20px;
  }

  .course-presentation__text p {
    font-size: 12.5px;
    line-height: 1.65;
  }

  .course-presentation__text p + p {
    margin-top: 13px;
  }

  /* CTA */

  .course-presentation__cta {
    gap: 17px;

    margin-top: 25px;

    font-size: 10px;
  }

  .course-presentation__cta-icon {
    width: 35px;
    height: 35px;

    flex-basis: 35px;

    margin-bottom: -18px;
  }

  /* Photo mobile */

  .course-presentation__visual {
    width: 100%;
    margin: 0;
  }

  .course-presentation__image-box {
    width: 100%;
    aspect-ratio: 4 / 3;

    border-radius: 12px;

    /*
     * Sur mobile, le cadrage vertical est plus adapté.
     * La photo remplit complètement le cadre.
     */
    background-size: auto 138%;
    background-position: center top;

    box-shadow:
      0 20px 44px rgba(15, 47, 33, 0.14),
      0 7px 17px rgba(15, 47, 33, 0.07);
  }

  .course-presentation__image-box:hover {
    background-size: auto 138%;
  }

  .course-presentation__image-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(4, 17, 11, 0.01) 0%,
        rgba(4, 17, 11, 0.01) 74%,
        rgba(4, 17, 11, 0.1) 100%
      );
  }

  .course-presentation__image-border {
    inset: 7px;

    border-radius: 8px;
  }

  /* Statistiques */

  .course-presentation__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;

    margin-top: 42px;

    border: 0;
  }

  .course-presentation__stat {
    min-height: 126px;
    padding: 17px 8px;

    border: 1px solid rgba(32, 71, 54, 0.11);
    border-radius: 15px;

    background: rgba(255, 255, 255, 0.55);
  }

  .course-presentation__stat::after {
    display: none !important;
  }

  .course-presentation__stat:nth-child(n + 4) {
    border-top: 1px solid rgba(32, 71, 54, 0.11);
  }

  .course-presentation__stat:last-child {
    grid-column: 1 / -1;

    min-height: 112px;
  }

  .course-presentation__stat-icon {
    width: 34px;
    height: 34px;

    margin-bottom: 11px;

    font-size: 15px;
  }

  .course-presentation__stat-value {
    font-size: 40px;
  }

  .course-presentation__stat-label {
    margin-top: 11px;

    font-size: 7px;
    letter-spacing: 0.14em;
  }

}

/* =========================================================
   PETITS MOBILES
========================================================= */

@media (max-width: 390px) {

  .course-presentation {
    padding-right: 14px;
    padding-left: 14px;
  }

  .course-presentation__title {
    font-size: 40px;
  }

  .course-presentation__text p {
    font-size: 12px;
  }

  .course-presentation__image-box {
    aspect-ratio: 1.28 / 1;

    background-size: auto 142%;
    background-position: center top;
  }

  .course-presentation__image-box:hover {
    background-size: auto 142%;
  }

  .course-presentation__stat {
    min-height: 120px;
  }

  .course-presentation__stat-value {
    font-size: 37px;
  }

}

/* =========================================================
   TRÈS PETITS MOBILES
========================================================= */

@media (max-width: 350px) {

  .course-presentation {
    padding-right: 12px;
    padding-left: 12px;
  }

  .course-presentation__title {
    font-size: 37px;
  }

  .course-presentation__text p {
    font-size: 11.5px;
  }

  .course-presentation__image-box {
    aspect-ratio: 1.2 / 1;

    background-size: auto 146%;
  }

  .course-presentation__image-box:hover {
    background-size: auto 146%;
  }

}

/* =========================================================
   ACCESSIBILITÉ
========================================================= */

.course-presentation__cta:focus-visible {
  outline: 2px solid var(--course-gold);
  outline-offset: 6px;

  border-radius: 3px;
}

/* =========================================================
   MOUVEMENTS RÉDUITS
========================================================= */

@media (prefers-reduced-motion: reduce) {

  .course-presentation__image-box,
  .course-presentation__cta,
  .course-presentation__cta-icon {
    transition: none !important;
  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c0d3d0d *//*==========================================================
=              PLAN INTERACTIF DU PARCOURS                 =
==========================================================*/

.sr-course-map,
.sr-course-map *{
    box-sizing:border-box;
}

.sr-course-map{
    --sr-green:#123f31;
    --sr-green-dark:#0b3025;
    --sr-green-soft:#1d5944;
    --sr-gold:#d5aa54;
    --sr-gold-light:#e7ca8a;
    --sr-cream:#f7f4ec;
    --sr-cream-dark:#eee9de;
    --sr-text:#68776f;
    --sr-border:rgba(18,63,49,.15);

    position:relative;
    width:100%;
    overflow:hidden;

    padding:110px 30px;

    background:
        radial-gradient(
            circle at 85% 13%,
            rgba(213,170,84,.12),
            transparent 23%
        ),
        linear-gradient(
            135deg,
            #faf8f2 0%,
            #f5f1e7 100%
        );

    color:var(--sr-green);
}

.sr-course-map::before{
    content:"";
    position:absolute;
    top:0;
    left:50%;
    width:min(1120px,calc(100% - 60px));
    height:1px;
    transform:translateX(-50%);
    background:var(--sr-border);
}

.sr-course-map__container{
    position:relative;
    z-index:1;

    width:min(1120px,100%);
    margin:0 auto;
}


/*==========================================================
=                         HEADER                           =
==========================================================*/

.sr-course-map__header{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
    gap:70px;
    align-items:end;

    margin-bottom:60px;
}

.sr-course-map__eyebrow{
    display:flex;
    align-items:center;
    gap:14px;

    margin-bottom:18px;

    color:var(--sr-gold);
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    letter-spacing:.24em;
    text-transform:uppercase;
}

.sr-course-map__eyebrow span{
    width:36px;
    height:1px;
    background:var(--sr-gold);
}

.sr-course-map__heading h2{
    max-width:650px;
    margin:0;

    color:var(--sr-green);
    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:clamp(50px,5.3vw,78px);
    font-weight:500;
    line-height:.87;
    letter-spacing:-.04em;
}

.sr-course-map__heading h2 em{
    display:block;
    margin-top:11px;

    color:var(--sr-gold);
    font-weight:400;
}

.sr-course-map__introduction{
    max-width:410px;
    padding-bottom:4px;
}

.sr-course-map__introduction p{
    margin:0 0 25px;

    color:var(--sr-text);
    font-size:16px;
    font-weight:400;
    line-height:1.75;
}

.sr-course-map__instruction{
    display:flex;
    align-items:center;
    gap:12px;

    color:var(--sr-green);
    font-size:13px;
    font-weight:600;
}

.sr-course-map__instruction-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:28px;
    height:28px;

    border:1px solid rgba(18,63,49,.25);
    border-radius:50%;

    font-family:Arial,sans-serif;
    font-size:18px;
    font-weight:300;
}


/*==========================================================
=                     LAYOUT PRINCIPAL                     =
==========================================================*/

.sr-course-map__layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 315px;
    gap:0;

    overflow:visible;

    border:1px solid var(--sr-border);
    border-radius:28px;

    background:rgba(255,255,255,.53);

    box-shadow:
        0 35px 80px rgba(25,44,35,.09),
        inset 0 1px 0 rgba(255,255,255,.75);
}


/*==========================================================
=                        CARTE                             =
==========================================================*/

.sr-course-map__visual{
    min-width:0;
    padding:36px;

    border-right:1px solid var(--sr-border);
}

.sr-course-map__image-wrapper{
    position:relative;
    width:100%;
    overflow:visible;

    border-radius:20px;

    background:#f3eddd;
}

.sr-course-map__image{
    display:block;
    width:100%;
    height:auto;

    border-radius:20px;

    filter:saturate(.96) contrast(1.01);

    box-shadow:
        0 24px 55px rgba(14,48,37,.15),
        0 0 0 1px rgba(18,63,49,.08);
}


/*==========================================================
=                     POINTS INTERACTIFS                   =
==========================================================*/

.sr-course-map__marker{
    position:absolute;
    z-index:4;
    top:var(--y);
    left:var(--x);

    transform:translate(-50%,-50%);
}

button.sr-course-map__marker{
    appearance:none;
    -webkit-appearance:none;

    margin:0;
    padding:0;

    border:0;
    outline:0;

    background:transparent;
    cursor:pointer;
}

.sr-course-map__marker-number,
.sr-course-map__place-letter{
    position:relative;
    z-index:2;

    display:flex;
    align-items:center;
    justify-content:center;

    width:37px;
    height:37px;

    border:2px solid rgba(255,255,255,.92);
    border-radius:50%;

    background:var(--sr-green);

    color:#fff;
    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:20px;
    font-weight:600;
    line-height:1;

    box-shadow:
        0 8px 22px rgba(5,38,27,.28),
        0 0 0 4px rgba(18,63,49,.13);

    transition:
        transform .3s ease,
        background-color .3s ease,
        box-shadow .3s ease;
}

.sr-course-map__marker--hole::before{
    content:"";
    position:absolute;
    z-index:0;
    top:50%;
    left:50%;

    width:48px;
    height:48px;

    transform:translate(-50%,-50%);

    border:1px solid rgba(255,255,255,.75);
    border-radius:50%;

    animation:srCourseMapPulse 2.6s infinite;
}

.sr-course-map__marker--hole:hover .sr-course-map__marker-number,
.sr-course-map__marker--hole:focus-visible .sr-course-map__marker-number,
.sr-course-map__marker--hole.is-selected .sr-course-map__marker-number{
    transform:scale(1.12);
    background:var(--sr-gold);

    box-shadow:
        0 10px 28px rgba(52,42,20,.28),
        0 0 0 6px rgba(213,170,84,.18);
}

.sr-course-map__marker--hole:focus-visible{
    outline:2px solid var(--sr-gold);
    outline-offset:5px;
    border-radius:50%;
}

@keyframes srCourseMapPulse{

    0%{
        opacity:.8;
        transform:translate(-50%,-50%) scale(.75);
    }

    70%{
        opacity:0;
        transform:translate(-50%,-50%) scale(1.35);
    }

    100%{
        opacity:0;
        transform:translate(-50%,-50%) scale(1.35);
    }

}


/*==========================================================
=                 POINTS SERVICES ET LIEUX                 =
==========================================================*/

.sr-course-map__place-letter{
    width:31px;
    height:31px;

    border-width:1px;

    background:var(--sr-gold);

    font-family:Arial,sans-serif;
    font-size:13px;
    font-weight:700;
}

.sr-course-map__facility-dot{
    display:block;

    width:17px;
    height:17px;

    border:3px solid #fff;
    border-radius:50%;

    background:var(--sr-gold);

    box-shadow:
        0 5px 15px rgba(14,48,37,.25),
        0 0 0 3px rgba(213,170,84,.22);
}


/*==========================================================
=                        INFOBULLES                        =
==========================================================*/

.sr-course-map__tooltip{
    position:absolute;
    z-index:20;
    left:50%;
    bottom:calc(100% + 14px);

    display:flex;
    flex-direction:column;

    width:max-content;
    min-width:130px;
    max-width:190px;

    padding:13px 16px;

    transform:
        translateX(-50%)
        translateY(8px);

    visibility:hidden;
    opacity:0;

    border:1px solid rgba(255,255,255,.15);
    border-radius:12px;

    background:rgba(11,48,37,.96);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    color:#fff;
    text-align:left;
    pointer-events:none;

    box-shadow:0 15px 35px rgba(5,35,26,.25);

    transition:
        opacity .25s ease,
        visibility .25s ease,
        transform .25s ease;
}

.sr-course-map__tooltip::after{
    content:"";
    position:absolute;
    top:100%;
    left:50%;

    width:10px;
    height:10px;

    transform:
        translate(-50%,-50%)
        rotate(45deg);

    background:rgba(11,48,37,.96);
}

.sr-course-map__marker:hover .sr-course-map__tooltip,
.sr-course-map__marker:focus-visible .sr-course-map__tooltip{
    visibility:visible;
    opacity:1;

    transform:
        translateX(-50%)
        translateY(0);
}

.sr-course-map__tooltip-label{
    margin-bottom:3px;

    color:var(--sr-gold-light);
    font-size:9px;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.sr-course-map__tooltip strong{
    color:#fff;
    font-size:14px;
    font-weight:600;
    line-height:1.3;
}

.sr-course-map__tooltip small{
    margin-top:2px;

    color:rgba(255,255,255,.67);
    font-size:11px;
}


/*==========================================================
=                        SIDEBAR                           =
==========================================================*/

.sr-course-map__sidebar{
    display:flex;
    flex-direction:column;

    min-width:0;
    padding:35px 31px 31px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.7),
            rgba(247,244,236,.78)
        );

    border-radius:0 28px 28px 0;
}

.sr-course-map__sidebar-top{
    display:flex;
    align-items:center;
    gap:15px;

    margin-bottom:62px;
}

.sr-course-map__sidebar-index{
    color:var(--sr-gold);
    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:18px;
    font-weight:600;
}

.sr-course-map__sidebar-line{
    width:42px;
    height:1px;
    background:var(--sr-gold);
}

.sr-course-map__sidebar-label{
    display:block;
    margin-bottom:17px;

    color:var(--sr-gold);
    font-size:10px;
    font-weight:700;
    letter-spacing:.2em;
    text-transform:uppercase;
}

.sr-course-map__sidebar h3{
    margin:0 0 23px;

    color:var(--sr-green);
    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:39px;
    font-weight:500;
    line-height:.98;
    letter-spacing:-.035em;
}

.sr-course-map__sidebar h3 em{
    display:block;
    margin-top:6px;

    color:var(--sr-gold);
    font-weight:400;
}

.sr-course-map__sidebar-content p{
    margin:0;

    color:var(--sr-text);
    font-size:14px;
    line-height:1.75;
}


/*==========================================================
=                         LÉGENDE                          =
==========================================================*/

.sr-course-map__legend{
    display:flex;
    flex-direction:column;
    gap:17px;

    margin-top:38px;
    padding-top:29px;

    border-top:1px solid var(--sr-border);
}

.sr-course-map__legend-item{
    display:flex;
    align-items:center;
    gap:13px;
}

.sr-course-map__legend-symbol{
    display:flex;
    flex:0 0 auto;
    align-items:center;
    justify-content:center;

    width:34px;
    height:34px;

    border-radius:50%;

    font-size:13px;
    font-weight:700;
}

.sr-course-map__legend-symbol--hole{
    border:1px solid var(--sr-green);
    background:var(--sr-green);

    color:#fff;
    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:17px;
}

.sr-course-map__legend-symbol--place{
    background:var(--sr-gold);
    color:#fff;
}

.sr-course-map__legend-symbol--facility{
    border:1px solid rgba(18,63,49,.16);
    background:#fff;
}

.sr-course-map__legend-symbol--facility i{
    display:block;
    width:9px;
    height:9px;

    border-radius:50%;
    background:var(--sr-gold);
}

.sr-course-map__legend-item strong{
    display:block;

    color:var(--sr-green);
    font-size:12px;
    font-weight:700;
    line-height:1.25;
}

.sr-course-map__legend-item small{
    display:block;
    margin-top:2px;

    color:#87938d;
    font-size:10px;
}


/*==========================================================
=                          CTA                             =
==========================================================*/

.sr-course-map__cta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;

    margin-top:auto;
    padding-top:35px;

    color:var(--sr-green);
    text-decoration:none;
}

.sr-course-map__cta > span:first-child{
    padding-bottom:6px;

    border-bottom:1px solid var(--sr-gold);

    font-size:13px;
    font-weight:700;
}

.sr-course-map__cta-arrow{
    display:flex;
    align-items:center;
    justify-content:center;

    width:40px;
    height:40px;

    border-radius:50%;

    background:var(--sr-green);
    color:#fff;

    font-size:17px;

    box-shadow:0 10px 24px rgba(18,63,49,.2);

    transition:
        transform .3s ease,
        background-color .3s ease;
}

.sr-course-map__cta:hover .sr-course-map__cta-arrow{
    transform:translateY(4px);
    background:var(--sr-gold);
}


/*==========================================================
=                         TABLETTE                         =
==========================================================*/

@media (max-width:1024px){

    .sr-course-map{
        padding:90px 28px;
    }

    .sr-course-map__header{
        grid-template-columns:1fr;
        gap:28px;
    }

    .sr-course-map__introduction{
        max-width:600px;
    }

    .sr-course-map__layout{
        grid-template-columns:1fr;
    }

    .sr-course-map__visual{
        border-right:0;
        border-bottom:1px solid var(--sr-border);
    }

    .sr-course-map__sidebar{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:30px;

        border-radius:0 0 28px 28px;
    }

    .sr-course-map__sidebar-top{
        display:none;
    }

    .sr-course-map__legend{
        margin-top:0;
        padding-top:0;
        border-top:0;
    }

    .sr-course-map__cta{
        grid-column:1 / -1;

        margin-top:0;
        padding-top:25px;

        border-top:1px solid var(--sr-border);
    }

}


/*==========================================================
=                          MOBILE                          =
==========================================================*/

@media (max-width:767px){

    .sr-course-map{
        padding:70px 15px;
    }

    .sr-course-map::before{
        width:calc(100% - 30px);
    }

    .sr-course-map__header{
        gap:24px;
        margin-bottom:38px;
    }

    .sr-course-map__eyebrow{
        gap:10px;
        margin-bottom:14px;

        font-size:9px;
        letter-spacing:.2em;
    }

    .sr-course-map__eyebrow span{
        width:25px;
    }

    .sr-course-map__heading h2{
        font-size:45px;
        line-height:.9;
    }

    .sr-course-map__heading h2 em{
        margin-top:8px;
    }

    .sr-course-map__introduction p{
        margin-bottom:18px;

        font-size:14px;
        line-height:1.65;
    }

    .sr-course-map__instruction{
        align-items:flex-start;
        font-size:12px;
        line-height:1.45;
    }

    .sr-course-map__instruction-icon{
        flex:0 0 25px;

        width:25px;
        height:25px;
    }

    .sr-course-map__layout{
        border-radius:19px;
    }

    .sr-course-map__visual{
        padding:9px;
    }

    .sr-course-map__image-wrapper,
    .sr-course-map__image{
        border-radius:14px;
    }

    .sr-course-map__marker-number{
        width:27px;
        height:27px;

        border-width:1px;

        font-size:15px;

        box-shadow:
            0 5px 13px rgba(5,38,27,.25),
            0 0 0 2px rgba(18,63,49,.12);
    }

    .sr-course-map__marker--hole::before{
        width:35px;
        height:35px;
    }

    .sr-course-map__place-letter{
        width:23px;
        height:23px;

        font-size:10px;
    }

    .sr-course-map__facility-dot{
        width:12px;
        height:12px;

        border-width:2px;
    }

    /*
     * Les infobulles classiques sont masquées sur mobile
     * pour ne pas couvrir le plan.
     */

    .sr-course-map__tooltip{
        display:none;
    }

    .sr-course-map__sidebar{
        display:flex;
        gap:0;

        padding:30px 24px 24px;
    }

    .sr-course-map__sidebar h3{
        font-size:35px;
    }

    .sr-course-map__sidebar-content p{
        font-size:13px;
    }

    .sr-course-map__legend{
        margin-top:28px;
        padding-top:25px;

        border-top:1px solid var(--sr-border);
    }

    .sr-course-map__cta{
        margin-top:28px;
        padding-top:24px;
    }

}


/*==========================================================
=                    TRÈS PETITS ÉCRANS                    =
==========================================================*/

@media (max-width:390px){

    .sr-course-map__heading h2{
        font-size:40px;
    }

    .sr-course-map__visual{
        padding:6px;
    }

    .sr-course-map__marker-number{
        width:24px;
        height:24px;

        font-size:13px;
    }

    .sr-course-map__marker--hole::before{
        display:none;
    }

    .sr-course-map__place-letter{
        width:20px;
        height:20px;

        font-size:8px;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-abae7df *//*==========================================================
=            COURSE EXPLORER - GOLF SAINT ROMAN            =
==========================================================*/

:root{

    --course-green:#204736;
    --course-green-dark:#173326;
    --course-green-light:#2d5f48;

    --course-gold:#D4B06C;
    --course-gold-light:#E9C98F;

    --course-cream:#F8F5EF;
    --course-white:#FFFFFF;

    --course-text:#344C40;
    --course-text-light:rgba(52,76,64,.70);

    --course-border:rgba(32,71,54,.10);

    --course-shadow:
        0 30px 70px rgba(0,0,0,.12);

    --course-radius:26px;

    --course-transition:.35s cubic-bezier(.22,.61,.36,1);

}

/*==========================================================
=                       SECTION                            =
==========================================================*/

.course-explorer{

    position:relative;

    padding:110px 40px;

    background:
        linear-gradient(
            180deg,
            #F9F7F2 0%,
            #F4F1EA 100%
        );

    overflow:hidden;

}

.course-explorer::before{

    content:"";

    position:absolute;

    top:-180px;
    right:-180px;

    width:520px;
    height:520px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(212,176,108,.08),
            transparent 70%
        );

    pointer-events:none;

}

.course-explorer::after{

    content:"";

    position:absolute;

    bottom:-220px;
    left:-220px;

    width:600px;
    height:600px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(32,71,54,.05),
            transparent 72%
        );

    pointer-events:none;

}

/*==========================================================
=                     CONTAINER                            =
==========================================================*/

.course-explorer__container{

    position:relative;

    max-width:1450px;

    margin:0 auto;

    z-index:2;

}

/*==========================================================
=                       HEADER                             =
==========================================================*/

.course-explorer__header{

    display:flex;
    justify-content:space-between;
    align-items:flex-end;

    gap:70px;

    margin-bottom:55px;

}

.course-explorer__header-content{

    max-width:720px;

}

.course-explorer__eyebrow{

    display:inline-flex;
    align-items:center;

    gap:14px;

    margin-bottom:18px;

    color:var(--course-gold);

    font-family:"Manrope",sans-serif;
    font-size:12px;
    font-weight:700;

    letter-spacing:.22em;
    text-transform:uppercase;

}

.course-explorer__eyebrow::before{

    content:"";

    width:42px;
    height:1px;

    background:var(--course-gold);

}

.course-explorer__title{

    margin:0;

    color:var(--course-green-dark);

    font-family:"Cormorant Garamond",serif;
    font-size:74px;
    font-weight:500;

    line-height:.92;

    letter-spacing:-.04em;

}

.course-explorer__title em{

    font-style:italic;
    color:var(--course-gold);

}

.course-explorer__intro{

    max-width:420px;

    margin:0;

    color:var(--course-text-light);

    font-family:"Manrope",sans-serif;
    font-size:16px;

    line-height:1.9;

}

/*==========================================================
=                 NAVIGATION TROUS                         =
==========================================================*/

.course-explorer__hole-navigation{

    display:flex;
    flex-wrap:wrap;

    gap:14px;

    margin-bottom:42px;

}

.course-explorer__hole-button{

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    gap:5px;

    width:78px;
    height:72px;

    border:1px solid var(--course-border);
    border-radius:18px;

    background:#FFF;

    cursor:pointer;

    transition:all var(--course-transition);

}

.course-explorer__hole-button span{

    color:rgba(52,76,64,.55);

    font-family:"Manrope",sans-serif;
    font-size:10px;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.14em;

}

.course-explorer__hole-button strong{

    color:var(--course-green-dark);

    font-family:"Cormorant Garamond",serif;
    font-size:30px;
    font-weight:600;

    line-height:1;

}

.course-explorer__hole-button:hover{

    transform:translateY(-3px);

    border-color:rgba(212,176,108,.45);

    box-shadow:
        0 18px 36px rgba(0,0,0,.08);

}

.course-explorer__hole-button.is-active{

    background:var(--course-green);

    border-color:var(--course-green);

}

.course-explorer__hole-button.is-active span,

.course-explorer__hole-button.is-active strong{

    color:#FFF;

}

/*==========================================================
=                    LAYOUT                                =
==========================================================*/

.course-explorer__layout{

    display:grid;

    grid-template-columns:

        minmax(0,1.05fr)

        minmax(420px,.95fr);

    gap:34px;

    align-items:start;

}

/*==========================================================
=                   BLOCS PRINCIPAUX                       =
==========================================================*/

.course-explorer__viewer,

.course-explorer__card{

    position:relative;

    border-radius:var(--course-radius);

}

.course-explorer__viewer{

    overflow:hidden;

}

.course-explorer__card{

    background:var(--course-cream);

    box-shadow:var(--course-shadow);

    border:1px solid var(--course-border);

}

/*==========================================================
=                  ANIMATIONS GLOBALES                     =
==========================================================*/

.course-explorer__viewer,

.course-explorer__card,

.course-explorer__hole-button{

    transition:

        transform var(--course-transition),

        box-shadow var(--course-transition),

        border-color var(--course-transition),

        background-color var(--course-transition);

}

.course-explorer__viewer:hover{

    transform:translateY(-2px);

}

.course-explorer__card:hover{

    transform:translateY(-2px);

}

/*==========================================================
=                    ÉTATS FOCUS                           =
==========================================================*/

.course-explorer button:focus-visible{

    outline:3px solid rgba(212,176,108,.75);

    outline-offset:3px;

}

/*==========================================================
=                   IMAGE RESPONSIVE                       =
==========================================================*/

.course-explorer img{

    display:block;

    max-width:100%;

    height:auto;

}

/*==========================================================
=                 SÉLECTION TEXTE                          =
==========================================================*/

.course-explorer ::selection{

    color:#FFF;

    background:var(--course-green);

}


/*==========================================================
=                  PARTIE 2 — VIEWER PHOTO                 =
==========================================================*/

/*==========================================================
=                    CADRE PRINCIPAL                       =
==========================================================*/

.course-explorer__viewer-frame{

    position:relative;

    overflow:hidden;

    border:1px solid rgba(32,71,54,.10);
    border-radius:var(--course-radius);

    background:var(--course-green-dark);

    box-shadow:var(--course-shadow);

}

/*==========================================================
=                    ZONE IMAGE                            =
==========================================================*/

.course-explorer__viewer-image{

    position:relative;

    min-height:620px;

    overflow:hidden;

    background:var(--course-green-dark);

    isolation:isolate;

}

.course-explorer__main-image{

    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    max-width:none;

    object-fit:cover;
    object-position:center;

    transform:scale(1.015);

    filter:
        saturate(.96)
        contrast(1.04)
        brightness(.96);

    transition:
        opacity .35s ease,
        transform 1.1s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;

}

.course-explorer__viewer-image:hover
.course-explorer__main-image{

    transform:scale(1.045);

    filter:
        saturate(1)
        contrast(1.04)
        brightness(1);

}

/*==========================================================
=                    OVERLAYS                              =
==========================================================*/

.course-explorer__viewer-overlay{

    position:absolute;
    inset:0;
    z-index:2;

    background:

        linear-gradient(
            180deg,
            rgba(5,22,16,.28) 0%,
            rgba(5,22,16,.03) 34%,
            rgba(5,22,16,.08) 57%,
            rgba(5,22,16,.82) 100%
        ),

        linear-gradient(
            90deg,
            rgba(7,31,22,.18),
            transparent 42%
        );

    pointer-events:none;

}

.course-explorer__viewer-image::before{

    content:"";

    position:absolute;
    inset:0;
    z-index:1;

    background:
        linear-gradient(
            125deg,
            rgba(255,255,255,.20),
            transparent 28%
        );

    opacity:.22;

    pointer-events:none;

}

.course-explorer__viewer-image::after{

    content:"";

    position:absolute;
    inset:0;
    z-index:3;

    background:
        radial-gradient(
            circle at center,
            transparent 54%,
            rgba(5,22,16,.22) 100%
        );

    pointer-events:none;

}

/*==========================================================
=                    BORD INTÉRIEUR                        =
==========================================================*/

.course-explorer__viewer-border{

    position:absolute;

    inset:12px;

    z-index:5;

    border:1px solid rgba(255,255,255,.25);
    border-radius:18px;

    pointer-events:none;

}

/*==========================================================
=                    HEADER PHOTO                          =
==========================================================*/

.course-explorer__viewer-header{

    position:absolute;

    top:28px;
    right:28px;
    left:28px;

    z-index:8;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:18px;

}

.course-explorer__viewer-label{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:36px;
    padding:0 16px;

    border:1px solid rgba(255,255,255,.22);
    border-radius:999px;

    color:#FFF;

    background:rgba(11,42,30,.42);

    font-family:"Manrope",sans-serif;
    font-size:10px;
    font-weight:700;

    letter-spacing:.16em;
    text-transform:uppercase;

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

}

.course-explorer__viewer-counter{

    color:rgba(255,255,255,.94);

    font-family:"Manrope",sans-serif;
    font-size:11px;
    font-weight:700;

    letter-spacing:.16em;
    text-transform:uppercase;

    text-shadow:0 2px 10px rgba(0,0,0,.22);

}

/*==========================================================
=                    NUMÉRO DU TROU                        =
==========================================================*/

.course-explorer__viewer-hole{

    position:absolute;

    right:30px;
    bottom:30px;
    left:30px;

    z-index:8;

    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    color:#FFF;

}

.course-explorer__viewer-hole span{

    margin-bottom:10px;

    font-family:"Manrope",sans-serif;
    font-size:11px;
    font-weight:700;

    letter-spacing:.18em;
    text-transform:uppercase;

}

.course-explorer__viewer-hole strong{

    font-family:"Cormorant Garamond",serif;
    font-size:112px;
    font-weight:500;

    line-height:.72;
    letter-spacing:-.06em;

    color:#FFF;

    text-shadow:0 10px 28px rgba(0,0,0,.28);

}

/*==========================================================
=                    LOADER                                =
==========================================================*/

.course-explorer__loader{

    position:absolute;
    inset:0;
    z-index:15;

    display:flex;
    align-items:center;
    justify-content:center;

    visibility:hidden;
    opacity:0;

    background:rgba(7,31,22,.25);

    transition:
        opacity .25s ease,
        visibility .25s ease;

}

.course-explorer__loader span{

    width:42px;
    height:42px;

    border:3px solid rgba(255,255,255,.28);
    border-top-color:#FFF;
    border-radius:50%;

    animation:course-loader-spin .8s linear infinite;

}

.course-explorer__viewer.is-loading
.course-explorer__loader{

    visibility:visible;
    opacity:1;

}

@keyframes course-loader-spin{

    to{
        transform:rotate(360deg);
    }

}

/*==========================================================
=                NAVIGATION DES DEUX VUES                  =
==========================================================*/

.course-explorer__image-navigation{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:1px;

    background:rgba(32,71,54,.10);

}

.course-explorer__image-button{

    position:relative;

    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;

    gap:16px;

    min-height:92px;
    padding:18px 22px;

    border:0;

    color:var(--course-green-dark);

    background:rgba(255,255,255,.96);

    cursor:pointer;

    overflow:hidden;

    transition:
        color var(--course-transition),
        background-color var(--course-transition);

}

.course-explorer__image-button::before{

    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            120deg,
            rgba(212,176,108,.14),
            transparent 55%
        );

    opacity:0;

    transition:opacity var(--course-transition);

    pointer-events:none;

}

.course-explorer__image-button::after{

    content:"";

    position:absolute;

    right:22px;
    bottom:0;
    left:22px;

    height:3px;

    border-radius:999px 999px 0 0;

    background:var(--course-gold);

    transform:scaleX(0);
    transform-origin:center;

    transition:transform var(--course-transition);

}

.course-explorer__image-button:hover::before{

    opacity:1;

}

.course-explorer__image-button.is-active{

    background:var(--course-cream);

}

.course-explorer__image-button.is-active::after{

    transform:scaleX(1);

}

/*==========================================================
=              NUMÉRO DU BOUTON DE VUE                     =
==========================================================*/

.course-explorer__image-button-number{

    display:flex;
    align-items:center;
    justify-content:center;

    width:42px;
    height:42px;

    flex:0 0 42px;

    border:1px solid rgba(32,71,54,.14);
    border-radius:50%;

    color:var(--course-green-dark);

    background:#FFF;

    font-family:"Cormorant Garamond",serif;
    font-size:18px;
    font-weight:600;

    transition:
        color var(--course-transition),
        background-color var(--course-transition),
        border-color var(--course-transition),
        transform var(--course-transition);

}

.course-explorer__image-button.is-active
.course-explorer__image-button-number{

    color:#FFF;

    background:var(--course-green);

    border-color:var(--course-green);

}

.course-explorer__image-button:hover
.course-explorer__image-button-number{

    transform:translateY(-2px);

}

/*==========================================================
=                   TEXTE DU BOUTON                        =
==========================================================*/

.course-explorer__image-button-text{

    position:relative;
    z-index:2;

    display:flex;
    flex-direction:column;

    gap:5px;

    min-width:0;

    text-align:left;

}

.course-explorer__image-button-text small{

    color:rgba(52,76,64,.50);

    font-family:"Manrope",sans-serif;
    font-size:9px;
    font-weight:700;

    letter-spacing:.15em;
    text-transform:uppercase;

}

.course-explorer__image-button-text strong{

    overflow:hidden;

    color:var(--course-green-dark);

    font-family:"Manrope",sans-serif;
    font-size:13px;
    font-weight:700;

    white-space:nowrap;
    text-overflow:ellipsis;

}

/*==========================================================
=                   FLÈCHE DU BOUTON                       =
==========================================================*/

.course-explorer__image-button-arrow{

    position:relative;
    z-index:2;

    display:flex;
    align-items:center;
    justify-content:center;

    width:32px;
    height:32px;

    border:1px solid rgba(32,71,54,.12);
    border-radius:50%;

    color:var(--course-green);

    font-size:14px;

    transition:
        color var(--course-transition),
        background-color var(--course-transition),
        border-color var(--course-transition),
        transform var(--course-transition);

}

.course-explorer__image-button:hover
.course-explorer__image-button-arrow,

.course-explorer__image-button.is-active
.course-explorer__image-button-arrow{

    color:#FFF;

    background:var(--course-gold);
    border-color:var(--course-gold);

    transform:rotate(8deg);

}

/*==========================================================
=                    LÉGENDE                               =
==========================================================*/

.course-explorer__viewer-caption{

    display:flex;
    align-items:flex-start;

    gap:14px;

    padding:20px 8px 0;

}

.course-explorer__viewer-caption-icon{

    display:flex;
    align-items:center;
    justify-content:center;

    width:27px;
    height:27px;

    flex:0 0 27px;

    border:1px solid rgba(32,71,54,.14);
    border-radius:50%;

    color:var(--course-green);

    font-family:"Manrope",sans-serif;
    font-size:14px;
    font-weight:500;

}

.course-explorer__viewer-caption p{

    max-width:570px;

    margin:2px 0 0;

    color:rgba(52,76,64,.60);

    font-family:"Manrope",sans-serif;
    font-size:11px;
    font-weight:400;

    line-height:1.65;

}

/*==========================================================
=                TRANSITION DE CHANGEMENT                  =
==========================================================*/

.course-explorer__main-image.is-switching{

    opacity:0;

    transform:scale(1.035);

}

.course-explorer__viewer-content-changing
.course-explorer__viewer-hole,

.course-explorer__viewer-content-changing
.course-explorer__viewer-header{

    opacity:.35;

    transform:translateY(6px);

}

.course-explorer__viewer-hole,
.course-explorer__viewer-header{

    transition:
        opacity .28s ease,
        transform .35s ease;

}

/*==========================================================
=                 TABLETTE INTERMÉDIAIRE                   =
==========================================================*/

@media (max-width:1100px){

    .course-explorer__viewer-image{

        min-height:560px;

    }

    .course-explorer__viewer-hole strong{

        font-size:96px;

    }

}

/*==========================================================
=                       MOBILE                             =
==========================================================*/

@media (max-width:767px){

    .course-explorer__viewer-frame{

        border-radius:20px;

    }

    .course-explorer__viewer-image{

        min-height:430px;

    }

    .course-explorer__viewer-border{

        inset:8px;

        border-radius:13px;

    }

    .course-explorer__viewer-header{

        top:18px;
        right:18px;
        left:18px;

    }

    .course-explorer__viewer-label{

        min-height:32px;
        padding:0 12px;

        font-size:8px;

    }

    .course-explorer__viewer-counter{

        font-size:9px;

    }

    .course-explorer__viewer-hole{

        right:20px;
        bottom:22px;
        left:20px;

    }

    .course-explorer__viewer-hole span{

        margin-bottom:7px;

        font-size:9px;

    }

    .course-explorer__viewer-hole strong{

        font-size:78px;

    }

    .course-explorer__image-navigation{

        grid-template-columns:1fr;

    }

    .course-explorer__image-button{

        min-height:78px;
        padding:15px 17px;

    }

    .course-explorer__image-button::after{

        right:17px;
        left:17px;

    }

    .course-explorer__image-button-number{

        width:38px;
        height:38px;

        flex-basis:38px;

        font-size:16px;

    }

    .course-explorer__viewer-caption{

        padding-top:16px;

    }

}

/*==========================================================
=                  TRÈS PETITS MOBILES                     =
==========================================================*/

@media (max-width:420px){

    .course-explorer__viewer-image{

        min-height:360px;

    }

    .course-explorer__viewer-label{

        max-width:160px;

        overflow:hidden;

        white-space:nowrap;
        text-overflow:ellipsis;

    }

    .course-explorer__viewer-hole strong{

        font-size:68px;

    }

    .course-explorer__image-button{

        grid-template-columns:auto minmax(0,1fr);

    }

    .course-explorer__image-button-arrow{

        display:none;

    }

}


/*==========================================================
=            PARTIE 3 — CARTE D’INFORMATIONS              =
==========================================================*/

/*==========================================================
=                  CONTENU DE LA CARTE                     =
==========================================================*/

.course-explorer__card{

    overflow:hidden;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.97) 0%,
            rgba(248,245,239,.98) 100%
        );

}

.course-explorer__card::before{

    content:"";

    position:absolute;

    top:-140px;
    right:-120px;

    width:360px;
    height:360px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(212,176,108,.12) 0%,
            rgba(212,176,108,0) 70%
        );

    pointer-events:none;

}

.course-explorer__card::after{

    content:"";

    position:absolute;

    bottom:-180px;
    left:-160px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(32,71,54,.07) 0%,
            rgba(32,71,54,0) 72%
        );

    pointer-events:none;

}

.course-explorer__card-content{

    position:relative;
    z-index:2;

    padding:38px;

}

/*==========================================================
=                  EN-TÊTE DE LA CARTE                     =
==========================================================*/

.course-explorer__card-top{

    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:28px;

    padding-bottom:28px;

    border-bottom:1px solid var(--course-border);

}

.course-explorer__card-heading{

    min-width:0;

}

.course-explorer__card-eyebrow{

    display:block;

    margin-bottom:8px;

    color:var(--course-gold);

    font-family:"Manrope",sans-serif;
    font-size:10px;
    font-weight:700;

    line-height:1;

    letter-spacing:.19em;
    text-transform:uppercase;

}

.course-explorer__card-title{

    margin:0;

    color:var(--course-green-dark);

    font-family:"Cormorant Garamond",serif;
    font-size:62px;
    font-weight:500;

    line-height:.95;
    letter-spacing:-.045em;

}

.course-explorer__card-title span{

    color:var(--course-green);

}

/*==========================================================
=                      CERCLE PAR                          =
==========================================================*/

.course-explorer__par{

    position:relative;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    width:90px;
    height:90px;

    flex:0 0 90px;

    border:1px solid rgba(212,176,108,.40);
    border-radius:50%;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.96),
            rgba(244,238,226,.95)
        );

    box-shadow:
        0 15px 34px rgba(32,71,54,.08),
        inset 0 1px 0 rgba(255,255,255,.95);

}

.course-explorer__par::before{

    content:"";

    position:absolute;

    inset:7px;

    border:1px solid rgba(32,71,54,.10);
    border-radius:50%;

    pointer-events:none;

}

.course-explorer__par-label{

    position:relative;
    z-index:2;

    margin-bottom:2px;

    color:rgba(52,76,64,.54);

    font-family:"Manrope",sans-serif;
    font-size:9px;
    font-weight:700;

    letter-spacing:.18em;
    text-transform:uppercase;

}

.course-explorer__par strong{

    position:relative;
    z-index:2;

    color:var(--course-green-dark);

    font-family:"Cormorant Garamond",serif;
    font-size:42px;
    font-weight:600;

    line-height:.8;

}

/*==========================================================
=                     MÉTADONNÉES                          =
==========================================================*/

.course-explorer__metadata{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    margin-top:26px;

    border:1px solid var(--course-border);
    border-radius:18px;

    background:rgba(255,255,255,.64);

    overflow:hidden;

}

.course-explorer__metadata-item{

    position:relative;

    display:flex;
    flex-direction:column;

    gap:7px;

    min-height:88px;
    padding:20px 22px;

}

.course-explorer__metadata-item + .course-explorer__metadata-item{

    border-left:1px solid var(--course-border);

}

.course-explorer__metadata-label{

    color:rgba(52,76,64,.50);

    font-family:"Manrope",sans-serif;
    font-size:9px;
    font-weight:700;

    line-height:1;

    letter-spacing:.16em;
    text-transform:uppercase;

}

.course-explorer__metadata-item strong{

    color:var(--course-green-dark);

    font-family:"Manrope",sans-serif;
    font-size:15px;
    font-weight:700;

    line-height:1.3;

}

/*==========================================================
=                       DISTANCES                          =
==========================================================*/

.course-explorer__distances{

    display:grid;

    grid-template-columns:repeat(3,minmax(0,1fr));

    gap:10px;

    margin-top:18px;

}

.course-explorer__distance{

    position:relative;

    min-width:0;

    padding:18px 14px 17px;

    border:1px solid var(--course-border);
    border-radius:16px;

    background:rgba(255,255,255,.72);

    transition:
        transform var(--course-transition),
        border-color var(--course-transition),
        box-shadow var(--course-transition),
        background-color var(--course-transition);

}

.course-explorer__distance:hover{

    transform:translateY(-2px);

    border-color:rgba(212,176,108,.35);

    background:#FFF;

    box-shadow:0 12px 26px rgba(32,71,54,.07);

}

.course-explorer__distance-color{

    display:block;

    width:28px;
    height:4px;

    margin-bottom:14px;

    border-radius:999px;

}

.course-explorer__distance--yellow
.course-explorer__distance-color{

    background:#D7B838;

}

.course-explorer__distance--red
.course-explorer__distance-color{

    background:#B74A43;

}

.course-explorer__distance--orange
.course-explorer__distance-color{

    background:#D98332;

}

.course-explorer__distance-label{

    display:block;

    margin-bottom:7px;

    color:rgba(52,76,64,.54);

    font-family:"Manrope",sans-serif;
    font-size:9px;
    font-weight:700;

    line-height:1;

    letter-spacing:.13em;
    text-transform:uppercase;

}

.course-explorer__distance strong{

    display:flex;
    align-items:baseline;

    gap:3px;

    color:var(--course-green-dark);

    font-family:"Cormorant Garamond",serif;
    font-size:31px;
    font-weight:600;

    line-height:1;

}

.course-explorer__distance strong small{

    color:rgba(52,76,64,.54);

    font-family:"Manrope",sans-serif;
    font-size:10px;
    font-weight:700;

}

/*==========================================================
=                 LABELS DE SECTIONS                       =
==========================================================*/

.course-explorer__section-label{

    display:flex;
    align-items:center;

    gap:10px;

    margin-bottom:12px;

    color:var(--course-gold);

    font-family:"Manrope",sans-serif;
    font-size:9px;
    font-weight:700;

    line-height:1;

    letter-spacing:.18em;
    text-transform:uppercase;

}

.course-explorer__section-label::before{

    content:"";

    width:24px;
    height:1px;

    background:currentColor;

}

/*==========================================================
=                      DESCRIPTION                         =
==========================================================*/

.course-explorer__description{

    margin-top:30px;
    padding-top:28px;

    border-top:1px solid var(--course-border);

}

.course-explorer__description p{

    margin:0;

    color:var(--course-text);

    font-family:"Manrope",sans-serif;
    font-size:14px;
    font-weight:400;

    line-height:1.85;

}

/*==========================================================
=                  CONSEIL DU PROFESSIONNEL                =
==========================================================*/

.course-explorer__pro-tip{

    position:relative;

    display:grid;

    grid-template-columns:auto minmax(0,1fr);

    gap:18px;

    margin-top:24px;
    padding:22px;

    border:1px solid rgba(212,176,108,.28);
    border-radius:18px;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.90),
            rgba(244,238,226,.88)
        );

    overflow:hidden;

}

.course-explorer__pro-tip::before{

    content:"";

    position:absolute;

    top:-70px;
    right:-55px;

    width:170px;
    height:170px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(212,176,108,.15),
            transparent 70%
        );

    pointer-events:none;

}

.course-explorer__pro-tip-icon{

    position:relative;
    z-index:2;

    display:flex;
    align-items:center;
    justify-content:center;

    width:48px;
    height:48px;

    flex:0 0 48px;

    border-radius:50%;

    color:#FFF;

    background:var(--course-green);

    font-family:"Manrope",sans-serif;
    font-size:11px;
    font-weight:700;

    letter-spacing:.06em;

    box-shadow:0 10px 22px rgba(32,71,54,.20);

}

.course-explorer__pro-tip-content{

    position:relative;
    z-index:2;

    min-width:0;

}

.course-explorer__pro-tip-content
.course-explorer__section-label{

    margin-top:3px;
    margin-bottom:9px;

}

.course-explorer__pro-tip-content p{

    margin:0;

    color:var(--course-text);

    font-family:"Manrope",sans-serif;
    font-size:13px;
    font-weight:500;

    line-height:1.75;

}

/*==========================================================
=                      PROGRESSION                         =
==========================================================*/

.course-explorer__progress{

    margin-top:28px;
    padding-top:25px;

    border-top:1px solid var(--course-border);

}

.course-explorer__progress-heading{

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:18px;

    margin-bottom:12px;

}

.course-explorer__progress-heading span{

    color:rgba(52,76,64,.52);

    font-family:"Manrope",sans-serif;
    font-size:9px;
    font-weight:700;

    letter-spacing:.14em;
    text-transform:uppercase;

}

.course-explorer__progress-heading strong{

    color:var(--course-green-dark);

    font-family:"Manrope",sans-serif;
    font-size:11px;
    font-weight:700;

}

.course-explorer__progress-track{

    position:relative;

    width:100%;
    height:6px;

    border-radius:999px;

    background:rgba(32,71,54,.09);

    overflow:hidden;

}

.course-explorer__progress-bar{

    display:block;

    width:11.111%;
    height:100%;

    border-radius:inherit;

    background:
        linear-gradient(
            90deg,
            var(--course-green),
            var(--course-gold)
        );

    box-shadow:0 0 16px rgba(212,176,108,.35);

    transition:width .55s cubic-bezier(.22,.61,.36,1);

}

/*==========================================================
=              TRANSITION DU CONTENU DYNAMIQUE             =
==========================================================*/

.course-explorer__card.is-changing
.course-explorer__card-top,

.course-explorer__card.is-changing
.course-explorer__metadata,

.course-explorer__card.is-changing
.course-explorer__distances,

.course-explorer__card.is-changing
.course-explorer__description,

.course-explorer__card.is-changing
.course-explorer__pro-tip,

.course-explorer__card.is-changing
.course-explorer__progress{

    opacity:.25;

    transform:translateY(7px);

}

.course-explorer__card-top,
.course-explorer__metadata,
.course-explorer__distances,
.course-explorer__description,
.course-explorer__pro-tip,
.course-explorer__progress{

    transition:
        opacity .28s ease,
        transform .34s ease;

}

/*==========================================================
=                    TABLETTE                              =
==========================================================*/

@media (max-width:1100px){

    .course-explorer__card-content{

        padding:32px;

    }

    .course-explorer__card-title{

        font-size:56px;

    }

    .course-explorer__par{

        width:82px;
        height:82px;

        flex-basis:82px;

    }

    .course-explorer__par strong{

        font-size:38px;

    }

}

/*==========================================================
=                       MOBILE                             =
==========================================================*/

@media (max-width:767px){

    .course-explorer__card{

        border-radius:20px;

    }

    .course-explorer__card-content{

        padding:24px 20px;

    }

    .course-explorer__card-top{

        gap:18px;

        padding-bottom:22px;

    }

    .course-explorer__card-title{

        font-size:48px;

    }

    .course-explorer__par{

        width:72px;
        height:72px;

        flex-basis:72px;

    }

    .course-explorer__par strong{

        font-size:34px;

    }

    .course-explorer__metadata{

        margin-top:20px;

        border-radius:15px;

    }

    .course-explorer__metadata-item{

        min-height:78px;

        padding:17px 16px;

    }

    .course-explorer__metadata-item strong{

        font-size:13px;

    }

    .course-explorer__distances{

        gap:7px;

    }

    .course-explorer__distance{

        padding:15px 10px;

        border-radius:14px;

    }

    .course-explorer__distance strong{

        font-size:26px;

    }

    .course-explorer__description{

        margin-top:24px;
        padding-top:23px;

    }

    .course-explorer__description p{

        font-size:13px;

        line-height:1.75;

    }

    .course-explorer__pro-tip{

        grid-template-columns:1fr;

        gap:14px;

        padding:19px;

    }

    .course-explorer__pro-tip-icon{

        width:44px;
        height:44px;

        flex-basis:44px;

    }

}

/*==========================================================
=                 TRÈS PETITS MOBILES                      =
==========================================================*/

@media (max-width:420px){

    .course-explorer__card-top{

        align-items:center;

    }

    .course-explorer__card-title{

        font-size:43px;

    }

    .course-explorer__par{

        width:66px;
        height:66px;

        flex-basis:66px;

    }

    .course-explorer__par strong{

        font-size:31px;

    }

    .course-explorer__metadata{

        grid-template-columns:1fr;

    }

    .course-explorer__metadata-item + .course-explorer__metadata-item{

        border-top:1px solid var(--course-border);
        border-left:0;

    }

    .course-explorer__distances{

        grid-template-columns:1fr;

    }

    .course-explorer__distance{

        display:grid;

        grid-template-columns:auto minmax(0,1fr) auto;
        align-items:center;

        gap:12px;

        padding:13px 15px;

    }

    .course-explorer__distance-color{

        width:5px;
        height:30px;

        margin:0;

    }

    .course-explorer__distance-label{

        margin:0;

    }

    .course-explorer__distance strong{

        font-size:25px;

    }

}


/*==========================================================
=       PARTIE 4 — NAVIGATION, RESPONSIVE & ACCESSIBILITÉ  =
==========================================================*/

/*==========================================================
=              NAVIGATION PRÉCÉDENT / SUIVANT              =
==========================================================*/

.course-explorer__controls{

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:12px;

    margin-top:24px;

}

.course-explorer__control{

    position:relative;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:16px;

    min-height:78px;
    padding:16px 18px;

    border:1px solid var(--course-border);
    border-radius:16px;

    color:var(--course-green-dark);

    background:rgba(255,255,255,.76);

    cursor:pointer;

    overflow:hidden;

    transition:
        color var(--course-transition),
        background-color var(--course-transition),
        border-color var(--course-transition),
        box-shadow var(--course-transition),
        transform var(--course-transition),
        opacity var(--course-transition);

}

.course-explorer__control::before{

    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            135deg,
            rgba(212,176,108,.16),
            transparent 58%
        );

    opacity:0;

    transition:opacity var(--course-transition);

    pointer-events:none;

}

.course-explorer__control:hover:not(:disabled){

    transform:translateY(-2px);

    border-color:rgba(212,176,108,.42);

    background:#FFF;

    box-shadow:0 14px 30px rgba(32,71,54,.08);

}

.course-explorer__control:hover:not(:disabled)::before{

    opacity:1;

}

.course-explorer__control--next{

    color:#FFF;

    border-color:var(--course-green);

    background:var(--course-green);

}

.course-explorer__control--next::before{

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.12),
            transparent 60%
        );

}

.course-explorer__control--next:hover:not(:disabled){

    color:#FFF;

    border-color:var(--course-green-light);

    background:var(--course-green-light);

    box-shadow:0 16px 34px rgba(32,71,54,.22);

}

.course-explorer__control:disabled{

    opacity:.38;

    cursor:not-allowed;

    transform:none;

    box-shadow:none;

}

/*==========================================================
=                  TEXTE DES CONTRÔLES                     =
==========================================================*/

.course-explorer__control-text{

    position:relative;
    z-index:2;

    display:flex;
    flex-direction:column;

    gap:4px;

    min-width:0;

}

.course-explorer__control--previous
.course-explorer__control-text{

    text-align:left;

}

.course-explorer__control--next
.course-explorer__control-text{

    text-align:right;

}

.course-explorer__control-text small{

    color:rgba(52,76,64,.48);

    font-family:"Manrope",sans-serif;
    font-size:8px;
    font-weight:700;

    line-height:1;

    letter-spacing:.15em;
    text-transform:uppercase;

}

.course-explorer__control--next
.course-explorer__control-text small{

    color:rgba(255,255,255,.62);

}

.course-explorer__control-text strong{

    overflow:hidden;

    font-family:"Manrope",sans-serif;
    font-size:12px;
    font-weight:700;

    line-height:1.25;

    white-space:nowrap;
    text-overflow:ellipsis;

}

/*==========================================================
=                 FLÈCHES DES CONTRÔLES                    =
==========================================================*/

.course-explorer__control-arrow{

    position:relative;
    z-index:2;

    display:flex;
    align-items:center;
    justify-content:center;

    width:38px;
    height:38px;

    flex:0 0 38px;

    border:1px solid rgba(32,71,54,.13);
    border-radius:50%;

    color:var(--course-green);

    background:#FFF;

    font-size:15px;

    transition:
        color var(--course-transition),
        background-color var(--course-transition),
        border-color var(--course-transition),
        transform var(--course-transition);

}

.course-explorer__control--next
.course-explorer__control-arrow{

    color:var(--course-green-dark);

    border-color:rgba(255,255,255,.22);

}

.course-explorer__control--previous:hover:not(:disabled)
.course-explorer__control-arrow{

    transform:translateX(-3px);

}

.course-explorer__control--next:hover:not(:disabled)
.course-explorer__control-arrow{

    transform:translateX(3px);

}

/*==========================================================
=                  AJUSTEMENTS DESKTOP                     =
==========================================================*/

@media (min-width:1201px){

    .course-explorer__layout{

        align-items:stretch;

    }

    .course-explorer__viewer{

        display:flex;
        flex-direction:column;

    }

    .course-explorer__viewer-frame{

        flex:1;

    }

    .course-explorer__viewer-image{

        min-height:650px;

    }

    .course-explorer__card{

        height:100%;

    }

    .course-explorer__card-content{

        display:flex;
        flex-direction:column;

        min-height:100%;

    }

    .course-explorer__controls{

        margin-top:auto;
        padding-top:24px;

    }

}

/*==========================================================
=                  GRANDES TABLETTES                       =
==========================================================*/

@media (max-width:1200px){

    .course-explorer{

        padding:90px 30px;

    }

    .course-explorer__header{

        gap:40px;

    }

    .course-explorer__title{

        font-size:64px;

    }

    .course-explorer__layout{

        grid-template-columns:minmax(0,1fr) minmax(390px,.9fr);

        gap:26px;

    }

    .course-explorer__hole-navigation{

        gap:10px;

    }

    .course-explorer__hole-button{

        width:70px;
        height:68px;

        border-radius:16px;

    }

}

/*==========================================================
=                     TABLETTE                             =
==========================================================*/

@media (max-width:1024px){

    .course-explorer{

        padding:82px 26px;

    }

    .course-explorer__header{

        display:grid;
        grid-template-columns:1fr;

        gap:22px;

        margin-bottom:42px;

    }

    .course-explorer__header-content{

        max-width:780px;

    }

    .course-explorer__intro{

        max-width:620px;

    }

    .course-explorer__hole-navigation{

        display:grid;
        grid-template-columns:repeat(9,minmax(64px,1fr));

        overflow-x:auto;

        padding-bottom:8px;
        margin-bottom:34px;

        scrollbar-width:thin;
        scrollbar-color:rgba(32,71,54,.22) transparent;

    }

    .course-explorer__hole-navigation::-webkit-scrollbar{

        height:5px;

    }

    .course-explorer__hole-navigation::-webkit-scrollbar-track{

        background:transparent;

    }

    .course-explorer__hole-navigation::-webkit-scrollbar-thumb{

        border-radius:999px;

        background:rgba(32,71,54,.20);

    }

    .course-explorer__hole-button{

        width:auto;
        min-width:64px;

    }

    .course-explorer__layout{

        grid-template-columns:1fr;

    }

    .course-explorer__viewer-image{

        min-height:610px;

    }

    .course-explorer__card{

        max-width:none;

    }

}

/*==========================================================
=                  PETITES TABLETTES                       =
==========================================================*/

@media (max-width:820px){

    .course-explorer__title{

        font-size:56px;

    }

    .course-explorer__viewer-image{

        min-height:520px;

    }

    .course-explorer__hole-navigation{

        grid-template-columns:repeat(9,68px);

    }

}

/*==========================================================
=                       MOBILE                             =
==========================================================*/

@media (max-width:767px){

    .course-explorer{

        padding:64px 16px;

    }

    .course-explorer::before{

        top:-110px;
        right:-210px;

        width:420px;
        height:420px;

    }

    .course-explorer::after{

        bottom:-210px;
        left:-240px;

        width:480px;
        height:480px;

    }

    .course-explorer__header{

        margin-bottom:32px;

    }

    .course-explorer__eyebrow{

        gap:10px;

        margin-bottom:14px;

        font-size:9px;

    }

    .course-explorer__eyebrow::before{

        width:30px;

    }

    .course-explorer__title{

        font-size:46px;

        line-height:.96;

    }

    .course-explorer__intro{

        font-size:14px;

        line-height:1.75;

    }

    .course-explorer__hole-navigation{

        grid-template-columns:repeat(9,64px);

        gap:8px;

        margin-right:-16px;
        margin-bottom:28px;
        padding-right:16px;

    }

    .course-explorer__hole-button{

        min-width:64px;
        height:62px;

        border-radius:14px;

    }

    .course-explorer__hole-button span{

        font-size:8px;

    }

    .course-explorer__hole-button strong{

        font-size:25px;

    }

    .course-explorer__layout{

        gap:22px;

    }

    .course-explorer__controls{

        gap:8px;

    }

    .course-explorer__control{

        min-height:72px;
        padding:14px;

        border-radius:14px;

    }

    .course-explorer__control-arrow{

        width:34px;
        height:34px;

        flex-basis:34px;

    }

    .course-explorer__control-text strong{

        font-size:11px;

    }

}

/*==========================================================
=                  TRÈS PETITS MOBILES                     =
==========================================================*/

@media (max-width:480px){

    .course-explorer{

        padding-right:12px;
        padding-left:12px;

    }

    .course-explorer__title{

        font-size:41px;

    }

    .course-explorer__intro{

        font-size:13px;

    }

    .course-explorer__hole-navigation{

        margin-right:-12px;
        padding-right:12px;

    }

    .course-explorer__controls{

        grid-template-columns:1fr;

    }

    .course-explorer__control{

        width:100%;

    }

    .course-explorer__control--previous
    .course-explorer__control-text,

    .course-explorer__control--next
    .course-explorer__control-text{

        text-align:left;

    }

    .course-explorer__control--next{

        flex-direction:row-reverse;

    }

    .course-explorer__control--next
    .course-explorer__control-text{

        flex:1;

    }

}

/*==========================================================
=                CORRECTIONS ELEMENTOR                     =
==========================================================*/

.course-explorer,
.course-explorer *{

    box-sizing:border-box;

}

.course-explorer button{

    font:inherit;

    appearance:none;
    -webkit-appearance:none;

}

.course-explorer h2,
.course-explorer h3,
.course-explorer p{

    padding:0;

}

.course-explorer a,
.course-explorer button{

    -webkit-tap-highlight-color:transparent;

}

.course-explorer__hole-button,
.course-explorer__image-button,
.course-explorer__control{

    text-decoration:none;

}

/*==========================================================
=               ACCESSIBILITÉ ET INTERACTIONS              =
==========================================================*/

.course-explorer button:focus-visible{

    position:relative;
    z-index:30;

}

.course-explorer button[aria-pressed="true"]{

    cursor:default;

}

.course-explorer__hole-button[aria-pressed="true"],
.course-explorer__image-button[aria-pressed="true"]{

    pointer-events:none;

}

.course-explorer__control:disabled
.course-explorer__control-arrow{

    opacity:.7;

}

/*==========================================================
=                 APPAREILS TACTILES                       =
==========================================================*/

@media (hover:none){

    .course-explorer__viewer:hover,
    .course-explorer__card:hover,
    .course-explorer__hole-button:hover,
    .course-explorer__distance:hover,
    .course-explorer__control:hover:not(:disabled){

        transform:none;

    }

    .course-explorer__viewer-image:hover
    .course-explorer__main-image{

        transform:scale(1.015);

    }

}

/*==========================================================
=                RÉDUCTION DES ANIMATIONS                  =
==========================================================*/

@media (prefers-reduced-motion:reduce){

    .course-explorer *,
    .course-explorer *::before,
    .course-explorer *::after{

        scroll-behavior:auto !important;

        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;

        transition-duration:.01ms !important;
        transition-delay:0ms !important;

    }

    .course-explorer__main-image{

        transform:none !important;

    }

}

/*==========================================================
=                 CONTRASTE RENFORCÉ                       =
==========================================================*/

@media (prefers-contrast:more){

    .course-explorer__hole-button,
    .course-explorer__viewer-frame,
    .course-explorer__card,
    .course-explorer__metadata,
    .course-explorer__distance,
    .course-explorer__pro-tip,
    .course-explorer__control{

        border-color:rgba(23,51,38,.38);

    }

    .course-explorer__intro,
    .course-explorer__viewer-caption p,
    .course-explorer__metadata-label,
    .course-explorer__distance-label{

        color:var(--course-green-dark);

    }

}

/*==========================================================
=                   IMPRESSION                             =
==========================================================*/

@media print{

    .course-explorer{

        padding:30px 0;

        background:#FFF;

    }

    .course-explorer::before,
    .course-explorer::after,
    .course-explorer__hole-navigation,
    .course-explorer__image-navigation,
    .course-explorer__viewer-caption,
    .course-explorer__controls,
    .course-explorer__loader{

        display:none !important;

    }

    .course-explorer__layout{

        display:block;

    }

    .course-explorer__viewer,
    .course-explorer__card{

        margin-bottom:24px;

        box-shadow:none;

        break-inside:avoid;

    }

    .course-explorer__viewer-image{

        min-height:420px;

    }

}


/*==========================================================
=     CORRECTIF DÉFINITIF — PHOTO JUSQU’AUX BOUTONS        =
==========================================================*/

/* Les deux colonnes ont la même hauteur */
.course-explorer__layout{
    align-items:stretch;
}

/* La colonne photo utilise toute la hauteur disponible */
.course-explorer__viewer{
    display:flex;
    flex-direction:column;
    height:100%;
    overflow:visible;
}

/* Le cadre contient la photo puis les deux boutons */
.course-explorer__viewer-frame{
    position:relative;

    display:flex;
    flex-direction:column;

    flex:1;
    width:100%;
    height:100%;
    min-height:0;

    overflow:hidden;

    border-radius:var(--course-radius);
    background:var(--course-green-dark);
}

/* La zone photo prend automatiquement tout l’espace libre */
.course-explorer__viewer-image{
    position:relative;

    flex:1 1 auto;

    width:100%;
    height:auto;
    min-height:0;

    overflow:hidden;
    isolation:isolate;
}

/* L’image remplit entièrement la zone photo */
.course-explorer__main-image{
    position:absolute;
    inset:0;

    width:100% !important;
    height:100% !important;
    max-width:none !important;

    object-fit:cover;
    object-position:center;

    display:block;
}

/* Les boutons restent dans le flux, juste sous la photo */
.course-explorer__image-navigation{
    position:relative;
    z-index:20;

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));

    flex:0 0 auto;
    width:100%;

    border-top:1px solid rgba(32,71,54,.14);

    background:rgba(248,245,239,.98);
}

/* Annulation des anciennes règles de superposition */
.course-explorer__viewer-image,
.course-explorer__image-navigation{
    grid-area:unset !important;
    align-self:auto;
}

/* Le numéro reste dans la photo */
.course-explorer__viewer-hole{
    right:30px;
    bottom:30px;
    left:30px;
}

/* Le cadre intérieur entoure uniquement la photo */
.course-explorer__viewer-border{
    top:12px;
    right:12px;
    bottom:12px;
    left:12px;
}


/*==========================================================
=                       DESKTOP                            =
==========================================================*/

@media (min-width:1025px){

    .course-explorer__viewer-frame{
        min-height:100%;
    }

    .course-explorer__viewer-image{
        min-height:720px;
    }

}


/*==========================================================
=                       TABLETTE                           =
==========================================================*/

@media (min-width:768px) and (max-width:1024px){

    .course-explorer__viewer{
        height:auto;
    }

    .course-explorer__viewer-frame{
        height:auto;
    }

    .course-explorer__viewer-image{
        flex:none;
        height:650px;
        min-height:650px;
    }

}

/*==========================================================
=          MOBILE PREMIUM - BOUTONS PHOTO                  =
==========================================================*/

@media (max-width:767px){

    .course-explorer__image-navigation{

        display:grid;
        grid-template-columns:repeat(2,1fr);

    }

    .course-explorer__image-button{

        display:flex;
        align-items:center;
        justify-content:center;

        gap:10px;

        min-height:72px;

        padding:12px;

    }

    /* On masque le petit texte "AFFICHER" */

    .course-explorer__image-button-text small{

        display:none;

    }

    /* On affiche simplement "Départ" et "Panneau" */

    .course-explorer__image-button-text strong{

        white-space:normal;
        overflow:visible;
        text-overflow:unset;

        font-size:15px;
        font-weight:700;
        line-height:1.1;

    }

    .course-explorer__image-button[data-view="departure"] 
    .course-explorer__image-button-text strong{

        font-size:0;

    }

    .course-explorer__image-button[data-view="departure"] 
    .course-explorer__image-button-text strong::after{

        content:"Départ";

        font-size:15px;

    }

    .course-explorer__image-button[data-view="sign"] 
    .course-explorer__image-button-text strong{

        font-size:0;

    }

    .course-explorer__image-button[data-view="sign"] 
    .course-explorer__image-button-text strong::after{

        content:"Panneau";

        font-size:15px;

    }

    /* Plus de flèche */

    .course-explorer__image-button-arrow{

        display:none;

    }

    /* Petit numéro plus discret */

    .course-explorer__image-button-number{

        width:34px;
        height:34px;

        flex:0 0 34px;

        font-size:15px;

    }

}

/*==========================================================
=                  PETITS TÉLÉPHONES                       =
==========================================================*/

@media (max-width:420px){

    .course-explorer__viewer-image{
        height:440px;
        min-height:440px;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-99362e3 *//*==========================================================
=                PRÉPAREZ VOTRE PARTIE                     =
==========================================================*/

.visit-preparation,
.visit-preparation *{
    box-sizing:border-box;
}

.visit-preparation{
    --vp-green:#123f31;
    --vp-green-dark:#0a2f24;
    --vp-green-soft:#1d5944;
    --vp-gold:#d7ad59;
    --vp-cream:#f6f2e8;
    --vp-cream-light:#fbf9f3;
    --vp-text:#68776f;
    --vp-border:rgba(18,63,49,.15);

    position:relative;

    width:100%;
    overflow:hidden;

    padding:115px 30px;

    background:#fbfaf6;
}

.visit-preparation::before{
    content:"";

    position:absolute;
    top:0;
    left:50%;

    width:min(1120px,calc(100% - 60px));
    height:1px;

    transform:translateX(-50%);

    background:var(--vp-border);
}

.visit-preparation__container{
    position:relative;
    z-index:1;

    width:min(1120px,100%);
    margin:0 auto;
}


/*==========================================================
=                       EN-TÊTE                            =
==========================================================*/

.visit-preparation__header{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
    align-items:end;
    gap:70px;

    margin-bottom:58px;
}

.visit-preparation__eyebrow{
    display:flex;
    align-items:center;
    gap:14px;

    margin-bottom:18px;

    color:var(--vp-gold);

    font-size:11px;
    font-weight:700;
    letter-spacing:.23em;
    text-transform:uppercase;
}

.visit-preparation__eyebrow::before{
    content:"";

    width:36px;
    height:1px;

    background:var(--vp-gold);
}

.visit-preparation__title{
    margin:0;

    color:var(--vp-green);

    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:clamp(50px,5.2vw,76px);
    font-weight:500;
    line-height:.88;
    letter-spacing:-.04em;
}

.visit-preparation__title em{
    display:block;

    margin-top:10px;

    color:var(--vp-gold);

    font-weight:400;
}

.visit-preparation__introduction{
    max-width:405px;
}

.visit-preparation__introduction p{
    margin:0;

    color:var(--vp-text);

    font-size:16px;
    line-height:1.75;
}


/*==========================================================
=                       GRILLE                             =
==========================================================*/

.visit-preparation__grid{
    display:grid;
    grid-template-columns:1.35fr 1fr 1fr;
    gap:18px;
}


/*==========================================================
=                       CARTES                             =
==========================================================*/

.visit-preparation__card{
    position:relative;

    min-height:565px;
    overflow:hidden;

    border:1px solid var(--vp-border);
    border-radius:28px;

    box-shadow:
        0 25px 60px rgba(18,63,49,.08),
        inset 0 1px 0 rgba(255,255,255,.28);

    transition:
        transform .45s cubic-bezier(.2,.7,.2,1),
        box-shadow .45s ease;
}

.visit-preparation__card:hover{
    transform:translateY(-8px);

    box-shadow:
        0 35px 80px rgba(18,63,49,.14),
        inset 0 1px 0 rgba(255,255,255,.35);
}

.visit-preparation__card-link{
    position:absolute;
    inset:0;

    display:flex;
    flex-direction:column;

    color:inherit;
    text-decoration:none;
}

.visit-preparation__card-link:focus-visible{
    outline:3px solid var(--vp-gold);
    outline-offset:-6px;

    border-radius:28px;
}


/*==========================================================
=                 SUPPRESSION DES VISUELS                  =
==========================================================*/

.visit-preparation__image,
.visit-preparation__overlay,
.visit-preparation__decorative-number,
.visit-preparation__decorative-line,
.visit-preparation__practice-illustration{
    display:none !important;
}


/*==========================================================
=                  FONDS UNIS DES CARTES                   =
==========================================================*/

.visit-preparation__card--large{
    background:var(--vp-green-dark);
}

.visit-preparation__card:nth-child(2){
    background:var(--vp-green);
}

.visit-preparation__card:nth-child(3){
    background:var(--vp-cream);
}

.visit-preparation__card-background{
    position:absolute;
    inset:0;
}

.visit-preparation__card-background--green{
    background:var(--vp-green);
}

.visit-preparation__card-background--cream{
    background:var(--vp-cream);
}


/*==========================================================
=                     HAUT DES CARTES                      =
==========================================================*/

.visit-preparation__card-top{
    position:relative;
    z-index:3;

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:27px 28px;
}

.visit-preparation__index,
.visit-preparation__category{
    font-size:10px;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.visit-preparation__card--large .visit-preparation__index,
.visit-preparation__card--large .visit-preparation__category{
    color:rgba(255,255,255,.78);
}

.visit-preparation__card:nth-child(2) .visit-preparation__index,
.visit-preparation__card:nth-child(2) .visit-preparation__category{
    color:var(--vp-gold);
}

.visit-preparation__card:nth-child(3) .visit-preparation__index,
.visit-preparation__card:nth-child(3) .visit-preparation__category{
    color:var(--vp-gold);
}


/*==========================================================
=                 CONTENU DES CARTES                       =
==========================================================*/

.visit-preparation__card-content{
    position:relative;
    z-index:3;

    display:flex;
    flex-direction:column;

    margin-top:auto;
    padding:35px 30px 31px;
}

.visit-preparation__card-label{
    display:block;

    margin-bottom:14px;

    color:var(--vp-gold);

    font-size:10px;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.visit-preparation__card h3{
    margin:0 0 20px;

    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:42px;
    font-weight:500;
    line-height:.92;
    letter-spacing:-.035em;
}

.visit-preparation__card h3 em{
    display:block;

    margin-top:5px;

    color:var(--vp-gold);

    font-weight:400;
}

.visit-preparation__card p{
    max-width:330px;
    margin:0 0 28px;

    font-size:13px;
    line-height:1.7;
}


/* Carte 1 */

.visit-preparation__card--large h3{
    color:#fff;
    font-size:51px;
}

.visit-preparation__card--large p{
    color:rgba(255,255,255,.72);
}


/* Carte 2 */

.visit-preparation__card:nth-child(2) h3{
    color:#fff;
}

.visit-preparation__card:nth-child(2) p{
    color:rgba(255,255,255,.68);
}


/* Carte 3 */

.visit-preparation__card:nth-child(3) h3{
    color:var(--vp-green);
}

.visit-preparation__card:nth-child(3) p{
    color:var(--vp-text);
}


/*==========================================================
=                    ACTION DES CARTES                     =
==========================================================*/

.visit-preparation__action{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;

    padding-top:20px;

    font-size:12px;
    font-weight:700;
}

.visit-preparation__card--large .visit-preparation__action,
.visit-preparation__card:nth-child(2) .visit-preparation__action{
    border-top:1px solid rgba(255,255,255,.18);

    color:#fff;
}

.visit-preparation__card:nth-child(3) .visit-preparation__action{
    border-top:1px solid rgba(18,63,49,.15);

    color:var(--vp-green);
}

.visit-preparation__arrow{
    display:flex;
    align-items:center;
    justify-content:center;

    width:39px;
    height:39px;

    flex:0 0 39px;

    border-radius:50%;

    font-size:16px;

    transition:
        transform .35s ease,
        background-color .35s ease,
        color .35s ease;
}

.visit-preparation__card--large .visit-preparation__arrow,
.visit-preparation__card:nth-child(2) .visit-preparation__arrow{
    color:var(--vp-green-dark);
    background:var(--vp-gold);
}

.visit-preparation__card:nth-child(3) .visit-preparation__arrow{
    color:#fff;
    background:var(--vp-green);
}

.visit-preparation__card:hover .visit-preparation__arrow{
    transform:translate(3px,-3px);

    color:var(--vp-green-dark);
    background:var(--vp-gold);
}

/*==========================================================
=                       PIED                               =
==========================================================*/

.visit-preparation__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;

    margin-top:42px;
    padding-top:31px;

    border-top:1px solid var(--vp-border);
}

.visit-preparation__footer-note{
    display:flex;
    align-items:center;
    gap:15px;

    max-width:620px;
}

.visit-preparation__footer-icon{
    display:flex;
    align-items:center;
    justify-content:center;

    width:32px;
    height:32px;

    flex:0 0 32px;

    border:1px solid rgba(18,63,49,.22);
    border-radius:50%;

    color:var(--vp-green);

    font-size:19px;
    font-weight:300;
}

.visit-preparation__footer p{
    margin:0;

    color:var(--vp-text);

    font-size:13px;
    line-height:1.6;
}

.visit-preparation__contact{
    display:flex;
    align-items:center;
    gap:26px;

    padding:0 0 6px;

    border:0;
    border-bottom:1px solid var(--vp-gold);

    color:var(--vp-green);
    background:transparent;

    font-family:inherit;
    font-size:13px;
    font-weight:700;
    line-height:1.4;
    text-decoration:none;

    cursor:pointer;

    appearance:none;
    -webkit-appearance:none;

    transition:
        color .25s ease,
        border-color .25s ease;
}

.visit-preparation__contact:hover{
    color:var(--vp-gold);
}

.visit-preparation__contact:focus-visible{
    outline:2px solid var(--vp-gold);
    outline-offset:6px;

    border-radius:4px;
}


/*==========================================================
=                     POP-UP CONTACT                       =
==========================================================*/

.golf-contact-modal,
.golf-contact-modal *{
    box-sizing:border-box;
}

.golf-contact-modal{
    --vp-green:#123f31;
    --vp-green-dark:#0a2f24;
    --vp-green-soft:#1d5944;
    --vp-gold:#d7ad59;
    --vp-cream:#f6f2e8;
    --vp-cream-light:#fbf9f3;

    position:fixed;
    inset:0;
    z-index:999999;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:24px;

    visibility:hidden;
    opacity:0;
    pointer-events:none;

    transition:
        opacity .35s ease,
        visibility .35s ease;
}

.golf-contact-modal.is-open{
    visibility:visible;
    opacity:1;
    pointer-events:auto;
}


/*==========================================================
=                  ARRIÈRE-PLAN DU POP-UP                  =
==========================================================*/

.golf-contact-modal__backdrop{
    position:absolute;
    inset:0;

    background:rgba(5,35,29,.72);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    cursor:pointer;
}


/*==========================================================
=                   FENÊTRE DU POP-UP                      =
==========================================================*/

.golf-contact-modal__dialog{
    position:relative;
    z-index:2;

    width:min(760px,100%);
    max-height:calc(100vh - 48px);

    overflow-y:auto;
    overscroll-behavior:contain;

    padding:28px;

    border-radius:42px;

    background:var(--vp-green);

    box-shadow:
        0 35px 90px rgba(0,0,0,.38),
        inset 0 1px 0 rgba(255,255,255,.08);

    transform:translateY(30px) scale(.96);

    transition:
        transform .42s cubic-bezier(.2,.7,.2,1);
}

.golf-contact-modal.is-open .golf-contact-modal__dialog{
    transform:translateY(0) scale(1);
}

.golf-contact-modal__dialog::before{
    content:"";

    position:absolute;
    inset:24px;

    border:1px solid rgba(255,255,255,.28);
    border-radius:30px;

    pointer-events:none;
}


/*==========================================================
=                    CONTENU INTÉRIEUR                     =
==========================================================*/

.golf-contact-modal__inner{
    position:relative;
    z-index:1;

    padding:55px 50px 42px;

    text-align:center;
}


/*==========================================================
=                   BOUTON DE FERMETURE                    =
==========================================================*/

.golf-contact-modal__close{
    position:absolute;
    top:42px;
    right:42px;
    z-index:3;

    display:flex;
    align-items:center;
    justify-content:center;

    width:54px;
    height:54px;

    padding:0;

    border:0;
    border-radius:50%;

    color:#fff;
    background:rgba(255,255,255,.1);

    font-family:Arial,sans-serif;
    font-size:38px;
    font-weight:200;
    line-height:1;

    cursor:pointer;

    appearance:none;
    -webkit-appearance:none;

    transition:
        background-color .25s ease,
        transform .25s ease;
}

.golf-contact-modal__close:hover{
    background:rgba(255,255,255,.18);
    transform:rotate(5deg);
}

.golf-contact-modal__close:focus-visible{
    outline:2px solid var(--vp-gold);
    outline-offset:4px;
}


/*==========================================================
=                         LOGO                             =
==========================================================*/

.golf-contact-modal__logo-wrapper{
    display:flex;
    align-items:center;
    justify-content:center;

    width:170px;
    height:170px;

    margin:0 auto 36px;
    padding:18px;

    overflow:hidden;

    border-radius:50%;

    background:#fff;

    box-shadow:
        0 18px 40px rgba(0,0,0,.18),
        inset 0 0 0 1px rgba(18,63,49,.08);
}

.golf-contact-modal__logo{
    display:block;

    width:100%;
    height:100%;

    object-fit:contain;
}


/*==========================================================
=                       TEXTES                             =
==========================================================*/

.golf-contact-modal__eyebrow{
    display:block;

    margin-bottom:23px;

    color:var(--vp-gold);

    font-size:12px;
    font-weight:700;
    line-height:1.5;
    letter-spacing:.23em;
    text-transform:uppercase;
}

.golf-contact-modal__title{
    margin:0 0 15px;

    color:#fff;

    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:clamp(48px,6vw,66px);
    font-weight:500;
    line-height:.95;
    letter-spacing:-.035em;
}

.golf-contact-modal__description{
    max-width:560px;

    margin:0 auto 38px;

    color:rgba(255,255,255,.67);

    font-size:16px;
    line-height:1.7;
}


/*==========================================================
=                INFORMATIONS DE CONTACT                   =
==========================================================*/

.golf-contact-modal__details{
    display:grid;
    gap:14px;
}

.golf-contact-modal__item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    min-height:94px;

    padding:16px 18px 16px 32px;

    border:1px solid rgba(255,255,255,.14);
    border-radius:50px;

    color:var(--vp-green);
    background:#fff;

    text-align:left;
    text-decoration:none;

    box-shadow:
        0 12px 30px rgba(0,0,0,.08);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background-color .3s ease;
}

.golf-contact-modal__item:hover{
    transform:translateY(-3px);

    background:var(--vp-cream-light);

    box-shadow:
        0 18px 38px rgba(0,0,0,.16);
}

.golf-contact-modal__item:focus-visible{
    outline:2px solid var(--vp-gold);
    outline-offset:4px;
}

.golf-contact-modal__item-content{
    display:flex;
    flex-direction:column;
    gap:7px;

    min-width:0;
}

.golf-contact-modal__item-label{
    color:var(--vp-gold);

    font-size:10px;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.golf-contact-modal__item-value{
    color:var(--vp-green);

    font-size:clamp(18px,3vw,27px);
    font-weight:500;
    line-height:1.2;

    overflow-wrap:anywhere;
}

.golf-contact-modal__item-arrow{
    display:flex;
    align-items:center;
    justify-content:center;

    width:62px;
    height:62px;

    flex:0 0 62px;

    border-radius:50%;

    color:#fff;
    background:var(--vp-green);

    font-size:24px;

    transition:
        transform .3s ease,
        background-color .3s ease,
        color .3s ease;
}

.golf-contact-modal__item:hover .golf-contact-modal__item-arrow{
    transform:translate(2px,-2px);

    color:var(--vp-green-dark);
    background:var(--vp-gold);
}


/*==========================================================
=                      NOTE DU BAS                         =
==========================================================*/

.golf-contact-modal__note{
    margin:30px 0 0;

    color:rgba(255,255,255,.55);

    font-size:13px;
    line-height:1.6;
}


/*==========================================================
=                BLOCAGE DU DÉFILEMENT                     =
==========================================================*/

body.golf-contact-modal-open{
    overflow:hidden;
}

/*==========================================================
=                       TABLETTE                           =
==========================================================*/

@media (max-width:1024px){

    .visit-preparation{
        padding:90px 28px;
    }

    .visit-preparation__header{
        grid-template-columns:1fr;
        gap:28px;
    }

    .visit-preparation__introduction{
        max-width:650px;
    }

    .visit-preparation__grid{
        grid-template-columns:repeat(2,1fr);
    }

    .visit-preparation__card--large{
        grid-column:1 / -1;
        min-height:540px;
    }

    .visit-preparation__card:not(.visit-preparation__card--large){
        min-height:510px;
    }

}


/*==========================================================
=                        MOBILE                            =
==========================================================*/

@media (max-width:767px){

    .visit-preparation{
        padding:72px 15px;
    }

    .visit-preparation::before{
        width:calc(100% - 30px);
    }

    .visit-preparation__header{
        gap:24px;
        margin-bottom:38px;
    }

    .visit-preparation__eyebrow{
        gap:10px;

        margin-bottom:14px;

        font-size:9px;
        letter-spacing:.18em;
    }

    .visit-preparation__eyebrow::before{
        width:25px;
    }

    .visit-preparation__title{
        font-size:45px;
        line-height:.9;
    }

    .visit-preparation__introduction p{
        font-size:14px;
        line-height:1.65;
    }

    .visit-preparation__grid{
        display:flex;
        flex-direction:column;
        gap:14px;
    }

    .visit-preparation__card,
    .visit-preparation__card--large{
        min-height:430px;

        border-radius:21px;
    }

    .visit-preparation__card-link:focus-visible{
        border-radius:21px;
    }

    .visit-preparation__card-top{
        padding:23px 22px;
    }

    .visit-preparation__card-content{
        padding:30px 23px 24px;
    }

    .visit-preparation__card h3,
    .visit-preparation__card--large h3{
        font-size:40px;
    }

    .visit-preparation__card p{
        font-size:13px;
    }

    .visit-preparation__footer{
        display:block;

        margin-top:32px;
        padding-top:27px;
    }

    .visit-preparation__contact{
        justify-content:space-between;

        width:100%;
        margin-top:25px;
    }


    /* POP-UP MOBILE */

    .golf-contact-modal{
        align-items:center;

        padding:12px;
    }

    .golf-contact-modal__dialog{
        width:100%;
        max-height:calc(100vh - 24px);

        padding:14px;

        border-radius:28px;
    }

    .golf-contact-modal__dialog::before{
        inset:12px;

        border-radius:21px;
    }

    .golf-contact-modal__inner{
        padding:62px 18px 28px;
    }

    .golf-contact-modal__close{
        top:26px;
        right:26px;

        width:46px;
        height:46px;

        font-size:32px;
    }

    .golf-contact-modal__logo-wrapper{
        width:125px;
        height:125px;

        margin-bottom:27px;
        padding:13px;
    }

    .golf-contact-modal__eyebrow{
        margin-bottom:17px;

        font-size:9px;
        letter-spacing:.18em;
    }

    .golf-contact-modal__title{
        font-size:43px;
    }

    .golf-contact-modal__description{
        margin-bottom:27px;

        font-size:14px;
        line-height:1.6;
    }

    .golf-contact-modal__item{
        min-height:80px;

        gap:12px;

        padding:13px 13px 13px 21px;

        border-radius:28px;
    }

    .golf-contact-modal__item-value{
        font-size:17px;
    }

    .golf-contact-modal__item-arrow{
        width:50px;
        height:50px;

        flex-basis:50px;

        font-size:20px;
    }

    .golf-contact-modal__note{
        margin-top:24px;

        font-size:12px;
    }

}


/*==========================================================
=                 PETITS TÉLÉPHONES                        =
==========================================================*/

@media (max-width:390px){

    .visit-preparation__title{
        font-size:40px;
    }

    .visit-preparation__card,
    .visit-preparation__card--large{
        min-height:395px;
    }

    .visit-preparation__card h3,
    .visit-preparation__card--large h3{
        font-size:36px;
    }


    /* POP-UP PETITS TÉLÉPHONES */

    .golf-contact-modal__inner{
        padding-right:14px;
        padding-left:14px;
    }

    .golf-contact-modal__logo-wrapper{
        width:105px;
        height:105px;
    }

    .golf-contact-modal__title{
        font-size:38px;
    }

    .golf-contact-modal__description{
        font-size:13px;
    }

    .golf-contact-modal__item{
        padding-left:17px;
    }

    .golf-contact-modal__item-value{
        font-size:15px;
    }

    .golf-contact-modal__item-arrow{
        width:46px;
        height:46px;

        flex-basis:46px;
    }

}


/*==========================================================
=               RÉDUCTION DES ANIMATIONS                   =
==========================================================*/

@media (prefers-reduced-motion:reduce){

    .visit-preparation__card,
    .visit-preparation__arrow,
    .visit-preparation__contact,
    .golf-contact-modal,
    .golf-contact-modal__dialog,
    .golf-contact-modal__close,
    .golf-contact-modal__item,
    .golf-contact-modal__item-arrow{
        transition:none;
    }

}/* End custom CSS */