/* ERMITE AGENCY, même école que NEvents / SLA / YHY : structure solide, verre sombre, vraies captures. */
@font-face{font-family:'Manrope';font-weight:400;font-display:swap;src:url('fonts/Manrope-400.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-weight:500;font-display:swap;src:url('fonts/Manrope-500.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-weight:600;font-display:swap;src:url('fonts/Manrope-600.woff2') format('woff2')}

:root{
  --obsidian:#0C0E10;--panel:#131619;--panel-2:#191d21;
  --ivory:#F3EEE6;--alpine:#D9D4CB;--stone:#A19C93;
  --accent:#FF7A1A;--amber:#FFB067;--turq:#39C2C2;
  --line:rgba(243,238,230,.12);--line-2:rgba(243,238,230,.22);
  --head:'Manrope',system-ui,sans-serif;--sans:'Inter','Manrope',system-ui,sans-serif;--serif:var(--head);
  --maxw:1200px;--pad:clamp(20px,5vw,64px);--r:16px;--r-lg:24px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--obsidian)}
body{font-family:var(--sans);color:var(--ivory);background:var(--obsidian);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}ul{list-style:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--accent);color:#0C0E10}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--accent);color:#000;padding:10px 14px;z-index:999;border-radius:8px}.skip:focus{left:8px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.section{padding:clamp(72px,10vw,120px) 0}
.section--panel{background:linear-gradient(180deg,var(--obsidian) 0%,var(--panel) 22%,var(--panel) 78%,var(--obsidian) 100%)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--stone);margin-bottom:22px;display:block}
.eyebrow--accent{color:var(--amber)}
h1,h2,h3{font-family:var(--head);font-weight:600;line-height:1.06;letter-spacing:-.025em}
h1{font-size:clamp(38px,5.4vw,70px);margin-bottom:24px}
h2{font-size:clamp(30px,3.8vw,50px);margin-bottom:20px}
h3{font-size:clamp(20px,2vw,26px)}

.lead{font-size:clamp(16px,1.3vw,19px);color:var(--alpine);max-width:56ch}
.muted{color:var(--stone)}
.grid-head{max-width:720px;margin-bottom:clamp(36px,5vw,56px)}
.grid-head p{color:var(--alpine);font-size:17px}

/* ---------- boutons : verre sombre + plein orange ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 30px;border-radius:var(--r);
  font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--ivory);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:background .3s,border-color .3s,transform .3s var(--ease),box-shadow .3s}
.btn:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34);transform:translateY(-1px)}
.btn--accent{background:var(--accent);border-color:var(--accent);color:#120A03;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 30px -14px rgba(255,122,26,.7)}
.btn--accent:hover{background:#FF8A33;border-color:#FF8A33;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 34px -12px rgba(255,122,26,.8)}
.btn--sm{height:44px;padding:0 20px;font-size:13px}
.btn svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.8;fill:none}

/* ---------- header ordi : logo + nom, pilule de verre centrée, ronds + CTA à droite ---------- */
header.site{position:fixed;top:0;left:0;right:0;z-index:100;height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 clamp(20px,3vw,44px);transition:background .4s}
header.site.scrolled{background:linear-gradient(180deg,rgba(12,14,16,.92),rgba(12,14,16,.72) 70%,transparent)}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:34px;height:34px}
.brand b{font-family:var(--head);font-weight:700;font-size:20px;letter-spacing:.02em;color:var(--ivory)}
.site__name{display:none}
/* pilule */
.pill{position:relative;display:flex;align-items:center;gap:4px;height:58px;padding:0 10px;border-radius:999px;
  background:rgba(18,21,24,.62);-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 40px -24px rgba(0,0,0,.9)}
.pill::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,176,103,.55),rgba(255,255,255,.18) 35%,rgba(57,194,194,.45) 65%,rgba(255,122,26,.5));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.pill a,.pill .burger--pill{display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 18px;border-radius:999px;font-family:var(--head);font-weight:600;font-size:14px;color:var(--ivory);transition:background .25s,color .25s}
.pill a:hover,.pill .burger--pill:hover{background:rgba(255,255,255,.08)}
.pill a[aria-current=page]{background:rgba(255,255,255,.10)}
.burger--pill i{display:block;width:16px;height:1.5px;background:currentColor;position:relative}
.burger--pill i::before,.burger--pill i::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:currentColor}
.burger--pill i::before{top:-5px}.burger--pill i::after{top:5px}
/* droite : ronds + CTA */
.head-right{display:flex;align-items:center;gap:10px}
.rnd{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.12);transition:transform .3s var(--ease),filter .3s}
.rnd:hover{transform:translateY(-1px);filter:brightness(1.12)}
.rnd svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rnd--wa{background:#25D366;color:#0B2E1A;border-color:transparent}
.rnd--tel{background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.cta-pill{display:inline-flex;align-items:center;gap:12px;height:54px;padding:5px 5px 5px 22px;border-radius:999px;
  font-family:var(--head);font-weight:600;font-size:14px;color:var(--ivory);
  background:rgba(18,21,24,.6);border:1px solid rgba(255,255,255,.28);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  transition:border-color .3s,background .3s,transform .3s var(--ease)}
.cta-pill:hover{border-color:var(--amber);background:rgba(28,32,36,.75);transform:translateY(-1px)}
.cta-pill .arr{width:42px;height:42px;border-radius:50%;background:var(--accent);color:#140A03;display:grid;place-items:center;transition:transform .35s var(--ease)}
.cta-pill:hover .arr{transform:rotate(45deg)}
.cta-pill .arr svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.burger--mobile{display:none}
/* mobile / tablette : capsule flottante logo / ERMITE / burger */
@media (max-width:1100px){
  header.site{top:14px;left:14px;right:14px;height:62px;padding:0 10px 0 16px;border-radius:18px;
    background:rgba(20,23,26,.55);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);
    border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 20px 50px -30px rgba(0,0,0,.9)}
  header.site.scrolled{background:rgba(16,18,20,.72)}
  .brand b,.pill,.head-right{display:none}
  .brand img{width:32px;height:32px}
  .site__name{display:block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--head);font-weight:700;font-size:15px;letter-spacing:.34em;text-transform:uppercase;color:var(--ivory);padding-left:.34em}
  .burger--mobile{display:grid;width:44px;height:44px;border-radius:13px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);place-items:center}
  .burger--mobile span{display:block;width:18px;height:1.5px;background:var(--ivory);position:relative;transition:background .25s}
  .burger--mobile span::before,.burger--mobile span::after{content:"";position:absolute;left:0;width:18px;height:1.5px;background:var(--ivory);transition:transform .35s var(--ease),top .35s var(--ease)}
  .burger--mobile span::before{top:-6px}.burger--mobile span::after{top:6px}
  body.menu-open .burger--mobile span{background:transparent}
  body.menu-open .burger--mobile span::before{top:0;transform:rotate(45deg)}body.menu-open .burger--mobile span::after{top:0;transform:rotate(-45deg)}
}

/* ---------- bande "ils nous font confiance" : logos qui défilent ---------- */
.featured{padding:26px 0 34px;overflow:hidden}
.featured__row{display:flex;align-items:center;gap:clamp(22px,4vw,56px)}
.featured__label{flex:none;font-family:var(--head);font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory);white-space:nowrap}
.featured__track{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.featured__track ul{display:flex;align-items:center;gap:clamp(48px,7vw,110px);width:max-content;animation:marquee 34s linear infinite;padding-right:clamp(48px,7vw,110px)}
.featured__track:hover ul{animation-play-state:paused}
.featured__track li{flex:none;display:flex;align-items:center;height:44px;opacity:.78;filter:grayscale(1) brightness(1.2);transition:opacity .3s,filter .3s}
.featured__track li:hover{opacity:1;filter:none}
.featured__track img{height:36px;width:auto}
.featured__track img[alt*="Swiss"]{height:58px}
.featured__track img[alt*="YHY"]{height:50px}
.featured__track .wm{font-family:var(--head);font-weight:700;font-size:22px;letter-spacing:.12em;color:var(--ivory);white-space:nowrap}
.featured__track .wm small{font-weight:500;font-size:9px;letter-spacing:.34em;margin-left:8px;opacity:.7;vertical-align:middle}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (max-width:760px){.featured__row{flex-direction:column;align-items:flex-start;gap:14px}.featured__track{width:100%}}
@media (prefers-reduced-motion:reduce){.featured__track ul{animation:none;justify-content:center}.featured__track ul>li[aria-hidden="true"]{display:none}}

/* ---------- menu : grille de cadres ---------- */
.menu{position:fixed;inset:0;z-index:90;background:rgba(8,9,11,.78);-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%);
  opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s ease;overflow:auto;padding:96px 14px 24px}
.menu.open{opacity:1;visibility:visible}
.menu__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:760px;margin:0 auto}
.tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:190px;padding:26px 28px 24px;border-radius:22px;color:var(--ivory);overflow:hidden;
  border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transform:translateY(14px);opacity:0;transition:transform .5s var(--ease),opacity .5s ease,filter .3s}
.menu.open .tile{transform:none;opacity:1}
.menu.open .tile:nth-child(1){transition-delay:.05s}.menu.open .tile:nth-child(2){transition-delay:.1s}.menu.open .tile:nth-child(3){transition-delay:.15s}
.menu.open .tile:nth-child(4){transition-delay:.2s}.menu.open .tile:nth-child(5){transition-delay:.25s}.menu.open .tile:nth-child(6){transition-delay:.3s}
.tile:hover{filter:brightness(1.12)}
.tile--wide{grid-column:1/-1;min-height:170px}
.tile b{font-family:var(--head);font-weight:600;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.01em}
.tile[aria-current=page]::after{content:"";position:absolute;inset:0;border-radius:22px;border:1px solid rgba(255,255,255,.35);pointer-events:none}
.tile--home{background:#6B3A14}.tile--services{background:#0E4A50}.tile--work{background:#5B1E4E}
.tile--method{background:#17402E}.tile--agency{background:#22272D}.tile--contact{background:#E86A12;color:#140A03}
.tile--contact b{color:#140A03}
@media (max-width:640px){.menu{padding:88px 10px 20px}.menu__grid{gap:10px}.tile{min-height:160px;padding:22px 22px 20px;border-radius:20px}.tile--wide{min-height:150px}}

/* petites scènes animées en CSS, une par cadre */
.fx{position:relative;display:block;width:60px;height:44px;opacity:.85}
.fx i{position:absolute;display:block}
/* accueil : ondes concentriques */
.fx-rings i{left:6px;top:4px;width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(255,255,255,.75);animation:ring 2.8s ease-out infinite}
.fx-rings i:nth-child(2){animation-delay:.9s}.fx-rings i:nth-child(3){animation-delay:1.8s}
@keyframes ring{0%{transform:scale(.3);opacity:0}25%{opacity:.9}100%{transform:scale(1.25);opacity:0}}
/* services : barres qui respirent */
.fx-bars i{bottom:4px;width:9px;border-radius:3px;background:rgba(255,255,255,.8);animation:bar 1.8s ease-in-out infinite}
.fx-bars i:nth-child(1){left:8px;height:14px}.fx-bars i:nth-child(2){left:24px;height:26px;animation-delay:.3s}.fx-bars i:nth-child(3){left:40px;height:18px;animation-delay:.6s}
@keyframes bar{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1.25)}}
.fx-bars i{transform-origin:bottom}
/* réalisations : deux écrans qui glissent */
.fx-cards i{left:8px;top:6px;width:38px;height:28px;border-radius:5px;border:1.5px solid rgba(255,255,255,.8);background:rgba(255,255,255,.08)}
.fx-cards i::before{content:"";position:absolute;left:5px;top:5px;width:14px;height:2px;background:rgba(255,255,255,.7);box-shadow:0 5px 0 rgba(255,255,255,.45),0 10px 0 rgba(255,255,255,.3)}
.fx-cards i:nth-child(2){animation:slide 3.2s var(--ease) infinite}
@keyframes slide{0%,20%{transform:translate(0,0)}50%,70%{transform:translate(12px,8px)}100%{transform:translate(0,0)}}
/* méthode : quatre étapes qui s'allument */
.fx-steps i{top:18px;width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.28);animation:step 2.4s ease-in-out infinite}
.fx-steps i:nth-child(1){left:4px}.fx-steps i:nth-child(2){left:19px;animation-delay:.3s}.fx-steps i:nth-child(3){left:34px;animation-delay:.6s}.fx-steps i:nth-child(4){left:49px;animation-delay:.9s}
@keyframes step{0%,60%,100%{background:rgba(255,255,255,.28);transform:scale(1)}20%{background:rgba(255,255,255,1);transform:scale(1.35)}}
/* agence : un point en orbite */
.fx-orbit i{left:8px;top:4px;width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(255,255,255,.55);animation:spin 5s linear infinite}
.fx-orbit i::after{content:"";position:absolute;left:50%;top:-4px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:#fff}
@keyframes spin{to{transform:rotate(360deg)}}
/* démo : bulle qui tape */
.fx-typing i{top:14px;width:8px;height:8px;border-radius:50%;background:rgba(20,10,3,.75);animation:typing 1.4s ease-in-out infinite}
.fx-typing i:nth-child(1){left:8px}.fx-typing i:nth-child(2){left:22px;animation-delay:.2s}.fx-typing i:nth-child(3){left:36px;animation-delay:.4s}
@keyframes typing{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-6px);opacity:1}}
@media (prefers-reduced-motion:reduce){.fx i,.fx i::after{animation:none}}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:140px 0 80px;overflow:hidden;
  background:radial-gradient(90% 70% at 85% 10%,rgba(255,122,26,.10),transparent 55%),radial-gradient(60% 50% at 10% 90%,rgba(57,194,194,.06),transparent 60%),var(--obsidian)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(180deg,transparent,var(--obsidian));pointer-events:none}
.hero__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center}
.hero__sub{font-size:clamp(16px,1.35vw,19px);color:var(--alpine);max-width:52ch;margin-bottom:34px}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap}
.hero__proof{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:18px 20px;padding-top:30px;margin-top:38px;border-top:1px solid var(--line);max-width:640px}
.hero__proof .item{display:flex;flex-direction:column;gap:2px}
.hero__proof .n{font-family:var(--head);font-weight:600;font-size:19px;color:var(--ivory)}
.hero__proof .l{font-size:12px;letter-spacing:.08em;color:var(--stone);text-transform:uppercase}
.hero--page{min-height:auto;padding:150px 0 70px}
.hero--page .lead{margin-top:6px}
/* le logo en matière : flotte, respire, s'incline avec la souris */
.hero__mark{position:relative;display:flex;justify-content:center;align-items:center;perspective:1200px}
.hero__mark img{width:min(126%,720px);max-width:none;height:auto;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect;
  animation:markfloat 9s ease-in-out infinite,markglow 7s ease-in-out infinite;will-change:transform;transition:transform .25s ease-out}
@keyframes markfloat{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes markglow{0%,100%{filter:drop-shadow(0 0 26px rgba(255,122,26,.16))}50%{filter:drop-shadow(0 0 44px rgba(255,122,26,.30))}}
@media (max-width:960px){.hero__mark img{width:min(78%,420px)}}
@media (prefers-reduced-motion:reduce){.hero__mark img{animation:none}}
/* pile de captures réelles dans des cadres de verre */
.stack{position:relative;aspect-ratio:1/.92;perspective:1400px}
.shot{position:absolute;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.16);background:#0f1215;
  box-shadow:0 50px 90px -40px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.5);transition:transform .8s var(--ease)}
.shot img{width:100%;height:auto;display:block}
.shot--a{left:0;top:0;width:86%;transform:rotateY(7deg) rotateX(2deg);z-index:2}
.shot--b{right:-4%;top:34%;width:62%;transform:rotateY(-9deg) translateZ(-30px);z-index:3}
.shot--c{left:-3%;bottom:0;width:54%;transform:rotateY(5deg) translateZ(30px);z-index:4}
.stack:hover .shot--a{transform:rotateY(4deg) rotateX(1deg) translateY(-6px)}
.stack:hover .shot--b{transform:rotateY(-6deg) translateZ(-20px) translateY(-4px)}
.stack:hover .shot--c{transform:rotateY(3deg) translateZ(40px) translateY(-8px)}
@media (max-width:960px){.hero__inner{grid-template-columns:1fr}.stack{aspect-ratio:1.3/1;max-width:560px}}

/* ---------- déclaration ---------- */
.statement{text-align:center}
.statement .accent{font-family:var(--head);font-weight:500;font-size:clamp(28px,4.4vw,50px);line-height:1.15;letter-spacing:-.02em;max-width:22ch;margin:0 auto 24px;color:var(--ivory)}

.statement p{max-width:58ch;margin:0 auto;color:var(--alpine);font-size:clamp(16px,1.6vw,19px)}

/* ---------- services : cartes de verre numérotées ---------- */
.services__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc{position:relative;padding:34px 28px 36px;border-radius:var(--r-lg);display:flex;flex-direction:column;gap:12px;
  background:rgba(28,32,36,.5);-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);
  border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:border-color .3s,transform .4s var(--ease),background .3s}
.svc:hover{border-color:rgba(255,176,103,.45);transform:translateY(-3px);background:rgba(32,36,40,.6)}
.svc .n{font-size:12px;font-weight:600;letter-spacing:.2em;color:var(--amber)}
.svc h3{font-size:21px;margin-top:4px}
.svc p{font-size:14.5px;color:var(--alpine);line-height:1.55}
.svc ul{margin-top:6px;display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--stone)}
.svc ul li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--amber);margin:0 10px 3px 0}
@media (max-width:1000px){.services__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.services__grid{grid-template-columns:1fr}}

/* ---------- réalisations : grand split image / texte ---------- */
.work{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;padding:clamp(28px,4vw,48px) 0;border-top:1px solid var(--line)}
.work:last-of-type{border-bottom:1px solid var(--line)}
.work--flip{grid-template-columns:1fr 1.35fr}.work--flip .work__media{order:2}
.work__media{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:#0f1215;box-shadow:0 40px 80px -40px rgba(0,0,0,.9);transition:transform .6s var(--ease),border-color .4s}
.work__media:hover{transform:translateY(-4px);border-color:rgba(255,176,103,.4)}
.work__media img{width:100%;height:auto;display:block}
.work__tier{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--amber)}
.work h3{font-size:clamp(24px,2.6vw,34px);margin:8px 0 10px}
.work__cat{font-size:14px;color:var(--stone);margin-bottom:14px}
.work__desc{font-size:15px;color:var(--alpine);line-height:1.6;margin-bottom:18px;max-width:46ch}
.work__feat{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.work__feat li{font-size:12px;letter-spacing:.04em;color:var(--alpine);border:1px solid var(--line-2);border-radius:999px;padding:6px 12px}
.work__more{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--amber);display:inline-flex;align-items:center;gap:8px}
.work__more svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.8;fill:none;transition:transform .3s}
.work__more:hover svg{transform:translateX(4px)}
@media (max-width:900px){.work,.work--flip{grid-template-columns:1fr}.work--flip .work__media{order:0}}

/* réalisation sans capture : panneau mot-marque or sur noir */
.work__media--wm{aspect-ratio:16/10;display:grid;place-items:center;background:
  linear-gradient(rgba(255,176,103,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,176,103,.06) 1px,transparent 1px),#070809;background-size:40px 40px,40px 40px,auto}
.work__media--wm span{font-family:var(--head);font-weight:700;font-size:clamp(24px,3vw,40px);letter-spacing:.18em;text-transform:uppercase;color:#D9B26A}
.featured__track .wm--gold{color:#D9B26A}

/* ---------- différence : lignes à bord orange ---------- */
.diff__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.diff__item{border-top:2px solid var(--accent);padding-top:20px}
.diff__item h3{font-family:var(--sans);font-size:17px;font-weight:600;margin-bottom:8px}
.diff__item p{font-size:14px;color:var(--alpine);line-height:1.55}
@media (max-width:900px){.diff__grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.diff__grid{grid-template-columns:1fr}}

/* ---------- méthode : étapes numérotées ---------- */
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:90px 1fr auto;gap:20px;align-items:baseline;padding:26px 0;border-top:1px solid var(--line);transition:padding-left .35s var(--ease)}
.step:last-child{border-bottom:1px solid var(--line)}
.step:hover{padding-left:10px}
.step .num{font-family:var(--head);font-weight:600;font-size:22px;color:var(--amber);line-height:1}
.step h3{font-size:clamp(20px,2vw,25px);margin-bottom:6px}
.step p{font-size:14.5px;color:var(--alpine);max-width:56ch}
.step .dur{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--stone);white-space:nowrap}
@media (max-width:640px){.step{grid-template-columns:56px 1fr}.step .dur{grid-column:2}}

/* ---------- confiance : faits, pas d'avis inventés ---------- */
.trust{background:linear-gradient(180deg,var(--obsidian) 0%,var(--panel) 24%,var(--panel) 76%,var(--obsidian) 100%);color:var(--ivory)}
.trust__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.trust__grid .item .n{font-family:var(--head);font-weight:600;font-size:clamp(22px,2.4vw,30px);color:var(--ivory);line-height:1.1}
.trust__grid .item .l{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin-top:6px}
@media (max-width:900px){.trust__grid{grid-template-columns:repeat(2,1fr)}}

/* ---------- formules ---------- */
.rates{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rate{padding:34px 28px;border-radius:var(--r-lg);background:rgba(28,32,36,.5);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:14px}
.rate--hi{border-color:rgba(255,176,103,.5);box-shadow:0 0 0 1px rgba(255,176,103,.15),0 30px 60px -40px rgba(255,122,26,.5)}
.rate .tier{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--amber)}
.rate .amt{font-family:var(--head);font-weight:600;font-size:clamp(36px,3.6vw,48px);line-height:1;letter-spacing:-.02em}.rate .amt small{font-family:var(--sans);font-size:14px;color:var(--stone);margin-left:6px}
.rate .note{font-size:13.5px;color:var(--stone)}
.rate ul{display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--alpine);margin:6px 0 10px}
.rate ul li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--amber);margin:0 10px 3px 0}
.rate .btn{margin-top:auto}
@media (max-width:900px){.rates{grid-template-columns:1fr}}

/* ---------- accordéon (FAQ) ---------- */
.faq{max-width:820px}
.faq details{border-top:1px solid var(--line)}.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-family:var(--head);font-weight:600;font-size:clamp(17px,1.6vw,20px)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--sans);font-size:22px;color:var(--amber);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--alpine);font-size:15px;max-width:64ch}

/* ---------- fondateur ---------- */
.founder{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,64px);align-items:center}
.founder__media{border-radius:var(--r-lg);overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 40px 80px -40px rgba(0,0,0,.9);max-width:440px}
.founder__media img{width:100%;height:auto}
@media (max-width:900px){.founder{grid-template-columns:1fr}}

/* ---------- final / contact ---------- */
.final{background:radial-gradient(120% 100% at 50% 0%,rgba(255,122,26,.08),transparent 55%),linear-gradient(180deg,var(--obsidian),var(--obsidian) 70%,var(--panel));text-align:center}
.final h2{font-size:clamp(30px,4.2vw,54px);margin-bottom:16px}
.final p{max-width:54ch;margin:0 auto 30px;color:var(--alpine);font-size:17px}
.final__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:start}
.form{display:flex;flex-direction:column;gap:14px;padding:clamp(22px,3vw,34px);border-radius:var(--r-lg);
  background:rgba(28,32,36,.5);-webkit-backdrop-filter:blur(24px) saturate(140%);backdrop-filter:blur(24px) saturate(140%);
  border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 40px 80px -40px rgba(0,0,0,.9)}
.field{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.field input,.field textarea{font:inherit;font-family:var(--sans);font-size:15px;letter-spacing:0;text-transform:none;color:var(--ivory);
  background:rgba(12,14,16,.7);border:1px solid var(--line-2);border-radius:12px;padding:14px 16px;transition:border-color .3s,box-shadow .3s}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,176,103,.14)}
.form .btn{margin-top:4px}
.msg{font-size:13.5px;min-height:1.2em}.msg.ok{color:#2FBF8F}.msg.err{color:var(--amber)}
.direct{display:flex;flex-direction:column;gap:14px;margin-top:26px}
.direct a{display:flex;flex-direction:column;gap:2px;padding:16px 18px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03);transition:border-color .3s,background .3s}
.direct a:hover{border-color:rgba(255,176,103,.4);background:rgba(255,255,255,.06)}
.direct .l{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone)}
.direct .v{font-size:17px;color:var(--ivory)}
@media (max-width:900px){.contact{grid-template-columns:1fr}}

/* ---------- footer ---------- */
footer.site{padding:70px 0 30px;background:linear-gradient(180deg,var(--obsidian),var(--panel));color:var(--stone);font-size:14px}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:40px}
.foot__grid b{display:block;color:var(--ivory);font-weight:600;margin-bottom:12px;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.foot__grid a{display:block;padding:4px 0;color:var(--alpine)}.foot__grid a:hover{color:var(--ivory)}
.foot__brand p{margin-top:14px;max-width:34ch;color:var(--stone)}
.foot__bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--line);font-size:12.5px}
@media (max-width:900px){.foot__grid{grid-template-columns:1fr 1fr}}@media (max-width:560px){.foot__grid{grid-template-columns:1fr}}

/* ---------- barre mobile flottante ---------- */
.mobile-bar{display:none}
@media (max-width:960px){
  .mobile-bar{position:fixed;left:14px;right:14px;bottom:14px;z-index:90;display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:6px;padding:6px;border-radius:20px;
    background:rgba(20,23,26,.72);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);border:1px solid rgba(255,255,255,.16);
    box-shadow:0 20px 50px -20px rgba(0,0,0,.9);transition:transform .4s var(--ease),opacity .4s}
  .mobile-bar.hide,body.menu-open .mobile-bar{transform:translateY(120%);opacity:0}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;border-radius:14px;font-size:13px;font-weight:600;color:var(--ivory)}
  .mobile-bar a.demo{background:var(--accent);color:#120A03}
  body{padding-bottom:84px}
}

/* ---------- révélation ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ======================================================================
   NOTRE TRAVAIL : cartes qui glissent au scroll (accueil) + pages projet
   ====================================================================== */
.wemake{position:relative;height:230svh}
.wemake__sticky{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;gap:clamp(22px,4vh,44px);overflow:hidden}
.wemake__head{padding:0 var(--pad);max-width:900px}
.wemake__head h2{margin-bottom:10px}
.wemake__cards{display:flex;gap:clamp(14px,1.6vw,24px);padding:0 var(--pad);width:max-content;will-change:transform}
.wcard{position:relative;flex:0 0 auto;width:clamp(260px,21vw,372px);aspect-ratio:4/5;border-radius:clamp(16px,1.5vw,28px);overflow:hidden;background:#0f1215;border:1px solid rgba(255,255,255,.08);display:block;color:var(--ivory)}
.wcard img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.wcard:hover img{transform:scale(1.05)}
.wcard__cap{position:absolute;left:0;right:0;bottom:0;padding:44px 20px 18px;background:linear-gradient(0deg,rgba(7,8,10,.86),transparent);display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.wcard__cap b{font-family:var(--head);font-weight:600;font-size:18px}
.wcard__cap span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--alpine);white-space:nowrap}
.wcard--wm{display:grid;place-items:center;background:linear-gradient(rgba(255,176,103,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,176,103,.06) 1px,transparent 1px),#070809;background-size:36px 36px,36px 36px,auto}
.wcard--wm>span{font-family:var(--head);font-weight:700;font-size:clamp(18px,1.8vw,26px);letter-spacing:.16em;text-transform:uppercase;color:#D9B26A;text-align:center;padding:0 18px}
.wemake__hint{padding:0 var(--pad);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
@media (max-width:900px){
  .wemake{height:auto}.wemake__sticky{position:static;height:auto;padding:64px 0 40px;overflow:visible}
  .wemake__cards{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch}
  .wcard{scroll-snap-align:start;width:76vw}
}
/* grille de cartes (page réalisations) */
.wgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,24px)}
.wgrid .wcard{width:auto}
@media (max-width:900px){.wgrid{grid-template-columns:1fr 1fr}}@media (max-width:560px){.wgrid{grid-template-columns:1fr}}

/* page projet */
.case-hero{padding:104px var(--pad) 0}
.case-hero__frame{aspect-ratio:16/7;overflow:hidden;border-radius:clamp(16px,1.5vw,28px);background:#0f1215;border:1px solid rgba(255,255,255,.08)}
.case-hero__frame img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.case-title{padding:34px var(--pad) 0;display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.case-title h1{font-size:clamp(34px,4.6vw,64px);margin:0}
.case-title .meta{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone)}
.wtext{padding:clamp(56px,8vw,110px) var(--pad)}
.wtext__inner{display:grid;grid-template-columns:.8fr 1.7fr;gap:clamp(30px,6vw,90px);max-width:1280px;margin:0 auto}
.wtext__services-head{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:16px}
.wtext__services-list{display:flex;flex-direction:column;gap:8px;font-family:var(--head);font-weight:600;font-size:16px}
.wtext__services-list li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--amber);margin:0 12px 3px 0}
.wtext__heading{font-size:clamp(28px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.02em;margin-bottom:26px}
.wtext__body{font-size:clamp(16px,1.35vw,19px);color:var(--alpine);line-height:1.65;max-width:62ch}
.wtext .word{display:inline-block;opacity:0;transform:translateY(.45em);transition:opacity .55s ease,transform .55s var(--ease)}
.wtext.in .word{opacity:1;transform:none}
.wtext .word--accent{color:var(--amber)}
@media (max-width:900px){.wtext__inner{grid-template-columns:1fr}}
/* zoom collant */
.wzoom{--zpad:clamp(16px,4vw,80px);--zgap:clamp(12px,2vw,40px);--zh:clamp(280px,46svh,560px);--zcol:calc((100vw - var(--zpad)*2 - var(--zgap)*2)/3);--zr:clamp(12px,1.2vw,22px);height:200svh;position:relative}
.wzoom__sticky{position:sticky;top:0;height:100svh;overflow:hidden}
.wzoom__stage{position:relative;display:flex;align-items:center;height:100%;width:100%}
.wzoom__row{display:flex;gap:var(--zgap);padding:0 var(--zpad);width:100%}
.wzoom__col{flex:0 0 var(--zcol);height:var(--zh);border-radius:var(--zr);overflow:hidden;background:#0f1215;transition:none}
.wzoom__center{position:absolute;left:50%;top:50%;width:100vw;height:100svh;border-radius:var(--zr);overflow:hidden;z-index:2;transform:translate(-50%,-50%) scale(var(--s,.33));transform-origin:center;will-change:transform;background:#0f1215}
.wzoom img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
@media (max-width:900px){.wzoom{height:auto}.wzoom__sticky{position:static;height:auto;padding:40px 0}.wzoom__row{flex-direction:column}.wzoom__col{flex:none;height:auto;aspect-ratio:4/3}.wzoom__center{display:none}}
/* visuel pleine largeur + galeries */
.wmedia{padding:12px var(--pad)}
.wmedia__frame{border-radius:clamp(16px,1.5vw,28px);overflow:hidden;background:#0f1215;border:1px solid rgba(255,255,255,.08)}
.wmedia__frame img{width:100%;height:auto;display:block}
.wgal{display:grid;gap:24px;padding:12px var(--pad)}
.wgal__cell{position:relative;aspect-ratio:1/1;border-radius:clamp(16px,1.5vw,28px);overflow:hidden;background:#0f1215;border:1px solid rgba(255,255,255,.08)}
.wgal__cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.wgal__cell:hover img{transform:scale(1.04)}
.wgal--cols2{grid-template-columns:1fr 1fr}
.wgal--trio-right{grid-template-columns:1fr 2fr}.wgal--trio-right .wgal__cell:nth-child(3){aspect-ratio:auto;grid-area:1/2/span 2}
.wgal--trio-left{grid-template-columns:2fr 1fr}.wgal--trio-left .wgal__cell:nth-child(1){aspect-ratio:auto;grid-area:1/1/span 2}
@media (max-width:760px){.wgal,.wgal--trio-right,.wgal--trio-left{grid-template-columns:1fr}.wgal--trio-right .wgal__cell:nth-child(3),.wgal--trio-left .wgal__cell:nth-child(1){aspect-ratio:1/1;grid-area:auto}}
/* précédent / suivant */
.worknav{display:grid;grid-template-columns:1fr 1fr;margin-top:clamp(50px,7vw,90px);border-top:1px solid var(--line)}
.worknav a{display:flex;flex-direction:column;gap:10px;padding:clamp(28px,4vw,48px) var(--pad);transition:background .3s}
.worknav a:hover{background:rgba(255,255,255,.03)}
.worknav a+a{border-left:1px solid var(--line);text-align:right;align-items:flex-end}
.worknav .l{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--stone)}
.worknav .n{font-family:var(--head);font-weight:600;font-size:clamp(24px,3vw,40px);letter-spacing:-.02em}
@media (max-width:640px){.worknav{grid-template-columns:1fr}.worknav a+a{border-left:0;border-top:1px solid var(--line)}}

/* ---------- réalisations : deux iPhone 16 Pro Max (cadre PNG réel, écran découpé) ---------- */
.phones{padding:clamp(72px,10vw,120px) 0}
.phones__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,70px);align-items:center}
.phones__duo{display:flex;justify-content:center;align-items:flex-end;gap:clamp(14px,2.2vw,32px);perspective:1800px;padding-bottom:60px}
.phone{position:relative;display:block;width:clamp(150px,12.6vw,212px);aspect-ratio:388/800;color:var(--ivory);
  filter:drop-shadow(0 50px 60px rgba(0,0,0,.7));transition:transform .8s var(--ease),filter .8s var(--ease)}
.phone__frame{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;display:block}
.phone__screen{display:block;position:absolute;left:5.15%;top:2.12%;width:89.95%;height:95.88%;overflow:hidden;background:#0f1215;z-index:1;border-radius:9% / 4.4%}
.phone__screen img{position:absolute;left:0;top:0;width:100%;height:auto;display:block;will-change:transform;transition:transform .1s linear}
.phone--a{transform:rotateY(9deg) rotateX(2deg) translateY(-14px)}
.phone--b{transform:rotateY(-9deg) rotateX(2deg) translateY(26px)}
.phone--c{transform:translateY(6px) translateZ(46px);z-index:3}
.phone:hover{transform:rotateY(0) rotateX(0) translateY(-10px);filter:drop-shadow(0 60px 70px rgba(0,0,0,.75)) drop-shadow(0 0 40px rgba(255,122,26,.18))}
.phone__cap{position:absolute;left:0;right:0;bottom:-50px;text-align:center;font-family:var(--head);font-weight:600;font-size:14px;white-space:nowrap;z-index:2}
.phone__cap span{display:block;font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-top:2px}
@media (max-width:900px){.phones__inner{grid-template-columns:1fr}.phones__duo{gap:10px}.phone{width:29vw}.phone--a,.phone--b,.phone--c{transform:none}.phone__cap{font-size:11px;white-space:normal;line-height:1.25}.phone__cap span{font-size:10px;letter-spacing:.08em}}

/* ---------- services façon Lyniq : grande liste numérotée + visuel qui change ---------- */
.svlist{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,80px);align-items:start}
.svlist__items{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.svitem{border-bottom:1px solid var(--line);cursor:pointer}
.svitem__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:18px 0;transition:padding .35s var(--ease)}
.svitem__name{font-family:'Bebas Neue','Manrope',sans-serif;font-size:clamp(34px,4.6vw,66px);line-height:.95;letter-spacing:.005em;text-transform:uppercase;color:rgba(243,238,230,.45);transition:color .3s,transform .35s var(--ease)}
.svitem__num{font-family:var(--mono,ui-monospace,monospace);font-size:13px;color:var(--stone);white-space:nowrap}
.svitem__num::before{content:"{ ";color:var(--amber)}.svitem__num::after{content:" }";color:var(--amber)}
.svitem__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.svitem__body>div{overflow:hidden}
.svitem__body p{margin:0 0 20px;max-width:52ch;color:var(--alpine);font-size:15.5px;line-height:1.6}
.svitem.is-on .svitem__name{color:var(--ivory);transform:translateX(8px)}
.svitem.is-on .svitem__body{grid-template-rows:1fr}
.svitem:hover .svitem__name{color:var(--ivory)}
.svlist__visual{position:sticky;top:110px;aspect-ratio:4/5;border-radius:clamp(16px,1.5vw,28px);overflow:hidden;background:#0f1215;border:1px solid rgba(255,255,255,.08)}
.svlist__visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transform:scale(1.04);transition:opacity .55s ease,transform .9s var(--ease)}
.svlist__visual img.is-on{opacity:1;transform:none}
.svlist__visual .tag{position:absolute;left:18px;bottom:18px;font-family:var(--mono,ui-monospace,monospace);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory);background:rgba(7,8,10,.6);padding:8px 12px;border-radius:999px;backdrop-filter:blur(8px)}
@media (max-width:900px){.svlist{grid-template-columns:1fr}.svlist__visual{position:relative;top:auto;aspect-ratio:16/10;order:-1}}

/* ======================================================================
   SYSTÈME DE MOUVEMENT (valeurs Lyniq) + sections Lyniq adaptées
   ====================================================================== */
:root{--ease-spring:cubic-bezier(.22,1,.36,1);--ease-img:cubic-bezier(.68,0,.16,.97);--ease-bg:cubic-bezier(.05,.65,.59,1);--ease-hover:cubic-bezier(.44,0,.56,1)}
/* apparition des blocs : 30px + transparent -> ressort */
.ap{opacity:0;transform:translateY(30px);transition:opacity .75s var(--ease-spring),transform .75s var(--ease-spring)}
.ap.in{opacity:1;transform:none}
.ap-sm{opacity:0;transform:translateY(10px);transition:opacity .6s var(--ease-spring),transform .6s var(--ease-spring)}
.ap-sm.in{opacity:1;transform:none}
/* images : 1.15 -> 1 en 1.5s */
.ap-img{overflow:hidden}
.ap-img>img,.ap-img>picture>img{transform:scale(1.15);transition:transform 1.5s var(--ease-img)}
.ap-img.in>img,.ap-img.in>picture>img{transform:none}
/* splash d'ouverture */
.splash{position:fixed;inset:0;z-index:300;background:var(--obsidian);display:grid;place-items:center;transition:opacity .5s ease,visibility .5s ease}
.splash img{width:64px;height:64px;opacity:0;animation:splashIn 1.1s var(--ease-spring) .1s forwards}
@keyframes splashIn{0%{opacity:0;transform:scale(.8)}40%{opacity:1;transform:scale(1)}100%{opacity:1;transform:scale(1)}}
body.ready .splash{opacity:0;visibility:hidden}
/* hero : entrée retardée après le splash */
.hero .ap{transition-delay:1.7s}.hero .ap:nth-child(2){transition-delay:1.75s}.hero .ap:nth-child(3){transition-delay:1.8s}.hero .ap:nth-child(4){transition-delay:1.85s}.hero .ap:nth-child(5){transition-delay:1.9s}
.hero__mark{opacity:1;transform:translateY(100px) scale(1.3);transition:transform 1.2s var(--ease-bg) 1.15s}
body.ready .hero__mark{transform:none}
@media (prefers-reduced-motion:reduce){.ap,.ap-sm,.ap-img>img{opacity:1;transform:none;transition:none}.splash{display:none}.hero__mark{transform:none}}
.btn,.rnd,.cta-pill,.tile,.wcard img,.phone{transition-timing-function:var(--ease-hover)}

/* ticker sous le hero (mot répété) */
.ticker{overflow:hidden;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ticker__track{display:flex;gap:56px;width:max-content;animation:marquee 26s linear infinite;font-family:'Bebas Neue',var(--head);font-size:clamp(40px,6vw,88px);line-height:1;letter-spacing:.02em;color:var(--ivory);white-space:nowrap}
.ticker__track span:nth-child(even){color:transparent;-webkit-text-stroke:1px rgba(243,238,230,.5)}
@media (prefers-reduced-motion:reduce){.ticker__track{animation:none}}

/* chiffres réels qui comptent */
.numbers{padding:clamp(60px,8vw,100px) 0}
.numbers__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;border-top:1px solid var(--line)}
.num{padding:34px 0 0;border-top:1px solid transparent}
.num .v{font-family:'Bebas Neue',var(--head);font-size:clamp(56px,7vw,110px);line-height:.9;letter-spacing:.01em;color:var(--ivory)}
.num .v small{font-size:.5em;color:var(--amber);margin-left:4px}
.num b{display:block;font-family:var(--head);font-weight:600;font-size:16px;margin:14px 0 6px}
.num p{margin:0;font-size:14px;color:var(--stone);max-width:26ch}
@media (max-width:900px){.numbers__grid{grid-template-columns:1fr 1fr}}

/* déclaration : deux lignes géantes + visuel qui se révèle */
.decl{padding:clamp(70px,9vw,120px) 0}
.decl__lines{font-family:'Bebas Neue',var(--head);font-size:clamp(56px,9vw,150px);line-height:.92;letter-spacing:.01em;color:var(--ivory)}
.decl__lines .r{text-align:right;color:var(--amber)}
.decl__row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,60px);align-items:end;margin-top:clamp(24px,4vw,48px)}
.decl__img{border-radius:clamp(16px,1.5vw,28px);background:#0f1215;aspect-ratio:16/10}
.decl__img img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.decl__txt{font-size:clamp(17px,1.5vw,21px);color:var(--alpine);max-width:40ch}
@media (max-width:900px){.decl__row{grid-template-columns:1fr}}

/* bénéfices : 3 cartes à mini-interface */
.bene{padding:clamp(70px,9vw,120px) 0}
.bene__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bcard{border-radius:clamp(18px,1.6vw,28px);background:var(--panel);border:1px solid rgba(255,255,255,.08);overflow:hidden;display:flex;flex-direction:column}
.bcard__ui{height:250px;position:relative;background:linear-gradient(180deg,#171a1e,#101316);border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;padding:24px}
.bcard__txt{padding:26px 26px 30px}
.bcard__txt h3{font-family:var(--head);font-weight:600;font-size:20px;margin-bottom:8px}
.bcard__txt p{margin:0;font-size:14.5px;color:var(--alpine)}
/* mini-UI 1 : liste de demandes */
.ui-list{width:100%;max-width:260px;display:flex;flex-direction:column;gap:8px}
.ui-list li{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:10px 12px;font-size:12.5px;color:var(--alpine);transform:translateX(-8px);opacity:0;transition:transform .5s var(--ease-spring),opacity .5s}
.in .ui-list li{transform:none;opacity:1}
.in .ui-list li:nth-child(2){transition-delay:.12s}.in .ui-list li:nth-child(3){transition-delay:.24s}.in .ui-list li:nth-child(4){transition-delay:.36s}
.ui-list i{width:16px;height:16px;border-radius:50%;background:var(--accent);flex:none;display:grid;place-items:center}
.ui-list i::after{content:"";width:6px;height:3px;border-left:2px solid #140A03;border-bottom:2px solid #140A03;transform:rotate(-45deg) translate(1px,-1px)}
/* mini-UI 2 : fichiers qui vous appartiennent */
.ui-files{display:flex;gap:10px;align-items:flex-end}
.ui-files span{display:grid;place-items:center;width:64px;height:78px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font-family:var(--mono,monospace);font-size:11px;letter-spacing:.08em;color:var(--alpine);transform:translateY(12px);opacity:0;transition:transform .6s var(--ease-spring),opacity .6s}
.in .ui-files span{transform:none;opacity:1}
.in .ui-files span:nth-child(2){transition-delay:.1s}.in .ui-files span:nth-child(3){transition-delay:.2s}.in .ui-files span:nth-child(4){transition-delay:.3s}
.ui-files span.k{background:var(--accent);color:#140A03;border-color:transparent;font-weight:700}
/* mini-UI 3 : conversation directe */
.ui-chat{width:100%;max-width:260px;display:flex;flex-direction:column;gap:8px}
.ui-chat div{max-width:82%;padding:10px 13px;border-radius:14px;font-size:12.5px;line-height:1.4;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s var(--ease-spring)}
.ui-chat .me{align-self:flex-end;background:var(--accent);color:#140A03;border-bottom-right-radius:4px}
.ui-chat .you{align-self:flex-start;background:rgba(255,255,255,.07);color:var(--ivory);border-bottom-left-radius:4px}
.in .ui-chat div{opacity:1;transform:none}.in .ui-chat div:nth-child(2){transition-delay:.35s}.in .ui-chat div:nth-child(3){transition-delay:.7s}
.ui-chat small{font-size:10px;color:var(--stone);letter-spacing:.1em;text-transform:uppercase}
@media (max-width:900px){.bene__grid{grid-template-columns:1fr}}

/* services façon Lyniq : titre actif + description à gauche, liste à droite */
.lyq{padding:clamp(70px,9vw,120px) 0}
.lyq__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);align-items:start}
.lyq__active h3{font-family:'Bebas Neue',var(--head);font-size:clamp(52px,7vw,110px);line-height:.9;letter-spacing:.01em;margin:0 0 18px;animation:servicesIn .45s var(--ease-spring)}
.lyq__active p{font-size:clamp(16px,1.35vw,19px);color:var(--alpine);max-width:44ch;animation:servicesIn .45s var(--ease-spring)}
.lyq__active ul{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px}
.lyq__active ul li{font-size:12px;letter-spacing:.06em;color:var(--alpine);border:1px solid var(--line-2);border-radius:999px;padding:6px 12px}
@keyframes servicesIn{0%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:none}}
.lyq__list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.lyq__item{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);cursor:pointer;color:rgba(243,238,230,.5);transition:color .3s var(--ease-hover),padding-left .3s var(--ease-hover)}
.lyq__item span:first-child{font-family:'Bebas Neue',var(--head);font-size:clamp(30px,3.6vw,56px);line-height:1;letter-spacing:.01em}
.lyq__item span:last-child{font-family:var(--mono,monospace);font-size:13px}
.lyq__item span:last-child::before{content:"{ ";color:var(--amber)}.lyq__item span:last-child::after{content:" }";color:var(--amber)}
.lyq__item:hover,.lyq__item.is-on{color:var(--ivory);padding-left:10px}
.lyq__item.is-on span:last-child{color:var(--amber)}
@media (max-width:900px){.lyq__grid{grid-template-columns:1fr}}

/* citation du fondateur */
.quote{padding:clamp(70px,9vw,120px) 0}
.quote__txt{font-family:var(--head);font-weight:500;font-size:clamp(24px,3vw,44px);line-height:1.2;letter-spacing:-.02em;max-width:26ch}
.quote__who{display:flex;align-items:center;gap:14px;margin-top:30px}
.quote__who img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.15)}
.quote__who b{display:block;font-weight:600}.quote__who span{font-size:13px;color:var(--stone)}

/* tarifs avec bascule */
.pricing{padding:clamp(70px,9vw,120px) 0}
.toggle{display:inline-flex;align-items:center;gap:6px;padding:5px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);margin:0 0 34px}
.toggle button{height:40px;padding:0 18px;border-radius:999px;font-family:var(--head);font-weight:600;font-size:13px;color:var(--alpine);transition:background .3s var(--ease-hover),color .3s}
.toggle button.is-on{background:var(--ivory);color:#0C0E10}
.toggle .save{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--amber);padding:0 10px}
.rate .amt{transition:opacity .3s}
.pricing .rate .m-once,.pricing .rate .m-sub{display:none}
.pricing[data-mode="once"] .rate .m-once{display:block}.pricing[data-mode="sub"] .rate .m-sub{display:block}
.pricing[data-mode="once"] .rate--essentiel{border-color:rgba(255,176,103,.5)}.pricing[data-mode="sub"] .rate--serenite{border-color:rgba(255,176,103,.5)}

/* process : 4 étapes numérotées, texte à gauche épinglé */
.process{padding:clamp(70px,9vw,120px) 0}
.process__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:start}
.process__left{position:sticky;top:120px}
.pstep{display:grid;grid-template-columns:70px 1fr;gap:16px;padding:26px 0;border-top:1px solid var(--line)}
.pstep:last-child{border-bottom:1px solid var(--line)}
.pstep .n{font-family:'Bebas Neue',var(--head);font-size:44px;line-height:1;color:var(--amber)}
.pstep h3{font-family:var(--head);font-weight:600;font-size:22px;margin-bottom:6px}
.pstep p{margin:0;color:var(--alpine);font-size:15px;max-width:48ch}
@media (max-width:900px){.process__grid{grid-template-columns:1fr}.process__left{position:static}}
/* titres de section façon Lyniq : label à gauche, grand titre condensé */
.lyq-head{display:grid;grid-template-columns:200px 1fr;gap:20px;align-items:start;margin-bottom:clamp(30px,4vw,50px)}
.lyq-head .eyebrow{margin:8px 0 0}
.lyq-head h2{font-family:'Bebas Neue',var(--head);font-size:clamp(46px,6vw,96px);line-height:.92;letter-spacing:.01em;margin:0}
@media (max-width:900px){.lyq-head{grid-template-columns:1fr;gap:8px}}

/* ======================================================================
   SUPERPOSITIONS AU SCROLL (Lyniq) : rideau, titre recouvert, texte en différence
   ====================================================================== */
/* 1. hero rideau : le hero reste fixé, la suite monte par-dessus */
.hero{position:sticky;top:0;z-index:0}
main>*:not(.hero){position:relative;z-index:1;background:var(--obsidian)}
/* 2. titre épinglé recouvert par le contenu */
.pin{position:relative}
.pin__title{position:sticky;top:26vh;z-index:0;text-align:center;transition:opacity .2s linear,color .2s linear}
.pin__title h2{font-family:'Bebas Neue',var(--head);font-size:clamp(56px,9vw,150px);line-height:.9;letter-spacing:.01em;margin:0}
.pin__title .eyebrow{margin-bottom:14px}
.pin__title .year{display:block;margin-top:26px;font-family:'Bebas Neue',var(--head);font-size:clamp(28px,3vw,46px);color:var(--stone)}
.pin__content{position:relative;z-index:1;margin-top:34vh}
.pin__content .phones__inner{align-items:start}
/* coin marqueur (Lyniq) */
.corner{position:absolute;top:18px;right:18px;width:14px;height:14px;border-top:2px solid var(--accent);border-right:2px solid var(--accent);pointer-events:none}
/* 3. texte en différence par-dessus un panneau ivoire épinglé */
.diffx{position:relative;height:150svh}
.diffx__panel{position:sticky;top:18svh;height:64svh;width:min(720px,60vw);margin:0 auto;border-radius:0;background:var(--ivory);overflow:hidden;z-index:0;will-change:opacity,transform}
.diffx__panel::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(12,14,16,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(12,14,16,.06) 1px,transparent 1px);background-size:48px 48px}
.diffx__panel img{position:absolute;left:50%;top:50%;width:70%;height:auto;transform:translate(-50%,-50%);opacity:.95;filter:url(#liquid)}
.diffx__text{position:relative;z-index:1;margin-top:-64svh;padding-top:12svh;text-align:center;mix-blend-mode:difference;color:#fff;
  font-family:'Bebas Neue',var(--head);font-size:clamp(70px,12vw,210px);line-height:.9;letter-spacing:.01em}
.diffx__text div+div{margin-top:.05em}
.diffx__after{position:relative;z-index:1;text-align:center;padding:10svh 0 0;mix-blend-mode:difference;color:#fff}
.diffx__after p{font-size:clamp(17px,1.6vw,22px);color:#fff;max-width:32ch;margin:0 auto 26px;font-weight:500}
.diffx__after .down{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#fff;color:#000;font-size:22px}
@media (max-width:900px){.diffx{height:auto}.diffx__panel{position:relative;top:auto;height:40svh;width:90vw}.diffx__text{margin-top:-30svh}}

/* ---------- services : cadres colorés (mêmes que le menu), scènes animées ---------- */
.svtiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.svtile{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:230px;padding:26px 28px 24px;border-radius:22px;color:var(--ivory);overflow:hidden;
  border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:filter .3s var(--ease-hover),transform .5s var(--ease-hover)}
.svtile:hover{filter:brightness(1.12);transform:translateY(-3px)}
.svtile--wide{grid-column:1/-1;min-height:200px;flex-direction:row;align-items:flex-end;justify-content:space-between;gap:30px}
.svtile--wide .svtile__txt{max-width:56ch}
.svtile .fx{opacity:.9}
.svtile b{display:block;font-family:var(--head);font-weight:600;font-size:clamp(20px,2.2vw,26px);letter-spacing:-.01em;margin-bottom:6px}
.svtile p{margin:0;font-size:14.5px;color:rgba(243,238,230,.82);max-width:36ch}
.svtile--contact p,.svtile--contact b{color:#140A03}
.svtile .num{position:absolute;top:22px;right:24px;font-family:var(--mono,monospace);font-size:12px;letter-spacing:.14em;color:rgba(243,238,230,.6)}
@media (max-width:640px){.svtiles{grid-template-columns:1fr}.svtile{min-height:180px}.svtile--wide{flex-direction:column;align-items:flex-start}}

/* ---------- méthode : cartes empilées au scroll ---------- */
.sstack{position:relative;display:flex;flex-direction:column;gap:22px}
.scard{position:sticky;top:104px;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,60px);align-items:center;min-height:min(62vh,560px);
  padding:clamp(28px,4vw,56px);border-radius:28px;color:var(--ivory);border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 -20px 60px -30px rgba(0,0,0,.8);transform-origin:top center;will-change:transform}
.scard:nth-child(2){top:124px}.scard:nth-child(3){top:144px}.scard:nth-child(4){top:164px}
.scard .n{font-family:'Bebas Neue',var(--head);font-size:clamp(64px,8vw,120px);line-height:.85;letter-spacing:.01em;opacity:.55}
.scard h3{font-family:var(--head);font-weight:600;font-size:clamp(28px,3.2vw,44px);letter-spacing:-.02em;margin:10px 0 12px}
.scard p{margin:0;font-size:clamp(15px,1.3vw,18px);max-width:46ch;color:rgba(243,238,230,.85)}
.scard .dur{display:inline-block;margin-top:20px;font-family:var(--mono,monospace);font-size:12px;letter-spacing:.14em;text-transform:uppercase;border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:8px 14px}
.scard__ui{display:flex;align-items:center;justify-content:center;min-height:240px;border-radius:20px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.08);padding:26px}
.scard--1{background:#6B3A14}.scard--2{background:#0E4A50}.scard--3{background:#5B1E4E}.scard--4{background:#17402E}
.scard .ui-list{max-width:300px}.scard .ui-chat{max-width:300px}
.scard .fx-cards{width:120px;height:90px}.scard .fx-cards i{width:80px;height:60px;border-radius:8px}
.scard .fx-cards i::before{width:30px;height:3px;box-shadow:0 8px 0 rgba(255,255,255,.45),0 16px 0 rgba(255,255,255,.3)}
.sstack-end{height:10vh}
@media (max-width:900px){.scard{grid-template-columns:1fr;position:relative;top:auto!important;min-height:auto}.scard__ui{min-height:180px}}

/* ======================================================================
   STYLE ÉCLIPSE : noir chaud, couronne orange, halo qui éclaire le bord
   ====================================================================== */
.eclipse,.svtile{position:relative}
.eclipse,.scard,.svtile{color:var(--ivory);
  background:radial-gradient(120% 80% at 50% 115%,#2a1608 0%,#150d08 38%,#0c0c0e 72%);
  border:1px solid rgba(255,138,51,.28);
  box-shadow:inset 0 1px 0 rgba(255,200,140,.22),inset 0 -1px 0 rgba(255,122,26,.10),0 0 0 1px rgba(0,0,0,.6),0 30px 70px -30px rgba(0,0,0,.9),0 0 70px -24px rgba(255,122,26,.45)}
.scard::before,.svtile::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(60% 55% at 88% -8%,rgba(255,138,51,.42),rgba(255,122,26,.12) 40%,transparent 62%)}
.scard:nth-child(even)::before,.svtile:nth-child(even)::before{background:radial-gradient(60% 55% at 10% -8%,rgba(255,138,51,.42),rgba(255,122,26,.12) 40%,transparent 62%)}
/* la couronne : trait fin lumineux qui suit le bord */
.scard::after,.svtile::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;padding:1px;
  background:linear-gradient(135deg,rgba(255,200,140,.9),rgba(255,122,26,.35) 30%,rgba(255,122,26,.05) 55%,rgba(255,138,51,.45) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.9}
.svtile:hover,.scard:hover{filter:none;box-shadow:inset 0 1px 0 rgba(255,200,140,.3),0 0 0 1px rgba(0,0,0,.6),0 34px 80px -30px rgba(0,0,0,.95),0 0 90px -20px rgba(255,138,51,.65)}
/* couleurs plates annulées */
.scard--1,.scard--2,.scard--3,.scard--4,.svtile.tile--home,.svtile.tile--services,.svtile.tile--work,.svtile.tile--method,.svtile.tile--agency,.svtile.tile--contact{background:radial-gradient(120% 80% at 50% 115%,#2a1608 0%,#150d08 38%,#0c0c0e 72%)}
.svtile--contact p,.svtile--contact b,.svtile .num{color:var(--ivory)}
.svtile--contact p{color:rgba(243,238,230,.82)}
.svtile .num{color:rgba(255,176,103,.7)}
/* numéros en lumière */
.scard .n{background:linear-gradient(180deg,#FFD9B0,#FF8A33 60%,#B0470E);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:1}
/* mini-interfaces : silhouettes sombres, liseré orange faible */
.scard__ui{background:rgba(6,6,8,.55);border:1px solid rgba(255,138,51,.18);box-shadow:inset 0 0 40px -20px rgba(255,122,26,.35)}
.scard .dur{border-color:rgba(255,176,103,.45);color:var(--amber)}
.scard .ui-list li{background:rgba(255,255,255,.04);border-color:rgba(255,138,51,.16)}
.scard .ui-files span{background:rgba(255,255,255,.05);border-color:rgba(255,138,51,.18)}
.scard .ui-chat .you{background:rgba(255,255,255,.06)}
/* les scènes animées des services en orange */
.svtile .fx i,.svtile .fx-rings i{border-color:rgba(255,176,103,.85)}
.svtile .fx-bars i,.svtile .fx-orbit i::after{background:rgba(255,176,103,.9)}
.svtile .fx-cards i{border-color:rgba(255,176,103,.8);background:rgba(255,122,26,.08)}
.svtile .fx-steps i{background:rgba(255,176,103,.28)}
@keyframes stepOr{0%,60%,100%{background:rgba(255,176,103,.28);transform:scale(1)}20%{background:#FFB067;transform:scale(1.35)}}
.svtile .fx-steps i{animation-name:stepOr}
.svtile .fx-typing i{background:rgba(255,176,103,.8)}

/* ---------- éclipse, plus fort : couronne large et brillante ---------- */
.scard,.svtile{background:radial-gradient(120% 85% at 50% 118%,#4a2409 0%,#1d1108 34%,#0c0c0e 70%)!important;
  box-shadow:inset 0 1px 0 rgba(255,210,150,.35),inset 0 0 60px -30px rgba(255,122,26,.35),0 0 0 1px rgba(0,0,0,.6),0 40px 90px -30px rgba(0,0,0,.95),
    0 0 90px -10px rgba(255,122,26,.55),0 0 160px -30px rgba(255,90,10,.45)}
.scard::after,.svtile::after{opacity:1;background:linear-gradient(135deg,#FFE0B8,rgba(255,138,51,.7) 25%,rgba(255,122,26,.12) 50%,rgba(255,150,60,.75) 100%)}
.scard::before,.svtile::before{background:radial-gradient(70% 60% at 88% -10%,rgba(255,150,60,.55),rgba(255,122,26,.16) 42%,transparent 64%)}
.scard:nth-child(even)::before,.svtile:nth-child(even)::before{background:radial-gradient(70% 60% at 10% -10%,rgba(255,150,60,.55),rgba(255,122,26,.16) 42%,transparent 64%)}

/* ---------- prisme : la lumière de la carte du dessous se diffracte sur le bord de celle qui la recouvre ---------- */
.scard{--prism:0}
.scard .prism{position:absolute;left:0;right:0;top:0;height:120px;border-radius:28px 28px 0 0;pointer-events:none;z-index:2;overflow:hidden;opacity:var(--prism)}
.scard .prism::before{content:"";position:absolute;left:-10%;right:-10%;top:-40px;height:90px;filter:blur(22px);mix-blend-mode:screen;
  background:linear-gradient(90deg,#ff2a2a 0%,#ff7a1a 18%,#ffd23a 36%,#3bff8a 54%,#39c2ff 72%,#7a5cff 88%,#ff2aa8 100%)}
.scard .prism::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;filter:blur(1px);mix-blend-mode:screen;
  background:linear-gradient(90deg,#ff5a2a,#ffd23a 30%,#3bff8a 50%,#39c2ff 70%,#b07cff 100%)}
/* la carte recouverte se teinte légèrement (dispersion) */
.scard{transition:filter .1s linear}
@media (prefers-reduced-motion:reduce){.scard .prism{display:none}}
/* déclaration : plus de panneau ivoire, le logo liquide seul sur le noir */
.diffx__panel{background:transparent;overflow:visible}
.diffx__panel::before{display:none}
.diffx__panel img{width:82%;filter:url(#liquid) drop-shadow(0 0 60px rgba(255,122,26,.35))}
.diffx__text{mix-blend-mode:normal;color:var(--ivory)}
.diffx__after{mix-blend-mode:normal;color:var(--ivory)}
.diffx__after p{color:var(--alpine)}
.diffx__after .down{background:var(--ivory);color:#0C0E10}
/* logo liquide WebGL */
.diffx__panel canvas{position:absolute;left:50%;top:50%;width:min(720px,60vw);height:auto;aspect-ratio:1374/1145;transform:translate(-50%,-50%);display:block;filter:drop-shadow(0 0 50px rgba(255,122,26,.35))}
.diffx__panel canvas{width:min(820px,68vw);filter:drop-shadow(0 0 70px rgba(255,122,26,.30))}

/* ---------- services : la bulle d'eau qui parle, conversation au scroll ---------- */
.talk{position:relative;height:280svh}
.talk__stage{position:sticky;top:0;height:100svh;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,4vw,60px);align-items:center;overflow:hidden}
.talk__bubble{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}
.talk__bubble canvas{width:min(520px,38vw);aspect-ratio:1/1;height:auto;display:block;filter:drop-shadow(0 30px 80px rgba(255,122,26,.28))}
.speech{position:absolute;top:8%;right:-4%;max-width:300px;padding:14px 18px;border-radius:18px 18px 18px 4px;background:rgba(243,238,230,.96);color:#0C0E10;font-family:var(--head);font-weight:600;font-size:15px;line-height:1.35;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.8);transform:translateY(8px);opacity:0;transition:opacity .45s var(--ease-spring),transform .45s var(--ease-spring)}
.speech.is-on{opacity:1;transform:none}
.speech .dots{display:inline-flex;gap:4px;margin-left:6px;vertical-align:middle}
.speech .dots i{width:5px;height:5px;border-radius:50%;background:#0C0E10;opacity:.35;animation:typing 1.2s ease-in-out infinite}
.speech .dots i:nth-child(2){animation-delay:.15s}.speech .dots i:nth-child(3){animation-delay:.3s}
.talk__feed{display:flex;flex-direction:column;gap:12px;max-width:560px}
.say{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border-radius:18px;border-radius:18px 18px 18px 6px;
  background:radial-gradient(120% 90% at 50% 120%,#3a1c08 0%,#170e08 40%,#0d0c0e 75%);border:1px solid rgba(255,138,51,.28);
  box-shadow:inset 0 1px 0 rgba(255,200,140,.25),0 0 50px -20px rgba(255,122,26,.45);
  opacity:0;transform:translateY(22px) scale(.98);transition:opacity .55s var(--ease-spring),transform .55s var(--ease-spring)}
.say.is-on{opacity:1;transform:none}
.say .k{font-family:var(--mono,monospace);font-size:12px;color:var(--amber);padding-top:4px;white-space:nowrap}
.say b{display:block;font-family:var(--head);font-weight:600;font-size:17px;margin-bottom:2px}
.say p{margin:0;font-size:14px;color:var(--alpine)}
.say--cta{justify-content:space-between;align-items:center;background:var(--accent);border-color:transparent;color:#140A03}
.say--cta b{color:#140A03;margin:0}.say--cta .btn{background:#140A03;color:var(--ivory);border-color:transparent;height:44px;padding:0 18px}
.talk__hint{position:absolute;left:0;bottom:22px;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone)}
@media (max-width:900px){.talk{height:auto}.talk__stage{position:static;height:auto;grid-template-columns:1fr;padding:60px 0 20px}.talk__bubble canvas{width:min(70vw,320px)}.speech{position:relative;right:auto;top:auto;margin-top:-30px}.say{opacity:1;transform:none}.talk__hint{display:none}}

/* ---------- déclaration : eau seule, le texte vit dans le shader (le DOM garde le texte pour Google) ---------- */
.diffx__text{visibility:hidden}
.diffx__panel canvas{filter:none}
@media (max-width:900px){.diffx__panel canvas{width:96vw}}
/* ---------- prisme : une couleur par carte (plus d'arc-en-ciel), même bande, même transition ---------- */
.scard--1{--pc:#FF7A1A}.scard--2{--pc:#FFB067}.scard--3{--pc:#FF4A2A}.scard--4{--pc:#FFD23A}
.scard .prism::before{background:linear-gradient(90deg,transparent 0%,var(--pc) 25%,var(--pc) 75%,transparent 100%)}
.scard .prism::after{background:linear-gradient(90deg,transparent,var(--pc) 20%,var(--pc) 80%,transparent)}
.diffx__after{margin-top:64svh}
@media (max-width:900px){.diffx__text{margin-top:0;padding:0;height:0;overflow:hidden}.diffx__after{margin-top:0;padding-top:6svh}}
.talk__stage{padding:110px 0 60px;box-sizing:border-box;align-items:end}
.talk__bubble{align-self:center}
.talk__bubble canvas{width:min(460px,34vw)}
.talk__feed{max-height:calc(100svh - 190px);overflow:hidden;justify-content:flex-end;align-self:end;padding-bottom:10px;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 70px);mask-image:linear-gradient(to bottom,transparent,#000 70px)}
@media (max-width:900px){.talk__stage{padding:60px 0 20px;align-items:start}.talk__feed{max-height:none;overflow:visible;mask-image:none;-webkit-mask-image:none}}
.say{max-height:220px;transition:opacity .55s var(--ease-spring),transform .55s var(--ease-spring),max-height .55s var(--ease-spring),padding .55s var(--ease-spring),margin .55s var(--ease-spring)}
.say:not(.is-on){max-height:0;padding-top:0;padding-bottom:0;margin-top:-12px;border-color:transparent;box-shadow:none}
@media (max-width:900px){.say:not(.is-on){max-height:220px;padding:16px 18px;margin-top:0}}
.talk__feed{height:calc(100svh - 190px)}
@media (max-width:900px){.talk__feed{height:auto}}
/* l'eau prend toute la section : panneau plein écran, sans cadre */
.diffx{height:170svh}
.diffx__panel{top:0;height:100svh;width:100vw;margin:0 calc(50% - 50vw);overflow:hidden}
.diffx__panel canvas{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;transform:none;filter:none}
.diffx__text{margin-top:-100svh;padding-top:0;height:100svh}
.diffx__after{margin-top:0;padding-top:12svh}
@media (max-width:900px){.diffx{height:auto}.diffx__panel{position:relative;height:70svh;width:100vw}.diffx__panel canvas{width:100%}.diffx__text{height:0;margin:0}.diffx__after{padding-top:8svh}}

/* ---------- services : explorateur interactif (vignettes flottantes, carte centrale, onglets) ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.xp{position:relative;height:100svh;overflow:hidden;--xe:cubic-bezier(.16,1,.3,1);--xd:1.2s;--card-w:350px;--card-h:460px}
.xp__thumbs{position:absolute;inset:0;pointer-events:none}
.xthumb{position:absolute;width:180px;height:180px;border-radius:8px;background:var(--ivory);overflow:hidden;box-shadow:0 20px 40px -15px rgba(0,0,0,.6);
  transition:left var(--xd) var(--xe),right var(--xd) var(--xe),top var(--xd) var(--xe),bottom var(--xd) var(--xe)}
.xthumb__in{position:absolute;inset:8px;border-radius:6px;overflow:hidden;background:rgba(0,0,0,.06)}
.xthumb__in img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.12);opacity:0;transition:transform .8s var(--xe),opacity .5s var(--xe)}
.xthumb__in img.is-in{transform:scale(1);opacity:1}
.xthumb__label{position:absolute;top:0;right:0;padding:6px 12px;border-radius:0 6px 0 8px;background:var(--ivory);color:#111;font-family:var(--head);font-size:12px;font-weight:500;letter-spacing:-.01em;line-height:1;z-index:2}
/* positions des vignettes, une composition par onglet (valeurs du modèle) */
.xp[data-pos="0"] .xthumb--tl{left:6%;top:10%}.xp[data-pos="0"] .xthumb--tr{right:6%;top:6%}.xp[data-pos="0"] .xthumb--bl{left:8%;bottom:24%}.xp[data-pos="0"] .xthumb--br{right:7%;bottom:28%}
.xp[data-pos="1"] .xthumb--tl{left:4%;top:16%}.xp[data-pos="1"] .xthumb--tr{right:9%;top:4%}.xp[data-pos="1"] .xthumb--bl{left:11%;bottom:20%}.xp[data-pos="1"] .xthumb--br{right:5%;bottom:32%}
.xp[data-pos="2"] .xthumb--tl{left:8%;top:6%}.xp[data-pos="2"] .xthumb--tr{right:4%;top:13%}.xp[data-pos="2"] .xthumb--bl{left:6%;bottom:30%}.xp[data-pos="2"] .xthumb--br{right:10%;bottom:22%}
.xp[data-pos="3"] .xthumb--tl{left:5%;top:12%}.xp[data-pos="3"] .xthumb--tr{right:7%;top:9%}.xp[data-pos="3"] .xthumb--bl{left:10%;bottom:26%}.xp[data-pos="3"] .xthumb--br{right:6%;bottom:20%}
.xp[data-pos="4"] .xthumb--tl{left:7%;top:8%}.xp[data-pos="4"] .xthumb--tr{right:5%;top:15%}.xp[data-pos="4"] .xthumb--bl{left:9%;bottom:22%}.xp[data-pos="4"] .xthumb--br{right:8%;bottom:30%}
.xp__stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-bottom:60px;z-index:10}
.xp__stack{position:relative;width:var(--card-w);height:var(--card-h)}
.xcard{position:absolute;inset:0;border-radius:10px;background:var(--ivory);color:#111;overflow:hidden;transform-origin:bottom center;box-shadow:0 20px 40px -15px rgba(0,0,0,.6);
  transition:transform var(--xd) var(--xe)}
.xcard.is-enter{transform:translateY(calc(-1 * var(--card-h) - 280px))}
.xcard.is-exit{transform:translateY(calc(var(--card-h) + 280px))}
.xcard__media{position:absolute;left:8px;top:8px;right:8px;height:329px;border-radius:6px;overflow:hidden;background:rgba(0,0,0,.06)}
.xcard__media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.12);transition:transform .8s var(--xe)}
.xcard.is-on .xcard__media img{transform:scale(1)}
.xcard__body{position:absolute;left:8px;right:8px;top:345px;padding:8px 8px 0}
.xcard__body h3{margin:0 0 6px;font-family:var(--head);font-weight:600;font-size:20px;letter-spacing:-.02em;color:#111}
.xcard__body p{margin:0;font-size:12.5px;line-height:1.45;color:#555}
.xp__tabs{position:absolute;left:0;right:0;bottom:42px;display:flex;justify-content:center;z-index:20}
.xp__bar{position:relative;display:flex;gap:8px;padding:8px;border-radius:8px;background:var(--ivory);box-shadow:0 20px 40px -15px rgba(0,0,0,.6)}
.xp__bar button{position:relative;z-index:1;height:38px;padding:0 16px;border:0;background:transparent;border-radius:6px;font-family:var(--head);font-weight:500;font-size:14px;letter-spacing:-.01em;color:#111;cursor:pointer;white-space:nowrap;transition:color .25s ease}
.xp__bar button[aria-selected="true"]{color:#fff}
.xp__pill{position:absolute;top:8px;left:8px;height:38px;width:0;border-radius:6px;background:var(--accent);z-index:0;transition:left var(--xd) var(--xe),width var(--xd) var(--xe)}
@media (max-width:900px){
  .xp{height:auto;min-height:0;padding:70px 0 20px}
  .xp__thumbs{display:none}
  .xp__stage{position:relative;inset:auto;padding:0 0 24px}
  .xp{--card-w:min(350px,88vw)}
  .xp__tabs{position:relative;bottom:auto;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding:0 24px}
  .xp__tabs::-webkit-scrollbar{display:none}
  .xp__bar{flex-wrap:nowrap}
}
@media (max-width:900px){.xp{padding:110px 0 48px}}
/* appareils réels dans les cartes : on montre l'objet entier, sur fond doux */
.xcard__media,.xthumb__in{background:#E6E0D6}
.xcard__media img,.xthumb__in img{object-fit:contain;padding:14px;box-sizing:border-box}
.xthumb__in img{padding:10px}
/* explorateur : plus de cadres, seulement les appareils, plus gros */
.xp{--card-w:640px;--card-h:540px}
.xcard{background:transparent;box-shadow:none;border-radius:0;color:var(--ivory)}
.xcard__media{left:0;right:0;top:0;height:400px;background:transparent;border-radius:0;filter:drop-shadow(0 30px 50px rgba(0,0,0,.6))}
.xcard__media img{padding:0}
.xcard__body{left:0;right:0;top:418px;padding:0;text-align:center}
.xcard__body h3{color:var(--ivory);font-size:24px}
.xcard__body p{color:var(--alpine);font-size:14px;max-width:46ch;margin:0 auto}
.xthumb{width:260px;height:260px;background:transparent;box-shadow:none;border-radius:0;overflow:visible;filter:drop-shadow(0 20px 40px rgba(0,0,0,.55))}
.xthumb__in{inset:0;background:transparent;border-radius:0;overflow:visible}
.xthumb__in img{padding:0}
.xthumb__label{top:auto;bottom:-22px;left:50%;right:auto;transform:translateX(-50%);padding:0;background:transparent;color:var(--stone);font-family:var(--mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:400}
.xp__bar{background:rgba(20,22,26,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 40px -15px rgba(0,0,0,.6)}
.xp__bar button{color:var(--ivory)}
.xp__bar button[aria-selected="true"]{color:#140A03}
.xp__pill{background:var(--accent)}
@media (max-width:1300px){.xthumb{width:200px;height:200px}}
@media (max-width:900px){.xp{--card-w:min(640px,90vw)}.xcard__media{height:min(400px,56vw)}.xcard__body{top:calc(min(400px,56vw) + 18px)}.xp{--card-h:calc(min(400px,56vw) + 150px)}}
/* ---------- hero : l'eau plein écran, le titre vit dans l'eau, le reste posé en bas ---------- */
.hero--water{display:block;padding:0;background:var(--obsidian)}
.hero--water .hero__water{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero--water::after{display:none}
.hero__over{position:absolute;left:0;right:0;bottom:clamp(28px,6svh,64px);z-index:1;text-align:center;pointer-events:none}
.hero__over>*{pointer-events:auto}
.hero__over .eyebrow{display:block;margin-bottom:14px}
.hero__over .hero__sub{margin:0 auto 22px;max-width:56ch}
.hero__over .hero__cta{justify-content:center}
.hero__over .hero__proof{margin:28px auto 0;max-width:720px;padding-top:22px;grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.hero__over .hero__proof{display:none}.hero__over .hero__sub{font-size:15px;max-width:34ch}.hero__over{bottom:110px}}
.hero--water::after{display:block;height:46%;background:linear-gradient(180deg,transparent,rgba(12,14,16,.72));z-index:0}
.xthumb{width:230px;height:230px}
@media (max-width:1300px){.xthumb{width:190px;height:190px}}
/* ---------- pied de page : l'eau en fond, sur toutes les pages ---------- */
footer.foot--water{position:relative;overflow:hidden;background:var(--obsidian)}
footer.foot--water .foot__water{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
footer.foot--water::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--obsidian) 0%,rgba(12,14,16,.35) 45%,rgba(12,14,16,.15) 100%);z-index:0;pointer-events:none}
footer.foot--water .wrap{position:relative;z-index:1}
footer.foot--water::before{z-index:1;background:linear-gradient(180deg,var(--obsidian) 0%,rgba(12,14,16,.55) 40%,rgba(12,14,16,.35) 100%)}
footer.foot--water .wrap{z-index:2}
/* une fois le hero recouvert, on le masque pour de bon : plus aucun flash de l'eau derrière les sections */
.hero.is-gone{visibility:hidden}
.hero.is-gone .hero__water{display:none}
/* logos clients en couleur (plus de gris) ; Green Express = leur logo texte (Cormorant Garamond, comme sur green-express.ch) */
.featured__track li{opacity:1;filter:none}
.featured__track .wm--ge{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:26px;letter-spacing:.08em;color:#fff;text-transform:none}

/* ---------- cartes « dossier » (Pourquoi Ermite) : le rabat glisse au survol et dévoile ce qu'il cache ---------- */
.bene__grid--fold{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;justify-items:center}
.fold{--fw:340px;--fh:452px;--fg:90px;--fgh:200px;--bd:#050607;--fold:#141619;--ink:var(--ivory);--muted:var(--alpine);
  position:relative;width:var(--fw);height:var(--fh);border-radius:34px;border:10px solid var(--bd);background:var(--bd);overflow:hidden;cursor:pointer;outline:none;isolation:isolate}
.fold__bg{position:absolute;inset:0}
.fold--1{--bd:#0A0B0D;--fold:#141619}
.fold--1 .fold__bg{background:radial-gradient(120% 90% at 30% 0%,#FF7A1A 0%,#7a2f05 35%,#1a0d05 70%,#0A0B0D 100%)}
.fold--2{--bd:#D8D1C5;--fold:#F3EEE6;--ink:#111;--muted:#555}
.fold--2 .fold__bg{background:radial-gradient(110% 80% at 70% 0%,#FFB067 0%,#FF7A1A 30%,#3a1a08 70%,#141619 100%)}
.fold--3{--bd:#C45A0C;--fold:#FF7A1A;--ink:#140A03;--muted:#4a2610}
.fold--3 .fold__bg{background:radial-gradient(120% 90% at 40% 0%,#F3EEE6 0%,#c9b9a3 25%,#3b2c22 60%,#0A0B0D 100%)}
.fold__reveal{position:absolute;left:50%;top:16px;width:270px;transform:translate(-50%,0) rotate(0deg);transform-origin:50% 50%;transition:transform .9s cubic-bezier(.34,1.56,.64,1);z-index:1}
.fold__reveal .ui-list,.fold__reveal .ui-files,.fold__reveal .ui-chat{margin:0}
.fold__fg{position:absolute;left:0;right:0;top:var(--fg);height:900px;color:var(--ink);transition:top .9s cubic-bezier(.34,1.56,.64,1);z-index:2}
.fold__tab{position:absolute;left:0;top:0;width:160px;height:34px;fill:var(--fold);display:block}
.fold__body{position:absolute;left:0;right:0;top:32px;bottom:0;background:var(--fold);border-top-right-radius:22px}
.fold__num{position:absolute;left:22px;top:-12px;font-family:var(--head);font-weight:500;font-size:50px;letter-spacing:-.03em;line-height:1;color:var(--ink)}
.fold__arrow{position:absolute;right:22px;top:14px;width:20px;height:20px;color:var(--ink)}
.fold__arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fold__text{position:absolute;left:22px;right:22px;top:calc(var(--fh) - var(--fg) - 20px - 32px);transform:translateY(-100%);transition:top .9s cubic-bezier(.34,1.56,.64,1)}
.fold__text h3{margin:0 0 6px;font-family:var(--head);font-weight:600;font-size:17px;letter-spacing:-.01em;color:var(--ink)}
.fold__text p{margin:0;font-size:13px;line-height:1.45;color:var(--muted)}
.fold:hover .fold__fg,.fold:focus-visible .fold__fg{top:var(--fgh)}
.fold:hover .fold__text,.fold:focus-visible .fold__text{top:calc(var(--fh) - var(--fgh) - 20px - 32px)}
.fold:hover .fold__reveal,.fold:focus-visible .fold__reveal{transform:translate(-50%,-6px) rotate(-6deg)}
@media (max-width:1100px){.fold{--fw:300px;--fh:400px}.fold__reveal{width:240px;transform:translate(-50%,0) scale(.9)}.fold:hover .fold__reveal{transform:translate(-50%,-6px) rotate(-6deg) scale(.9)}}
@media (max-width:900px){.bene__grid--fold{grid-template-columns:1fr}}
@media (hover:none){.fold__fg{top:var(--fgh)}.fold__text{top:calc(var(--fh) - var(--fgh) - 20px - 32px)}}

/* ---------- formules : « Pricing Flow » reproduit à l'identique (valeurs lues dans le composant) ---------- */
.pf{background:#000;padding:clamp(70px,9vw,120px) 0;font-family:'Manrope',var(--head),sans-serif;color:#fff}
.pf__head{text-align:center;padding:0 16px 24px}
.pf__title{margin:0 auto 12px;font-family:'Instrument Serif',serif;font-weight:400;font-size:52px;letter-spacing:-.03em;line-height:.95;color:#fff;text-transform:none}
.pf__sub{margin:0 auto;max-width:520px;font-size:15px;line-height:1.55;color:rgba(255,255,255,.7)}
.pf__toggle{display:inline-flex;align-items:center;gap:10px;padding:4px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);margin:8px auto 28px;position:relative;left:50%;transform:translateX(-50%)}
.pf__toggle button{border:0;cursor:pointer;padding:8px 16px;border-radius:999px;font:400 15px/1.55 'Manrope',sans-serif;background:transparent;color:rgba(255,255,255,.7);transition:background .25s,color .25s;display:flex;align-items:center;gap:6px}
.pf__toggle button[aria-selected="true"]{background:rgba(255,255,255,.85);color:#171717}
.pf__save{font-size:10px;font-weight:700;padding:3px 7px;border-radius:10px;background:rgba(255,255,255,.16);color:#fff;line-height:1.55}
.pf__toggle button[aria-selected="true"] .pf__save{background:rgba(23,23,23,.12);color:#171717}
.pf__grid{display:flex;align-items:flex-start;gap:18px;width:100%;max-width:980px;margin:0 auto}
.pf__card{flex:1;min-width:220px;width:100%;border-radius:24px;border:1.5px solid rgba(255,255,255,.1);background:rgba(255,255,255,.1);padding:24px 24px 26px;display:flex;flex-direction:column;position:relative;transform:none;transition:box-shadow .25s ease,border-color .25s ease,transform .25s ease}
.pf__card.is-rec{border-color:rgba(255,255,255,.85);transform:translateY(-6px)}
.pf__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);margin:0;font-size:15px;font-weight:400;text-transform:uppercase;color:#171717;background:#fff;padding:4px 12px;border-radius:999px;white-space:nowrap;line-height:1.55;opacity:0;transition:opacity .25s ease;pointer-events:none}
.pf__card.is-rec .pf__badge{opacity:1}
.pf__card h3{margin:0;font-size:15px;font-weight:400;color:#fff;line-height:1.55;font-family:inherit;letter-spacing:0}
.pf__desc{margin:6px 0 0;font-size:15px;color:rgba(255,255,255,.7);line-height:1.55}
.pf__price{display:flex;align-items:baseline;gap:6px;margin:18px 0}
.pf__amt{font-family:'Instrument Serif',serif;font-size:52px;font-weight:400;color:#fff;letter-spacing:-.03em;line-height:.95;transition:opacity .2s ease}
.pf__per{font-size:15px;color:rgba(255,255,255,.7);line-height:1.55;transition:opacity .2s ease}
.pf.is-switching .pf__amt,.pf.is-switching .pf__per{opacity:0}
.pf__cta{display:block;text-align:center;padding:12px 16px;border-radius:999px;font-size:15px;font-weight:400;text-decoration:none;line-height:1.55;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.1);box-sizing:border-box;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.pf__card.is-rec .pf__cta{background:#fff;color:#171717;border-color:#fff}
.pf__feats{display:flex;flex-direction:column;gap:10px;margin:20px 0 0;padding:0;list-style:none}
.pf__feats li{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.55;color:#fff;padding:0}
.pf__feats li::before{display:none}
.pf__chk{color:rgba(255,255,255,.85);margin-top:2px;flex-shrink:0;display:flex}
@media (max-width:900px){.pf__grid{flex-direction:column;align-items:stretch;gap:22px}.pf__card.is-rec{transform:none}.pf__title{font-size:40px}}
.pf__amt{white-space:nowrap}
.pf__amt--txt{font-size:40px}
.pf__price{flex-wrap:wrap}

/* ---------- formules : cartes holographiques (HoloCard) : inclinaison 3D, feuille irisée et reflet qui suivent la souris ---------- */
.pf .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.pf__head,.pf__center{width:100%;display:flex;flex-direction:column;align-items:center}
.pf__toggle{position:static;transform:none;margin:8px 0 28px}
.pf__grid{perspective:1100px;justify-content:center}
.pf__card.holo{--mx:.5;--my:.5;--rx:0deg;--ry:0deg;--foil:linear-gradient(115deg,#FF7A1A 0%,#FFB067 30%,#F3EEE6 55%,#FFD23A 80%,#FF7A1A 100%);
  background:#15141A;border:1px solid rgba(255,255,255,.14);border-radius:18px;overflow:hidden;isolation:isolate;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform;
  transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s cubic-bezier(.22,1,.36,1),border-color .25s ease;
  box-shadow:0 30px 80px rgba(0,0,0,.55),0 8px 24px rgba(0,0,0,.4)}
.pf__card.holo.is-moving{transition:border-color .25s ease}
.pf__card.holo.is-rec{transform:translateY(-6px) rotateX(var(--rx)) rotateY(var(--ry));border-color:rgba(255,255,255,.14)}
.pf__card.holo>i{position:absolute;inset:0;pointer-events:none;border-radius:inherit}
.holo__sheen{background:linear-gradient(90deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,.03) 50%,rgba(255,255,255,0) 75%,rgba(255,255,255,.05) 100%)}
.holo__foil{background:var(--foil);background-size:220% 220%;background-position:calc(50% + (.5 - var(--mx)) * 56%) calc(50% + (var(--my) - .5) * 56%);opacity:.12;mix-blend-mode:screen}
.holo__glare{background:radial-gradient(circle at calc(var(--mx) * 100%) calc(var(--my) * 100%),rgba(255,255,255,.8),transparent 55%);opacity:0;mix-blend-mode:overlay;transition:opacity .3s}
.pf__card.holo:hover .holo__glare{opacity:.35}
.holo__bevel{box-shadow:inset 1px 1px 0 rgba(255,255,255,.18),inset -1px -1px 0 rgba(0,0,0,.4);z-index:5}
.pf__card.holo>*:not(i){position:relative;z-index:2}
.pf__card.holo .pf__badge{position:absolute;z-index:6;background:var(--foil);background-size:300% 300%;background-position:calc(var(--mx) * 100%) calc(var(--my) * 100%);color:#17141F;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.pf__card.holo .pf__amt{background-image:var(--foil);background-size:240% 240%;background-position:calc(50% + (.5 - var(--mx)) * 84%) calc(50% + (var(--my) - .5) * 84%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));font-weight:400}
.pf__card.holo.is-rec .pf__cta{background:var(--foil);background-size:300% 300%;background-position:calc(var(--mx) * 100%) calc(var(--my) * 100%);color:#17141F;border-color:transparent;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.pf__card.holo h3{font-family:var(--mono,monospace);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#C8CDD6;opacity:.85}
@media (hover:none){.pf__card.holo{transform:none!important}.holo__glare{display:none}}
.pf__card.holo{overflow:visible;text-align:left}
.pf__card.holo>i{overflow:hidden}
/* prix en blanc, cartes de même hauteur */
.pf__card.holo .pf__amt{background:none;-webkit-background-clip:initial;background-clip:initial;color:#fff;filter:none;-webkit-text-fill-color:#fff}
.pf__grid{align-items:stretch}
.pf__card{min-height:100%}
.pf__price{min-height:56px}
.pf__desc{min-height:calc(2 * 1.55em)}
@media (max-width:900px){.pf__desc{min-height:0}}
/* remise si payé en une fois : ancien prix barré + badge, visibles seulement en mode « une fois » */
.pf__was,.pf__off{display:none}
.pf[data-mode="once"] .pf__was{display:inline;font-family:'Instrument Serif',serif;font-size:28px;color:rgba(255,255,255,.45);text-decoration:line-through;text-decoration-thickness:2px;margin-right:2px;line-height:.95}
.pf[data-mode="once"] .pf__off{display:inline-block;font-size:10px;font-weight:700;padding:3px 7px;border-radius:10px;background:rgba(255,255,255,.16);color:#fff;line-height:1.55;margin-left:4px;align-self:center}
.pf.is-switching .pf__was,.pf.is-switching .pf__off{opacity:0}
.pf__was,.pf__off{transition:opacity .2s ease}
.pf__deal{display:none;width:100%;align-items:center;gap:8px;margin-bottom:2px;line-height:1.2}
.pf[data-mode="once"] .pf__deal{display:flex}
.pf[data-mode="once"] .pf__was{font-family:'Manrope',sans-serif;font-size:14px;color:rgba(255,255,255,.5);text-decoration-thickness:1.5px;margin:0}
.pf[data-mode="once"] .pf__off{margin:0}
.pf__price{min-height:76px;align-content:flex-end}

/* ---------- FAQ : accordéon en verre, même langage que les formules ---------- */
.fqs{background:#000;padding:clamp(70px,9vw,120px) 0;font-family:'Manrope',var(--head),sans-serif;color:#fff}
.fqs .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.fqs .pf__head{margin-bottom:8px}
.fq{width:100%;max-width:760px;display:flex;flex-direction:column;gap:10px;text-align:left}
.fq__item{border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);box-shadow:inset 1px 1px 0 rgba(255,255,255,.08);transition:background .25s ease,border-color .25s ease}
.fq__item:hover{background:rgba(255,255,255,.09)}
.fq__item.is-open{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22)}
.fq__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;background:none;border:0;cursor:pointer;color:#fff;font:400 17px/1.45 'Manrope',sans-serif;text-align:left;letter-spacing:-.01em}
.fq__ic{position:relative;flex:none;width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);transition:background .25s,transform .35s cubic-bezier(.22,1,.36,1)}
.fq__ic::before,.fq__ic::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:#fff;transform:translate(-50%,-50%)}
.fq__ic::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.fq__item.is-open .fq__ic{background:#fff;transform:rotate(45deg)}
.fq__item.is-open .fq__ic::before,.fq__item.is-open .fq__ic::after{background:#171717}
.fq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.22,1,.36,1)}
.fq__a>div{overflow:hidden}
.fq__a p{margin:0;padding:0 22px 22px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.7);max-width:62ch;opacity:0;transform:translateY(-4px);transition:opacity .3s ease,transform .3s ease}
.fq__item.is-open .fq__a{grid-template-rows:1fr}
.fq__item.is-open .fq__a p{opacity:1;transform:none;transition-delay:.1s}
@media (max-width:600px){.fq__q{padding:16px 16px;font-size:15px}.fq__a p{padding:0 16px 16px}}
/* ---------- réalisations : de vrais appareils partout, mêmes cadres et mêmes animations ---------- */
.work__media img,.wcard img,.case-hero__frame img,.wzoom img,.wgal__cell img,.wmedia__frame img{object-fit:contain;object-position:center;padding:5%;box-sizing:border-box;background:radial-gradient(80% 70% at 50% 60%,rgba(255,122,26,.10),transparent 70%),#0f1215}
.work__media img{aspect-ratio:16/10;width:100%;height:auto}
.wcard img{padding:8% 8% 0;object-position:center bottom}
.wzoom__center img{padding:3%}
.wzoom__col img{padding:6%}
.wmedia__frame img{padding:4%}
/* pages projet : plus de cadres derrière les appareils, seulement l'objet sur le fond */
.work__media img,.wcard img,.case-hero__frame img,.wzoom img,.wgal__cell img,.wmedia__frame img{background:transparent;padding:0}
.case-hero__frame,.wzoom__col,.wzoom__center,.wgal__cell,.wmedia__frame,.work__media{background:transparent;border:0;box-shadow:none;border-radius:0}
.case-hero__frame img,.wzoom__center img,.wmedia__frame img{padding:2%}
.wzoom__col img,.wgal__cell img{padding:4%}
.wcard{background:transparent;border:0}
.work__media:hover{border-color:transparent}
/* pages projet : lien vers le vrai site */
.case-hero__frame{display:block;cursor:pointer}
.case-title__side{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.case-visit{display:inline-flex;align-items:center;gap:10px;padding:10px 6px 10px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:var(--ivory);font-family:var(--head);font-weight:500;font-size:14px;transition:background .25s,border-color .25s}
.case-visit:hover{background:rgba(255,255,255,.1);border-color:rgba(255,176,103,.5)}
.case-visit__host{font-family:var(--mono,monospace);font-size:12px;color:var(--stone)}
.case-visit .arr{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#140A03}
.case-visit .arr svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.case-cta{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:clamp(40px,6vw,70px) var(--pad) 0}
@media (max-width:700px){.case-title__side{align-items:flex-start}}
/* menu : pilule centrée sur l'écran, quelle que soit la largeur du logo et des actions */
@media (min-width:1360px){.pill{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}header.site{justify-content:space-between}}
/* mobile : rien ne dépasse à droite */
@media (max-width:900px){.scard{box-sizing:border-box;max-width:100%;overflow:hidden}.scard>div,.scard__ui{min-width:0;max-width:100%}}
/* FAQ : l'icône passe en orange au survol et à l'ouverture */
.fq__item:hover .fq__ic{background:rgba(255,122,26,.18);border-color:rgba(255,122,26,.5)}
.fq__item:hover .fq__ic::before,.fq__item:hover .fq__ic::after{background:var(--accent)}
.fq__item.is-open .fq__ic,.fq__item.is-open:hover .fq__ic{background:var(--accent);border-color:var(--accent)}
.fq__item.is-open .fq__ic::before,.fq__item.is-open .fq__ic::after,.fq__item.is-open:hover .fq__ic::before,.fq__item.is-open:hover .fq__ic::after{background:#140A03}
.fq__item.is-open{border-color:rgba(255,122,26,.45)}
.fq__item:hover .fq__q,.fq__item.is-open .fq__q{color:var(--amber)}
/* étapes : vrais appareils à la place des mini-interfaces, sans cadre derrière */
.scard__ui{background:transparent;border:0;box-shadow:none;padding:10px;min-height:300px}
.scard__dev{display:block;height:auto;filter:drop-shadow(0 30px 50px rgba(0,0,0,.6))}
.scard__dev--iph{width:min(200px,100%)}
.scard__dev--ipad{width:min(300px,100%)}
.scard__dev--mac{width:min(460px,100%)}
@media (max-width:900px){.scard__ui{min-height:0}.scard__dev--iph{width:160px}.scard__dev--ipad{width:240px}}
.scard__fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px}
.scard__fig figcaption{font-family:var(--mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);text-align:center}
/* ---------- pied de page : typographie et logo plus propres (le fond ne change pas) ---------- */
footer.site{font-family:var(--head);font-size:15px}
.foot__grid{grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px;align-items:start}
.foot__logo{display:inline-flex;align-items:center;gap:14px;margin-bottom:18px}
.foot__logo img:first-child{width:40px;height:40px}
.foot__wordmark{height:22px;width:auto;opacity:.95}
.foot__brand p{margin:0 0 22px;max-width:36ch;font-size:15px;line-height:1.6;color:var(--alpine)}
.foot__cta{display:inline-flex;align-items:center;gap:10px;padding:8px 6px 8px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:var(--ivory);font-weight:500;font-size:14px;transition:background .25s,border-color .25s}
.foot__cta:hover{background:rgba(255,255,255,.1);border-color:rgba(255,176,103,.5)}
.foot__cta .arr{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#140A03}
.foot__cta .arr svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.foot__grid b{font-family:var(--mono,monospace);font-weight:400;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:16px}
.foot__grid a{display:block;padding:5px 0;color:var(--ivory);font-size:15px;line-height:1.4;transition:color .2s}
.foot__grid a:hover{color:var(--amber)}
.foot__line{display:block;padding:5px 0;color:var(--ivory);font-size:15px;line-height:1.4}
.foot__note{display:block;margin-top:10px;font-size:12.5px;color:var(--stone)}
.foot__bottom{padding-top:24px;font-size:12.5px;color:var(--stone);align-items:center}
.foot__legal{display:flex;gap:22px}
.foot__legal a{color:var(--stone);transition:color .2s}.foot__legal a:hover{color:var(--ivory)}
@media (max-width:900px){.foot__grid{grid-template-columns:1fr 1fr;gap:30px}.foot__brand{grid-column:1/-1}}
@media (max-width:520px){.foot__grid{grid-template-columns:1fr}}
.foot__grid a.foot__logo{display:inline-flex;padding:0}
.foot__grid a.foot__cta{display:inline-flex;padding:8px 6px 8px 16px;font-size:14px;color:var(--ivory)}
/* formules : ce qui est inclus ou non, lisible d'un coup d'œil */
.pf__feats li>span{display:flex;flex-direction:column;gap:2px}
.pf__feats li b{font-weight:500;color:#fff}
.pf__feats li small{font-size:12.5px;line-height:1.4;color:rgba(255,255,255,.55)}
.pf__feats li.is-no b{color:rgba(255,255,255,.55);font-weight:400}
.pf__chk--no{color:rgba(255,255,255,.35)}
.pf__feats li.is-no small{color:rgba(255,176,103,.85)}
/* formules : cartes strictement alignées, même hauteur, mêmes lignes */
.pf__card.holo.is-rec{transform:rotateX(var(--rx)) rotateY(var(--ry))}
.pf__desc{height:calc(2 * 1.55em);min-height:0;overflow:hidden}
.pf__price{height:96px;min-height:0;margin:18px 0;align-content:flex-end}
.pf__amt--txt{font-size:44px}
.pf__cta{height:49px;display:flex;align-items:center;justify-content:center}
.pf__feats li{min-height:44px;align-items:flex-start}
@media (max-width:900px){.pf__desc{height:auto}.pf__price{height:auto;min-height:76px}.pf__feats li{min-height:0}}
/* ---------- pages légales ---------- */
.legal__wrap{max-width:760px}
.legal__sec{padding:28px 0;border-top:1px solid var(--line)}
.legal__sec h2{font-family:var(--head);font-weight:600;font-size:22px;letter-spacing:-.01em;margin:0 0 12px;text-transform:none}
.legal__sec p,.legal__sec li{font-size:15.5px;line-height:1.65;color:var(--alpine)}
.legal__sec p+p{margin-top:12px}
.legal__sec ul{margin:12px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.legal__sec b{color:var(--ivory);font-weight:600}
.legal__sec a{color:var(--amber)}
.legal__date{margin-top:28px;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.msg .msg__wa{display:inline-flex;margin-top:14px;height:46px;padding:0 20px;font-size:14px}
.msg.ok{color:var(--ivory);font-size:15px}
/* ---------- 404 : petit jeu ---------- */
.p404__game{margin-top:30px;border-radius:20px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);padding:14px;max-width:920px}
.p404__game canvas{display:block;width:100%;height:auto;border-radius:12px;cursor:pointer;touch-action:manipulation;user-select:none}
.p404__hud{display:flex;gap:26px;align-items:center;padding:12px 6px 0;font-family:var(--mono,monospace);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.p404__hud b{color:var(--amber);margin-left:6px}
.p404__hint{margin-left:auto;text-transform:none;letter-spacing:0;font-family:var(--head);font-size:13px}
/* FAQ : plus grand, mots clés en orange */
.fq{max-width:820px}
.fq__q{font-size:20px;padding:22px 24px}
.fq__a p{font-size:17px;line-height:1.65;color:rgba(255,255,255,.82);max-width:66ch;padding:0 24px 24px}
.fq__a .hl{color:var(--accent);font-weight:600}
@media (max-width:600px){.fq__q{font-size:17px}.fq__a p{font-size:15.5px}}
.fq__a .hl{color:var(--amber)}
/* ---------- pages métier ---------- */
.mt__show{padding-top:0}
.mt__devices{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:0;max-width:1000px;margin:0 auto}
.mt__mac{width:min(760px,78%);height:auto;filter:drop-shadow(0 40px 60px rgba(0,0,0,.6))}
.mt__iph{width:min(210px,22%);height:auto;margin-left:-6%;margin-bottom:-2%;filter:drop-shadow(0 30px 50px rgba(0,0,0,.6));position:relative;z-index:2}
.mt__note{text-align:center;margin:26px auto 0;max-width:70ch;font-size:14px;color:var(--stone);display:flex;flex-direction:column;align-items:center;gap:14px}
.mt__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mt__item{border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);padding:24px 22px;box-shadow:inset 1px 1px 0 rgba(255,255,255,.06)}
.mt__item h3{font-family:var(--head);font-weight:600;font-size:18px;margin:0 0 8px;color:var(--ivory)}
.mt__item p{margin:0;font-size:14.5px;line-height:1.6;color:var(--alpine)}
.mt__others{padding-top:0}
.mt__links{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.mt__links a{padding:10px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:var(--ivory);font-family:var(--head);font-size:14px;transition:border-color .25s,background .25s}
.mt__links a:hover{border-color:rgba(255,176,103,.6);background:rgba(255,255,255,.06)}
@media (max-width:900px){.mt__grid{grid-template-columns:1fr}.mt__mac{width:78%}.mt__iph{width:26%}}
.form__more{margin:4px 0 6px}
.form__more summary{cursor:pointer;list-style:none;font-family:var(--head);font-size:13px;color:var(--stone);padding:6px 0}
.form__more summary::-webkit-details-marker{display:none}
.form__more summary::before{content:"+";display:inline-block;width:18px;color:var(--amber)}
.form__more[open] summary::before{content:"–"}
.form__more .field{margin-top:12px}
.form__hint{font-size:12.5px;color:var(--stone);margin:10px 0 0}
/* témoignages (rendus seulement s'il y en a de vrais) */
.tms__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;max-width:980px;margin:0 auto}
.tm{margin:0;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);padding:26px}
.tm blockquote{margin:0 0 18px;font-family:'Instrument Serif',serif;font-size:22px;line-height:1.35;color:var(--ivory)}
.tm figcaption{display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--stone)}
.tm figcaption b{color:var(--ivory);font-weight:600}
.tm figcaption img{height:28px;width:auto;margin-bottom:8px;align-self:flex-start}
/* ---------- page démos ---------- */
.dms__list{display:flex;flex-direction:column;gap:clamp(40px,6vw,90px)}
.dm{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(24px,4vw,60px);align-items:center}
.dm:nth-child(even) .dm__devices{order:2}
.dm__devices{position:relative;display:flex;align-items:flex-end;justify-content:center}
.dm__mac{width:82%;height:auto;filter:drop-shadow(0 40px 60px rgba(0,0,0,.6))}
.dm__iph{width:24%;height:auto;margin-left:-8%;margin-bottom:-3%;position:relative;z-index:2;filter:drop-shadow(0 30px 50px rgba(0,0,0,.6))}
.dm__body h2{font-family:var(--head);font-weight:600;font-size:clamp(26px,3vw,40px);letter-spacing:-.02em;margin:8px 0 12px;text-transform:none}
.dm__body p{font-size:16px;line-height:1.6;color:var(--alpine);max-width:44ch;margin:0 0 20px}
.dm__cta{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.dm__met{font-size:13px;color:var(--amber);margin-left:6px}
@media (max-width:900px){.dm{grid-template-columns:1fr}.dm:nth-child(even) .dm__devices{order:0}}
.dms .dms__list{margin-top:clamp(30px,4vw,50px)}
.dms__more{margin-top:clamp(50px,7vw,90px);padding-top:clamp(30px,4vw,50px);border-top:1px solid var(--line)}
.dms__more h3{font-family:var(--head);font-weight:600;font-size:clamp(24px,2.6vw,34px);margin:8px 0 12px}
.dms__more .lead{margin-bottom:20px;max-width:60ch}

/* ---------- bibliothèque de composants ---------- */
.lib__nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.lib__nav a{padding:9px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.14);font-family:var(--head);font-size:13px;color:var(--ivory)}
.lib__nav a:hover{border-color:rgba(255,176,103,.6)}
.lib__cat{padding:clamp(30px,4vw,50px) 0}
.lib__cattitle{font-family:var(--head);font-weight:600;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.02em;margin:0 0 20px;text-transform:none}
.lib__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.lib{border-radius:20px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);padding:20px;display:flex;flex-direction:column;gap:16px}
.lib__head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.lib__head h3{font-family:var(--head);font-weight:600;font-size:19px;margin:0 0 6px;color:var(--ivory)}
.lib__head p{margin:0 0 6px;font-size:14px;line-height:1.55;color:var(--alpine)}
.lib__head small{font-family:var(--mono,monospace);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--stone)}
.lib__tag{flex:none;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,176,103,.5);color:var(--amber);white-space:nowrap}
.lib__tag--in{border-color:rgba(47,191,143,.5);color:#2FBF8F}
.lib__live,.lib__img,.lib__none{position:relative;border-radius:14px;background:#0C0E10;border:1px solid rgba(255,255,255,.08);overflow:hidden;min-height:180px;display:flex;align-items:center;justify-content:center;padding:22px}
.lib__img{padding:0}.lib__img img{width:100%;height:auto;display:block}
.lib__none span{font-size:13px;color:var(--stone)}
.lib__pick{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;cursor:pointer;font-family:var(--head);font-weight:600;font-size:14px;color:var(--ivory);padding:10px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.16);transition:background .25s,border-color .25s}
.lib__pick input{appearance:none;width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(255,255,255,.4);display:grid;place-items:center;margin:0}
.lib__pick input:checked{background:var(--accent);border-color:var(--accent)}
.lib__pick input:checked::after{content:"";width:8px;height:8px;border-radius:50%;background:#140A03}
.lib__pick:has(input:checked){background:rgba(255,122,26,.16);border-color:rgba(255,122,26,.6)}
/* rendus en direct : neutraliser les positionnements fixes */
.lib__live .pill{position:static;transform:none}
.lib__pillwrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px;justify-content:center}
.lib__pillwrap .head-right{display:flex}
.lib__tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(360px,100%)}
.lib__tiles .tile{min-height:96px}
.lib__phone{width:280px;height:180px;border-radius:26px;border:1px solid rgba(255,255,255,.14);background:#15171b;position:relative;overflow:hidden}
.lib__hero{text-align:left}.lib__hero h3{font-family:var(--head);font-weight:600;font-size:30px;letter-spacing:-.02em;margin:8px 0 8px}.lib__hero p{color:var(--alpine);margin-bottom:14px}
.lib__featured{width:100%;padding:0}.lib__featured .featured__row{gap:0}
.lib__fold{transform:scale(.72);transform-origin:center;margin:-60px 0}
.lib__pf{padding:0;background:transparent;width:100%}.lib__pf .pf__grid{max-width:340px}
.lib__live .fq{max-width:100%}
.lib__form{width:100%;max-width:420px;display:flex;flex-direction:column;gap:12px}
.lib__reveal{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--head);font-size:22px;font-weight:600}
.lib__reveal .ap{transition-delay:0s}
.lib__bar{position:fixed;left:0;right:0;bottom:0;z-index:90;background:rgba(12,14,16,.9);backdrop-filter:blur(14px);border-top:1px solid rgba(255,255,255,.12);padding:14px 0}
.lib__barin{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--alpine)}
.lib__barin b{color:var(--amber)}.lib__baracts{display:flex;gap:10px}
@media (max-width:900px){.lib__grid{grid-template-columns:1fr}.lib__bar{bottom:70px}}
/* bibliothèque : rendus en direct qui ne dépendent pas de l'état du menu ou du mobile */
.lib__tiles .tile{transform:none;opacity:1;min-height:96px;padding:18px 20px 16px}
.lib__tiles .tile b{font-size:17px}
.lib__mbar{position:absolute;left:14px;right:14px;bottom:14px;display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:6px;padding:6px;border-radius:20px;background:rgba(20,23,26,.72);backdrop-filter:blur(20px) saturate(150%);border:1px solid rgba(255,255,255,.16);box-shadow:0 20px 50px -20px rgba(0,0,0,.9)}
.lib__mbar span{display:flex;align-items:center;justify-content:center;height:44px;border-radius:14px;font-family:var(--head);font-weight:600;font-size:13px;color:var(--ivory)}
.lib__mbar .demo{background:var(--accent);color:#120A03}
.lib__live .ap{opacity:1;transform:none}
main>.lib__bar{position:fixed;z-index:90;background:rgba(12,14,16,.9)}
@media (max-width:900px){.hero__over{bottom:96px}.hero__over .eyebrow{display:none}.hero__over .hero__sub{font-size:14.5px;max-width:32ch;margin-bottom:16px}.hero__over .hero__cta{flex-direction:row;justify-content:center}.hero__over .btn{height:44px;padding:0 16px;font-size:13.5px}}

/* ==================== MOBILE : propreté et transitions (la version ordinateur ne change pas) ==================== */
@media (max-width:900px){
  /* voile sombre sous la barre d'état et la capsule */
  body::before{content:"";position:fixed;left:0;right:0;top:0;height:calc(env(safe-area-inset-top,0px) + 96px);background:linear-gradient(180deg,rgba(12,14,16,.96) 0%,rgba(12,14,16,.8) 55%,transparent 100%);z-index:95;pointer-events:none}
  /* chaque section arrive comme une feuille qui se superpose à la précédente : coins arrondis, ombre, fondu */
  main>section:not(.hero),main>.ticker{position:relative;z-index:1}
  main>section:not(.hero){border-radius:28px 28px 0 0;margin-top:-28px;padding-top:calc(clamp(56px,8vw,110px) + 20px);box-shadow:0 -24px 60px -20px rgba(0,0,0,.85);background:var(--obsidian)}
  main>section.section--panel{background:var(--panel)}
  main>section.pf,main>section.fqs{background:#000}
  main>section:not(.hero)::before{content:"";position:absolute;left:50%;top:12px;width:44px;height:4px;border-radius:2px;background:rgba(255,255,255,.14);transform:translateX(-50%)}
  @supports (animation-timeline: view()){
    main>section:not(.hero){animation:sheetIn linear both;animation-timeline:view();animation-range:entry 0% entry 42%}
    .ap,.reveal{animation:none}
  }
  /* cartes dossier : le rabat plus bas, le contenu caché reste lisible */
  .fold{--fw:min(340px,88vw);--fh:440px;--fgh:236px}
  .fold__reveal{top:12px;width:240px;transform:translate(-50%,0) scale(.92)}
  /* bascule des formules : compacte, sur une ligne */
  .pf__toggle{gap:4px;padding:4px;max-width:100%}
  .pf__toggle button{padding:8px 12px;font-size:13.5px;white-space:nowrap}
  .pf__save{font-size:9.5px;padding:3px 6px;white-space:nowrap}
  .pf__title{font-size:36px}
  /* explorateur : barre d'onglets pleine largeur avec fondu à droite */
  .xp__tabs{padding:0 16px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  /* bande logos et ticker : pas de coins ni de feuille */
  main>.featured{border-radius:0;margin-top:0;padding-top:26px;box-shadow:none;animation:none}
  main>.featured::before{display:none}
}
@keyframes sheetIn{from{opacity:.55;transform:translateY(34px) scale(.985)}to{opacity:1;transform:none}}
@media (max-width:900px){
  body::before{height:calc(env(safe-area-inset-top,0px) + 110px);background:linear-gradient(180deg,rgba(12,14,16,1) 0%,rgba(12,14,16,.92) 45%,transparent 100%)}
  [id]{scroll-margin-top:100px}
}
@media (max-width:900px){main>section.pin,main>section.dms{padding-top:64px}}
/* plus de portrait : l'emblème à la place */
.quote__mark{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);flex:none}
.quote__mark img{width:30px;height:30px}
.founder__media--mark{display:grid;place-items:center;aspect-ratio:1/1;border-radius:24px;background:radial-gradient(70% 70% at 50% 40%,rgba(255,122,26,.22),transparent 70%),var(--panel);border:1px solid rgba(255,255,255,.08)}
.founder__media--mark img{width:42%;height:auto;filter:drop-shadow(0 20px 40px rgba(255,122,26,.35))}
.founder{grid-template-columns:1fr;max-width:760px}
/* ---------- mobile : cartes qui se superposent au défilement, formules qui défilent vers la gauche ---------- */
@media (max-width:900px){
  /* cartes dossier : empilement collant */
  .bene__grid--fold{display:flex;flex-direction:column;gap:22px;align-items:center}
  .bene__grid--fold .fold{position:sticky;top:calc(env(safe-area-inset-top,0px) + 108px);box-shadow:0 -20px 50px -10px rgba(0,0,0,.8)}
  .bene__grid--fold .fold--1{z-index:1}.bene__grid--fold .fold--2{z-index:2;top:calc(env(safe-area-inset-top,0px) + 120px)}.bene__grid--fold .fold--3{z-index:3;top:calc(env(safe-area-inset-top,0px) + 132px)}
  .bene__grid--fold::after{content:"";display:block;height:30vh}
  /* étapes 01 à 04 : empilement collant */
  .sstack{display:flex;flex-direction:column;gap:22px}
  .sstack .scard{position:sticky!important;top:calc(env(safe-area-inset-top,0px) + 104px)!important;box-shadow:0 -20px 50px -10px rgba(0,0,0,.85)}
  .sstack .scard--1{z-index:1}.sstack .scard--2{z-index:2;top:calc(env(safe-area-inset-top,0px) + 116px)!important}.sstack .scard--3{z-index:3;top:calc(env(safe-area-inset-top,0px) + 128px)!important}.sstack .scard--4{z-index:4;top:calc(env(safe-area-inset-top,0px) + 140px)!important}
  .sstack .scard .prism{display:none}
  .sstack-end{height:30vh}
  /* formules : défilement horizontal, une carte par écran, aimantées */
  .pf .wrap{overflow:visible}
  .pf__grid{flex-direction:row;align-items:stretch;gap:14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:14px 8vw 24px;margin:0 calc(-1 * var(--pad,20px));scroll-padding:0 8vw}
  .pf__grid::-webkit-scrollbar{display:none}
  .pf__card{flex:0 0 84vw;max-width:84vw;scroll-snap-align:center;scroll-snap-stop:always}
  .pf__hint{display:block;text-align:center;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-top:-6px}
}
@media (min-width:901px){.pf__hint{display:none}}
@media (max-width:900px){.pf__card{scroll-snap-align:start}.pf__grid{scroll-padding-left:8vw}}
@media (max-width:900px){.pf__grid{justify-content:flex-start}}
}
}
@media (max-width:900px){.pf__grid{overflow-x:auto;scroll-snap-type:x mandatory;transform:none!important}.pf__card{scroll-snap-align:start}.pf__stage{position:static;display:flex;flex-direction:column;align-items:center;width:100%}}
@media (max-width:900px){.pf__stage{width:100%;max-width:100%;align-self:stretch}.pf__grid{width:100vw;max-width:100vw;margin:0 calc(50% - 50vw);box-sizing:border-box;padding:14px 8vw 20px}}
/* mobile : plus de feuilles ni de poignée, les sections se fondent l'une dans l'autre */
@media (max-width:900px){
  main>section:not(.hero){border-radius:0;margin-top:0;box-shadow:none;padding-top:clamp(56px,8vw,90px)}
  main>section:not(.hero)::before{display:none}
  main>section.pin,main>section.dms{padding-top:56px}
  main>section:not(.hero)::after{content:"";position:absolute;left:0;right:0;top:-70px;height:70px;background:linear-gradient(180deg,transparent,var(--obsidian));pointer-events:none}
  main>section.section--panel::after{background:linear-gradient(180deg,transparent,var(--panel))}
  main>section.pf::after,main>section.fqs::after{background:linear-gradient(180deg,transparent,#000)}
  main>.featured::after{display:none}
  @supports (animation-timeline: view()){main>section:not(.hero){animation-name:fadeIn}}
}
@keyframes fadeIn{from{opacity:.35}to{opacity:1}}
/* ---------- mobile : fluidité (moins de flou, d'ombres et d'animations invisibles) ---------- */
@media (max-width:900px){
  .menu:not(.open) .fx i,.menu:not(.open) .tile{animation-play-state:paused}
  .mobile-bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
  .bene__grid--fold .fold,.sstack .scard{box-shadow:0 -10px 30px -12px rgba(0,0,0,.7);will-change:transform}
  .scard .prism{display:none}
  .pf__card.holo{box-shadow:0 14px 40px rgba(0,0,0,.45);transform:none!important}
  .holo__glare,.holo__sheen{display:none}
  .fold{box-shadow:none}
  .hero--water .hero__water{will-change:transform}
  .pf__save{font-size:10.5px}
  .foot__grid a{padding:8px 0}
  .featured__track ul{animation-duration:46s}
  /* bibliothèque : rien ne dépasse */
  .lib__grid>*{min-width:0}
  .lib{overflow:hidden}
  .lib__live{overflow:hidden;padding:16px}
  .lib__pillwrap .head-right .cta-pill{display:none}
  .lib__fold{transform:scale(.62);margin:-80px 0}
}
@media (max-width:900px) and (prefers-reduced-motion:no-preference){.featured__track ul{animation-timing-function:linear}}
/* mobile : empilement des étapes sans à-coup */
@media (max-width:900px){
  main>section:has(.sstack),main>section:has(.bene__grid--fold),main>section.pin{animation:none!important}
  .sstack{gap:16px}
  .sstack .scard{max-height:calc(100svh - 150px);overflow:hidden;min-height:0;padding:22px 20px;gap:14px;transition:none;transform:translateZ(0);backface-visibility:hidden;box-shadow:0 -8px 24px -10px rgba(0,0,0,.6)}
  .sstack .scard>div:first-child p{font-size:14.5px;line-height:1.5}
  .sstack .scard .n{font-size:40px}
  .sstack .scard h3{font-size:24px}
  .scard__ui{min-height:0;padding:0}
  .scard__fig{gap:8px}
  .scard__dev--iph{width:120px}.scard__dev--ipad{width:180px}.scard__dev--mac{width:min(300px,100%)}
  .scard__fig figcaption{font-size:10px}
  .sstack .scard--1{top:calc(env(safe-area-inset-top,0px) + 100px)!important}.sstack .scard--2{top:calc(env(safe-area-inset-top,0px) + 108px)!important}.sstack .scard--3{top:calc(env(safe-area-inset-top,0px) + 116px)!important}.sstack .scard--4{top:calc(env(safe-area-inset-top,0px) + 124px)!important}
  .sstack-end{height:20vh}
  .bene__grid--fold .fold{transition:none;transform:translateZ(0)}
}
/* ---------- mobile : pied de page compact ---------- */
@media (max-width:900px){
  footer.site{padding:44px 0 calc(90px + env(safe-area-inset-bottom,0px))}
  .foot__grid{display:flex;flex-direction:column;gap:22px;margin-bottom:22px}
  .foot__brand{grid-column:auto}
  .foot__logo{margin-bottom:10px}
  .foot__logo img:first-child{width:30px;height:30px}
  .foot__wordmark{height:16px}
  .foot__brand p{font-size:14px;line-height:1.5;margin-bottom:14px;max-width:none}
  .foot__grid>div:not(.foot__brand){display:none}
  .foot__row{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}
  .foot__row a{padding:6px 0;color:var(--ivory)}
  .foot__meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--stone);margin-top:6px}
  .foot__meta a{color:var(--alpine)}
  .foot__bottom{flex-direction:column;gap:6px;align-items:flex-start;padding-top:16px;font-size:12px}
  .foot__legal{gap:14px}
}
@media (min-width:901px){.foot__row,.foot__meta{display:none}}
@media (max-width:900px){footer.site{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}.foot__brand p{margin-bottom:10px}.foot__row{gap:4px 16px}.foot__meta{margin-top:0}}

/* ---------- menu tuiles : obsidienne + icônes 3D orange, fumée au survol ---------- */
.tile,.tile--home,.tile--services,.tile--work,.tile--method,.tile--agency{background:radial-gradient(120% 90% at 20% 0%,rgba(255,122,26,.18),transparent 55%),#15171B;color:var(--ivory);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 20px 50px -30px rgba(0,0,0,.9)}
.tile--contact{background:radial-gradient(120% 90% at 20% 0%,rgba(255,200,140,.35),transparent 55%),#FF7A1A;color:#140A03;border-color:rgba(255,255,255,.2)}
.tile--contact b{color:#140A03}
.tile .fx{display:none}
.tile__ico{width:72px;height:72px;filter:drop-shadow(0 14px 22px rgba(255,122,26,.35));transform-style:preserve-3d;animation:icoFloat 5.5s ease-in-out infinite;transition:transform .5s cubic-bezier(.22,1,.36,1),filter .5s}
.tile--wide .tile__ico{width:80px;height:80px}
.tile:nth-child(2) .tile__ico{animation-delay:-1.2s}.tile:nth-child(3) .tile__ico{animation-delay:-2.4s}.tile:nth-child(4) .tile__ico{animation-delay:-3.1s}.tile:nth-child(5) .tile__ico{animation-delay:-4.3s}.tile:nth-child(6) .tile__ico{animation-delay:-.7s}
@keyframes icoFloat{0%,100%{transform:translateY(0) rotateY(-8deg) rotateX(4deg)}50%{transform:translateY(-7px) rotateY(10deg) rotateX(-4deg)}}
.tile:hover .tile__ico,.tile:active .tile__ico{transform:translateY(-10px) scale(1.12) rotateY(0) rotateX(0);filter:drop-shadow(0 22px 34px rgba(255,122,26,.6)) brightness(1.1)}
/* fumée : trois volutes floues qui montent et se dissipent au survol / au toucher */
.tile__smoke{position:absolute;left:52px;bottom:46%;width:80px;height:120px;pointer-events:none;opacity:0;transition:opacity .3s}
.tile__smoke i{position:absolute;left:0;bottom:0;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle,rgba(255,176,103,.55),rgba(255,122,26,.25) 45%,transparent 70%);filter:blur(10px);opacity:0}
.tile--contact .tile__smoke i{background:radial-gradient(circle,rgba(255,255,255,.7),rgba(255,230,200,.3) 45%,transparent 70%)}
.tile:hover .tile__smoke,.tile:active .tile__smoke,.tile:focus-visible .tile__smoke{opacity:1}
.tile:hover .tile__smoke i,.tile:active .tile__smoke i,.tile:focus-visible .tile__smoke i{animation:smoke 2.2s ease-out infinite}
.tile__smoke i:nth-child(2){left:18px;animation-delay:.7s!important;width:38px;height:38px}
.tile__smoke i:nth-child(3){left:-8px;animation-delay:1.4s!important;width:52px;height:52px}
@keyframes smoke{0%{transform:translate(0,0) scale(.5);opacity:0}15%{opacity:.9}100%{transform:translate(14px,-110px) scale(1.9);opacity:0}}
.menu.open .tile{animation:none}
@media (prefers-reduced-motion:reduce){.tile__ico{animation:none}.tile__smoke{display:none}}
@media (max-width:900px){.menu:not(.open) .tile__ico{animation-play-state:paused}.tile{min-height:150px;padding:22px 22px 20px}.tile--wide{min-height:140px}.tile__ico{width:60px;height:60px}.tile--wide .tile__ico{width:68px;height:68px}}
/* icônes officielles Ermite (traits orange, fond noir) : lueur au lieu de l'ombre, plus grandes */
.tile__ico{width:84px;height:84px;filter:drop-shadow(0 0 14px rgba(255,122,26,.35))}
.tile--wide .tile__ico{width:92px;height:92px}
.tile:hover .tile__ico,.tile:active .tile__ico{filter:drop-shadow(0 0 22px rgba(255,122,26,.75)) brightness(1.15)}
.tile--contact .tile__ico{filter:drop-shadow(0 0 14px rgba(20,10,3,.5))}
@media (max-width:900px){.tile__ico{width:68px;height:68px}.tile--wide .tile__ico{width:74px;height:74px}}
/* ---------- audit multi-écrans : correctifs ---------- */
/* bibliothèque : les rendus en direct ne débordent jamais de leur carte */
.lib__grid>*{min-width:0}
.lib{overflow:hidden}
.lib__live{overflow:hidden;max-width:100%}
.lib__pillwrap{max-width:100%}
.lib__head{min-width:0}.lib__head>div{min-width:0}
.lib__tag{max-width:46%;white-space:normal;text-align:right}
/* explorateur : petits écrans d'ordinateur (1024 à 1200) : vignettes réduites, carte plus étroite */
@media (min-width:901px) and (max-width:1200px){.xthumb{width:150px;height:150px}.xp{--card-w:520px;--card-h:470px}.xcard__media{height:330px}.xcard__body{top:348px}}
/* téléphones pliants et très étroits (280 à 360 px) */
@media (max-width:360px){
  html{font-size:15px}
  .wrap{padding-left:14px;padding-right:14px}
  .eyebrow{white-space:normal;letter-spacing:.12em;font-size:10px}
  .lead,.hero__sub{font-size:14px}
  .hero__over .hero__cta{flex-direction:column;align-items:stretch}
  .hero__over .btn{width:100%}
  .btn{max-width:100%;white-space:normal;height:auto;min-height:44px;padding:10px 14px;text-align:center}
  .pf__toggle{flex-wrap:wrap;justify-content:center;border-radius:20px}
  .pf__toggle button{padding:7px 10px;font-size:12.5px}
  .pf__save{display:none}
  .pf__card{flex-basis:88vw;max-width:88vw}
  .pf__title,.fq__q{font-size:26px}
  .fq__q{font-size:15px;padding:16px 14px}
  .form{padding:16px}
  .mobile-bar{grid-template-columns:1fr 1fr 1.2fr;left:8px;right:8px}
  .mobile-bar a{font-size:12px;height:44px}
  header.site{left:8px;right:8px}
  .fold{--fw:calc(100vw - 28px)}
  .lib__nav a{font-size:12px;padding:7px 10px}
}
@media (max-width:300px){.hero__over .hero__proof{display:none}.mobile-bar{grid-template-columns:1fr 1fr}.mobile-bar a.demo{grid-column:1/-1}}
@media (max-width:900px){.phones,.phones__inner{overflow-x:clip}.phones__duo{flex-wrap:nowrap;padding-bottom:46px}.phone{max-width:none}}
/* explorateur : barre d'onglets défilable dès que l'écran est trop étroit pour les 6 onglets */
@media (max-width:1200px){.xp__tabs{overflow-x:auto;justify-content:flex-start;padding:0 20px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 90%,transparent);mask-image:linear-gradient(90deg,#000 90%,transparent)}.xp__tabs::-webkit-scrollbar{display:none}.xp__bar{flex:none}.xp__bar button{font-size:13px;padding:0 12px}}

/* ---------- typographie unifiée : Bebas Neue (grands titres), Manrope (titres, boutons, chiffres), Inter (texte), mono (étiquettes) ---------- */
:root{--mono:'SF Mono',ui-monospace,Menlo,monospace}
.pf,.fqs,footer.site,.pf__toggle button,.fq__q,.pf__cta,.xp__bar button,.foot__cta,.lib__pick,.lib__nav a,.mt__links a,.case-visit{font-family:var(--sans)}
.pf__title{font-family:'Bebas Neue',var(--head);font-weight:400;font-size:clamp(44px,5.4vw,72px);letter-spacing:.01em;line-height:.95;text-transform:uppercase}
.pf__sub,.pf__desc,.pf__per,.pf__feats li,.pf__feats li small,.fq__a p,.foot__brand p,.lib__head p,.mt__item p,.dm__body p{font-family:var(--sans)}
.pf__amt,.pf__amt--txt{font-family:var(--head);font-weight:600;font-size:48px;letter-spacing:-.03em;line-height:1}
.pf__amt--txt{font-size:34px}
.pf__card h3,.pf__badge,.pf__cta,.pf__toggle button,.fq__q,.foot__cta,.lib__pick,.dm__body h2,.mt__item h3,.lib__head h3,.tm figcaption b{font-family:var(--head)}
.tm blockquote{font-family:var(--head);font-weight:500;font-size:20px}
.pf__badge{font-family:var(--mono);font-size:11px;letter-spacing:.14em;font-weight:500}
@media (max-width:900px){.pf__title{font-size:40px}.pf__amt{font-size:42px}}
@media (max-width:360px){.pf__title{font-size:34px}}
/* logo d'en-tête : emblème plus grand + logotype ERMITE du logo officiel */
.brand{gap:14px}
.brand img:first-child{width:48px;height:48px}
.brand__wm{height:22px;width:auto;display:block}
.brand b{display:none}
.site__name img{height:14px;width:auto;display:block;opacity:.95}
@media (max-width:1100px){.brand img:first-child{width:40px;height:40px}.brand__wm{display:none}}
.brand img.brand__wm{height:22px;width:auto}
@media (max-width:1100px){.brand img.brand__wm{display:none}}

/* ======================================================================
   BIBLIOTHÈQUE — aperçus vivants des composants repris de YHY, NEvents,
   SLA et Authentic Aesthetic, rejoués aux couleurs Ermite. Espace « lb- ».
   ====================================================================== */
.lib__live>[class^="lb-"]{width:100%}
.lb-lab{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);display:block}
.lb-stars{color:var(--amber);letter-spacing:2px;font-size:12px}
.lb-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(255,122,26,.16);display:inline-block;flex:0 0 auto}
.lb-dot--live{animation:lbPulse 1.8s ease-in-out infinite}
@keyframes lbPulse{0%,100%{box-shadow:0 0 0 4px rgba(255,122,26,.20)}50%{box-shadow:0 0 0 9px rgba(255,122,26,.05)}}
.lb-btn{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 16px;border-radius:10px;font-size:12px;font-weight:600;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);color:var(--ivory)}
.lb-btn--acc{background:var(--accent);border-color:var(--accent);color:#0C0E10}
.lb-chip{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 12px;border-radius:999px;font-size:11px;font-weight:600;
  color:var(--amber);border:1px solid rgba(255,176,103,.4);background:rgba(255,176,103,.08);width:max-content}

/* menu en arborescence (SLA) */
.lb-tree{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;align-items:start;text-align:left}
.lb-tree__tog{display:flex;align-items:center;justify-content:space-between;width:100%;padding:11px 0;border-bottom:1px solid var(--line);
  font-family:var(--head);font-size:17px;font-weight:600;color:var(--ivory)}
.lb-tree__tog i{width:7px;height:7px;border-right:1.5px solid var(--stone);border-bottom:1.5px solid var(--stone);transform:rotate(45deg);transition:transform .3s var(--ease)}
.lb-tree__tog.is-open{color:var(--amber)}.lb-tree__tog.is-open i{transform:rotate(-135deg);border-color:var(--amber)}
.lb-tree__sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s var(--ease)}
.lb-tree__tog.is-open+.lb-tree__sub{grid-template-rows:1fr}
.lb-tree__sub>div{overflow:hidden;display:flex;flex-direction:column}
.lb-tree__sub a{padding:7px 0 7px 14px;font-size:13.5px;color:var(--alpine);border-left:1px solid var(--line);margin-left:2px;transition:color .2s,border-color .2s}
.lb-tree__sub a:hover{color:var(--accent);border-color:var(--accent)}
.lb-tree__side{display:flex;flex-direction:column;gap:9px;padding:16px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.lb-tree__side a{font-size:13.5px;color:var(--ivory)}.lb-tree__side a:hover{color:var(--accent)}

/* sélecteur de langue (SLA) */
.lb-lang{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px}
.lb-lang__sel{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 16px;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);font-size:11px;font-weight:700;letter-spacing:.09em}
.lb-lang__sel i{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .3s}
.lb-lang.is-open .lb-lang__sel i{transform:translateY(1px) rotate(-135deg)}
.lb-lang__list{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s var(--ease);width:170px}
.lb-lang.is-open .lb-lang__list{grid-template-rows:1fr}
.lb-lang__list>*{overflow:hidden}
.lb-lang__list span{display:block;padding:8px 14px;font-size:13px;color:var(--alpine);border-radius:9px}
.lb-lang__list span.is-on{color:#0C0E10;background:var(--accent);font-weight:600}
.lb-lang__list span:not(.is-on):hover{background:rgba(255,255,255,.07)}

/* bandeau d'annonce (SLA) */
.lb-ann{width:100%;border-radius:10px;overflow:hidden;background:linear-gradient(90deg,#8A3A08,var(--accent) 52%,#8A3A08)}
.lb-ann__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px;min-height:40px;padding:8px 14px;
  color:#120A03;font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.lb-ann__in .lb-dot{background:#120A03;box-shadow:0 0 0 4px rgba(18,10,3,.18)}
.lb-ann__in a{text-decoration:underline;text-underline-offset:3px}

/* ouverture photo + note Google (Authentic Aesthetic) */
.lb-hp{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/10;min-height:210px}
.lb-hp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lb-hp::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,14,16,.15),rgba(12,14,16,.82))}
.lb-hp__txt{position:absolute;left:20px;top:20px;z-index:2}
.lb-hp__txt h3{font-size:clamp(22px,3vw,30px);margin-top:8px}
.lb-hp__badge{position:absolute;left:20px;bottom:18px;z-index:2;display:flex;align-items:center;gap:11px;padding:11px 15px;border-radius:13px;
  background:rgba(243,238,230,.96);color:#14161A;box-shadow:0 16px 34px rgba(0,0,0,.4)}
.lb-hp__note{font-family:var(--head);font-size:26px;font-weight:600;line-height:1}
.lb-hp__badge small{display:block;font-size:10.5px;color:#5C5952;margin-top:2px}
.lb-hp__badge .lb-stars{color:#8A7A5E}

/* ouverture affiche (NEvents) */
.lb-aff{text-align:left;padding:4px}
.lb-aff__top{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--amber)}
.lb-aff__date{font-family:'Bebas Neue',var(--head);font-size:clamp(56px,9vw,92px);line-height:.82;letter-spacing:.01em;margin:12px 0 2px}
.lb-aff__date span{font-size:.42em;color:var(--accent)}
.lb-aff h3{font-size:clamp(22px,3vw,30px);text-transform:uppercase;letter-spacing:-.01em}
.lb-aff__meta{font-size:12.5px;color:var(--stone);margin:8px 0 16px}
.lb-aff__cta{display:flex;gap:10px;flex-wrap:wrap}

/* explorateur vertical (SLA) */
.lb-vx{display:grid;grid-template-columns:1.3fr .7fr;border-radius:16px;overflow:hidden;border:1px solid var(--line);min-height:260px}
.lb-vx__stage{position:relative;padding:22px;display:grid;align-items:end;overflow:hidden;
  background:radial-gradient(circle at 84% 16%,rgba(255,122,26,.42),transparent 34%),linear-gradient(145deg,#141619,#1E1512)}
.lb-vx__count{position:absolute;top:-26px;right:12px;font-family:'Bebas Neue',var(--head);font-size:clamp(120px,17vw,200px);line-height:1;
  color:rgba(243,238,230,.07);transition:opacity .25s,transform .35s var(--ease)}
.lb-vx__stage::after{content:"";position:absolute;right:-70px;bottom:-110px;width:260px;height:260px;border:1px solid rgba(255,255,255,.12);border-radius:50%;
  box-shadow:0 0 0 34px rgba(255,255,255,.02),0 0 0 68px rgba(255,255,255,.015)}
.lb-vx__panels{position:relative;z-index:1;display:grid;align-items:end}
.lb-vx__p{grid-area:1/1;opacity:0;pointer-events:none}
.lb-vx__p.is-active{opacity:1;pointer-events:auto;animation:lbPanelIn .42s cubic-bezier(.2,.75,.3,1) both}
@keyframes lbPanelIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.lb-vx__p>p{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:10px}
.lb-vx__p h3{font-size:clamp(22px,2.8vw,32px);line-height:1;letter-spacing:-.03em;margin-bottom:10px}
.lb-vx__p blockquote{font-size:13.5px;line-height:1.5;color:rgba(243,238,230,.74)}
.lb-vx__tabs{display:grid;align-content:center;gap:6px;padding:14px;background:rgba(255,255,255,.03)}
.lb-vx__tabs button{display:grid;grid-template-columns:26px 1fr 10px;align-items:center;gap:11px;padding:13px 12px;border-radius:12px;text-align:left;
  color:var(--stone);transition:color .22s,background-color .22s,transform .22s}
.lb-vx__tabs button em{font-family:'Bebas Neue',var(--head);font-style:normal;font-size:17px}
.lb-vx__tabs button span{font-size:13px;font-weight:600;line-height:1.2}
.lb-vx__tabs button i{width:6px;height:6px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);opacity:.6}
.lb-vx__tabs button:hover{color:var(--ivory);background:rgba(255,255,255,.06);transform:translateX(-3px)}
.lb-vx__tabs button[aria-selected="true"]{color:#0C0E10;background:var(--accent);box-shadow:0 12px 26px rgba(255,122,26,.24)}

/* lignes de différenciation (SLA) */
.lb-diff{display:flex;flex-direction:column;gap:10px;text-align:left}
.lb-diff__row{display:grid;grid-template-columns:44px 1fr;gap:12px 14px;padding:16px;border-radius:14px;border:1px solid var(--line);
  background:rgba(255,255,255,.03);transition:transform .3s var(--ease),border-color .3s}
.lb-diff__row:hover{transform:translateY(-2px)}
.lb-diff__n{font-family:'Bebas Neue',var(--head);font-size:34px;line-height:.85}
.lb-diff__t span{font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.lb-diff__t strong{display:block;font-family:var(--head);font-size:17px;font-weight:600;line-height:1.15;letter-spacing:-.02em;margin-top:5px}
.lb-diff__row p{grid-column:2;font-size:13px;color:var(--stone)}
.lb-diff__row--a .lb-diff__n,.lb-diff__row--a .lb-diff__t span{color:var(--accent)}
.lb-diff__row--a:hover{border-color:rgba(255,122,26,.45)}
.lb-diff__row--b .lb-diff__n,.lb-diff__row--b .lb-diff__t span{color:var(--turq)}
.lb-diff__row--b:hover{border-color:rgba(57,194,194,.45)}
.lb-diff__row--c .lb-diff__n,.lb-diff__row--c .lb-diff__t span{color:var(--amber)}
.lb-diff__row--c:hover{border-color:rgba(255,176,103,.45)}

/* parcours de niveaux (SLA) */
.lb-lvl{text-align:left;padding:16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.lb-lvl__top{margin-bottom:12px}.lb-lvl__top b{font-family:var(--head);font-size:17px;display:block;margin-top:5px}
.lb-lvl__step{display:grid;grid-template-columns:46px 1fr;gap:13px;align-items:center;padding:11px;border-radius:12px;border-top:1px solid var(--line)}
.lb-lvl__step.is-active{background:rgba(255,122,26,.14);border-top-color:transparent}
.lb-lvl__code{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.07);
  font-size:14px;font-weight:700;color:var(--stone)}
.lb-lvl__step.is-active .lb-lvl__code{background:var(--accent);color:#0C0E10}
.lb-lvl__step b{font-size:14.5px;font-weight:600}
.lb-lvl__step small{display:block;font-size:11.5px;color:var(--stone)}

/* cadran de progression (SLA) */
.lb-dial{position:relative;display:grid;place-items:center;gap:14px;padding:6px 0}
.lb-dial__ring{position:relative;width:150px;height:150px;border-radius:50%;border:1px solid rgba(255,255,255,.14);display:grid;place-items:center}
.lb-dial__ring i{position:absolute;inset:9%;border:1px dashed rgba(255,255,255,.18);border-radius:50%;animation:lbOrbit 36s linear infinite}
.lb-dial__ring b{position:absolute;inset:44%;border-radius:50%;background:var(--accent);box-shadow:0 0 0 10px rgba(255,122,26,.14);transition:box-shadow .3s}
.lb-dial__mid{position:absolute;top:56px;display:grid;place-items:center;text-align:center;pointer-events:none}
.lb-dial__n{font-family:'Bebas Neue',var(--head);font-size:38px;line-height:1;color:var(--ivory)}
.lb-dial__l{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone)}
.lb-dial__steps{display:flex;gap:7px}
.lb-dial__steps button{width:34px;height:30px;border-radius:9px;font-size:12px;font-weight:700;color:var(--stone);background:rgba(255,255,255,.06);border:1px solid var(--line)}
.lb-dial__steps button.is-on{color:#0C0E10;background:var(--accent);border-color:var(--accent)}
@keyframes lbOrbit{to{transform:rotate(360deg)}}

/* mosaïque média (NEvents) */
.lb-mos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lb-mos__t{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);aspect-ratio:1;background:#0A0B0C}
.lb-mos__t--wide{grid-column:1/-1;aspect-ratio:16/7}
.lb-mos__t img{width:100%;height:100%;object-fit:cover;transition:transform .65s var(--ease)}
.lb-mos__t:hover img{transform:scale(1.05)}
.lb-mos__t figcaption{position:absolute;left:10px;bottom:9px;font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 9px;border-radius:7px;background:rgba(12,14,16,.72);backdrop-filter:blur(6px)}

/* frise chronologique (NEvents) */
.lb-tl{text-align:left;border-top:1px solid var(--line)}
.lb-tl li{display:grid;grid-template-columns:62px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.lb-tl time{font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--accent)}
.lb-tl h4{font-family:var(--head);font-size:15.5px;font-weight:600;margin-bottom:4px}
.lb-tl p{font-size:12.5px;color:var(--stone)}

/* prestations par famille (Authentic Aesthetic) */
.lb-presta{text-align:left}
.lb-presta__h{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 0;border-bottom:1px solid var(--line);
  font-family:var(--head);font-size:17px;font-weight:600}
.lb-presta__h i{width:7px;height:7px;border-right:1.5px solid var(--stone);border-bottom:1.5px solid var(--stone);transform:rotate(45deg);transition:transform .3s var(--ease)}
.lb-presta__h.is-open{color:var(--amber)}.lb-presta__h.is-open i{transform:rotate(-135deg);border-color:var(--amber)}
.lb-presta__b{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s var(--ease)}
.lb-presta__h.is-open+.lb-presta__b{grid-template-rows:1fr}
.lb-presta__b>div{overflow:hidden}
.lb-presta__b p{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:baseline;padding:9px 0;border-bottom:1px dashed rgba(243,238,230,.1);font-size:13.5px}
.lb-presta__b b{font-weight:600}
.lb-presta__b span{font-size:11.5px;color:var(--stone)}
.lb-presta__b em{font-style:normal;font-weight:600;color:var(--amber);font-variant-numeric:tabular-nums}

/* tarifs compacts (SLA) */
.lb-rates{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.lb-rates article{padding:15px;border-radius:13px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-align:left}
.lb-rates article.is-feat{border-color:rgba(255,122,26,.5);background:rgba(255,122,26,.09)}
.lb-rates b{display:block;font-family:'Bebas Neue',var(--head);font-size:32px;line-height:1;margin:8px 0 7px}
.lb-rates article.is-feat b{color:var(--accent)}
.lb-rates p{font-size:11.5px;color:var(--stone);line-height:1.4}

/* fiche en modale (YHY) */
.lb-fiche{position:relative}
.lb-fiche__card{display:block;width:100%;text-align:left;border-radius:14px;overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(160deg,#181B1E,#101214);padding-bottom:14px;transition:transform .35s var(--ease),border-color .35s}
.lb-fiche__card:hover{transform:translateY(-3px);border-color:rgba(255,122,26,.45)}
.lb-fiche__card img{width:100%;height:120px;object-fit:cover;object-position:top;margin-bottom:12px}
.lb-fiche__card>.lb-lab,.lb-fiche__card>b,.lb-fiche__card>.lb-fiche__more{padding-inline:14px}
.lb-fiche__card b{display:block;font-family:var(--head);font-size:18px;font-weight:600;margin-top:4px}
.lb-fiche__more{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:12px;font-weight:600;color:var(--accent)}
.lb-fiche__more i{width:6px;height:6px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.lb-fiche__modal{position:absolute;inset:-22px;z-index:5;display:grid;place-items:center;padding:12px}
.lb-fiche__bg{position:absolute;inset:0;background:rgba(6,7,8,.72);backdrop-filter:blur(4px)}
.lb-fiche__card2{position:relative;z-index:1;width:100%;max-height:100%;overflow:auto;padding:18px;border-radius:16px;text-align:left;
  background:rgba(28,32,36,.72);backdrop-filter:blur(22px) saturate(150%);border:1px solid rgba(255,255,255,.16);
  box-shadow:0 30px 70px -22px rgba(0,0,0,.8);animation:lbPanelIn .3s var(--ease) both}
.lb-fiche__card2 h4{font-family:var(--head);font-size:21px;font-weight:600;margin:4px 0 12px}
.lb-fiche__card2>p{font-size:12.5px;color:var(--alpine);margin-bottom:14px}
.lb-fiche__specs{display:flex;gap:22px;padding:11px 0;margin-bottom:12px;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.lb-fiche__specs b{font-family:var(--head);font-size:18px;font-weight:600;display:block}
.lb-fiche__specs small{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--stone)}
.lb-fiche__x{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid var(--line)}
.lb-fiche__x::before,.lb-fiche__x::after{content:"";position:absolute;inset:14px 8px;border-top:1.5px solid var(--ivory)}
.lb-fiche__x::before{transform:rotate(45deg)}.lb-fiche__x::after{transform:rotate(-45deg)}

/* avis Google (Authentic Aesthetic) */
.lb-avis{display:grid;grid-template-columns:auto 1fr 1fr;gap:10px;align-items:stretch;text-align:left}
.lb-avis__score{display:flex;flex-direction:column;justify-content:center;gap:3px;padding:14px;border-radius:13px;
  background:rgba(255,176,103,.08);border:1px solid rgba(255,176,103,.28);min-width:112px}
.lb-avis__score strong{font-family:'Bebas Neue',var(--head);font-size:40px;line-height:1}
.lb-avis__score span:last-child{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--stone)}
.lb-avis blockquote{display:flex;flex-direction:column;gap:9px;padding:14px;border-radius:13px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.lb-avis blockquote p{font-size:13px;line-height:1.5;font-style:italic;color:var(--alpine)}
.lb-avis cite{font-style:normal;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--stone)}

/* chiffres clés (NEvents) */
.lb-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:left}
.lb-nums b{display:block;font-family:'Bebas Neue',var(--head);font-size:clamp(40px,6vw,60px);line-height:.9;color:var(--accent);font-variant-numeric:tabular-nums}
.lb-nums span{font-size:11.5px;color:var(--stone);line-height:1.35;display:block;margin-top:5px}

/* mur d'affiches filtrable (NEvents) */
.lb-wall{text-align:left}
.lb-wall__f{display:flex;gap:7px;margin-bottom:11px;flex-wrap:wrap}
.lb-wall__f button{padding:7px 13px;border-radius:999px;border:1px solid var(--line);font-size:11px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--stone);transition:.2s}
.lb-wall__f button.is-on{color:#0C0E10;background:var(--accent);border-color:var(--accent)}
.lb-wall__g{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.lb-wall__g figure{position:relative;border-radius:11px;overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4;background:#0A0B0C;
  transition:opacity .3s,transform .3s var(--ease),filter .3s}
.lb-wall__g figure.is-off{opacity:.18;filter:grayscale(1);transform:scale(.96)}
.lb-wall__g img{width:100%;height:100%;object-fit:cover;object-position:top}
.lb-wall__g figcaption{position:absolute;left:0;right:0;bottom:0;padding:16px 8px 7px;font-size:10px;font-weight:600;letter-spacing:.06em;
  background:linear-gradient(180deg,transparent,rgba(12,14,16,.92))}

/* voile sur la photo (NEvents) */
.lb-veil{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.lb-veil article{position:relative;border-radius:13px;overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4;background:#0A0B0C;isolation:isolate;cursor:pointer}
.lb-veil img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .65s var(--ease),filter .45s}
.lb-veil article:hover img,.lb-veil article:focus-visible img{transform:scale(1.05);filter:saturate(1.1)}
.lb-veil__sh{position:absolute;inset:0;background:linear-gradient(180deg,transparent 32%,rgba(0,0,0,.2) 52%,rgba(0,0,0,.95) 100%)}
.lb-veil__b{position:absolute;left:11px;right:11px;bottom:11px;z-index:1}
.lb-veil__b b{font-family:var(--head);font-size:15px;font-weight:600}
.lb-veil__b p{font-size:11.5px;color:rgba(243,238,230,.8);margin-top:4px;opacity:0;transform:translateY(9px);
  transition:opacity .35s var(--ease),transform .35s var(--ease)}
.lb-veil article:hover .lb-veil__b p,.lb-veil article:focus-visible .lb-veil__b p{opacity:1;transform:none}

/* horaires avec le jour du jour (Authentic Aesthetic) */
.lb-hr{text-align:left;width:100%}
.lb-hr__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.lb-hr__top b{font-family:var(--head);font-size:16px;font-weight:600}
.lb-hr__state{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:999px;font-size:11px;font-weight:600;
  border:1px solid var(--line);color:var(--stone)}
.lb-hr__state.is-open{color:var(--turq);border-color:rgba(57,194,194,.4);background:rgba(57,194,194,.08)}
.lb-hr__state.is-closed{color:var(--stone)}
.lb-hr li{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid var(--line);font-size:13px;color:var(--stone)}
.lb-hr li:first-child{border-top:0}
.lb-hr li .h{font-variant-numeric:tabular-nums}
.lb-hr li.is-today{color:var(--amber);font-weight:600}

/* bandeau de texte défilant (NEvents) */
.lb-mq{width:100%;overflow:hidden;border-block:1px solid rgba(12,14,16,.25);background:var(--accent);color:#0C0E10;border-radius:8px}
.lb-mq__t{display:flex;width:max-content;padding:9px 0;animation:lbMq 22s linear infinite;
  font-family:'Bebas Neue',var(--head);font-size:clamp(20px,3vw,30px);letter-spacing:.02em;text-transform:uppercase}
.lb-mq__t span::after{content:"✦";margin:0 18px}
@keyframes lbMq{to{transform:translateX(-50%)}}

/* ruban d'images en boucle (NEvents) */
.lb-reel{width:100%;overflow:hidden;border-radius:12px}
.lb-reel__t{display:flex;gap:9px;width:max-content;animation:lbMq 30s linear infinite}
.lb-reel:hover .lb-reel__t{animation-play-state:paused}
.lb-reel__t figure{flex:0 0 auto}
.lb-reel__t img{height:132px;width:auto;max-width:none;border-radius:9px;border:1px solid var(--line);object-fit:cover}

/* nuage de noms (NEvents) */
.lb-cloud{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.lb-cloud span{padding:8px 13px;border:1px solid var(--line);border-radius:10px;font-size:13px;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;transition:color .2s,background .2s,border-color .2s;cursor:default}
.lb-cloud span:hover{color:#0C0E10;background:var(--accent);border-color:var(--accent)}

@media (max-width:900px){
  .lb-tree,.lb-vx,.lb-avis{grid-template-columns:1fr}
  .lb-vx__tabs{order:-1}
  .lb-rates,.lb-nums,.lb-wall__g{grid-template-columns:repeat(2,1fr)}
  .lb-avis__score{min-width:0}
}
@media (prefers-reduced-motion:reduce){
  .lb-mq__t,.lb-reel__t,.lb-dial__ring i{animation:none}
  .lb-vx__p.is-active,.lb-fiche__card2{animation:none}
}
/* bibliothèque : ajustements dans la vignette étroite d'une carte */
.lib__live .lb-wall__g{grid-template-columns:repeat(2,1fr)}
.lib__live .lb-wall__g figcaption{font-size:9.5px;letter-spacing:.04em}
.lb-fiche{min-height:300px;display:flex}
.lb-fiche__card{flex:1}
.lb-fiche__card img{height:150px}
.lb-fiche__card2{padding:16px}
.lb-fiche__specs{gap:18px;padding:9px 0;margin-bottom:10px}
.lb-vx__tabs button span{font-size:12.5px}
/* cadran : le point voyage sur l'anneau au lieu de rester caché au centre */
.lb-dial__ring b{inset:auto;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;
  transform:rotate(-90deg) translateX(66px);transition:transform .55s var(--ease),box-shadow .3s}
.lb-fiche__modal[hidden]{display:none}
.lb-fiche__modal{inset:-10px}
@media (max-width:900px){.lb-fiche__modal{inset:0}}
/* bibliothèque : aperçus filmés (transitions qui ne vivent qu'au défilement) */
.lib__vid{position:relative;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:#0C0E10;min-height:180px;padding:0}
.lib__vid video{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:11/7}
.lib__vidtag{position:absolute;right:10px;bottom:10px;padding:5px 10px;border-radius:999px;font-size:10px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--amber);background:rgba(12,14,16,.72);border:1px solid rgba(255,176,103,.3);
  backdrop-filter:blur(6px)}

/* ---------- repères : les faits vérifiables, lisibles par un humain comme par un moteur ---------- */
.repere{padding:clamp(56px,7vw,86px) 0}
.repere__def{font-family:var(--head);font-size:clamp(19px,2.1vw,26px);line-height:1.45;letter-spacing:-.015em;
  max-width:62ch;margin-bottom:clamp(30px,4vw,44px);color:var(--ivory)}
.repere__def b{font-weight:600;color:var(--amber)}
@media (max-width:900px){.repere__def{font-size:19px}}

/* ---------- étude de cas : le récit détaillé et les faits du projet ---------- */
.story{padding:clamp(56px,7vw,90px) 0}
.story__t{font-size:clamp(26px,3vw,38px);margin-bottom:clamp(26px,3.5vw,40px)}
.story__cols{display:grid;grid-template-columns:1.45fr .55fr;gap:clamp(26px,4vw,56px);align-items:start}
.story__text h3{font-size:clamp(17px,1.6vw,20px);margin:26px 0 8px;color:var(--amber)}
.story__text h3:first-child{margin-top:0}
.story__text p{color:var(--alpine);font-size:16px;line-height:1.65;max-width:62ch}
.story__facts{border-top:1px solid var(--line)}
.story__facts>div{display:grid;gap:4px;padding:13px 0;border-bottom:1px solid var(--line)}
.story__facts dt{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.story__facts dd{font-size:15px;color:var(--ivory)}
@media (max-width:900px){.story__cols{grid-template-columns:1fr}}
/* étude de cas : le complément de titre reste discret sans disparaître pour Google */
.case-h1__kw{display:block;margin-top:6px;font-family:var(--sans);font-size:clamp(13px,1.2vw,15px);font-weight:500;
  letter-spacing:.02em;color:var(--stone);text-transform:none}

/* ---------- sélecteur de langue ---------- */
.lang{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.lang a{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:28px;padding:0 9px;border-radius:999px;
  font-size:11px;font-weight:700;letter-spacing:.09em;color:var(--stone);transition:color .2s,background .2s}
.lang a:hover{color:var(--ivory)}
.lang a[aria-current]{color:#0C0E10;background:var(--accent)}
.lang--menu{display:none}
@media (max-width:900px){
  .head-right .lang{display:none}
  .lang--menu{display:flex;justify-content:center;gap:4px;margin:18px auto 0;width:max-content}
  .lang--menu a{min-width:0;padding:0 14px;height:34px;font-size:12px;letter-spacing:.06em}
}

/* ---------- prix en trois lignes sur les pages métier ---------- */
.pfc{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.pfc__i{padding:clamp(22px,2.6vw,30px);background:var(--obsidian)}
.pfc__n{display:block;font-family:'Bebas Neue',var(--head);font-size:clamp(34px,4vw,46px);line-height:1;color:var(--accent);margin-bottom:10px}
.pfc__i b{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.pfc__i p{font-size:14.5px;line-height:1.55;color:var(--stone)}
@media (max-width:900px){.pfc{grid-template-columns:1fr}}
/* champ piège anti-robot : hors de l'écran, hors du parcours clavier, jamais lu à voix haute */
.hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
/* nomenclature suisse : le code de la monnaie précède le montant */
.pf__cur{font-family:'Bebas Neue',var(--head);font-size:clamp(20px,2.2vw,30px);line-height:1;
  letter-spacing:.04em;color:var(--stone);margin-right:.22em;position:relative;top:-.34em}
/* Section de confiance : le libellé se place sous le mot-clé, comme dans l'ouverture.
   Sans cette règle les deux se suivaient sur la même ligne et se collaient. */
.trust__grid .item{display:flex;flex-direction:column;gap:2px;align-items:flex-start}

/* ---------- détail d'une formule : fenêtre ouverte depuis la carte de prix ---------- */
.pf__more{display:inline-flex;align-items:center;gap:7px;margin-top:14px;padding:0;border:0;background:none;
  font-family:var(--sans);font-size:13px;letter-spacing:.01em;color:var(--stone);cursor:pointer;
  border-bottom:1px solid transparent;transition:color .25s var(--ease),border-color .25s var(--ease)}
.pf__more:hover,.pf__more:focus-visible{color:var(--amber);border-bottom-color:rgba(255,176,103,.45)}
.pf__more svg{width:13px;height:13px;flex:none}

.fd{border:0;padding:0;max-width:none;max-height:none;width:100%;height:100%;background:transparent;overflow:visible}
.fd::backdrop{background:rgba(8,9,11,.74);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%)}
.fd__in{position:fixed;inset:0;display:flex;align-items:flex-start;justify-content:center;padding:clamp(16px,5vh,70px) 16px;overflow:auto}
.fd__card{position:relative;width:min(640px,100%);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-lg);
  padding:clamp(26px,4vw,40px);box-shadow:0 40px 90px -30px rgba(0,0,0,.9);
  opacity:0;transform:translateY(14px) scale(.985);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.fd[open] .fd__card{opacity:1;transform:none}
.fd__close{position:absolute;top:14px;right:14px;width:36px;height:36px;display:grid;place-items:center;
  border:1px solid var(--line);border-radius:50%;background:rgba(243,238,230,.04);color:var(--alpine);cursor:pointer;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease)}
.fd__close:hover,.fd__close:focus-visible{background:rgba(255,122,26,.12);border-color:rgba(255,122,26,.4);color:var(--amber)}
.fd__close svg{width:15px;height:15px}
.fd__tag{display:block;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:10px}
.fd__t{font-family:'Bebas Neue',var(--head);font-size:clamp(30px,4.4vw,42px);line-height:1;letter-spacing:.01em;color:var(--ivory);margin:0 0 6px}
.fd__p{font-size:15px;line-height:1.5;color:var(--alpine);margin:0 0 4px}
.fd__p b{color:var(--amber);font-weight:600}
.fd__sec{margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.fd__h{font-family:var(--head);font-size:13px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--ivory);margin:0 0 12px}
.fd__l{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.fd__l li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;color:var(--alpine)}
.fd__l li>span{flex:1;min-width:0}
.fd__l li b{color:var(--ivory);font-weight:600}
.fd__l li::before{content:"";flex:none;width:15px;height:15px;margin-top:2px;border-radius:50%;
  background:rgba(255,122,26,.14);border:1px solid rgba(255,122,26,.45);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FFB067' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8.4 6.6 11 12 5.4'/%3E%3C/svg%3E");
  background-size:11px;background-repeat:no-repeat;background-position:center}
.fd__l--no li::before{background-color:rgba(243,238,230,.05);border-color:var(--line-2);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23A19C93' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M5 8h6'/%3E%3C/svg%3E")}
.fd__note{margin-top:22px;padding:14px 16px;border-radius:var(--r);background:rgba(243,238,230,.035);border:1px solid var(--line);
  font-size:13.5px;line-height:1.5;color:var(--stone)}
.fd__note b{color:var(--alpine);font-weight:600}
.fd__cta{display:inline-flex;margin-top:24px}
@media (max-width:600px){ .fd__card{padding:24px 20px} .fd__l li{font-size:14px} }
@media (prefers-reduced-motion:reduce){ .fd__card{transition:none} }

/* ======================================================================
   BIBLIOTHÈQUE, ajouts du 29/10/2026 (repris de la v4 Swiss Private Driver)
   ====================================================================== */
.lib__live>.lb-ld,.lib__live>.lb-hv,.lib__live>.lb-px,.lib__live>.lb-zz,.lib__live>.lb-vs,.lib__live>.lb-st{max-width:100%}
.lb-ld,.lb-hv{position:relative;height:230px;border-radius:12px;overflow:hidden;background:#0C0E10;text-align:left}
.lb-ld__hero,.lb-hv__poster,.lb-hv__clip,.lb-px__img{position:absolute;inset:0;background:radial-gradient(70% 80% at 78% 22%,rgba(255,122,26,.5),transparent 62%),radial-gradient(60% 70% at 12% 90%,rgba(255,176,103,.18),transparent 60%),linear-gradient(160deg,#241c15,#0a0b0c)}
.lb-hv__clip{background:radial-gradient(60% 70% at 30% 70%,rgba(255,176,103,.4),transparent 62%),radial-gradient(70% 80% at 85% 20%,rgba(255,122,26,.38),transparent 60%),linear-gradient(200deg,#2b2017,#0a0b0c)}
.lb-px__img{background:repeating-linear-gradient(0deg,rgba(243,238,230,.07) 0 2px,transparent 2px 28px),radial-gradient(70% 80% at 78% 22%,rgba(255,122,26,.5),transparent 62%),linear-gradient(160deg,#241c15,#0a0b0c)}
.lb-ld__hero{filter:blur(12px);scale:1.22;transition:scale .9s cubic-bezier(.25,.46,.45,.94),filter .9s cubic-bezier(.25,.46,.45,.94)}
.lb-ld.is-on .lb-ld__hero{filter:none;scale:1.04}
.lb-ld__txt,.lb-hv__txt,.lb-px__txt{position:absolute;left:22px;bottom:22px;right:22px}
.lb-ld__txt h3,.lb-hv__txt h3,.lb-px__txt h3{font-family:var(--head);font-size:26px;line-height:1.08;letter-spacing:-.02em;margin-top:6px}
.lb-ld__txt{opacity:0;translate:0 14px;transition:opacity .8s .2s,translate .8s .2s}.lb-ld.is-on .lb-ld__txt{opacity:1;translate:0 0}
.lb-ld__veil{position:absolute;inset:0;background:var(--obsidian);display:grid;place-items:center;transition:opacity .9s cubic-bezier(.455,.03,.515,.955)}
.lb-ld.is-fin .lb-ld__veil{opacity:0;pointer-events:none}
.lb-ld__veil b{font:700 15px var(--head);letter-spacing:.34em;color:var(--ivory);animation:lbLogo 1.4s cubic-bezier(.455,.03,.515,.955) .2s backwards}
.lb-ld__l{position:absolute;left:50%;width:210px;margin-left:-105px;height:1px;background:var(--accent)}
.lb-ld__l--h{top:calc(50% - 30px);animation:lbLigneG .9s cubic-bezier(.165,.84,.44,1) .1s backwards}.lb-ld__l--b{top:calc(50% + 30px);animation:lbLigneD .9s cubic-bezier(.165,.84,.44,1) .1s backwards}
@keyframes lbLogo{from{opacity:0;scale:.92}}@keyframes lbLigneG{from{scale:0 1;transform-origin:left}}@keyframes lbLigneD{from{scale:0 1;transform-origin:right}}
.lb-ld__re{position:absolute;top:12px;right:12px;height:30px;font-size:11px;z-index:2}
.lb-hv__clip{animation:lbClip 7s ease-in-out infinite;opacity:0;filter:saturate(1.15) contrast(1.05)}
@keyframes lbClip{0%{opacity:0;scale:1}12%{opacity:1}88%{opacity:1}100%{opacity:0;scale:1.14}}
.lb-hv__txt{bottom:84px}.lb-hv__tags{position:absolute;left:22px;right:22px;bottom:16px;display:flex;gap:6px;flex-wrap:wrap}
.lb-hv__tags span{font-size:10px;font-weight:600;padding:4px 9px;border-radius:999px;background:rgba(12,14,16,.7);border:1px solid var(--line-2);color:var(--alpine)}
.lb-hv__bar{position:absolute;left:0;bottom:0;height:2px;background:var(--accent);animation:lbBar 7s linear infinite}@keyframes lbBar{from{width:0}to{width:100%}}
.lb-px,.lb-zz,.lb-vs,.lb-st{position:relative;text-align:left}
.lb-px__scroll,.lb-zz__scroll,.lb-vs__scroll,.lb-st__scroll{height:240px;overflow-y:auto;border-radius:12px;background:#0C0E10;border:1px solid var(--line);overscroll-behavior:contain;scrollbar-width:thin}
.lb-px__hero{position:relative;height:240px;overflow:hidden}.lb-px__img{inset:-10% 0 -10%;scale:1.05}
.lb-px__body{padding:22px;font-size:13.5px;color:var(--alpine);display:grid;gap:12px;min-height:260px;background:var(--panel)}
.lb-px__hint{display:block;margin-top:8px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);text-align:center}
.lb-wd{padding:30px 22px;border-radius:12px;background:#0C0E10;border:1px solid var(--line);text-align:left;cursor:ew-resize}
.lb-wd__p{font:600 24px/1.25 var(--head);letter-spacing:-.02em;margin-bottom:18px}.lb-wd__p span{opacity:.25}
.lb-rt{padding:26px 22px;border-radius:12px;background:#0C0E10;border:1px solid var(--line);text-align:left;display:grid;gap:4px;justify-items:start}
.lb-rt h3{font:700 28px/1.1 var(--head);letter-spacing:-.025em;clip-path:inset(-8% 100% -8% 0)}.lb-rt h3 em{font-style:normal;color:var(--accent)}
.lb-rt.is-in h3{clip-path:inset(-8% 0 -8% 0);transition:clip-path 1.2s cubic-bezier(.455,.03,.515,.955);transition-delay:calc(var(--i)*.28s)}
.lb-rt .lb-btn{margin-top:14px;height:30px;font-size:11px}
.lb-cr{padding:18px 8px 10px;border-radius:12px;background:#0C0E10;border:1px solid var(--line);overflow:hidden}
.lb-cr__rail{position:relative;height:210px;outline:0}
.lb-cr__c{position:absolute;left:50%;top:0;bottom:0;width:var(--w,90px);translate:calc(var(--x,0px) - 50%) 0;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:12px;
  background:radial-gradient(120% 80% at 80% 0,rgba(255,122,26,.34),transparent 60%),linear-gradient(165deg,#2a231c,#101214);border:1px solid var(--line);
  transition:translate .8s cubic-bezier(.22,1,.36,1),width .8s cubic-bezier(.22,1,.36,1),opacity .6s}
.lb-cr__c.saut{transition:none}.lb-cr__c b{font:700 14px var(--head);white-space:nowrap}.lb-cr__c small{font-size:11px;color:var(--amber);margin-top:2px;opacity:0;max-height:0;transition:opacity .5s,max-height .5s}
.lb-cr__c:not(.is-active) b{font-size:12px;writing-mode:vertical-rl;rotate:180deg;align-self:flex-start}.lb-cr__c.is-active{border-color:rgba(255,122,26,.55)}.lb-cr__c.is-active small{opacity:1;max-height:20px}
.lb-cr__nav{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:10px;font-size:11px;color:var(--stone)}
.lb-cr__nav button{width:30px;height:30px;border-radius:50%;border:1px solid var(--line-2);font-size:16px;line-height:1}.lb-cr__nav button:hover{border-color:var(--accent);color:var(--accent)}
.lb-zz__scroll{padding:16px;display:grid;gap:14px;align-content:start}
.lb-zz__t{width:76%;height:96px;border-radius:12px;padding:14px;display:flex;flex-direction:column;justify-content:flex-end;background:radial-gradient(100% 90% at 85% 0,rgba(255,122,26,.28),transparent 60%),var(--panel-2);border:1px solid var(--line)}
.lb-zz__t:nth-child(even){justify-self:end}.lb-zz__t b{font:700 15px var(--head);margin-top:3px}
.lb-map{position:relative;border-radius:12px;overflow:hidden;background:#E8E4D9;aspect-ratio:400/230;text-align:left}.lb-map svg{display:block;width:100%;height:100%}
.lb-map__l{stroke-dasharray:1;stroke-dashoffset:1}.lb-map.is-in .lb-map__l{stroke-dashoffset:0;transition:stroke-dashoffset 2.6s cubic-bezier(.65,0,.35,1) .2s}.lb-map__f{opacity:0}.lb-map.is-in .lb-map__f{opacity:1;transition:opacity .4s 2.6s}
.lb-map__tip{position:absolute;padding:4px 11px;border-radius:999px;background:#0C0E10;color:var(--ivory);font:600 11px var(--sans)}
.lb-map__tip--a{left:calc(13% + 12px);top:calc(73% - 14px)}.lb-map__tip--b{right:calc(13.5% + 12px);top:calc(23% - 4px)}
.lb-map__f2{position:absolute;left:10px;bottom:10px;display:flex;gap:16px;padding:8px 14px;border-radius:10px;background:rgba(12,14,16,.88)}.lb-map__f2 dt{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}.lb-map__f2 dd{font:700 16px var(--head);color:var(--ivory)}
.lb-vs__scroll{padding:14px;display:grid;gap:16px;align-content:start;overflow-x:hidden}
.lb-vs__r{display:grid;grid-template-columns:1.1fr 1fr;gap:16px;align-items:center;height:110px}.lb-vs__r--inv .lb-vs__img{order:2}
.lb-vs__img{height:100%;border-radius:12px;display:grid;place-items:center;background:radial-gradient(100% 90% at 20% 0,rgba(255,122,26,.3),transparent 60%),var(--panel-2);border:1px solid var(--line);font:600 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--stone);
  clip-path:inset(0 100% 0 0);transition:clip-path 1.4s cubic-bezier(.215,.61,.355,1)}
.lb-vs__r--inv .lb-vs__img{clip-path:inset(0 0 0 100%)}.lb-vs__r.in .lb-vs__img{clip-path:inset(0)}
.lb-vs__r h3{font:700 19px var(--head);letter-spacing:-.02em}.lb-vs__r p{font-size:12.5px;color:var(--alpine);margin-top:4px}
.lb-st__track{height:620px}.lb-st__stage{position:sticky;top:0;height:240px;display:grid;align-content:center;padding:0 22px 0 30px}
.lb-st ol{list-style:none;display:grid;gap:14px}.lb-st li{opacity:.35;transition:opacity .5s}.lb-st li.is-active{opacity:1}
.lb-st h4{font:700 18px var(--head);letter-spacing:-.02em}.lb-st li p{font-size:12.5px;color:var(--alpine);max-height:0;overflow:hidden;opacity:0;transition:max-height .6s,opacity .5s}.lb-st li.is-active p{max-height:3em;opacity:1}
.lb-st__bar{position:absolute;left:14px;top:34px;bottom:34px;width:2px;background:var(--line-2)}.lb-st__bar u{display:block;width:100%;height:var(--prog,0%);background:var(--accent)}
.lb-wa,.lb-rs{padding:18px;border-radius:12px;background:#0C0E10;border:1px solid var(--line);text-align:left}
.lb-wa__f{display:grid;grid-template-columns:1.4fr 1fr 72px;gap:10px}.lb-wa__f .lb-btn{grid-column:1/-1}
.lb-wa label,.lb-rs label,.lb-dt label{display:grid;gap:5px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.lb-wa input,.lb-rs input[type=text],.lb-dt input{height:40px;padding:0 12px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line-2);color:var(--ivory);font:500 14px var(--sans);letter-spacing:0;text-transform:none;min-width:0;width:100%}
.lb-wa input:focus,.lb-rs input:focus,.lb-dt input:focus{outline:0;border-color:var(--accent)}
.lb-wa__msg{margin-top:12px;padding:12px 14px;border-radius:12px;background:#0f2a1f;border:1px solid rgba(37,211,102,.35);font:12px/1.5 var(--sans);color:#d7f5e3;white-space:pre-wrap;display:none}.lb-wa__msg.is-on{display:block}
.lb-rs__steps{list-style:none;display:flex;gap:6px;margin-bottom:14px}.lb-rs__steps li{flex:1;text-align:center;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);padding-bottom:7px;border-bottom:2px solid var(--line-2)}.lb-rs__steps li.is-on{color:var(--ivory);border-color:var(--accent)}
.lb-rs__p{display:none;gap:10px}.lb-rs__p.is-on{display:grid}.lb-rs__sug{list-style:none;border:1px solid var(--line-2);border-radius:10px;overflow:hidden}.lb-rs__sug li{padding:8px 12px;font-size:12.5px;color:var(--alpine);border-bottom:1px solid var(--line)}.lb-rs__sug li:last-child{border:0}.lb-rs__sug li:hover{background:rgba(255,122,26,.12);color:var(--ivory)}
.lb-rs__k{font-size:11.5px;color:var(--stone)}.lb-rs__v{display:flex!important;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;border:1px solid var(--line-2);font-size:14px!important;letter-spacing:0!important;text-transform:none!important;color:var(--ivory)!important;cursor:pointer}
.lb-rs__v span{flex:1}.lb-rs__v b{font:700 15px var(--head)}.lb-rs__v:has(input:checked){border-color:var(--accent);background:rgba(255,122,26,.08)}.lb-rs__v input{accent-color:var(--accent)}
.lb-rs__sum{font-size:13.5px;color:var(--alpine)}.lb-rs__tot{font:700 28px var(--head);color:var(--ivory);display:block;margin-top:4px}.lb-rs__nav{display:flex;justify-content:space-between;margin-top:14px}.lb-rs__nav .lb-btn{height:34px}
.lb-dt{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px;border-radius:12px;background:#0C0E10;border:1px solid var(--line);text-align:left}
.lb-dt__c{position:relative}.lb-dt input{-webkit-appearance:none;appearance:none;color-scheme:dark;display:block;line-height:40px}
.lb-dt input[data-vide]{color:transparent}.lb-dt input[data-vide]::-webkit-datetime-edit{color:transparent}
.lb-dt__a{position:absolute;left:12px;bottom:11px;font:500 14px var(--sans);letter-spacing:0;text-transform:none;color:var(--stone);pointer-events:none;line-height:18px}.lb-dt input:not([data-vide])+.lb-dt__a{display:none}
@media (prefers-reduced-motion:reduce){.lb-hv__clip{animation:none;opacity:1}.lb-hv__bar{animation:none;width:100%}.lb-cr__c,.lb-ld__hero{transition:none}}

.lb-fc{position:relative;min-height:230px;border-radius:12px;overflow:hidden;background:#0C0E10;border:1px solid var(--line)}
.lb-fc__bg{position:absolute;inset:0}.lb-fc__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}.lb-fc__bg img.is-on{opacity:1}
.lb-fc__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,14,16,.82),rgba(12,14,16,.5) 50%,rgba(12,14,16,.88))}
.lb-fc__in{position:relative;padding:22px 22px 18px;display:grid;gap:12px;min-height:230px;align-content:space-between}
.lb-fc__list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.lb-fc__list button{display:flex;align-items:baseline;gap:12px;padding:4px 0;text-align:left;color:rgba(244,240,234,.5);transition:color .4s}
.lb-fc__list button em{font:500 11px var(--head);font-style:normal;letter-spacing:.08em}
.lb-fc__list button b{font:700 clamp(20px,3.2vw,28px) var(--head)}
.lb-fc__list button:hover,.lb-fc__list button.is-on{color:#F4F0EA}.lb-fc__list button.is-on em{color:var(--amber)}
.lb-fc__n{font-size:11px;color:var(--stone);margin:0}

/* bibliothèque : libellés et captures du site réel */
.lib__lab{display:block;font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin:2px 0 -4px}
.lib__reel{margin:0;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.1);background:#0C0E10}
.lib__reel img{display:block;width:100%;height:auto}
.lib__reel figcaption{padding:9px 14px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);border-top:1px solid rgba(255,255,255,.08)}
.lib__how{max-width:62ch;margin:14px 0 4px;font-size:14px;color:var(--alpine)}

/* page « Devenir apporteur » */
.apt-calc__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,6vw,96px);align-items:center}
.apt-calc .lead{margin:10px 0 22px;max-width:46ch}
.apt-offres{border:0;display:grid;gap:10px;margin:0 0 22px;padding:0}
.apt-offre{display:block;cursor:pointer}
.apt-offre input{position:absolute;opacity:0;pointer-events:none}
.apt-offre span{display:grid;gap:2px;padding:14px 18px;border-radius:14px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);transition:border-color .25s,background .25s}
.apt-offre b{font:700 16px var(--head)}.apt-offre small{font-size:13px;color:var(--stone)}
.apt-offre:hover span{border-color:rgba(255,122,26,.5)}
.apt-offre input:checked+span{border-color:var(--accent);background:rgba(255,122,26,.09)}
.apt-offre input:focus-visible+span{outline:2px solid var(--amber);outline-offset:2px}
.apt-nb{display:grid;grid-template-columns:1fr auto;gap:8px 14px;font-size:14px;color:var(--alpine)}
.apt-nb output{font:700 20px var(--head);color:var(--ivory)}
.apt-nb input{grid-column:1/-1;width:100%;accent-color:var(--accent)}
.apt-calc__out{padding:clamp(24px,4vw,48px);border-radius:var(--r-lg);background:radial-gradient(90% 90% at 85% 0,rgba(255,122,26,.18),transparent 62%),var(--panel);border:1px solid var(--line)}
.apt-calc__lab{font-size:13px;letter-spacing:.04em;color:var(--stone)}
.apt-calc__val{font:800 clamp(72px,11vw,168px)/.95 var(--head);letter-spacing:-.04em;margin:6px 0 4px}
.apt-calc__val i{font-style:normal;font-size:.3em;letter-spacing:0;color:var(--amber);font-weight:700}
.apt-calc__det{font-size:17px;color:var(--ivory)}
.apt-calc__note{margin-top:18px;font-size:12.5px;line-height:1.55;color:var(--stone);max-width:52ch}
.apt-regles__in,.apt-cand__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,6vw,96px);align-items:start}
.apt-regles h2{position:sticky;top:110px}
.apt-cand .form{max-width:560px}
.apt-cand select{width:100%;height:50px;padding:0 14px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line-2);color:var(--ivory);font:500 15px var(--sans)}
.apt-cand select option{color:#0C0E10}
@media (max-width:900px){.apt-calc__in,.apt-regles__in,.apt-cand__in{grid-template-columns:1fr}.apt-regles h2{position:static}}
@media (prefers-reduced-motion:reduce){.apt-offre span{transition:none}}
.hero--page>.wrap{width:100%}

.apt-voie h2{margin-bottom:28px}
.apt-voie__piste{position:relative;height:430px}
.apt-voie__fil{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.apt-voie__fil path{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.apt-voie__piste.is-in .apt-voie__fil path{stroke-dashoffset:0;transition:stroke-dashoffset 2.4s cubic-bezier(.65,0,.35,1)}
.apt-halte{position:absolute;width:22%;padding:34px 0 0 10px}
.apt-halte:nth-of-type(1){left:0;top:0}.apt-halte:nth-of-type(2){left:25%;top:70px}.apt-halte:nth-of-type(3){left:50%;top:140px}.apt-halte:nth-of-type(4){left:75%;top:210px}
.apt-halte::before{content:"";position:absolute;left:10px;top:7px;width:16px;height:16px;border-radius:50%;background:var(--obsidian);border:2px solid var(--stone)}
.apt-halte--vous::before{border-color:var(--accent);background:var(--accent)}
.apt-halte small{display:block;font-size:12px;font-weight:700;color:var(--amber);margin-bottom:4px}
.apt-halte h3{font:700 clamp(19px,1.8vw,26px)/1.15 var(--head);letter-spacing:-.02em;margin-bottom:8px}
.apt-halte p{font-size:14.5px;color:var(--alpine)}
.apt-qui{display:grid;gap:clamp(18px,3vw,34px);margin-top:20px}
.apt-qui__noms{display:flex;flex-wrap:wrap;gap:6px 26px}
.apt-qui__noms button{font:700 clamp(28px,4.6vw,64px)/1.05 var(--head);letter-spacing:-.03em;color:var(--ivory);opacity:.28;text-align:left;transition:opacity .3s,color .3s}
.apt-qui__noms button:hover{opacity:.7}
.apt-qui__noms button[aria-selected="true"]{opacity:1;color:var(--amber)}
.apt-qui__noms button:focus-visible{outline:2px solid var(--amber);outline-offset:4px;border-radius:6px}
.apt-qui__txt{font-size:clamp(17px,1.5vw,21px);line-height:1.5;color:var(--alpine);max-width:52ch;min-height:3.2em}
@media (max-width:900px){
  .apt-voie__piste{height:auto;display:grid;gap:26px;padding-left:12px;border-left:2px solid var(--accent);margin-left:8px}
  .apt-voie__fil{display:none}
  .apt-halte{position:static;width:auto;padding:0 0 0 0}
  .apt-halte::before{left:-30px}
}
@media (prefers-reduced-motion:reduce){.apt-voie__fil path{stroke-dashoffset:0;transition:none}.apt-qui__noms button{transition:none}}

/* Six onglets dans la barre : entre 1101 et 1359 px, elle ne tient pas en meme temps
   que le mot ERMITE, la capsule de langue et le bouton de demo. Sur cette bande on garde
   la marque seule, comme sur mobile, et on resserre les onglets. */
@media (min-width:1101px) and (max-width:1359px){
  header.site:has(.pill a[href^="apporteur"]) .brand img.brand__wm{display:none}
  header.site:has(.pill a[href^="apporteur"]) .pill a{padding:0 13px}
  header.site:has(.pill a[href^="apporteur"]) .pill{gap:2px}
}