/* MT Players : feuille commune (accueil, joueurs, contact, pages légales). Refonte v4 du 25.10.2026. */
@font-face{font-family:"Big Shoulders";src:url(../fonts/bigshoulders-var.woff2) format("woff2");font-weight:500 900;font-display:swap}
@font-face{font-family:"General Sans";src:url(../fonts/generalsans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"General Sans";src:url(../fonts/generalsans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"General Sans";src:url(../fonts/generalsans-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Signature";src:url(../fonts/saintdelafield.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Barlow Semi Condensed";src:url(../fonts/barlowsemicondensed-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  /* noir teinté vert (fond du logo) et blanc « feuille de contrat », à parts égales */
  --noir:#0B0D0C; --noir-2:#131614; --noir-3:#1B1F1C; --filet-s:#272C28;
  --blanc:#F4F4F1; --blanc-2:#E6E7E2; --filet-c:#D6D8D1;
  --gris-c:#5A605A; --gris-s:#8F958F;
  /* le vert du ballon, en touches ; sa version encre pour écrire sur le papier clair */
  --vert:#52C745; --vert-encre:#2E8A24; --vert-d:rgba(82,199,69,.18);
  --courbe:cubic-bezier(.16,1,.3,1);
  --bord:clamp(16px,3.2vw,48px);
  --tete:clamp(52px,7vw,100px);
  --pied-section:clamp(64px,9vw,136px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--noir);-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{background:var(--noir);color:var(--noir);font-family:"General Sans",system-ui,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:clip}
main{background:var(--blanc)}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
html[lang=fr] .en,html[lang=en] .fr{display:none!important}
::selection{background:var(--vert);color:var(--noir)}
:focus-visible{outline:2px solid var(--vert);outline-offset:3px}
[data-fond=clair]{background:var(--blanc);color:var(--noir)}
[data-fond=sombre]{background:var(--noir);color:var(--blanc)}

/* ---------- typographie ---------- */
.titre{font-family:"Big Shoulders";font-weight:900;line-height:.86;letter-spacing:-.005em}
.t-xl{font-size:clamp(56px,8vw,140px)}
.t-l{font-size:clamp(44px,5.4vw,92px)}
.l{display:block;overflow:hidden;padding:.12em 0 .09em;margin:-.12em 0 -.09em}
.l>span{display:inline-block}
.etiquette{display:block;font-size:14px;font-weight:500;color:var(--gris-c)}
[data-fond=sombre] .etiquette{color:var(--gris-s)}
.lien{background:linear-gradient(var(--vert),var(--vert)) 0 100%/100% 2px no-repeat;padding-bottom:3px;transition:background-size .5s var(--courbe)}
@media (hover:hover) and (pointer:fine){.lien:hover{background-size:0 2px;background-position:100% 100%}}
.fleche{display:flex;align-items:center;gap:10px;font-weight:600}
.fleche i{font-style:normal;color:var(--vert);transition:transform .5s var(--courbe)}
@media (hover:hover) and (pointer:fine){.fleche:hover i{transform:translateX(5px)}}

/* ---------- états de départ : posés seulement si le script a ajouté .js-anime ---------- */
html.js-anime [data-lignes] .l>span{transform:translate3d(0,112%,0)}
html.js-anime [data-monte]{opacity:0;transform:translate3d(0,28px,0)}
html.js-anime [data-image]{clip-path:inset(100% 0 0 0)}
html.js-anime [data-image] .zoom{transform:scale(1.22)}
html.js-anime .registre .signe{clip-path:inset(-40% 100% -40% 0)}
html.js-anime .hero-bas .l>span{transform:translate3d(0,112%,0)}
html.js-anime .hero-cote{opacity:0}

/* ---------- menu ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:18px var(--bord);color:var(--blanc);background-color:rgba(11,13,12,.002);transition:background-color .35s}
html.nav-pleine .nav,html.menu-ouvert .nav{background-color:var(--noir)}
.marque{display:flex;align-items:center;gap:11px;font-family:"Big Shoulders";font-weight:800;font-size:23px;line-height:1;letter-spacing:.005em}
.marque img{width:auto;height:40px}
.nav ul{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px);font-size:15px;font-weight:500}
.nav ul a{position:relative;padding:4px 0}
.nav ul a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;background:var(--vert);transition:right .45s var(--courbe)}
.nav ul a[aria-current=page]::after{right:0}
@media (hover:hover) and (pointer:fine){.nav ul a:hover::after{right:0}}
.langues{display:flex;gap:2px;font-size:14px}
.langues button{padding:4px 6px;opacity:.5;transition:opacity .3s}
.langues button[aria-pressed=true]{opacity:1}
.ouvrir-menu{display:none;width:44px;height:44px;align-items:center;justify-content:flex-end;margin-right:-6px}
.ouvrir-menu i{position:relative;display:block;width:24px;height:2px;background:currentColor;margin-right:6px;transition:background-color .2s}
.ouvrir-menu i::before,.ouvrir-menu i::after{content:"";position:absolute;left:0;width:24px;height:2px;background:currentColor;transition:transform .4s var(--courbe)}
.ouvrir-menu i::before{top:-7px}.ouvrir-menu i::after{top:7px}
@media (max-width:820px){
  .nav ul{display:none}
  .ouvrir-menu{display:inline-flex}
  .nav{padding-top:14px;padding-bottom:14px}
  .marque{font-size:21px}
  .marque img{height:36px}
}
html.menu-ouvert,html.menu-ouvert body{overflow:hidden}
html.menu-ouvert .ouvrir-menu i{background-color:transparent}
html.menu-ouvert .ouvrir-menu i::before{transform:translateY(7px) rotate(45deg)}
html.menu-ouvert .ouvrir-menu i::after{transform:translateY(-7px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:39;background:var(--noir);color:var(--blanc);display:flex;flex-direction:column;justify-content:space-between;
  padding:110px var(--bord) calc(28px + env(safe-area-inset-bottom));visibility:hidden;opacity:0;transition:opacity .45s var(--courbe),visibility 0s .45s;overflow-y:auto;overscroll-behavior:contain}
html.menu-ouvert .menu{visibility:visible;opacity:1;transition:opacity .45s var(--courbe)}
.menu-embleme{position:absolute;right:-12vw;top:9vh;width:78vw;max-width:420px;mix-blend-mode:screen;opacity:.22;pointer-events:none}
.menu nav{position:relative;display:grid;border-top:1px solid var(--filet-s);margin-top:auto}
.menu nav a{display:flex;align-items:center;justify-content:space-between;padding:14px 0 10px;border-bottom:1px solid var(--filet-s);
  font-family:"Big Shoulders";font-weight:900;font-size:clamp(52px,14vw,80px);line-height:.95;
  opacity:0;transform:translate3d(0,40px,0);transition:opacity .5s var(--courbe),transform .7s var(--courbe),color .3s}
.menu nav a i{font-style:normal;font-family:"General Sans";font-weight:400;font-size:28px;color:var(--vert);opacity:0;transition:opacity .3s}
.menu nav a[aria-current=page]{color:var(--vert)}
.menu nav a[aria-current=page] i,.menu nav a:active i{opacity:1}
html.menu-ouvert .menu nav a{opacity:1;transform:none}
html.menu-ouvert .menu nav a:nth-child(2){transition-delay:.06s}
html.menu-ouvert .menu nav a:nth-child(3){transition-delay:.12s}
.menu .bas{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:22px;margin-top:32px;opacity:0;transition:opacity .6s .2s}
html.menu-ouvert .menu .bas{opacity:1}
.menu .bas .duo{width:100%}
.menu .bas .duo a{color:var(--noir)}
.menu .langues{align-self:center;font-size:15px;font-weight:600}

/* ---------- rideau de transition entre pages ---------- */
#rideau{position:fixed;inset:0;z-index:100;background:var(--noir);display:grid;place-items:center;transform:translate3d(0,100%,0);pointer-events:none;visibility:hidden;will-change:transform;isolation:isolate;backface-visibility:hidden}
#rideau img{width:clamp(120px,15vw,190px);mix-blend-mode:screen}
/* départ : le rideau monte et couvre la page ; arrivée : il continue sa course et libère la nouvelle */
html.rideau-depart #rideau{visibility:visible;animation:rideau-entre .62s cubic-bezier(.65,0,.35,1) both}
html.rideau-depart #rideau img{animation:rideau-logo .5s .2s ease-out both}
html.rideau-arrivee #rideau{visibility:visible;transform:none;animation:rideau-sort .8s cubic-bezier(.65,0,.35,1) .08s both}
html.rideau-arrivee #rideau img{animation:rideau-logo-sort .45s ease-in both}
@keyframes rideau-entre{from{transform:translate3d(0,100%,0)}to{transform:translate3d(0,0,0)}}
@keyframes rideau-sort{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-100%,0)}}
@keyframes rideau-logo{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:none}}
@keyframes rideau-logo-sort{from{opacity:1}to{opacity:0}}

/* ---------- boutons ---------- */
/* barre partagée : deux moitiés séparées par 3 px, comme les colonnes vidéo du hero */
.duo{display:flex;align-items:stretch;gap:3px;width:420px;max-width:100%;height:58px;border-radius:999px;overflow:hidden;
  font-family:"Big Shoulders";font-weight:800;font-size:22px;line-height:1;letter-spacing:.01em}
.duo a{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--noir);transition:background-color .4s var(--courbe),transform .2s}
.duo a:first-child{background:var(--blanc);padding-left:6px}
.duo a:last-child{background:var(--vert);padding-right:6px}
.duo i{font-style:normal;transition:transform .5s var(--courbe)}
.duo a:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .duo a:first-child:hover{background:#fff}
  .duo a:last-child:hover{background:#63D656}
  .duo a:last-child:hover i{transform:translateX(5px)}
}
.envoyer{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:60px;border-radius:999px;background:var(--vert);color:var(--noir);
  font-family:"Big Shoulders";font-weight:800;font-size:23px;transition:background-color .4s var(--courbe),transform .2s}
.envoyer i{font-style:normal;transition:transform .5s var(--courbe)}
.envoyer:active{transform:scale(.98)}
.envoyer:disabled{opacity:.6}
@media (hover:hover) and (pointer:fine){.envoyer:hover{background:#63D656}.envoyer:hover i{transform:translateX(5px)}}

/* ---------- hero : une rangée de leur Instagram, vidéo | logo | vidéo ---------- */
.hero{position:relative;height:100svh;min-height:600px;background:#050605;color:var(--blanc);overflow:hidden}
.colonnes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;background:#050605}
.colonne{position:relative;overflow:hidden}
.colonne video,.colonne img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.colonne.logo{background:#050605}
.hero .mobile{display:none}
.hero-voile{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(5,6,5,.5),rgba(5,6,5,0) 16%)}
.intro{position:absolute;inset:0;background:#050605;opacity:0;pointer-events:none}
html.intro-on .intro{opacity:1}
html.intro-on .embleme img{opacity:0}
.hero-bas{position:absolute;z-index:3;left:33.4%;right:33.4%;top:70px;bottom:0;padding:0 24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;text-align:center;mix-blend-mode:screen}
.embleme{position:relative;width:clamp(150px,min(15vw,28vh),280px);margin-bottom:-6px;pointer-events:none}
.embleme img{width:100%}
.hero h1 .nom{display:block;font-family:"Big Shoulders";font-weight:900;font-size:clamp(54px,5.4vw,92px);line-height:.86;color:var(--blanc)}
.hero h1 .ligne{display:block;margin:14px auto 0;max-width:30ch;font-size:clamp(15px,1.15vw,18px);font-weight:500;line-height:1.45;color:var(--blanc-2)}
.hero-cote{width:100%;display:flex;justify-content:center}
.hero .duo{width:100%;max-width:400px}
@media (max-width:760px){
  .hero{min-height:0}
  .colonnes{grid-template-columns:1fr}
  .colonne:not(:first-child){display:none}
  .hero .ordi{display:none}
  .hero .mobile{display:block}
  .hero-voile{background:linear-gradient(to bottom,rgba(11,13,12,.55),transparent 22%,transparent 46%,rgba(11,13,12,.94))}
  .embleme{display:none}
  .hero-bas{left:var(--bord);right:var(--bord);top:auto;bottom:calc(24px + env(safe-area-inset-bottom));padding:0;align-items:flex-start;text-align:left;gap:20px;mix-blend-mode:normal}
  .hero h1 .nom{font-size:clamp(56px,16vw,78px)}
  .hero h1 .ligne{margin:12px 0 0;max-width:32ch;font-size:15px}
  .hero .duo{max-width:none}
}

/* ---------- l'agence (accueil, clair) : la phrase, les trois métiers, les deux visages ---------- */
.agence{padding:var(--tete) var(--bord) var(--pied-section);overflow:hidden}
.agence>.titre{margin-bottom:clamp(20px,3vw,40px)}
/* la phrase de l'agence : condensée comme une signalétique de stade, en écho aux titres (choix de Benjamin, 25.10) */
.remplir{max-width:32ch;font-family:"Barlow Semi Condensed","General Sans",sans-serif;font-size:clamp(26px,3.05vw,46px);font-weight:500;line-height:1.1;letter-spacing:-.005em}
.remplir .mot{opacity:.16}
html:not(.js-anime) .remplir .mot{opacity:1}
.agence-detail{max-width:52ch;margin-top:clamp(20px,2.2vw,30px);font-size:clamp(17px,1.35vw,20px);line-height:1.5;color:var(--gris-c)}
@media (min-width:1000px){
  .agence-texte{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(40px,6vw,120px);align-items:end}
  .agence-detail{margin-top:0;padding-bottom:.35em}
}
.equipe{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,96px);align-items:end;margin-top:clamp(64px,7vw,112px)}
.equipe figure{margin-left:calc(-1 * var(--bord))}
.equipe .cadre img{aspect-ratio:4/5;object-fit:cover}
.personne .etiquette{margin-bottom:14px}
.fondateur .titre{font-size:clamp(56px,7.4vw,128px)}
.fondateur p{margin-top:22px;font-size:clamp(17px,1.45vw,21px);max-width:36ch}
.avocat{margin-top:clamp(40px,5.5vw,72px);padding-top:22px;border-top:1px solid var(--noir)}
.avocat .etiquette{margin-bottom:8px}
.avocat h3{font-family:"Big Shoulders";font-weight:800;font-size:clamp(32px,2.8vw,46px);line-height:.95}
.avocat p{margin-top:12px;font-size:16px;color:var(--gris-c);max-width:52ch}
.avocat .fleche{margin-top:18px;display:inline-flex}
@media (max-width:860px){
    .equipe{grid-template-columns:1fr;gap:28px}
  .equipe figure{margin:0 calc(-1 * var(--bord))}
  .equipe .cadre img{aspect-ratio:1;object-position:50% 25%}
}

/* ---------- les joueurs (accueil, sombre) : l'effectif dans l'ordre d'une feuille de match ---------- */
.joueurs{position:relative;padding:var(--tete) var(--bord) var(--pied-section);overflow:hidden}
.entete{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(28px,4vw,56px)}
.entete .note{font-size:15px;font-weight:600;padding-bottom:.6em}
.grille{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(30px,3.2vw,48px) clamp(10px,1.2vw,18px)}
.carte{display:block}
.cadre{position:relative;overflow:hidden;background:var(--blanc-2)}
.cadre img{width:100%;aspect-ratio:4/5;object-fit:cover}
.carte .cadre{background:var(--noir-2)}
.carte .cadre::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--vert);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--courbe)}
.carte .zoom{transition:transform 1.2s var(--courbe)}
.carte-nom{display:block;margin-top:14px;font-family:"Big Shoulders";font-weight:800;font-size:clamp(25px,2vw,31px);line-height:.95}
.carte-meta{display:flex;justify-content:space-between;gap:10px;margin-top:9px;font-size:14px;font-weight:500;color:var(--blanc-2)}
.carte-meta [data-ne]{color:var(--gris-s);font-weight:400;white-space:nowrap}
.carte-club{display:block;margin-top:2px;font-size:14px;color:var(--gris-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover) and (pointer:fine){
  .carte:hover .zoom{transform:scale(1.045)}
  .carte:hover .cadre::after{transform:scaleX(1)}
}
@media (max-width:1100px){.grille{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.entete{flex-direction:column;align-items:flex-start;gap:14px}.entete .note{padding:0}.carte-nom{font-size:24px}.carte-meta,.carte-club{font-size:13px}}

/* ---------- signatures (accueil, clair) : la photo du jour reste, les noms défilent et s'écrivent ---------- */
.signatures{position:relative;padding:var(--tete) var(--bord) var(--pied-section)}
.sig{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,96px);align-items:start}
.sig-cote{position:sticky;top:96px}
.sig-cote .titre{margin-bottom:clamp(22px,2.6vw,36px)}
.sig-photo{position:relative;width:min(100%,calc((100svh - 330px) * .8));aspect-ratio:4/5;overflow:hidden;background:var(--blanc-2)}
.sig-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(100% 0 0 0);transform:scale(1.1);
  transition:clip-path 1.05s var(--courbe),transform 1.6s var(--courbe)}
.sig-photo img.vu{clip-path:inset(0 0 0 0);transform:none}
.sig-photo img.sans-transition{transition:none}
.sig-legende{display:flex;justify-content:space-between;align-items:baseline;gap:14px;width:min(100%,calc((100svh - 330px) * .8));margin-top:12px;font-size:14px;color:var(--gris-c)}
.sig-legende b{font-family:"Big Shoulders";font-weight:800;font-size:21px;line-height:1;color:var(--noir)}
.registre{border-top:1px solid var(--noir)}
.registre li{position:relative;display:grid;grid-template-columns:104px minmax(0,1.15fr) minmax(0,1fr);gap:18px 22px;align-items:center;padding:clamp(28px,3.2vw,46px) 0;border-bottom:1px solid var(--filet-c);transition:opacity .6s var(--courbe)}
.registre li::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;background:var(--vert-encre);transition:width .9s var(--courbe)}
.registre li.actif::before{width:100%}
html.js-sig .registre li:not(.actif){opacity:.34}
.registre time{font-family:"Big Shoulders";font-weight:700;font-size:21px;color:var(--gris-c)}
.registre .qui{font-family:"Big Shoulders";font-weight:900;font-size:clamp(34px,3.3vw,56px);line-height:.9}
.registre .signe{display:block;width:max-content;margin:.06em 0 -.2em .45em;font-family:"Signature";font-weight:400;font-size:.8em;line-height:1;color:var(--vert-encre);
  white-space:nowrap;transform:rotate(-4deg);transform-origin:left center;pointer-events:none}
.registre .trajet{font-size:16px;font-weight:500}
.registre .trajet s{color:var(--gris-c);text-decoration-thickness:1px}
.registre .trajet i{font-style:normal;color:var(--vert-encre);margin:0 8px}
.registre .note{display:block;margin-top:6px;font-size:14px;font-weight:400;color:var(--gris-c)}
.registre .vignette{display:none}
@media (max-width:900px){
  .sig{grid-template-columns:1fr;gap:0}
  .sig-cote{position:static}
  .sig-photo,.sig-legende{display:none}
  .registre li{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"v d" "v q" "v t";gap:4px 16px;align-items:start;padding:22px 0}
  .registre .vignette{display:block;grid-area:v;width:96px;aspect-ratio:4/5;object-fit:cover}
  .registre time{grid-area:d;font-size:17px}
  .registre .qui{grid-area:q;font-size:clamp(30px,8.6vw,40px)}
  .registre .trajet{grid-area:t;margin-top:10px;font-size:15px}
  .registre .note{font-size:13px}
}

/* ---------- famille : une photo qui respire, le logo, la signature ---------- */
.famille{position:relative;height:100svh;min-height:560px;overflow:hidden;background:var(--noir);color:var(--blanc);display:grid;place-items:center;text-align:center}
.famille-fond{position:absolute;inset:0}
.famille-fond picture{display:block;height:100%}
.famille-fond img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;animation:respire 18s ease-in-out infinite alternate}
@keyframes respire{from{transform:scale(1.02)}to{transform:scale(1.14)}}
.famille-fond::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(11,13,12,.5),rgba(11,13,12,.86))}
.famille-texte{position:relative;z-index:2;display:grid;justify-items:center;padding:0 var(--bord)}
.famille-logo{width:clamp(64px,6vw,90px);height:auto;margin-bottom:14px}
.famille h2{display:grid;justify-items:center}
.famille .petit{font-family:"Big Shoulders";font-weight:800;font-size:clamp(28px,3vw,44px);line-height:1}
.famille .sig-nom{display:block;font-family:"Signature";font-weight:400;font-size:clamp(80px,10.5vw,165px);line-height:1.2;color:var(--vert);padding:0 .25em;margin:.08em 0 -.02em}
html.js-anime .famille .sig-nom{clip-path:inset(-30% 100% -30% 0)}
html.js-anime .famille.signe .sig-nom{clip-path:inset(-30% -10% -30% 0);transition:clip-path 2.2s cubic-bezier(.6,0,.3,1) .4s}
.famille-texte .envoyer{width:auto;display:inline-flex;padding:0 30px;margin-top:clamp(24px,4vh,40px)}
.famille-legende{position:absolute;z-index:2;left:var(--bord);bottom:calc(20px + env(safe-area-inset-bottom));font-size:13px;color:var(--blanc-2);text-align:left}
.famille-legende b{font-family:"Big Shoulders";font-weight:800;font-size:16px;color:var(--blanc);margin-right:6px}
@media (max-width:760px){.famille{height:92svh;align-items:end}.famille-texte{padding-bottom:64px}}

/* ---------- pied de page (toutes les pages) ---------- */
.pied{position:relative;background:var(--noir);color:var(--blanc);padding:var(--tete) var(--bord) calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--filet-s)}
.pied-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;font-size:15px}
.pied-cols h3{font-size:13px;font-weight:500;color:var(--gris-s);margin-bottom:10px}
.pied-cols a,.pied-cols p{display:block;line-height:1.75;overflow-wrap:anywhere}
.pied-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 28px;margin-top:clamp(36px,5vw,64px);padding-top:18px;border-top:1px solid var(--filet-s);font-size:13px;color:var(--gris-s)}
.pied-legal a{color:var(--blanc)}
@media (max-width:760px){.pied-cols{grid-template-columns:1fr;gap:24px}}

/* ---------- page joueurs : l'arrivée en bandes, puis une fiche par joueur ---------- */
.jp-tete{position:relative;padding:calc(70px + var(--tete)) var(--bord) clamp(52px,8vw,110px);overflow:hidden}
.jp-tete .intro-txt{margin-top:22px;font-size:clamp(17px,1.45vw,21px);max-width:44ch;color:var(--blanc-2)}
.jp-bandes{position:relative;display:flex;gap:4px;height:clamp(420px,64vh,680px);margin:clamp(36px,5vw,64px) calc(-1 * var(--bord)) 0}
.bande{position:relative;flex:1 1 0;min-width:0;overflow:hidden;background:var(--noir-2);transition:flex-grow .8s var(--courbe)}
.bande img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.35) brightness(.78);transition:filter .6s,transform 1.2s var(--courbe)}
.bande>span{position:absolute;left:0;right:0;bottom:0;padding:60px 14px 18px;background:linear-gradient(transparent,rgba(5,6,5,.85))}
.bande b{display:block;font-family:"Big Shoulders";font-weight:800;font-size:clamp(19px,1.55vw,27px);line-height:.95}
.bande small{display:block;margin-top:6px;font-size:13px;color:var(--blanc-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover) and (pointer:fine){
  .jp-bandes:hover .bande:hover{flex-grow:2.6}
  .bande:hover img{filter:none;transform:scale(1.04)}
}
@media (max-width:760px){
  .jp-bandes{height:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--bord);scroll-padding:0 var(--bord);gap:10px;scrollbar-width:none}
  .jp-bandes::-webkit-scrollbar{display:none}
  .bande{flex:0 0 58vw;aspect-ratio:4/5;scroll-snap-align:start}
  .bande img{filter:none}
}
.rangee{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(28px,5.5vw,104px);align-items:center;padding:var(--tete) var(--bord);scroll-margin-top:40px}
.rangee.inverse .r-photo{order:2}
.r-photo .cadre{width:min(100%,calc((100svh - 150px) * .8));min-width:min(100%,300px)}
.rangee.inverse .r-photo .cadre{margin-left:auto}
.r-photo .cadre img{aspect-ratio:4/5}
@media (max-width:900px){.r-photo .cadre{width:auto;min-width:0;margin:0!important}}
.r-fiche{display:flex;flex-direction:column;align-items:flex-start;max-width:640px}
.r-fiche .poste{margin-bottom:14px}
.r-fiche h2{font-size:clamp(60px,6.8vw,118px)}
.r-fiche .resume{margin-top:18px;font-size:17px;font-weight:500}
.citation{margin-top:clamp(26px,3.2vw,44px);max-width:24ch;font-weight:600;font-size:clamp(25px,2.4vw,40px);line-height:1.1;letter-spacing:-.022em}
.citation.longue{max-width:30ch;font-size:clamp(21px,1.8vw,30px)}
.citation::first-letter{color:var(--vert)}
[data-fond=clair] .citation::first-letter{color:var(--vert-encre)}
.plus{align-self:stretch;margin-top:clamp(26px,3.2vw,40px);border-top:1px solid var(--filet-c);border-bottom:1px solid var(--filet-c)}
[data-fond=sombre] .plus{border-color:var(--filet-s)}
.plus summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:14px 0;font-size:15px;font-weight:600;cursor:pointer}
.plus summary::-webkit-details-marker{display:none}
.plus summary::after{content:"+";font-size:24px;line-height:1;font-weight:400;color:var(--vert);transition:transform .4s var(--courbe)}
.plus[open] summary::after{transform:rotate(45deg)}
.plus dl{display:grid;grid-template-columns:auto 1fr;gap:8px 22px;padding:2px 0 16px;font-size:15px}
.plus dt{color:var(--gris-c)}
.plus dd{font-weight:500}
.plus .sources{padding-bottom:16px;font-size:14px;color:var(--gris-c)}
.plus .sources a{text-decoration:underline;text-underline-offset:3px}
[data-fond=sombre] .plus dt,[data-fond=sombre] .plus .sources{color:var(--gris-s)}
.r-bas{align-self:stretch;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-top:clamp(24px,3vw,40px)}
.r-bas .fleche{padding-bottom:4px}
.second{display:grid;grid-template-columns:84px minmax(0,1fr);gap:12px;align-items:end;max-width:300px;font-size:13px;color:var(--gris-c)}
[data-fond=sombre] .second{color:var(--gris-s)}
.second img{width:84px;aspect-ratio:4/5;object-fit:cover}
@media (max-width:900px){
  .rangee,.rangee.inverse{grid-template-columns:1fr;gap:26px;padding-top:0}
  .rangee .r-photo,.rangee.inverse .r-photo{order:0;margin:0 calc(-1 * var(--bord))}
  .r-fiche h2{font-size:clamp(52px,14vw,72px)}
  .r-bas{flex-direction:column;align-items:flex-start}
}

/* ---------- page contact ---------- */
.ct-tete{position:relative;padding:calc(70px + var(--tete)) var(--bord) clamp(36px,6vw,90px)}
.ct-tete .intro-txt{margin-top:24px;font-size:clamp(17px,1.45vw,21px);max-width:42ch;color:var(--blanc-2)}
.ct-corps{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(28px,5vw,90px);align-items:start;padding:var(--tete) var(--bord) var(--pied-section)}
.formulaire{max-width:760px}
.formulaire fieldset{border:0}
.formulaire legend,.champs label>span{display:block;font-size:13px;font-weight:500;color:var(--gris-c);margin-bottom:4px;transition:color .3s}
.champs label:focus-within>span{color:var(--noir)}
.champs label>span em{font-style:normal;font-weight:400}
.champs label{display:block}
.choix{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;border-radius:999px;overflow:hidden;margin-bottom:clamp(26px,4vh,40px)}
.choix label{position:relative}
.choix input{position:absolute;opacity:0;inset:0;cursor:pointer}
.choix label>span{display:flex;align-items:center;justify-content:center;height:52px;padding:0 6px;background:var(--noir);color:var(--blanc);
  font-family:"Big Shoulders";font-weight:800;font-size:clamp(17px,1.5vw,21px);transition:background .3s,color .3s}
.choix input:checked+span{background:var(--vert);color:var(--noir)}
.choix input:focus-visible+span{outline:2px solid var(--blanc);outline-offset:-4px}
.champs{display:grid;grid-template-columns:1fr 1fr;gap:22px 20px}
.champs .large{grid-column:1/-1}
.formulaire input[type=text],.formulaire input[type=email],.formulaire input[type=tel],.formulaire input[type=url],.formulaire input[type=number],.formulaire select,.formulaire textarea{
  width:100%;padding:8px 0 11px;font-size:17px;color:var(--noir);background:transparent;border:0;border-bottom:1px solid var(--filet-c);border-radius:0;appearance:none;-webkit-appearance:none;transition:border-color .3s,box-shadow .3s}
.formulaire select{background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230B0D0C' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 2px center;padding-right:28px}
.formulaire textarea{min-height:96px;resize:vertical}
.formulaire input:focus,.formulaire select:focus,.formulaire textarea:focus{outline:none;border-color:var(--vert);box-shadow:0 1px 0 var(--vert)}
.formulaire ::placeholder{color:var(--gris-s)}
.formulaire .bloc{display:contents}
.formulaire .bloc[hidden]{display:none}
.formulaire .piege{position:absolute;left:-9999px}
.consent{display:flex;gap:12px;align-items:flex-start;margin-top:26px;font-size:14px;color:var(--gris-c)}
.consent input{margin-top:3px;width:18px;height:18px;accent-color:var(--vert);flex:none}
.consent a{text-decoration:underline;text-underline-offset:2px}
.envoi{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:28px}
.envoi .etat{font-size:15px;font-weight:500}
.envoi .etat:empty{display:none}
.envoi .etat.erreur{color:#B3261E}
.merci{display:none;color:var(--noir)}
.merci h2{font-size:clamp(44px,5vw,80px)}
.merci p{margin-top:16px;color:var(--gris-c);max-width:40ch}
.formulaire.envoye form{display:none}
.formulaire.envoye .merci{display:block}
.ct-aside{position:sticky;top:96px;display:grid;gap:18px}
.ct-aside .cadre{border-radius:20px}
.ct-aside .cadre img{aspect-ratio:4/5}
.ct-aside .qui b{display:block;font-family:"Big Shoulders";font-weight:800;font-size:28px;line-height:1}
.ct-aside .qui span{font-size:14px;color:var(--gris-c)}
.direct-liste{border-top:1px solid var(--filet-c)}
.direct-liste a{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:14px 0;border-bottom:1px solid var(--filet-c)}
.direct-liste span{font-size:13px;color:var(--gris-c)}
.direct-liste b{grid-row:2;font-weight:600;font-size:16px;overflow-wrap:anywhere}
.direct-liste i{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;color:var(--vert);transition:transform .5s var(--courbe)}
@media (hover:hover) and (pointer:fine){.direct-liste a:hover i{transform:translateX(5px)}}
@media (max-width:900px){
  .ct-corps{grid-template-columns:1fr}
  .ct-aside{position:static}
  .ct-aside .cadre{display:none}
  .champs{gap:20px 14px}
}

/* ---------- pages légales : bandeau sombre, sommaire collant, texte en une colonne ---------- */
.lg-tete{position:relative;padding:calc(70px + var(--tete)) var(--bord) clamp(40px,7vh,72px)}
.lg-meta{margin-top:18px;font-size:14px;color:var(--gris-s)}
.lg-bascule{margin-top:clamp(24px,4vh,40px);width:min(100%,460px)}
.lg-bascule>span{width:100%;gap:3px}
html[lang=fr] .lg-bascule>.fr,html[lang=en] .lg-bascule>.en{display:flex}
.lg-bascule a{background:var(--noir-3)!important;color:var(--blanc)!important;font-size:18px;text-align:center;padding:0 10px}
.lg-bascule a[aria-current=page]{background:var(--vert)!important;color:var(--noir)!important}
.legal{padding:clamp(40px,7vh,90px) var(--bord) clamp(60px,10vh,120px);font-size:16px;line-height:1.65}
html[lang=fr] .legal .lg-corps.fr,html[lang=en] .legal .lg-corps.en{display:grid}
.lg-corps{grid-template-columns:minmax(0,260px) minmax(0,720px);gap:clamp(32px,6vw,110px);align-items:start}
.lg-sommaire{position:sticky;top:110px;display:grid;border-top:1px solid var(--noir)}
.lg-sommaire a{padding:11px 0;border-bottom:1px solid var(--filet-c);font-size:14px;font-weight:500;color:var(--gris-c);transition:color .3s}
.lg-sommaire a:hover{color:var(--noir)}
.lg-intro{font-size:clamp(19px,1.6vw,23px);font-weight:500;line-height:1.4;margin-bottom:28px;max-width:40ch}
.legal section{padding:26px 0;border-top:1px solid var(--filet-c);scroll-margin-top:100px}
.legal section:first-of-type{border-top-color:var(--noir)}
.legal h2{font-family:"Big Shoulders";font-weight:800;font-size:clamp(26px,2.2vw,32px);line-height:1;margin:0 0 14px}
.legal p{margin-bottom:12px;max-width:68ch}
.legal p:last-child{margin-bottom:0}
.legal .lg-texte a{text-decoration:underline;text-decoration-color:var(--vert);text-decoration-thickness:2px;text-underline-offset:4px}
.legal b{font-weight:600}
@media (max-width:900px){.lg-corps{grid-template-columns:1fr}.lg-sommaire{display:none}}

/* ---------- appels à l'action : vert pour écrire, plein pour un joueur, flèche pour le reste ---------- */
.bouton{display:inline-flex;align-items:center;gap:12px;height:54px;padding:0 26px;border-radius:999px;background:var(--noir);color:var(--blanc);
  font-family:"Big Shoulders";font-weight:800;font-size:20px;line-height:1;white-space:nowrap;transition:background-color .4s var(--courbe),transform .2s}
.bouton i{font-style:normal;color:var(--vert);transition:transform .5s var(--courbe)}
[data-fond=sombre] .bouton{background:var(--blanc);color:var(--noir)}
[data-fond=sombre] .bouton i{color:var(--vert-encre)}
.bouton:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.bouton:hover i{transform:translateX(5px)}[data-fond=clair] .bouton:hover{background:#000}[data-fond=sombre] .bouton:hover{background:#fff}}
.envoyer.court{width:auto;display:inline-flex;padding:0 30px}
.relance{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;margin-top:clamp(48px,6vw,88px);padding-top:clamp(22px,2.6vw,32px);border-top:1px solid var(--filet-s)}
[data-fond=clair] .relance{border-top-color:var(--noir)}
.relance p{font-family:"Big Shoulders";font-weight:800;font-size:clamp(30px,3vw,48px);line-height:.95}
.relance .sous{display:block;margin-top:10px;font-family:"General Sans";font-weight:500;font-size:16px;line-height:1.45;color:var(--gris-s)}
[data-fond=clair] .relance .sous{color:var(--gris-c)}
.direct-fondateur{display:inline-flex;margin-top:22px}
.famille .duo{margin-top:clamp(24px,4vh,40px);width:440px}
.fin-joueurs{padding:var(--tete) var(--bord) var(--pied-section)}
.fin-joueurs .relance{margin-top:0;border-top:0;padding-top:0}
.fin-joueurs .actions{display:flex;flex-wrap:wrap;gap:12px}
@media (max-width:760px){
  .relance{flex-direction:column;align-items:stretch}
  .relance .envoyer,.relance .bouton{width:100%;justify-content:center}
  .famille .duo{width:100%;font-size:19px}
  .fin-joueurs .actions{flex-direction:column}
}

/* ---------- mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  html.js-anime [data-lignes] .l>span,html.js-anime [data-monte],html.js-anime [data-image] .zoom{transform:none;opacity:1}
  html.js-anime [data-image],html.js-anime .registre .signe{clip-path:none}
  .remplir .mot{opacity:1}
  .famille-fond img{animation:none}
  .sig-photo img{transition:none}
}

/* icônes à la place des noms (Instagram, Transfermarkt, WhatsApp) */
.ico{display:block;width:22px;height:22px;flex:none}
.ico-tm{width:38px;height:17px;background:currentColor;-webkit-mask:url(../img/icones/transfermarkt.png) center/contain no-repeat;mask:url(../img/icones/transfermarkt.png) center/contain no-repeat}
.reseaux{display:flex !important;align-items:center;gap:8px;line-height:1 !important}
.reseaux{gap:0}
.reseaux a{display:inline-flex !important;align-items:center;justify-content:center;min-width:44px;height:44px;opacity:.85;transition:opacity .3s,transform .3s}
.reseaux a:first-child{justify-content:flex-start}
.reseaux a:hover{opacity:1;transform:translateY(-2px)}
.plus .sources.reseaux a{text-decoration:none}
.duo .ico{width:26px;height:26px}
