/* site.css : styles communs à toutes les pages */
:root{
  --night:#12061f; --plum:#2a0f4a; --pink:#ff3d8b; --sun:#ffa63d; --teal:#34e5e0; --ink:#fff3ea;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--night);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;line-height:1.6;overflow-x:hidden}
h1,h2{font-family:"Anton",Impact,sans-serif;font-weight:400;letter-spacing:.02em}

/* barre du haut */
.top{position:fixed;inset:0 0 auto 0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:14px 22px;background:linear-gradient(#12061fcc,transparent)}
.fs-btn{cursor:pointer;border:2px solid var(--ink);background:#12061f88;color:var(--ink);font:600 .95rem "DM Sans",sans-serif;padding:10px 18px;border-radius:40px;backdrop-filter:blur(6px);transition:background .2s,color .2s,border-color .2s}
.fs-btn:hover,.fs-btn:focus-visible{background:var(--ink);color:var(--night);outline:none}

/* boutons */
.actions{display:flex;gap:10px;align-items:center}
.cta{display:inline-block;text-decoration:none;font:600 1rem "DM Sans",sans-serif;padding:14px 32px;border-radius:50px;color:#fff;background:linear-gradient(90deg,var(--pink),var(--sun));box-shadow:0 8px 30px #ff3d8b88;transition:transform .2s,box-shadow .2s}
.cta:hover,.cta:focus-visible{transform:translateY(-3px) scale(1.04);box-shadow:0 14px 40px #ff3d8bbb;outline:none}
.cta.sm{padding:10px 18px;font-size:.95rem}

/* menu burger (3 traits -> verticaux) */
.brand{display:flex;align-items:center;gap:6px}
.burger{position:relative;flex:none;width:44px;height:44px;border:0;border-radius:12px;background:transparent;cursor:pointer}
.burger:focus-visible{outline:3px solid var(--teal)}
.burger i{position:absolute;left:10px;top:50%;width:24px;height:3px;margin-top:-1.5px;border-radius:3px;background:var(--ink);box-shadow:0 0 10px #ff3d8b88;transform:rotate(0deg) translateY(calc((var(--i) - 1) * 8px));transition:transform .5s cubic-bezier(.2,.9,.3,1.15),background .3s;transition-delay:calc(var(--i) * 45ms)}
.burger.open i{transform:rotate(90deg) translateY(calc((var(--i) - 1) * 8px));background:var(--pink)}

/* fenêtre paramètres */
body.set-open{overflow:hidden}
#settings{position:fixed;inset:0;z-index:18;display:grid;place-items:center;padding:84px 16px 16px;background:#07030fb3;backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
#settings.open{opacity:1;visibility:visible}
.set-win{width:min(520px,100%);max-height:100%;overflow-y:auto;padding:26px 26px 22px;border-radius:26px;background:linear-gradient(160deg,#2a0f4aee,#12061ff2);border:1px solid #ffffff26;box-shadow:0 30px 90px #000a;transform:translateY(18px) scale(.96);transition:transform .4s cubic-bezier(.2,.9,.3,1.1)}
#settings.open .set-win{transform:none}
.set-head{display:flex;justify-content:space-between;align-items:center}
.set-head h2{font-size:2rem}
.set-close{width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;background:#ffffff1f;color:#fff;font-size:1.1rem;transition:background .2s}
.set-close:hover,.set-close:focus-visible{background:#ffffff44;outline:none}
.set-sec{margin-top:22px}
.set-sec>small{display:block;margin-bottom:10px;color:var(--teal);font-size:.75rem;letter-spacing:.2em;text-transform:uppercase}
.seg{display:flex;gap:6px;padding:5px;border-radius:40px;background:#ffffff14}
.seg button{flex:1;border:0;cursor:pointer;padding:10px 14px;border-radius:30px;background:transparent;color:var(--ink);font:600 .95rem "DM Sans",sans-serif;transition:background .25s,color .25s}
.seg button[aria-pressed="true"]{background:linear-gradient(90deg,var(--pink),var(--sun));color:#fff}
.row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid #ffffff14}
.row b{display:block;font-weight:600}
.row span{display:block;font-size:.85rem;opacity:.65}
.sw{flex:none;position:relative;width:48px;height:28px;border:0;border-radius:28px;cursor:pointer;background:#ffffff2e;transition:background .3s}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .3s cubic-bezier(.2,.9,.3,1.2)}
.sw[aria-checked="true"]{background:linear-gradient(90deg,var(--pink),var(--sun))}
.sw[aria-checked="true"]::after{transform:translateX(20px)}
.sw:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.vol{-webkit-appearance:none;appearance:none;flex:none;width:min(190px,48%);height:6px;border-radius:6px;cursor:pointer;outline:none;background:linear-gradient(90deg,var(--pink),var(--sun)) 0 0/var(--v,30%) 100% no-repeat,#ffffff2e}
.vol::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border:0;border-radius:50%;background:#fff;box-shadow:0 2px 8px #000a;transition:transform .15s}
.vol::-webkit-slider-thumb:hover{transform:scale(1.15)}
.vol::-moz-range-thumb{width:20px;height:20px;border:0;border-radius:50%;background:#fff;box-shadow:0 2px 8px #000a}
.vol:focus-visible{outline:3px solid var(--teal);outline-offset:6px}
.set-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.set-btn{cursor:pointer;border:1.5px solid #ffffff44;background:transparent;color:var(--ink);font:600 .9rem "DM Sans",sans-serif;padding:9px 16px;border-radius:30px;transition:background .2s,border-color .2s}
.set-btn:hover,.set-btn:focus-visible{background:#ffffff1f;border-color:#fff;outline:none}
.soon{margin-top:22px;padding:14px 16px;border:1px dashed #ffffff33;border-radius:16px;font-size:.9rem;opacity:.65;text-align:center}

/* petits boutons (calendrier, partager) */
.fs-btn.sm{padding:8px 15px;font-size:.85rem}
.fs-btn svg{width:15px;height:15px;margin-right:7px;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mini{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}

/* lecteur de trailer */
#vid{position:fixed;inset:0;z-index:80;display:grid;place-content:center;justify-items:center;gap:16px;background:#07030ff2;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
#vid.open{opacity:1;visibility:visible}
.vid-box{width:min(92vw,1100px);aspect-ratio:16/9;overflow:hidden;border-radius:14px;background:#000;box-shadow:0 30px 100px #000}
.vid-frame,.vid-box iframe{width:100%;height:100%;border:0;display:block}
.vid-close{position:absolute;top:18px;right:18px;width:48px;height:48px;border:0;border-radius:50%;cursor:pointer;background:#ffffff1f;color:#fff;font-size:1.2rem;transition:background .2s}
.vid-close:hover,.vid-close:focus-visible{background:#ffffff44;outline:none}
.vid-yt{color:var(--teal);font-size:.9rem;letter-spacing:.08em;text-decoration:none}
.vid-yt:hover,.vid-yt:focus-visible{text-decoration:underline;outline:none}

/* message court */
#toast{position:fixed;left:50%;bottom:26px;z-index:90;transform:translate(-50%,20px);padding:12px 20px;border-radius:40px;background:#1b0a33f2;border:1px solid #ffffff2e;box-shadow:0 12px 40px #000a;font-size:.92rem;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
#toast.show{opacity:1;transform:translate(-50%,0)}

/* navigation (en-tête) */
.nav{display:none;align-items:center;gap:4px;margin-left:6px}
@media (min-width:860px){.nav{display:flex}}
.nav a{padding:8px 14px;border-radius:30px;color:#ffffffb3;text-decoration:none;font:600 .92rem "DM Sans",sans-serif;transition:color .2s,background .2s}
.nav a:hover,.nav a:focus-visible{color:#fff;background:#ffffff1a;outline:none}
.nav a[aria-current="page"]{color:#fff;background:#ffffff1f}
.set-nav{display:flex;flex-wrap:wrap;gap:8px}
.set-nav a{padding:9px 16px;border:1.5px solid #ffffff33;border-radius:30px;color:var(--ink);text-decoration:none;font:600 .9rem "DM Sans",sans-serif;transition:background .2s,border-color .2s}
.set-nav a:hover,.set-nav a:focus-visible{background:#ffffff1f;border-color:#fff;outline:none}
.set-nav a[aria-current="page"]{border-color:transparent;background:linear-gradient(90deg,var(--pink),var(--sun));color:#fff}
@media (max-width:520px){.top .cta{display:none}}

/* pages intérieures (FAQ, Lancement) */
body.inner .top{background:#12061fe8;backdrop-filter:blur(10px);border-bottom:1px solid #ffffff14}
.foot{padding:36px 20px;text-align:center;font-size:.85rem;color:#ffffff99;border-top:1px solid #ffffff14}

/* pages intérieures : mise en page commune */
body.inner{padding-top:72px}
[hidden]{display:none!important}
.wrap{max-width:900px;margin:0 auto;padding:0 20px}
.p-hero{padding:8vh 0 3vh}
.eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--teal)}
.p-hero h1{margin:8px 0 14px;font-size:clamp(2.6rem,7vw,4.6rem);line-height:1}
.lead{max-width:60ch;color:#ffffffb3;font-size:1.05rem}
.sec{padding:5vh 0}
.sec>h2{margin-bottom:6px;font-size:clamp(1.7rem,4vw,2.3rem)}
.sec>.sub{max-width:62ch;margin-bottom:22px;color:#ffffffa6}
.panel{padding:26px;border:1px solid #ffffff1f;border-radius:18px;background:#ffffff08}
.go{display:flex;flex-wrap:wrap;gap:14px;padding:6vh 0 10vh}
.go a{flex:1 1 260px;display:block;padding:22px 24px;border:1px solid #ffffff1f;border-radius:18px;background:#ffffff08;color:var(--ink);text-decoration:none;transition:border-color .2s,background .2s}
.go a:hover,.go a:focus-visible{border-color:var(--pink);background:#ffffff10;outline:none}
.go b{display:block;font-size:1.05rem}
.go span{display:block;margin-top:2px;font-size:.9rem;color:#ffffffa6}

html{scroll-padding-top:84px}