:root {
  --noir: #07090c;
  --noir-2: #0d1116;
  --noir-3: #161b22;
  --gris: #707a85;
  --blanc: #ffffff;
  --clair: #f5f6f7;
  --accent: #d4a349;
  --accent-clair: #f0ca78;
  --rouge: #b6221e;
  --bleu: #2182b7;
  --largeur: 1180px;
  --ombre: 0 22px 55px rgba(0,0,0,.20);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  color: var(--blanc);
  background: var(--noir);
  font-family: "Inter", system-ui, sans-serif;
  line-height: 1.6;
}

body.visionneuse-ouverte { overflow: hidden; }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.conteneur {
  width: min(calc(100% - 40px), var(--largeur));
  margin-inline: auto;
}

/* TOP */
.barre-haute {
  height: 32px;
  display: flex;
  align-items: center;
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 120;
  background: var(--accent);
  color: var(--noir);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.barre-haute-contenu {
  display: flex;
  justify-content: space-between;
  gap: 30px;
}

.entete {
  position: fixed;
  inset: 32px 0 auto 0;
  z-index: 110;
  background: rgba(7,9,12,.90);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.barre-navigation {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.marque {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.marque-simple {
  color: var(--accent);
  font: 800 26px/1 "Barlow Condensed", sans-serif;
  letter-spacing: .07em;
}

.marque-texte {
  display: flex;
  flex-direction: column;
  line-height: 1.03;
}

.marque-texte strong {
  font: 800 17px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
  letter-spacing: .025em;
}

.marque-texte small {
  margin-top: 4px;
  color: #929ca7;
  font-size: 9px;
}

.navigation-principale {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 11px;
  font-weight: 700;
}

.navigation-principale > a:not(.bouton) {
  color: #d1d6dc;
  transition: color .2s ease;
}

.navigation-principale > a:not(.bouton):hover { color: var(--accent); }

.bouton-menu {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.bouton-menu span {
  display: block;
  height: 2px;
  margin: 6px 0;
  background: #fff;
}

/* BUTTONS */
.bouton {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  padding: 0 23px;
  background: var(--accent);
  border: 1px solid var(--accent);
  color: var(--noir);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.bouton:hover {
  transform: translateY(-2px);
  background: var(--accent-clair);
  border-color: var(--accent-clair);
}

.bouton-secondaire {
  color: #fff;
  background: transparent;
  border-color: rgba(255,255,255,.36);
}

.bouton-secondaire:hover { background: rgba(255,255,255,.08); }

.bouton-petit {
  min-height: 38px;
  padding: 0 14px;
  font-size: 10px;
}

/* HERO */
.hero {
  min-height: 930px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 185px 0 80px;
}

.hero-photo {
  position: absolute;
  inset: 0;
  background-image: url("../ressources/images/photo_equipe_officielle.jpg");
  background-size: cover;
  background-position: center;
}

.hero-voile {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(3,4,6,.98) 0%, rgba(3,4,6,.92) 33%, rgba(3,4,6,.56) 61%, rgba(3,4,6,.28) 100%),
    linear-gradient(0deg, rgba(3,4,6,.90) 0%, transparent 40%, rgba(3,4,6,.32) 100%);
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 180px;
  background: linear-gradient(to bottom, transparent, var(--noir));
}

.hero-contenu {
  position: relative;
  z-index: 3;
}

.hero-colonne {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.hero-logo {
  width: 145px;
  height: auto;
  flex: 0 0 auto;
  margin-top: 7px;
  filter: drop-shadow(0 15px 24px rgba(0,0,0,.45));
}

.hero-texte { max-width: 720px; }

.surtitre {
  margin: 0 0 18px;
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .2em;
}

.hero h1,
.section h2 {
  margin: 0;
  font-family: "Barlow Condensed", sans-serif;
  text-transform: uppercase;
  line-height: .94;
  letter-spacing: -.025em;
}

.hero h1 {
  max-width: 800px;
  font-size: clamp(70px, 8.6vw, 126px);
  text-shadow: 0 5px 30px rgba(0,0,0,.52);
}

.hero h1 span { color: var(--accent); }

.hero-description {
  max-width: 650px;
  margin: 24px 0 0;
  color: #d0d5db;
  font-size: 17px;
  text-shadow: 0 2px 14px rgba(0,0,0,.9);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}

.hero-fiche {
  width: 305px;
  position: absolute;
  right: 0;
  top: 88px;
  padding: 27px;
  background: rgba(7,9,12,.88);
  border: 1px solid rgba(255,255,255,.12);
  border-top: 3px solid var(--accent);
  backdrop-filter: blur(14px);
  box-shadow: var(--ombre);
}

.hero-fiche-label,
.contact-carte-label {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .15em;
}

.hero-fiche > strong {
  display: block;
  margin-top: 16px;
  font: 800 31px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.hero-fiche p {
  color: #b7bfc8;
  font-size: 13px;
}

.mini-info {
  display: flex;
  gap: 12px;
  margin: 21px 0;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.mini-info div { display: flex; flex-direction: column; }
.mini-info small { color: #8f99a4; }
.hero-fiche > a { color: var(--accent); font-weight: 800; font-size: 13px; }

.hero-indicateurs {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  max-width: 840px;
  margin-top: 68px;
  border-top: 1px solid rgba(255,255,255,.18);
}

.hero-indicateurs div {
  display: flex;
  flex-direction: column;
  padding: 22px 18px 0 0;
}

.hero-indicateurs strong {
  color: var(--accent);
  font: 800 39px/1 "Barlow Condensed", sans-serif;
}

.hero-indicateurs span {
  color: #b5bdc5;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* BAND */
.bandeau-marque {
  overflow: hidden;
  padding: 15px 0;
  background: var(--accent);
  color: var(--noir);
}

.defilement {
  width: max-content;
  min-width: 100%;
  display: flex;
  justify-content: center;
  gap: 23px;
  align-items: center;
  padding-inline: 24px;
  white-space: nowrap;
  font: 800 19px/1 "Barlow Condensed", sans-serif;
  letter-spacing: .05em;
}

.defilement i { font-size: 8px; }

/* COMMON */
.section { padding: 105px 0; }
.section-claire { color: var(--noir); background: var(--clair); }
.section-sombre { background: var(--noir-2); }
.section h2 { font-size: clamp(48px, 6vw, 78px); }

.texte-intro {
  max-width: 720px;
  color: #59636d;
  font-size: 17px;
}

.texte-clair { color: #abb4bd; }

.entete-section {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 50px;
}

.entete-section > p {
  max-width: 470px;
  color: #9da6b0;
}

.entete-section-clair > p { color: #65707b; }

/* CLUB */
.presentation-club {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 62px;
  align-items: center;
}

.liste-atouts { margin-top: 44px; }

.liste-atouts article {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 17px;
  padding: 22px 0;
  border-top: 1px solid #dce1e5;
}

.liste-atouts span {
  color: #a1a8b0;
  font: 700 20px/1 "Barlow Condensed", sans-serif;
}

.liste-atouts h3 {
  margin: 0 0 6px;
  font: 800 27px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.liste-atouts p { margin: 0; color: #68727d; }

.photo-club-principale {
  margin: 0;
  min-height: 535px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--ombre);
  background: #111;
}

.photo-club-principale img {
  width: 100%;
  height: 535px;
  object-fit: cover;
}

.photo-club-principale::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.73), transparent 45%);
}

.photo-club-principale figcaption {
  position: absolute;
  z-index: 2;
  left: 23px;
  right: 23px;
  bottom: 20px;
  color: #fff;
  font: 700 18px/1.15 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

/* DISCIPLINES */
.grille-cartes {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 16px;
  margin-top: 48px;
}

.carte-discipline {
  position: relative;
  min-height: 350px;
  padding: 31px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.085);
  background: linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
}

.carte-discipline-active {
  border-color: rgba(212,163,73,.45);
  background:
    radial-gradient(circle at 85% 10%, rgba(212,163,73,.13), transparent 32%),
    linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.01));
}

.numero {
  color: var(--accent);
  font: 800 14px/1 "Barlow Condensed", sans-serif;
}

.icone-discipline {
  position: absolute;
  right: 24px;
  top: 24px;
  color: rgba(255,255,255,.055);
  font: 800 70px/1 "Barlow Condensed", sans-serif;
}

.carte-discipline h3 {
  margin: 82px 0 6px;
  font: 800 42px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.carte-discipline p { color: #aeb6bf; }

.carte-discipline > span {
  margin-top: auto;
  padding-top: 23px;
  border-top: 1px solid rgba(255,255,255,.08);
  color: var(--accent);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

/* ACTUALITES */
.section-actualites { background: #080b0f; }

.actualites-visuelles {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.actualite-visuelle {
  min-width: 0;
  overflow: hidden;
  background: #131820;
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: var(--ombre);
}

.actualite-image,
.actualite-photo-fond {
  width: 100%;
  height: 260px;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #0b0d11;
}

.actualite-image {
  cursor: zoom-in;
}

.actualite-image img,
.actualite-photo-fond img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.actualite-reprise .actualite-image img {
  object-fit: contain;
  background: #090909;
}

.actualite-image:hover img { transform: scale(1.025); }

.actualite-corps {
  padding: 25px;
}

.badge-actualite {
  display: inline-flex;
  min-height: 25px;
  align-items: center;
  padding: 0 9px;
  border-radius: 99px;
  background: var(--rouge);
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.badge-or { color: #151515; background: var(--accent); }
.badge-bleu { background: var(--bleu); }

.actualite-corps h3 {
  margin: 18px 0 10px;
  font: 800 32px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.actualite-corps p {
  color: #aeb6bf;
  font-size: 14px;
}

.lien-bouton {
  display: inline-block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--accent);
  font-weight: 900;
  cursor: pointer;
}

/* DISCOVER */
.grille-decouverte {
  margin-top: 45px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.carte-info {
  min-height: 260px;
  padding: 27px;
  background: #fff;
  border: 1px solid #dde2e7;
}

.carte-info-forte {
  color: #fff;
  background: var(--noir);
  border-color: var(--noir);
}

.icone-info { font-size: 28px; }

.carte-info h3 {
  margin: 20px 0 10px;
  font: 800 29px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.carte-info p {
  margin: 0;
  color: #68727d;
  font-size: 14px;
}

.carte-info-forte p { color: #c2c9d0; }

.note-paiement {
  margin-top: 16px;
  padding: 23px 25px;
  background: #eceff2;
  border-left: 4px solid var(--accent);
}

.note-paiement strong {
  color: var(--noir);
  text-transform: uppercase;
  font-size: 13px;
}

.note-paiement p {
  margin: 7px 0 0;
  color: #65707b;
}

/* HOURS */
.section-horaires {
  background:
    linear-gradient(90deg, rgba(7,9,12,.98), rgba(7,9,12,.87)),
    url("../ressources/images/photo_entrainement_groupe.jpeg") center/cover;
}

.bloc-horaires {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 85px;
  align-items: center;
}

.planning-sombre { border-top: 3px solid var(--accent); }

.ligne-horaire {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 23px 0;
  border-bottom: 1px solid rgba(255,255,255,.12);
}

.ligne-horaire span {
  display: flex;
  align-items: center;
  gap: 15px;
  color: #c1c8cf;
}

.ligne-horaire small {
  color: #77818c;
  font-weight: 800;
}

.ligne-horaire strong {
  color: #fff;
  font: 800 25px/1 "Barlow Condensed", sans-serif;
}

.adresse-sombre {
  margin-top: 27px;
  padding: 22px;
  display: flex;
  gap: 15px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.08);
}

.adresse-sombre > span { font-size: 24px; }
.adresse-sombre p { margin: 4px 0 0; color: #aeb6bf; }

/* COULISSES */
.chronologie-coulisses {
  margin-top: 46px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}

.etape-coulisses {
  min-width: 0;
  background: #fff;
  border: 1px solid #dde2e7;
}

.photo-coulisses {
  width: 100%;
  height: 245px;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #111;
  cursor: zoom-in;
}

.photo-coulisses img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.photo-coulisses:hover img { transform: scale(1.03); }

.etape-coulisses > div {
  padding: 20px;
}

.etape-coulisses > div > span {
  color: var(--accent);
  font: 800 14px/1 "Barlow Condensed", sans-serif;
}

.etape-coulisses h3 {
  margin: 10px 0 8px;
  color: var(--noir);
  font: 800 25px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.etape-coulisses p {
  margin: 0;
  color: #68727d;
  font-size: 13px;
}

/* PARTNERSHIPS */
.section-partenariats {
  background:
    radial-gradient(circle at 50% 10%, rgba(212,163,73,.09), transparent 32%),
    #0b0e12;
}

.grille-paliers {
  margin-top: 46px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

.palier {
  padding: 29px;
  background: #12171e;
  border: 1px solid rgba(255,255,255,.09);
}

.palier-bronze { border-top: 3px solid #ad6c2a; }
.palier-silver { border-top: 3px solid #b8bdc3; }
.palier-gold { border-top: 3px solid #d5a526; }
.palier-scorpion { border-top: 3px solid #c5231f; }

.palier-entete {
  display: flex;
  align-items: center;
  gap: 14px;
}

.medaille {
  width: 49px;
  height: 49px;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: var(--accent);
  font-size: 21px;
}

.palier-entete small {
  color: #929ba5;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
}

.palier h3 {
  margin: 1px 0 0;
  font: 800 38px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.palier-bronze h3 { color: #c47a30; }
.palier-silver h3 { color: #c4c8cd; }
.palier-gold h3 { color: #e2b630; }
.palier-scorpion h3 { color: #e3312b; }

.prix {
  display: block;
  margin: 22px 0;
  color: #fff;
  font: 800 31px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.prix small {
  color: #969fa9;
  font-size: 16px;
}

.palier ul {
  margin: 0;
  padding-left: 19px;
  color: #b6bec7;
  font-size: 14px;
}

.palier li + li { margin-top: 11px; }
.palier b { color: #fff; }

.partenariat-actions {
  margin-top: 22px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}

/* CONTACT */
.section-contact { background: var(--noir-2); }

.contact {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 72px;
}

.reseaux {
  margin-top: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.reseaux a {
  padding: 11px 15px;
  border: 1px solid rgba(255,255,255,.12);
  font-size: 12px;
  font-weight: 800;
}

.reseaux a:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.contact-carte {
  padding: 32px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.08);
}

.contact-carte > strong {
  display: block;
  margin-top: 17px;
  font: 800 29px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.contact-carte dl { margin: 26px 0; }

.contact-carte dl > div {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 13px;
  padding: 13px 0;
  border-top: 1px solid rgba(255,255,255,.07);
}

.contact-carte dt {
  color: #78828c;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.contact-carte dd {
  margin: 0;
  color: #c3cad1;
  font-size: 13px;
  overflow-wrap: anywhere;
}

/* FOOTER */
.pied-page {
  padding: 28px 0;
  color: #818b96;
  background: #040507;
  border-top: 1px solid rgba(255,255,255,.06);
}

.pied-page-contenu {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 28px;
  align-items: center;
  font-size: 10px;
}

.footer-marque {
  display: flex;
  flex-direction: column;
}

.footer-marque strong {
  color: var(--accent);
  font: 800 24px/1 "Barlow Condensed", sans-serif;
}

.footer-marque span { margin-top: 4px; }

.footer-liens {
  display: flex;
  gap: 15px;
}

.footer-liens a:hover { color: var(--accent); }

/* LIGHTBOX */
.visionneuse {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: none;
  place-items: center;
  padding: 30px;
  background: rgba(0,0,0,.95);
}

.visionneuse.ouverte { display: grid; }

.visionneuse figure {
  margin: 0;
  max-width: min(1200px, 94vw);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.visionneuse img {
  max-width: 100%;
  max-height: 82vh;
  object-fit: contain;
}

.visionneuse figcaption {
  color: #d4d9de;
  text-align: center;
  font-size: 13px;
}

.visionneuse-fermer {
  position: absolute;
  top: 20px;
  right: 25px;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(0,0,0,.35);
  color: #fff;
  font-size: 34px;
  line-height: 1;
  cursor: pointer;
}

/* RESPONSIVE */
@media (max-width: 1120px) {
  .navigation-principale {
    position: absolute;
    top: 78px;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 12px 20px 20px;
    background: #080a0d;
    border-top: 1px solid rgba(255,255,255,.08);
  }

  .navigation-principale.ouverte { display: flex; }
  .navigation-principale a { padding: 13px 10px; }
  .bouton-menu { display: block; }

  .hero-fiche { display: none; }

  .presentation-club,
  .bloc-horaires,
  .contact {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .actualites-visuelles { grid-template-columns: 1fr; }
  .actualite-visuelle { display: grid; grid-template-columns: 300px 1fr; }
  .actualite-image, .actualite-photo-fond { height: 100%; min-height: 250px; }

  .grille-cartes { grid-template-columns: 1fr; }
  .carte-discipline { min-height: 265px; }
  .carte-discipline h3 { margin-top: 44px; }

  .chronologie-coulisses { grid-template-columns: repeat(2, 1fr); }

  .entete-section {
    flex-direction: column;
    align-items: flex-start;
  }

  .pied-page-contenu {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

@media (max-width: 760px) {
  .barre-haute-droite { display: none; }
  .conteneur { width: min(calc(100% - 28px), var(--largeur)); }
  .marque-texte small { display: none; }

  .hero {
    min-height: 920px;
    padding: 175px 0 70px;
  }

  .hero-photo { background-position: 58% center; }

  .hero-voile {
    background:
      linear-gradient(90deg, rgba(3,4,6,.95), rgba(3,4,6,.64)),
      linear-gradient(0deg, rgba(3,4,6,.91), transparent 44%);
  }

  .hero-colonne {
    display: block;
  }

  .hero-logo {
    width: 105px;
    margin: 0 0 18px;
  }

  .hero h1 { font-size: clamp(58px, 17vw, 88px); }
  .hero-description { font-size: 16px; }
  .hero-actions .bouton { width: 100%; }

  .hero-indicateurs {
    grid-template-columns: 1fr 1fr;
    margin-top: 52px;
  }

  .section { padding: 76px 0; }
  .section h2 { font-size: 47px; }

  .photo-club-principale,
  .photo-club-principale img {
    min-height: 390px;
    height: 390px;
  }

  .actualite-visuelle {
    display: block;
  }

  .actualite-image,
  .actualite-photo-fond {
    height: 260px;
  }

  .grille-decouverte { grid-template-columns: 1fr; }

  .chronologie-coulisses { grid-template-columns: 1fr; }
  .photo-coulisses { height: 300px; }

  .grille-paliers { grid-template-columns: 1fr; }

  .contact-carte dl > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .footer-liens { flex-wrap: wrap; }
}

@media (max-width: 470px) {
  .hero-indicateurs { gap: 8px; }
  .hero-logo { width: 90px; }
  .photo-coulisses { height: 245px; }
}


/* ==========================================================
   PAGES INTERNES V0.7
   ========================================================== */

.page-interne {
  padding-top: 110px;
  background: var(--noir);
}

.entete-page {
  position: relative;
  overflow: hidden;
  padding: 115px 0 80px;
  background:
    radial-gradient(circle at 75% 30%, rgba(212,163,73,.13), transparent 28%),
    linear-gradient(120deg, #07090c 20%, #141920 100%);
}

.entete-page::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 100px;
  background: linear-gradient(to bottom, transparent, rgba(7,9,12,.65));
}

.entete-page-contenu {
  position: relative;
  z-index: 2;
  max-width: 900px;
}

.entete-page h1 {
  margin: 0;
  font: 800 clamp(62px, 8vw, 110px)/.92 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
  letter-spacing: -.025em;
}

.entete-page h1 span {
  color: var(--accent);
}

.entete-page p:not(.surtitre) {
  max-width: 710px;
  margin: 24px 0 0;
  color: #bac2ca;
  font-size: 17px;
}

.fil-ariane {
  margin-bottom: 22px;
  color: #8e98a2;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.fil-ariane a {
  color: var(--accent);
}

.centre-action {
  margin-top: 30px;
  display: flex;
  justify-content: center;
}

/* ACTUALITES PAGE */
.sommaire-actualites {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 14px;
  margin-top: 42px;
}

.sommaire-actualites a {
  min-height: 118px;
  padding: 20px;
  background: #151a21;
  border: 1px solid rgba(255,255,255,.08);
  transition: transform .2s ease, border-color .2s ease;
}

.sommaire-actualites a:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
}

.sommaire-actualites small {
  display: block;
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .11em;
}

.sommaire-actualites strong {
  display: block;
  margin-top: 9px;
  font: 800 25px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.article-public {
  scroll-margin-top: 125px;
}

.article-public-clair {
  color: var(--noir);
  background: var(--clair);
}

.article-public-sombre {
  background: var(--noir-2);
}

.article-grille {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(320px,.78fr);
  gap: 65px;
  align-items: start;
}

.article-grille-inversee {
  grid-template-columns: minmax(320px,.78fr) minmax(0,1fr);
}

.article-texte h2 {
  margin: 0;
  font: 800 clamp(48px,6vw,75px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.article-texte h3 {
  margin: 32px 0 10px;
  font: 800 27px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.article-public-clair .article-texte p,
.article-public-clair .article-texte li {
  color: #616b75;
}

.article-public-sombre .article-texte p,
.article-public-sombre .article-texte li {
  color: #aeb6bf;
}

.article-texte ul {
  padding-left: 20px;
}

.article-visuel {
  position: sticky;
  top: 135px;
}

.article-visuel img {
  width: 100%;
  height: auto;
  box-shadow: var(--ombre);
}

.article-visuel-affiche img {
  max-height: 720px;
  object-fit: contain;
  background: #090909;
}

.encadre-article {
  margin-top: 28px;
  padding: 23px 25px;
  border-left: 4px solid var(--accent);
}

.article-public-clair .encadre-article {
  background: #e9edf0;
}

.article-public-sombre .encadre-article {
  background: rgba(255,255,255,.05);
}

.encadre-article strong {
  display: block;
  margin-bottom: 8px;
  text-transform: uppercase;
  font-size: 12px;
}

.info-ligne {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

.info-ligne span {
  padding: 8px 11px;
  border: 1px solid currentColor;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .75;
}

/* PARTENARIATS PAGE */
.intro-partenariat {
  display: grid;
  grid-template-columns: 1fr .75fr;
  gap: 65px;
  align-items: center;
}

.intro-partenariat h2 {
  margin: 0;
  font: 800 clamp(48px,6vw,76px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.intro-partenariat p {
  color: #aeb6bf;
}

.chiffres-partenariat {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.chiffres-partenariat div {
  min-height: 125px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  background: #161b22;
  border: 1px solid rgba(255,255,255,.08);
}

.chiffres-partenariat strong {
  color: var(--accent);
  font: 800 40px/1 "Barlow Condensed", sans-serif;
}

.chiffres-partenariat span {
  margin-top: 7px;
  color: #9ea7b1;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.palier-detail {
  scroll-margin-top: 125px;
}

.palier-detail-grid {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 55px;
  align-items: start;
}

.palier-detail-identite {
  position: sticky;
  top: 135px;
  padding: 28px;
  background: #131820;
  border: 1px solid rgba(255,255,255,.08);
}

.palier-detail-identite small {
  color: #969fa8;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}

.palier-detail-identite h2 {
  margin: 8px 0 18px;
  font: 800 58px/.92 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
  letter-spacing: -.02em;
  text-shadow: 0 1px 0 rgba(255,255,255,.08);
}

.palier-detail-identite .prix {
  margin: 0;
}

/* Harmonisation visuelle avec les cartes d'aperçu du haut */
.palier-bronze .palier-detail-identite h2,
.palier-detail-identite.palier-bronze h2 {
  color: #c47a30;
}

.palier-silver .palier-detail-identite h2,
.palier-detail-identite.palier-silver h2 {
  color: #c4c8cd;
}

.palier-gold .palier-detail-identite h2,
.palier-detail-identite.palier-gold h2 {
  color: #e2b630;
}

.palier-scorpion .palier-detail-identite h2,
.palier-detail-identite.palier-scorpion h2 {
  color: #e3312b;
}

.palier-detail-avantages {
  display: grid;
  gap: 12px;
}

.avantage-partenaire {
  padding: 23px 25px;
  background: #151a21;
  border: 1px solid rgba(255,255,255,.08);
}

.avantage-partenaire strong {
  display: block;
  color: #fff;
  font: 800 23px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.avantage-partenaire p {
  margin: 8px 0 0;
  color: #aab2bb;
  font-size: 14px;
}

.zone-sans-partenaires {
  padding: 35px;
  text-align: center;
  color: var(--noir);
  background: var(--clair);
}

.zone-sans-partenaires h2 {
  margin: 0;
  font: 800 46px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.zone-sans-partenaires p {
  max-width: 650px;
  margin: 15px auto 0;
  color: #65707b;
}

.cta-partenariat-page {
  padding: 60px 0;
  color: var(--noir);
  background: var(--accent);
}

.cta-partenariat-page-contenu {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 60px;
  align-items: center;
}

.cta-partenariat-page h2 {
  margin: 0;
  font: 800 52px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.cta-partenariat-page p {
  max-width: 700px;
}

.cta-partenariat-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}

@media (max-width: 950px) {
  .sommaire-actualites,
  .intro-partenariat,
  .article-grille,
  .article-grille-inversee,
  .palier-detail-grid,
  .cta-partenariat-page-contenu {
    grid-template-columns: 1fr;
  }

  .article-visuel,
  .palier-detail-identite {
    position: static;
  }

  .palier-detail-grid {
    gap: 25px;
  }
}

@media (max-width: 650px) {
  .page-interne { padding-top: 110px; }

  .entete-page {
    padding: 80px 0 60px;
  }

  .entete-page h1 {
    font-size: 58px;
  }

  .sommaire-actualites {
    grid-template-columns: 1fr;
  }

  .chiffres-partenariat {
    grid-template-columns: 1fr;
  }
}


/* ==========================================================
   ETAT ACTIF DE LA NAVIGATION
   ========================================================== */

.navigation-principale > a:not(.bouton) {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 2px;
}

.navigation-principale > a:not(.bouton)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -6px;
  height: 2px;
  background: transparent;
  transform: scaleX(.25);
  transform-origin: center;
  opacity: 0;
  transition: transform .22s ease, opacity .22s ease, background .22s ease;
}

.navigation-principale > a:not(.bouton):hover::after {
  background: rgba(212,163,73,.55);
  transform: scaleX(1);
  opacity: 1;
}

.navigation-principale > a.actif,
.navigation-principale > a.en-cours {
  color: var(--accent);
  font-weight: 800;
}

.navigation-principale > a.actif::after,
.navigation-principale > a.en-cours::after {
  background: var(--accent);
  transform: scaleX(1);
  opacity: 1;
}

.navigation-principale > a[aria-current="page"] {
  color: var(--accent);
}

@media (max-width: 1120px) {
  .navigation-principale > a:not(.bouton) {
    min-height: 42px;
    padding: 10px 10px;
  }

  .navigation-principale > a:not(.bouton)::after {
    left: 10px;
    right: 10px;
    bottom: 6px;
  }
}


/* ==========================================================
   V0.7.2 - Présentation améliorée des partenariats
   ========================================================== */

.intro-partenariat-nouvelle {
  display: grid;
  grid-template-columns: 1fr minmax(300px, 400px);
  gap: 56px;
  align-items: center;
}

.intro-partenariat-texte h2 {
  margin: 0;
  font: 800 clamp(48px, 6vw, 78px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.intro-partenariat-texte > p {
  max-width: 760px;
  color: #b2bbc4;
  font-size: 17px;
}

.repere-partenariat {
  margin-top: 26px;
  padding: 24px 26px;
  background: rgba(255,255,255,.05);
  border-left: 4px solid var(--accent);
}

.repere-partenariat strong {
  display: block;
  margin-bottom: 8px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.repere-partenariat p {
  margin: 0;
  color: #b2bbc4;
}

.apercu-flyer-partenaire {
  width: 100%;
  background: transparent;
}

.apercu-flyer-partenaire img {
  width: 100%;
  height: auto;
  box-shadow: var(--ombre);
}

.grille-apercu-paliers {
  margin-top: 36px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.carte-apercu-palier {
  min-height: 240px;
  padding: 26px;
  display: flex;
  flex-direction: column;
  background: #131820;
  border: 1px solid rgba(255,255,255,.08);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.carte-apercu-palier:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
}

.carte-apercu-palier small {
  color: #8f98a2;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}

.carte-apercu-palier strong {
  margin-top: 8px;
  font: 800 42px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.apercu-prix {
  display: block;
  margin-top: 12px;
  color: #fff;
  font: 800 27px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.carte-apercu-palier p {
  margin: 16px 0 0;
  color: #aab3bc;
  font-size: 14px;
}

.apercu-lien {
  margin-top: auto;
  padding-top: 18px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}

.carte-apercu-bronze strong { color: #c47a30; }
.carte-apercu-silver strong { color: #c4c8cd; }
.carte-apercu-gold strong { color: #e2b630; }
.carte-apercu-scorpion strong { color: #e3312b; }

.carte-apercu-bronze { border-top: 3px solid #ad6c2a; }
.carte-apercu-silver { border-top: 3px solid #b8bdc3; }
.carte-apercu-gold { border-top: 3px solid #d5a526; }
.carte-apercu-scorpion { border-top: 3px solid #c5231f; }

@media (max-width: 950px) {
  .intro-partenariat-nouvelle {
    grid-template-columns: 1fr;
  }

  .grille-apercu-paliers {
    grid-template-columns: 1fr;
  }
}


@media (max-width: 650px) {
  .palier-detail-identite h2 {
    font-size: 48px;
  }
}


/* ==========================================================
   V0.7.4 - Bouton retour en haut
   ========================================================== */

.retour-haut {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 180;
  min-width: 54px;
  height: 54px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(212,163,73,.55);
  background: rgba(7,9,12,.90);
  color: var(--accent);
  box-shadow: 0 14px 32px rgba(0,0,0,.28);
  backdrop-filter: blur(12px);
  cursor: pointer;

  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  pointer-events: none;

  transition:
    opacity .22s ease,
    visibility .22s ease,
    transform .22s ease,
    background .22s ease,
    color .22s ease,
    border-color .22s ease;
}

.retour-haut.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.retour-haut:hover {
  background: var(--accent);
  color: var(--noir);
  border-color: var(--accent);
}

.retour-haut > span:first-child {
  font: 800 24px/1 "Barlow Condensed", sans-serif;
}

.retour-haut-texte {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (max-width: 650px) {
  .retour-haut {
    right: 14px;
    bottom: 14px;
    width: 48px;
    min-width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 50%;
  }

  .retour-haut-texte {
    display: none;
  }
}


/* ==========================================================
   V0.8 - Page Le club / Histoire / Encadrement
   ========================================================== */

.action-section-club {
  margin-top: 26px;
}

.entete-page-club {
  min-height: 610px;
  display: flex;
  align-items: center;
}

.entete-page-club-photo,
.entete-page-club-voile {
  position: absolute;
  inset: 0;
}

.entete-page-club-photo {
  background:
    url("../ressources/images/photo_equipe_officielle.jpg") center 44% / cover no-repeat;
}

.entete-page-club-voile {
  background:
    linear-gradient(90deg, rgba(5,7,9,.96) 0%, rgba(5,7,9,.83) 43%, rgba(5,7,9,.30) 78%, rgba(5,7,9,.18) 100%),
    linear-gradient(0deg, rgba(5,7,9,.85) 0%, transparent 45%, rgba(5,7,9,.30) 100%);
}

.info-ligne-club span {
  color: #d2d7dc;
}

.histoire-club {
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 62px;
  align-items: center;
}

.histoire-club-texte h2,
.approche-club h2,
.bloc-lieu-club h2 {
  margin: 0;
  font: 800 clamp(48px,6vw,76px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.frise-histoire {
  margin-top: 44px;
  border-left: 2px solid #dde2e6;
}

.frise-histoire article {
  position: relative;
  display: grid;
  grid-template-columns: 145px 1fr;
  gap: 18px;
  padding: 0 0 34px 28px;
}

.frise-histoire article:last-child {
  padding-bottom: 0;
}

.frise-histoire article::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  border: 2px solid #f6f7f8;
}

.frise-histoire article > span {
  color: var(--accent);
  font: 800 18px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.frise-histoire h3 {
  margin: 0 0 7px;
  color: var(--noir);
  font: 800 28px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.frise-histoire p {
  margin: 0;
  color: #68727d;
}

.histoire-club-photo,
.lieu-club-photo {
  position: relative;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #111;
  cursor: zoom-in;
  box-shadow: var(--ombre);
}

.histoire-club-photo {
  min-height: 560px;
}

.histoire-club-photo img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  transition: transform .4s ease;
}

.histoire-club-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.72), transparent 48%);
}

.histoire-club-photo span {
  position: absolute;
  z-index: 2;
  left: 24px;
  bottom: 20px;
  color: #fff;
  font: 800 22px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.histoire-club-photo:hover img,
.lieu-club-photo:hover img,
.carte-encadrement-photo:hover img {
  transform: scale(1.025);
}

.section-valeurs-club {
  background:
    radial-gradient(circle at 76% 25%, rgba(212,163,73,.10), transparent 30%),
    #0c1015;
}

.grille-valeurs-club {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 14px;
}

.grille-valeurs-club article {
  min-height: 260px;
  padding: 27px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.08);
}

.grille-valeurs-club article > span {
  color: var(--accent);
  font: 800 14px/1 "Barlow Condensed", sans-serif;
}

.grille-valeurs-club h3 {
  margin: 55px 0 10px;
  font: 800 33px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.grille-valeurs-club p {
  color: #aeb6bf;
  font-size: 14px;
}

.grille-encadrement {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 15px;
}

.carte-encadrement {
  background: #fff;
  border: 1px solid #dde2e7;
  box-shadow: 0 14px 32px rgba(0,0,0,.08);
}

.carte-encadrement-photo {
  width: 100%;
  height: 310px;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #111;
  cursor: zoom-in;
}

.carte-encadrement-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.carte-encadrement > div {
  padding: 25px;
}

.carte-encadrement small {
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
}

.carte-encadrement h3 {
  margin: 12px 0 9px;
  color: var(--noir);
  font: 800 29px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.carte-encadrement p {
  margin: 0;
  color: #68727d;
  font-size: 14px;
}

.approche-club {
  display: grid;
  grid-template-columns: 1fr .85fr;
  gap: 65px;
  align-items: center;
}

.approche-club > div:first-child > p:not(.surtitre) {
  max-width: 720px;
  color: #abb4bd;
  font-size: 17px;
}

.approche-club-points {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.approche-club-points article {
  min-height: 130px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: #161b22;
  border: 1px solid rgba(255,255,255,.08);
}

.approche-club-points strong {
  color: var(--accent);
  font: 800 41px/1 "Barlow Condensed", sans-serif;
}

.approche-club-points span {
  margin-top: 8px;
  color: #9fa8b2;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.bloc-lieu-club {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 60px;
  align-items: center;
}

.bouton-contour-sombre {
  color: var(--noir);
  background: transparent;
  border-color: rgba(7,9,12,.35);
}

.bouton-contour-sombre:hover {
  color: #fff;
  background: var(--noir);
  border-color: var(--noir);
}

.lieu-club-photo {
  min-height: 430px;
}

.lieu-club-photo img {
  width: 100%;
  height: 430px;
  object-fit: cover;
  transition: transform .4s ease;
}

@media (max-width: 980px) {
  .histoire-club,
  .approche-club,
  .bloc-lieu-club {
    grid-template-columns: 1fr;
  }

  .grille-valeurs-club,
  .grille-encadrement {
    grid-template-columns: 1fr 1fr;
  }

  .histoire-club-photo {
    min-height: 440px;
  }

  .histoire-club-photo img {
    height: 440px;
  }
}

@media (max-width: 650px) {
  .entete-page-club {
    min-height: 560px;
  }

  .entete-page-club-photo {
    background-position: 58% center;
  }

  .frise-histoire article {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .grille-valeurs-club,
  .grille-encadrement,
  .approche-club-points {
    grid-template-columns: 1fr;
  }

  .carte-encadrement-photo {
    height: 280px;
  }

  .lieu-club-photo,
  .lieu-club-photo img {
    min-height: 320px;
    height: 320px;
  }
}


/* ==========================================================
   V0.9 - Histoire enrichie + équipe actuelle
   ========================================================== */

.histoire-club-large {
  grid-template-columns: 1.15fr .85fr;
}

.histoire-club-texte > p:not(.surtitre) {
  color: #616b75;
}

.origine-club-citation {
  min-height: 330px;
  padding: 42px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background:
    radial-gradient(circle at 75% 25%, rgba(212,163,73,.14), transparent 30%),
    var(--noir);
  box-shadow: var(--ombre);
}

.origine-club-citation > span {
  color: var(--accent);
  font: 800 72px/.7 Georgia, serif;
}

.origine-club-citation p {
  margin: 18px 0 0;
  color: #fff;
  font: 700 29px/1.15 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.section-histoire-sombre {
  color: #fff;
  background:
    radial-gradient(circle at 12% 20%, rgba(212,163,73,.09), transparent 30%),
    #0b0e12;
}

.creation-club {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 60px;
  align-items: center;
}

.photo-famille-historique {
  position: relative;
  min-height: 535px;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #0a0a0a;
  cursor: zoom-in;
  box-shadow: var(--ombre);
}

.photo-famille-historique img {
  width: 100%;
  height: 535px;
  object-fit: cover;
  object-position: center 47%;
  transform: scale(1.34);
  transition: transform .4s ease;
}

.photo-famille-historique:hover img {
  transform: scale(1.37);
}

.photo-famille-historique::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.76), transparent 42%);
}

.photo-famille-historique span {
  position: absolute;
  z-index: 2;
  left: 24px;
  right: 24px;
  bottom: 21px;
  color: #fff;
  font: 800 20px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.creation-club-texte h2,
.alexandre-texte h2,
.continuer-texte h2,
.aujourd-hui-club h2 {
  margin: 0;
  font: 800 clamp(48px,6vw,76px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.creation-club-texte > p:not(.surtitre),
.alexandre-texte > p:not(.surtitre) {
  color: #b2bbc4;
  font-size: 16px;
}

.encadre-histoire {
  margin-top: 26px;
  padding: 23px 25px;
  border-left: 4px solid var(--accent);
  background: rgba(255,255,255,.06);
}

.encadre-histoire strong {
  display: block;
  margin-bottom: 7px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.encadre-histoire p {
  margin: 0;
  color: #b3bbc4;
}

.grille-figures-historiques {
  margin-top: 46px;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 14px;
}

.figure-historique {
  min-height: 285px;
  padding: 28px;
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid #dde2e7;
  box-shadow: 0 14px 32px rgba(0,0,0,.07);
}

.figure-historique::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--accent);
}

.figure-historique small {
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
}

.figure-historique h3 {
  margin: 44px 0 12px;
  color: var(--noir);
  font: 800 38px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.figure-historique p {
  margin: 0;
  color: #68727d;
}

.section-alexandre {
  color: #fff;
  background:
    linear-gradient(90deg, rgba(7,9,12,.98), rgba(7,9,12,.90)),
    url("../ressources/images/photo_competition_03.jpg") center/cover;
}

.alexandre-section {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 62px;
  align-items: center;
}

.alexandre-photo {
  min-height: 545px;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: #111;
  cursor: zoom-in;
  box-shadow: var(--ombre);
}

.alexandre-photo img {
  width: 100%;
  height: 545px;
  object-fit: cover;
  transition: transform .4s ease;
}

.alexandre-photo:hover img {
  transform: scale(1.025);
}

.encadre-histoire-sombre {
  background: rgba(255,255,255,.055);
}

.continuer-histoire {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 48px;
  align-items: start;
}

.continuer-date {
  position: sticky;
  top: 135px;
  padding: 25px 22px;
  color: #fff;
  background: var(--noir);
  border-top: 4px solid var(--accent);
}

.continuer-date > span {
  display: block;
  color: var(--accent);
  font: 800 82px/.8 "Barlow Condensed", sans-serif;
}

.continuer-date strong {
  display: block;
  margin-top: 16px;
  font: 800 27px/.9 "Barlow Condensed", sans-serif;
}

.continuer-texte > p:not(.surtitre) {
  color: #616b75;
  font-size: 16px;
}

.continuer-texte blockquote {
  margin: 30px 0;
  padding: 24px 28px;
  color: var(--noir);
  background: #eceff2;
  border-left: 4px solid var(--accent);
  font: 800 29px/1.08 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.section-equipe-actuelle {
  background:
    radial-gradient(circle at 76% 18%, rgba(212,163,73,.10), transparent 27%),
    #0c1015;
}

.grille-coachs {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 14px;
}

.carte-coach {
  min-height: 300px;
  padding: 27px;
  display: flex;
  flex-direction: column;
  background: #151a21;
  border: 1px solid rgba(255,255,255,.08);
}

.carte-coach-famille {
  border-top: 3px solid var(--accent);
}

.coach-entete {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 15px;
  align-items: start;
}

.coach-numero {
  color: var(--accent);
  font: 800 16px/1 "Barlow Condensed", sans-serif;
}

.coach-entete h3 {
  margin: 0;
  color: #fff;
  font: 800 35px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.coach-entete p {
  margin: 7px 0 0;
  color: var(--accent);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.carte-coach > p {
  margin: auto 0 0;
  padding-top: 30px;
  color: #aeb6bf;
  font-size: 14px;
}

.aujourd-hui-club {
  display: grid;
  grid-template-columns: 1fr .8fr;
  gap: 60px;
  align-items: center;
}

.aujourd-hui-club > div:first-child > p:not(.surtitre) {
  color: #616b75;
}

.phrase-finale-club {
  padding: 35px;
  color: #fff;
  background: var(--noir);
  border-top: 4px solid var(--accent);
  box-shadow: var(--ombre);
}

.phrase-finale-club span {
  display: block;
  color: #9fa8b1;
  font-size: 13px;
}

.phrase-finale-club strong {
  display: block;
  margin-top: 22px;
  color: var(--accent);
  font: 800 38px/.98 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

@media (max-width: 980px) {
  .histoire-club-large,
  .creation-club,
  .alexandre-section,
  .continuer-histoire,
  .aujourd-hui-club {
    grid-template-columns: 1fr;
  }

  .continuer-date {
    position: static;
    max-width: 220px;
  }

  .grille-figures-historiques,
  .grille-coachs {
    grid-template-columns: 1fr;
  }

  .photo-famille-historique,
  .photo-famille-historique img,
  .alexandre-photo,
  .alexandre-photo img {
    min-height: 430px;
    height: 430px;
  }
}

@media (max-width: 650px) {
  .origine-club-citation {
    min-height: 260px;
    padding: 30px;
  }

  .origine-club-citation p {
    font-size: 24px;
  }

  .photo-famille-historique,
  .photo-famille-historique img {
    min-height: 350px;
    height: 350px;
  }

  .photo-famille-historique img {
    transform: scale(1.45);
  }

  .photo-famille-historique:hover img {
    transform: scale(1.48);
  }

  .continuer-date {
    max-width: 175px;
  }

  .continuer-date > span {
    font-size: 68px;
  }

  .continuer-texte blockquote {
    font-size: 24px;
  }

  .coach-entete h3 {
    font-size: 31px;
  }

  .phrase-finale-club strong {
    font-size: 31px;
  }
}


/* ==========================================================
   V1.0-A - Actualités dynamiques Firebase
   ========================================================== */

.date-actualite-dynamique {
  display: block;
  margin-top: 10px;
  color: #9da6af;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
}

.actualite-dynamique .actualite-photo-dynamique {
  overflow: hidden;
}

.actualites-firebase-page[hidden],
[data-actualite-statique][hidden],
#sommaire-actualites-statique[hidden] {
  display: none !important;
}

.liste-actualites-firebase {
  margin-top: 46px;
  display: grid;
  gap: 22px;
}

.actualite-firebase-detail {
  display: grid;
  grid-template-columns: minmax(300px, .85fr) 1.15fr;
  min-height: 390px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #dde2e7;
  box-shadow: 0 16px 38px rgba(0,0,0,.09);
  scroll-margin-top: 150px;
}

.actualite-firebase-detail:nth-child(even) {
  grid-template-columns: 1.15fr minmax(300px, .85fr);
}

.actualite-firebase-detail:nth-child(even) .actualite-firebase-visuel {
  order: 2;
}

.actualite-firebase-visuel,
.actualite-firebase-visuel .actualite-photo-fond {
  min-height: 390px;
  height: 100%;
}

.actualite-firebase-visuel .actualite-photo-fond {
  width: 100%;
}

.actualite-firebase-visuel img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.actualite-firebase-corps {
  padding: clamp(28px, 5vw, 58px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.actualite-firebase-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  color: #7c8792;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.actualite-firebase-corps h2 {
  margin: 18px 0 22px;
  color: #090b0e;
  font: 800 clamp(38px,5vw,60px)/.98 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.contenu-actualite-firebase p {
  margin: 0 0 16px;
  color: #5e6872;
  font-size: 15px;
  line-height: 1.65;
}

.contenu-actualite-firebase p:last-child {
  margin-bottom: 0;
}

@media (max-width: 850px) {
  .actualite-firebase-detail,
  .actualite-firebase-detail:nth-child(even) {
    grid-template-columns: 1fr;
  }

  .actualite-firebase-detail:nth-child(even) .actualite-firebase-visuel {
    order: 0;
  }

  .actualite-firebase-visuel,
  .actualite-firebase-visuel .actualite-photo-fond {
    min-height: 300px;
    height: 300px;
  }
}

@media (max-width: 550px) {
  .actualite-firebase-visuel,
  .actualite-firebase-visuel .actualite-photo-fond {
    min-height: 235px;
    height: 235px;
  }

  .actualite-firebase-corps {
    padding: 25px 22px;
  }
}


/* ==========================================================
   V1.0-B - Partenaires publics synchronisés avec Firebase
   ========================================================== */

.partenaires-publies-accueil[hidden] {
  display: none !important;
}

.partenaires-publies-accueil {
  margin-bottom: 46px;
  padding: 28px;
  background:
    radial-gradient(circle at 92% 8%, rgba(212,163,73,.10), transparent 30%),
    rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.09);
}

.partenaires-publies-entete {
  margin-bottom: 22px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.partenaires-publies-entete h3 {
  margin: 0;
  color: #fff;
  font: 800 clamp(34px,4vw,50px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.grille-partenaires-publies {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 15px;
}

.grille-partenaires-accueil {
  grid-template-columns: repeat(3, minmax(0,1fr));
}

.carte-partenaire-public {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 170px minmax(0,1fr);
  gap: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #dfe3e7;
  box-shadow: 0 15px 34px rgba(0,0,0,.08);
}

.carte-partenaire-public::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--couleur-partenaire, #c47a30);
  z-index: 2;
}

.carte-partenaire-public.partenaire-bronze {
  --couleur-partenaire: #c47a30;
}

.carte-partenaire-public.partenaire-silver {
  --couleur-partenaire: #aeb4bc;
}

.carte-partenaire-public.partenaire-gold {
  --couleur-partenaire: #e2b630;
}

.carte-partenaire-public.partenaire-scorpion {
  --couleur-partenaire: #e3312b;
}

.carte-partenaire-public.partenaire-mis-en-avant {
  border-color: color-mix(in srgb, var(--couleur-partenaire) 62%, #dfe3e7);
  box-shadow: 0 18px 42px rgba(0,0,0,.12);
}

.logo-partenaire-public {
  min-height: 205px;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 40%, rgba(212,163,73,.08), transparent 45%),
    #f0f2f4;
}

.logo-partenaire-public img {
  display: block;
  width: 100%;
  max-width: 145px;
  max-height: 150px;
  object-fit: contain;
}

.logo-partenaire-fallback {
  color: #89919a;
  font: 800 50px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.contenu-partenaire-public {
  min-width: 0;
  padding: 25px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.meta-partenaire-public {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.badge-niveau-partenaire {
  padding: 5px 8px;
  color: var(--couleur-partenaire, #c47a30);
  border: 1px solid color-mix(in srgb, var(--couleur-partenaire) 55%, transparent);
  background: color-mix(in srgb, var(--couleur-partenaire) 10%, transparent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.depuis-partenaire {
  color: #7a838d;
  font-size: 10px;
  font-weight: 700;
}

.contenu-partenaire-public h3 {
  margin: 13px 0 8px;
  color: #0c1015;
  font: 800 32px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.contenu-partenaire-public > p {
  margin: 0;
  color: #65707a;
  font-size: 14px;
  line-height: 1.55;
}

.liens-partenaire-public {
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.liens-partenaire-public a {
  color: #111820;
  font-size: 11px;
  font-weight: 900;
  text-decoration: none;
  text-transform: uppercase;
}

.liens-partenaire-public a:hover {
  color: var(--couleur-partenaire, #c47a30);
}

.badge-partenaire-vedette {
  position: absolute;
  z-index: 4;
  top: 12px;
  right: 12px;
  padding: 5px 8px;
  color: #0b0d10;
  background: var(--couleur-partenaire, #d4a349);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .08em;
}

.carte-partenaire-public-compacte {
  grid-template-columns: 1fr;
  min-height: 310px;
  background: #11161c;
  border-color: rgba(255,255,255,.08);
  box-shadow: none;
}

.carte-partenaire-public-compacte .logo-partenaire-public {
  min-height: 165px;
  padding: 24px;
  background: #f0f2f4;
}

.carte-partenaire-public-compacte .logo-partenaire-public img {
  max-width: 155px;
  max-height: 115px;
}

.carte-partenaire-public-compacte .contenu-partenaire-public {
  padding: 20px;
  justify-content: flex-start;
}

.carte-partenaire-public-compacte .contenu-partenaire-public h3 {
  color: #fff;
  font-size: 27px;
}

.carte-partenaire-public-compacte .contenu-partenaire-public > p {
  color: #a8b0b9;
  font-size: 12px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.carte-partenaire-public-compacte .depuis-partenaire {
  color: #9da6af;
}

.partenaire-fallback {
  grid-column: 1 / -1;
}

.section-nos-partenaires-publics .zone-sans-partenaires h3 {
  margin: 0 0 10px;
  color: #111820;
  font: 800 clamp(36px,5vw,58px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

@media (max-width: 1050px) {
  .grille-partenaires-accueil {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .grille-partenaires-publies {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .partenaires-publies-accueil {
    padding: 20px;
  }

  .partenaires-publies-entete {
    align-items: flex-start;
    flex-direction: column;
  }

  .grille-partenaires-accueil {
    grid-template-columns: 1fr;
  }

  .carte-partenaire-public {
    grid-template-columns: 1fr;
  }

  .logo-partenaire-public {
    min-height: 180px;
  }

  .contenu-partenaire-public {
    padding: 21px;
  }
}


/* ==========================================================
   V1.0-C - Galerie publique Firebase
   ========================================================== */

.section-galerie-accueil[hidden] {
  display: none !important;
}

.section-galerie-accueil {
  background:
    radial-gradient(circle at 15% 15%, rgba(212,163,73,.09), transparent 28%),
    #090c10;
}

.entete-section-galerie {
  align-items: end;
}

.entete-section-galerie h2 span {
  color: #d4a349;
}

.entete-galerie-actions {
  max-width: 430px;
}

.entete-galerie-actions p {
  margin: 0 0 18px;
  color: #9da6af;
  line-height: 1.65;
}

.grille-galerie-accueil,
.grille-galerie-complete {
  display: grid;
  gap: 12px;
}

.grille-galerie-accueil {
  grid-template-columns: repeat(4, minmax(0,1fr));
}

.grille-galerie-complete {
  grid-template-columns: repeat(3, minmax(0,1fr));
}

.carte-galerie-site {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e1e4e7;
  box-shadow: 0 14px 32px rgba(0,0,0,.08);
}

.carte-galerie-site-compacte {
  background: #11161c;
  border-color: rgba(255,255,255,.08);
  box-shadow: none;
}

.image-galerie-site {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  display: block;
  padding: 0;
  overflow: hidden;
  border: 0;
  cursor: zoom-in;
  background: #11161c;
  text-align: left;
}

.image-galerie-site img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .35s ease, filter .35s ease;
}

.image-galerie-site:hover img {
  transform: scale(1.035);
  filter: contrast(1.03);
}

.overlay-galerie-site {
  position: absolute;
  inset: 32% 0 0;
  background: linear-gradient(to bottom, transparent, rgba(0,0,0,.82));
  pointer-events: none;
}

.meta-galerie-site {
  position: absolute;
  z-index: 2;
  left: 17px;
  right: 17px;
  bottom: 15px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  color: #fff;
}

.categorie-galerie-site {
  color: #d4a349;
  font: 800 9px/1 "Inter", sans-serif;
  letter-spacing: .09em;
}

.meta-galerie-site strong {
  font: 800 24px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.badge-galerie-vedette {
  position: absolute;
  z-index: 3;
  top: 12px;
  right: 12px;
  padding: 6px 8px;
  background: #d4a349;
  color: #090c10;
  font: 900 8px/1 "Inter", sans-serif;
  letter-spacing: .08em;
}

.carte-galerie-site-vedette {
  border-color: rgba(212,163,73,.65);
}

.legende-carte-galerie {
  margin: 0;
  padding: 15px 17px 18px;
  color: #616b75;
  font-size: 13px;
  line-height: 1.55;
}

.entete-page-galerie {
  background:
    radial-gradient(circle at 85% 15%, rgba(212,163,73,.12), transparent 28%),
    #0a0d11;
}

.entete-page-galerie h1 span {
  color: #d4a349;
}

.filtres-galerie {
  margin: -8px 0 25px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.filtre-galerie {
  appearance: none;
  padding: 9px 13px;
  border: 1px solid #d9dde1;
  background: #fff;
  color: #555f69;
  cursor: pointer;
  font: 800 10px/1 "Inter", sans-serif;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.filtre-galerie:hover,
.filtre-galerie.actif {
  border-color: #d4a349;
  background: #d4a349;
  color: #0b0d10;
}

.etat-chargement-galerie,
.etat-vide-galerie-site {
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

.etat-chargement-galerie[hidden],
.etat-vide-galerie-site[hidden] {
  display: none !important;
}

.etat-chargement-galerie {
  color: #77818b;
}

.spinner-galerie {
  width: 34px;
  height: 34px;
  margin-bottom: 12px;
  border: 3px solid #e5e8eb;
  border-top-color: #d4a349;
  border-radius: 50%;
  animation: rotation-galerie .8s linear infinite;
}

@keyframes rotation-galerie {
  to { transform: rotate(360deg); }
}

.etat-vide-galerie-site {
  padding: 40px 20px;
  border: 1px solid #e0e3e6;
  background: #f6f7f8;
}

.etat-vide-galerie-site h3 {
  margin: 3px 0 8px;
  color: #111820;
  font: 800 clamp(34px,4vw,48px)/.95 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.etat-vide-galerie-site > p:last-child {
  margin: 0;
  color: #707a84;
}

@media (min-width: 1180px) {
  .grille-galerie-complete .carte-galerie-site-vedette:first-child {
    grid-column: span 2;
  }

  .grille-galerie-complete .carte-galerie-site-vedette:first-child .image-galerie-site {
    aspect-ratio: 2 / 1;
  }
}

@media (max-width: 1050px) {
  .grille-galerie-accueil {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .grille-galerie-complete {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 720px) {
  .entete-section-galerie {
    align-items: flex-start;
  }

  .grille-galerie-accueil,
  .grille-galerie-complete {
    grid-template-columns: 1fr;
  }

  .meta-galerie-site strong {
    font-size: 22px;
  }
}


/* ==========================================================
   Histoire du club - Premier emblème du SBTD
   ========================================================== */

.premier-logo-historique {
  margin-top: 25px;
  padding: 18px;
  display: grid;
  grid-template-columns: 132px minmax(0,1fr);
  gap: 20px;
  align-items: center;
  border: 1px solid rgba(212,163,73,.26);
  background:
    radial-gradient(circle at 12% 50%, rgba(212,163,73,.10), transparent 38%),
    rgba(255,255,255,.045);
}

.premier-logo-historique-image {
  width: 132px;
  height: 132px;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: #050505;
  cursor: zoom-in;
}

.premier-logo-historique-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  transition: transform .3s ease;
}

.premier-logo-historique-image:hover img {
  transform: scale(1.045);
}

.premier-logo-historique small {
  display: block;
  margin-bottom: 7px;
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
}

.premier-logo-historique strong {
  display: block;
  color: #fff;
  font: 800 27px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.premier-logo-historique p {
  margin: 8px 0 0;
  color: #aeb7c0;
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 620px) {
  .premier-logo-historique {
    grid-template-columns: 92px minmax(0,1fr);
    gap: 14px;
    padding: 14px;
  }

  .premier-logo-historique-image {
    width: 92px;
    height: 92px;
  }

  .premier-logo-historique strong {
    font-size: 22px;
  }
}


/* ==========================================================
   V1.0-D.1 - Ajustements des cartes demandés
   ========================================================== */

/* Disciplines : titre en haut, description + repère jaune en bas. */
.carte-discipline {
  min-height: 320px;
}

.carte-discipline h3 {
  max-width: 78%;
  margin: 8px 0 0;
}

.carte-discipline p {
  margin: auto 0 18px;
  color: #aeb6bf;
}

.carte-discipline > span {
  margin-top: 0;
}

/* Figures historiques : identité en haut, texte en bas. */
.figure-historique {
  display: flex;
  flex-direction: column;
}

.figure-historique-entete h3 {
  margin: 0;
  color: var(--noir);
  font: 800 38px/1 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.figure-historique-entete small {
  display: block;
  margin-top: 9px;
}

.figure-palmares {
  display: block;
  margin-top: 10px;
  color: #a96f13;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.35;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.figure-historique > p {
  margin: auto 0 0;
  padding-top: 30px;
}

/* Equipe actuelle : nom puis fonction, texte biographique en bas. */
.coach-entete {
  display: block;
}

.coach-entete h3 {
  margin: 0;
}

.coach-entete p {
  margin-top: 8px;
}

.carte-coach > p {
  margin-top: auto;
}

/* Valeurs : titre en haut, explication en bas. */
.grille-valeurs-club article {
  display: flex;
  flex-direction: column;
}

.grille-valeurs-club h3 {
  margin: 0;
}

.grille-valeurs-club p {
  margin: auto 0 0;
  padding-top: 30px;
}


/* ==========================================================
   V1.0-D.3 - Palmarès et qualifications compacts
   ========================================================== */

.palmares-compact {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 6px;
  margin-top: 9px;
}

.palmares-compact span {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 3px 7px;
  border: 1px solid rgba(212, 163, 73, .28);
  border-radius: 4px;
  background: rgba(212, 163, 73, .07);
  color: #d6a63f;
  font-size: 8.5px;
  font-weight: 850;
  line-height: 1.2;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.figure-historique .palmares-compact {
  margin-top: 10px;
}

.figure-historique .palmares-compact span {
  border-color: rgba(169, 111, 19, .24);
  background: rgba(169, 111, 19, .055);
  color: #9d6814;
}

.carte-coach .palmares-compact {
  margin-top: 8px;
  max-width: 100%;
}

.carte-coach .palmares-compact span {
  font-size: 8px;
}

.palmares-alexandre {
  margin: 14px 0 20px;
  max-width: 630px;
}

.section-alexandre .palmares-alexandre span {
  border-color: rgba(212, 163, 73, .35);
  background: rgba(212, 163, 73, .09);
  color: #e0ae43;
}

@media (max-width: 620px) {
  .palmares-compact {
    gap: 4px;
  }

  .palmares-compact span {
    min-height: 19px;
    padding: 3px 6px;
    font-size: 7.8px;
  }
}


/* ==========================================================
   V1.0-D.5 - Logo / identité cliquable vers le haut de l'accueil
   ========================================================== */

.marque-site,
.identite-site {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.marque-site:visited,
.identite-site:visited {
  color: inherit;
}

html {
  scroll-behavior: smooth;
}

#top {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}


/* ==========================================================
   V1.0-D.6 - Header : ordre et position du menu stabilisés
   ========================================================== */

.navigation-principale {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: nowrap;
}

.navigation-principale > a {
  flex: 0 0 auto;
  white-space: nowrap;
}

.navigation-principale > a[data-section-link="galerie"] {
  order: 6;
}

.navigation-principale > a[data-section-link="coulisses"] {
  order: 5;
}

.navigation-principale > a[data-section-link="partenariats"] {
  order: 7;
}

.navigation-principale > a[data-section-link="contact"] {
  order: 8;
}

.navigation-principale > .bouton {
  order: 9;
}

@media (max-width: 980px) {
  .navigation-principale {
    flex-wrap: wrap;
  }
}


/* ==========================================================
   V1.0-E - Informations publiques synchronisées depuis Firebase
   ========================================================== */

[data-site-info-masque="true"],
.message-public-site[hidden] {
  display: none !important;
}

.message-public-site {
  position: relative;
  z-index: 3;
  border-top: 1px solid rgba(212, 163, 73, .28);
  border-bottom: 1px solid rgba(212, 163, 73, .28);
  background:
    linear-gradient(90deg, rgba(212, 163, 73, .12), rgba(227, 49, 43, .07)),
    #0b0e12;
}

.message-public-site-interieur {
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding-top: 18px;
  padding-bottom: 18px;
}

.message-public-site-interieur > div {
  min-width: 0;
}

.message-public-site-interieur span {
  display: block;
  margin-bottom: 4px;
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}

.message-public-site-interieur strong {
  display: block;
  color: #fff;
  font: 800 26px/1.05 "Barlow Condensed", sans-serif;
  text-transform: uppercase;
}

.message-public-site-interieur p {
  max-width: 850px;
  margin: 7px 0 0;
  color: #b6bec6;
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 720px) {
  .message-public-site-interieur {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
  }

  .message-public-site-interieur strong {
    font-size: 22px;
  }
}


/* ==========================================================
   V1.0-E.1 - Listes dynamiques Informations
   ========================================================== */

.reseaux-dynamiques {
  display: contents;
}

#info-telephones-liste {
  display: contents;
}

#info-liste-horaires {
  display: contents;
}


/* ==========================================================
   V1.0-E.2 - Réseaux, Maps et navigation Horaires
   ========================================================== */

.reseaux,
.reseaux-dynamiques {
  align-items: center;
}

.reseaux-dynamiques {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 9px;
}

.reseaux a,
.reseaux-dynamiques a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.reseaux a i,
.reseaux-dynamiques a i {
  width: 17px;
  font-size: 16px;
  line-height: 1;
  text-align: center;
}

.lien-reseau-social i {
  transition: transform .2s ease;
}

.lien-reseau-social:hover i {
  transform: translateY(-1px) scale(1.06);
}

.coordonnees-actions {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bouton-maps-contact {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.navigation-principale > a[data-section-link="club"] { order: 1; }
.navigation-principale > a[data-section-link="disciplines"] { order: 2; }
.navigation-principale > a[data-section-link="actualites"] { order: 3; }
.navigation-principale > a[data-section-link="decouvrir"] { order: 4; }
.navigation-principale > a[data-section-link="horaires"] { order: 5; }
.navigation-principale > a[data-section-link="coulisses"] { order: 6; }
.navigation-principale > a[data-section-link="galerie"] { order: 7; }
.navigation-principale > a[data-section-link="partenariats"] { order: 8; }
.navigation-principale > a[data-section-link="contact"] { order: 9; }
.navigation-principale > .bouton { order: 10; }

@media (max-width: 720px) {
  .reseaux-dynamiques {
    width: 100%;
  }

  .reseaux a,
  .reseaux-dynamiques a {
    min-height: 38px;
  }
}




/* ==========================================================
   V1.0-E.4 - Google Maps directement sous l'adresse
   ========================================================== */

#info-contact-adresse dd {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.bouton-maps-adresse {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  padding: 7px 10px;
  border: 1px solid rgba(212, 163, 73, .38);
  border-radius: 6px;
  background: rgba(212, 163, 73, .07);
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .04em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.bouton-maps-adresse:hover {
  border-color: rgba(212, 163, 73, .68);
  background: rgba(212, 163, 73, .14);
  transform: translateY(-1px);
}

.bouton-maps-adresse i {
  font-size: 13px;
}


/* ==========================================================
   V1.0-E.5 - Bouton Google Maps redesign
   ========================================================== */

#info-contact-adresse dd {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.bouton-maps-adresse {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 10px 14px 10px 10px;
  border: 1px solid rgba(212, 163, 73, .28);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(212, 163, 73, .14) 0%, rgba(212, 163, 73, .04) 100%),
    rgba(255,255,255,.025);
  box-shadow: 0 8px 22px rgba(0,0,0,.18);
  color: #fff;
  text-decoration: none;
  transition:
    transform .2s ease,
    border-color .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}

.bouton-maps-adresse:hover {
  transform: translateY(-2px);
  border-color: rgba(212, 163, 73, .7);
  background:
    linear-gradient(135deg, rgba(212, 163, 73, .2) 0%, rgba(212, 163, 73, .07) 100%),
    rgba(255,255,255,.04);
  box-shadow: 0 12px 28px rgba(0,0,0,.24);
}

.bouton-maps-adresse-icone {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(212, 163, 73, .95) 0%, rgba(178, 132, 38, .95) 100%);
  color: var(--noir);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}

.bouton-maps-adresse-icone i {
  font-size: 15px;
  line-height: 1;
}

.bouton-maps-adresse-textes {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
}

.bouton-maps-adresse-textes strong {
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.bouton-maps-adresse-textes small {
  color: rgba(255,255,255,.7);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}

@media (max-width: 720px) {
  .bouton-maps-adresse {
    width: 100%;
    max-width: 100%;
  }

  .bouton-maps-adresse-textes small {
    white-space: normal;
  }
}

/* =========================================================
   V1.0-F - Consentement statistiques / confidentialite
   ========================================================= */
.lien-footer-confidentialite {
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-decoration: none;
}

.lien-footer-confidentialite:hover,
.lien-footer-confidentialite:focus-visible {
  color: var(--or, #d4af37);
  text-decoration: underline;
}

.sbtd-confidentialite {
  position: fixed;
  z-index: 99999;
  left: 50%;
  bottom: 18px;
  width: min(920px, calc(100% - 28px));
  transform: translateX(-50%);
  padding: 16px;
  border: 1px solid rgba(212, 175, 55, 0.42);
  border-radius: 18px;
  background: rgba(14, 14, 16, 0.98);
  color: #f5f5f5;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.48);
  backdrop-filter: blur(14px);
}

.sbtd-confidentialite[hidden] {
  display: none !important;
}

.sbtd-confidentialite-contenu {
  display: flex;
  align-items: center;
  gap: 22px;
}

.sbtd-confidentialite strong {
  display: block;
  margin-bottom: 5px;
  color: #d4af37;
  font-size: 0.92rem;
  letter-spacing: 0.02em;
}

.sbtd-confidentialite p {
  margin: 0;
  max-width: 660px;
  color: #c7c7ca;
  font-size: 0.86rem;
  line-height: 1.45;
}

.sbtd-confidentialite-actions {
  display: flex;
  gap: 9px;
  margin-left: auto;
  flex: 0 0 auto;
}

.sbtd-confidentialite-actions button {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 10px;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 800;
  cursor: pointer;
}

.sbtd-confidentialite-refuser {
  border: 1px solid #44444a;
  background: transparent;
  color: #d9d9dc;
}

.sbtd-confidentialite-accepter {
  border: 1px solid #d4af37;
  background: #d4af37;
  color: #111114;
}

@media (max-width: 720px) {
  .sbtd-confidentialite {
    bottom: 10px;
    width: calc(100% - 20px);
    padding: 14px;
  }

  .sbtd-confidentialite-contenu,
  .sbtd-confidentialite-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .sbtd-confidentialite-contenu {
    gap: 14px;
  }

  .sbtd-confidentialite-actions {
    width: 100%;
    margin-left: 0;
    gap: 8px;
  }
}