@charset "UTF-8";
/* CSS Document */
@font-face{font-family:'Barlow Condensed';font-weight:700;font-display:swap;src:url(../fonts/barlow-condensed-latin-700-normal.woff2) format('woff2')}

@font-face{font-family:'Barlow Condensed';font-weight:800;font-display:swap;src:url(../fonts/barlow-condensed-latin-800-normal.woff2) format('woff2')}

@font-face{font-family:'Barlow';font-weight:400;font-display:swap;src:url(../fonts/barlow-latin-400-normal.woff2) format('woff2')}

@font-face{font-family:'Barlow';font-weight:600;font-display:swap;src:url(../fonts/barlow-latin-600-normal.woff2) format('woff2')}



:root{

/* ===== RÉGLAGES DES VISUELS ===== */

--hero-hauteur:75svh;

--hero-droite:0vw;

--vert-largeur:98%;

--bleu-hauteur:min(70vh,650px);

--bleu-cadrage:50% 55%;

--logo-hauteur:89px;

/* ===== FIN DES RÉGLAGES ===== */

--or:#E8541A;--gr:#83C080;--bl:#4974B5;--nv:#14213D;--d:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--b:'Barlow',system-ui,sans-serif

}



*{box-sizing:border-box;margin:0}

html{scroll-behavior:smooth}

body{font:400 clamp(1.05rem,1.3vw,1.3rem)/1.5 var(--b);color:var(--nv);background:var(--nv);overflow-x:clip}

img{display:block;max-width:100%}



section{position:relative;overflow:hidden;padding:clamp(2.5rem,5vh,4.5rem) 6vw}

a:focus-visible,summary:focus-visible{outline:3px solid currentColor;outline-offset:4px}

header.top{position:fixed;top:0;left:0;right:0;z-index:45;height:114px;padding:0 5vw;display:flex;align-items:center;transition:background .4s}

header.top.solid{background:rgba(20,33,61,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

header.top img{height:var(--logo-hauteur);width:auto}

#bar{position:fixed;top:0;left:0;right:0;height:6px;background:#fff;mix-blend-mode:difference;transform:scaleX(0);transform-origin:0;z-index:50}



.d{font:800 clamp(3rem,9vw,9.5rem)/.9 var(--d);text-transform:uppercase}

.rv{display:block;overflow:hidden;padding-top:.15em;margin-top:-.15em}

.rv>span{display:block;transform:translateY(108%);transition:transform 1s cubic-bezier(.2,.7,.1,1) calc(var(--i,0)*.13s)}

.rv.in>span{transform:none}

.lead{font-size:clamp(1.2rem,1.8vw,1.75rem);font-weight:600;line-height:1.3;max-width:32ch;margin:1.5rem 0 0}

.btn{display:inline-block;padding:.75em 1.5em;border-radius:999px;background:#fff;color:var(--nv);font:800 1.4rem/1 var(--d);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;transition:transform .25s,background .25s,color .25s}



.fab{position:fixed;right:1.2rem;bottom:1.2rem;z-index:40;background:var(--nv);color:#fff;border:2px solid #fff;opacity:0;transform:translateY(120%);transition:.4s}

.fab.show{opacity:1;transform:none}



@media (hover: hover) {

  .btn:hover { transform: scale(1.06); background: var(--nv); color: #fff; }

  .fab:hover { background: var(--or); border-color: var(--or); }

  summary:hover { opacity: 0.8; }

}



.cols{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:4vw;align-items:center}



.hero{

  position:relative;

  background:var(--or);

  color:#fff;

  min-height:85svh; 

  padding:0;

  overflow:hidden;

  display:flex;

  flex-direction:column;

  justify-content:space-between;

}

.hero .bg{position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 62% 55%,#F27C33,transparent 70%),linear-gradient(#C8491A,#EA6021 45%,#F07A34);z-index:0}

.pill{position:absolute;right:-6vw;top:16vh;width:62vw;height:32vw;border:4px solid rgba(255,255,255,.4);border-radius:999px;z-index:1;pointer-events:none}

.hero-content{

  position:relative;

  z-index:3;

  padding:max(6.5rem,12vh) 5vw 4vh;

  display:flex;

  flex-direction:column;

  justify-content:space-between;

  flex-grow:1;

  width:fit-content;

  max-width:58vw;

  box-sizing:border-box;

}

.hero h1{

  font-size:clamp(2.5rem,6.8vw,7.6rem);

  line-height:0.95;

  margin-bottom:2.5rem;

  width:fit-content;

}

.hero h1 .rv{white-space:nowrap}

.hero .go{

  position:relative;

  z-index:3;

  width:100%;

}

.hero .go p{

  font-weight:600;

  font-size:clamp(1.15rem,1.75vw,2rem);

  line-height:1.25;

  margin-bottom:1.5rem;

  width:100%;

  max-width:none;

}

.hero .go .btn{font-size:clamp(1.4rem,2vw,2.2rem);padding:.8em 1.8em;white-space:nowrap}

.pp{position:absolute;right:var(--hero-droite);bottom:0;height:var(--hero-hauteur);z-index:2;pointer-events:none}

.pp img{height:100%;width:auto;max-width:none;animation:up 1.4s cubic-bezier(.2,.7,.1,1) .5s both}

@keyframes up{from{transform:translateY(12%);opacity:0}}



.mf{

  background:var(--nv);

  color:#fff;

  padding:clamp(1.5rem,2vh,2rem) 6vw;

}

.lit{

  font:800 clamp(1.8rem,4.4vw,4.4rem)/1 var(--d);

  text-transform:uppercase;

  max-width:none;

  width:100%;

}

.lit span{opacity:.16;transition:opacity .3s}

.lit span.on{opacity:1}

.lit span.ac.on{color:var(--or)}



/* Règles de cooptation */

.gr{

  background:radial-gradient(ellipse 70% 60% at 68% 50%,#98D295,transparent 70%),linear-gradient(#70AF6D,#83C080 45%,#8DCB8A);

  padding:clamp(1.5rem,2.5vh,2.5rem) 6vw;

}

.gr .d{font-size:clamp(2.8rem,7vw,7.5rem); margin-bottom: 0;}

.ttl{

  position:relative;

  z-index:2;

  display:inline-block;

  font:800 clamp(1.4rem,2.8vw,2.8rem)/1 var(--d);

  text-transform:uppercase;

  border-bottom:4px solid var(--nv);

  padding-bottom:.1em;

  margin-bottom:1.2rem;

}

.gr .cols{grid-template-columns:1.5fr 1fr; gap:3vw; align-items: center;}

.gr .lead{

  max-width:55ch; 

  margin-top:.8rem;

}

.fig img{width:var(--vert-largeur);max-width:none;margin-left:calc((100% - var(--vert-largeur))/2);height:auto}



/* prime */

.pr{background:radial-gradient(ellipse 70% 60% at 62% 55%,#F27C33,transparent 70%),linear-gradient(#C8491A,#EA6021 45%,#F07A34);color:#fff}

.ghost{position:absolute;left:0;top:4%;white-space:nowrap;font:800 26vw/1 var(--d);text-transform:uppercase;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.3);pointer-events:none}

.pr-head{position:relative;margin-bottom:3vh}

.pr-sub{display:block;font-size:clamp(1.15rem,1.9vw,2rem);font-family:var(--b);font-weight:600;text-transform:none;opacity:.92;margin-top:.4rem;letter-spacing:normal}

.amts{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:3vw}

.amt{border-top:6px solid #fff;padding-top:1rem}

.amt .n{font:800 clamp(4.5rem,12vw,13rem)/.9 var(--d)}

.amt p{

  font-size:clamp(1rem,1.35vw,1.6rem);

  font-weight:600;

  line-height:1.25;

  white-space:nowrap;

  margin-top:.8rem;

}

.when{position:relative;z-index:2;margin-top:2.5vh;font:800 clamp(1.8rem,4vw,4.2rem)/1 var(--d);text-transform:uppercase;max-width:none;white-space:nowrap}



/* encarts conditions sous la prime */

.pr-exclusions{

  position:relative;

  z-index:2;

  margin-top:3vh;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:2rem;

}

.sub-warn{

  background:rgba(20,33,61,.92);

  color:#fff;

  border-radius:14px;

  padding:1.4rem 1.6rem;

  font-size:.9rem;

}

.sub-warn strong{

  display:flex;

  align-items:center;

  gap:.6rem;

  font:700 1.15rem/1.2 var(--d);

  text-transform:uppercase;

  letter-spacing:.02em;

  margin-bottom:.6rem;

  color:#fff;

}

.sub-warn strong b{

  flex:none;

  display:grid;

  place-items:center;

  width:1.5rem;

  height:1.5rem;

  border-radius:50%;

  background:var(--or);

  font-size:.9rem;

  color:#fff;

}

.sub-warn ul{margin:0;padding-left:1.2rem}

.sub-warn li{margin:.35rem 0;line-height:1.35;opacity:.95}

.sub-warn-note{

  margin-top:.6rem;

  font-size:.82rem;

  opacity:.8;

  line-height:1.35;

  font-style:italic;

}



.bl{

  background:radial-gradient(ellipse 70% 60% at 35% 55%,#5C89CD,transparent 70%),linear-gradient(#3B629B,#4974B5 45%,#5282CA);

  color:#fff;

  padding:clamp(2rem,4vh,4rem) 6vw 0;

  overflow:visible;

  z-index:5;

}

.bl .cols{grid-template-columns:1.2fr 1fr;align-items:stretch}

.bl .cols > div:last-child{align-self:center;padding-bottom:clamp(3.5rem,6.5vh,6rem)}

.bl .d{font-size:clamp(2.8rem,7vw,7.5rem)}

.ph{position:relative;display:flex;align-items:flex-end;justify-content:center;width:100%;height:100%}

.ph img{width:100%;max-width:720px;max-height:var(--bleu-hauteur);height:auto;object-fit:contain;object-position:bottom}



.st{background:#fff;height:130vh;padding:0;overflow:visible} 

.pin{

  position:sticky;

  top:20vh; 

  height:60vh; 

  overflow:hidden;

  display:flex;

  flex-direction:column;

  justify-content:center;

  gap:2vh;

  padding:2rem 6vw;

}

.st .d{color:var(--nv);font-size:clamp(3rem,8vw,8rem)}

.track{display:flex;gap:6vw;width:max-content;will-change:transform}

.step{flex:none;width:min(78vw,920px);display:flex;align-items:center;gap:3vw}

.no{font:800 clamp(6rem,22vh,16rem)/.8 var(--d);color:#dde1ea;transform:scale(.88);transform-origin:left center;transition:color .4s,transform .4s}

.step.on .no{color:var(--or);transform:none}

.step h3{font:800 clamp(2rem,4.6vw,4.6rem)/1 var(--d);text-transform:uppercase;color:#c6ccd8;transition:color .4s}

.step p{margin-top:.8rem;color:#b3bac8;white-space:nowrap;transition:color .4s}

.step a{color:inherit;font-weight:600;text-decoration:underline}

.step.on h3,.step.on p{color:var(--nv)}

.prog{height:6px;background:#e3e6ee;border-radius:3px;overflow:hidden;margin-top:1rem;}

.prog i{display:block;height:100%;background:var(--or);transform-origin:0;transform:scaleX(0)}



.fin{background:var(--nv);color:#fff;padding-bottom:clamp(4rem, 10vh, 8rem)}

.fin .big{font-size:clamp(3.4rem,12vw,13rem);color:var(--or);margin-bottom:4vh}

.fin .sub{color:#fff;font-size:.42em;margin-top:.15em}



details{

  border-top:2px solid rgba(255,255,255,.28);

  padding:1.3rem 0;

  width:100%;

  max-width:none;

}

summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;font:700 clamp(1.5rem,2.6vw,2.4rem)/1.1 var(--d);padding:1rem 0;transition:opacity 0.2s}

summary::-webkit-details-marker{display:none}

summary:after{content:"+";font-size:1.4em;line-height:.8;transition:transform .3s}

details[open] summary:after{transform:rotate(45deg)}

details p{

  margin-top:1rem;

  max-width:none;

  width:100%;

}

.chips{margin-top:1rem}

.chips span{display:inline-block;border:2px solid #fff;border-radius:999px;padding:.1em .8em;margin:.2em .3em .2em 0;font-weight:600}



@media(max-width:960px){

 :root{

   --logo-hauteur:65px;

   --hero-hauteur:60svh;

   --hero-droite:-6vw;

   --bleu-hauteur:45vh;

 }

 header.top{height:84px}

 

 .hero{

   min-height:100svh;

   display:flex;

   flex-direction:column;

 }

 

 .hero-content{

   display:contents;

 }

 .hero h1{

   font-size:clamp(2.1rem, 9.2vw, 3.4rem);

   padding:7rem 5vw 0;

   position:relative;

   z-index:3;

   margin-bottom:auto;

   width:auto;

 }

 .pill{display:none}

 .pp{

   position:absolute;

   right:var(--hero-droite);

   bottom:0;

   height:var(--hero-hauteur);

   z-index:1;

 }

 .pp img{

   height:100%;

   width:auto;

   max-width:none;

   object-fit:contain;

   object-position:bottom right;

 }

 .hero .go{

   position:relative;

   z-index:3;

   width:100%;

   padding:3.5rem 5vw 2.5rem;

   background:linear-gradient(to top, rgba(232,84,26,1) 50%, rgba(232,84,26,0.85) 75%, transparent);

 }

 .hero .go p{

   font-size:clamp(1.05rem, 3.8vw, 1.25rem);

   line-height:1.25;

   width:100%;

   max-width:100%;

   margin-bottom:1.2rem;

 }

 .hero .go .btn{

   display:block;

   text-align:center;

   font-size:1.55rem;

   padding:.75em 1em;

   width:100%;

 }



 section{padding:clamp(2.5rem,5vh,3.5rem) 6vw}

 .cols,.amts,.gr .cols,.bl .cols,.pr-exclusions{grid-template-columns:1fr;gap:1.8rem}

 

 .mf{padding:clamp(1.5rem,2vh,2.5rem) 6vw}

 .lit{font-size:clamp(1.5rem,5.5vw,2.2rem)}



 .when{white-space:normal}

 

 /* Masquer le texte Cooptez en filigrane sur mobile */

 .ghost { display: none; }



 .gr{padding:clamp(1.5rem,2.5vh,2.5rem) 6vw}

 .bl{padding:clamp(2.5rem,5vh,3.5rem) 6vw}

 .bl{padding-bottom:0}



 .amt .n{

   font-size:clamp(2.6rem, 10vw, 3.4rem);

   line-height:0.95;

 }

 .amt p{white-space:normal}

 .fig img{width:100%;margin-left:0}

 

 .bl .cols{gap:0}

 .bl .ph{order:2;height:auto}

 .bl .cols > div:last-child{order:1;padding-bottom:2.5rem}

 .ph{width:100%;margin:0 auto}

 .ph img{width:100%;max-width:480px;max-height:var(--bleu-hauteur);margin:0 auto}



 .st{height:auto;padding:clamp(2.5rem,5vh,4rem) 6vw}

 .pin{position:static;height:auto;padding:0;overflow:visible;gap:1.5rem}

 .track{flex-direction:column;width:100%;gap:2rem;transform:none !important}

 .step{flex-direction:row;align-items:flex-start;width:100%;gap:1.5rem}

 .no{font-size:clamp(4.5rem,14vw,6rem);line-height:.85;transform:none}

 .step h3{font-size:clamp(1.8rem,5vw,2.5rem)}

 .step p{margin-top:.4rem;max-width:none;white-space:normal}

 .prog{display:none}

}



@media(prefers-reduced-motion:reduce){.rv>span{transform:none;transition:none}.pp img{animation:none}html{scroll-behavior:auto}.lit span{opacity:1}}