/* =============================================================================
   PADEL MORCENX — Zone des Carolins, 40110 Morcenx — feuille de style unique
   Refonte 2026 : textes et pages du site d'origine (padelmorcenx.fr), design neuf
   en thème clair (fond blanc) aux couleurs du logo : jaune + noir.
   Tout est réglé ici, en haut du fichier.
   ============================================================================= */

:root {
  --jaune: #edf000;          /* jaune du logo (balles) */
  --jaune-doux: #f8f8b0;
  --jaune-voile: rgba(237, 240, 0, .22);
  --noir: #0d0d0f;           /* lettres du logo */
  --noir-2: #1a1a1e;
  --texte: #16161a;          /* titres */
  --gris: #5d6066;           /* texte courant */
  --gris-clair: #f6f6f1;     /* sections teintées */
  --ligne: #e7e7df;
  --blanc: #fff;
  --rayon: 22px;
  --rayon-grand: 32px;
  --ombre: 0 26px 60px -30px rgba(13, 13, 15, .35);
  --ombre-forte: 0 40px 80px -34px rgba(13, 13, 15, .5);
  --titre: "Sora", "Segoe UI", Arial, sans-serif;     /* titres */
  --police: "Manrope", "Segoe UI", Arial, sans-serif; /* texte, boutons */
  --entete-h: 92px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-doux: cubic-bezier(.65, 0, .35, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: calc(var(--entete-h) + 16px); -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--police); font-size: 16.5px; line-height: 1.75; color: var(--gris); background: var(--blanc); overflow-x: clip; -webkit-font-smoothing: antialiased; }
img, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; background: none; border: 0; padding: 0; }
h1, h2, h3, h4 { font-family: var(--titre); color: var(--texte); line-height: 1.12; margin: 0 0 .55em; letter-spacing: -.02em; }
h1 { font-weight: 800; font-size: clamp(2.5rem, 6vw, 4.8rem); }
h2 { font-weight: 800; font-size: clamp(1.9rem, 3.8vw, 3rem); }
h3 { font-weight: 700; font-size: clamp(1.15rem, 1.8vw, 1.35rem); letter-spacing: -.01em; }
p { margin: 0 0 1em; }
strong { color: var(--texte); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 3px solid var(--noir); outline-offset: 3px; border-radius: 10px; box-shadow: 0 0 0 7px var(--jaune); }
::selection { background: var(--jaune); color: var(--noir); }

.conteneur { width: min(1220px, 100% - 40px); margin-inline: auto; }
.conteneur--etroit { width: min(760px, 100% - 40px); margin-inline: auto; }
.section { position: relative; padding: clamp(70px, 9vw, 120px) 0; isolation: isolate; }
.section--serree { padding: clamp(46px, 6vw, 70px) 0; }
.section--teinte { background: var(--gris-clair); }
.section--noire { background: var(--noir); color: rgba(255, 255, 255, .78); }
.section--noire h2, .section--noire h3 { color: var(--blanc); }
.centre { text-align: center; }

/* Pois du logo (balles jaunes de la raquette) en décor */
.pois { position: absolute; z-index: -1; width: 180px; height: 180px; pointer-events: none; background-image: radial-gradient(circle, var(--jaune) 34%, transparent 36%); background-size: 30px 30px; opacity: .55; animation: poisFlotte 12s ease-in-out infinite alternate; }
@keyframes poisFlotte { to { transform: translate(18px, -14px) rotate(6deg); } }

/* Barre de progression de lecture */
.progression { position: fixed; inset: 0 0 auto 0; height: 4px; z-index: 120; background: linear-gradient(90deg, var(--noir), var(--jaune)); transform-origin: 0 50%; transform: scaleX(0); }

/* ---------- Sur-titres et titres ---------- */
.surtitre { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 16px; padding: 7px 16px 7px 10px; border-radius: 999px; background: var(--gris-clair); border: 1px solid var(--ligne); color: var(--texte); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; line-height: 1.4; }
.surtitre::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--jaune); box-shadow: 0 0 0 4px var(--jaune-voile); flex: none; }
.section--noire .surtitre { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); color: var(--blanc); }
.entete-section { max-width: 760px; margin: 0 auto clamp(36px, 5vw, 56px); text-align: center; }
.entete-section p { font-size: 1.08rem; }
/* Surligneur jaune qui se trace sous un mot */
.titre { position: relative; display: inline; background-image: linear-gradient(var(--jaune), var(--jaune)); background-repeat: no-repeat; background-size: 0% .38em; background-position: 0 88%; transition: background-size 1.1s var(--ease) .25s; padding: 0 .06em; }
.titre.visible { background-size: 100% .38em; }
.section--noire .titre, .fond-noir .titre { background-image: linear-gradient(var(--jaune), var(--jaune)); background-size: 0% 4px; background-position: 0 100%; }
.section--noire .titre.visible, .fond-noir .titre.visible { background-size: 100% 4px; }
.ligne-titre { display: block; overflow: hidden; padding-bottom: .12em; }
.ligne-titre > span { display: inline-block; transform: translateY(110%) skewY(4deg); transition: transform 1.1s var(--ease) var(--delai, 0s); }
.ligne-titre.visible > span { transform: none; }

/* ---------- Boutons (tous en pilule) ---------- */
.bouton { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .6em; min-height: 52px; padding: 13px 28px; border-radius: 999px; font-family: var(--police); font-weight: 800; font-size: .98rem; line-height: 1.2; text-align: center; color: var(--noir); background: var(--blanc); border: 2px solid var(--noir); transition: transform .45s var(--ease), box-shadow .45s var(--ease), color .35s, border-color .35s; overflow: hidden; isolation: isolate; white-space: nowrap; }
.bouton::before { content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: inherit; background: var(--noir); transform: scaleX(0); transform-origin: right; transition: transform .55s var(--ease); }
.bouton:hover::before { transform: scaleX(1); transform-origin: left; }
.bouton:hover { transform: translateY(-3px); color: var(--jaune); box-shadow: 0 18px 34px -16px rgba(13, 13, 15, .6); }
.bouton svg { width: 18px; height: 18px; flex: none; transition: transform .45s var(--ease); }
.bouton:hover svg { transform: translateX(5px); }
.bouton--jaune { background: var(--jaune); border-color: var(--jaune); color: var(--noir); }
.bouton--jaune::before { background: var(--noir); }
.bouton--jaune:hover { border-color: var(--noir); color: var(--jaune); }
.bouton--noir { background: var(--noir); border-color: var(--noir); color: var(--jaune); }
.bouton--noir::before { background: var(--jaune); }
.bouton--noir:hover { color: var(--noir); border-color: var(--jaune); box-shadow: 0 18px 34px -16px rgba(237, 240, 0, .8); }
.bouton--contour { background: transparent; }
.bouton--blanc { background: transparent; border-color: var(--blanc); color: var(--blanc); }
.bouton--blanc::before { background: var(--jaune); }
.bouton--blanc:hover { color: var(--noir); border-color: var(--jaune); }
.bouton--petit { min-height: 44px; padding: 9px 20px; font-size: .88rem; }
.boutons { display: flex; flex-wrap: wrap; gap: 12px; }
.boutons--centre { justify-content: center; }

/* ---------- En-tête vitré blanc ---------- */
.entete { position: fixed; inset: 0 0 auto 0; z-index: 100; height: var(--entete-h); color: var(--texte); transition: height .45s var(--ease); }
.entete::before { content: ""; position: absolute; inset: 0; background: rgba(255, 255, 255, .78); backdrop-filter: blur(16px) saturate(1.5); -webkit-backdrop-filter: blur(16px) saturate(1.5); border-bottom: 1px solid transparent; transition: background .45s, box-shadow .45s, border-color .45s; }
.entete.reduite { --entete-h: 72px; height: 72px; }
.entete.reduite::before { background: rgba(255, 255, 255, .95); border-color: var(--ligne); box-shadow: 0 14px 34px -24px rgba(13, 13, 15, .45); }
.entete__in { position: relative; height: 100%; display: flex; align-items: center; gap: 20px; }
.entete__logo { display: flex; align-items: center; flex: none; }
.entete__logo img { height: 66px; width: auto; transition: height .45s var(--ease), transform .6s var(--ease); }
.entete__logo:hover img { transform: rotate(-4deg) scale(1.05); }
.entete.reduite .entete__logo img { height: 52px; }
.menu { display: flex; align-items: center; gap: 2px; margin-left: auto; padding: 5px; border-radius: 999px; background: rgba(13, 13, 15, .04); border: 1px solid var(--ligne); }
.menu a { position: relative; padding: 8px 15px; border-radius: 999px; font-weight: 700; font-size: .9rem; color: rgba(13, 13, 15, .72); white-space: nowrap; transition: color .3s, background .3s; }
.menu a:hover { color: var(--noir); background: var(--blanc); }
.menu a.actif { color: var(--noir); background: var(--jaune); }
.entete__actions { display: flex; align-items: center; gap: 10px; flex: none; }
.burger { display: none; width: 50px; height: 50px; border-radius: 50%; position: relative; background: var(--noir); flex: none; }
.burger span { position: absolute; left: 15px; right: 15px; height: 2px; background: var(--jaune); border-radius: 2px; transition: transform .45s var(--ease), opacity .3s; }
.burger span:nth-child(1) { top: 18px; } .burger span:nth-child(2) { top: 24px; } .burger span:nth-child(3) { top: 30px; }
body.menu-ouvert .burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.menu-ouvert .burger span:nth-child(2) { opacity: 0; }
body.menu-ouvert .burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Menu mobile plein écran (fond clair, pois jaunes) */
.tiroir { position: fixed; inset: 0; z-index: 99; background: var(--blanc); color: var(--texte); padding: calc(var(--entete-h) + 20px) 24px 30px; overflow-y: auto; clip-path: circle(0 at calc(100% - 45px) 46px); visibility: hidden; transition: clip-path .8s var(--ease-doux), visibility 0s .8s; display: flex; flex-direction: column; isolation: isolate; }
.tiroir::before { content: ""; position: absolute; z-index: -1; right: -60px; top: 52%; width: 260px; height: 260px; background-image: radial-gradient(circle, var(--jaune) 34%, transparent 36%); background-size: 32px 32px; opacity: .5; }
body.menu-ouvert .tiroir { clip-path: circle(150% at calc(100% - 45px) 46px); visibility: visible; transition: clip-path .8s var(--ease-doux), visibility 0s; }
body.menu-ouvert { overflow: hidden; }
.tiroir > a:not(.bouton) { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 0; font-family: var(--titre); font-weight: 800; font-size: 1.7rem; letter-spacing: -.02em; line-height: 1.2; border-bottom: 1px solid var(--ligne); opacity: 0; transform: translateY(24px); transition: opacity .5s, transform .6s var(--ease), color .3s; }
.tiroir > a:not(.bouton)::after { content: "→"; font-size: 1.2rem; transition: transform .35s var(--ease); }
.tiroir > a:not(.bouton):hover::after { transform: translateX(6px); }
.tiroir > a.actif { background: linear-gradient(transparent 62%, var(--jaune) 62%, var(--jaune) 88%, transparent 88%) no-repeat 0 0 / 60% 100%; }
body.menu-ouvert .tiroir > a, body.menu-ouvert .tiroir__boutons, body.menu-ouvert .tiroir__contact { opacity: 1; transform: none; }
.tiroir > a:nth-child(2) { transition-delay: .05s; } .tiroir > a:nth-child(3) { transition-delay: .1s; } .tiroir > a:nth-child(4) { transition-delay: .15s; }
.tiroir__boutons { display: grid; gap: 10px; margin-top: 24px; opacity: 0; transform: translateY(20px); transition: opacity .5s .2s, transform .6s var(--ease) .2s; }
.tiroir__boutons .bouton { width: 100%; }
.tiroir__contact { margin-top: auto; padding-top: 26px; font-size: .92rem; opacity: 0; transition: opacity .5s .3s; word-break: break-word; }
.tiroir__contact a { font-weight: 700; color: var(--texte); }

/* ---------- Apparitions (fondu + flou + glissement) ---------- */
.revele { opacity: 0; transform: translateY(40px); filter: blur(8px); transition: opacity 1s var(--ease) var(--delai, 0s), transform 1s var(--ease) var(--delai, 0s), filter 1s var(--ease) var(--delai, 0s); }
.revele--gauche { transform: translateX(-56px); }
.revele--droite { transform: translateX(56px); }
.revele--zoom { transform: scale(.92); }
.revele.visible { opacity: 1; transform: none; filter: none; }
.apparait { opacity: 0; transform: translateY(26px); filter: blur(6px); animation: apparait 1s var(--ease) forwards; }
.apparait.d2 { animation-delay: .45s; } .apparait.d3 { animation-delay: .7s; } .apparait.d4 { animation-delay: .9s; }
@keyframes apparait { to { opacity: 1; transform: none; filter: none; } }
/* Photo dévoilée en rideau (le rideau est sur l'image, le cadre reste observable) */
.rideau img { clip-path: inset(0 0 100% 0); transition: clip-path 1.4s var(--ease-doux) var(--delai, 0s), transform 1.4s var(--ease); }
.rideau.visible img { clip-path: inset(0 0 0 0); }

/* Lueur jaune qui suit la souris */
.lueur { position: relative; isolation: isolate; }
.lueur::before { content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; background: radial-gradient(360px circle at var(--x, 50%) var(--y, 50%), rgba(237, 240, 0, .28), transparent 60%); opacity: 0; transition: opacity .4s; pointer-events: none; }
.lueur:hover::before { opacity: 1; }
.lueur > * { position: relative; z-index: 1; }

/* ---------- Héros de l'accueil : texte + pile de photos qui se mélange ---------- */
.hero { position: relative; padding: calc(var(--entete-h) + clamp(30px, 6vw, 70px)) 0 clamp(60px, 8vw, 100px); overflow: hidden; isolation: isolate; background: radial-gradient(ellipse at 85% 10%, var(--jaune-voile), transparent 55%), var(--blanc); }
.hero__fond { display: none; }
.hero::before { content: ""; position: absolute; z-index: -2; inset: 0; background-image: linear-gradient(var(--ligne) 1px, transparent 1px), linear-gradient(90deg, var(--ligne) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(ellipse at 70% 30%, #000 10%, transparent 70%); -webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000 10%, transparent 70%); opacity: .7; }
.hero__grille { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(30px, 5vw, 70px); align-items: center; }
.hero h1 { margin: 0 0 22px; font-size: clamp(2.4rem, 5.6vw, 4.6rem); line-height: 1.04; color: var(--noir); }
.hero h1 .mot { display: inline-block; opacity: 0; transform: translateY(.6em) rotate(5deg); filter: blur(6px); animation: mot .9s var(--ease) forwards; animation-delay: calc(var(--i) * 70ms + .2s); }
@keyframes mot { to { opacity: 1; transform: none; filter: none; } }
/* « Padel Morcenx » (2 derniers mots) surligné en jaune */
.hero--accueil h1 .mot:nth-last-child(-n+2) { background: linear-gradient(transparent 58%, var(--jaune) 58%, var(--jaune) 92%, transparent 92%); padding: 0 .08em; }
.hero--accueil h1 .mot:nth-last-child(2) { padding-right: .34em; margin-right: -.26em; } /* comble l espace entre « Padel » et « Morcenx » */
.hero__intro { max-width: 540px; font-size: 1.12rem; color: var(--gris); margin: 0 0 28px; }
.pastille { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 22px; padding: 8px 16px 8px 12px; border-radius: 999px; background: var(--blanc); border: 1px solid var(--ligne); box-shadow: 0 10px 24px -18px rgba(13, 13, 15, .5); color: var(--texte); font-size: .85rem; font-weight: 700; }
.pastille::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--jaune); box-shadow: 0 0 0 0 rgba(237, 240, 0, .9); animation: pouls 2s infinite; }
@keyframes pouls { 70% { box-shadow: 0 0 0 10px rgba(237, 240, 0, 0); } 100% { box-shadow: 0 0 0 0 rgba(237, 240, 0, 0); } }
.hero .boutons .bouton { min-height: 58px; padding: 15px 30px; font-size: 1.02rem; }
.hero__atouts { display: flex; flex-wrap: wrap; gap: 8px; margin: 26px 0 0; padding: 0; list-style: none; }
.hero__atouts li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: var(--gris-clair); color: var(--texte); font-size: .88rem; font-weight: 700; transition: background .3s, transform .4s var(--ease); }
.hero__atouts li:hover { background: var(--jaune); transform: translateY(-3px); }
.hero__atouts svg { width: 16px; height: 16px; }
/* Pictos du kit (TC Chauny) affichés en masque : ils prennent la couleur du texte */
.picto { display: inline-block; width: 18px; height: 18px; flex: none; background-color: currentColor; -webkit-mask: var(--picto) center / contain no-repeat; mask: var(--picto) center / contain no-repeat; }
.picto--raquette { --picto: url("data:image/png;base64,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"); }

/* Pile de photos (la carte du dessus part derrière toutes les 4 s) */
.pile { position: relative; aspect-ratio: 1 / 1; max-width: 520px; width: 100%; margin-inline: auto; perspective: 1400px; }
.pile__scene { position: absolute; inset: 0; transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transform-style: preserve-3d; transition: transform .6s var(--ease); }
.pile__carte { position: absolute; inset: 6% 8% 10% 6%; margin: 0; padding: 12px 12px 52px; border-radius: 26px; background: var(--blanc); box-shadow: 0 30px 60px -30px rgba(13, 13, 15, .55), 0 0 0 1px rgba(13, 13, 15, .05); cursor: pointer;
  transform: translate(calc(var(--pos, 0) * 22px), calc(var(--pos, 0) * -18px)) rotate(var(--rot, 0deg)) scale(calc(1 - var(--pos, 0) * .05));
  transition: transform 1s var(--ease), opacity .6s, filter .6s; z-index: calc(10 - var(--pos, 0)); filter: brightness(calc(1 - var(--pos, 0) * .06)); }
.pile__carte img { width: 100%; height: 100%; object-fit: cover; border-radius: 16px; }
.pile__carte figcaption { position: absolute; left: 0; right: 0; bottom: 14px; text-align: center; font-weight: 800; font-size: .9rem; color: var(--texte); }
.pile__carte.sort { transform: translate(-70%, 12%) rotate(-18deg) scale(.9); opacity: 0; }
.pile__balle { position: absolute; z-index: 20; right: -2%; bottom: 6%; width: clamp(70px, 9vw, 110px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fbff7a, var(--jaune) 45%, #c9cc00); box-shadow: inset -8px -10px 18px rgba(0, 0, 0, .12), 0 24px 30px -18px rgba(13, 13, 15, .6); animation: balle 3.2s cubic-bezier(.5, 0, .5, 1) infinite alternate; }
.pile__balle::before, .pile__balle::after { content: ""; position: absolute; top: 8%; bottom: 8%; width: 60%; border: 3px solid rgba(255, 255, 255, .9); border-radius: 50%; }
.pile__balle::before { left: -32%; border-left-color: transparent; border-top-color: transparent; border-bottom-color: transparent; }
.pile__balle::after { right: -32%; border-right-color: transparent; border-top-color: transparent; border-bottom-color: transparent; }
@keyframes balle { from { transform: translateY(-16px) rotate(-20deg); } to { transform: translateY(10px) rotate(25deg); } }
.pile__pause { position: absolute; z-index: 21; left: 2%; bottom: 2%; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--noir); color: var(--jaune); transition: transform .4s var(--ease); }
.pile__pause:hover { transform: scale(1.1); }
.pile__pause svg { width: 16px; height: 16px; }

/* ---------- Héros des pages intérieures ---------- */
.hero--page { padding-bottom: clamp(50px, 6vw, 80px); }
.hero--page .hero__grille { grid-template-columns: 1.1fr .9fr; }
.hero--page h1 { font-size: clamp(2.3rem, 5vw, 4rem); }
.hero__photo { position: relative; margin: 0; }
.hero__photo .cadre { aspect-ratio: 5 / 4; border-radius: var(--rayon-grand); transform: rotate(2deg); }
.hero__photo .cadre img { animation: kenburns 20s ease-in-out infinite alternate; }
@keyframes kenburns { from { transform: scale(1.04); } to { transform: scale(1.14) translate(-2%, -1%); } }
.hero__photo .pois { right: -40px; bottom: -40px; }
/* Pages légales : héros simple centré */
.hero--simple { text-align: center; }
.hero--simple .hero__logo { width: clamp(150px, 18vw, 220px); margin: 0 auto 16px; }
.hero--simple h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
.hero__logo.apparait { animation: apparait 1s var(--ease) forwards, flotte 6s ease-in-out 1s infinite; }
@keyframes flotte { 50% { transform: translateY(-8px) rotate(-1.5deg); } }

/* ---------- Bandeau défilant ---------- */
.bandeau { position: relative; z-index: 2; overflow: hidden; background: var(--jaune); color: var(--noir); padding: 16px 0; } /* bandeau droit, collé au héros (demande de Fanny) */
.bandeau__piste { display: flex; width: max-content; animation: defile 34s linear infinite; }
.bandeau:hover .bandeau__piste { animation-play-state: paused; }
.bandeau span { display: inline-flex; align-items: center; gap: 30px; padding-right: 30px; font-family: var(--titre); font-weight: 800; font-size: clamp(1.15rem, 2.2vw, 1.7rem); letter-spacing: -.01em; white-space: nowrap; }
.bandeau span::after { content: ""; width: 16px; height: 16px; border-radius: 50%; background: var(--noir); box-shadow: inset 0 0 0 3px var(--jaune), 0 0 0 2px var(--noir); }
@keyframes defile { to { transform: translateX(-50%); } }

/* ---------- Chiffres clés ---------- */
.chiffres { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.chiffre { position: relative; padding: 28px 24px; border-radius: var(--rayon); background: var(--blanc); border: 1px solid var(--ligne); overflow: hidden; transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .4s; }
.chiffre:hover { transform: translateY(-6px); box-shadow: var(--ombre); border-color: transparent; }
.chiffre b { display: block; font-family: var(--titre); font-weight: 800; font-size: clamp(2.6rem, 5vw, 3.6rem); line-height: 1; color: var(--noir); letter-spacing: -.03em; }
.chiffre b small { font-size: .45em; letter-spacing: 0; }
.chiffre > span { display: block; margin-top: 10px; font-weight: 700; color: var(--texte); }
.chiffre::after { content: ""; position: absolute; right: -30px; top: -30px; width: 90px; height: 90px; border-radius: 50%; background: var(--jaune); opacity: .55; transition: transform .6s var(--ease); }
.chiffre:hover::after { transform: scale(1.5); }

/* ---------- Témoignage du gérant ---------- */
.temoignage { position: relative; max-width: 980px; margin: 0 auto; padding: clamp(36px, 5vw, 64px) clamp(24px, 5vw, 70px); border-radius: var(--rayon-grand); background: var(--noir); color: rgba(255, 255, 255, .85); overflow: hidden; }
.temoignage::after { content: "”"; position: absolute; right: 20px; top: -40px; font-family: Georgia, serif; font-size: 18rem; line-height: 1; color: var(--jaune); opacity: .12; pointer-events: none; }
.temoignage__guillemet { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: var(--jaune); color: var(--noir); margin-bottom: 20px; transition: transform .6s var(--ease); }
.temoignage:hover .temoignage__guillemet { transform: rotate(-12deg) scale(1.08); }
.temoignage__guillemet svg { width: 26px; height: 26px; }
.temoignage blockquote { margin: 0 0 26px; font-family: var(--titre); font-weight: 600; font-size: clamp(1.1rem, 2vw, 1.5rem); line-height: 1.55; letter-spacing: -.01em; color: var(--blanc); }
.temoignage figcaption { display: flex; align-items: center; gap: 14px; }
.temoignage__initiales { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; background: var(--blanc); color: var(--noir); font-weight: 800; flex: none; }
.temoignage__auteur { margin: 0; font-weight: 800; color: var(--blanc); }
.temoignage__poste { margin: 0; font-size: .92rem; color: rgba(255, 255, 255, .6); }

/* ---------- Duo texte / photo ---------- */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 6vw, 90px); align-items: center; }
.duo + .duo { margin-top: clamp(70px, 9vw, 120px); }
.duo--inverse .duo__media { order: -1; }
.duo__texte { font-size: 1.08rem; }
.duo__texte p { max-width: 540px; }
.duo__texte .bouton { margin-top: 8px; }
.fond-noir { padding: clamp(32px, 5vw, 60px); border-radius: var(--rayon-grand); background: var(--noir); color: rgba(255, 255, 255, .82); }
.fond-noir h2, .fond-noir h3 { color: var(--blanc); }
.duo__media { position: relative; }
.duo__media .pois { left: -50px; top: -46px; }
.duo--inverse .duo__media .pois { left: auto; right: -50px; }
.cadre { position: relative; overflow: hidden; border-radius: var(--rayon-grand); box-shadow: var(--ombre-forte); background: var(--gris-clair); }
.cadre img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06) translateY(var(--parallaxe, 0)); transition: transform 1.4s var(--ease), clip-path 1.4s var(--ease-doux); }
.duo:hover .cadre img, .rangee:hover .cadre img { transform: scale(1.12) translateY(var(--parallaxe, 0)); }
.cadre--portrait { aspect-ratio: 5 / 6; }
.cadre__etiquette { position: absolute; left: 18px; bottom: 18px; padding: 9px 16px; border-radius: 999px; background: var(--jaune); color: var(--noir); font-weight: 800; font-size: .88rem; box-shadow: 0 12px 24px -14px rgba(0, 0, 0, .6); }

/* Prix « Tarifs Location » et réductions */
.prix { list-style: none; margin: 0 0 1.4em; padding: 0; display: grid; gap: 12px; }
.prix li { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 20px; border-radius: 18px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); transition: transform .4s var(--ease), border-color .3s; }
.prix li:hover { transform: translateX(6px); border-color: var(--jaune); }
.prix__val { white-space: nowrap; font-family: var(--titre); font-weight: 800; font-size: 1.5rem; color: var(--jaune); }
.reduction { display: block; padding: 18px 22px; border-radius: 18px; border: 2px dashed rgba(237, 240, 0, .6); background: rgba(237, 240, 0, .08); }
.reduction b { color: var(--jaune); font-size: 1.25em; }

/* ---------- Cartes « Explorer » (photo cliquable) ---------- */
.cartes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.carte { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 380px; padding: 26px; border-radius: var(--rayon-grand); overflow: hidden; isolation: isolate; color: var(--blanc); transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .5s var(--ease), box-shadow .5s var(--ease); box-shadow: var(--ombre); }
.carte:hover { box-shadow: var(--ombre-forte); }
.carte img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); transition: transform 1.4s var(--ease); }
.carte:hover img { transform: scale(1.15); }
.carte::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(13, 13, 15, .92) 10%, rgba(13, 13, 15, .25) 60%, transparent); }
.carte h3 { color: var(--blanc); font-size: clamp(1.4rem, 2.2vw, 1.75rem); margin-bottom: 8px; }
.carte p { margin: 0 0 16px; color: rgba(255, 255, 255, .82); font-size: .98rem; }
.carte__fleche { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; background: var(--jaune); color: var(--noir); transition: transform .5s var(--ease); }
.carte:hover .carte__fleche { transform: rotate(-45deg) scale(1.08); }
.carte__fleche svg { width: 20px; height: 20px; }

/* ---------- Appel « Nous vous attendons ! » ---------- */
.appel { position: relative; overflow: hidden; isolation: isolate; padding: clamp(40px, 6vw, 80px); border-radius: var(--rayon-grand); background: var(--jaune); color: var(--noir); text-align: center; }
.appel h2 { color: var(--noir); }
.appel p { max-width: 760px; margin: 0 auto 24px; font-size: 1.08rem; color: rgba(13, 13, 15, .82); }
.appel::before, .appel::after { content: ""; position: absolute; z-index: -1; width: 220px; height: 220px; background-image: radial-gradient(circle, rgba(13, 13, 15, .18) 30%, transparent 33%); background-size: 26px 26px; animation: poisFlotte 10s ease-in-out infinite alternate; }
.appel::before { left: -40px; top: -40px; }
.appel::after { right: -40px; bottom: -40px; }

/* ---------- FAQ (accordéons) ---------- */
.faq { display: grid; gap: 12px; max-width: 900px; margin: 0 auto; }
.faq details { border-radius: 22px; background: var(--blanc); border: 1px solid var(--ligne); transition: border-color .4s, box-shadow .4s; }
.faq details[open] { border-color: var(--noir); box-shadow: var(--ombre); }
.faq summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 24px; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary h3 { margin: 0; font-size: 1.1rem; }
.faq summary::after { content: ""; flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--jaune) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0f' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / 14px no-repeat; transition: transform .5s var(--ease), background-color .3s; }
.faq details[open] summary::after { transform: rotate(135deg); background-color: var(--noir); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23edf000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
.faq__rep { overflow: hidden; }
.faq__rep > div { padding: 0 24px 22px; }
.faq__rep p:last-child { margin-bottom: 0; }

/* ---------- Rangées texte / image (page « Qu'est-ce que le padel ? ») ---------- */
.rangee { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 6vw, 80px); align-items: center; }
.rangee + .rangee, .rangee + .bloc-plein, .bloc-plein + .rangee { margin-top: clamp(70px, 9vw, 110px); }
.rangee--inverse .rangee__media { order: 2; }
.rangee__texte { font-size: 1.05rem; }
.rangee__texte p:last-child { margin-bottom: 0; }
.rangee .cadre { aspect-ratio: 8 / 5; }
.cadre--contenu { background: var(--blanc); box-shadow: none; border: 1px solid var(--ligne); }
.cadre--contenu img { object-fit: contain; transform: none; padding: 6%; }
.rangee:hover .cadre--contenu img { transform: scale(1.04); }
.bloc-plein { max-width: 960px; margin-inline: auto; padding: clamp(30px, 5vw, 56px); border-radius: var(--rayon-grand); background: var(--gris-clair); }
.bloc-plein p { font-size: 1.05rem; }

/* Vidéo chargée au clic */
.video { position: relative; overflow: hidden; margin-top: 28px; border-radius: var(--rayon); aspect-ratio: 16 / 9; background: #000; box-shadow: var(--ombre-forte); }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video button { position: absolute; inset: 0; width: 100%; display: grid; place-items: center; color: var(--noir); }
.video button img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), filter .5s; }
.video button:hover img { transform: scale(1.06); filter: brightness(.75); }
.video__lecture { position: relative; width: 92px; height: 92px; display: grid; place-items: center; border-radius: 50%; background: var(--jaune); box-shadow: 0 0 0 0 rgba(237, 240, 0, .7); animation: onde 2.2s infinite; transition: transform .45s var(--ease); }
.video button:hover .video__lecture { transform: scale(1.12); }
.video__lecture svg { width: 32px; height: 32px; margin-left: 4px; }
.video small { position: absolute; left: 0; right: 0; bottom: 0; padding: 12px 16px; background: linear-gradient(transparent, rgba(0, 0, 0, .75)); color: var(--blanc); font-size: .8rem; text-align: left; }
@keyframes onde { 70% { box-shadow: 0 0 0 24px rgba(237, 240, 0, 0); } 100% { box-shadow: 0 0 0 0 rgba(237, 240, 0, 0); } }

/* ---------- Horaires (page Tarifs) ---------- */
.horaires { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 10px; }
.horaire { padding: clamp(26px, 3vw, 36px); border-radius: var(--rayon-grand); background: var(--blanc); border: 1px solid var(--ligne); transition: transform .5s var(--ease), box-shadow .5s var(--ease); overflow: hidden; }
.horaire:hover { transform: translateY(-8px); box-shadow: var(--ombre); }
.horaire h3 { display: flex; align-items: center; gap: 14px; margin-bottom: .5em; }
.horaire__icone { width: 52px; height: 52px; flex: none; display: grid; place-items: center; border-radius: 16px; background: var(--jaune); color: var(--noir); transition: transform .6s var(--ease); }
.horaire:hover .horaire__icone { transform: rotate(-12deg) scale(1.1); }
.horaire__icone svg { width: 26px; height: 26px; }
.horaire--plein { background: var(--noir); border-color: var(--noir); }
.horaire--plein h3 { color: var(--blanc); }
.horaire--plein p { color: rgba(255, 255, 255, .85) !important; }
.horaire--plein .horaire__icone { background: var(--jaune); }
.horaire p { margin: 0; font-size: 1.05rem; color: var(--texte); }
.info { display: flex; gap: 12px; align-items: flex-start; margin: 22px 0 0; padding: 18px 22px; border-radius: 18px; background: var(--jaune-doux); color: var(--texte); font-weight: 600; }
.info svg { width: 22px; height: 22px; flex: none; margin-top: 3px; }

/* ---------- Bloc « Nous trouver » : coordonnées + carte + itinéraires ---------- */
.trouver { display: grid; grid-template-columns: .85fr 1.15fr; gap: 22px; align-items: stretch; }
.trouver__infos { display: flex; flex-direction: column; gap: 12px; }
.coord { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 20px; background: var(--blanc); border: 1px solid var(--ligne); color: var(--texte); font-weight: 700; transition: transform .5s var(--ease), border-color .4s, box-shadow .5s var(--ease); overflow-wrap: anywhere; }
a.coord:hover { transform: translateX(6px); border-color: var(--noir); box-shadow: var(--ombre); }
.coord small { display: block; font-weight: 600; color: var(--gris); font-size: .8rem; }
.coord__ico { width: 48px; height: 48px; border-radius: 50%; flex: none; display: grid; place-items: center; background: var(--jaune); color: var(--noir); transition: transform .5s var(--ease); }
a.coord:hover .coord__ico { transform: rotate(-12deg) scale(1.08); }
.coord__ico svg { width: 22px; height: 22px; }
.trouver__boutons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: auto; }
.trouver__boutons .bouton { width: 100%; padding-inline: 16px; }
.bouton--waze { background: #33ccff; border-color: #33ccff; color: var(--noir); }
.bouton--waze::before { background: var(--noir); }
.bouton--waze:hover { color: #33ccff; border-color: var(--noir); }
.plan { position: relative; min-height: 420px; border-radius: var(--rayon-grand); overflow: hidden; border: 1px solid var(--ligne); box-shadow: var(--ombre); background: var(--gris-clair); }
.plan iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: saturate(.85); }
.plan__epingle { position: absolute; left: 50%; top: 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; background: var(--jaune); border: 3px solid var(--noir); pointer-events: none; animation: ondeNoire 2s infinite; }
@keyframes ondeNoire { 0% { box-shadow: 0 0 0 0 rgba(13, 13, 15, .45); } 70% { box-shadow: 0 0 0 18px rgba(13, 13, 15, 0); } 100% { box-shadow: 0 0 0 0 rgba(13, 13, 15, 0); } }
.plan__adresse { position: absolute; left: 14px; top: 14px; padding: 8px 14px; border-radius: 999px; background: var(--noir); color: var(--jaune); font-weight: 800; font-size: .85rem; pointer-events: none; }
.fond-noir a.lien-contact { color: var(--jaune); font-weight: 700; border-bottom: 2px solid transparent; transition: border-color .3s; }
.fond-noir a.lien-contact:hover { border-color: var(--jaune); }

/* ---------- Galerie (mosaïque + visionneuse) ---------- */
.galerie { display: grid; grid-template-columns: 1.4fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; width: min(1220px, 100% - 40px); margin: 0 auto; padding: clamp(10px, 2vw, 20px) 0 clamp(60px, 7vw, 90px); }
.galerie a { position: relative; display: block; overflow: hidden; border-radius: 24px; background: var(--noir); min-height: 220px; }
.galerie a:first-child { grid-row: span 2; }
.galerie a:nth-child(2) { grid-column: span 2; }
.galerie img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), opacity .5s; }
.galerie a:hover img { transform: scale(1.1); opacity: .75; }
.galerie a::after { content: ""; position: absolute; left: 50%; top: 50%; width: 60px; height: 60px; margin: -30px 0 0 -30px; border-radius: 50%; background: var(--jaune) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5M11 8v6M8 11h6'/%3E%3C/svg%3E") center / 26px no-repeat; transform: scale(0) rotate(-90deg); transition: transform .5s var(--ease); }
.galerie a:hover::after, .galerie a:focus-visible::after { transform: none; }
.visionneuse { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 60px 70px; background: rgba(13, 13, 15, .94); opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s; touch-action: pan-y; }
.visionneuse.ouverte { opacity: 1; visibility: visible; transition: opacity .35s, visibility 0s; }
.visionneuse img { max-width: 100%; max-height: calc(100svh - 120px); border-radius: 18px; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); transform: scale(.94); transition: transform .5s var(--ease), opacity .25s; }
.visionneuse.ouverte img { transform: none; }
.visionneuse button { position: absolute; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .12); color: var(--blanc); transition: background .3s, color .3s; }
.visionneuse button:hover { background: var(--jaune); color: var(--noir); }
.visionneuse button svg { width: 24px; height: 24px; }
.visionneuse__fermer { top: 14px; right: 14px; }
.visionneuse__prec { left: 12px; top: 50%; margin-top: -26px; }
.visionneuse__suiv { right: 12px; top: 50%; margin-top: -26px; }
.visionneuse__compte { position: absolute; bottom: 18px; left: 0; right: 0; text-align: center; color: rgba(255, 255, 255, .7); font-size: .9rem; }

/* ---------- Application du club ---------- */
.appli__carte { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: 30px; align-items: center; padding: clamp(32px, 5vw, 64px); border-radius: 40px; background: var(--noir); color: rgba(255, 255, 255, .8); overflow: hidden; isolation: isolate; }
.appli__carte::before { content: ""; position: absolute; z-index: -1; right: -120px; top: -160px; width: 460px; height: 460px; border-radius: 50%; background: radial-gradient(circle, rgba(237, 240, 0, .35), transparent 65%); animation: respire 9s ease-in-out infinite alternate; }
@keyframes respire { to { transform: scale(1.25); opacity: .7; } }
.appli__carte h2 { color: var(--blanc); }
.appli__logo { width: 190px; margin: 0 0 18px; }
.appli__fonctions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; padding: 0; list-style: none; }
.appli__fonctions li { padding: 7px 15px; border-radius: 999px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); color: var(--blanc); font-weight: 700; font-size: .9rem; transition: background .3s, color .3s, transform .4s var(--ease); }
.appli__fonctions li:hover { background: var(--jaune); color: var(--noir); transform: translateY(-3px); }
.stores { display: flex; flex-wrap: wrap; gap: 10px; }
.stores a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 22px 10px 18px; border-radius: 999px; background: var(--blanc); color: var(--noir); font-weight: 800; font-size: .95rem; line-height: 1.2; text-align: left; transition: transform .4s var(--ease), background .3s, box-shadow .4s; }
.stores a small { display: block; font-size: .68rem; font-weight: 600; opacity: .7; }
.stores a:hover { transform: translateY(-4px); background: var(--jaune); box-shadow: 0 18px 30px -16px rgba(237, 240, 0, .7); }
.stores svg { width: 24px; height: 24px; }
.telephones { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); justify-content: center; gap: 18px; perspective: 1200px; }
.telephones img { width: 100%; border-radius: 26px; box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .8); transition: transform .9s var(--ease); }
.telephones > div:first-child img { transform: rotateY(14deg) translateY(16px); }
.telephones > div:last-child img { transform: rotateY(-14deg) translateY(-16px); }
.appli__carte:hover .telephones img { transform: none; }

/* ---------- Bas de page ---------- */
.pied { position: relative; background: var(--noir); color: rgba(255, 255, 255, .7); padding: clamp(60px, 7vw, 90px) 0 0; font-size: .95rem; overflow: hidden; isolation: isolate; }
.pied::before { content: ""; position: absolute; z-index: -1; right: -60px; top: -60px; width: 300px; height: 300px; background-image: radial-gradient(circle, rgba(237, 240, 0, .5) 30%, transparent 33%); background-size: 34px 34px; opacity: .35; }
.pied__grille { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 30px 50px; align-items: start; padding-bottom: clamp(40px, 5vw, 60px); }
.pied__logo { display: inline-block; width: 200px; margin-bottom: 18px; transition: transform .6s var(--ease); }
.pied__logo:hover { transform: rotate(-3deg) scale(1.04); }
.pied p { margin: 0; line-height: 1.7; }
.pied h2 { color: var(--blanc); font-family: var(--police); font-size: .78rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 16px; }
.pied a { transition: color .3s; }
.pied a:hover { color: var(--jaune); }
.pied__liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pied__liste li { display: flex; align-items: center; gap: 10px; }
.pied__liste li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--jaune); flex: none; }
.pied .stores a { background: rgba(255, 255, 255, .08); color: var(--blanc); }
.pied .stores a:hover { color: var(--noir); }
.pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 30px; padding: 20px 0 24px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .86rem; }
.pied__bas p { margin: 0; }
.pied__geant { margin: 10px 0 -0.14em; font-family: var(--titre); font-weight: 800; font-size: clamp(2.6rem, 10.5vw, 9.5rem); line-height: .85; letter-spacing: -.04em; text-align: center; white-space: nowrap; color: transparent; background: linear-gradient(180deg, rgba(237, 240, 0, .18), transparent 85%); -webkit-background-clip: text; background-clip: text; user-select: none; }
.coeur { display: inline-block; color: #e25555; animation: bat 1.4s ease-in-out infinite; }
@keyframes bat { 15%, 45% { transform: scale(1.25); } 30% { transform: scale(1); } }

/* Boutons flottants : retour en haut + « Réserver » (téléphone) */
.flottant { position: fixed; right: 18px; bottom: 18px; z-index: 90; display: flex; align-items: center; gap: 10px; transition: opacity .3s; }
body.menu-ouvert .flottant { opacity: 0; pointer-events: none; }
.haut { width: 50px; height: 50px; border-radius: 50%; background: var(--noir); color: var(--jaune); display: grid; place-items: center; box-shadow: 0 12px 26px -12px rgba(0, 0, 0, .6); opacity: 0; visibility: hidden; transform: translateY(16px); pointer-events: none; transition: opacity .4s, transform .5s var(--ease), visibility .4s, background .3s; }
.haut.visible { opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
.haut:hover { background: var(--jaune); color: var(--noir); }
.haut svg { width: 20px; height: 20px; }
.flottant .bouton { display: none; opacity: 0; transform: translateY(16px); pointer-events: none; transition: opacity .4s, transform .5s var(--ease); }
.flottant.loin .bouton { opacity: 1; transform: none; pointer-events: auto; }

/* ---------- Pages légales ---------- */
.legal { width: min(900px, 100% - 40px); margin-inline: auto; }
.legal h2 { font-size: clamp(1.35rem, 2.6vw, 1.75rem); margin: 2em 0 .6em; }
.legal h3 { font-size: 1.15rem; margin: 1.4em 0 .5em; }
.legal ul, .legal ol { padding-left: 1.3em; margin: 0 0 1em; }
.legal li { margin-bottom: .35em; }
.legal li::marker { color: var(--noir); }
.legal a { color: var(--texte); font-weight: 700; text-decoration: underline; text-decoration-color: #c9c400; text-decoration-thickness: 2px; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal a:hover { text-decoration-color: var(--noir); }
.legal__maj { font-size: .9rem; }
.legal__sommaire { background: var(--gris-clair); border-radius: var(--rayon); padding: 20px 26px; margin: 0 0 2em; }
.legal__sommaire ol { margin: .5em 0 0; }
.a-confirmer { background: #fff1a8; color: var(--texte); font-weight: 700; padding: 0 .3em; border-radius: 4px; white-space: nowrap; }
.pied__legal a { text-decoration: underline; text-underline-offset: 2px; }

/* Page 404 */
.page-404 .hero { min-height: 100vh; display: flex; align-items: center; text-align: center; }
.page-404 .hero .boutons { justify-content: center; }
.page-404 .code { display: block; font-family: var(--titre); font-weight: 800; font-size: clamp(6rem, 22vw, 12rem); line-height: 1; color: var(--noir); text-shadow: 8px 8px 0 var(--jaune); }
.page-404 .liens-legaux { margin: 28px 0 0; font-size: .85rem; }
.page-404 .liens-legaux a { text-decoration: underline; text-underline-offset: 2px; }

/* ---------- Adaptations écran ---------- */
@media (max-width: 1180px) {
  .menu, .entete__actions .bouton { display: none; }
  .burger { display: block; }
  .entete__actions { margin-left: auto; }
  .flottant .bouton { display: inline-flex; }
  .pied__bas { padding-bottom: 90px; }
}
@media (max-width: 960px) {
  .hero__grille, .hero--page .hero__grille, .duo, .rangee, .trouver, .appli__carte { grid-template-columns: 1fr; }
  .duo--inverse .duo__media { order: 0; }
  .rangee--inverse .rangee__media { order: 0; }
  .pile { max-width: 440px; }
  .chiffres { grid-template-columns: 1fr 1fr; }
  .cartes { grid-template-columns: 1fr 1fr; }
  .cartes .carte:last-child { grid-column: span 2; }
  .horaires { grid-template-columns: 1fr; }
  .pied__grille { grid-template-columns: 1fr 1fr; }
  .pied__marque { grid-column: 1 / -1; }
  .cadre--portrait { aspect-ratio: 4 / 3; }
}
@media (max-width: 620px) {
  body { font-size: 15.5px; }
  :root { --entete-h: 76px; }
  .entete__logo img { height: 54px; }
  .entete.reduite .entete__logo img { height: 46px; }
  .hero .boutons, .appel .boutons { flex-direction: column; align-items: stretch; }
  .hero .boutons .bouton { width: 100%; }
  .chiffre { padding: 22px 18px; }
  .cartes { grid-template-columns: 1fr; }
  .cartes .carte:last-child { grid-column: auto; }
  .carte { min-height: 300px; }
  .prix li { flex-wrap: wrap; }
  .trouver__boutons { grid-template-columns: 1fr; }
  .plan { min-height: 340px; }
  .galerie { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
  .galerie a:first-child { grid-row: auto; grid-column: span 2; min-height: 260px; }
  .galerie a:nth-child(2) { grid-column: span 2; }
  .galerie a { min-height: 160px; }
  .visionneuse { padding: 60px 12px; }
  .visionneuse__prec, .visionneuse__suiv { top: auto; bottom: 8px; margin: 0; }
  .telephones { gap: 12px; }
  .pied__grille { grid-template-columns: 1fr; }
  .pied__bas { flex-direction: column; }
  .pois { width: 120px; height: 120px; }
  .duo__media .pois { left: -20px; }
  .duo--inverse .duo__media .pois { right: -20px; }
  .hero__photo .pois { right: -10px; }
}

/* Mouvements réduits : tout est affiché, sans animation */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .revele, .apparait, .ligne-titre > span, .hero h1 .mot { opacity: 1 !important; transform: none !important; filter: none !important; }
  .rideau img { clip-path: none !important; }
  .titre { background-size: 100% .38em !important; }
  .cadre img, .carte { transform: none !important; }
}

/* Bloc application : téléphone (écran de l'appli en thème noir) + vignette « Réservation effectuée » jaune (2026-10-26) */
.telephone-appli { position: relative; width: min(300px, 80%); margin: 0 auto; }
.telephone-appli__tel { display: block; width: 100%; height: auto; filter: drop-shadow(0 34px 40px rgba(0, 0, 0, .5)); transform: rotate(4deg); transition: transform .8s var(--ease); }
.appli__carte:hover .telephone-appli__tel { transform: rotate(1deg) translateY(-8px); }
.telephone-appli__badge { position: absolute; left: -38%; bottom: 14%; width: 92%; height: auto; filter: drop-shadow(0 20px 26px rgba(0, 0, 0, .35)); animation: badge-flotte 5s ease-in-out infinite alternate; }
@keyframes badge-flotte { from { transform: translateY(-6px) rotate(-2deg); } to { transform: translateY(8px) rotate(1deg); } }
@media (max-width: 980px) { .telephone-appli { width: min(260px, 70%); margin-top: 20px; } .telephone-appli__badge { left: -24%; } }
@media (prefers-reduced-motion: reduce) { .telephone-appli__badge { animation: none; } }

/* Formulaire « Écrivez-nous » (page Contact) — 2026-10-26 */
.formulaire { max-width: 860px; margin: 0 auto; padding: clamp(28px, 4vw, 48px); border-radius: var(--rayon-grand); background: var(--blanc); border: 1px solid var(--ligne); box-shadow: var(--ombre); }
.formulaire h2 { margin-bottom: .3em; }
.formulaire__intro { margin: 0 0 22px; color: var(--gris); }
.champs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.champ { position: relative; }
.champ--large { grid-column: 1 / -1; }
.champ input, .champ textarea { width: 100%; padding: 24px 18px 10px; border-radius: 16px; border: 1.5px solid var(--ligne); background: var(--gris-clair); font: inherit; color: var(--texte); transition: border-color .3s, background .3s, box-shadow .3s; }
.champ textarea { min-height: 190px; resize: vertical; }
.champ label { position: absolute; left: 19px; top: 17px; font-weight: 600; color: #8a8c91; pointer-events: none; transform-origin: left top; transition: transform .3s var(--ease), color .3s; }
.champ input:focus, .champ textarea:focus { outline: none; border-color: var(--noir); background: var(--blanc); box-shadow: 0 0 0 4px var(--jaune-voile); }
.champ input:focus + label, .champ input:not(:placeholder-shown) + label, .champ textarea:focus + label, .champ textarea:not(:placeholder-shown) + label { transform: translateY(-11px) scale(.74); color: var(--texte); }
.formulaire .bouton { margin-top: 20px; }
.formulaire .bouton[disabled] { opacity: .6; pointer-events: none; }
.piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.message-form { margin: 14px 0 0; padding: 14px 18px; border-radius: 14px; font-weight: 700; display: none; }
.message-form.ok { display: block; background: rgba(37, 160, 90, .12); color: #17673a; }
.message-form.erreur { display: block; background: #fdecec; color: #b42318; }
.formulaire__rgpd { margin: 12px 0 0; font-size: .85rem; color: var(--gris); }
.formulaire__rgpd a { text-decoration: underline; }
@media (max-width: 600px) { .champs { grid-template-columns: 1fr; } }