@font-face{font-family:'Lilita One';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/lilita-one.woff2) format('woff2')}
@font-face{font-family:'Urbanist';font-style:normal;font-weight:400 800;font-display:swap;src:url(/assets/fonts/urbanist.woff2) format('woff2')}
:root{
  --nuit:#160c2c;--nuit-2:#21123f;--nuit-3:#2e1a55;
  --lavande:#efeaff;--lavande-2:#e1d8ff;--glace:#faf8ff;
  --encre:#1b1036;--encre-2:#51477a;
  --rouge:#ff3d6e;--rouge-f:#3a0d2b;--bleu:#2f8cff;--bleu-f:#0c1b4d;
  --citron:#c8f135;--citron-2:#e3ff7a;--orange:#ff9f1c;
  --camp:var(--rouge);--camp-f:var(--rouge-f);
  --titre:'Lilita One','Arial Rounded MT Bold','Trebuchet MS',sans-serif;
  --texte:'Urbanist','Avenir Next','Segoe UI',sans-serif;
  --large:1200px;--entete:74px;--ressort:cubic-bezier(.34,1.56,.64,1);--douce:cubic-bezier(.22,.61,.36,1);
}
body.camp-bleu{--camp:var(--bleu);--camp-f:var(--bleu-f)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--entete) + 14px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--nuit);color:#fff;font-family:var(--texte);font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg,canvas{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
.large{width:min(var(--large),100% - 40px);margin-inline:auto}
.saut{position:absolute;left:12px;top:-60px;z-index:300;background:var(--citron);color:var(--encre);padding:10px 16px;font-weight:700;border-radius:12px}
.saut:focus{top:10px}
:focus-visible{outline:3px solid var(--citron);outline-offset:3px;border-radius:8px}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 26px;border:0;border-radius:18px;background:var(--citron);color:var(--encre);font-family:var(--titre);font-size:19px;letter-spacing:.01em;text-decoration:none;cursor:pointer;box-shadow:inset 0 -5px 0 rgba(0,0,0,.18),inset 0 2px 0 rgba(255,255,255,.6),0 10px 24px -10px rgba(200,241,53,.7);transition:transform .35s var(--ressort),box-shadow .3s}
.btn::after{content:"";position:absolute;left:14px;top:7px;width:34%;height:7px;border-radius:9px;background:rgba(255,255,255,.55);pointer-events:none}
.btn:hover{transform:translateY(-2px) scale(1.03)}
.btn:active{transform:scaleX(1.06) scaleY(.92)}
.btn--camp{background:var(--camp);color:#fff;box-shadow:inset 0 -5px 0 rgba(0,0,0,.22),inset 0 2px 0 rgba(255,255,255,.35),0 10px 24px -10px var(--camp)}
.btn--clair{background:var(--glace);color:var(--encre);box-shadow:inset 0 -5px 0 rgba(27,16,54,.12),inset 0 2px 0 #fff,0 10px 24px -14px rgba(27,16,54,.5)}
.lien{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-decoration:none;border-bottom:2px solid var(--citron);padding-bottom:2px}
.entete{position:fixed;inset:0 0 auto 0;z-index:100;height:var(--entete);transition:background .4s,box-shadow .4s}
.entete.colle{background:rgba(22,12,44,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(255,255,255,.08)}
.entete__in{width:min(var(--large),100% - 40px);margin:0 auto;height:100%;display:flex;align-items:center;gap:26px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--titre);font-size:25px;line-height:1;letter-spacing:.01em}
.logo__bille{position:relative;width:30px;height:30px;flex:none}
.logo__bille i{position:absolute;width:20px;height:20px;border-radius:50%;box-shadow:inset -3px -4px 0 rgba(0,0,0,.18)}
.logo__bille i::after{content:"";position:absolute;left:4px;top:3px;width:7px;height:5px;border-radius:50%;background:rgba(255,255,255,.75)}
.logo__bille i:first-child{left:0;top:0;background:var(--rouge)}
.logo__bille i:last-child{right:0;bottom:0;background:var(--bleu)}
.logo small{font-family:var(--texte);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--citron);margin-left:2px}
.menu{display:flex;gap:24px;margin-left:auto}
.menu a{font-weight:700;font-size:15px;text-decoration:none;color:rgba(255,255,255,.82);transition:color .2s}
.menu a:hover{color:var(--citron)}
.entete__tel{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:15px;text-decoration:none;white-space:nowrap}
.entete__tel svg{width:18px;height:18px;flex:none}
.entete .btn{min-height:44px;padding:10px 18px;font-size:17px}
.burger{display:none;flex:none;margin-left:auto;width:46px;height:46px;border:0;border-radius:14px;background:rgba(255,255,255,.1);cursor:pointer;position:relative}
.burger span{position:absolute;left:12px;right:12px;height:2px;border-radius:2px;background:#fff;transition:transform .35s var(--douce)}
.burger span:first-child{top:18px}.burger span:last-child{top:26px}
.menu-ouvert .burger span:first-child{transform:translateY(4px) rotate(45deg)}
.menu-ouvert .burger span:last-child{transform:translateY(-4px) rotate(-45deg)}
@media (max-width:1080px){.menu{gap:16px}.entete__tel span{display:none}}
@media (max-width:900px){
  .menu{position:fixed;inset:var(--entete) 0 auto 0;height:calc(100dvh - var(--entete));flex-direction:column;gap:4px;padding:26px 24px;background:rgba(22,12,44,.98);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .3s,transform .4s var(--douce),visibility .3s}
  .menu a{font-family:var(--titre);font-weight:400;font-size:32px;color:#fff;padding:6px 0}
  .menu-ouvert .menu{opacity:1;visibility:visible;transform:none}
  .burger{display:block}
  .entete .btn{display:none}
  .entete__tel{margin-left:0;width:46px;height:46px;justify-content:center;border-radius:14px;background:var(--citron);color:var(--encre)}
  .entete__in{gap:10px}
}
.hero{position:relative;isolation:isolate;min-height:max(100svh,860px);padding:calc(var(--entete) + clamp(40px,5vw,70px)) 0 200px;overflow:hidden;background:linear-gradient(90deg,var(--rouge-f) 0 50%,var(--bleu-f) 50% 100%)}
.hero::before,.hero::after{content:"";position:absolute;top:-10%;bottom:-10%;width:60%;z-index:-2;pointer-events:none;transition:opacity .8s}
.hero::before{left:-10%;background:radial-gradient(closest-side,rgba(255,61,110,.55),transparent 75%);opacity:.75}
.hero::after{right:-10%;background:radial-gradient(closest-side,rgba(47,140,255,.5),transparent 75%);opacity:.45}
body.camp-bleu .hero::before{opacity:.4}
body.camp-bleu .hero::after{opacity:.8}
.terrain{position:absolute;inset:0;z-index:-1;pointer-events:none}
.terrain svg{width:100%;height:100%}
.billes{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none}
.hero__in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,420px);gap:clamp(30px,5vw,70px);align-items:start}
.equipes{display:flex;align-items:center;gap:12px;margin-bottom:22px;font-weight:800;font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.equipes b{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:12px;background:rgba(255,255,255,.08)}
.equipes b i{width:14px;height:14px;border-radius:50%;box-shadow:inset -2px -3px 0 rgba(0,0,0,.2)}
.equipes em{font-style:normal;font-family:var(--titre);font-size:20px;color:var(--citron);letter-spacing:0}
.hero h1{font-family:var(--titre);font-weight:400;font-size:clamp(52px,6.1vw,88px);line-height:.92;letter-spacing:-.005em}
.hero h1 .l{display:block}
.hero h1 .l2{color:var(--citron);text-shadow:0 6px 0 rgba(0,0,0,.18)}
.hero h1 .mot{display:inline-block;transform-origin:50% 100%}
.js .hero h1 .mot{opacity:0;transform:scale(.2,.2) translateY(30%)}
.pret .hero h1 .mot{animation:splat .9s var(--ressort) forwards;animation-delay:calc(.15s + var(--i) * .12s)}
@keyframes splat{0%{opacity:0;transform:scale(.2) translateY(30%)}55%{opacity:1;transform:scale(1.18,.82) translateY(0)}75%{transform:scale(.94,1.08)}100%{opacity:1;transform:none}}
.hero__sous{max-width:540px;margin-top:24px;font-size:clamp(18px,1.6vw,21px);color:rgba(255,255,255,.88)}
.hero__sous strong{color:#fff}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:30px}
.monte{opacity:0;transform:translateY(18px)}
.pret .monte{animation:monte .8s var(--douce) forwards;animation-delay:var(--d,.6s)}
@keyframes monte{to{opacity:1;transform:none}}
.grosse-bille{position:absolute;z-index:2;left:50%;bottom:34px;margin-left:clamp(-170px,-12vw,-130px);width:clamp(240px,22vw,320px);aspect-ratio:1;animation:respire 7s ease-in-out infinite}
.grosse-bille__in{position:absolute;inset:0;overflow:hidden;border-radius:52% 48% 50% 50%/50% 52% 48% 50%;box-shadow:0 0 0 6px rgba(200,241,53,.85),0 30px 60px -20px rgba(0,0,0,.6);animation:gelee 6s ease-in-out infinite}
.grosse-bille__in img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}
.grosse-bille__in::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(38% 26% at 30% 20%,rgba(255,255,255,.75),rgba(255,255,255,0) 70%),radial-gradient(70% 70% at 70% 80%,rgba(200,241,53,0),rgba(200,241,53,.2) 80%),radial-gradient(circle at 50% 50%,transparent 58%,rgba(22,12,44,.35) 100%)}
.grosse-bille__etiq{position:absolute;right:-18px;top:14%;z-index:3;padding:10px 14px;border-radius:16px;background:var(--glace);color:var(--encre);font-family:var(--titre);font-size:17px;line-height:1.05;transform:rotate(6deg);box-shadow:0 12px 24px -12px rgba(0,0,0,.5)}
.grosse-bille__etiq b{display:block;font-size:26px;color:var(--rouge)}
@keyframes gelee{0%,100%{border-radius:52% 48% 50% 50%/50% 52% 48% 50%}33%{border-radius:47% 53% 46% 54%/54% 46% 53% 47%}66%{border-radius:54% 46% 52% 48%/47% 54% 46% 53%}}
@keyframes respire{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.qform{position:relative;padding:0 22px 22px;border-radius:26px;background:rgba(18,9,38,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 0 0 1px rgba(255,255,255,.1),0 30px 60px -28px rgba(0,0,0,.8);overflow:hidden}
.qform::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:var(--camp);transition:background .5s}
.qform__t{padding:26px 0 4px;font-family:var(--titre);font-weight:400;font-size:28px;line-height:1}
.qform__p{font-size:15px;color:rgba(255,255,255,.7)}
.camp{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0 4px;padding:5px;border-radius:18px;background:rgba(255,255,255,.07)}
.camp button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;border:0;border-radius:14px;background:transparent;color:rgba(255,255,255,.75);font-weight:800;font-size:15px;cursor:pointer;transition:background .35s,color .35s,transform .35s var(--ressort)}
.camp button i{width:16px;height:16px;border-radius:50%;box-shadow:inset -2px -3px 0 rgba(0,0,0,.2)}
.camp button[aria-pressed="true"]{background:#fff;color:var(--encre);transform:scale(1.02)}
.qform__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.qf{display:flex;flex-direction:column;gap:5px;min-width:0}
.qf--l{grid-column:1/-1}
.qf label{font-size:12.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.qf input,.qf select{width:100%;min-width:0;min-height:48px;padding:10px 14px;border:2px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.06);color:#fff;font-size:17px;font-weight:600;appearance:none;-webkit-appearance:none;transition:border-color .25s,background .25s}
.qf select{background-image: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='%23c8f135' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px 8px;padding-right:34px}
.qf select option{background:var(--nuit-2);color:#fff}
.qf input:focus,.qf select:focus{outline:0;border-color:var(--citron);background:rgba(255,255,255,.1)}
.qf input::placeholder{color:rgba(255,255,255,.38)}
.qf--err input,.qf--err select{border-color:var(--rouge)}
.qform .btn{width:100%;margin-top:16px}
.qform__alt{display:block;width:100%;margin-top:10px;padding:6px;border:0;background:none;color:rgba(255,255,255,.78);font-weight:700;font-size:15px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.qform__ok{margin-top:12px;padding:12px 14px;border-radius:14px;background:rgba(200,241,53,.14);color:var(--citron-2);font-weight:600;font-size:15px}
.section{position:relative;padding:clamp(90px,11vw,150px) 0}
.lavande{background:var(--lavande);color:var(--encre)}
.points{background-color:var(--lavande);background-image:radial-gradient(circle at 12px 12px,rgba(47,140,255,.16) 3px,transparent 3.5px),radial-gradient(circle at 36px 36px,rgba(255,61,110,.14) 3px,transparent 3.5px);background-size:48px 48px;color:var(--encre)}
.nuit{background:var(--nuit);color:#fff}
.violet{background:radial-gradient(120% 80% at 50% 0%,var(--nuit-3),var(--nuit) 70%);color:#fff}
.titre{font-family:var(--titre);font-weight:400;font-size:clamp(40px,5.4vw,74px);line-height:.95;letter-spacing:-.005em}
.titre .c{color:var(--rouge)}
.titre .b{color:var(--bleu)}
.nuit .titre .v,.violet .titre .v{color:var(--citron)}
.lavande .titre .v,.points .titre .v{color:var(--bleu)}
.chapo{max-width:640px;margin-top:20px;font-size:clamp(18px,1.6vw,21px);color:var(--encre-2)}
.nuit .chapo,.violet .chapo{color:rgba(255,255,255,.78)}
.centre{text-align:center}.centre .chapo{margin-inline:auto}
.apparait{opacity:0;transform:translateY(24px) scale(.98);transition:opacity .8s var(--douce),transform .9s var(--ressort)}
.apparait.vu{opacity:1;transform:none}
.goutte{position:absolute;left:0;right:0;height:60px;pointer-events:none}
.goutte svg{width:100%;height:100%}
.goutte--haut{top:-59px}
.impact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,90px);align-items:center}
.cible{position:relative;aspect-ratio:1;max-width:520px;width:100%;margin-inline:auto}
.cible svg{width:100%;height:100%;overflow:visible}
.cible .tir{opacity:0}
.cible .eclat{opacity:0;transform-box:fill-box;transform-origin:center}
.cible .mouille{opacity:0}
.cible .eclair{opacity:0;transform-box:fill-box;transform-origin:center}
.cible.joue .tir{animation:tir .55s cubic-bezier(.55,0,.9,.4) forwards}
.cible.joue .eclat{animation:eclat .9s var(--douce) .52s forwards}
.cible.joue .mouille{animation:mouille 2.6s ease .52s forwards}
.cible.joue .eclair{animation:eclair .5s ease-out .5s forwards}
.cible.joue .tshirt{animation:secoue .45s var(--ressort) .5s}
@keyframes tir{0%{opacity:1;transform:translate(-330px,-120px) scale(.6)}94%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(0,0) scale(1.3)}}
@keyframes eclat{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(.3)}}
@keyframes mouille{0%{opacity:.55}100%{opacity:0}}
@keyframes eclair{0%{opacity:.9;transform:scale(.2)}100%{opacity:0;transform:scale(1.6)}}
@keyframes secoue{0%{transform:none}30%{transform:translateX(6px) rotate(1.2deg)}60%{transform:translateX(-3px) rotate(-.6deg)}100%{transform:none}}
.tshirt{transform-box:fill-box;transform-origin:50% 0}
.cible__note{position:absolute;right:0;bottom:6%;padding:12px 16px;border-radius:18px;background:var(--glace);color:var(--encre);font-family:var(--titre);font-size:21px;line-height:1.05;box-shadow:0 18px 30px -18px rgba(27,16,54,.6);transform:rotate(-4deg) scale(.6);opacity:0;transition:transform .6s var(--ressort) 1.6s,opacity .4s ease 1.6s}
.cible.joue .cible__note{transform:rotate(-4deg);opacity:1}
.cible__note b{color:#1fae5a}
.rejouer{margin-top:20px}
.faits{margin-top:34px;display:grid;gap:18px}
.fait{display:grid;grid-template-columns:58px 1fr;gap:16px;align-items:center}
.fait__b{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-family:var(--titre);font-size:22px;color:#fff;box-shadow:inset -5px -7px 0 rgba(0,0,0,.18),inset 4px 5px 0 rgba(255,255,255,.35)}
.fait h3{font-family:var(--titre);font-weight:400;font-size:24px;line-height:1.1}
.fait p{font-size:17px;color:var(--encre-2)}
.bille-labo{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(40px,6vw,90px);align-items:center}
.labo{position:relative;padding:34px;border-radius:32px;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02));box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.labo__scene{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:end}
.labo__col{text-align:center}
.labo__col small{display:block;margin-top:14px;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.labo__col b{display:block;font-family:var(--titre);font-weight:400;font-size:44px;line-height:1;color:var(--citron)}
.verre-eau{position:relative;height:230px;border:3px solid rgba(255,255,255,.55);border-top:0;border-radius:0 0 26px 26px;overflow:hidden}
.verre-eau::before{content:"";position:absolute;inset:auto 0 0 0;height:72%;background:linear-gradient(180deg,rgba(47,140,255,.32),rgba(47,140,255,.55));transform:translateY(100%);transition:transform 1.6s var(--douce)}
.labo.vu .verre-eau::before{transform:none}
.mini-bille{position:absolute;left:50%;bottom:24px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff 0 12%,var(--orange) 34%,#e2700a 100%);transform:translateX(-50%)}
.mini-bille--seche{width:16px;height:16px;background:radial-gradient(circle at 34% 30%,#fff7d6 0 10%,#e0b04a 40%,#a87418 100%)}
.mini-bille--gonfle{width:16px;height:16px;opacity:.95;box-shadow:inset -4px -6px 0 rgba(0,0,0,.12);transition:width 3.2s var(--ressort) 1s,height 3.2s var(--ressort) 1s}
.labo.vu .mini-bille--gonfle{width:64px;height:64px}
.regle{display:flex;justify-content:space-between;margin-top:26px;padding-top:10px;border-top:2px solid rgba(255,255,255,.5);font-weight:700;font-size:12px;color:rgba(255,255,255,.6)}
.regle span{position:relative}
.regle span::before{content:"";position:absolute;left:50%;top:-12px;width:2px;height:8px;background:rgba(255,255,255,.5)}
.labo__note{margin-top:18px;font-size:15px;color:rgba(255,255,255,.65);text-align:center}
.listes{margin-top:30px;display:grid;gap:14px}
.listes li{position:relative;padding-left:34px;font-size:18px;color:rgba(255,255,255,.86)}
.listes li::before{content:"";position:absolute;left:0;top:.2em;width:20px;height:20px;border-radius:50%;background:var(--citron);box-shadow:inset -3px -4px 0 rgba(0,0,0,.18),inset 2px 3px 0 rgba(255,255,255,.55)}
.listes li:nth-child(2)::before{background:var(--orange)}
.listes li:nth-child(3)::before{background:var(--rouge)}
.listes li:nth-child(4)::before{background:var(--bleu)}
.formules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin-top:64px;align-items:end}
.reservoir{position:relative;display:flex;flex-direction:column;padding:0 22px 24px;border-radius:30px;background:var(--glace);box-shadow:0 30px 50px -36px rgba(27,16,54,.55),inset 0 0 0 1px rgba(27,16,54,.06)}
.reservoir__tank{position:relative;width:118px;height:118px;margin:-46px auto 8px;border-radius:50% 50% 46% 46%;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.95) 0 9%,rgba(255,255,255,.35) 22%,rgba(255,255,255,.12) 60%);box-shadow:inset 0 0 0 3px rgba(27,16,54,.14),inset -10px -12px 0 rgba(27,16,54,.05);overflow:hidden}
.reservoir__tank canvas{position:absolute;inset:0;width:100%;height:100%}
.reservoir__tank::after{content:"";position:absolute;left:20%;top:12%;width:26%;height:14%;border-radius:50%;background:rgba(255,255,255,.85);z-index:2}
.reservoir h3{font-family:var(--titre);font-weight:400;font-size:27px;line-height:1.05;text-align:center}
.reservoir__prix{margin:10px 0 4px;text-align:center;font-family:var(--titre);font-size:46px;line-height:1;color:var(--camp)}
.reservoir__prix small{font-family:var(--texte);font-weight:700;font-size:15px;color:var(--encre-2)}
.reservoir__qui{text-align:center;font-weight:700;font-size:15px;color:var(--encre-2)}
.reservoir ul{margin:16px 0 20px;display:grid;gap:8px;font-size:16px;color:var(--encre-2)}
.reservoir li{position:relative;padding-left:22px}
.reservoir li::before{content:"";position:absolute;left:0;top:.42em;width:10px;height:10px;border-radius:50%;background:var(--camp)}
.reservoir .btn{margin-top:auto;font-size:17px;min-height:48px}
.reservoir--vedette{background:var(--encre);color:#fff;transform:translateY(-14px)}
.reservoir--vedette .reservoir__qui,.reservoir--vedette ul{color:rgba(255,255,255,.75)}
.reservoir--vedette .reservoir__prix small{color:rgba(255,255,255,.7)}
.reservoir--vedette .reservoir__tank{background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.7) 0 9%,rgba(255,255,255,.18) 24%,rgba(255,255,255,.05) 60%);box-shadow:inset 0 0 0 3px rgba(255,255,255,.25)}
.reservoir__pastille{position:absolute;top:16px;right:16px;padding:5px 10px;border-radius:10px;background:var(--citron);color:var(--encre);font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.modes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin-top:60px}
.mode{border-radius:28px;padding:20px 20px 24px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);transition:transform .4s var(--ressort),background .3s}
.mode:hover{transform:translateY(-6px) rotate(-.6deg);background:rgba(255,255,255,.1)}
.mode__carte{aspect-ratio:4/3;border-radius:18px;background:linear-gradient(90deg,rgba(255,61,110,.18) 0 50%,rgba(47,140,255,.18) 50%);overflow:hidden}
.mode__carte svg{width:100%;height:100%}
.mode__num{display:block;margin-top:16px;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--citron)}
.mode h3{margin-top:4px;font-family:var(--titre);font-weight:400;font-size:27px;line-height:1.05}
.mode p{margin-top:8px;font-size:16px;color:rgba(255,255,255,.72)}
.mode .pion{transition:transform 1.4s var(--douce)}
.mode .zone{transform-box:fill-box;transform-origin:center;transition:transform 2.2s var(--douce)}
.modes.vu .m1 .pr{transform:translateX(26px)}.modes.vu .m1 .pb{transform:translateX(-26px)}
.modes.vu .m2 .zone{transform:scale(.55)}
.modes.vu .m2 .pion{transform:translate(var(--x),var(--y))}
.modes.vu .m3 .pion{transform:translate(var(--x),var(--y))}
.modes.vu .m4 .trait{stroke-dashoffset:0}
.mode .trait{stroke-dasharray:300;stroke-dashoffset:300;transition:stroke-dashoffset 2s var(--douce) .3s}
.domicile{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(40px,6vw,90px);align-items:center}
.jardin{position:relative;border-radius:34px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(27,16,54,.6)}
.jardin svg{width:100%;height:auto}
.jardin .obj{opacity:0;transform-box:fill-box;transform-origin:center bottom;transform:scale(.3)}
.jardin.vu .obj{animation:pose .7s var(--ressort) forwards;animation-delay:calc(.2s + var(--k) * .12s)}
@keyframes pose{to{opacity:1;transform:none}}
.kit{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kit li{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--glace);font-weight:700;font-size:16px;box-shadow:inset 0 0 0 1px rgba(27,16,54,.06)}
.kit li svg{width:30px;height:30px;flex:none}
.galerie{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,250px));gap:16px;margin-top:56px}
.galerie figure{position:relative;overflow:hidden;border-radius:30px}
.galerie figure:first-child{grid-row:span 2}
.galerie img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--douce)}
.galerie figure:hover img{transform:scale(1.05)}
.galerie figcaption{position:absolute;left:14px;bottom:14px;padding:6px 12px;border-radius:12px;background:rgba(22,12,44,.78);color:#fff;font-weight:700;font-size:14px}
.occasions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:60px}
.occasion{position:relative;padding:28px 26px 30px;border-radius:30px;background:var(--glace);color:var(--encre);overflow:hidden;box-shadow:0 26px 46px -34px rgba(27,16,54,.6)}
.occasion__icone{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;margin-bottom:18px}
.occasion__icone svg{width:34px;height:34px}
.occasion h3{font-family:var(--titre);font-weight:400;font-size:28px;line-height:1.05}
.occasion p{margin-top:10px;font-size:16.5px;color:var(--encre-2)}
.occasion .lien{margin-top:18px;border-color:var(--camp)}
.occasion::after{content:"";position:absolute;right:-40px;bottom:-40px;width:120px;height:120px;border-radius:50%;opacity:.16}
.occasion:nth-child(1)::after{background:var(--rouge)}.occasion:nth-child(2)::after{background:var(--bleu)}.occasion:nth-child(3)::after{background:var(--orange)}
.resa{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,6vw,90px);align-items:start}
.resa .qform{background:var(--nuit-2)}
.contact-l{margin-top:30px;display:grid;gap:14px}
.contact-l a,.contact-l p{display:flex;align-items:center;gap:14px;font-weight:700;font-size:19px;text-decoration:none}
.contact-l svg{width:44px;height:44px;flex:none;padding:10px;border-radius:14px;background:rgba(255,255,255,.08)}
.faq{max-width:860px;margin:56px auto 0}
.faq details{border-radius:22px;background:var(--glace);margin-bottom:12px;box-shadow:inset 0 0 0 1px rgba(27,16,54,.06)}
.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;font-family:var(--titre);font-size:22px;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:30px;height:30px;border-radius:50%;background:var(--camp);position:relative;transition:transform .4s var(--ressort)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:8px;right:8px;top:14px;height:2px;border-radius:2px;background:#fff}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i{transform:rotate(135deg)}
.faq details p{padding:0 24px 22px;font-size:17px;color:var(--encre-2)}
.infos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px}
.info{padding:26px;border-radius:28px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.info small{display:block;margin-bottom:10px;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--citron)}
.info p,.info a{font-size:19px;font-weight:600;text-decoration:none}
.villes{margin-top:44px;text-align:center;font-size:18px;line-height:2;color:rgba(255,255,255,.8)}
.villes b{color:#fff}
.villes i{display:inline-block;width:9px;height:9px;margin:0 12px;border-radius:50%;vertical-align:middle;background:var(--citron)}
.villes i:nth-of-type(3n+2){background:var(--rouge)}.villes i:nth-of-type(3n){background:var(--bleu)}
.pied{background:#0e0720;padding:56px 0 40px;color:rgba(255,255,255,.7);font-size:15px}
.pied__haut{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.1)}
.pied nav{display:flex;flex-wrap:wrap;gap:20px}
.pied nav a{text-decoration:none;font-weight:700}
.pied nav a:hover{color:var(--citron)}
.pied__bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;padding-top:22px;font-size:14px}
.pied__bas a{text-decoration:none}
.appel{display:none}
@media (max-width:1060px){
  .formules{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:70px}
  .reservoir--vedette{transform:none}
  .modes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .hero{padding-bottom:0;background:linear-gradient(90deg,var(--rouge-f) 0 50%,var(--bleu-f) 50% 100%)}
  .hero__in{grid-template-columns:1fr;row-gap:26px}
  .hero__txt{display:contents}
  .equipes{order:0;margin-bottom:0}
  .hero h1{order:1}
  .qform--hero{order:2}
  .hero__sous{order:3;margin-top:0}
  .hero__cta{order:4;margin-top:0}
  .grosse-bille{position:relative;left:auto;bottom:auto;z-index:2;margin:30px auto 40px;width:min(64vw,280px)}
  .hero{min-height:0}
  .impact,.bille-labo,.domicile,.resa{grid-template-columns:1fr}
  .occasions,.infos{grid-template-columns:1fr}
  .galerie{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .galerie figure{aspect-ratio:4/3}
  .galerie figure:first-child{grid-column:1/-1;grid-row:auto}
  .appel{display:flex;position:fixed;left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:90;gap:10px;transform:translateY(150%);transition:transform .5s var(--ressort)}
  .appel.vu{transform:none}
  .appel a{flex:1;min-height:52px;font-size:17px}
  .pied{padding-bottom:110px}
}
@media (max-width:560px){
  body{font-size:17px}
  .hero{padding-top:calc(var(--entete) + 28px)}
  .hero h1{font-size:clamp(42px,11.4vw,66px)}
  .qform{padding:0 16px 18px}
  .formules,.modes{grid-template-columns:1fr}
  .kit{grid-template-columns:1fr}
  .labo{padding:22px}
  .verre-eau{height:180px}
  .grosse-bille__etiq{right:-6px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .js .hero h1 .mot,.monte,.apparait{opacity:1;transform:none}
  .jardin .obj{opacity:1;transform:none}
}