/* Site premium des clubs de nutrition. Pilote Sainte-Julie. Refonte du 15/10/2026 (David : rien n'etait aligne).
   UNE regle par composant, ecrite pour le telephone puis completee par deux media queries (700 et 960 px).

   LA GRILLE (valable sur toutes les pages)
   - Contenu : colonne de 1290 px max, retrait --marge (18 / 28). Son bord gauche est celui du logo, son bord droit celui du bouton du menu.
   - Cadres (heros, cartes cremes, bloc sombre, formulaire, carte du club) : UN SEUL retrait interieur --pad (20 / 32 / 40).
     Le texte d'un cadre part donc a --marge + --pad, partout.
   - Deux colonnes : 1fr 1fr separees de --gap (18 / 40 / 64). La 2e colonne demarre au centre de la page plus --gap/2,
     dans un cadre comme hors cadre, sur TOUTES les pages (1440 px : 752).
     A 1440 px les textes partent donc de 103 (hors cadre), 143 (dans un cadre) ou 752 (2e colonne).
   - Colonne de lecture (article, mentions) : 720 px, franchement centree.
   ECARTS
   - Entre deux blocs : --sec (32 / 56 / 72), porte uniquement par margin-block des sections (les marges voisines se confondent).
   - En-tete de bloc : surtitre, 12 px, titre, 16 px, texte. Rangees de cartes : --gap.
   DEBORDEMENTS (sobres, meme amplitude --deb : 0 sur telephone, 24 des 700 px, 48 des 960 px, meme ombre --ombre)
   - Heros : le chatbot et la bande des 3 reperes depassent du bas du heros de --deb, et finissent sur la meme ligne.
   - Carte creme avec photo (equipe, resultats) : la photo depasse du haut de sa carte de --deb.
   ANIMATIONS : apparition 560 ms ease-out, montee de 20 px, decalage 70 ms. Survol : elevation de 4 px, image a 103 %.
   Le masquage initial n'existe que si le JS a pose la classe js sur html. prefers-reduced-motion coupe tout.
   RAYONS 14 / 24 / 999. Zones tactiles 44 px. */

@font-face{font-family:Figtree;font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/figtree-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Figtree;font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/figtree-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
 --vert:#266431;--nuit:#0E2512;--sapin:#163E35;--creme:#F9F8F4;--lin:#E0DFD9;--encre:#101820;--gris:#74736E;
 --texte:#4a4945;--trait:#ecebe6;--r-s:14px;--r-m:24px;--r-l:999px;--large:1290px;
 --marge:18px;--pad:20px;--gap:18px;--sec:32px;--deb:0px;
 --ombre:0 30px 60px -28px #0e2512a6,0 0 0 1px #0e25120f;
 --ease:cubic-bezier(.22,.61,.36,1)
}
@media (min-width:700px){:root{--marge:28px;--pad:32px;--gap:40px;--sec:56px;--deb:24px}}
@media (min-width:960px){:root{--pad:40px;--gap:64px;--sec:72px;--deb:48px}}

/* Base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:#fff;color:var(--encre);font:16px/1.6 Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--vert);text-underline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible+.sf-tuile,input:focus-visible+.sf-chip,summary:focus-visible{outline:3px solid var(--vert);outline-offset:3px;border-radius:var(--r-s)}
fieldset{min-width:0}
[hidden]{display:none!important}
.nobr{white-space:nowrap}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
address{font-style:normal}

/* Colonne et sections */
.sf-wrap{max-width:var(--large);margin-inline:auto;padding-inline:var(--marge)}
.sf-sec{margin-block:var(--sec)}
.sf-sec.first{margin-top:28px}
.sf-sec.deborde{margin-top:calc(var(--sec) + var(--deb))}
@media (min-width:960px){.sf-sec.first{margin-top:48px}}

/* Titres. Surtitre, 12 px, titre, 16 px, texte */
.sf-eye{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--vert);font-weight:700;margin:0 0 12px}
.sf-eye::before{content:"";width:18px;height:1.5px;background:currentColor}
.sf-h1{font-size:28px;line-height:1.08;font-weight:700;letter-spacing:-.035em;color:var(--nuit);margin:0 0 16px}
.sf-h2{font-size:20px;line-height:1.15;font-weight:700;letter-spacing:-.03em;color:var(--nuit);margin:0 0 16px}
.sf-h3{font-size:18px;line-height:1.2;font-weight:700;letter-spacing:-.02em;color:var(--nuit);margin:12px 0 8px}
.sf-h3-haut{margin-top:0}
.sf-h3-espace{margin-top:24px}
.sf-p{color:var(--texte);margin:0 0 16px;line-height:1.6}
.sf-p-serre{margin:0}
.sf-p-bas{margin:16px 0 0}
.sf-s{font-size:13px;color:var(--gris)}
.sf-s-nu{margin:0}
.sf-b{font-weight:700;color:var(--nuit)}
.sf-tete{display:grid;gap:0}
.sf-tete>.sf-p,.sf-tete .sf-p:last-child{margin-bottom:0}
.sf-tete>.sf-p{margin-top:0}
@media (min-width:700px){
 .sf-tete{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);align-items:end}
 .sf-tete .sf-h1,.sf-tete .sf-p{margin-bottom:0}
 .sf-tete>div .sf-h1{margin-bottom:0}
 .sf-tete .sf-chips{grid-column:1/-1}
}
@media (min-width:960px){.sf-h1{font-size:44px}.sf-h2{font-size:30px}.sf-h3{font-size:20px}}

/* Boutons. Une hauteur (48), un rayon, un corps (15), une transition de couleur */
.sf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:var(--r-l);background:linear-gradient(180deg,#ffffff24,#0000001f),var(--vert);box-shadow:0 10px 20px -12px #266431cc;color:#fff;font:700 15px/1.2 Figtree,sans-serif;padding:0 24px;text-align:center;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .15s ease}
.sf-btn:active{transform:scale(.98)}
.sf-btn.ghost{background:none;box-shadow:none;border-color:var(--vert);color:var(--vert)}
.sf-btn.light{background:#fff;color:var(--nuit);box-shadow:0 10px 24px -12px #0009}
.sf-btn.plein{display:flex;width:100%}
.sf-btn[disabled]{opacity:.55;cursor:wait}
.sf-btn-bas{margin-top:16px}
.sf-btn-haut{margin-top:16px}
@media (hover:hover){
 .sf-btn:hover{background-color:#1b4d26;box-shadow:0 14px 24px -12px #266431e6}
 .sf-btn.ghost:hover{background:#2664311a;color:var(--nuit);border-color:var(--nuit)}
 .sf-btn.light:hover{background:var(--creme);box-shadow:0 14px 28px -12px #000b}
}

/* Barre fixe du bas, telephone */
.sf-bar{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:25;background:#ffffffe6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--lin);border-radius:var(--r-l);padding:6px;display:flex;gap:6px;box-shadow:0 12px 30px -12px #0e251259}
.sf-bar .sf-btn{flex:1}
.sf-tel{width:48px;height:48px;flex:0 0 48px;border:1.5px solid var(--vert);border-radius:var(--r-l);display:flex;align-items:center;justify-content:center;color:var(--vert);background:#fff}
.sf-pad{height:84px}
.pas-barre .sf-bar,.pas-barre .sf-pad{display:none!important}

/* Cadres : un seul retrait interieur, --pad */
.sf-card{border-radius:var(--r-m);padding:var(--pad);box-shadow:0 0 0 1px var(--trait),0 18px 34px -26px #0e251266;background:#fff}
.sf-cream{background:linear-gradient(180deg,var(--creme),#f3f1ea);border-radius:var(--r-m);padding:var(--pad)}
.sf-dark{background:radial-gradient(120% 90% at 100% 0,#2a5a3a 0,var(--sapin) 45%,var(--nuit) 100%);box-shadow:0 24px 40px -26px var(--nuit);color:#fff;border-radius:var(--r-m);padding:var(--pad)}
.sf-dark .sf-h2{color:#fff;font-size:24px}
.sf-dark .sf-p{color:#ffffffcc}
.sf-dark-suite .sf-btn{width:100%}
.sf-dark-suite .sf-p{margin-bottom:16px}
@media (min-width:700px){
 .sf-dark{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);align-items:center}
 .sf-dark .sf-h2{margin:0;font-size:28px}
 .sf-dark-suite .sf-btn{width:auto}
}
@media (min-width:960px){.sf-dark .sf-h2{font-size:32px}}

/* Images */
.sf-img{border-radius:var(--r-m);overflow:hidden;position:relative;background:var(--creme);box-shadow:0 14px 30px -20px #0e251280}
.sf-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.sf-img.sm{border-radius:var(--r-s)}
.sf-cap{position:absolute;left:12px;bottom:12px;z-index:1;display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:var(--r-l);background:#ffffffd9;backdrop-filter:blur(6px);color:var(--nuit);font-size:12px;font-weight:700}
.sf-tag{display:inline-flex;align-items:center;gap:4px;min-height:26px;padding:0 10px;border-radius:var(--r-l);background:#fff;border:1px solid var(--lin);font-size:12px;font-weight:700;color:var(--nuit)}
.sf-line{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--lin)}
.sf-line:first-child{padding-top:0}
.sf-line:last-child{border-bottom:0;padding-bottom:0}
.sf-num{flex:0 0 28px;height:28px;border-radius:var(--r-l);background:linear-gradient(180deg,var(--vert),var(--nuit));box-shadow:0 0 0 4px #fff;color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px}
.sf-cream .sf-num{box-shadow:0 0 0 4px var(--creme)}
.sf-coche{flex:0 0 22px;height:22px;margin-top:2px;color:var(--vert)}

/* Deux colonnes. UNE grille : 1fr 1fr, ecart --gap. La 2e colonne demarre au meme x partout. */
.sf-duo,.sf-split,.sf-equipe,.sf-lieu,.sf-contact,.sf-une,.sf-pied-grille,.sf-liste,.sf-tete,.sf-dark,.sf-etapes{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--gap)}
.sf-tete{row-gap:0}
.sf-dark{row-gap:16px}
.sf-duo .sf-img{aspect-ratio:4/3}
.sf-img.portrait,.sf-carre.portrait{aspect-ratio:4/5;max-width:440px;width:100%}
.sf-carre{width:100%;aspect-ratio:1;border-radius:var(--r-m);overflow:hidden;box-shadow:var(--ombre)}
.sf-carre img{width:100%;height:100%;object-fit:cover}
@media (min-width:700px){
 .sf-duo,.sf-split,.sf-equipe,.sf-lieu,.sf-contact,.sf-une,.sf-pied-grille,.sf-liste,.sf-tete,.sf-dark{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sf-duo,.sf-equipe,.sf-lieu,.sf-une{align-items:center}
 .sf-split,.sf-contact{align-items:start}
 .sf-duo.inverse .sf-img{order:2}
 .sf-duo.inverse .sf-img.portrait{justify-self:start}
 /* Debordement : la photo d'une carte creme depasse du haut de sa carte */
 .sf-equipe>.sf-carre{align-self:start;margin-top:calc(-1*(var(--pad) + var(--deb)))}
}

/* Etapes de l'accueil (15/10/2026) : titre, phrase et bouton REGROUPES a gauche et centres verticalement face aux
   3 etapes (avant : titre en haut, bouton en bas, un grand vide entre). Telephone : titre, phrase, etapes, bouton. */
.sf-split>.sf-h2,.sf-etapes>.sf-h2{margin-bottom:0}
.sf-etapes{row-gap:16px}
.sf-etapes>.sf-etapes-p{margin:0}
.sf-etapes>.sf-etapes-liste{margin-top:8px}
.sf-etapes .sf-btn{width:100%;margin-top:16px}
@media (min-width:700px){
 .sf-etapes{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr auto auto auto 1fr;row-gap:0;align-items:start}
 .sf-etapes>.sf-h2{grid-column:1;grid-row:2;margin:0 0 16px}
 .sf-etapes>.sf-etapes-p{grid-column:1;grid-row:3}
 .sf-etapes>.sf-etapes-liste{grid-column:2;grid-row:1/-1;align-self:center;margin:0}
 .sf-etapes>.sf-btn{grid-column:1;grid-row:4;justify-self:start;margin:24px 0 0;width:auto}
}

/* Galerie qui defile : 2 photos visibles sur la grille a partir de 700 px */
.sf-gal{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--marge) 14px;scroll-padding-inline:var(--marge);scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-inline:calc(-1*var(--marge))}
.sf-gal::-webkit-scrollbar{display:none}
.sf-gal>figure{flex:0 0 84%;aspect-ratio:4/3;scroll-snap-align:start;margin:0}
.sf-galwrap{position:relative}
.sf-galnav{display:none}
@media (min-width:700px){
 .sf-gal{gap:var(--gap)}
 .sf-gal>figure{flex-basis:calc((100% - var(--gap))/2)}
}
@media (min-width:700px) and (hover:hover) and (pointer:fine){
 .js .sf-galnav{display:flex;position:absolute;top:calc(50% - 29px);z-index:2;width:48px;height:48px;align-items:center;justify-content:center;border-radius:var(--r-l);border:1.5px solid var(--nuit);background:#fff;color:var(--nuit);cursor:pointer;box-shadow:0 8px 18px -8px #0e251299;padding:0;transition:opacity .2s}
 .js .sf-galnav.prec{left:12px}
 .js .sf-galnav.suiv{right:12px}
 .js .sf-galnav[disabled]{opacity:.35;cursor:default}
}

/* FAQ */
.sf-faq details{border-bottom:1px solid var(--lin)}
.sf-faq details:first-child{border-top:1px solid var(--lin)}
.sf-faq summary{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:52px;padding:10px 0;cursor:pointer;list-style:none;font-weight:600;color:var(--nuit)}
.sf-faq summary::-webkit-details-marker{display:none}
.sf-faq summary::after{content:"+";color:var(--vert);font-weight:800;font-size:22px;line-height:1;flex:0 0 auto;transition:transform .25s var(--ease)}
.sf-faq details[open] summary::after{transform:rotate(45deg)}
.sf-faq details>div{padding:0 0 16px;color:var(--texte)}

/* Carte du club : photo a gauche, adresse a droite, dans une carte creme (retrait --pad) */
.sf-lieu .sf-img{aspect-ratio:4/3}
.sf-lieu-txt .sf-h2{margin-bottom:12px}
.sf-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px}
.sf-actions a{min-height:48px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-l);border:1.5px solid var(--vert);font-weight:700;font-size:15px;text-decoration:none;background:#fff;transition:background-color .22s,color .22s,border-color .22s}
@media (hover:hover){.sf-actions a:hover{background:var(--nuit);border-color:var(--nuit);color:#fff}}
@media (min-width:700px){.sf-lieu:not(.nu) .sf-img{aspect-ratio:auto;height:100%;min-height:320px}}
/* Variante sans cadre (contact), 2e colonne : photo puis adresse, a la hauteur du formulaire */
.sf-lieu.nu{display:flex;flex-direction:column;align-items:stretch;gap:20px;padding:0;background:none}
.sf-lieu.nu .sf-img{aspect-ratio:3/2}
@media (min-width:700px){
 /* La colonne de droite suit le defilement du formulaire (photo de 600 px : pas d'agrandissement force) */
 .sf-contact-lieu{position:sticky;top:96px}
 .sf-lieu.nu .sf-img{aspect-ratio:auto;height:440px}
}

/* Filtres en vignettes */
.sf-chips{display:flex;flex-wrap:wrap;gap:8px}
.sf-defile{flex-wrap:nowrap;overflow-x:auto;margin:16px calc(-1*var(--marge)) 0;padding:2px var(--marge) 10px;scroll-snap-type:x proximity;scrollbar-width:none;scroll-padding-inline:var(--marge)}
.sf-defile::-webkit-scrollbar{display:none}
.sf-chip{display:inline-flex;align-items:center;flex:0 0 auto;min-height:44px;padding:0 16px;border-radius:var(--r-l);border:1px solid var(--lin);font:700 14px/1 Figtree,sans-serif;color:var(--nuit);background:#fff;box-shadow:0 4px 10px -8px #0e251266;cursor:pointer;scroll-snap-align:start;transition:background-color .2s,color .2s,border-color .2s}
.sf-chip.on,input:checked+.sf-chip{background:var(--nuit);color:#fff;border-color:var(--nuit);font-weight:800}
.sf-chip.on::before,input:checked+.sf-chip::before{content:"\2713";margin-right:6px}

/* Conseils : a la une, puis cartes en 2 colonnes */
.sf-une{display:grid;text-decoration:none;color:inherit}
.sf-une .sf-img{aspect-ratio:3/2}
.sf-une .sf-h3{font-size:24px;line-height:1.15;margin:12px 0 8px}
.sf-liste{row-gap:24px}
.sf-liste a{display:flex;gap:16px;align-items:center;padding:12px;border:1px solid var(--trait);border-radius:var(--r-m);background:#fff;text-decoration:none;color:inherit;min-height:96px;transition:transform .28s var(--ease),box-shadow .28s var(--ease)}
.sf-liste .sf-img{flex:0 0 112px;height:84px;box-shadow:none}
.sf-liste .sf-b{line-height:1.3;margin-bottom:4px}
.sf-liste-une{grid-template-columns:1fr!important;gap:16px}
@media (min-width:960px){.sf-une .sf-h3{font-size:32px}}
@media (hover:hover){
 .sf-liste a:hover,.sf-une:hover .sf-img{box-shadow:0 22px 36px -24px #0e2512a6}
 .sf-liste a:hover{transform:translateY(-4px)}
 .sf-liste a:hover .sf-b,.sf-une:hover .sf-h3{text-decoration:underline;text-underline-offset:3px}
 .sf-liste a:hover img,.sf-une:hover img,.sf-gal figure:hover img{transform:scale(1.03)}
}

/* Article. Colonne de lecture centree, 720 px */
.sf-art{max-width:720px;margin-inline:auto}
.sf-retour{display:inline-flex;align-items:center;min-height:44px;font-weight:700;text-decoration:none}
.sf-auteur{display:flex;gap:10px;align-items:center;margin:4px 0 0}
.sf-auteur img{width:44px;height:44px;border-radius:var(--r-l);object-fit:cover;box-shadow:0 0 0 3px #fff,0 0 0 4px var(--lin)}
.sf-art .sf-visuel{aspect-ratio:3/2;margin:24px 0}
.sf-essentiel{margin:24px 0}
.sf-essentiel p{margin:8px 0 0;color:var(--texte)}
.sf-art-bloc{margin-top:32px}
.sf-corps h2{font-size:22px;line-height:1.2;letter-spacing:-.025em;color:var(--nuit);margin:32px 0 12px}
.sf-corps h3{font-size:18px;color:var(--nuit);margin:24px 0 8px}
.sf-corps p,.sf-corps li{color:var(--texte)}
.sf-corps strong{color:var(--nuit)}
.sf-corps blockquote{margin:24px 0;padding:20px;border-left:3px solid var(--vert);background:var(--creme);border-radius:0 var(--r-s) var(--r-s) 0}
.sf-corps blockquote p{margin:0;font-size:18px;line-height:1.45;color:var(--nuit);font-weight:600}
.sf-corps blockquote i{font-style:normal}
.sf-corps table{width:100%;border-collapse:collapse;font-size:14px;display:block;overflow-x:auto}
.sf-corps td,.sf-corps th{border-bottom:1px solid var(--lin);padding:8px;text-align:left}
.sf-avis{font-size:13px;color:var(--gris);border-top:1px solid var(--lin);padding-top:16px}
.sf-404{text-align:center;max-width:560px}
.sf-404 .sf-eye{justify-content:center}
.sf-404-actions{display:grid;gap:12px;margin-top:24px}

/* Formulaire */
.sf-champs{border:0;padding:0;margin:0}
.sf-label{display:block;font-size:13px;font-weight:700;color:var(--nuit);margin:20px 0 8px;padding:0}
.sf-label .sf-s{font-weight:400}
.sf-champs:first-child .sf-label{margin-top:0}
legend.sf-label{padding-top:20px;margin-top:0}
form>fieldset:first-child legend.sf-label{padding-top:0}
.sf-field{width:100%;border:1px solid var(--lin);border-radius:18px;min-height:52px;padding:0 16px;font:16px Figtree,sans-serif;color:var(--encre);background:#fff;box-shadow:0 8px 18px -14px #0e251266;-webkit-appearance:none;appearance:none;transition:border-color .2s,outline-color .2s}
.sf-field:focus{outline:3px solid #26643155;border-color:var(--vert)}
.sf-field.err{border-color:var(--encre);border-width:2px}
.sf-err{display:none;font-size:13px;color:var(--encre);font-weight:700;margin-top:6px}
.sf-err::before{content:"! "}
.err+.sf-err,.sf-err.on{display:block}
.sf-civ{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sf-civ>label{display:flex}
.sf-tuiles{display:flex;gap:10px;overflow-x:auto;margin-inline:calc(-1*var(--marge));padding:2px var(--marge) 10px;scroll-snap-type:x proximity;scrollbar-width:none;scroll-padding-inline:var(--marge)}
.sf-tuiles::-webkit-scrollbar{display:none}
.sf-tuiles>label,.sf-civ>label,.sf-chips>label,.sf-bulles>label{position:relative}  /* l'entree .sr est en absolu : sans ancre elle echappe au defilement et elargit la page */
.sf-tuiles>label{flex:0 0 116px;display:flex;scroll-snap-align:start}
.sf-tuile{flex:1 1 auto;width:100%;min-height:120px;border:1px solid var(--lin);border-radius:18px;padding:14px 12px;display:flex;flex-direction:column;justify-content:space-between;gap:10px;color:var(--vert);background:#fff;position:relative;box-shadow:0 8px 18px -14px #0e251266;cursor:pointer;user-select:none;transition:background-color .2s,border-color .2s}
.sf-civ .sf-tuile{min-height:84px;flex-direction:row;align-items:center;justify-content:flex-start}
.sf-tuile svg{width:32px;height:32px;flex:0 0 auto}
.sf-tuile span{font-size:14px;line-height:1.25;font-weight:700;color:var(--nuit)}
input:checked+.sf-tuile{background:var(--nuit);border-color:var(--nuit);color:#fff}
input:checked+.sf-tuile span{color:#fff}
input:checked+.sf-tuile::after{content:"\2713";position:absolute;top:10px;right:10px;width:22px;height:22px;border-radius:var(--r-l);background:#fff;color:var(--nuit);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.sf-accord{display:flex;gap:12px;align-items:flex-start;margin:24px 0 16px;cursor:pointer;min-height:44px;position:relative}
.sf-accord input{width:24px;height:24px;margin:0;flex:0 0 24px;accent-color:var(--vert)}
.sf-rgpd{font-size:13px;color:var(--gris);margin:16px 0 0;line-height:1.5}
.sf-piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sf-merci .sf-line svg{flex:0 0 24px;height:24px;color:var(--vert)}
.sf-demo{margin-top:16px;font-size:13px;padding:12px 16px;border:1px dashed var(--gris);border-radius:var(--r-s);color:var(--texte)}
@media (min-width:700px){
 .sf-tuiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;overflow:visible;margin:0;padding:2px 0 0}
 .sf-tuiles>label{flex:none}
}

/* Resultats */
.sf-solo{margin:0}
.sf-lead{font-size:20px;line-height:1.3;font-weight:700;letter-spacing:-.02em;color:var(--nuit);margin:0 0 16px}
.sf-solo .sf-s{margin:0}
@media (min-width:700px){.sf-lead{font-size:28px}}
@media (min-width:960px){.sf-lead{font-size:34px}}

/* Chatbot du heros. Large (colonne 2), texte 16 px, boutons de choix 15 px sur 44 px, Continuer 48 px */
@media (min-width:960px){
 .sf-chat{display:flex;flex-direction:column;position:relative;z-index:2;background:#fff;border-radius:var(--r-m);box-shadow:var(--ombre);overflow:hidden;font-size:16px;line-height:1.45;color:var(--encre)}
}
.sf-chat .tete{display:flex;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid var(--trait);font-size:17px;line-height:1.3}
.sf-chat .av{width:44px;height:44px;border-radius:14px;object-fit:cover}
.sf-chat-titre{color:var(--nuit);font-weight:700}
.sf-chat .tete .sf-s{font-size:14px}
.sf-chat .fil{padding:20px 24px 8px;max-height:380px;overflow-y:auto}
.sf-bul{max-width:90%;padding:12px 16px;border-radius:18px 18px 18px 4px;background:#f3f1ea;font-size:16px;line-height:1.45;margin:0 0 10px}
.sf-bul.moi{margin-left:auto;border-radius:18px 18px 4px 18px;background:var(--nuit);color:#fff}
.sf-bulles{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.sf-bulles label{position:relative}
.sf-bu{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--lin);border-radius:var(--r-l);background:#fff;font-weight:700;font-size:15px;color:var(--nuit);cursor:pointer;white-space:nowrap;transition:background-color .2s,color .2s,border-color .2s}
@media (hover:hover){.sf-bu:hover{border-color:var(--nuit)}}
input:checked+.sf-bu{background:var(--nuit);border-color:var(--nuit);color:#fff}
input:checked+.sf-bu::after{content:"\2713";margin-left:6px}
input:focus-visible+.sf-bu{outline:3px solid var(--vert);outline-offset:2px}
.sf-chat .pied{padding:12px 24px 24px}
.sf-chat .sf-field{min-height:48px;margin-bottom:10px;font-size:16px}
.sf-chat .sf-btn{width:100%;min-height:48px}
.sf-chat .sf-accord{margin:8px 0 12px;font-size:14px}
.sf-chat .sf-accord input{width:22px;height:22px;flex-basis:22px}
.sf-chat .sf-demo{font-size:14px;line-height:1.45}

/* Apparition au defilement. Le masquage n'existe que si le JS a pose .js sur html.
   Un bloc deja visible a l'ouverture porte .vu des le chargement, sans transition. */
.js .sf-monte:not(.vu){opacity:0;transform:translateY(20px)}
.js .sf-monte{transition:opacity .56s ease-out,transform .56s ease-out;transition-delay:var(--retard,0ms)}
.js .sf-monte.direct{transition:none}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{transition:none!important;animation:none!important}
 .js .sf-monte:not(.vu){opacity:1;transform:none}
 .sf-liste a:hover,.sf-liste a:hover img,.sf-une:hover img,.sf-gal figure:hover img{transform:none}
}

/* ACCUEIL, lisibilite (David, 15/10/2026 : beaucoup de clients ont plus de 60 ans).
   Texte courant 17 px (18 px des 960 px), interligne 1,6, rien d'utile sous 15 px, aucun texte en opacite sous .85,
   gris fonces (#55544f), cibles tactiles 48 px, graisse 400 au minimum. Portee : body.accueil seulement. */
body.accueil{font-size:17px;line-height:1.6}
body.accueil .sf-p,body.accueil .sf-faq details>div,body.accueil .sf-line .sf-b{line-height:1.6}
body.accueil .sf-s,body.accueil .sf-chiffres{color:#55544f}
body.accueil .sf-s{font-size:15px}
body.accueil .sf-eye,body.accueil .sf-tag,body.accueil .sf-cap{font-size:15px}
body.accueil .sf-heros-p{opacity:1}
body.accueil .sf-heros-p{font-size:17px}
body.accueil .sf-num{flex-basis:32px;height:32px;font-size:15px}
body.accueil .sf-coche{flex-basis:24px;height:24px}
body.accueil .sf-chiffres{font-size:15px}
body.accueil .sf-chiffres b{font-size:18px}
body.accueil .sf-btn,body.accueil .sf-actions a{font-size:16px;min-height:48px}
body.accueil .sf-faq summary{font-size:1em;min-height:56px}
body.accueil a[href^="tel:"]:not(.sf-tel){min-height:48px}
body.accueil .sf-chat{font-size:18px}
body.accueil .sf-chat .tete .sf-s,body.accueil .sf-chat .sf-demo,body.accueil .sf-chat .sf-accord{font-size:15px}
body.accueil .sf-bul{font-size:18px}
body.accueil .sf-bu{font-size:16px;min-height:48px}
body.accueil .sf-chat .sf-field{font-size:18px;min-height:52px}
body.accueil .sf-chat .sf-btn{min-height:52px;font-size:17px}
body.accueil .sf-chat .fil{max-height:480px}
@media (min-width:960px){
 body.accueil{font-size:18px}
 body.accueil .sf-heros-p{font-size:20px}
 body.accueil .sf-chiffres{font-size:16px}
}

/* Accueil, plus d'air (David, 15/10/2026) : ecart uniforme entre blocs 48 / 72 / 104 px au lieu de 32 / 56 / 72. */
body.accueil{--sec:48px}
@media (min-width:700px){body.accueil{--sec:72px}}
@media (min-width:960px){body.accueil{--sec:104px}}

/* =====================================================================================================
   ACCUEIL, 15/10/2026 : battre club-nutrition.fr. Titre concret, note 5,0, mur des bilans des membres.
   ===================================================================================================== */

/* Heros, telephone et tablette : la photo en haut, le texte en dessous, fonce sur blanc (plus lisible apres 60 ans
   qu'un texte blanc pose sur une photo). Le chatbot suit, comme sur ordinateur il est a cote. */
.sf-heros-eye{display:flex;align-items:center;gap:8px;font-size:15px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;margin:0 0 12px;color:var(--vert)}
.sf-heros-titre{font-size:30px;line-height:1.12;font-weight:700;letter-spacing:-.03em;margin:0 0 16px;color:var(--nuit);text-wrap:balance}
.sf-note{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;margin:0 0 16px;font-size:17px;line-height:1.3;color:var(--encre)}
.sf-note b{font-weight:800}
.sf-etoiles{display:inline-flex;gap:2px;color:#E8A317}
.sf-etoiles svg{width:22px;height:22px;flex:0 0 auto}
/* Mur des bilans : 4 colonnes alignees sur la grille (bords du contenu), 2 sur telephone. Coins 14, ecart 12 / 16. */
.sf-mur{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}
.sf-mur-col{display:flex;flex-direction:column;gap:12px}
.sf-mur-col>.sf-mur-it{flex:1 1 auto;min-height:0}
.sf-mur-it{display:block;border-radius:var(--r-s);overflow:hidden;background:var(--creme);box-shadow:0 12px 24px -20px var(--nuit);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.sf-mur-it img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
@media (max-width:699px){.sf-mur-accueil .sf-mur-it:nth-child(4){display:none}}
@media (min-width:700px){.sf-mur{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:40px}.sf-mur-col{gap:16px}}
@media (hover:hover){.sf-mur-it:hover{transform:translateY(-4px);box-shadow:0 22px 36px -22px var(--nuit)}.sf-mur-it:hover img{transform:scale(1.03)}}
.sf-mur-sec .sf-tete .sf-p{color:var(--encre)}
.sf-mur-pied{display:flex;justify-content:center;margin-top:32px}
@media (max-width:699px){.sf-mur-pied .sf-btn{width:100%}}

/* Visionneuse du mur : la photo en grand, Precedente, Suivante, Fermer. Boutons texte, 48 px. */
.sf-vis{border:0;padding:0;margin:0;width:100vw;height:100vh;max-width:none;max-height:none;background:#0b1a0ef2;color:#fff}
.sf-vis::backdrop{background:#0b1a0ef2}
.sf-vis[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:16px}
.sf-vis img{max-width:min(100%,720px);max-height:calc(100vh - 140px);width:auto;height:auto;border-radius:var(--r-s)}
.sf-vis-barre{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.sf-vis button{min-height:48px;padding:0 20px;border-radius:var(--r-l);border:1.5px solid #ffffffb3;background:none;color:#fff;font:700 16px Figtree,sans-serif;cursor:pointer}
.sf-vis button:hover{background:#ffffff26}
.sf-vis p{margin:0;font-size:16px;color:#ffffffe6;text-align:center;max-width:720px}

/* Etapes et FAQ de l'accueil : textes a 17 / 18 px, gris fonce lisible */
body.accueil .sf-etapes .sf-line .sf-p{color:var(--texte);margin-top:2px}
.sf-faq-tete .sf-p{margin:16px 0}
@media (min-width:700px){.sf-faq-tete{position:sticky;top:110px}}
/* Visages de membres a cote de la note : 5 ronds de 40 px qui se chevauchent, cercles blancs */
.sf-visages{display:inline-flex;margin-right:4px}
.sf-visages img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2.5px solid #fff;box-shadow:0 4px 10px -6px #0e251299}
.sf-visages img+img{margin-left:-12px}
.sf-note{row-gap:8px}
@media (max-width:389px){.sf-visages img{width:34px;height:34px}}


/* =====================================================================================================
   15/10/2026 soir, refonte « facon EE » (David : CTA trop fonce, pied catastrophique, heros pleine largeur colle
   sous la barre, sous-menus pour un site de pres de 200 pages). References : ee.metabacklinks.com, prosima.
   ===================================================================================================== */
:root{--vert-pale:#E6F0E1;--vert-clair:#cfe5c8;--accent:#d9f0b8;--haut:64px}
@media (min-width:1080px){:root{--haut:76px}}

/* Lisibilite sur TOUTES les pages (plus de 60 ans) : texte 17 / 18 px, rien sous 15 px */
body{font-size:17px}
@media (min-width:960px){body{font-size:18px}}
.sf-s,.sf-eye,.sf-tag,.sf-cap,.sf-label,.sf-err,.sf-rgpd,.sf-demo,.sf-avis,.sf-chip,.sf-tuile span,.sf-corps table{font-size:15px}
.sf-s{color:#55544f}

/* ---------- En-tete ---------- */
.sf-top{position:sticky;top:0;z-index:40;background:#fffffff5;backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.sf-top.ombre,.sf-top.mega-ouvert{border-bottom-color:var(--trait)}
.sf-top-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--haut)}
.sf-logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;color:var(--nuit);font-size:19px;letter-spacing:-.02em;text-decoration:none;min-height:48px;flex:0 0 auto}
.sf-logo img{width:44px;height:44px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px var(--trait)}
.sf-logo i{color:var(--vert);font-style:normal}
.sf-nav{display:none}
.sf-top-act{display:flex;align-items:center;gap:12px}
.sf-top-tel,.sf-top-btn{display:none!important}
.sf-burger{width:48px;height:48px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;background:none;border:0;cursor:pointer;padding:0;margin-right:-12px}
.sf-burger b{display:block;width:22px;height:2px;background:var(--nuit);border-radius:2px;transition:transform .2s,opacity .2s}
.sf-burger[aria-expanded=true] b:nth-child(1){transform:translateY(7px) rotate(45deg)}
.sf-burger[aria-expanded=true] b:nth-child(2){opacity:0}
.sf-burger[aria-expanded=true] b:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.sf-chev{width:12px;height:12px;flex:0 0 auto;transition:transform .2s var(--ease)}
.sf-fl{width:18px;height:18px;flex:0 0 auto;transition:transform .2s var(--ease)}
@media (min-width:960px){.sf-top-btn{display:inline-flex!important;min-height:48px;padding:0 22px;font-size:16px}}
@media (min-width:1200px){.sf-top-tel{display:inline-flex!important;align-items:center;min-height:48px;font-weight:700;font-size:17px;color:var(--nuit);text-decoration:none;padding:0 6px}.sf-top-tel:hover{color:var(--vert);text-decoration:underline}}

/* ---------- Tiroir telephone : plein ecran sous la barre, accordeons ---------- */
.sf-menu-mob{position:fixed;inset:var(--haut) 0 0;background:#fff;z-index:39;padding:8px var(--marge) 40px;overflow-y:auto;overscroll-behavior:contain;display:none}
.sf-menu-mob.ouvert{display:block}
.sf-t-l{list-style:none;margin:0;padding:0}
.sf-t-l>li{border-bottom:1px solid var(--lin)}
.sf-t-lien,.sf-t-tete{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:60px;padding:0;background:none;border:0;font:700 22px/1.2 Figtree,sans-serif;letter-spacing:-.02em;color:var(--nuit);text-decoration:none;cursor:pointer;text-align:left}
.sf-t-tete .sf-chev{width:16px;height:16px;color:var(--vert)}
.sf-t-tete[aria-expanded=true] .sf-chev{transform:rotate(180deg)}
.sf-t-lien[aria-current=page]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.sf-t-corps{padding:0 0 20px}
.sf-t-tous{display:inline-flex;align-items:center;gap:8px;min-height:48px;font-weight:700;font-size:17px;color:var(--vert);text-decoration:none;border-bottom:3px solid var(--accent);margin-bottom:8px}
.sf-t-cartes,.sf-t-arts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sf-t-cartes a{display:flex;align-items:center;gap:14px;min-height:72px;padding:8px;border-radius:var(--r-s);background:var(--creme);text-decoration:none;color:var(--texte);font-size:15px;line-height:1.35}
.sf-t-cartes img{width:64px;height:56px;object-fit:cover;border-radius:10px;flex:0 0 auto}
.sf-t-cartes b{display:block;font-size:17px;color:var(--nuit)}
.sf-t-cartes .sf-t-preuve{background:linear-gradient(135deg,var(--vert),#1f5a2b);color:#fff;gap:12px;padding:8px 16px}
.sf-t-preuve b{font-size:26px!important;color:#fff!important;letter-spacing:-.03em}
.sf-t-th{margin:16px 0 4px;font-size:15px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.sf-t-th a{color:var(--vert);text-decoration:none;display:inline-flex;min-height:48px;align-items:center}
.sf-t-arts{gap:0}
.sf-t-arts a{display:flex;align-items:center;min-height:48px;font-size:17px;font-weight:600;color:var(--nuit);text-decoration:none}
.sf-menu-mob>.sf-btn{margin-top:24px}
.sf-t-tel{text-align:center;margin:12px 0 0;color:var(--texte);font-size:16px}
.sf-t-tel a{font-weight:700}

/* ---------- Menu ordinateur et mega-menus ---------- */
@media (min-width:1080px){
 .sf-burger,.sf-menu-mob{display:none!important}
 .sf-nav{display:block;flex:1 1 auto}
 .sf-nav-l{list-style:none;margin:0;padding:0;display:flex;align-items:center;justify-content:center;gap:4px}
 .sf-m{display:flex;align-items:center;border-radius:var(--r-l);transition:background-color .2s}
 .sf-m.ouvert,.sf-m:hover{background:var(--creme)}
 .sf-m-lien{display:inline-flex;align-items:center;min-height:48px;padding:0 4px 0 16px;font-size:17px;font-weight:600;color:var(--nuit);text-decoration:none}
 .sf-m-lien[aria-current=page]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px;text-decoration-color:var(--vert)}
 .sf-m-chev{display:inline-flex;align-items:center;justify-content:center;width:20px;height:48px;padding:0 14px 0 2px;box-sizing:content-box;background:none;border:0;color:var(--nuit);cursor:pointer;border-radius:0 var(--r-l) var(--r-l) 0}
 .sf-m.ouvert .sf-chev{transform:rotate(180deg)}
 .sf-mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--trait);box-shadow:0 34px 60px -30px #0e251259;max-height:calc(100vh - var(--haut));overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
 .sf-m.ouvert>.sf-mega{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .2s ease,visibility 0s}
 html:not(.js) .sf-m:hover>.sf-mega,html:not(.js) .sf-m:focus-within>.sf-mega{opacity:1;visibility:visible;transform:none}
 .sf-mg-in{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,3fr);gap:24px;padding-top:32px;padding-bottom:36px}
 .sf-mg-conseils{grid-template-columns:minmax(0,3fr) minmax(0,9fr)}
}
.sf-mg-pastille{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:var(--r-l);background:var(--vert-pale);color:var(--nuit);font-weight:800;font-size:17px;margin:0}
.sf-mg-pastille::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--vert)}
.sf-mg-phrase{font-size:17px;line-height:1.55;color:var(--texte);margin:16px 0 18px}
.sf-mg-tous{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;font-size:17px;color:var(--nuit);text-decoration:none;border-bottom:3px solid var(--vert-clair)}
.sf-mg-tous:hover{border-bottom-color:var(--vert)}
.sf-mg-tous:hover .sf-fl,.sf-t-tous:hover .sf-fl{transform:translateX(3px)}
.sf-mg-cartes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.sf-mg-carte{display:flex;flex-direction:column;border-radius:var(--r-m);overflow:hidden;background:var(--creme);text-decoration:none;box-shadow:0 0 0 1px #0e25120d;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.sf-mg-carte img{width:100%;aspect-ratio:16/10;height:auto;object-fit:cover}
.sf-mg-carte b{font-size:18px;color:var(--nuit);padding:14px 18px 2px}
.sf-mg-carte span{font-size:16px;color:var(--texte);padding:0 18px 16px;line-height:1.4}
.sf-mg-preuve{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;border-radius:var(--r-m);overflow:hidden;color:#fff;text-decoration:none;min-height:240px}
.sf-mg-preuve img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.sf-mg-preuve::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#26643133 0%,#1f5a2bd9 45%,#163E35f7 100%)}
.sf-mg-preuve b{font-size:44px;line-height:1;letter-spacing:-.04em}
.sf-mg-preuve span{font-size:17px;line-height:1.35;margin-top:8px}
@media (hover:hover){.sf-mg-carte:hover,.sf-mg-preuve:hover{transform:translateY(-3px);box-shadow:0 22px 36px -24px #0e2512a6}.sf-mg-carte:hover b{text-decoration:underline;text-underline-offset:3px}}
.sf-mg-themes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.sf-mg-theme{border-left:1px solid var(--lin);padding-left:20px}
.sf-mg-th{display:inline-flex;align-items:center;min-height:40px;font-size:15px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--vert);text-decoration:none}
.sf-mg-th:hover{text-decoration:underline}
.sf-mg-theme ul{list-style:none;margin:4px 0 0;padding:0}
.sf-mg-theme a:not(.sf-mg-th){display:flex;align-items:center;min-height:44px;padding:6px 0;font-size:17px;font-weight:600;line-height:1.3;color:var(--nuit);text-decoration:none}
.sf-mg-theme a:not(.sf-mg-th):hover{color:var(--vert);text-decoration:underline;text-underline-offset:3px}

/* ---------- Heros de l'accueil : pleine largeur, colle sous la barre ---------- */
.sf-ouv{position:relative;overflow:hidden;overflow:clip;background:
  radial-gradient(closest-side at 50% 50%,#cfe5c8cc,#cfe5c800) 92% 10%/min(900px,120vw) min(900px,120vw) no-repeat,
  radial-gradient(closest-side at 50% 50%,#fff7e6,#fff7e600) -10% 110%/700px 700px no-repeat,
  linear-gradient(115deg,#FBFAF6 0%,#F6F5EE 40%,#EAF2E4 100%)}
.sf-ouv-in{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;padding-top:28px;padding-bottom:40px}
.sf-heros-txt{position:relative;z-index:1}
.sf-heros-p{font-size:18px;line-height:1.55;color:var(--texte);margin:0}
.sf-heros-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.sf-heros-actions .sf-btn{width:100%;min-height:52px;font-size:17px}
.sf-heros-actions .sf-pc{display:none}
.sf-chiffres{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);text-align:center;font-size:15px;line-height:1.3;color:#55544f;background:#ffffffb3;border:1px solid #0e25121a;border-radius:var(--r-m);padding:12px 0}
.sf-chiffres>div+div{border-left:1px solid #0e25121a}
.sf-chiffres b{display:block;font-size:17px;font-weight:800;color:var(--nuit);margin-bottom:2px}
.sf-ouv-photos{position:relative;height:300px;margin:0 4px}
.sf-hc{position:absolute;margin:0;border-radius:20px;overflow:hidden;background:#fff;border:6px solid #fff;box-shadow:0 24px 44px -24px #0e2512a6,0 0 0 1px #0e25120d}
.sf-hc img{width:100%;height:100%;object-fit:cover}
.sf-hc-a{left:0;top:24px;width:64%;aspect-ratio:4/3;transform:rotate(-4deg)}
.sf-hc-b{right:0;top:0;width:44%;aspect-ratio:5/6;transform:rotate(5deg);z-index:1}
.sf-hc-c{display:none}
.sf-pastille{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:var(--r-l);background:#fff;color:var(--nuit);font-weight:700;font-size:16px;white-space:nowrap;box-shadow:0 12px 26px -14px #0e2512a6}
.sf-pastille::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--vert);flex:0 0 auto}
.sf-pa-note::before{display:none}
.sf-etoile-1{display:inline-flex;color:#E8A317}
.sf-etoile-1 svg{width:20px;height:20px}
.sf-pa-note{left:4%;bottom:6px}
.sf-pa-dej{display:none}
.sf-pa-bilan{right:2%;bottom:40px;background:var(--nuit);color:#fff}
.sf-pa-bilan::before{background:var(--accent)}
.sf-chat{display:flex;flex-direction:column;position:relative;z-index:2;background:#fff;border-radius:var(--r-m);box-shadow:var(--ombre);overflow:hidden;font-size:18px;line-height:1.45;color:var(--encre)}
.sf-ouv-compo>.sf-chat{margin-top:28px}
@media (max-width:959px){
 .sf-chat .tete{padding:14px 18px}.sf-chat .fil{padding:16px 18px 4px}.sf-chat .pied{padding:10px 18px 20px}
 .sf-chat .sf-bulles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .sf-chat .sf-bulles label{display:flex}
 .sf-chat .sf-bu{width:100%;justify-content:center;text-align:center;padding:8px 10px;min-height:52px;line-height:1.25;white-space:normal}
}
@media (min-width:700px) and (max-width:959px){.sf-heros-titre{font-size:42px}.sf-ouv-photos{height:420px;max-width:620px;margin-inline:auto;width:100%}.sf-heros-actions .sf-btn{width:auto}}
@media (min-width:960px){
 .sf-ouv-in{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);align-items:center;padding-top:48px;padding-bottom:56px;min-height:min(780px,calc(100vh - var(--haut)))}
 .sf-heros-titre{font-size:52px;line-height:1.06;letter-spacing:-.04em}
 .sf-heros-p{font-size:20px}
 .sf-note{font-size:18px}
 .sf-heros-actions .sf-btn{width:auto}
 .sf-heros-actions .sf-pc{display:inline-flex}
 .sf-chiffres{max-width:560px}
 .sf-ouv-compo{position:relative;padding-top:132px;padding-bottom:28px}
 .sf-ouv-photos{position:absolute;inset:0;height:auto;margin:0}
 .sf-ouv-compo>.sf-chat{margin:0 0 0 40px}
 .sf-hc-a{left:-28px;top:0;width:300px;aspect-ratio:4/3;transform:rotate(-6deg)}
 .sf-hc-b{right:-36px;left:auto;top:-18px;width:250px;aspect-ratio:5/6;transform:rotate(6deg);z-index:0}
 .sf-hc-c{display:block;left:-56px;bottom:-6px;width:210px;aspect-ratio:1;transform:rotate(-4deg)}
 .sf-pa-note{left:auto;right:150px;top:4px;bottom:auto}
 .sf-pa-dej{display:inline-flex;left:-8px;top:64px}
 .sf-pa-bilan{right:auto;left:-20px;bottom:56px}
}
@media (min-width:960px) and (max-width:1199px){.sf-hc-b{right:-8px;width:210px}.sf-hc-c{left:-32px;width:170px}.sf-heros-titre{font-size:44px}.sf-pa-note{right:110px}}
@media (min-width:1400px){.sf-hc-b{right:-64px}}
@media (prefers-reduced-motion:no-preference){
 .js .sf-hc,.js .sf-pastille{animation:sf-pose .7s var(--ease) both}
 .js .sf-hc-b{animation-delay:.08s}.js .sf-hc-c{animation-delay:.16s}.js .sf-pastille{animation-delay:.3s}
}
@keyframes sf-pose{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}

/* ---------- Appel final : fond clair travaille, carte de reservation qui deborde ---------- */
.sf-cta{position:relative;margin-top:calc(var(--sec) + 40px);background:
  radial-gradient(closest-side at 50% 50%,#cfe5c8b3,#cfe5c800) 100% 0/800px 800px no-repeat,
  radial-gradient(closest-side at 50% 50%,#fff3dc,#fff3dc00) 0 100%/640px 640px no-repeat,
  linear-gradient(120deg,#F7F6EF 0%,#EEF4E8 60%,#E3EEDC 100%)}
.sf-cta-in{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-top:44px;padding-bottom:48px}
.sf-cta-titre{font-size:34px;line-height:1.05;letter-spacing:-.04em;font-weight:800;color:var(--nuit);margin:0 0 16px;text-wrap:balance}
.sf-cta-p{font-size:18px;line-height:1.55;color:var(--texte);margin:0}
.sf-cta-preuve{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;margin-top:24px;font-size:17px;color:var(--encre);line-height:1.35}
.sf-cta-preuve b{font-weight:800}
.sf-cta-visages{display:inline-flex;align-items:center}
.sf-cta-visages img,.sf-cta-plus{width:52px;height:52px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 6px 14px -8px #0e2512a6}
.sf-cta-visages>*+*{margin-left:-14px}
.sf-cta-plus{display:inline-flex;align-items:center;justify-content:center;background:var(--nuit);color:#fff;font-weight:800;font-size:15px}
.sf-cta-preuve .sf-etoiles svg{width:20px;height:20px}
.sf-cta-tel{display:inline-flex!important;flex-direction:column;align-items:flex-start!important;margin-top:24px;text-decoration:none;color:var(--nuit)}
.sf-cta-tel-l{font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--vert)}
.sf-cta-tel .nobr{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.15}
.sf-cta-tel:hover .nobr{text-decoration:underline;text-underline-offset:5px}
.sf-cta-carte-zone{position:relative;padding:24px 8px 8px}
.sf-cta-ph{position:absolute;width:150px;aspect-ratio:3/4;object-fit:cover;border-radius:18px;border:5px solid #fff;box-shadow:0 20px 36px -22px #0e2512a6}
.sf-cta-ph1{right:-6px;top:-18px;transform:rotate(7deg)}
.sf-cta-ph2{display:none}
.sf-cta-carte{position:relative;z-index:1;background:#fff;border-radius:28px;padding:28px 24px;box-shadow:0 34px 70px -34px #0e2512b3,0 0 0 1px #0e25120f;max-width:560px}
.sf-cta-carte-t{font-size:24px;font-weight:800;letter-spacing:-.03em;color:var(--nuit);margin:0 0 12px}
.sf-cta-coches{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:12px}
.sf-cta-coches li{display:flex;gap:12px;align-items:flex-start;font-size:17px;line-height:1.4;color:var(--encre)}
.sf-cta-coches .sf-coche{flex:0 0 24px;height:24px;color:var(--vert);margin-top:0}
.sf-cta-carte .sf-btn{min-height:56px;font-size:17px}
.sf-cta-conseil{margin:14px 0 0;font-size:15px;color:#55544f;text-align:center}
@media (min-width:700px){.sf-cta-titre{font-size:44px}.sf-cta-ph{width:190px}}
@media (min-width:960px){
 .sf-cta{margin-top:calc(var(--sec) + 72px)}
 .sf-cta-in{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);align-items:center;padding-top:72px;padding-bottom:80px}
 .sf-cta-titre{font-size:56px}
 .sf-cta-p{font-size:20px;max-width:520px}
 .sf-cta-carte-zone{padding:0 0 0 40px;margin-top:-152px;align-self:start}
 .sf-cta-carte{padding:36px 40px}
 .sf-cta-ph{width:200px}
 .sf-cta-ph1{right:-40px;top:-36px}
 .sf-cta-ph2{display:block;left:-12px;bottom:-56px;transform:rotate(-6deg)}
}
@media (min-width:960px) and (max-width:1199px){.sf-cta-ph1{right:-12px}}

/* ---------- Pied de page : degrade vert, colonnes titrees, derniers articles, filigrane geant ---------- */
.sf-pied{position:relative;overflow:hidden;color:#fff;font-size:17px;line-height:1.5;padding:0 0 calc(100px + env(safe-area-inset-bottom));background:
  radial-gradient(closest-side at 50% 50%,#4a9a57aa,#4a9a5700) 100% 0/1100px 1100px no-repeat,
  radial-gradient(closest-side at 50% 50%,#9fcf8f40,#9fcf8f00) 0 100%/900px 900px no-repeat,
  linear-gradient(160deg,#2f7a3c 0%,#266431 50%,#205a2c 100%)}
.sf-pied::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--accent) 0 25%,#9fcf8f 25% 50%,#E8A317 50% 75%,var(--creme) 75%)}
.sf-pied a{color:#fff}
.sf-pied-haut{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:16px 20px;padding:48px 0 32px;border-bottom:1px solid #ffffff2e}
.sf-pied-logo{display:flex;width:76px;height:76px;border-radius:50%;background:#fff;align-items:center;justify-content:center;box-shadow:0 10px 24px -12px #0006}
.sf-pied-logo img{width:62px;height:62px;border-radius:50%}
.sf-pied-accroche{margin:0;font-size:22px;line-height:1.25;font-weight:700;letter-spacing:-.02em;max-width:520px}
.sf-ronds{grid-column:1/-1;display:flex;gap:10px}
.sf-ronds a{width:48px;height:48px;border-radius:50%;border:1.5px solid #ffffff66;display:flex;align-items:center;justify-content:center;transition:background-color .2s,border-color .2s}
.sf-ronds a:hover{background:#ffffff26;border-color:#fff}
.sf-pied-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;padding:40px 0 32px}
.sf-pied-nous,.sf-pied-arts{grid-column:1/-1}
.sf-pied-titre{margin:0 0 10px;font-size:17px;font-weight:800;color:var(--accent);letter-spacing:-.01em}
.sf-pied ul{list-style:none;margin:0;padding:0}
.sf-pied-cols li a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:#fffffff2}
.sf-pied-cols li a:hover{text-decoration:underline;text-underline-offset:3px}
.sf-pied address{color:#fffffff2;margin:0 0 8px}
.sf-pied-tel{display:inline-flex!important;font-size:26px;font-weight:800;letter-spacing:-.02em;text-decoration:none;min-height:48px;align-items:center}
.sf-pied-it{display:inline-flex;align-items:center;min-height:48px;font-weight:700;text-decoration:none;border-bottom:3px solid var(--accent);margin-top:4px}
.sf-pied-arts ul{display:grid;gap:12px}
.sf-pied-arts li a{display:flex!important;gap:14px;align-items:center;min-height:72px!important}
.sf-pied-arts img{width:96px;height:68px;border-radius:12px;object-fit:cover;flex:0 0 auto;box-shadow:0 8px 18px -10px #0008}
.sf-pied-arts em{display:block;font-style:normal;font-size:15px;font-weight:700;color:var(--accent)}
.sf-pied-arts span{line-height:1.3;font-weight:600}
.sf-pied-bas{display:flex;flex-wrap:wrap;align-items:center;gap:4px 24px;border-top:1px solid #ffffff2e;padding-top:16px;font-size:15px;color:#ffffffe0}
.sf-pied-bas a{display:inline-flex;align-items:center;min-height:48px;color:#ffffffe0;text-decoration:none}
.sf-pied-bas a:hover{text-decoration:underline}
.sf-pied-dossier{opacity:.8}
.sf-pied-mot{margin:24px 0 -0.1em;font-size:min(20vw,250px);font-weight:800;letter-spacing:-.06em;line-height:.85;white-space:nowrap;text-align:center;background:linear-gradient(90deg,#ffffff2e,#d9f0b8a6 50%,#ffffff24);-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none;pointer-events:none}
@media (min-width:700px){
 .sf-pied-cols{grid-template-columns:repeat(3,minmax(0,1fr))}
 .sf-pied-haut{grid-template-columns:auto minmax(0,1fr) auto}
 .sf-ronds{grid-column:auto}
}
@media (min-width:960px){
 .sf-pied{padding-bottom:0}
 .sf-pied-haut{padding:64px 0 40px}
 .sf-pied-accroche{font-size:28px}
 .sf-pied-cols{grid-template-columns:minmax(0,1.15fr) repeat(3,minmax(0,.85fr)) minmax(0,1.5fr);gap:32px;padding:48px 0 40px}
 .sf-pied-nous,.sf-pied-arts{grid-column:auto}
}
@media (min-width:960px){.sf-bar,.sf-pad{display:none!important}}

/* Carte du bilan : une photo du club en tete de carte (15/10/2026) */
.sf-cta-carte-img{max-width:none;width:calc(100% + 16px);margin:-16px -8px 20px;aspect-ratio:16/8;height:auto;object-fit:cover;border-radius:20px}
@media (min-width:960px){.sf-cta-carte-img{width:calc(100% + 48px);margin:-24px -24px 24px}.sf-cta-carte-zone{margin-top:-120px}.sf-cta-ph1{top:-44px}}
.sf-pied-tel,.sf-pied-it{display:flex!important;width:max-content}
.sf-pied-mot{font-size:min(calc((100vw - 40px)/5.2),250px)}
@media (min-width:960px){.sf-pa-bilan{bottom:-2px;left:-36px}}

/* Dégradés dans les blocs (demande David 15/10/2026, « tu n'exploites pas de dégradé dans les blocs »).
   Teintes très claires pour garder le contraste du texte foncé. Retour arrière : supprimer ce bloc. */
:root{--halo-menthe:#cbe4cc;--halo-abricot:#f8dbb6;--halo-sauge:#dbe9d6}
.sf-cream{background:
  radial-gradient(60% 80% at 100% 0%,var(--halo-menthe) 0%,transparent 70%),
  radial-gradient(55% 70% at 0% 100%,var(--halo-abricot) 0%,transparent 72%),
  linear-gradient(160deg,#fbfaf6 0%,#f4f2ea 100%)}
.sf-chiffres{background:linear-gradient(120deg,#ffffff 0%,#f3f8f1 55%,#fdf5ea 100%)}
.sf-mur-sec{position:relative;isolation:isolate}
.sf-mur-sec::before{content:"";position:absolute;z-index:-1;inset:-40px calc(50% - 50vw);background:
  radial-gradient(40% 50% at 15% 10%,var(--halo-sauge) 0%,transparent 70%),
  radial-gradient(35% 45% at 90% 60%,var(--halo-abricot) 0%,transparent 70%);opacity:.9;pointer-events:none}
.sf-mg-carte{background:linear-gradient(180deg,#fbfaf6 0%,#eef5ec 100%)}
.sf-cta-carte{background:linear-gradient(170deg,#ffffff 0%,#ffffff 55%,#f1f7ef 100%)}
.sf-faq .sf-q,.sf-faq details{transition:background .3s}
.sf-faq details[open]{background:linear-gradient(90deg,#f1f7ef 0%,transparent 90%);border-radius:var(--r-s)}
.sf-heros-titre .nobr{background:linear-gradient(100deg,var(--vert) 0%,#2f8a4a 45%,var(--sapin,#163E35) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (forced-colors:active){.sf-heros-titre .nobr{color:CanvasText;background:none}}

/* Aucune pastille ne doit recouvrir le chatbot (demande David 15/10/2026).
   La pastille Bilan offert mordait sur lui dès 1024 px, et elle redit son titre : retirée sur grand écran. */
@media (min-width:900px){.sf-pa-bilan{display:none}}