
/* ============ POLICES DE LA CHARTE ============ */
@font-face{font-family:'Aileron';src:url("Aileron-300.776bdcd8.woff2") format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Aileron';src:url("Aileron-400.9182ef60.woff2") format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Aileron';src:url("Aileron-600.7ee3a20d.woff2") format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Cheltenham';src:url("Cheltenham-300.f4f5c31b.woff2") format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Cheltenham';src:url("Cheltenham-300-italic.6e3d3ac5.woff2") format('woff2');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Youngest';src:url("Youngest-400.2e262cc2.woff2") format('woff2');font-weight:400;font-style:normal;font-display:swap}

/* ============ JETONS DE CHARTE ============ */
:root{
  --cream:#FBFAF3;
  --white:#FFFFFF;
  --navy:#1D3153;
  --navy-deep:#12203A;
  --blue:#D9E2F1;
  --blue-soft:#EAF0F9;
  --thread:#891229;
  --ink:#1D3153;
  --muted:rgba(29,49,83,.62);
  --line:rgba(29,49,83,.14);
  --r:18px;
  --pad:clamp(20px,5vw,64px);
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--white);color:var(--ink);
  font-family:'Aileron',-apple-system,'Helvetica Neue',Arial,sans-serif;
  font-weight:300;font-size:16.5px;line-height:1.62;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}

/* ---- typographie ---- */
.serif{font-family:'Cheltenham',Georgia,serif;font-weight:300}
h1,h2,h3{font-family:'Cheltenham',Georgia,serif;font-weight:300;margin:0;line-height:1.02;letter-spacing:-.01em}
h1{font-size:clamp(3.1rem,7.4vw,6.1rem)}
h2{font-size:clamp(2.35rem,5vw,4.05rem)}
h3{font-size:clamp(1.28rem,1.9vw,1.55rem);line-height:1.14}
em.it{font-style:italic;color:var(--thread)}
.script{font-family:'Youngest',cursive;font-style:normal;color:var(--thread);line-height:.9;letter-spacing:.01em}
p{margin:0}
.lede{font-size:clamp(1.02rem,1.35vw,1.15rem);color:var(--muted);max-width:56ch}

/* eyebrow : pastille bleu clair de la charte */
.pill{
  display:inline-flex;align-items:center;gap:.55em;
  background:var(--blue);color:var(--navy);
  font-size:.755rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  padding:.62em 1.15em;border-radius:99px;
}
.pill.on-navy{background:rgba(217,226,241,.16);color:var(--blue)}
.pill .dot{width:6px;height:6px;border-radius:50%;background:var(--thread);flex:none}

/* trait de section : le fil rouge */
.eyebrow{
  display:flex;align-items:center;gap:.9em;
  font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--thread);flex:none}
.eyebrow.on-navy{color:rgba(217,226,241,.72)}

/* boutons */
.btn{
  display:inline-flex;align-items:center;gap:.7em;border-radius:99px;
  font-family:'Aileron',sans-serif;font-size:.9rem;font-weight:600;letter-spacing:.01em;
  padding:.95em 1.6em;text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:transform .25s cubic-bezier(.2,.7,.3,1),background .25s,color .25s,border-color .25s;
}
.btn .arw{transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.btn:hover{transform:translateY(-2px)}
.btn:hover .arw{transform:translateX(4px)}
.btn-navy{background:var(--navy);color:var(--cream)}
.btn-navy:hover{background:var(--navy-deep)}
.btn-thread{background:var(--thread);color:#fff}
.btn-thread:hover{background:#6E0E20}
.btn-ghost{border-color:var(--line);color:var(--navy);background:transparent}
.btn-ghost:hover{border-color:var(--navy);background:var(--white)}
.btn-light{background:var(--cream);color:var(--navy)}
.btn-light:hover{background:#fff}

/* lien souligné + flèche (réf. « chiffres expériences ») */
.link-u{
  display:inline-flex;align-items:center;gap:.6em;text-decoration:none;
  font-size:.86rem;font-weight:600;letter-spacing:.06em;color:var(--navy);
  border-bottom:1px solid var(--navy);padding-bottom:.35em;
}
.link-u:hover{color:var(--thread);border-color:var(--thread)}
.link-u:hover .arw{transform:translateX(4px)}
.link-u .arw{transition:transform .3s}

:focus-visible{outline:2px solid var(--thread);outline-offset:3px;border-radius:4px}

/* ============ NAV ============ */
.nav{
  position:sticky;top:0;z-index:60;background:rgba(251,250,243,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-in{display:flex;align-items:center;gap:2rem;height:76px}
.logo{display:flex;align-items:center;text-decoration:none;flex:none}
.logo img{height:34px;width:auto}
.foot-logo img{height:42px}
.logo-fb{font-family:'Cheltenham',serif;font-size:1.42rem;letter-spacing:.12em;color:var(--navy);line-height:1}
.logo-fb b{font-weight:300}
.logo-fb i{
  display:block;font-family:'Aileron',sans-serif;font-style:normal;
  font-size:.53rem;letter-spacing:.42em;color:var(--thread);margin-top:.35em;font-weight:600;
}
.nav-links{display:flex;gap:clamp(1rem,1.6vw,1.75rem);align-items:center}
.nav-links a{
  text-decoration:none;font-size:.85rem;font-weight:400;color:var(--navy);
  position:relative;padding-bottom:2px;
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--thread);
  transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.nav-links a:hover::after{transform:scaleX(1)}
.nav .btn{padding:.72em 1.25em;font-size:.83rem}
.burger{display:none;margin-left:auto;background:none;border:0;padding:10px;cursor:pointer}
.burger span{display:block;width:22px;height:1.5px;background:var(--navy);margin:4px 0}

.lang{display:flex;margin-left:.7rem;border:1px solid var(--line);border-radius:99px;overflow:hidden;flex:none}
.lang button{
  background:none;border:0;cursor:pointer;font-family:'Aileron',sans-serif;
  font-size:.72rem;font-weight:600;letter-spacing:.08em;color:var(--muted);
  padding:.5em .85em;transition:background .2s,color .2s;
}
.lang button:hover{color:var(--navy)}
.lang button.lang-on{background:var(--navy);color:var(--cream)}
.nav-links{margin-left:auto}

/* ============ HERO ============ */
.hero{position:relative;background:var(--cream);overflow:hidden;padding:clamp(48px,7vw,88px) 0 clamp(56px,7vw,96px)}
.hero-thread{position:absolute;top:-90px;left:-40px;width:min(430px,42vw);pointer-events:none;opacity:.9}
.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(28px,5vw,72px);align-items:center;position:relative;z-index:2}
.hero h1{margin:1.15rem 0 0}
.hero h1 .l2{display:block}
.hero-note{
  position:relative;display:inline-block;transform:rotate(-4deg);
  font-size:clamp(2.1rem,3.6vw,3.1rem);margin:.35rem 0 .1rem;
}
.hero-copy{margin-top:1.5rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.1rem}
.hero-media{position:relative}
.hero-img{border-radius:var(--r);overflow:hidden;background:var(--blue-soft)}
.hero-img img{width:100%;height:clamp(380px,48vw,540px);object-fit:cover}
.float-card{
  position:absolute;right:-14px;bottom:26px;width:min(296px,82%);
  background:var(--white);border-radius:16px;padding:18px 20px;
  box-shadow:0 16px 34px -18px rgba(29,49,83,.34);
  transform:rotate(-2deg);
}
.float-card::before{
  content:"";position:absolute;inset:7px;pointer-events:none;
  border:1px dashed rgba(137,18,41,.34);border-radius:10px;
}
.float-card .fc-top{display:flex;align-items:center;gap:.6rem;margin-bottom:.55rem}
.float-card .fc-mark{
  width:26px;height:26px;border-radius:50%;background:var(--navy);flex:none;
  display:grid;place-items:center;color:var(--cream);font-size:.62rem;font-weight:600;font-family:'Aileron',sans-serif;
}
.float-card .fc-t{font-size:.83rem;font-weight:600;color:var(--navy);line-height:1.2}
.float-card .fc-s{font-size:.72rem;color:var(--muted);line-height:1.35}
.fc-steps{list-style:none;margin:.85rem 0 0;padding:.15rem 0 .15rem 17px;position:relative}
.fc-steps::before{
  content:"";position:absolute;left:3.5px;top:.62rem;bottom:.62rem;width:1px;
  background:rgba(137,18,41,.32);
}
.fc-steps li{position:relative;font-size:.735rem;color:var(--muted);line-height:1.4;padding-bottom:.5rem}
.fc-steps li:last-child{padding-bottom:0}
.fc-steps li::before{
  content:"";position:absolute;left:-17px;top:.36em;width:8px;height:8px;border-radius:50%;
  background:var(--thread);box-shadow:0 0 0 2.5px var(--white);
}

/* ============ BANDEAU EXPERTISES ============ */
.strip{background:var(--white);border-block:1px solid var(--line);padding:20px 0;overflow:hidden}
.strip-lbl{
  text-align:center;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-bottom:14px;
}
.marquee{display:flex;width:max-content;animation:slide 42s linear infinite}
.marquee ul{display:flex;list-style:none;margin:0;padding:0 0 0 0}
.marquee li{
  display:flex;align-items:center;gap:2.1rem;padding-right:2.1rem;
  font-family:'Cheltenham',serif;font-size:1.32rem;color:var(--navy);white-space:nowrap;
}
.marquee li::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--thread);flex:none}
@keyframes slide{to{transform:translateX(-50%)}}
.strip:hover .marquee{animation-play-state:paused}

/* ============ BANDE NAVY ============ */
.band{background:var(--navy);color:var(--cream);position:relative;overflow:hidden}
.band::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--thread) 22%,var(--thread) 78%,transparent);opacity:.55;
}
.band-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,5vw,72px);align-items:center;padding-block:clamp(56px,7.5vw,104px)}
.band-img{border-radius:var(--r);overflow:hidden}
.band-img img{width:100%;height:clamp(300px,34vw,430px);object-fit:cover}
.band h2{color:var(--cream);margin:1rem 0 0}
.band h2 em{font-style:italic;color:var(--blue)}
.band p{color:rgba(251,250,243,.74);margin-top:1.35rem;max-width:52ch}
.band-list{list-style:none;margin:2rem 0 0;padding:0;display:grid;gap:.1rem}
.band-list li{
  display:flex;gap:1rem;align-items:baseline;padding:.85rem 0;
  border-top:1px solid rgba(217,226,241,.18);font-size:.94rem;color:rgba(251,250,243,.86);
}
.band-list li:last-child{border-bottom:1px solid rgba(217,226,241,.18)}
.band-list b{font-weight:600;color:var(--cream);flex:none;min-width:8.5ch}
.band .btn{margin-top:2rem}

/* ============ CHIFFRES ============ */
.figs{background:var(--cream);padding:clamp(64px,8vw,110px) 0;text-align:center}
.figs h2{max-width:19ch;margin:.9rem auto 0}
.figs .lede{margin:1.1rem auto 0;text-align:center}
.figs-head{display:flex;flex-direction:column;align-items:center}
.fig-row{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px);margin-top:clamp(36px,4.5vw,58px)}
.fig{
  background:var(--white);border-radius:20px;padding:clamp(28px,3.2vw,42px) 22px;
  border:1px solid var(--line);
}
.fig .n{font-family:'Cheltenham',serif;font-weight:300;font-size:clamp(2.9rem,5.2vw,4.2rem);line-height:1;color:var(--navy)}
.fig .n sup{font-size:.42em;vertical-align:super;margin-left:.05em}
.fig .k{font-size:.79rem;letter-spacing:.03em;color:var(--muted);margin-top:.85rem}
.fig.hi{background:var(--navy);border-color:var(--navy)}
.fig.hi .n{color:var(--cream)}
.fig.hi .k{color:rgba(217,226,241,.78)}
.fig.soft{background:var(--blue-soft);border-color:transparent}
.figs .link-u{margin-top:clamp(32px,4vw,46px)}

/* ============ MÉTHODE ============ */
.method{background:var(--white);padding:clamp(64px,8vw,112px) 0;position:relative}
.method-head{text-align:center;display:flex;flex-direction:column;align-items:center}
.method-head h2{max-width:16ch;margin-top:.9rem}
.method-head .lede{margin:1.15rem auto 0;text-align:center;max-width:52ch}
.method-note{transform:rotate(-3deg);font-size:2.4rem;margin-top:.5rem}
.method-grid{
  display:grid;grid-template-columns:1fr 1.02fr 1fr;
  gap:clamp(14px,1.8vw,24px);align-items:stretch;margin-top:clamp(38px,4.6vw,60px);
}
.method-col{display:grid;grid-template-rows:1fr 1fr;gap:clamp(14px,1.8vw,24px)}
.mcard{
  background:var(--cream);border-radius:20px;padding:clamp(24px,2.4vw,32px);
  border:1px solid transparent;transition:border-color .3s,transform .3s,background .3s;
}
.mcard:hover{border-color:rgba(137,18,41,.28);transform:translateY(-3px)}
.mcard .step{
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--thread);font-weight:600;
  display:flex;align-items:center;gap:.6em;
}
.mcard .step::after{content:"";height:1px;flex:1;background:rgba(137,18,41,.24)}
.mcard h3{margin:.85rem 0 .55rem}
.mcard p{font-size:.9rem;color:var(--muted);line-height:1.55}
.method-mid{border-radius:20px;overflow:hidden;position:relative;background:var(--blue-soft);min-height:340px}
.method-mid img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.method-mid .cap{
  position:absolute;left:14px;right:14px;bottom:14px;background:rgba(251,250,243,.94);
  border-radius:13px;padding:13px 16px;font-size:.79rem;color:var(--navy);line-height:1.4;
}
.method-mid .cap b{font-weight:600}

/* ============ VESTIAIRE / SERVICES ============ */
.serv{background:var(--cream);padding:clamp(64px,8vw,112px) 0}
.serv-head{display:flex;flex-direction:column;align-items:center;text-align:center}
.serv-head h2{max-width:19ch;margin-top:.9rem}
.serv-head .lede{margin:1.15rem auto 0;text-align:center;max-width:56ch}
.serv-head .btn{margin-top:1.9rem}
.serv-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,24px);
  margin-top:clamp(38px,4.6vw,60px);
}
.scard{
  background:var(--white);border-radius:20px;padding:clamp(24px,2.4vw,32px);
  display:flex;flex-direction:column;border:1px solid var(--line);
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s;
}
.scard:hover{transform:translateY(-4px);box-shadow:0 20px 40px -26px rgba(29,49,83,.4)}
.scard .ico{
  width:38px;height:38px;border-radius:11px;background:var(--blue-soft);color:var(--navy);
  display:grid;place-items:center;margin-bottom:1.1rem;flex:none;
}
.scard .ico svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.scard h3{font-size:1.32rem}
.scard p{font-size:.885rem;color:var(--muted);margin-top:.7rem;line-height:1.55}
.scard .tags{
  margin-top:1.15rem;font-size:.735rem;letter-spacing:.04em;color:var(--navy);
  opacity:.72;line-height:1.7;
}
.scard.dark{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.scard.dark h3{color:var(--cream)}
.scard.dark p{color:rgba(251,250,243,.72)}
.scard.dark .tags{color:var(--blue);opacity:.9}
.scard.dark .ico{background:rgba(217,226,241,.16);color:var(--blue)}

/* ============ OFFRES ============ */
.offers{background:var(--white);padding:clamp(64px,8vw,112px) 0}
.off-head{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;padding-bottom:1.6rem}
.off-head h2{margin-top:.9rem}
.off-head p{color:var(--muted);font-size:.95rem;max-width:44ch}
.carte{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.carte li{
  display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:baseline;
  padding:clamp(20px,2.4vw,30px) 0;border-bottom:1px solid var(--line);
  position:relative;transition:padding-left .35s cubic-bezier(.2,.7,.3,1);
}
.carte li::before{
  content:"";position:absolute;left:0;top:50%;width:0;height:1px;background:var(--thread);
  transition:width .35s cubic-bezier(.2,.7,.3,1);
}
.carte li:hover{padding-left:34px}
.carte li:hover::before{width:22px}
.carte h3{font-size:clamp(1.5rem,2.6vw,2.1rem)}
.carte .desc{color:var(--muted);font-size:.9rem;margin-top:.5rem;max-width:62ch}
.carte .price{
  font-family:'Aileron',sans-serif;font-size:.85rem;font-weight:600;letter-spacing:.03em;
  color:var(--navy);white-space:nowrap;text-align:right;
}
.carte .price em{display:block;font-style:normal;font-weight:300;font-size:.72rem;color:var(--muted);margin-top:.3rem}
.carte .price.free{color:var(--thread)}
.packs{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px);margin-top:clamp(40px,5vw,64px)}
.pack{
  border:1px solid var(--line);border-radius:20px;padding:clamp(22px,2.2vw,30px);
  display:flex;flex-direction:column;background:var(--cream);
  transition:transform .3s,border-color .3s;
}
.pack:hover{transform:translateY(-4px);border-color:rgba(137,18,41,.3)}
.pack .mark{font-size:.95rem;color:var(--thread);line-height:1}
.pack h3{margin:.9rem 0 .3rem;font-size:1.42rem}
.pack .for{font-size:.73rem;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.pack ul{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:.55rem}
.pack li{font-size:.845rem;color:var(--muted);padding-left:1.05rem;position:relative;line-height:1.5}
.pack li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:1px;background:var(--thread)}
.pack-note{
  margin-top:auto;padding-top:1.5rem;font-size:.72rem;letter-spacing:.11em;
  text-transform:uppercase;font-weight:600;color:rgba(29,49,83,.75);
}
.pack-cta{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  margin-top:1rem;padding:.85em 1.15em;border-radius:99px;
  border:1px solid rgba(29,49,83,.2);background:transparent;
  font-family:'Aileron',sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.01em;
  color:var(--navy);text-decoration:none;
  transition:background .25s,color .25s,border-color .25s;
}
.pack-cta .arw{transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.pack-cta:hover{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.pack-cta:hover .arw{transform:translateX(4px)}
.pack.signature{background:var(--navy);border-color:var(--navy)}
.pack.signature h3{color:var(--cream)}
.pack.signature .pack-note{color:rgba(217,226,241,.8)}
.pack.signature .pack-cta{border-color:rgba(217,226,241,.34);color:var(--cream)}
.pack.signature .pack-cta:hover{background:var(--cream);border-color:var(--cream);color:var(--navy)}
.pack.signature .for{color:rgba(217,226,241,.7)}
.pack.signature li{color:rgba(251,250,243,.76)}
.pack.signature li::before{background:var(--blue)}
.pack.signature .mark{color:var(--blue)}
.gold{
  margin-top:clamp(20px,2.4vw,28px);background:var(--blue-soft);border-radius:20px;
  padding:clamp(24px,3vw,36px);display:grid;grid-template-columns:1fr auto;
  gap:1.6rem;align-items:center;
}
.gold h3{font-size:1.5rem}
.gold p{color:var(--muted);font-size:.9rem;margin-top:.55rem;max-width:64ch}

/* ============ TÉMOIGNAGES ============ */
.temoins{background:var(--cream);padding:clamp(64px,8vw,112px) 0}
.temoins-head{display:flex;flex-direction:column;align-items:center;text-align:center}
.temoins-head h2{max-width:18ch;margin-top:.9rem}
.temoins-head .lede{margin:1.15rem auto 0;text-align:center}
.temoins-wall{
  columns:2;column-gap:clamp(14px,1.8vw,24px);
  margin-top:clamp(36px,4.5vw,58px);
}
.temoin{
  break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;
  background:var(--white);border:1px solid var(--line);border-radius:20px;
  padding:clamp(24px,2.6vw,36px);
  margin:0 0 clamp(14px,1.8vw,24px);
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s;
}
.temoin:hover{transform:translateY(-3px);box-shadow:0 20px 40px -28px rgba(29,49,83,.4)}
.temoin-stars{color:var(--thread);font-size:.78rem;letter-spacing:.24em;line-height:1}
.temoin blockquote{
  margin:1.15rem 0 0;font-family:'Cheltenham',Georgia,serif;font-weight:300;
  font-size:clamp(1.04rem,1.25vw,1.18rem);line-height:1.52;color:var(--navy);
}
.temoin-score{
  display:inline-block;margin-top:1.15rem;background:var(--blue-soft);color:var(--navy);
  border-radius:99px;padding:.42em .95em;font-size:.74rem;font-weight:600;letter-spacing:.04em;
}
.temoin-who{margin-top:1.4rem;padding-top:1.15rem;border-top:1px solid var(--line)}
.temoin-who b{display:block;font-size:.88rem;font-weight:600;color:var(--navy);line-height:1.3}
.temoin-who span{display:block;font-size:.78rem;color:var(--muted);margin-top:.2rem}
.temoin-dark{background:var(--navy);border-color:var(--navy)}
.temoin-dark .temoin-stars{color:var(--blue)}
.temoin-dark blockquote{color:var(--cream)}
.temoin-dark .temoin-score{background:rgba(217,226,241,.16);color:var(--blue)}
.temoin-dark .temoin-who{border-top-color:rgba(217,226,241,.2)}
.temoin-dark .temoin-who b{color:var(--cream)}
.temoin-dark .temoin-who span{color:rgba(217,226,241,.66)}
@media(max-width:860px){.temoins-wall{columns:1}}

/* ============ CTA FINAL · le carton de rendez-vous ============ */
.cta{
  position:relative;background:var(--navy);overflow:hidden;
  padding:clamp(58px,8vw,118px) 0;
}
.cta::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--thread) 22%,var(--thread) 78%,transparent);opacity:.55;
}
/* le fil passe derrière le carton, il entre en haut à gauche et ressort en bas à droite */
.cta-thread{position:absolute;z-index:1;pointer-events:none;height:auto}
.cta-thread.t1{top:clamp(-54px,-3vw,-14px);left:clamp(-56px,-3vw,-10px);width:clamp(126px,17vw,262px)}
.cta-thread.t2{bottom:clamp(-58px,-3vw,-16px);right:clamp(-50px,-2vw,-8px);width:clamp(112px,15vw,228px);transform:rotate(180deg)}

.carton{
  position:relative;z-index:2;max-width:920px;margin:0 auto;text-align:center;
  background:var(--cream);border-radius:22px;
  padding:clamp(34px,5vw,70px) clamp(24px,4.5vw,64px);
  box-shadow:0 44px 80px -44px rgba(0,0,0,.55);
}
/* la piqûre : un surfil pointillé, à l'intérieur du carton */
.carton::before{
  content:"";position:absolute;inset:clamp(9px,1.1vw,15px);
  border:1px dashed rgba(137,18,41,.4);border-radius:13px;pointer-events:none;
}
.carton .pill{margin-bottom:clamp(22px,3vw,34px)}
.cta h2{color:var(--thread);margin:0;font-size:clamp(2.3rem,5.6vw,4.4rem);line-height:1}
.cta h2 .w1{display:block;font-style:italic}
.cta-sign{
  display:block;font-size:clamp(1.5rem,3vw,2.2rem);margin-top:clamp(14px,2vw,20px);
  transform:rotate(-2.5deg);
}
.cta-actions{
  display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;
  margin-top:clamp(26px,3.4vw,40px);
}
.cta-linkedin{margin-top:1.15rem;font-size:.83rem}
.cta-linkedin a{
  color:var(--muted);text-decoration:none;padding-bottom:.22em;
  border-bottom:1px solid rgba(29,49,83,.2);transition:color .2s,border-color .2s;
}
.cta-linkedin a:hover{color:var(--thread);border-color:var(--thread)}
.cta-meta{
  font-size:.85rem;color:var(--muted);margin:clamp(22px,3vw,32px) auto 0;max-width:56ch;
  padding-top:clamp(20px,2.6vw,28px);border-top:1px solid rgba(29,49,83,.14);
}
@media(max-width:720px){
  .cta-thread{opacity:.45}
  .cta-actions .btn{width:100%;justify-content:center}
}

/* ============ FOOTER ============ */
.foot{background:var(--navy-deep);color:rgba(251,250,243,.72);padding:clamp(48px,6vw,76px) 0 34px}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.4rem;padding-bottom:2.6rem;border-bottom:1px solid rgba(217,226,241,.16)}
.foot .logo-fb{color:var(--cream)}
.foot .logo-fb i{color:var(--blue)}
.foot .tag{font-family:'Cheltenham',serif;font-style:italic;color:var(--blue);font-size:1.18rem;margin-top:1.1rem}
.foot h4{
  font-family:'Aileron',sans-serif;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(217,226,241,.6);margin:0 0 1.1rem;font-weight:600;
}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.65rem}
.foot a{text-decoration:none;font-size:.88rem;color:rgba(251,250,243,.78)}
.foot a:hover{color:var(--blue)}
.foot-legal{display:inline-block;margin-top:.5rem}
.foot-legal a{color:rgba(251,250,243,.62);text-decoration:none;border-bottom:1px solid rgba(217,226,241,.22)}
.foot-legal a:hover{color:var(--blue);border-color:var(--blue)}
.foot-bot{
  display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;
  padding-top:1.8rem;font-size:.74rem;color:rgba(251,250,243,.45);line-height:1.6;
}

/* ============ LE CARNET DE MESURES · qualification ============ */
.qz-fab{
  position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(14px,2vw,26px);z-index:80;
  display:inline-flex;align-items:center;gap:.6em;
  background:var(--navy);color:var(--cream);border:0;border-radius:99px;cursor:pointer;
  font-family:'Aileron',sans-serif;font-size:.85rem;font-weight:600;
  padding:.9em 1.35em;box-shadow:0 16px 34px -14px rgba(29,49,83,.6);
  transition:transform .25s cubic-bezier(.2,.7,.3,1),background .25s;
}
.qz-fab:hover{transform:translateY(-2px);background:var(--navy-deep)}
.qz-fab svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-top:-1px;flex:none}
.qz-fab .qz-ping{width:7px;height:7px;border-radius:50%;background:var(--thread);flex:none}

.qz-overlay{
  position:fixed;inset:0;z-index:90;display:none;
  align-items:flex-end;justify-content:center;
  background:rgba(18,32,58,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  padding:clamp(10px,2vw,28px);
}
.qz-overlay.qz-open{display:flex}
@media(min-width:721px){.qz-overlay{align-items:center}}

.qz-panel{
  position:relative;width:100%;max-width:560px;max-height:min(88vh,760px);
  background:var(--cream);border-radius:22px;overflow:hidden;
  display:flex;flex-direction:column;
  box-shadow:0 50px 90px -40px rgba(0,0,0,.6);
  animation:qzIn .38s cubic-bezier(.2,.7,.3,1);
}
@keyframes qzIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

.qz-head{background:var(--navy);color:var(--cream);padding:clamp(18px,2.6vw,24px) clamp(20px,3vw,30px) 0;flex:none}
.qz-head-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.qz-kicker{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--blue)}
.qz-title{font-family:'Cheltenham',Georgia,serif;font-weight:300;font-size:clamp(1.3rem,2.4vw,1.6rem);margin:.4rem 0 0;line-height:1.15}
.qz-close{
  background:rgba(217,226,241,.14);border:0;color:var(--cream);cursor:pointer;flex:none;
  width:32px;height:32px;border-radius:50%;font-size:1.15rem;line-height:1;
  display:grid;place-items:center;transition:background .2s;
}
.qz-close:hover{background:rgba(217,226,241,.28)}
.qz-bar{height:3px;border-radius:99px;background:rgba(217,226,241,.2);margin:clamp(16px,2.4vw,22px) 0 0;overflow:hidden}
.qz-bar i{display:block;height:100%;width:0;background:var(--thread);border-radius:99px;transition:width .45s cubic-bezier(.2,.7,.3,1)}
.qz-step-n{font-size:.7rem;letter-spacing:.12em;color:rgba(217,226,241,.7);padding:.55rem 0 .8rem}

.qz-body{padding:clamp(22px,3.2vw,30px) clamp(20px,3vw,30px) clamp(22px,3vw,28px);overflow-y:auto;flex:1}
.qz-q{font-family:'Cheltenham',Georgia,serif;font-weight:300;font-size:clamp(1.35rem,2.8vw,1.85rem);line-height:1.15;color:var(--navy);margin:0 0 .35rem}
.qz-hint{font-size:.83rem;color:var(--muted);margin:0 0 1.15rem}
.qz-opts{display:grid;gap:.55rem}
.qz-opt{
  display:flex;align-items:center;gap:.85rem;width:100%;text-align:left;cursor:pointer;
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:.9em 1.05em;font-family:'Aileron',sans-serif;font-size:.92rem;color:var(--navy);
  transition:border-color .2s,background .2s,transform .2s;
}
.qz-opt:hover{border-color:rgba(137,18,41,.42);transform:translateX(3px)}
.qz-opt .qz-tick{width:16px;height:16px;border-radius:50%;border:1px solid var(--line);flex:none;transition:.2s}
.qz-opt.qz-sel{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.qz-opt.qz-sel .qz-tick{background:var(--thread);border-color:var(--thread);box-shadow:inset 0 0 0 3px var(--navy)}
.qz-multi .qz-opt .qz-tick{border-radius:5px}
.qz-multi .qz-opt.qz-sel .qz-tick{
  background:var(--thread);border-color:var(--thread);box-shadow:none;
  background-image:linear-gradient(45deg,transparent 42%,var(--cream) 42%,var(--cream) 55%,transparent 55%),
                   linear-gradient(-45deg,transparent 55%,var(--cream) 55%,var(--cream) 68%,transparent 68%);
  background-size:100% 100%;
}
.qz-nav .btn{padding:.72em 1.15em;font-size:.83rem}

.qz-portes{display:grid;gap:.7rem}
.qz-porte{
  display:block;width:100%;text-align:left;cursor:pointer;text-decoration:none;
  background:var(--white);border:1px solid var(--line);border-radius:16px;
  padding:1.05em 1.15em;font-family:'Aileron',sans-serif;color:var(--navy);
  transition:border-color .2s,transform .2s,box-shadow .2s;
}
.qz-porte:hover{border-color:rgba(137,18,41,.42);transform:translateY(-2px);box-shadow:0 14px 28px -18px rgba(29,49,83,.4)}
.qz-porte-fort{
  background:var(--thread);border-color:var(--thread);color:var(--cream);
  box-shadow:0 16px 30px -16px rgba(137,18,41,.5);
}
.qz-porte-fort .qz-porte-s{color:rgba(251,250,243,.8)}
.qz-porte-fort:hover{
  background:#6E0E20;border-color:#6E0E20;
  box-shadow:0 20px 36px -16px rgba(137,18,41,.58);
}
.qz-porte-t{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:1.02rem;font-weight:600;line-height:1.25}
.qz-porte-s{display:block;font-size:.83rem;color:var(--muted);line-height:1.5;margin-top:.4rem}
.qz-porte .arw{flex:none;transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.qz-porte:hover .arw{transform:translateX(4px)}

.qz-fields{display:grid;gap:.7rem;margin-top:.4rem}
.qz-field label{display:block;font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.qz-field input,.qz-field textarea{
  width:100%;background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:.8em .95em;font-family:'Aileron',sans-serif;font-size:.92rem;color:var(--navy);
}
.qz-field textarea{resize:vertical;min-height:76px}
.qz-field input:focus,.qz-field textarea:focus{outline:2px solid var(--thread);outline-offset:1px;border-color:transparent}
.qz-err{color:var(--thread);font-size:.78rem;margin-top:.6rem;min-height:1.1em}

.qz-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.3rem}
.qz-back{
  background:none;border:0;cursor:pointer;color:var(--muted);
  font-family:'Aileron',sans-serif;font-size:.83rem;padding:.5em 0;
}
.qz-back:hover{color:var(--thread)}
.qz-legal{font-size:.7rem;color:var(--muted);line-height:1.5;margin-top:1rem}

/* messages d'état d'envoi */
.qz-sent,.qz-fail{
  border-radius:12px;padding:.75em 1em;font-size:.83rem;line-height:1.45;margin:0 0 1.1rem;
}
.qz-sent{background:var(--blue-soft);color:var(--navy)}
.qz-fail{background:rgba(137,18,41,.08);color:var(--thread)}

/* écran de restitution */
.qz-reco{
  background:var(--white);border:1px solid var(--line);border-radius:16px;
  padding:clamp(18px,2.4vw,22px);margin:0 0 1.1rem;position:relative;
}
.qz-reco::before{content:"";position:absolute;inset:7px;border:1px dashed rgba(137,18,41,.34);border-radius:10px;pointer-events:none}
.qz-reco-in{position:relative}
.qz-reco h4{font-family:'Cheltenham',serif;font-weight:300;font-size:1.5rem;color:var(--thread);margin:.4rem 0 .3rem}
.qz-reco p{font-size:.88rem;color:var(--muted);line-height:1.5}
.qz-recap{list-style:none;margin:0 0 1.2rem;padding:0;display:grid;gap:0}
.qz-recap li{
  display:flex;justify-content:space-between;gap:1rem;align-items:baseline;
  padding:.6rem 0;border-bottom:1px solid var(--line);font-size:.83rem;
}
.qz-recap li b{font-weight:400;color:var(--muted);flex:none}
.qz-recap li span{color:var(--navy);text-align:right}
.qz-actions{display:grid;gap:.6rem;margin-top:.2rem}
.qz-actions .btn{justify-content:center}
@media(max-width:520px){
  .qz-fab span.qz-lbl,.qz-fab .qz-ping{display:none}
  .qz-fab{padding:.85em;border-radius:50%}
  .qz-fab svg{width:21px;height:21px;margin-top:0}
}

/* ============ BANDEAU COOKIES ============ */
.ck{position:fixed;left:0;right:0;bottom:0;z-index:85;display:none;padding:clamp(10px,1.6vw,18px)}
.ck.ck-on{display:block;animation:ckIn .5s cubic-bezier(.2,.7,.3,1)}
@keyframes ckIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.ck-in{
  max-width:1040px;margin:0 auto;background:var(--cream);border-radius:18px;
  padding:clamp(18px,2.2vw,24px) clamp(20px,2.4vw,28px);
  border:1px solid var(--line);box-shadow:0 26px 56px -26px rgba(29,49,83,.5);
  display:grid;grid-template-columns:1fr auto;gap:clamp(16px,2.4vw,32px);align-items:center;
}
.ck-t{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;
  color:var(--thread);margin-bottom:.45rem;
}
.ck-txt p:not(.ck-t){font-size:.85rem;color:var(--muted);line-height:1.55;max-width:70ch}
.ck-txt a{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.ck-txt a:hover{color:var(--thread)}
.ck-act{display:flex;gap:.6rem;flex:none}
.ck-act .btn{padding:.78em 1.4em;font-size:.84rem}
body.ck-open .qz-fab{bottom:calc(clamp(14px,2vw,26px) + var(--ck-h,0px) + 12px)}
@media(max-width:760px){
  .ck-in{grid-template-columns:1fr}
  .ck-act{flex-direction:column-reverse}
  .ck-act .btn{width:100%;justify-content:center}
}

/* ============ ANIMATIONS ============ */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.3,1),transform .8s cubic-bezier(.2,.7,.3,1)}
.rv.is-in{opacity:1;transform:none}
.thread-draw{stroke-dasharray:2600;stroke-dashoffset:2600;transition:stroke-dashoffset 2.4s cubic-bezier(.3,.6,.3,1)}
.is-in .thread-draw,.thread-draw.is-in{stroke-dashoffset:0}

/* ============ RESPONSIVE ============ */
@media(max-width:900px){
  .nav-links{display:none}
  .nav-links.open{
    display:flex;position:absolute;top:76px;left:0;right:0;flex-direction:column;
    align-items:flex-start;gap:1.1rem;background:var(--cream);padding:22px var(--pad) 26px;
    border-bottom:1px solid var(--line);
  }
  .nav .btn{display:none}
  .lang{order:2;margin-left:auto}
  .burger{display:block;order:3;margin-left:.5rem}
}
@media(max-width:1040px){
  .hero-grid,.band-grid{grid-template-columns:1fr}
  .band-img{order:-1}
  .method-grid{grid-template-columns:1fr 1fr}
  .method-mid{grid-column:1/-1;order:-1;min-height:280px}
  .serv-grid{grid-template-columns:1fr 1fr}
  .packs{grid-template-columns:1fr 1fr}
  .foot-top{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .method-grid,.serv-grid,.packs,.fig-row{grid-template-columns:1fr}
  .method-col{grid-template-rows:auto}
  .off-head,.gold{grid-template-columns:1fr}
  .carte li{grid-template-columns:1fr}
  .carte .price{text-align:left}
  .float-card{right:0;left:auto;bottom:-22px;width:min(286px,88%)}
  .hero-img img{height:340px}
  .foot-top{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
}


/* ═══ Action 8 · bandeau cookies compact — audit Wen's Consulting 07/2026 ═══ */
.ck{padding:clamp(8px,1vw,12px)}
.ck-in{max-width:920px;border-radius:14px;
  padding:clamp(12px,1.4vw,16px) clamp(16px,1.8vw,22px);
  gap:clamp(12px,1.8vw,26px);
  box-shadow:0 16px 34px -20px rgba(29,49,83,.42)}
.ck-txt .ck-t{margin-bottom:.2rem;font-size:.68rem}
.ck-txt p:not(.ck-t){font-size:.78rem;line-height:1.42;max-width:82ch}
.ck-act{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;direction:ltr}
.ck-act .btn{padding:.62em 1em;font-size:.8rem;min-height:40px;
  justify-content:center;text-align:center}

/* Hiérarchie des couches : quand le Carnet de Mesures est ouvert,
   le bandeau et la bulle d'aide s'effacent au lieu de se superposer. */
body:has(.qz-overlay.qz-open) .ck,
body:has(.qz-overlay.qz-open) .qz-fab{display:none!important}


/* ═══ Panneau de transparence cookies — Wen's Consulting 07/2026 ═══ */

/* Le bandeau accueille une entrée tertiaire. Refuser et Accepter gardent
   exactement la même largeur : le refus ne devient pas plus difficile. */
.ck-txt .ck-param{
  display:inline-block;margin-top:.5rem;font-size:.78rem;
  color:var(--navy);text-decoration:underline;text-underline-offset:3px;
  background:none;border:0;padding:6px 0;cursor:pointer;font-family:inherit;
  min-height:32px;
}
.ck-txt .ck-param:hover{color:var(--thread)}
.ck-txt .ck-param:focus-visible{outline:2px solid var(--thread);outline-offset:3px}

.ckp-ov{
  position:fixed;inset:0;z-index:95;display:none;
  align-items:center;justify-content:center;
  background:rgba(18,32,58,.55);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  padding:clamp(10px,2vw,28px);
}
.ckp-ov.ckp-on{display:flex}

.ckp{
  background:var(--cream);border-radius:var(--r);border:1px solid var(--line);
  width:100%;max-width:760px;max-height:88vh;display:flex;flex-direction:column;
  box-shadow:0 30px 70px -28px rgba(29,49,83,.55);
}

.ckp-head{
  position:relative;padding:clamp(20px,2.4vw,28px) clamp(20px,2.6vw,32px) 0;
}
.ckp-eyebrow{
  margin:0 0 .35rem;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--thread);
}
.ckp-t{
  margin:0 0 .5rem;font-family:'Cheltenham',Georgia,serif;font-weight:400;
  font-size:clamp(24px,3.2vw,32px);line-height:1.1;color:var(--navy);
}
.ckp-close{
  position:absolute;top:clamp(14px,1.8vw,20px);right:clamp(14px,1.8vw,20px);
  width:44px;height:44px;border-radius:50%;border:1px solid var(--line);
  background:transparent;color:var(--navy);font-size:20px;line-height:1;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
}
.ckp-close:hover{background:var(--blue-soft)}
.ckp-close:focus-visible{outline:2px solid var(--thread);outline-offset:2px}

.ckp-body{
  overflow-y:auto;padding:0 clamp(20px,2.6vw,32px) clamp(16px,2vw,22px);
}
.ckp-intro{
  margin:0 0 1.4rem;font-size:.88rem;line-height:1.6;color:var(--muted);
  max-width:64ch;
}

.ckp-cat{
  border-top:1px solid var(--line);padding:1.15rem 0 .3rem;
}
.ckp-cat-h{
  display:flex;gap:1.2rem;align-items:flex-start;justify-content:space-between;
  flex-wrap:wrap;
}
.ckp-cat h3{
  margin:0 0 .3rem;font-family:'Cheltenham',Georgia,serif;font-weight:400;
  font-size:1.12rem;color:var(--navy);
}
.ckp-cat-h p{margin:0;font-size:.82rem;line-height:1.55;color:var(--muted);max-width:46ch}

.ckp-toujours{
  flex:none;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--navy);background:var(--blue-soft);border-radius:999px;
  padding:8px 14px;min-height:32px;display:inline-flex;align-items:center;
}

/* Interrupteur bâti sur une vraie case à cocher : nativement focusable,
   annoncé correctement par les lecteurs d'écran, pilotable au clavier. */
.ckp-sw{flex:none;display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;min-height:44px}
.ckp-sw input{position:absolute;opacity:0;width:1px;height:1px}
.ckp-sw-p{
  width:46px;height:26px;border-radius:999px;background:rgba(29,49,83,.22);
  position:relative;transition:background .18s ease;flex:none;
}
.ckp-sw-p::after{
  content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;
  border-radius:50%;background:#fff;transition:transform .18s ease;
}
.ckp-sw input:checked + .ckp-sw-p{background:var(--navy)}
.ckp-sw input:checked + .ckp-sw-p::after{transform:translateX(20px)}
.ckp-sw input:focus-visible + .ckp-sw-p{outline:2px solid var(--thread);outline-offset:3px}
.ckp-sw-l{font-size:.82rem;color:var(--navy)}

.ckp-tab{width:100%;border-collapse:collapse;margin:.9rem 0 .2rem;font-size:.78rem}
.ckp-tab th,.ckp-tab td{
  text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--line);
  vertical-align:top;color:var(--navy);
}
.ckp-tab th{
  font-weight:600;font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);border-bottom:1px solid var(--line);
}
.ckp-tab td:first-child{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.74rem}

.ckp-foot{
  display:grid;grid-template-columns:1fr 1fr;gap:.6rem;
  padding:clamp(14px,1.8vw,20px) clamp(20px,2.6vw,32px);
  border-top:1px solid var(--line);background:var(--white);
  border-radius:0 0 var(--r) var(--r);
}
.ckp-foot .btn{justify-content:center;text-align:center;min-height:44px;font-size:.85rem}

/* Sur petit écran, le tableau devient une liste : aucun défilement latéral. */
@media(max-width:640px){
  .ckp-tab thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ckp-tab tr{display:block;border-bottom:1px solid var(--line);padding:.6rem 0}
  .ckp-tab td{display:flex;gap:.8rem;border:0;padding:.2rem 0}
  .ckp-tab td::before{
    content:attr(data-l);flex:none;width:8.5rem;color:var(--muted);
    font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;padding-top:.15rem;
  }
}
@media(prefers-reduced-motion:reduce){
  .ckp-sw-p,.ckp-sw-p::after{transition:none}
}


/* ═══ Bandeau cookies · fond crème conservé — Wen's Consulting 07/2026 ═══

   Le fond crème d'origine est maintenu : c'est un choix de marque assumé.
   Deux corrections qui ne touchent pas à la couleur de fond :

   1. SÉPARATION — arbitrage assumé. Le fond du bandeau et celui de la page
      sont tous deux crème : 1,05:1. Un liseré navy de 2 px aurait porté la
      séparation à 12,99:1, mais alourdissait le rendu. Choix retenu : la
      bordure fine d'origine, `1px solid var(--line)` — identique au bouton
      « Voir la collection », soit 1,29:1 contre la page — compensée par une
      ombre portée franche qui détache le bandeau.
      Ce n'est pas un échec WCAG : la 1.4.11 vise les composants d'interface,
      et les deux boutons du bandeau dépassent 12:1. C'est un compromis de
      visibilité, pas de conformité.
      Si la lisibilité devait poser problème sur écran mal calibré, la valeur
      la plus légère atteignant 3:1 est rgba(29,49,83,.55).

   2. SYMÉTRIE STRICTE DES BOUTONS — choix retenu.
      À l'origine « Accepter » était plein navy et « Refuser » un simple
      contour : même largeur, poids visuel inégal. Les lignes directrices
      EDPB 03/2022 sur les dark patterns citent nommément le remplissage
      saturé de l'acceptation comme motif d'asymétrie orientant le choix.

      Les deux boutons reçoivent donc exactement le même traitement : même
      fond navy, même texte crème, même bordure, même géométrie. Seul le
      libellé les distingue. C'est la position la plus défendable en audit :
      il n'existe plus aucun argument d'orientation du consentement.

      Rien de ce qui plaisait n'est retiré — c'est le refus qui gagne en
      présence, pas l'acceptation qui en perd.

      Contrastes mesurés :
        texte crème sur navy ............ 12,42:1  (seuil 4,5:1)
        bouton navy sur fond bandeau .... 12,42:1  (seuil 3:1)

   Sélecteur volontairement en .btn.btn-ghost / .btn.btn-navy : le simple
   .ck-act .btn ne l'emporte pas sur les règles du site, vérifié en direct.

   Aucune couleur hors charte : --navy, --navy-deep, --cream, --line. */
/* Bordure fine et claire, strictement identique au bouton « Voir la collection ».
   L'ombre reste franche : c'est elle qui détache le bandeau de la page. */
.ck-in{
  border:1px solid var(--line);
  box-shadow:0 26px 56px -26px rgba(29,49,83,.5);
}

/* Refuser et Accepter — traitement rigoureusement identique.
   Seul le libellé distingue les deux boutons. */
.ck-act .btn.btn-ghost,
.ck-act .btn.btn-navy{
  background:var(--navy);color:var(--cream);
  border:1px solid var(--navy);
}
.ck-act .btn.btn-ghost:hover,
.ck-act .btn.btn-navy:hover{
  background:var(--navy-deep);border-color:var(--navy-deep);
}

.ck-act .btn.btn-ghost:focus-visible,
.ck-act .btn.btn-navy:focus-visible{
  outline:2px solid var(--thread);outline-offset:3px;
}


/* ═══ Étape 2 · accessibilité — Wen's Consulting 07/2026 ═══

   1. Lien d'évitement (WCAG 2.4.1, niveau A)
      Invisible tant qu'il n'a pas le focus. Première tabulation de la page,
      il permet de sauter la navigation pour atteindre le contenu.

   2. Agrandissement des zones cliquables
      Technique du pseudo-élément : la zone atteignable au doigt s'étend,
      le rendu ne bouge pas d'un pixel.
      ATTENTION — on utilise ::before et non ::after : les liens de
      navigation du site emploient déjà ::after pour leur soulignement au
      survol, une collision casserait l'animation.

   Mesures avant / après (zone réellement cliquable) :
      lien de nav   55x24 → 62x46
      sélecteur FR  35x25 → 39x45
      logo          39x34 → 47x54
   La largeur du sélecteur FR/EN reste sous 44 px : les deux boutons sont
   accolés dans une pastille, les élargir les ferait se chevaucher. À 39x45
   ils dépassent largement le minimum AA de 24x24 (WCAG 2.5.8).

   Les liens du pied de page ne sont volontairement PAS modifiés : hauts de
   17 px mais espacés de 37 px centre à centre, ils satisfont l'exception
   d'espacement de la 2.5.8. Les agrandir aurait fait se chevaucher les
   zones de liens voisins — le remède aurait été pire que le mal. */

.kc-skip{
  position:absolute;left:12px;top:-72px;z-index:200;
  background:var(--navy);color:var(--cream);
  padding:12px 22px;border-radius:0 0 12px 12px;
  text-decoration:none;font-size:.9rem;
  min-height:44px;display:inline-flex;align-items:center;
  transition:top .18s ease;
}
.kc-skip:focus{top:0;outline:2px solid var(--thread);outline-offset:2px}
main:focus{outline:none}

header nav a,.lang button,.logo{position:relative}
header nav a::before,
.lang button::before,
.logo::before{
  content:"";position:absolute;
  top:-11px;bottom:-11px;left:-4px;right:-4px;
}

@media(prefers-reduced-motion:reduce){.kc-skip{transition:none}}
