/* WabsPro, refonte novembre 2026 : direction « Braise ».
   Se charge APRÈS wabspro.css : mêmes composants, nouvelle identité (jetons, typographie, sections en arc). */

@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/anton-latin.woff2) format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/instrument-serif-italic-latin.woff2) format('woff2')}
@font-face{font-family:'Pinyon Script';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/pinyon-script-latin.woff2) format('woff2')}

/* ---------- Jetons ---------- */
:root{
  --nuit:#1B0D07; --nuit-2:#25130A; --nuit-3:#301A0F; --trait:#40281A; --trait-2:#5B3D2B;
  --orange:#E88100; --orange-vif:#FF9A3D; --orange-sombre:#B84A00; --sur-orange:#140B00;
  --texte:#F6F1E9; --texte-2:#CDBDAE; --texte-3:#A99684;
  --ciel-1:#F3B98A; --ciel-2:#F7E3D0; --cadre:#F6F1E9; --encre:#1B0D07;
  --panneau:#0D2B2C; --sur-panneau:#EAF2EF; --sur-panneau-2:#A9C2BC; --plume-panneau:#F2B872;
  --plume-sombre:#FF9A3D; --plume-clair:#B84A00;
  --geant:'Anton','Archivo',Impact,sans-serif;
  --plume:'Pinyon Script','Snell Roundhand',cursive;
  --edito:'Instrument Serif','Iowan Old Style',Georgia,serif;
  --mono:var(--titre);
  --r:999px; --r-2:0px; --r-3:0px;
  --elan:cubic-bezier(.7,0,.2,1);
  --arc:clamp(44px,8vw,140px);
  --pouls:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 24'%3E%3Cpolyline points='0,16 22,16 28,3 35,21 40,16 64,16' fill='none' stroke='%23B84A00' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
/* Zones claires : mêmes composants, jetons inversés */
.nav,.mobile-menu,.page-hero,.hero-mini,.section--soft,.page-legale .hero,.section:has(.contact-grid),.avis,.atouts,.haut{
  --texte:#1B0D07; --texte-2:#55412F; --texte-3:#6B5646;
  --nuit:#FBF8F3; --nuit-2:#EFE7DB; --nuit-3:#E6DCCD; --trait:#D8CAB9; --trait-2:#B7A48F;
  --orange:#B84A00; --orange-vif:#8F3900;
  color:var(--texte);
}
/* Zone pétrole (bandeaux d'appel à l'action) */
.cta-banner,.final,.real{
  --nuit:#0D2B2C; --nuit-2:#123738; --nuit-3:#174243; --trait:#24504F; --trait-2:#3B6B69;
  --texte:#EAF2EF; --texte-2:#A9C2BC; --texte-3:#8FAAA4; --orange:#F2B872; --orange-vif:#FFD49A;
  color:var(--texte);
}

html{background:var(--nuit)}
body{background:var(--nuit);font-stretch:100%}
::selection{background:#E88100;color:#140B00}
:focus-visible{outline:2px solid #E88100;outline-offset:3px}
[data-p]{--p:1}
html.anime [data-p]{--p:0}

/* Grain et curseur */
.grain{position:fixed;inset:0;z-index:900;pointer-events:none;opacity:.2;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.halo-souris{display:none!important}
.curseur{display:none}
@media (hover:hover) and (pointer:fine){
  html.anime .curseur{display:grid;place-items:center;position:fixed;left:0;top:0;z-index:9990;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#E88100;color:#140B00;pointer-events:none;font-size:0;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-align:center;line-height:1.15;transition:width .4s var(--courbe),height .4s var(--courbe),margin .4s var(--courbe),font-size .2s,opacity .3s;opacity:0}
  html.anime .curseur.la{opacity:1}
  html.anime .curseur.lien{width:46px;height:46px;margin:-23px 0 0 -23px;opacity:.5}
  html.anime .curseur.voir{width:112px;height:112px;margin:-56px 0 0 -56px;font-size:11.5px;opacity:1}
}

/* ---------- Typographie ---------- */
h1,h2{font-family:var(--geant);font-weight:400;font-stretch:100%;text-transform:uppercase;letter-spacing:0;line-height:.96}
h1{font-size:clamp(52px,10.5vw,180px)}
h2{font-size:clamp(40px,6.4vw,108px)}
h1 em,h2 em{font-style:normal;color:var(--orange)}
h3{font-stretch:100%}
.petit{font-size:12px;line-height:1.35;letter-spacing:.045em;text-transform:uppercase;font-weight:500}
.lead{font-size:clamp(16.5px,1.5vw,19px)}
/* Sur-titre : étiquette entre deux crochets pleins */
.eyebrow{display:inline-flex;align-items:center;gap:18px;font-family:var(--titre);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--texte);margin-bottom:26px}
.eyebrow::before,.eyebrow::after{content:"";flex:none;width:7px;height:9px;background:currentColor!important;clip-path:polygon(0 0,100% 0,55% 50%,100% 100%,0 100%);opacity:1!important}
.eyebrow::after{transform:scaleX(-1)}
.frappe{max-width:none!important;overflow:visible!important;white-space:normal!important;transition:none!important}
/* Titres de bloc texte : phrase en serif italique */
.split__text h2,.upgrade-card h3,.contact-card strong{font-family:var(--edito);font-style:italic;font-weight:400;text-transform:none;letter-spacing:-.01em;line-height:1.06}
.split__text h2{font-size:clamp(34px,4.6vw,74px);margin-bottom:14px}
.upgrade-card h3{font-size:clamp(28px,3vw,44px)}
/* Mots posés un par un (wabspro.js) : ils tombent, inclinés */
.js .ligne-mots .mot{opacity:0;transform:translate(.12em,-.42em) skewX(-30deg) scale(.7,.3);transform-origin:0 100%;transition:opacity .6s var(--courbe),transform .9s var(--courbe);transition-delay:calc(var(--i) * 60ms)}
.js .ligne-mots.is-visible .mot{opacity:1;transform:none}
.js .split__text h2.ligne-mots .mot{transform:translateY(.12em);opacity:.22;transition-delay:calc(var(--i) * 110ms)}
.js .split__text h2.ligne-mots.is-visible .mot{opacity:1;transform:none}
/* Titre principal des pages internes (animations.js) : même chute, mot par mot */
.fendu .fente{overflow:visible;padding:0;margin:0}
.fendu .fente>span{transform:none;transform-origin:0 100%;animation:tombe-mot 1s var(--courbe) both;animation-delay:calc(.25s + var(--i) * 90ms)}
@keyframes tombe-mot{from{opacity:0;transform:translate(.12em,-.5em) skewX(-32deg) scale(.66,.24)}}

/* ---------- Boutons ---------- */
.btn{border-radius:999px;min-height:54px;padding:14px 28px;overflow:hidden;isolation:isolate;font-weight:700}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--texte);transform:translateY(102%);transition:transform .5s var(--courbe)}
.btn:hover::before{transform:none}
.btn--primary{background:#E88100;color:#140B00}
.btn--primary:hover{background:#E88100;color:var(--nuit);box-shadow:none}
.btn--outline,.btn--outline-light{border-color:var(--trait-2);font-weight:500}
.btn--outline:hover,.btn--outline-light:hover{border-color:var(--texte);color:var(--nuit)}
.price-card:not(.featured) .price-cta:hover{color:var(--nuit);border-color:var(--texte)}
.rond{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#1B0D07;color:#F6F1E9;transition:transform .45s var(--courbe),background .3s,color .3s;will-change:transform}
.rond svg{width:18px;height:18px;transition:transform .45s var(--courbe)}
a:hover>.rond{background:#E88100;color:#140B00}
a:hover>.rond svg{transform:translateY(4px)}
.cartouche{display:inline-flex;align-items:stretch;border:1px solid color-mix(in srgb,currentColor 22%,transparent);background:color-mix(in srgb,var(--cadre) 78%,transparent)}
.cartouche>*{padding:10px 13px;display:flex;align-items:center;gap:8px}
.cartouche>*+*{border-left:1px solid color-mix(in srgb,currentColor 22%,transparent)}
.etoiles{color:var(--plume-clair);letter-spacing:.08em}

/* ---------- Navigation ---------- */
.nav{height:var(--nav-h);background:transparent;border-bottom:0;color:var(--texte)}
.nav.scrolled{background:rgba(246,241,233,.9);border-bottom:1px solid var(--trait)}
.nav .container{max-width:none}
.brand{font-family:var(--geant);font-weight:400;font-stretch:100%;font-size:30px;line-height:.9;letter-spacing:.01em;text-transform:uppercase;gap:0;color:var(--texte)}
.brand>span:not(.brand__mark){color:var(--orange)}
.brand img,.brand__mark{display:none}
.nav__links{display:grid;grid-template-rows:repeat(3,auto);grid-auto-flow:column;gap:0 clamp(40px,7vw,120px);align-items:start;justify-items:start}
.nav__links li:nth-child(3n+2){padding-left:20px}
.nav__links a{display:inline-flex;gap:6px;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;line-height:1.5;padding:0;color:var(--texte)}
.nav__links a::before{font-weight:500}
.nav__links li:nth-child(1) a::before{content:"①"}.nav__links li:nth-child(2) a::before{content:"②"}.nav__links li:nth-child(3) a::before{content:"③"}
.nav__links li:nth-child(4) a::before{content:"④"}.nav__links li:nth-child(5) a::before{content:"⑤"}.nav__links li:nth-child(6) a::before{content:"⑥"}
.nav__links a::after{bottom:0;height:1px;background:currentColor}
.nav__links a[aria-current="page"]{color:var(--orange)}
.nav__right{gap:18px}
.nav__right .btn{min-height:44px;padding:10px 20px;font-size:13.5px}
.nav__tel{font-size:12px;font-weight:600;letter-spacing:.05em}
.lang{border:0;padding:0;gap:0;font-size:12px;font-weight:600}
.lang button{padding:8px 7px;min-height:32px;color:var(--texte-3)}
.lang button[aria-current="true"]{background:none;color:var(--texte);text-decoration:underline;text-underline-offset:4px}
.burger{border:0;background:none;gap:7px;width:48px;height:48px}
.bar{width:32px;height:2px;border-radius:0;background:var(--texte)}
.burger .bar:nth-child(2){display:none}
.burger[aria-expanded="true"] .bar:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
.burger[aria-expanded="true"] .bar:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}
.nav:has(.burger[aria-expanded="true"]){background:transparent;border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
/* Menu plein écran : rideau en arc, liens géants */
.mobile-menu{background:var(--cadre);opacity:1;clip-path:ellipse(150% 0% at 50% 0%);transition:clip-path .8s var(--elan),visibility 0s .8s;justify-content:flex-end;gap:0;padding-bottom:calc(28px + env(safe-area-inset-bottom));overflow:auto}
.mobile-menu.open{clip-path:ellipse(150% 130% at 50% 0%);transition:clip-path .8s var(--elan)}
.mobile-menu::before{display:none}
.mobile-menu__links{width:100%;margin:auto 0}
.mobile-menu__links li{overflow:hidden}
.mobile-menu__links li:nth-child(even){text-align:right}
.mobile-menu__links a{display:inline-block;font-family:var(--geant);font-weight:400;font-stretch:100%;text-transform:uppercase;letter-spacing:0;font-size:clamp(44px,13.2vw,110px);line-height:.96;padding:0;transform:translateY(105%);transition:transform .8s var(--courbe)}
.mobile-menu.open .mobile-menu__links a{transform:none}
.mobile-menu__links li:nth-child(1) a{transition-delay:.15s}.mobile-menu__links li:nth-child(2) a{transition-delay:.22s}.mobile-menu__links li:nth-child(3) a{transition-delay:.29s}.mobile-menu__links li:nth-child(4) a{transition-delay:.36s}.mobile-menu__links li:nth-child(5) a{transition-delay:.43s}
.mobile-menu__links a[aria-current="page"]{color:var(--orange)}
.mobile-menu .lang{margin-top:18px!important}
.mobile-menu__cta{margin-top:16px;width:100%}
.mobile-menu__cta .btn{width:100%;min-height:62px;background:#1B0D07;color:#F6F1E9;font-family:var(--edito);font-style:italic;font-weight:400;font-size:22px}
@media (max-width:960px){
  .nav__links,.nav__right .lang,.nav__right .btn{display:none}
  .nav__right{display:flex}
  .burger{display:flex}
  .mobile-menu{display:flex}
}
@media (max-width:760px){.nav__right{display:none}}

/* ---------- En-têtes des pages internes : ciel d'aube, ellipse et anneau ---------- */
.page-hero,.hero-mini,.page-legale .hero,.section:has(.contact-grid){background:linear-gradient(180deg,var(--ciel-1) 0%,var(--ciel-2) 58%,var(--ciel-1) 100%)!important;border-bottom:0;overflow:hidden;isolation:isolate}
.page-hero::before,.hero-mini::before,.page-legale .hero::before,.section:has(.contact-grid)::before{content:"";position:absolute;z-index:-1;inset:auto;right:-8%;top:12%;width:min(62vw,900px);aspect-ratio:1.9;border-radius:50%;background:radial-gradient(circle at 70% 34%,#FFF6E8 0 9%,rgba(255,240,220,.5) 15%,transparent 30%),linear-gradient(200deg,#F1A772 0%,#F8DCC4 48%,#EE9A62 100%);transform:rotate(-11deg);opacity:.95;animation:respire 14s ease-in-out infinite alternate}
.page-hero::after,.hero-mini::after,.page-legale .hero::after,.section:has(.contact-grid)::after{content:"";position:absolute;z-index:-1;left:auto;bottom:auto;right:-12%;top:6%;width:min(70vw,1020px);height:auto;aspect-ratio:1.9;border-radius:50%;border:1px solid color-mix(in srgb,var(--encre) 16%,transparent);background:none;transform:rotate(-11deg);opacity:1;animation:respire 14s ease-in-out infinite alternate-reverse}
@keyframes respire{to{transform:rotate(-8deg) scale(1.03)}}
.page-hero h1,.hero-mini h1{font-size:clamp(46px,8.6vw,150px);max-width:13ch}
.page-hero p,.hero-mini__inner>p{color:var(--texte-2)}
.contact-info h1{font-size:clamp(52px,9vw,150px)}
.hero-mini__trust li{border-radius:0;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.045em;background:color-mix(in srgb,var(--cadre) 70%,transparent)}
.page-legale .hero h1{font-size:clamp(40px,8.6vw,130px)}
.nav__back{border-radius:999px}
.section:has(.contact-grid){padding-bottom:clamp(70px,9vw,130px)}

/* ---------- Sections en arc ---------- */
.section--soft,.cta-banner,.final,.real,.avis{position:relative;z-index:1;margin-top:calc(var(--arc) * -1);border-radius:50% 50% 0 0/var(--arc) var(--arc) 0 0;border-top:0;transform-origin:50% 0;transform:scaleX(calc(.88 + .12 * clamp(0,calc(var(--p) * 9),1)))}
.section--soft,.cta-banner,.final{background:var(--nuit)!important}
.section--soft{background:var(--cadre)!important}
.section--soft{padding-top:calc(clamp(80px,11vw,150px) + var(--arc) * .4)}
main>section:has(+.section--soft),main>section:has(+.cta-banner),main>section:has(+.final),main>section:has(+.real),main>section:has(+.avis),main>form:has(+.contact-map){padding-bottom:calc(clamp(80px,11vw,150px) + var(--arc))}
.section--soft+.section,.section--soft+.bande-secteurs{position:relative;z-index:1}
.cta-banner::before,.final::before{background:none}
.cta-banner h2,.final h2{font-size:clamp(40px,7vw,120px)}
.cta-pouls polyline{stroke:var(--orange)}
.cta-banner+.cta-banner{margin-top:0}

/* ---------- Composants : arêtes vives, filets fins ---------- */
.price-card,.demo-card,.parcours,.contact-form,.upgrade-card,.dcard,.apd-box,.rights-box,.contact-map__frame{border-radius:0}
.price-card.featured{background:linear-gradient(180deg,color-mix(in srgb,#E88100 16%,var(--nuit-2)),var(--nuit-2) 55%);border-color:#E88100}
.price-name{font-family:var(--geant);font-weight:400;font-stretch:100%;text-transform:uppercase;font-size:38px;letter-spacing:0;line-height:.95}
.price-amount{font-family:var(--geant);font-weight:400;font-stretch:100%;letter-spacing:0;font-size:clamp(84px,9vw,132px);line-height:.9}
.price-amount small{font-family:var(--titre);text-transform:uppercase;font-size:12px;letter-spacing:.06em;font-weight:600}
.price-tag{font-weight:600;background:#E88100;color:#140B00}
.price-setup,.parcours__tete,.cf-row label,.footer__bottom,.footer__bottom a,.dcard__kicker,.dcard__tag,.dcard__num,.how-step,.pnum,.parcours__num,.hero-mini__trust li{font-family:var(--titre);font-weight:600}
.parcours{background:var(--nuit-2)}
.parcours h3,.process-step h3,.service-card h3,.demo-card h3{font-family:var(--edito);font-style:italic;font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.1;letter-spacing:-.005em}
.service-card__icon,.demo-card__icon{border-radius:50%}
.pnum{background:var(--nuit)}
.section--soft .pnum,.section--soft .demo-card{background:var(--nuit)}
.telephone__badge{border-radius:0;background:#1B0D07;color:#F6F1E9;border-color:#5B3D2B;font-weight:600;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase}
.checks li{font-size:17px}
.faq__item summary,.faq details summary{font-family:var(--edito);font-style:italic;font-weight:400;font-size:clamp(22px,2.3vw,32px);line-height:1.15;padding:26px 0}
.faq__item summary::after,.faq details summary::after{width:44px;height:44px;border-color:var(--trait-2)}
.contact-form{background:var(--nuit)}
.contact-form input[type=text],.contact-form input[type=tel],.contact-form input[type=email],.contact-form textarea{border-radius:0;background:var(--nuit-2)}
.contact-map{padding-top:clamp(70px,9vw,120px)}
.contact-map__frame iframe{filter:sepia(.25) saturate(.9)}
#wab-consent{border-radius:0}
#wab-consent button{border-radius:999px}
.to-top{background:#1B0D07;color:#F6F1E9;border-color:#5B3D2B}
.barre-contact a{border-radius:999px}
.bande-secteurs{background:var(--nuit);border-color:var(--trait)}
.bande-secteurs__pause{position:relative;z-index:2;right:auto;top:auto;transform:none;margin:-56px var(--gouttiere) 12px auto}
.nav{height:auto;min-height:var(--nav-h);padding:14px 0}
.bande-secteurs__piste span{font-family:var(--geant);font-weight:400;font-stretch:100%;text-transform:uppercase;letter-spacing:0}
.flux__etape,.flux__scene{border-radius:0}

/* ---------- Bande finale et pied de page ---------- */
.fin__bande{position:relative;z-index:2;display:flex;overflow:hidden;background:var(--nuit);color:var(--texte);border-bottom:2px solid var(--texte);padding-top:clamp(20px,3vw,40px)}
.fin__bande a{display:flex;flex:none;color:inherit}
.bandes-pause{position:absolute;right:var(--gouttiere);top:10px;z-index:3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--nuit);color:var(--texte);border:1px solid var(--trait-2);cursor:pointer}
.bandes-pause svg{width:16px;height:16px;fill:currentColor}
.bandes-pause .ico-lecture,html.bandes-arretees .bandes-pause .ico-pause{display:none}
html.bandes-arretees .bandes-pause .ico-lecture{display:inline}
html.bandes-arretees .fin__piste,html.bandes-arretees .bande__piste,html.bandes-arretees .bande-secteurs__piste{animation-play-state:paused!important}
.fin__piste{display:flex;flex:none;align-items:center;animation:defile-fin 28s linear infinite}
.fin__bande:hover .fin__piste,.fin__bande:focus-within .fin__piste{animation-play-state:paused}
@keyframes defile-fin{to{transform:translateX(-100%)}}
.fin__piste b{position:relative;font-family:var(--geant);font-weight:400;text-transform:uppercase;font-size:clamp(84px,15vw,250px);line-height:.92;white-space:nowrap;padding-top:.12em}
.fin__piste b em{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%) rotate(-4deg);font-family:var(--plume);font-style:normal;text-transform:none;font-size:.36em;color:var(--plume-sombre);white-space:nowrap}
.badge{flex:none;position:relative;width:clamp(110px,15vw,220px);aspect-ratio:1;margin:0 clamp(14px,2.4vw,40px) -12%;color:#1B0D07}
.badge svg{width:100%;height:100%}
.badge .tourne{animation:tourne 18s linear infinite;transform-origin:50% 50%}
@keyframes tourne{to{transform:rotate(360deg)}}
.footer{position:relative;z-index:2;border-top:0;background:var(--nuit)}
.footer .brand{color:var(--texte)}
.footer .brand>span{color:var(--orange-vif)}
.footer h4,.footer .footer__titre{font-family:var(--titre);font-weight:600;font-size:12px;letter-spacing:.07em;color:var(--texte)}
.footer__mot{font-family:var(--geant);font-weight:400;font-stretch:100%;letter-spacing:0;text-transform:uppercase;font-size:clamp(70px,23vw,420px);line-height:.82}

/* =====================================================================
   ACCUEIL
   ===================================================================== */
/* Écran d'ouverture */
.ouvre{display:none}
html.ouverture .ouvre{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#1B0D07;color:#F6F1E9;clip-path:ellipse(140% 110% at 50% 0%);transition:clip-path 1.25s var(--elan)}
html.ouverture.ouvert .ouvre{clip-path:ellipse(140% 0% at 50% -12%)}
.ouvre__titre{position:absolute;top:34px;left:0;right:0;text-align:center}
.ouvre__ligne{position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(246,241,233,.65);transform:scaleX(var(--c,0));transform-origin:left}
.ouvre__n{position:absolute;top:calc(50% - 26px);font-size:14px;font-variant-numeric:tabular-nums}
.ouvre__n--g{left:var(--gouttiere)}.ouvre__n--d{right:var(--gouttiere);top:calc(50% + 10px)}
.eventail{position:relative;width:min(17vw,200px);aspect-ratio:4/5}
.eventail img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;box-shadow:0 20px 50px -20px #000;opacity:0;transform:scale(.9);transition:transform 1s var(--courbe),opacity .5s}
html.ouverture.pret .eventail img{opacity:1;transform:translateX(calc(var(--k) * 104%)) scale(calc(1 - var(--e) * .1))}
html.ouverture.ouvert .eventail img{transform:scale(.6);opacity:0;transition-duration:.6s}
.ouvre__tour{position:absolute;bottom:44px;left:50%;width:22px;height:22px;margin-left:-11px;border:1.5px solid rgba(246,241,233,.3);border-top-color:#FF9A3D;border-radius:50%;animation:tourne 1s linear infinite}

/* Haut de page */
.haut{position:relative;overflow-x:clip;min-height:100svh;padding:calc(var(--nav-h) + 16px) var(--gouttiere) 0;background:linear-gradient(180deg,var(--ciel-1) 0%,var(--ciel-2) 52%,var(--ciel-1) 100%)}
.cadre{position:relative;height:calc(100svh - var(--nav-h) - 16px - 74px);min-height:460px;background:var(--cadre)}
.cadre::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:color-mix(in srgb,var(--encre) 8%,transparent)}
.hublot{position:absolute;left:7%;right:7%;top:9%;bottom:9%;border-radius:50%;overflow:hidden;z-index:1;transform:rotate(-11deg);background:linear-gradient(200deg,#F1A772 0%,#F8DCC4 48%,#EE9A62 100%);animation:respire 14s ease-in-out infinite alternate}
.hublot::after{content:"";position:absolute;right:16%;top:16%;width:17%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#FFF6E8 0 34%,rgba(255,240,220,.55) 46%,transparent 70%)}
.nuage{position:absolute;border-radius:50%;filter:blur(26px);background:#fff;opacity:.75;animation:derive linear infinite}
.nuage:nth-child(1){width:42%;height:38%;left:-10%;top:8%;animation-duration:46s}
.nuage:nth-child(2){width:30%;height:30%;left:50%;top:48%;animation-duration:64s;animation-delay:-20s;opacity:.6}
.nuage:nth-child(3){width:26%;height:24%;left:20%;top:62%;animation-duration:52s;animation-delay:-36s;opacity:.5}
@keyframes derive{from{transform:translateX(-60%)}to{transform:translateX(320%)}}
.anneau{position:absolute;left:3.5%;right:3.5%;top:3%;bottom:3%;border-radius:50%;border:1px solid color-mix(in srgb,var(--encre) 16%,transparent);transform:rotate(-11deg);z-index:1;animation:respire 14s ease-in-out infinite alternate-reverse}
.anneau::before{content:"";position:absolute;left:50%;top:-5px;width:9px;height:9px;border-radius:50%;background:var(--plume-clair)}
.battement{position:absolute;left:0;right:0;top:calc(50% - 30px);width:100%;height:60px;z-index:1;overflow:visible}
.battement path{fill:none;stroke:var(--plume-clair);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-dasharray:170 830;animation:battre 3.4s linear infinite}
@keyframes battre{from{stroke-dashoffset:170}to{stroke-dashoffset:-830}}
.affiche{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;gap:calc((100svh - var(--nav-h) - 90px) * .4);font-family:var(--geant);text-transform:uppercase;font-size:min(15.2vw,calc((100svh - var(--nav-h) - 90px) * .5));line-height:.8;color:var(--encre);pointer-events:none;user-select:none;transform:translate(calc(var(--mx,0) * -14px),calc(var(--my,0) * -10px))}
.affiche span{display:inline-block;white-space:nowrap}
.affiche__d{color:var(--plume-clair)}
.affiche__g{transform:translateX(calc(var(--s,0) * -22vw))}.affiche__d{transform:translateX(calc(var(--s,0) * 22vw))}
.affiche b{display:inline-block;font-weight:400;transform-origin:0 100%}
.logo3d{position:absolute;left:0;right:0;top:-17%;bottom:-17%;z-index:2;pointer-events:none}
.logo3d canvas{width:100%;height:100%;opacity:0;transition:opacity 1.2s .2s}
.logo3d.is-3d canvas{opacity:1}
.logo3d__secours{position:absolute;left:50%;top:50%;width:min(30%,260px);aspect-ratio:1;transform:translate(-50%,-50%) rotate(-6deg);border-radius:20%;background:linear-gradient(145deg,#3A1A0C,#1E0A04);display:grid;place-items:center;transition:opacity .6s}
.logo3d__secours svg{width:70%}
.logo3d.is-3d .logo3d__secours{opacity:0}
.coin{position:absolute;z-index:4}
.coin--hg{left:26px;top:26px;display:grid;justify-items:start}
.coin--hg .cartouche+.cartouche{border-top:0}
.coin--hd{right:26px;top:26px}
.coin--bg{left:26px;bottom:26px}
.coin--bd{right:26px;bottom:26px;display:flex;align-items:center}
.pouls-i{width:30px;height:12px}
.pouls-i polyline{stroke-dasharray:90;animation:pouls-i 2.2s ease-in-out infinite}
@keyframes pouls-i{0%{stroke-dashoffset:90}55%,100%{stroke-dashoffset:0}}
.bande{position:relative;z-index:3;display:flex;overflow:hidden;height:74px;align-items:center;margin:0 calc(var(--gouttiere) * -1);color:var(--encre)}
.bande__piste{display:flex;flex:none;gap:clamp(40px,6vw,100px);padding-right:clamp(40px,6vw,100px);animation:defile-fin 38s linear infinite}
.bande:hover .bande__piste{animation-play-state:paused}
.bande span{white-space:nowrap;font-size:12px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;word-spacing:1.4em}
/* Entrée du haut de page */
html.anime .haut~* .rien{opacity:1}
html.anime.accueil .nav__inner>*,html.anime .coin,html.anime .bande{opacity:0;transform:translateY(14px);transition:opacity .9s var(--courbe),transform .9s var(--courbe);transition-delay:calc(var(--d,0) * 90ms)}
html.anime .cadre{clip-path:inset(46% 46% 46% 46%);transition:clip-path 1.3s var(--elan)}
html.anime.entre .nav__inner>*,html.anime.entre .coin,html.anime.entre .bande{opacity:1;transform:none}
html.anime.entre .cadre{clip-path:inset(-60% -10% -60% -10%)}
html.anime .affiche b{opacity:0;transform:translate(.14em,-.5em) skewX(-34deg) scale(.62,.22);transition:transform 1s var(--courbe),opacity .7s;transition-delay:calc(.25s + var(--i) * 80ms)}
html.anime.entre .affiche b{opacity:1;transform:none}

/* Titres géants : lettres qui tombent au rythme du défilement */
.geant{font-family:var(--geant);font-weight:400;text-transform:uppercase;font-size:clamp(64px,19vw,330px);line-height:.86;letter-spacing:-.005em}
.geant em{font-style:normal;color:inherit}
.ligne{position:relative;display:block;white-space:nowrap}
.l{display:inline-block;transform-origin:0 100%;--q:clamp(0,calc((var(--p) - .05 - var(--i) * .013) * 6.5),1);
  opacity:calc(.1 + .9 * var(--q));
  transform:translate(calc((1 - var(--q)) * .14em),calc((1 - var(--q)) * -.5em)) skewX(calc((1 - var(--q)) * -34deg)) scale(calc(.62 + .38 * var(--q)),calc(.22 + .78 * var(--q)))}
.plume{position:absolute;left:50%;top:50%;z-index:2;font-family:var(--plume);text-transform:none;font-size:.34em;line-height:1;white-space:nowrap;color:var(--plume-sombre);pointer-events:none;--q:clamp(0,calc((var(--p) - .3) * 8),1);opacity:var(--q);transform:translate(-50%,calc(-50% + (1 - var(--q)) * .5em)) rotate(calc(-5deg - (1 - var(--q)) * 7deg))}
.manifeste{position:relative;padding:clamp(40px,8vw,120px) var(--gouttiere) clamp(70px,10vw,150px);background:linear-gradient(180deg,var(--ciel-1) 0,var(--nuit) 38%);color:var(--texte);text-align:center}
.duo{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(20px,5vw,90px);max-width:1280px;margin:clamp(50px,7vw,110px) auto 0}
.duo>p,.duo>div:not(.ovale){color:var(--texte-2);max-width:40ch;justify-self:center}
.duo .hero__sub{margin:0;font-size:clamp(16px,1.3vw,18px);line-height:1.65;text-align:left}
.duo .hero__prix{margin:14px 0 0;font-size:15.5px}
.duo .hero__prix strong{color:var(--texte)}
.duo .hero__prix a{color:var(--texte);text-decoration:underline;text-underline-offset:4px}
.note-google{display:inline-flex;align-items:center;gap:10px;color:var(--texte)}
.note-google__etoiles{color:var(--plume-sombre);letter-spacing:.08em}
.ovale{width:170px;height:270px;border:1px solid color-mix(in srgb,var(--texte) 22%,transparent);border-radius:999px;display:grid;place-items:center;font-family:var(--plume);font-size:120px;line-height:1;color:var(--plume-sombre);position:relative}
.ovale::before,.ovale::after{content:"✦";position:absolute;left:calc(50% - 8px);width:16px;height:16px;display:grid;place-items:center;font-family:var(--titre);font-size:14px;color:var(--texte-2);animation:tourne 9s linear infinite}
.ovale::before{top:26px}.ovale::after{bottom:26px;animation-direction:reverse}
.actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px 22px;margin-top:clamp(40px,5vw,70px)}
html.anime .vient{opacity:0;transform:translateY(26px);transition:opacity 1s var(--courbe),transform 1s var(--courbe);transition-delay:calc(var(--d,0) * 110ms)}
html.anime .vient.vu{opacity:1;transform:none}

/* Phrases qui s'allument mot par mot */
.phrase{font-family:var(--edito);font-style:italic;font-weight:400;text-transform:none;font-size:clamp(34px,5.2vw,84px);line-height:1.08;letter-spacing:-.01em}
.m{display:inline-block;--q:clamp(0,calc((var(--p) - var(--debut,.22) - var(--i) * var(--pas,.028)) * 14),1);opacity:calc(.24 + .76 * var(--q));transform:translateY(calc((1 - var(--q)) * .12em))}

/* Réalisations */
.real{padding:clamp(70px,9vw,140px) var(--gouttiere) calc(clamp(120px,16vw,260px) + var(--arc));background:var(--panneau)}
.filigrane{position:sticky;top:26vh;height:0;z-index:0;display:flex;justify-content:space-between;font-family:var(--geant);font-size:clamp(90px,17vw,300px);line-height:.8;color:color-mix(in srgb,var(--sur-panneau) 7%,transparent);pointer-events:none;user-select:none}
.real__tete{position:relative;z-index:1;text-align:center}
.real__titre{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:0 clamp(40px,14vw,260px);font-family:var(--plume);font-weight:400;text-transform:none;font-size:clamp(64px,10.5vw,180px);line-height:1;color:var(--plume-panneau);margin:0}
.real__titre>span{display:inline-block;--q:clamp(0,calc(var(--p) * 4.5 - .5),1);opacity:var(--q)}
.real__titre>span:first-child{transform:translateX(calc((1 - var(--q)) * -8vw))}
.real__titre>span:last-child{transform:translateX(calc((1 - var(--q)) * 8vw))}
.real__signe{display:block;width:26px;margin:clamp(26px,4vw,60px) auto clamp(60px,9vw,140px);position:relative;z-index:1;animation:tourne 14s linear infinite}
.projets{position:relative;z-index:1;display:grid;gap:clamp(110px,15vw,240px);max-width:1180px;margin:0 auto;padding:0;list-style:none}
.projet{position:relative;width:min(100%,760px)}
.projet:nth-child(even){margin-left:auto}
.projet h3{position:relative;z-index:2;font-family:var(--geant);font-weight:400;text-transform:uppercase;font-size:clamp(54px,9vw,150px);line-height:.86;margin:0 0 -.36em -.5em;color:var(--sur-panneau);text-wrap:balance;--q:clamp(0,calc(var(--p) * 4 - .35),1);opacity:calc(.15 + .85 * var(--q));transform:translateX(calc((1 - var(--q)) * -.4em))}
.projet h3.long{font-size:clamp(44px,6.4vw,104px)}
.projet:nth-child(even) h3{margin-left:-.7em}
.projet h3 i{font-family:var(--plume);font-style:normal;text-transform:none;font-size:1.25em;line-height:.6;margin-right:-.04em}
.passe{display:block;background:#06191A;padding:clamp(18px,4.5vw,56px) clamp(18px,6vw,84px);overflow:hidden;clip-path:inset(calc((1 - clamp(0,calc(var(--p) * 3.4 - .15),1)) * 50%) 0 0 0)}
.passe img{width:100%;height:auto;transform:translateY(calc((var(--p) - .5) * -9%)) scale(1.1)}
.projet .rond{position:absolute;right:clamp(-34px,-3vw,-12px);bottom:92px;width:clamp(72px,9vw,128px);height:clamp(72px,9vw,128px);background:#F6F1E9;color:#0B0B0C;z-index:3}
.projet .rond svg{width:34%;height:34%}
.projet a:hover>.rond svg{transform:translate(5px,-5px)}
.projet__bas{display:grid;grid-template-columns:auto 1fr;gap:14px 28px;align-items:start;margin-top:22px}
.pilule{display:inline-flex;gap:8px;padding:7px 14px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);border-radius:999px;white-space:nowrap}
.projet__bas p{color:var(--sur-panneau-2);font-size:15.5px;max-width:48ch}
.projet__voir{grid-column:2;justify-self:start;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid currentColor;padding:4px 0;min-height:32px;display:inline-flex;align-items:center}

/* Avis */
.avis{padding:clamp(80px,10vw,160px) var(--gouttiere) calc(clamp(60px,8vw,110px));background:var(--cadre);display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(30px,6vw,110px);align-items:start}
.avis__gauche{position:sticky;top:14vh;display:grid;gap:26px;justify-items:start}
.avis__note{font-family:var(--geant);font-size:clamp(120px,19vw,320px);line-height:.8;position:relative;margin:0}
.avis__note em{position:absolute;left:30%;top:44%;font-family:var(--plume);font-style:normal;font-size:.3em;color:var(--plume-clair);white-space:nowrap;transform:rotate(-6deg)}
.asterisques{display:flex;gap:6px;color:#E88100}
.asterisques svg{width:clamp(40px,5vw,72px);height:auto;animation:tourne 12s linear infinite}
.asterisques svg:nth-child(2){animation-direction:reverse}
.avis blockquote{margin:0}
.avis blockquote .phrase{font-size:clamp(30px,3.7vw,60px);line-height:1.12;--debut:.16;--pas:.012}
.avis figcaption,.avis__qui{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
.autres{display:grid;margin:clamp(40px,5vw,70px) 0 0;padding:0;border-top:1px solid var(--trait)}
.autres>*{display:grid;grid-template-columns:auto 1fr;gap:6px 22px;padding:20px 0;margin:0;border-bottom:1px solid var(--trait)}
.autres p{font-family:var(--edito);font-style:italic;font-size:22px;line-height:1.3;grid-column:2}
.autres small{font-style:normal;grid-column:2;font-size:12px;letter-spacing:.045em;text-transform:uppercase;font-weight:500}
.avis__boutons{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* Atouts */
.atouts{position:relative;z-index:2;padding:clamp(40px,6vw,100px) var(--gouttiere) clamp(90px,11vw,170px);background:var(--cadre);text-align:center;overflow:hidden}
.atouts .geant{font-size:clamp(34px,8.3vw,150px);line-height:.92;margin:0}
.atouts .ligne{white-space:normal}
.vignette{display:inline-block;vertical-align:middle;width:1.25em;height:.74em;margin:0 .12em;overflow:hidden;--q:clamp(0,calc((var(--p) - .28) * 7),1);transform:scale(var(--q)) rotate(calc((1 - var(--q)) * -20deg))}
.vignette img{width:100%;height:100%;object-fit:cover;object-position:top}
.atouts__pied{margin-top:clamp(40px,6vw,90px);font-size:12px;letter-spacing:.28em;text-transform:uppercase;font-weight:600}
.atouts+.section{padding-top:clamp(60px,8vw,110px)}

@media (prefers-reduced-motion:reduce){
  .bande__piste,.fin__piste,.badge .tourne,.nuage,.hublot,.anneau,.battement path,.real__signe,.asterisques svg,.ovale::before,.ovale::after,.pouls-i polyline,.page-hero::before,.page-hero::after,.hero-mini::before,.hero-mini::after{animation:none!important}
  .section--soft,.cta-banner,.final,.real,.avis{transform:none}
}

/* ---------- Tablette et téléphone ---------- */
@media (max-width:900px){
  .cadre{height:calc(100svh - var(--nav-h) - 16px - 150px);min-height:400px}
  .hublot{left:-6%;right:-6%;top:20%;bottom:28%}
  .anneau{left:-12%;right:-12%;top:14%;bottom:22%}
  .logo3d{top:-5%;bottom:calc(-5% + 70px)}
  .affiche{flex-direction:column;gap:clamp(150px,46vw,210px);font-size:24vw;padding-bottom:70px}
  .affiche__g{transform:translateY(calc(var(--s,0) * -30vh))}.affiche__d{transform:translateY(calc(var(--s,0) * 30vh))}
  .coin--hg{left:14px;top:14px;right:14px}.coin--hd{display:none}
  .coin--bg{left:14px;bottom:76px}.coin--bd{right:14px;bottom:14px}
  .geant{font-size:21vw}
  .manifeste{padding-left:8px;padding-right:8px}
  .duo,.actions{padding:0 16px}
  .duo{grid-template-columns:1fr;justify-items:center}
  .duo .ovale{order:-1;width:120px;height:190px;font-size:84px}
  .projet h3{margin-left:0!important;padding-left:.32em;font-size:clamp(50px,15vw,110px);margin-bottom:-.3em}
  .projet h3.long{font-size:clamp(40px,11.5vw,90px)}
  .projet .rond{right:-6px;bottom:auto;top:38%}
  .projet__bas{grid-template-columns:1fr}
  .projet__voir{grid-column:1}
  .filigrane{font-size:26vw}
  .avis{grid-template-columns:1fr}
  .avis__gauche{position:static}
  .autres>*{grid-template-columns:1fr}.autres p,.autres small{grid-column:1}
  .avis__boutons .btn{flex:1 1 100%}
  .atouts .geant{font-size:12.4vw}
  .page-hero::before,.hero-mini::before,.page-legale .hero::before,.section:has(.contact-grid)::before{width:120vw;right:-40%;top:auto;bottom:-6%}
  .page-hero::after,.hero-mini::after,.page-legale .hero::after,.section:has(.contact-grid)::after{width:136vw;right:-48%;top:auto;bottom:-10%}
}

/* Contrôle responsive du 11/11 : rien ne doit élargir la page, case de consentement à 16 px (pas de zoom iPhone) */
.manifeste,.real,.avis,.atouts,.fin__bande{overflow-x:clip}
.cf-consent input{font-size:16px}
.telephone__badge{font-size:12px}
#wab-consent{z-index:10001}

/* Téléphones et tablettes tactiles (mesure du 11/11 : 32 -> visé 50+ images/s au défilement) :
   pas de grain plein écran, pas de nuages flous animés, sections en arc sans élargissement animé */
@media (hover:none),(max-width:900px){
  .grain{display:none}
  .nuage{display:none}
  .hublot,.anneau,.page-hero::before,.page-hero::after,.hero-mini::before,.hero-mini::after{animation:none}
  .section--soft,.cta-banner,.final,.real,.avis{transform:none}
}
/* Téléphone « Pourquoi nous choisir » plus petit sur mobile */
@media (max-width:900px){
  .split__media .telephone{width:min(210px,58%)}
  .telephone__badge{font-size:12px;padding:8px 11px}
}

/* Correctif 11/11 : sur ordinateur, le menu sur 3 lignes ne touche plus le cadre du haut de page */
@media (min-width:961px){
  .nav__links a{line-height:1.4}
  .haut{padding-top:calc(var(--nav-h) + 34px)}
  .cadre{height:calc(100svh - var(--nav-h) - 34px - 74px)}
}