/* ==========================================================================
   Reveal Agency — feuille de style unique
   Sommaire : 1 Polices · 2 Variables · 3 Base · 4 Utilitaires · 5 Composants
              6 Header & menu · 7 Accueil · 8 Sélecteur de talents · 9 Sections
              10 Pages internes · 11 Animations · 12 Responsive
   Couleurs : repris du site d'origine (marine #0d0d55, jaune #f0f424)
   Polices  : Bricolage Grotesque + Figtree (licence SIL OFL, usage libre)
   WordPress : les variables de la section 2 se reportent dans theme.json
   ========================================================================== */

/* 1 — POLICES ============================================================= */
@font-face{font-family:"Bricolage Grotesque";src:url(../fonts/bricolage-latin-ext.woff2) format("woff2");font-weight:500 800;font-display:swap;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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bricolage Grotesque";src:url(../fonts/bricolage-latin.woff2) format("woff2");font-weight:500 800;font-display:swap;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}
@font-face{font-family:"Figtree";src:url(../fonts/figtree-latin-ext.woff2) format("woff2");font-weight:400 700;font-display:swap;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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Figtree";src:url(../fonts/figtree-latin.woff2) format("woff2");font-weight:400 700;font-display:swap;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}

/* 2 — VARIABLES =========================================================== */
:root{
  --navy-950:#06062f; --navy-900:#09093f; --navy:#0d0d55; --navy-800:#12127a; --navy-700:#17177a; --navy-500:#3a3ab0;
  --yellow:#f0f424;
  --paper:#f3f3fa; --paper-2:#e7e7f5;
  --ink:#0d0d55; --ink-soft:#4a4a86;
  --on-navy-soft:rgba(235,235,255,.72);
  --line-navy:rgba(255,255,255,.14); --line-paper:rgba(13,13,85,.14);
  --error:#b3261e;
  --star-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 520'><path d='M180 0C189 232.8 217.5 241.2 360 260C217.5 278.8 189 287.2 180 520C171 287.2 142.5 278.8 0 260C142.5 241.2 171 232.8 180 0Z'/></svg>");

  --f-display:"Bricolage Grotesque","Arial Narrow",system-ui,sans-serif;
  --f-body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;

  --fs-hero:clamp(2.7rem,5.4vw,5.6rem);
  --fs-h2:clamp(2.1rem,5vw,4.6rem);
  --fs-h3:clamp(1.3rem,2vw,1.8rem);
  --fs-lead:clamp(1.05rem,1.5vw,1.3rem);

  --container:1280px;
  --gutter:clamp(1.25rem,4vw,3rem);
  --section:clamp(4.5rem,11vw,10rem);

  --r-sm:12px; --r-md:22px; --r-lg:34px;
  --ease:cubic-bezier(.22,1,.36,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --shadow-navy:0 30px 60px -20px rgba(6,6,47,.55);

  --z-header:50; --z-tray:60; --z-menu:70; --z-skip:100;
}

/* 3 — BASE ================================================================ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:6rem;overflow-x:clip}
body{margin:0;font-family:var(--f-body);font-size:1.0625rem;line-height:1.6;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,video{display:block;max-width:100%}
img{height:auto}
figure{margin:0}
a{color:inherit;text-decoration-thickness:.08em;text-underline-offset:.2em}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;line-height:1.02;letter-spacing:-.025em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0;list-style:none}
dl,dd{margin:0}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}
.on-paper :focus-visible,.on-paper-2 :focus-visible{outline-color:var(--navy)}
::selection{background:var(--yellow);color:var(--navy)}

/* 4 — UTILITAIRES ========================================================= */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:1rem;top:-5rem;z-index:var(--z-skip);background:var(--yellow);color:var(--navy);padding:.8rem 1.2rem;border-radius:999px;font-weight:700;transition:top .2s}
.skip:focus{top:1rem}
.container{width:min(100% - var(--gutter)*2,var(--container));margin-inline:auto}
.section{padding-block:var(--section)}
.on-navy{background:var(--navy);color:#fff}
.on-navy-deep{background:var(--navy-950);color:#fff}
.on-paper{background:var(--paper);color:var(--ink)}
.on-paper-2{background:var(--paper-2);color:var(--ink)}
.on-yellow{background:var(--yellow);color:var(--navy)}
.grain{position:relative;isolation:isolate}
.grain::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase}
.eyebrow::before{content:"";flex:none;width:.65rem;height:.95rem;background:currentColor;-webkit-mask:var(--star-mask) center/contain no-repeat;mask:var(--star-mask) center/contain no-repeat}
.on-navy .eyebrow,.on-navy-deep .eyebrow{color:var(--yellow)}
.eyebrow + .h2{margin-top:1rem}
.h2{font-size:var(--fs-h2)}
.lead{font-size:var(--fs-lead);line-height:1.5;max-width:46ch}
.on-navy .lead,.on-navy-deep .lead{color:var(--on-navy-soft)}
.on-paper .lead,.on-paper-2 .lead{color:var(--ink-soft)}

/* 5 — COMPOSANTS ========================================================== */
.btn{--bg:var(--yellow);--fg:var(--navy);display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:3rem;padding:1.05rem 1.6rem;border-radius:999px;background:var(--bg);color:var(--fg);font-weight:700;font-size:1rem;line-height:1;text-decoration:none;white-space:nowrap;transition:transform .35s var(--spring),box-shadow .3s,background .25s,color .25s}
.btn svg{width:1.15em;height:1.15em;transition:transform .35s var(--spring)}
.btn:hover{transform:translateY(-3px);box-shadow:0 14px 28px -10px rgba(240,244,36,.55)}
.btn:hover svg{transform:translate(3px,-3px)}
.btn:active{transform:scale(.97)}
.btn--ghost{--bg:transparent;--fg:currentColor;box-shadow:inset 0 0 0 1.5px currentColor}
.btn--ghost:hover{--bg:var(--yellow);--fg:var(--navy);box-shadow:inset 0 0 0 1.5px var(--yellow)}
.btn--navy{--bg:var(--navy);--fg:#fff}
.btn--navy:hover{box-shadow:0 14px 28px -10px rgba(13,13,85,.6)}
.link-arrow{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:.15rem}
.link-arrow svg{width:1em;height:1em;transition:transform .3s var(--spring)}
.link-arrow:hover svg{transform:translate(3px,-3px)}

.chip{display:inline-flex;align-items:center;gap:.55rem;min-height:2.75rem;padding:.7rem 1.1rem;border-radius:999px;font-weight:600;font-size:.92rem;box-shadow:inset 0 0 0 1.5px var(--line-navy);transition:background .25s,color .25s,box-shadow .25s,transform .3s var(--spring)}
.chip svg{width:1.1rem;height:1.1rem}
.chip:hover{box-shadow:inset 0 0 0 1.5px var(--yellow);transform:translateY(-2px)}
.chip[aria-pressed="true"]{background:var(--yellow);color:var(--navy);box-shadow:none}
.chip--dice:active svg{animation:dice .5s var(--ease)}

.social{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;padding:.7rem 1.05rem;border-radius:999px;background:rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-weight:700;font-size:.92rem;text-decoration:none;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);transition:background .25s,color .25s,transform .3s var(--spring)}
.social svg{width:1.1rem;height:1.1rem}
.social .ext{width:.85rem;height:.85rem;opacity:.7}
.social:hover{background:var(--yellow);color:var(--navy);transform:translateY(-2px)}

.pick{display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;padding:.85rem 1.3rem;border-radius:999px;background:var(--yellow);color:var(--navy);font-weight:700;white-space:nowrap;transition:transform .35s var(--spring),background .25s}
.pick svg{width:1.1rem;height:1.1rem;transition:transform .4s var(--spring)}
.pick:hover{transform:translateY(-2px)}
.pick:active{transform:scale(.96)}
.pick[aria-pressed="true"]{background:#fff}
.pick[aria-pressed="true"] svg{transform:rotate(45deg)}
.arrows{display:flex;gap:.4rem}
.arrow{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px var(--line-navy);transition:.3s var(--spring)}
.arrow svg{width:1.2rem;height:1.2rem}
.arrow:hover{background:var(--yellow);color:var(--navy);box-shadow:none;transform:scale(1.08)}
.arrow--prev svg{transform:rotate(180deg)}

/* 6 — HEADER & MENU ======================================================= */
.header{position:fixed;inset:1rem 0 auto;z-index:var(--z-header);pointer-events:none}
.header__bar{pointer-events:auto;width:min(100% - 2rem,1180px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem .6rem .55rem 1.2rem;border-radius:999px;background:rgba(9,9,63,.55);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 18px 40px -18px rgba(6,6,47,.7);color:#fff;transition:transform .45s var(--ease),background .3s}
.header.is-hidden .header__bar{transform:translateY(-140%)}
.header.is-solid .header__bar{background:rgba(9,9,63,.9)}
.logo{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff}
.logo svg{height:2.8rem;width:auto;color:var(--yellow);transition:transform .8s var(--ease)}
.logo:hover svg{transform:rotate(90deg) scale(1.1)}
.logo b{font-family:var(--f-display);font-size:1.3rem;font-weight:800;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.logo small{display:block;font-size:.58rem;letter-spacing:.38em;font-weight:600;opacity:.75;margin-top:.15rem}
.nav{display:flex;align-items:center;gap:.25rem}
.nav a{padding:.6rem 1rem;border-radius:999px;font-weight:600;font-size:.95rem;text-decoration:none;color:rgba(255,255,255,.82);transition:color .2s,background .2s}
.nav a:hover{color:#fff;background:rgba(255,255,255,.1)}
.nav a[aria-current="page"]{color:var(--navy);background:var(--yellow)}
.header__cta{padding:.8rem 1.3rem}
/* barre d'administration WordPress (visible quand on est connecté) */
.admin-bar .header{inset:calc(1rem + 32px) 0 auto}
.admin-bar .menu__close{top:calc(1.1rem + 32px)}
@media (max-width:782px){.admin-bar .header{inset:calc(.6rem + 46px) 0 auto}.admin-bar .menu__close{top:calc(1.1rem + 46px)}}
.burger{display:none;flex:none;width:2.9rem;height:2.9rem;border-radius:50%;background:var(--yellow);color:var(--navy);place-items:center}
.burger svg{width:1.3rem;height:1.3rem}

.menu{position:fixed;inset:0;z-index:var(--z-menu);display:flex;flex-direction:column;justify-content:space-between;gap:2rem;padding:5.5rem var(--gutter) max(1.5rem,env(safe-area-inset-bottom));overflow-y:auto;background:var(--navy-950);color:#fff;clip-path:circle(0% at calc(100% - 2.6rem) 2.6rem);visibility:hidden;transition:clip-path .7s var(--ease),visibility 0s .7s}
.menu.is-open{clip-path:circle(150% at calc(100% - 2.6rem) 2.6rem);visibility:visible;transition:clip-path .7s var(--ease),visibility 0s}
.menu__close{position:absolute;top:1.1rem;right:1.1rem;width:2.9rem;height:2.9rem;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center}
.menu__close svg{width:1.3rem;height:1.3rem}
.menu nav a{display:block;font-family:var(--f-display);font-weight:700;font-size:clamp(2rem,9vw,3.4rem);letter-spacing:-.03em;text-decoration:none;padding:.45rem 0;border-bottom:1px solid var(--line-navy);opacity:0;transform:translateY(20px);transition:opacity .5s var(--ease),transform .5s var(--ease),color .2s}
.menu.is-open nav a{opacity:1;transform:none}
.menu.is-open nav a:nth-child(2){transition-delay:.06s}
.menu.is-open nav a:nth-child(3){transition-delay:.12s}
.menu.is-open nav a:nth-child(4){transition-delay:.18s}
.menu.is-open nav a:nth-child(5){transition-delay:.24s}
.menu.is-open nav a:nth-child(6){transition-delay:.3s}
.menu nav a:hover,.menu nav a[aria-current="page"]{color:var(--yellow)}
.menu__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.menu__social{display:flex;gap:.6rem}
.menu__social a{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px var(--line-navy)}
.menu__social svg{width:1.2rem;height:1.2rem}

/* 7 — ACCUEIL : HERO, ÉVENTAIL, MARQUEE =================================== */
.hero{position:relative;min-height:100dvh;padding:9rem 0 4rem;overflow:hidden;display:flex;align-items:center}
.hero::after{content:"";position:absolute;width:70vmax;height:70vmax;right:-22vmax;top:-18vmax;background:radial-gradient(closest-side,rgba(58,58,176,.75),rgba(58,58,176,0));z-index:-1;pointer-events:none}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(1.5rem,3vw,3rem);align-items:center}
.hero__grid>div:first-child{position:relative;z-index:2}
.hero h1{font-size:var(--fs-hero);font-weight:800;letter-spacing:-.04em;line-height:.95}
.hero h1 em{font-style:normal;color:var(--yellow)}
.hero__lead{margin-top:1.8rem}
.hero__ctas{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}
.hero__meta{display:flex;flex-wrap:wrap;gap:.6rem 1.8rem;margin-top:2.6rem;font-size:.95rem;color:var(--on-navy-soft)}
.hero__meta strong{font-family:var(--f-display);font-size:1.6rem;color:#fff;margin-right:.35rem;letter-spacing:-.02em}
.hero__star{position:absolute;left:-6vmax;bottom:-8vmax;width:34vmax;color:rgba(240,244,36,.06);z-index:-1;animation:spin 60s linear infinite}

.fan{position:relative;aspect-ratio:1/1.08;width:min(100%,480px);margin-inline:auto;perspective:1200px}
.fan__card{position:absolute;width:46%;aspect-ratio:3/4;border-radius:var(--r-md);overflow:hidden;background:var(--navy-700);box-shadow:var(--shadow-navy);text-decoration:none;color:#fff;transform:translate3d(var(--x),var(--y),0) rotate(var(--r));animation:float 7s ease-in-out infinite;animation-delay:var(--d);transition:transform .6s var(--ease),box-shadow .4s}
.fan__card img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.fan__card span{position:absolute;inset:auto .7rem .7rem;display:flex;justify-content:space-between;align-items:center;gap:.4rem;font-weight:700;font-size:.82rem;padding:.45rem .7rem;border-radius:999px;background:rgba(9,9,63,.7);backdrop-filter:blur(8px);opacity:0;transform:translateY(8px);transition:.35s var(--ease)}
.fan__card svg{width:.9rem;height:.9rem}
.fan__card:hover,.fan__card:focus-visible{z-index:9;transform:translate3d(var(--x),calc(var(--y) - 14px),0) scale(1.06);box-shadow:0 40px 70px -20px rgba(6,6,47,.8)}
.fan__card:hover img{transform:scale(1.06)}
.fan__card:hover span,.fan__card:focus-visible span{opacity:1;transform:none}
.fan__chip{position:absolute;z-index:10;display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .95rem;border-radius:999px;background:var(--yellow);color:var(--navy);font-weight:700;font-size:.85rem;white-space:nowrap;box-shadow:0 14px 30px -10px rgba(6,6,47,.6);animation:float 6s ease-in-out infinite}
.fan__chip svg{width:1.05rem;height:1.05rem}

.marquee{overflow:hidden;border-block:1px solid var(--line-navy);padding-block:1.2rem;background:var(--navy-950);color:#fff}
.marquee__track{display:flex;width:max-content;animation:marquee 45s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__list{display:flex;align-items:center;flex-shrink:0}
.marquee__list a{display:inline-flex;align-items:center;gap:1.6rem;padding-right:1.6rem;font-family:var(--f-display);font-weight:700;font-size:clamp(1.6rem,3.4vw,2.8rem);letter-spacing:-.03em;text-decoration:none;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.75);transition:color .3s,-webkit-text-stroke-color .3s}
.marquee__list a::after{content:"";flex-shrink:0;width:.45em;height:.65em;background:var(--yellow);-webkit-mask:var(--star-mask) center/contain no-repeat;mask:var(--star-mask) center/contain no-repeat}
.marquee__list a:hover{color:var(--yellow);-webkit-text-stroke-color:var(--yellow)}

/* 8 — SÉLECTEUR DE TALENTS ================================================ */
.roster{position:relative;overflow:hidden}
.roster.section{padding-block:clamp(3.5rem,7vw,6.5rem)}
.roster__ambient{position:absolute;inset:-10%;z-index:-1;pointer-events:none}
.roster__ambient img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(90px) saturate(1.3);opacity:0;transition:opacity 1s}
.roster__ambient img.is-on{opacity:.38}
.roster__ambient::after{content:"";position:absolute;inset:0;background:linear-gradient(var(--navy-950),rgba(6,6,47,.6) 30%,rgba(6,6,47,.6) 70%,var(--navy-950))}
.roster__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.5rem 2rem;margin-bottom:2rem}
.roster__head h2{max-width:14ch}
.roster__tools{display:flex;flex-wrap:wrap;gap:.6rem}
.roster__stage{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.roster[data-view="grid"] .roster__stage{display:none}
.roster:not([data-view="grid"]) .roster__grid{display:none}
.roster__strip{display:none}

/* liste typographique */
.index{counter-reset:t}
.index li{border-top:1px solid var(--line-navy)}
.index li:last-child{border-bottom:1px solid var(--line-navy)}
.index button{width:100%;display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:1rem;text-align:left;padding:.4rem 0;font-family:var(--f-display);font-weight:700;font-size:clamp(1.25rem,2.3vw,2.05rem);letter-spacing:-.03em;line-height:1.1;color:rgba(255,255,255,.4);transition:color .3s,padding .5s var(--ease)}
.index button::before{counter-increment:t;content:counter(t,decimal-leading-zero);font-family:var(--f-body);font-size:.8rem;font-weight:600;letter-spacing:.1em;color:var(--on-navy-soft)}
.idx__go{width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:var(--navy);opacity:0;transform:scale(.4) rotate(-45deg);transition:.45s var(--spring)}
.idx__go svg{width:1.1rem;height:1.1rem}
.index button:hover{color:#fff}
.index button[aria-current="true"]{color:var(--yellow);padding-left:1rem}
.index button[aria-current="true"] .idx__go{opacity:1;transform:none}

/* scène : téléphone + panneau */
.stage{position:sticky;top:4.8rem;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1.2rem,3vw,3.5rem);align-items:center}
.stage__timer{position:absolute;z-index:3;width:2.3rem;height:2.3rem}
.stage__timer circle{fill:none;stroke-width:3}
.stage__timer .bg{stroke:rgba(255,255,255,.25)}
.stage__timer .fg{stroke:var(--yellow);stroke-dasharray:113;stroke-dashoffset:113;transform:rotate(-90deg);transform-origin:center}
.stage__timer.is-run .fg{animation:ring var(--dur,4.8s) linear forwards}
.stage__timer[hidden]{display:none}

.phone-wrap{position:relative;display:grid;place-items:center;perspective:1700px;padding:.6rem 3.6rem 1.8rem;touch-action:pan-y}
.phone-wrap::after{content:"";position:absolute;left:50%;bottom:.3rem;width:60%;height:1.6rem;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(240,244,36,.4),transparent);filter:blur(8px);pointer-events:none}
.phone-move,.phone-flip{transform-style:preserve-3d}
.phone-move{transform:translate3d(var(--tx,0px),var(--ty,0px),0) scale(var(--sc,1));transition:transform .55s var(--ease)}
.phone-wrap.is-tilt .phone-move,.phone-wrap.is-tilt .phone{transition:transform .14s linear}
.phone{--rx:0deg;--ry:0deg;position:relative;height:min(50rem,calc(100dvh - 8.5rem));min-height:30rem;aspect-ratio:9/18.6;border-radius:3rem;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(calc(var(--ry) + var(--sway)));animation:sway 7s ease-in-out infinite;transition:transform .55s var(--ease)}
.phone-wrap.is-tilt .phone{animation:none}
/* fil ouvert : modèle remis à plat (les iframes ignorent la 3D, surtout sur iOS) */
.phone-wrap.is-live .phone-move,.phone-wrap.is-live .phone-flip,.phone-wrap.is-live .phone{transform:none;animation:none;transform-style:flat}
.phone-wrap.is-live .phone__side,.phone-wrap.is-live .phone__key{display:none}
.phone-wrap.is-live .phone__chip{transform:none}
.phone__side{position:absolute;inset:0;border-radius:inherit;background:#15156f;box-shadow:inset 0 0 0 2px #2a2aa0;transform:translateZ(var(--z))}
.phone__key{position:absolute;width:5px;background:#2a2aa0;border-radius:2px;transform:translateZ(-7px)}
.phone__key--l1{left:-4px;top:17%;height:6%}
.phone__key--l2{left:-4px;top:25%;height:10%}
.phone__key--r{right:-4px;top:22%;height:14%}
.phone__frame{position:absolute;inset:0;border-radius:inherit;padding:.6rem;background:linear-gradient(145deg,#3030b8,#0a0a3a 55%,#1b1b80);box-shadow:inset 0 0 0 2px rgba(255,255,255,.24),0 40px 80px -24px rgba(6,6,47,.85);transform:translateZ(1px)}
.phone__island{position:absolute;top:1.15rem;left:50%;z-index:8;width:28%;height:1.15rem;transform:translateX(-50%);border-radius:99px;background:#05051f}
.phone__screen{position:relative;width:100%;height:100%;border-radius:2.45rem;overflow:hidden;clip-path:inset(0 round 2.45rem);-webkit-mask-image:-webkit-radial-gradient(#fff,#000);background:var(--navy-950);isolation:isolate;transform:translateZ(0)}
.phone__screen>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phone__screen::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(6,6,47,.3),transparent 22%,transparent 50%,rgba(6,6,47,.9));pointer-events:none}
.phone__screen .stage__timer{top:2.6rem;right:1rem}
.phone__glare{position:absolute;inset:0;z-index:9;pointer-events:none;background:radial-gradient(circle at var(--gx,25%) var(--gy,15%),rgba(255,255,255,.34),transparent 48%);mix-blend-mode:soft-light;transition:opacity .4s}
.phone__chip{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1rem;border-radius:999px;background:var(--yellow);color:var(--navy);font-weight:700;font-size:.85rem;white-space:nowrap;box-shadow:0 18px 34px -12px rgba(6,6,47,.7);animation:bob 5s ease-in-out infinite}
.phone__chip svg{width:1.1rem;height:1.1rem}
.phone__chip--a{left:-3.4rem;top:20%;transform:translateZ(90px)}
.phone__chip--b{right:-3.4rem;bottom:18%;transform:translateZ(120px);animation-delay:-2.4s;background:#fff}
.phone__cover{position:absolute;inset:auto 0 0;z-index:3;padding:1.4rem 1.3rem 1.8rem;display:grid;gap:.5rem;transition:opacity .35s}
.phone__name{font-family:var(--f-display);font-size:clamp(1.8rem,2.4vw,2.4rem);font-weight:800;letter-spacing:-.035em;line-height:1}
.phone__hint{font-size:.85rem;font-weight:600;color:var(--yellow);max-width:20ch}
.phone__live{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;border-radius:inherit;overflow:hidden;background:#fff}
.phone__live[hidden]{display:none}
.phone__live::before{content:"";flex:none;height:2.7rem;background:var(--navy-950);position:relative;z-index:2}
.phone__live iframe{flex:1;width:100%;min-height:0;border:0;background:#fff;position:relative;z-index:1;opacity:0;transition:opacity .5s}
.phone__live iframe.is-ready{opacity:1}
.phone__loader{position:absolute;inset:2.7rem 0 0;z-index:0;display:grid;place-content:center;justify-items:center;gap:.9rem;color:var(--navy);font-weight:700;font-size:.9rem;background:linear-gradient(100deg,#f1f1f8 30%,#fff 50%,#f1f1f8 70%) 0 0/200% 100%;animation:shimmer 1.2s linear infinite}
.phone__loader svg{height:3.2rem;width:auto;animation:spin 2.4s linear infinite}
.phone__screen.is-live .phone__cover,.phone__screen.is-live .stage__timer{opacity:0;pointer-events:none}
.phone__screen.is-live .phone__glare{opacity:.35}

.stage__side{display:grid;gap:1.1rem;align-content:center;min-width:0}
.stage__count{font-weight:700;font-size:.85rem;letter-spacing:.14em;color:var(--yellow)}
.stage__name{font-size:clamp(2.2rem,3.8vw,3.6rem);font-weight:800;letter-spacing:-.04em;line-height:.95}
.stage__legal{font-size:.78rem;color:var(--on-navy-soft)}
.stage__links{display:flex;flex-wrap:wrap;gap:.5rem}
.stage__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:.4rem}
.switch{display:grid;gap:.55rem;margin-top:.6rem}
.switch button{display:flex;align-items:center;gap:1rem;padding:.95rem 1.2rem;border-radius:var(--r-md);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1.5px var(--line-navy);text-align:left;font-weight:700;transition:background .3s,color .3s,transform .4s var(--spring),box-shadow .3s}
.switch svg{width:1.5rem;height:1.5rem;flex:none}
.switch span{display:grid;line-height:1.15}
.switch small{font-weight:500;font-size:.78rem;opacity:.75}
.switch button:hover{transform:translateX(8px);box-shadow:inset 0 0 0 1.5px var(--yellow)}
.switch button[aria-pressed="true"]{background:var(--yellow);color:var(--navy);box-shadow:none;transform:translateX(8px)}

/* vue grille */
.roster__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.tcard{position:relative;border-radius:var(--r-md);overflow:hidden;aspect-ratio:3/4;background:var(--navy-700);isolation:isolate}
.tcard:nth-child(3n+2){margin-top:2.2rem}
.tcard img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.tcard::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 40%,rgba(6,6,47,.9))}
.tcard:hover img{transform:scale(1.07)}
.tcard__body{position:absolute;inset:auto 0 0;z-index:2;padding:1rem}
.tcard h3{font-size:1.25rem;margin-bottom:.7rem;letter-spacing:-.02em}
.tcard .stage__links{opacity:0;transform:translateY(10px);transition:.4s var(--ease)}
.tcard:hover .stage__links,.tcard:focus-within .stage__links{opacity:1;transform:none}
.tcard .social{padding:.55rem .85rem;font-size:.85rem}
.tcard .pick{position:absolute;top:.8rem;right:.8rem;z-index:3;width:2.75rem;height:2.75rem;padding:0;justify-content:center}

/* barre de sélection (toutes les pages) */
.tray{position:fixed;left:50%;bottom:calc(1.2rem + env(safe-area-inset-bottom));z-index:var(--z-tray);transform:translate(-50%,200%);display:flex;align-items:center;gap:1rem;max-width:calc(100vw - 1.5rem);padding:.6rem .6rem .6rem 1.1rem;border-radius:999px;background:var(--yellow);color:var(--navy);box-shadow:0 24px 50px -14px rgba(6,6,47,.8);transition:transform .6s var(--spring)}
.tray.is-on{transform:translate(-50%,0)}
.tray__faces{display:flex}
.tray__faces img{width:2.4rem;height:2.4rem;border-radius:50%;object-fit:cover;border:2px solid var(--yellow);margin-left:-.7rem;background:var(--navy)}
.tray__faces img:first-child{margin-left:0}
.tray__txt{font-weight:700;font-size:.95rem;line-height:1.15}
.tray__txt small{display:block;font-weight:500;opacity:.7;font-size:.78rem}
.tray__clear{font-size:.8rem;font-weight:600;text-decoration:underline;padding:.5rem}
.tray .btn{padding:.8rem 1.2rem}

/* 9 — SECTIONS D'ACCUEIL ================================================== */
.statement{font-family:var(--f-display);font-weight:700;font-size:clamp(1.8rem,4.6vw,4.2rem);line-height:1.08;letter-spacing:-.03em;max-width:22ch}
.statement .w{opacity:.2;transition:opacity .4s}
.statement .w.is-lit{opacity:1}
.about-split{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(2rem,6vw,6rem);align-items:end;margin-top:3rem}
.about-split .lead{max-width:none}
.section-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.5rem 3rem;margin-bottom:3.5rem}
.section-head .lead{max-width:40ch}

/* pôles : accordéon horizontal */
.poles{display:flex;gap:1rem;min-height:34rem}
.pole{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:space-between;padding:1.8rem;border-radius:var(--r-lg);overflow:hidden;isolation:isolate;background:var(--navy-800);color:#fff;text-decoration:none;transition:flex .8s var(--ease)}
.pole:nth-child(even){background:var(--navy-700)}
.pole.pole--origin{background:#fff;color:var(--navy)}
.pole.pole--connect{background:#ffb8dd;color:var(--navy)}
.pole.pole--talent{background:var(--yellow);color:var(--navy)}
.pole.pole--stage{background:#d3d3df;color:var(--navy)}
.pole.is-active{flex:2.6}
.pole__top{display:flex;justify-content:space-between;align-items:flex-start}
.pole__n{font-weight:700;font-size:.85rem;letter-spacing:.14em;opacity:.7}
.pole__star{height:3.2rem;width:auto;color:var(--yellow);transition:transform .9s var(--ease)}
.pole--origin .pole__star,.pole--connect .pole__star,.pole--talent .pole__star,.pole--stage .pole__star{color:var(--navy)}
.pole.is-active .pole__star{transform:rotate(180deg) scale(1.2)}
.pole h3{font-size:clamp(1.7rem,2.6vw,2.5rem);letter-spacing:-.035em}
.pole h3 small{display:block;font-family:var(--f-body);font-weight:600;font-size:.9rem;letter-spacing:.02em;margin-top:.6rem;opacity:.85}
.pole__more{max-height:0;opacity:0;overflow:hidden;transition:max-height .8s var(--ease),opacity .5s .1s}
.pole.is-active .pole__more{max-height:22rem;opacity:1;margin-top:1.4rem}
.pole__more p{max-width:34ch;opacity:.9}
.pole__more ul{margin:1rem 0 1.4rem;display:grid;gap:.35rem;font-size:.95rem}
.pole__more li::before{content:"";display:inline-block;width:.5em;height:.75em;margin-right:.7rem;background:currentColor;vertical-align:-.05em;-webkit-mask:var(--star-mask) center/contain no-repeat;mask:var(--star-mask) center/contain no-repeat}
.pole__tag{position:absolute;top:1.6rem;right:5rem;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .65rem;border-radius:6px;background:var(--navy);color:var(--yellow)}
.pole:not(.is-active) .pole__tag{opacity:0}
.pole__tag{transition:opacity .3s}
.pole--static{flex:none;min-height:16rem}

.cm__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.cm__grid .btn-row{align-items:center}
.cm__list li{padding:1.5rem 0;border-top:1px solid var(--line-paper)}
.cm__list li:last-child{border-bottom:1px solid var(--line-paper)}
.cm__list h3{font-size:var(--fs-h3);margin-bottom:.4rem}
.cm__list p{color:var(--ink-soft);max-width:44ch}
.cm__for{margin-top:clamp(2.5rem,5vw,4rem)}
.tags{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}
.tags li{padding:.7rem 1.2rem;border-radius:999px;font-weight:600;box-shadow:inset 0 0 0 1.5px var(--navy)}
.process{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.process__sticky{position:sticky;top:7rem}
.steps{counter-reset:s}
.step{display:grid;grid-template-columns:4rem 1fr;gap:1.5rem;padding:2.2rem 0;border-top:1px solid var(--line-paper)}
.step:last-child{border-bottom:1px solid var(--line-paper)}
.step::before{counter-increment:s;content:counter(s,decimal-leading-zero);font-family:var(--f-display);font-weight:800;font-size:2.6rem;letter-spacing:-.04em;line-height:1}
.step h3{font-size:var(--fs-h3);margin-bottom:.6rem}
.step p{color:var(--ink-soft);max-width:50ch}

/* marques : bandeau défilant (accueil et pages de services) */
.brands{padding-block:clamp(2.5rem,5vw,4rem)}
.brands__head{margin-bottom:1.6rem}
.brands__head .h2{font-size:clamp(1.7rem,3.2vw,2.6rem)}
.logos{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logos__track{display:flex;width:max-content;animation:marquee 45s linear infinite}
.logos:hover .logos__track{animation-play-state:paused}
.logos__list{display:flex;flex-shrink:0;align-items:center;gap:3.5rem;padding-right:3.5rem}
.logos__list img{width:auto;height:auto;max-width:12rem;max-height:4.2rem;object-fit:contain}

/* FAQ : liste + panneau */
.faq{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.faq__q{display:grid}
.faq__q button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;text-align:left;padding:1.2rem 0;border-top:1px solid var(--line-paper);font-family:var(--f-display);font-weight:700;font-size:clamp(1.15rem,1.8vw,1.5rem);letter-spacing:-.02em;color:var(--ink-soft);transition:color .25s,padding .4s var(--ease)}
.faq__q li:last-child button{border-bottom:1px solid var(--line-paper)}
.faq__q svg{flex:none;width:1.3rem;height:1.3rem;opacity:0;transition:.4s var(--spring)}
.faq__q button:hover{color:var(--navy)}
.faq__q button[aria-selected="true"]{color:var(--navy);padding-left:.8rem}
.faq__q button[aria-selected="true"] svg{opacity:1}
.faq__a{position:sticky;top:7rem;min-height:20rem;padding:clamp(1.6rem,3vw,2.8rem);border-radius:var(--r-lg);background:var(--navy);color:#fff}
.faq__a [role="tabpanel"]{animation:fadeUp .6s var(--ease)}
.faq__a [hidden]{display:none}
.faq__a h3{font-size:var(--fs-h3);margin-bottom:1rem;color:var(--yellow)}
.faq__a p{color:var(--on-navy-soft)}
.faq__a p+p{margin-top:.8rem}

.cta{position:relative;overflow:hidden}
.cta h2{font-size:clamp(2.8rem,10vw,9.5rem);font-weight:800;letter-spacing:-.05em;line-height:.9}
.cta__row{display:flex;flex-wrap:wrap;gap:2rem;justify-content:space-between;align-items:flex-end;margin-top:2.5rem}
.cta__star{position:absolute;right:-8vmax;top:-8vmax;width:34vmax;color:rgba(13,13,85,.08);animation:spin 80s linear infinite}
.cta .btn{--bg:var(--navy);--fg:#fff}
.cta .btn:hover{box-shadow:0 14px 28px -10px rgba(13,13,85,.6)}

.footer{padding:5rem 0 2rem;overflow:hidden}
.footer__grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:3rem;padding-bottom:4rem}
.footer h2{font-family:var(--f-body);font-size:.8rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:1.2rem}
.footer li+li{margin-top:.55rem}
.footer a{text-decoration:none;color:var(--on-navy-soft);transition:color .2s}
.footer a:hover{color:#fff;text-decoration:underline}
.footer__brand .logo{color:#fff}
.footer__brand p{max-width:30ch;margin-top:1.2rem;color:var(--on-navy-soft)}
.footer__social{display:flex;gap:.6rem;margin-top:1.5rem}
.footer__social a{width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:inset 0 0 0 1.5px var(--line-navy);transition:.3s var(--spring)}
.footer__social a:hover{background:var(--yellow);color:var(--navy);transform:translateY(-3px);box-shadow:none;text-decoration:none}
.footer__social svg{width:1.2rem;height:1.2rem}
.footer__giant{font-family:var(--f-display);font-weight:800;font-size:clamp(4rem,26.5vw,26rem);letter-spacing:-.06em;line-height:.8;text-transform:uppercase;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.2);white-space:nowrap;margin-inline:-.04em;user-select:none}
.footer__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:2rem;font-size:.88rem;color:var(--on-navy-soft)}

/* 10 — PAGES INTERNES ===================================================== */
.page-hero{position:relative;overflow:hidden;padding:11rem 0 5rem}
.page-hero::after{content:"";position:absolute;width:55vmax;height:55vmax;right:-20vmax;top:-22vmax;background:radial-gradient(closest-side,rgba(58,58,176,.7),transparent);z-index:-1}
.page-hero h1{font-size:clamp(2.4rem,6.6vw,6rem);font-weight:800;letter-spacing:-.04em;line-height:.98;max-width:16ch}
.page-hero .lead{margin-top:1.6rem}
.crumbs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem;font-size:.85rem;color:var(--on-navy-soft)}
.crumbs li+li::before{content:"/";margin-right:.5rem;opacity:.5}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:#fff;text-decoration:underline}
.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.prose{max-width:62ch}
.prose h2{font-size:clamp(1.8rem,3.2vw,2.8rem);margin:2.5rem 0 1rem}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:var(--fs-h3);margin:2rem 0 .6rem}
.prose p+p,.prose ul+p,.prose p+ul{margin-top:1rem}
.prose ul{display:grid;gap:.5rem}
.prose li{position:relative;padding-left:1.6rem}
.prose li::before{content:"";position:absolute;left:0;top:.5em;width:.55em;height:.8em;background:var(--navy);-webkit-mask:var(--star-mask) center/contain no-repeat;mask:var(--star-mask) center/contain no-repeat}
.prose a{font-weight:600}
.checks{display:grid;gap:.9rem}
.checks li{display:flex;gap:.9rem;align-items:flex-start;padding:1.1rem 1.3rem;border-radius:var(--r-md);background:var(--paper-2);font-weight:600}
.checks li::before{content:"";flex-shrink:0;width:.65em;height:.95em;margin-top:.3em;background:currentColor;-webkit-mask:var(--star-mask) center/contain no-repeat;mask:var(--star-mask) center/contain no-repeat}
.sibling{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.sibling--3{grid-template-columns:repeat(3,1fr)}
.sibling a{display:flex;flex-direction:column;justify-content:space-between;gap:3rem;min-height:11rem;padding:1.4rem;border-radius:var(--r-md);background:var(--navy);color:#fff;text-decoration:none;transition:transform .4s var(--spring),background .3s,color .3s}
.sibling a:hover{transform:translateY(-6px);background:var(--yellow);color:var(--navy)}
.sibling a[aria-current="page"]{background:var(--yellow);color:var(--navy);pointer-events:none}
.sibling b{font-family:var(--f-display);font-size:1.5rem;letter-spacing:-.03em}
.sibling small{opacity:.8}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}

/* contact */
.contact{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.form{display:grid;gap:1.1rem;padding:clamp(1.3rem,3vw,2.6rem);border-radius:var(--r-lg);background:#fff;box-shadow:0 30px 60px -30px rgba(13,13,85,.35)}
.form__fields{display:grid;gap:1.1rem}
.field{display:grid;gap:.4rem}
.field label,.field__l{font-weight:700;font-size:.9rem}
.field input,.field textarea,.field select{width:100%;padding:.95rem 1.1rem;border:1.5px solid var(--line-paper);border-radius:var(--r-sm);background:var(--paper);font:inherit;font-size:1rem;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:9rem;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(13,13,85,.12)}
.field .err{min-height:1.1em;font-size:.85rem;font-weight:600;color:var(--error)}
.field.is-bad input,.field.is-bad textarea{border-color:var(--error)}
.field .link-arrow{justify-self:start;font-size:.9rem}
.form__error{font-weight:600;color:var(--error)}
.form__note{font-size:.85rem;color:var(--ink-soft)}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.hp{position:absolute;left:-9999px}
.picked-list{display:flex;flex-wrap:wrap;gap:.5rem}
.picked-list:empty{display:none}
.pill{display:inline-flex;align-items:center;gap:.5rem;padding:.3rem .8rem .3rem .3rem;border-radius:999px;background:var(--navy);color:#fff;font-weight:600;font-size:.88rem}
.pill img{width:1.8rem;height:1.8rem;border-radius:50%;object-fit:cover}
.pill button{padding:.2rem .4rem;font-size:1.1rem;line-height:1;opacity:.7}
.pill button:hover{opacity:1}
.form__ok{display:none;padding:2rem 1rem;text-align:center}
.form__ok h2{font-size:2.2rem;margin:.8rem 0}
.form__ok svg{height:4rem;width:auto;margin:auto;color:var(--navy);animation:spin 6s linear infinite}
.form.is-sent .form__fields{display:none}
.form.is-sent .form__ok{display:block}
.details{display:grid;gap:1.4rem;margin-top:2rem}
.details dt{margin-bottom:.2rem;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--navy)}
.details dd{font-size:1.1rem}
.details a{font-weight:600}

.nf{min-height:100dvh;display:grid;place-items:center;padding:2rem;text-align:center}
.nf h1{font-size:clamp(7rem,28vw,22rem);font-weight:800;letter-spacing:-.07em;line-height:.8;color:var(--yellow)}
.nf p{margin:1.5rem auto 2rem;max-width:34ch}

/* utilitaires de mise en page */
.mt-2{margin-top:2rem}
.mt-3{margin-top:2.5rem}
.btn-row{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}
.h2--sm{font-size:clamp(1.6rem,2.8vw,2.6rem);margin-bottom:1.4rem}
.h2--md{font-size:clamp(1.8rem,3.2vw,2.8rem);margin-bottom:2rem}
.h2--lg{margin-bottom:3rem}
.section--flush{padding-top:0}
.poles--page{min-height:0;flex-wrap:wrap}
.poles--page .pole,.poles--page .pole.is-active{flex:1 1 15rem}
.cta-strip{padding-block:4rem}
.cta-strip__in{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:space-between;align-items:center}
.cta-strip .h2{max-width:20ch;margin:0}
.cta__lead{max-width:34ch}
.pole__text{margin-top:.8rem;opacity:.85}
.page-hero .eyebrow{margin-bottom:1.2rem}
.hero .eyebrow + h1{margin-top:1.4rem}
.process__sticky .lead{margin-top:1.4rem}
.sr-only + .statement{margin-top:1.6rem}

/* 11 — ANIMATIONS ========================================================= */
@property --sway{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes sway{0%,100%{--sway:-11deg}50%{--sway:11deg}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes float{50%{translate:0 -10px}}
@keyframes bob{50%{translate:0 -10px}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes ring{to{stroke-dashoffset:0}}
@keyframes dice{to{transform:rotate(360deg)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}}
@keyframes shimmer{to{background-position:-200% 0}}
.js [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0)*70ms)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js .hero [data-reveal]{transition-duration:.7s}

/* 12 — RESPONSIVE ========================================================= */
/* tablette et en dessous */
@media (max-width:1020px){
  .hero__grid{grid-template-columns:1fr}
  .fan{width:min(100%,420px);margin-top:1rem}

  .roster__stage{grid-template-columns:1fr;gap:1.5rem}
  .roster__stage .index{display:none}
  .roster__strip{display:flex;gap:.7rem;overflow-x:auto;scroll-snap-type:x proximity;margin-inline:calc(var(--gutter)*-1);padding:.4rem var(--gutter) 1rem;scrollbar-width:none}
  .roster__strip::-webkit-scrollbar{display:none}
  .roster[data-view="grid"] .roster__strip{display:none}
  .roster__strip button{flex:0 0 auto;width:4.4rem;text-align:center;scroll-snap-align:center;opacity:.55;transition:opacity .3s}
  .roster__strip img{width:4.4rem;height:4.4rem;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px transparent;transition:box-shadow .3s}
  .roster__strip button[aria-current="true"]{opacity:1}
  .roster__strip button[aria-current="true"] img{box-shadow:0 0 0 3px var(--yellow)}
  .roster__strip span{display:block;margin-top:.3rem;font-size:.72rem;font-weight:600;line-height:1.1}
  .stage{position:relative;top:0;grid-template-columns:1fr;justify-items:center}
  .phone{height:min(36rem,72dvh)}
  .stage__side{width:100%}
  .switch{grid-template-columns:repeat(3,1fr)}
  .switch button{flex-direction:column;align-items:flex-start;gap:.4rem;padding:.85rem}
  .switch small{display:none}
  .switch button:hover,.switch button[aria-pressed="true"]{transform:none}
  .roster__grid{grid-template-columns:repeat(3,1fr)}

  .poles{flex-direction:column;min-height:0}
  .pole,.pole.is-active{flex:none;gap:2rem}
  .pole__more{max-height:none;opacity:1;margin-top:1.2rem}
  .about-split,.process,.faq,.cols-2,.contact,.cm__grid{grid-template-columns:1fr}
  .pole__tag{position:static;align-self:flex-start;opacity:1!important}
  .process__sticky,.faq__a{position:static}
  .faq__a{min-height:0;margin:.2rem 0 1rem}
  .footer__grid{grid-template-columns:1fr 1fr}
  .footer__brand{grid-column:1/-1}
  .sibling,.sibling--3,.pillars{grid-template-columns:1fr 1fr}
}

/* menu burger */
@media (max-width:860px){
  .nav,.header__cta{display:none}
  .burger{display:grid}
}

/* téléphone */
@media (max-width:640px){
  :root{--section:4.2rem}
  .logos__list{gap:2.5rem;padding-right:2.5rem}
  .logos__list img{max-width:9rem;max-height:3.2rem}
  body{font-size:1rem}
  .header{inset:.6rem 0 auto}
  .header__bar{padding:.45rem .5rem .45rem 1rem}
  .logo b{font-size:1.15rem}
  .hero{padding:7.5rem 0 3rem;min-height:auto}
  .hero h1{font-size:clamp(2.5rem,12.5vw,3.4rem)}
  .hero__ctas .btn{flex:1 1 100%}
  .hero__meta{gap:.4rem 1.4rem;margin-top:2rem}
  .fan{margin-top:2rem}
  .page-hero{padding:8rem 0 3rem}
  .section-head{margin-bottom:2rem}
  .roster__head h2{max-width:none}
  .roster__tools{width:100%}
  .roster__tools .chip{flex:1 1 auto;justify-content:center}
  .phone-wrap{padding-inline:1rem}
  .phone__chip{display:none}
  .roster__grid{grid-template-columns:repeat(2,1fr);gap:.8rem}
  .tcard:nth-child(3n+2){margin-top:0}
  .tcard:nth-child(even){margin-top:1.4rem}
  .tcard .stage__links{opacity:1;transform:none}
  .tcard .social span{display:none}
  .tcard .social{padding:.6rem}
  .step{grid-template-columns:3rem 1fr;gap:1rem;padding:1.6rem 0}
  .step::before{font-size:2rem}
  .faq__q button{padding:1.1rem 0}
  .faq__q button[aria-selected="true"]{padding-left:0}
  .cta__row .btn{width:100%}
  .row-2{grid-template-columns:1fr}
  .footer{padding-top:3.5rem}
  .footer__grid{gap:2rem 1.5rem;padding-bottom:2.5rem}
  .footer__legal{flex-direction:column;gap:.4rem}
  .sibling,.sibling--3,.pillars{grid-template-columns:1fr}
  .sibling a{min-height:8rem;gap:1.5rem}
  .tray{gap:.6rem;padding-left:.8rem}
  .tray__txt small,.tray__clear{display:none}
  .tray .btn{padding:.8rem 1rem;font-size:.9rem}
}

/* écrans tactiles : pas de survol, on affiche les infos en permanence */
@media (hover:none){
  .fan__card span,.tcard .stage__links{opacity:1;transform:none}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;transform:none}
  .marquee__track,.logos__track,.phone,.phone__chip{animation:none}
}

.cm__grid .lead{margin-top:1.4rem}
.cm__grid .btn-row{margin-top:2rem}
