/* creation-site-internet-neuchatel.ch — gabarit création de site */
:root{
--acc:#c2410c;--acc2:#7c2d12;--cyan:#35D0E0;
--encre:#141218;--encre2:#1C1A22;--doux:#5F5B69;--fond:#FFFFFF;--fond2:#fdf7f3;--trait:#E4E2E8;
--dis:'Plus Jakarta Sans','Segoe UI',system-ui,sans-serif;--txt:'Figtree','Segoe UI',system-ui,sans-serif;

--o1:0 1px 2px rgba(20,18,24,.06),0 1px 3px rgba(20,18,24,.05);
--o2:0 1px 2px rgba(20,18,24,.05),0 8px 16px -6px rgba(20,18,24,.12);
--o3:0 2px 4px rgba(20,18,24,.05),0 14px 28px -10px rgba(20,18,24,.16),0 34px 60px -34px rgba(20,18,24,.24);
--o4:0 2px 6px rgba(20,18,24,.06),0 22px 44px -16px rgba(20,18,24,.22),0 60px 110px -55px rgba(20,18,24,.4);
--t-xs:clamp(0.780rem,0.700rem + .12vw,1.014rem);
--t-sm:clamp(0.840rem,0.800rem + .16vw,1.170rem);
--t-md:clamp(1.000rem,0.960rem + .2vw,1.378rem);
--t-lg:clamp(1.200rem,1.100rem + .5vw,1.820rem);
--t-xl:clamp(1.500rem,1.250rem + 1.2vw,2.730rem);
--t-2xl:clamp(1.950rem,1.500rem + 2.2vw,3.900rem);
--t-3xl:clamp(2.400rem,1.700rem + 3.4vw,5.460rem);
--t-4xl:clamp(2.900rem,1.900rem + 4.8vw,7.280rem);
--e1:.35rem;--e2:.7rem;--e3:1.1rem;--e4:1.7rem;--e5:2.6rem;--e6:4rem;--e7:6rem;--e8:9rem;--r:8px;--rc:20px;
}

*,*::before,*::after{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{font-family:var(--txt);font-size:17px;line-height:1.6;color:var(--encre);
background:var(--fond);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
font-synthesis-weight:none}
img,svg,video{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{font-family:var(--dis);line-height:1.08;text-wrap:balance;font-weight:800;
letter-spacing:-.02em}
p{text-wrap:pretty}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
ul,ol{list-style:none;padding:0}

/* Accessibilité : un focus visible, et de la place autour. */
:focus-visible{outline:2.5px solid var(--acc);outline-offset:3px;border-radius:3px}
.cr-saut{position:absolute;left:-9999px;z-index:999}
.cr-saut:focus{left:1rem;top:1rem;background:var(--fond);color:var(--encre);
padding:.7rem 1.1rem;border:2px solid var(--acc);border-radius:8px}

/* Chiffres alignés partout où ils se comparent. */
.cr-num,[class*="__val"],[class*="__prix"],[class*="__montant"]{font-variant-numeric:tabular-nums}

/* ---------- révélation au défilement ----------
   L'etat AU REPOS est visible. La classe .js n'est posee que si le script
   tourne : sans lui, aucun opacity:0 n'existe et la page est complete. Une
   capture d'ecran, un lecteur qui ne defile pas, un robot : tous voient tout.
   (Pas de backtick dans ce commentaire : il vit dans un template literal.) */
.js .cr-rev{opacity:0;transform:translateY(18px);
transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);
transition-delay:var(--r,0ms)}
.js .cr-rev[data-vu]{opacity:1;transform:none}

/* ---------- bandeau défilant ---------- */
.cr-defile{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)}
.cr-defile__piste{display:flex;gap:2.5rem;width:max-content;animation:cr-defiler 42s linear infinite}
.cr-defile:hover .cr-defile__piste{animation-play-state:paused}
@keyframes cr-defiler{to{transform:translateX(-50%)}}

/* ---------- sections longues : on ne peint que ce qui est à l'écran ---------- */
.cr-bas{content-visibility:auto;contain-intrinsic-size:auto 600px}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
  transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .cr-rev{opacity:1;transform:none}
  .cr-defile__piste{animation:none;width:auto;flex-wrap:wrap}
}
html,body{overflow-x:clip}

/* ---------- visuels : socle ---------- */
.cr-visuel{margin:0;position:relative}
.cr-visuel__leg{font-size:.78rem;color:var(--doux);margin-top:.7rem;line-height:1.45}
.cr-visuel__leg strong{color:var(--encre);font-variant-numeric:tabular-nums}

/* ---------- SERP ---------- */
.cr-serp{background:var(--fond);border:1px solid var(--trait);border-radius:14px;padding:.9rem;
box-shadow:0 1px 2px rgba(16,24,40,.04),0 12px 28px -12px rgba(16,24,40,.18),0 40px 70px -40px rgba(16,24,40,.28)}
.cr-serp__barre{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border:1px solid var(--trait);
border-radius:999px;color:var(--doux);margin-bottom:.85rem;background:color-mix(in srgb,var(--encre) 3%,transparent)}
.cr-serp__req{font-size:.83rem;color:var(--encre)}
.cr-serp__liste{display:flex;flex-direction:column;gap:var(--serp-gap,.3rem);--serp-h:4.6rem;--serp-gap:.3rem}
.cr-serp__item{height:var(--serp-h);padding:.6rem .8rem;border-radius:10px;position:relative;overflow:hidden}
.cr-serp__url{font-size:.68rem;color:var(--doux);letter-spacing:.01em}
.cr-serp__titre{font-size:.9rem;color:color-mix(in srgb,var(--acc) 72%,var(--encre));font-weight:560;margin-top:.1rem;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cr-serp__desc{display:flex;flex-direction:column;gap:.28rem;margin-top:.4rem}
.cr-serp__desc span{height:.36rem;border-radius:2px;background:color-mix(in srgb,var(--encre) 9%,transparent)}
.cr-serp__desc span:last-child{width:62%}
.cr-serp__item--nous{background:color-mix(in srgb,var(--acc) 8%,transparent);
box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 26%,transparent)}
.cr-serp__item--nous .cr-serp__titre{color:var(--acc)}
.cr-serp__rang{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);width:1.55rem;height:1.55rem;
border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;font-size:.76rem;font-weight:700;
font-variant-numeric:tabular-nums}
/* Au repos, le client est PREMIER (c'est ce qu'on vend). L'animation rejoue
   seulement la montee : il part trois lignes plus bas et remonte, pendant que
   les trois concurrents, partis une ligne plus haut, redescendent. */
.js .cr-serp[data-vu] .cr-serp__item--nous{animation:cr-monte 1.5s cubic-bezier(.16,1,.3,1) .25s both;z-index:1}
.js .cr-serp[data-vu] .cr-serp__rang span{animation:cr-rang 1.5s steps(1) .25s both}
@keyframes cr-monte{0%,45%{transform:translateY(calc(3 * (var(--serp-h) + var(--serp-gap))))}100%{transform:translateY(0)}}
.js .cr-serp[data-vu] .cr-serp__item:not(.cr-serp__item--nous){animation:cr-descend 1.5s cubic-bezier(.16,1,.3,1) .25s both}
@keyframes cr-descend{0%,45%{transform:translateY(calc(-1 * (var(--serp-h) + var(--serp-gap))))}100%{transform:translateY(0)}}
@keyframes cr-rang{0%{content:"4"}100%{content:"1"}}

/* ---------- graphique ---------- */
.cr-graph{width:100%}
.cr-gr__svg{width:100%;height:auto;display:block;overflow:visible}
.cr-gr__ligne{stroke:var(--trait);stroke-width:1;stroke-dasharray:2 5}
.cr-gr__h{stop-color:var(--acc);stop-opacity:.26}
.cr-gr__b{stop-color:var(--acc);stop-opacity:0}
.cr-gr__trait{stroke:var(--acc);stroke-width:2.5}
.cr-gr__pt{fill:var(--acc);stroke:var(--fond);stroke-width:3}
.cr-gr__lab{fill:var(--doux);font-size:11px;text-anchor:middle;font-variant-numeric:tabular-nums}
.js .cr-graph .cr-gr__trait{stroke-dasharray:1400;stroke-dashoffset:1400}
.js .cr-graph .cr-gr__aire,.js .cr-graph .cr-gr__pt{opacity:0}
.js .cr-graph[data-vu] .cr-gr__trait{animation:cr-trace 1.9s cubic-bezier(.3,.7,.3,1) forwards}
.js .cr-graph[data-vu] .cr-gr__aire{animation:cr-fondu .9s ease .7s forwards}
.js .cr-graph[data-vu] .cr-gr__pt{animation:cr-fondu .5s ease 1.7s forwards,cr-pulse 2.6s ease-in-out 2.2s infinite}
@keyframes cr-trace{to{stroke-dashoffset:0}}
@keyframes cr-fondu{to{opacity:1}}
@keyframes cr-pulse{0%,100%{r:5}50%{r:6.5}}

/* ---------- nuage de communes ---------- */
.cr-nu__svg{width:100%;height:auto;display:block;max-height:30rem;margin-inline:auto}
.cr-nu__pt{fill:var(--encre);opacity:.17}
.cr-nu__pt--on{fill:var(--acc);opacity:.95}
.js .cr-nuage[data-vu] .cr-nu__pt{animation:cr-poser .5s ease var(--r,0ms) both}
.cr-nu__pt:nth-child(12n+1){--r:0ms}.cr-nu__pt:nth-child(12n+2){--r:55ms}.cr-nu__pt:nth-child(12n+3){--r:110ms}.cr-nu__pt:nth-child(12n+4){--r:165ms}.cr-nu__pt:nth-child(12n+5){--r:220ms}.cr-nu__pt:nth-child(12n+6){--r:275ms}.cr-nu__pt:nth-child(12n+7){--r:330ms}.cr-nu__pt:nth-child(12n+8){--r:385ms}.cr-nu__pt:nth-child(12n+9){--r:440ms}.cr-nu__pt:nth-child(12n+10){--r:495ms}.cr-nu__pt:nth-child(12n+11){--r:550ms}.cr-nu__pt:nth-child(12n+12){--r:605ms}
@keyframes cr-poser{from{opacity:0;transform:translateY(5px)}}
.js .cr-nuage[data-vu] .cr-nu__pt--on{animation:cr-poserOn .6s ease var(--r,0ms) both}
@keyframes cr-poserOn{from{opacity:0;transform:scale(.3)}to{opacity:.95;transform:scale(1)}}

/* ---------- devis ---------- */
.cr-devis{background:var(--fond);border:1px solid var(--trait);border-radius:12px;padding:1.25rem 1.35rem}
.cr-devis__tete{display:flex;justify-content:space-between;align-items:baseline;
padding-bottom:.7rem;border-bottom:1px solid var(--trait);margin-bottom:.85rem}
.cr-devis__eti{font-size:.76rem;text-transform:uppercase;letter-spacing:.16em;font-weight:700;color:var(--acc)}
.cr-devis__num{font-size:.78rem;color:var(--doux);font-variant-numeric:tabular-nums}
.cr-devis__l{list-style:none;padding:0;margin:0}
.cr-devis__l li{display:flex;justify-content:space-between;gap:1rem;padding:.42rem 0;font-size:.9rem;
border-bottom:1px dotted var(--trait)}
.cr-devis__l b{font-variant-numeric:tabular-nums;color:var(--doux);font-weight:600}
.cr-devis__total{display:flex;justify-content:space-between;align-items:baseline;margin-top:.9rem;
padding-top:.75rem;border-top:2px solid var(--encre)}
.cr-devis__total span{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.cr-devis__total b{font-size:1.5rem;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.cr-devis__note{margin:.7rem 0 0;font-size:.78rem;color:var(--doux)}
.js .cr-devis[data-vu] .cr-devis__l li{animation:cr-ligne .5s cubic-bezier(.16,1,.3,1) var(--r,0ms) both}
@keyframes cr-ligne{from{opacity:0;transform:translateX(-8px)}}

/* ---------- fenêtre ---------- */
.cr-fen{background:var(--fond);border-radius:12px;overflow:hidden;border:1px solid var(--trait);
box-shadow:0 2px 4px rgba(16,24,40,.04),0 18px 40px -16px rgba(16,24,40,.24),0 48px 90px -50px rgba(16,24,40,.4)}
.cr-fen__barre{display:flex;align-items:center;gap:.3rem;padding:.55rem .75rem;
background:color-mix(in srgb,var(--encre) 5%,transparent);border-bottom:1px solid var(--trait)}
.cr-fen__barre i{width:.5rem;height:.5rem;border-radius:50%;background:color-mix(in srgb,var(--encre) 18%,transparent)}
.cr-fen__url{margin-left:.6rem;font-size:.76rem;color:var(--doux);background:var(--fond);
padding:.1rem .55rem;border-radius:999px;border:1px solid var(--trait)}
.cr-fen__corps{padding:1.1rem}
.cr-fen__nav{display:flex;align-items:center;gap:.4rem;margin-bottom:1rem}
.cr-fen__nav b{width:2.6rem;height:.62rem;border-radius:3px;background:var(--acc)}
.cr-fen__nav u{width:1.5rem;height:.42rem;border-radius:3px;background:color-mix(in srgb,var(--encre) 13%,transparent)}
.cr-fen__h1{height:1.15rem;width:70%;border-radius:4px;background:color-mix(in srgb,var(--encre) 78%,transparent);margin-bottom:.7rem}
.cr-fen__p{height:.45rem;border-radius:3px;background:color-mix(in srgb,var(--encre) 11%,transparent);margin-bottom:.35rem}
.cr-fen__p--court{width:66%;margin-bottom:1rem}
.cr-fen__grille{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1rem}
.cr-fen__grille span{height:3.1rem;border-radius:6px;background:color-mix(in srgb,var(--encre) 8%,transparent)}
.cr-fen__cta{height:1.5rem;width:38%;border-radius:6px;background:var(--acc)}
.js .cr-fen[data-vu] .cr-fen__nav,.js .cr-fen[data-vu] .cr-fen__h1,
.js .cr-fen[data-vu] .cr-fen__p,.js .cr-fen[data-vu] .cr-fen__grille span,
.js .cr-fen[data-vu] .cr-fen__cta{animation:cr-bloc .55s cubic-bezier(.16,1,.3,1) var(--r,0ms) both}
@keyframes cr-bloc{from{opacity:0;transform:translateY(9px) scaleX(.94);transform-origin:left}}

/* ---------- Core Web Vitals ---------- */
.cr-cwv{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.cr-cwv__i{text-align:center}
.cr-cwv__svg{width:64px;height:64px;transform:rotate(-90deg)}
.cr-cwv__fond{fill:none;stroke:var(--trait);stroke-width:5}
.cr-cwv__arc{fill:none;stroke:var(--acc);stroke-width:5;stroke-linecap:round;
stroke-dasharray:var(--c);stroke-dashoffset:var(--o)}
.cr-cwv__val{display:block;font-size:1.05rem;font-weight:700;margin-top:.35rem;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.cr-cwv__cle{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.13em;color:var(--acc);font-weight:700}
.cr-cwv__quoi{display:block;font-size:.8rem;color:var(--doux);margin-top:.3rem;line-height:1.35}
.js .cr-cwv[data-vu] .cr-cwv__arc{animation:cr-arc 1.5s cubic-bezier(.16,1,.3,1) var(--r,0ms) both}
@keyframes cr-arc{from{stroke-dashoffset:var(--c)}}

/* ---------- carte reelle : contour du canton qui se trace ---------- */
.cr-nu__terre{fill:color-mix(in srgb,var(--acc) 7%,transparent);stroke:color-mix(in srgb,var(--acc) 55%,transparent);stroke-width:1.1;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.cr-nu__terre--on{fill:color-mix(in srgb,var(--acc) 12%,transparent)}
.js .cr-carte .cr-nu__terre{stroke-dasharray:1;stroke-dashoffset:1}
.js .cr-carte[data-vu] .cr-nu__terre{animation:cr-terre 1.6s cubic-bezier(.3,.7,.3,1) forwards}
@keyframes cr-terre{to{stroke-dashoffset:0}}
.cr-carte .cr-nu__pt{opacity:.22}
.cr-carte .cr-nu__pt--on{opacity:.9}

/* ---------- commune mise en evidence dans le nuage ---------- */
.cr-nu__halo{fill:var(--acc);opacity:.18}
.cr-nu__pt--ici{fill:var(--acc);opacity:1;stroke:var(--fond);stroke-width:1.5}
.cr-nu__nom{fill:var(--encre);font-size:11px;font-weight:700;letter-spacing:-.01em}
.js .cr-nuage[data-vu] .cr-nu__halo{animation:cr-halo 2.4s ease-in-out .9s infinite}
.js .cr-nuage[data-vu] .cr-nu__nom{animation:cr-fondu .6s ease .8s both}
@keyframes cr-halo{0%,100%{opacity:.18;r:11}50%{opacity:.05;r:17}}

/* ---------- liste a cocher ---------- */
.cr-coches{list-style:none;padding:0;margin:0;display:grid;gap:.75rem}
.cr-coches__i{display:grid;grid-template-columns:1.5rem minmax(0,1fr);gap:.8rem;align-items:start;line-height:1.45}
.cr-coches__svg{width:1.5rem;height:1.5rem;margin-top:.05em}
.cr-coches__rond{fill:color-mix(in srgb,var(--acc) 10%,transparent);stroke:var(--acc);stroke-width:1.5}
.cr-coches__v{fill:none;stroke:var(--acc);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:0}
.js .cr-coches .cr-coches__v{stroke-dashoffset:20}
.js .cr-coches .cr-coches__i{opacity:0;transform:translateY(8px)}
.js .cr-coches[data-vu] .cr-coches__i{animation:cr-cocheIn .5s cubic-bezier(.16,1,.3,1) var(--r,0ms) both}
.js .cr-coches[data-vu] .cr-coches__v{animation:cr-cocheV .45s ease-out calc(var(--r,0ms) + 280ms) both}
@keyframes cr-cocheIn{to{opacity:1;transform:none}}
@keyframes cr-cocheV{to{stroke-dashoffset:0}}

/* ---------- mots animes ---------- */
.cr-mot{display:inline-block}
.js .cr-mot{opacity:0;transform:translateY(.35em) rotate(1.5deg);
animation:cr-motIn .75s cubic-bezier(.16,1,.3,1) calc(var(--i) * 65ms + 120ms) both}
@keyframes cr-motIn{to{opacity:1;transform:none}}

/* ---------- comparatif ---------- */
.cr-compar{display:grid;gap:.35rem}
.cr-compar__l{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.7fr) minmax(0,1.5fr) minmax(0,1.5fr);gap:1rem;
padding:.85rem 1rem;border-radius:10px;font-size:.9rem;line-height:1.4;align-items:start}
.cr-compar__l--tete{font-size:.76rem;text-transform:uppercase;letter-spacing:.14em;color:var(--doux);font-weight:700;padding-bottom:.4rem}
.cr-compar__l:not(.cr-compar__l--tete){background:color-mix(in srgb,var(--encre) 3.5%,transparent)}
.cr-compar__l--ici{background:color-mix(in srgb,var(--acc) 9%,transparent)!important;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--acc) 40%,transparent)}
.cr-compar__l b{font-weight:700;display:block}
.cr-compar__l b a{color:var(--acc);text-decoration:none}
.cr-compar__l b a:hover{text-decoration:underline}
.cr-compar__l i{font-style:normal;font-size:.76rem;text-transform:uppercase;letter-spacing:.12em;color:var(--acc);font-weight:700}
.js .cr-compar .cr-compar__l:not(.cr-compar__l--tete){opacity:0;transform:translateX(-10px)}
.js .cr-compar[data-vu] .cr-compar__l{animation:cr-comparIn .5s cubic-bezier(.16,1,.3,1) var(--r,0ms) both}
@keyframes cr-comparIn{to{opacity:1;transform:none}}
@media(max-width:700px){.cr-compar__l{grid-template-columns:minmax(0,1fr) auto}.cr-compar__l--tete{display:none}
.cr-compar__l span:nth-child(2){font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--doux);padding-top:.25rem}
.cr-compar__l span:nth-child(3),.cr-compar__l span:nth-child(4){grid-column:1/-1;font-size:.84rem;color:var(--doux)}
.cr-compar__l span:nth-child(3)::before{content:"Point fort · ";font-weight:700;color:var(--acc)}
.cr-compar__l span:nth-child(4)::before{content:"Vigilance · ";font-weight:700;color:var(--encre)}}

/* ---------- maillage ---------- */
.cr-ma__svg{width:100%;height:auto;display:block}
.cr-ma__l{stroke:var(--acc);stroke-width:.8;opacity:.3}
.cr-ma__n{fill:var(--acc);opacity:.65}
.cr-ma__n--r{opacity:1}
.cr-ma__t{fill:var(--doux);font-size:9.5px;text-transform:uppercase;letter-spacing:.09em}
.js .cr-maillage[data-vu] .cr-ma__l{animation:cr-fondu3 .5s ease var(--r,0ms) both}
.js .cr-maillage[data-vu] .cr-ma__n{animation:cr-fondu2 .45s ease var(--r,0ms) both}
@keyframes cr-fondu2{from{opacity:0;transform:scale(.2);transform-box:fill-box;transform-origin:center}to{opacity:.65}}
@keyframes cr-fondu3{from{opacity:0}to{opacity:.3}}

@media(prefers-reduced-motion:reduce){
  .js .cr-serp[data-vu] .cr-serp__item--nous,
  .js .cr-graph[data-vu] .cr-gr__trait,.js .cr-graph[data-vu] .cr-gr__aire,.js .cr-graph[data-vu] .cr-gr__pt,
  .js .cr-nuage[data-vu] .cr-nu__pt,.js .cr-nuage[data-vu] .cr-nu__pt--on,
  .js .cr-devis[data-vu] .cr-devis__l li,.js .cr-fen[data-vu] *,
  .js .cr-cwv[data-vu] .cr-cwv__arc,.js .cr-maillage[data-vu] *,
  .js .cr-coches *,.js .cr-mot,.js .cr-compar *,.js .cr-nuage[data-vu] .cr-nu__halo{animation:none!important}
  .js .cr-coches .cr-coches__i,.js .cr-mot,.js .cr-compar .cr-compar__l{opacity:1;transform:none}
  .js .cr-coches .cr-coches__v{stroke-dashoffset:0}
  .js .cr-carte .cr-nu__terre{stroke-dashoffset:0;animation:none!important}
  .js .cr-graph .cr-gr__trait{stroke-dashoffset:0}
  .js .cr-graph .cr-gr__aire,.js .cr-graph .cr-gr__pt{opacity:1}
}
.cr-large{width:min(1240px,92vw);margin-inline:auto}
.cr-etroit{width:min(780px,92vw);margin-inline:auto}
.cr-h1{font-size:clamp(2.2rem,4.1vw,3.9rem);line-height:1.02;letter-spacing:-.035em;margin-bottom:var(--e4);max-width:18ch;color:#fff;text-wrap:balance}
.cr-h1--court{font-size:clamp(2.3rem,4.8vw,4.2rem);max-width:18ch}
.cr-h1--long{font-size:clamp(2rem,3.7vw,3.5rem);max-width:22ch}
.cr-h2{font-size:var(--t-2xl);line-height:1.02;letter-spacing:-.035em;margin-bottom:var(--e4);max-width:24ch;text-wrap:balance}
.cr-h2--clair{color:#fff}
.cr-etiq{font-family:var(--dis);font-weight:700;font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.2em;color:var(--acc);margin-bottom:var(--e3)}
.cr-etiq--clair{color:var(--cyan)}
.cr-sur{font-family:var(--dis);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.22em;color:var(--cyan);font-weight:700;margin-bottom:var(--e4)}
.cr-chapo{font-size:var(--t-lg);color:rgba(255,255,255,.72);max-width:54ch;line-height:1.5}
.cr-lead{font-size:var(--t-xl);line-height:1.32;font-weight:500;letter-spacing:-.02em;margin-bottom:var(--e4)}
.cr-entete{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--e5);margin-bottom:var(--e5);flex-wrap:wrap}
.cr-entete .cr-h2{margin-bottom:0}
.cr-sous{color:var(--doux);max-width:40ch;font-size:var(--t-md)}
.cr-lien{color:var(--encre);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:.5rem;border-bottom:2px solid var(--acc);padding-bottom:.1rem}
.cr-lien svg{transition:transform .25s}.cr-lien:hover svg{transform:translateX(4px)}

/* boutons : rectangle net, coin 8 px. Le corail est reserve a l'action. */
.cr-bouton{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.5rem;border-radius:var(--r);font-weight:700;text-decoration:none;font-size:var(--t-sm);border:1.5px solid transparent;transition:transform .2s cubic-bezier(.16,1,.3,1),background .2s,border-color .2s,box-shadow .2s;text-align:center;font-family:var(--dis)}
.cr-bouton svg{transition:transform .25s}.cr-bouton:hover svg{transform:translateX(3px)}
.cr-bouton--corail{background:var(--acc);color:#fff;box-shadow:0 10px 30px -10px color-mix(in srgb,var(--acc) 80%,transparent)}
.cr-bouton--corail:hover{background:var(--acc2);transform:translateY(-2px)}
.cr-bouton--vide{border-color:var(--trait);color:var(--encre)}
.cr-bouton--vide:hover{border-color:var(--encre)}
.cr-bouton--ligne{color:#fff;border-color:rgba(255,255,255,.3)}
.cr-bouton--ligne:hover{border-color:#fff}
.cr-bouton--grand{padding:1.05rem 1.8rem;font-size:var(--t-md)}
.cr-wa{display:inline-flex;align-items:center;gap:.55rem;color:#fff;padding:.9rem 1.5rem;border-radius:var(--r);font-weight:700;text-decoration:none;font-size:var(--t-sm);border:1.5px solid rgba(255,255,255,.3);transition:background .2s,transform .2s;font-family:var(--dis)}
.cr-wa:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
.cr-wa__ico{color:#4ADE80}
.cr-wa--large{margin-top:var(--e3)}

/* en-tete pose sur le hero */
.cr-tete{position:absolute;top:0;left:0;right:0;z-index:40}
.cr-tete__int{display:flex;align-items:center;gap:var(--e4);height:5rem}
.cr-evitement{position:absolute;left:-9999px;top:0;background:var(--acc);color:#fff;padding:.5rem 1rem;z-index:100}
.cr-evitement:focus{left:1rem;top:1rem}
.cr-logo{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;font-family:var(--dis);font-weight:800;font-size:1.05rem;letter-spacing:-.03em;margin-right:auto;white-space:nowrap}
.cr-logo__pt{width:.7rem;height:.7rem;background:var(--acc);transform:rotate(45deg);border-radius:2px}
.cr-menu{display:flex;gap:.2rem;align-items:center}
.cr-menu>a,.cr-menu__b{color:rgba(255,255,255,.78);text-decoration:none;font-size:var(--t-sm);font-weight:500;padding:.45rem .7rem;background:none;border:0;font-family:inherit;cursor:pointer;border-radius:6px}
.cr-menu>a:hover,.cr-menu__b:hover{color:#fff;background:rgba(255,255,255,.08)}
.cr-menu__g{position:relative}
.cr-menu__vol{position:absolute;top:calc(100% + .4rem);left:0;min-width:230px;background:var(--fond);border-radius:var(--rc);box-shadow:var(--o4);padding:.5rem;display:none;flex-direction:column;z-index:50}
.cr-menu__g:hover .cr-menu__vol,.cr-menu__g:focus-within .cr-menu__vol{display:flex}
.cr-menu__vol a{padding:.5rem .75rem;text-decoration:none;color:var(--encre);font-size:var(--t-sm);border-radius:8px;font-weight:500}
.cr-menu__vol a:hover{background:var(--fond2);color:var(--acc)}
.cr-tete__act{display:flex;align-items:center;gap:var(--e3)}
.cr-tel{color:#fff;font-weight:600;text-decoration:none;font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.cr-tete__cta{padding:.6rem 1.1rem;font-size:var(--t-xs)}
.cr-menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:.5rem;cursor:pointer;margin-left:auto}
.cr-menu-btn span{display:block;width:24px;height:2px;background:#fff;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.cr-menu-btn[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.cr-menu-btn[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.cr-menu__pied{display:none}
html.menu-ouvert{overflow:hidden}
html.menu-ouvert .cr-barre{display:none!important}
.cr-barre{transition:transform .3s cubic-bezier(.16,1,.3,1)}
html.cta-visible .cr-barre{transform:translateY(120%)} /* un CTA est deja a l'ecran : la barre s'efface */ /* le panneau porte deja WhatsApp + devis : pas de doublon */

.cr-ariane ol{display:flex;flex-wrap:wrap;gap:.45rem;font-size:var(--t-xs);color:rgba(255,255,255,.5);margin-bottom:var(--e4)}
.cr-ariane li+li::before{content:"→";margin-right:.45rem}
.cr-ariane a{color:rgba(255,255,255,.5);text-decoration:none}.cr-ariane a:hover{color:#fff}

/* hero : sombre, lueur cyan derriere la maquette */
.cr-hero{background:var(--encre);color:#fff;padding:5.8rem 0 0;position:relative;overflow:hidden;isolation:isolate}
.cr-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
 radial-gradient(60rem 40rem at 85% 20%,color-mix(in srgb,var(--cyan) 18%,transparent),transparent 60%),
 radial-gradient(40rem 30rem at 0% 100%,color-mix(in srgb,var(--acc) 22%,transparent),transparent 60%)}
.cr-hero--court{padding-bottom:var(--e6)}
.cr-hero__int{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:var(--e6);align-items:center;padding-bottom:var(--e7)}
.cr-hero__act{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:var(--e5);align-items:center}
.cr-puces{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin-top:var(--e4)}
.cr-puces li{position:relative;padding-left:1.3rem;font-size:var(--t-xs);color:rgba(255,255,255,.7)}
.cr-puces li::before{content:"";position:absolute;left:0;top:.5em;width:.5rem;height:.5rem;background:var(--acc);transform:rotate(45deg)}
.cr-hero__vis{position:relative}
.cr-hero__vis::before{content:"";position:absolute;inset:-18% -14%;z-index:-1;background:radial-gradient(closest-side,color-mix(in srgb,var(--cyan) 30%,transparent),transparent)}
.cr-hero .cr-fen{--fond:#fff;--encre:#141218;--trait:#E6E4E9;--doux:#6B6875;transform:rotate(-1.5deg);box-shadow:0 40px 90px -30px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.1)}
.cr-hero__bande{border-top:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.25);padding:var(--e3) 0}
.cr-bande__i{display:inline-flex;align-items:baseline;gap:.7rem;white-space:nowrap;margin-right:2.5rem}
.cr-bande__i b{font-family:var(--dis);font-size:var(--t-lg);color:#fff;letter-spacing:-.02em}
.cr-bande__i i{font-style:normal;color:var(--cyan);font-size:var(--t-sm);font-weight:600}

.cr-formules,.cr-texte,.cr-tableau,.cr-prod,.cr-gar,.cr-maillage,.cr-faq,.cr-zones{padding:var(--e8) 0}
.cr-texte__int{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:var(--e6);align-items:start}
.cr-texte__int p{color:var(--doux);font-size:var(--t-md);margin-bottom:var(--e3);max-width:60ch}
.cr-texte__int .cr-lead{color:var(--encre);max-width:30ch;font-size:var(--t-xl)}
.cr-prose h2{font-size:var(--t-lg);margin:var(--e5) 0 var(--e2)}
.cr-prose p{margin-bottom:var(--e3);color:var(--doux)}
.cr-manque{color:var(--acc);font-style:italic}

/* formules : la vedette est sombre */
.cr-formules{background:var(--fond2)}
.cr-cartes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e4);align-items:stretch}
.cr-carte{background:#fff;border:1px solid var(--trait);border-radius:var(--rc);padding:var(--e5);display:flex;flex-direction:column;box-shadow:var(--o1);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.cr-carte:hover{transform:translateY(-4px);box-shadow:var(--o3)}
.cr-carte--vedette{background:var(--encre);color:#fff;border-color:transparent;box-shadow:var(--o4)}
.cr-carte--vedette .cr-carte__pour,.cr-carte--vedette .cr-carte__delai{color:rgba(255,255,255,.62)}
.cr-carte--vedette .cr-carte__prix{color:var(--cyan)}
.cr-carte__ruban{align-self:flex-start;background:var(--acc);color:#fff;font-family:var(--dis);font-size:var(--t-xs);font-weight:700;padding:.3rem .9rem;border-radius:999px;margin-bottom:var(--e3);text-transform:uppercase;letter-spacing:.1em}
.cr-carte__nom{font-size:var(--t-lg);margin-bottom:.3rem}
.cr-carte__prix{font-family:var(--dis);font-size:clamp(1.5rem,2vw,2.05rem);font-weight:800;color:var(--acc);letter-spacing:-.04em;line-height:1;white-space:nowrap}
.cr-carte__delai{font-size:var(--t-xs);color:var(--doux);margin:.3rem 0 var(--e3);text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.cr-carte__pour{font-size:var(--t-sm);color:var(--doux)}
.cr-inclus{margin:var(--e3) 0 var(--e4)}
.cr-inclus li{position:relative;padding-left:1.5rem;margin-bottom:.5rem;font-size:var(--t-sm)}
.cr-inclus li::before{content:"";position:absolute;left:.1rem;top:.5em;width:.5rem;height:.5rem;background:var(--acc);transform:rotate(45deg)}
.cr-carte--vedette .cr-inclus li::before{background:var(--cyan)}
.cr-carte .cr-bouton{margin-top:auto;justify-content:center}
.cr-carte--vedette .cr-bouton--corail{background:#fff;color:var(--encre);box-shadow:none}

/* tableau */
.cr-tableau__cadre{overflow-x:auto;border:1px solid var(--trait);border-radius:var(--rc);background:#fff;box-shadow:var(--o1)}
.cr-tableau table{border-collapse:collapse;width:100%;min-width:40rem}
.cr-tableau th,.cr-tableau td{padding:1rem 1.2rem;text-align:left;border-bottom:1px solid var(--trait);font-size:var(--t-sm)}
.cr-tableau thead th{background:var(--encre);color:#fff;font-family:var(--dis);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.1em}
.cr-tableau tbody th{font-weight:500}
.cr-tableau td{text-align:center;width:10rem}
.cr-tableau tr:last-child td,.cr-tableau tr:last-child th{border-bottom:0}
.cr-oui{display:inline-block;width:.7rem;height:.7rem;background:var(--acc);transform:rotate(45deg)}
.cr-non{color:var(--trait)}

/* production : sombre, frise verticale */
.cr-prod{background:var(--encre2);color:#fff}
.cr-prod__int{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--e7);align-items:start}
.cr-prod__p{color:rgba(255,255,255,.65);font-size:var(--t-md);max-width:44ch}
.cr-frise-v{border-left:2px solid rgba(255,255,255,.14)}
.cr-frise-v li{position:relative;padding:0 0 var(--e5) var(--e5)}
.cr-frise-v li::before{content:"";position:absolute;left:-.55rem;top:.5rem;width:.9rem;height:.9rem;background:var(--acc);transform:rotate(45deg);box-shadow:0 0 0 4px var(--encre2)}
.cr-frise-v__q{display:inline-block;font-family:var(--dis);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.15em;color:var(--cyan);font-weight:700;margin-bottom:.4rem}
.cr-frise-v h3{font-size:var(--t-xl);margin-bottom:.4rem;color:#fff}
.cr-frise-v p{color:rgba(255,255,255,.65);font-size:var(--t-md);max-width:52ch}
.cr-cms__int{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e4)}
.cr-cms__col{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--rc);padding:var(--e4)}
.cr-cms__t{font-family:var(--dis);font-weight:700;margin-bottom:var(--e2);color:var(--cyan)}
.cr-cms__col ul{padding-left:1.1em;color:rgba(255,255,255,.7);font-size:var(--t-sm);list-style:square}
.cr-cms__col li{margin-bottom:.4rem}

/* garanties */
.cr-gar__grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e4) var(--e6)}
.cr-gar__i{padding:var(--e4) 0;border-top:1px solid var(--trait)}
.cr-gar__i h3{font-size:var(--t-lg);margin-bottom:.4rem;letter-spacing:-.025em}
.cr-gar__i p{color:var(--doux);font-size:var(--t-sm)}

/* maillage */
.cr-maillage{background:var(--fond2)}
.cr-maillage__vis{margin-bottom:var(--e6);padding:var(--e4);background:#fff;border:1px solid var(--trait);border-radius:var(--rc)}
.cr-maille+.cr-maille{margin-top:var(--e5)}
.cr-maille h3{font-family:var(--dis);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.15em;color:var(--doux);margin-bottom:var(--e3);padding-bottom:.6rem;border-bottom:1px solid var(--trait)}
.cr-maille__l{display:grid;gap:.4rem 1rem}
.cr-maille__l--2{grid-template-columns:repeat(2,minmax(0,1fr))}.cr-maille__l--3{grid-template-columns:repeat(3,minmax(0,1fr))}.cr-maille__l--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cr-maille__l a{text-decoration:none;color:var(--encre);font-size:var(--t-sm);font-weight:500}.cr-maille__l a:hover{color:var(--acc)}
.cr-maille__l em{color:var(--doux);font-size:var(--t-xs);font-style:normal;margin-left:.35rem}
.cr-maillage__tout{margin-top:var(--e5)}

/* FAQ */
.cr-qr{border-bottom:1px solid var(--trait)}
.cr-qr summary{cursor:pointer;padding:1.3rem 2.4rem 1.3rem 0;font-weight:700;list-style:none;position:relative;font-size:var(--t-lg);font-family:var(--dis);letter-spacing:-.02em}
.cr-qr summary::-webkit-details-marker{display:none}
.cr-qr summary::after{content:"+";position:absolute;right:.2rem;top:1.1rem;color:var(--acc);font-weight:800;font-size:1.5rem;line-height:1;transition:transform .3s}
.cr-qr[open] summary::after{transform:rotate(45deg)}
.cr-qr p{color:var(--doux);margin:0 0 1.3rem;max-width:64ch}

/* zones */
.cr-zones{background:var(--fond2)}
.cr-zones__t{font-size:var(--t-xl);margin:var(--e6) 0 var(--e3)}
.cr-zones__t em{font-style:normal;color:var(--doux);font-size:var(--t-xs);font-weight:400;font-family:var(--txt);letter-spacing:.1em;text-transform:uppercase}
.cr-zones__l{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.35rem 1rem;font-size:var(--t-sm)}
.cr-zones__l a{text-decoration:none;color:var(--encre)}.cr-zones__l a:hover{color:var(--acc)}
.cr-zones__l em{color:var(--doux);font-size:var(--t-xs);font-style:normal;margin-left:.3rem}

/* contact */
.cr-contact{background:var(--encre);color:#fff;padding:var(--e8) 0;position:relative;overflow:hidden}
.cr-contact::before{content:"";position:absolute;right:-12rem;top:-12rem;width:40rem;height:40rem;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--acc) 30%,transparent),transparent)}
.cr-contact__int{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--e7);align-items:start;position:relative}
.cr-contact__p{color:rgba(255,255,255,.7);font-size:var(--t-md);max-width:46ch}
.cr-contact__coord{display:flex;flex-direction:column;margin-top:var(--e4)}
.cr-coord{display:flex;flex-direction:column;text-decoration:none;color:#fff;border-bottom:1px solid rgba(255,255,255,.14);padding:.9rem 0}
.cr-coord__lab{font-family:var(--dis);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.14em;opacity:.5}
.cr-coord__val{font-weight:700;font-size:var(--t-lg);font-family:var(--dis)}
.cr-contact__d{background:#fff;color:var(--encre);border-radius:calc(var(--rc)*1.2);padding:var(--e5);box-shadow:var(--o4)}
.cr-champ{margin-bottom:var(--e3);display:flex;flex-direction:column}
.cr-champ label{font-size:var(--t-xs);font-weight:700;margin-bottom:.35rem;font-family:var(--dis);text-transform:uppercase;letter-spacing:.08em;color:var(--doux)}
.cr-champ input,.cr-champ select,.cr-champ textarea{font-size:var(--t-md);padding:.85rem 1rem;border:1.5px solid var(--trait);border-radius:var(--r);width:100%;background:#fff}
.cr-champ input:focus,.cr-champ select:focus,.cr-champ textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 4px color-mix(in srgb,var(--acc) 16%,transparent)}
.cr-champ--accord label{flex-direction:row;display:flex;gap:.5rem;font-weight:400;font-family:var(--txt);text-transform:none;letter-spacing:0;font-size:var(--t-xs);align-items:flex-start}
.cr-champ--accord input{width:auto;margin-top:.22rem}
.cr-champ--envoi button{width:100%;background:var(--acc);color:#fff;border:0;border-radius:var(--r);padding:1.05rem;font-family:var(--dis);font-weight:800;font-size:var(--t-md);cursor:pointer;transition:background .2s,transform .2s}
.cr-champ--envoi button:hover{background:var(--acc2);transform:translateY(-1px)}
.cr-hors{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cr-etat{min-height:1.3em;font-size:var(--t-xs);margin-top:.6rem}
.cr-etat[data-etat="ok"]{color:#15803D;font-weight:700}.cr-etat[data-etat="ko"]{color:#B91C1C;font-weight:700}

/* (ancien pied retire : voir « pied unique du gabarit ») */
.cr-barre{display:none;position:fixed;bottom:0;left:0;right:0;z-index:60;gap:.5rem;padding:.6rem;background:var(--encre);border-top:1px solid rgba(255,255,255,.1)}
.cr-barre a{flex:1;text-align:center;padding:.85rem;border-radius:var(--r);text-decoration:none;font-weight:700;font-size:var(--t-sm);font-family:var(--dis)}
.cr-barre__tel{border:1.5px solid rgba(255,255,255,.3);color:#fff}.cr-barre__wa{background:#1FA855;color:#fff}.cr-barre__cta{background:var(--acc);color:#fff}

/* pages ville / canton / plateforme */
.cr-strip{border-top:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.25);padding:var(--e4) 0}
.cr-strip__int{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--e4);margin-block:0}
.cr-strip dt,.cr-strip span{font-family:var(--dis);font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.16em;color:var(--cyan);font-weight:700;display:block}
.cr-strip dt{margin-bottom:.3rem}
.cr-strip span{margin-top:.4rem;color:rgba(255,255,255,.55);letter-spacing:.08em;text-transform:none;font-family:var(--txt);font-weight:500}
.cr-strip dd{margin:0;color:#fff;font-weight:600;font-size:var(--t-md);line-height:1.35}
.cr-strip dd a{color:#fff}
.cr-strip b{font-family:var(--dis);font-size:var(--t-2xl);font-weight:800;color:#fff;letter-spacing:-.04em;line-height:1;display:block;font-variant-numeric:tabular-nums}
.cr-strip b small{font-size:.45em;color:var(--cyan)}
.cr-strip b.cr-strip__txt{font-size:var(--t-lg)}
.cr-fiche,.cr-carto{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--rc);padding:var(--e4);
--encre:#fff;--doux:rgba(255,255,255,.6);--trait:rgba(255,255,255,.14);--fond:rgba(255,255,255,.06);box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.cr-fiche .cr-visuel__leg,.cr-carto .cr-visuel__leg{color:rgba(255,255,255,.5)}
.cr-fiche__tete{display:flex;align-items:center;gap:var(--e3);margin-bottom:var(--e3)}
.cr-fiche__mono{font-family:var(--dis);font-weight:800;font-size:2.4rem;width:4.2rem;height:4.2rem;display:grid;place-items:center;background:var(--acc);color:#fff;border-radius:var(--r);flex:0 0 auto;transform:rotate(-4deg);box-shadow:0 12px 30px -10px color-mix(in srgb,var(--acc) 80%,transparent)}
.cr-fiche__mono--logo{transform:none}
.cr-fiche__mono--logo svg{width:60%;height:60%;fill:#fff}
.cr-carto .cr-nu__terre{stroke:rgba(53,208,224,.7);fill:rgba(53,208,224,.1)}
.cr-fiche__nom{font-family:var(--dis);font-weight:800;font-size:var(--t-xl);letter-spacing:-.03em;color:#fff;line-height:1.05}
.cr-fiche__sous{color:rgba(255,255,255,.55);font-size:var(--t-sm)}
.cr-fiche__dl{margin:0}
.cr-fiche__dl>div{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:1rem;padding:.6rem 0;border-top:1px solid rgba(255,255,255,.1);font-size:var(--t-sm)}
.cr-fiche__dl dt{font-family:var(--dis);color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.12em;font-size:var(--t-xs);padding-top:.15rem}
.cr-fiche__dl dd{margin:0;color:#fff;font-weight:600;line-height:1.4}
.cr-fiche__dl dd a{color:var(--cyan);text-decoration:none}
.cr-local,.cr-autour,.cr-terr,.cr-audit,.cr-compar-z,.cr-cmsloc{padding:var(--e8) 0}
.cr-local__int{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:var(--e7);align-items:center}
.cr-local__p,.cr-compar__p,.cr-audit__p{color:var(--doux);max-width:58ch;margin-bottom:var(--e4);font-size:var(--t-md)}
.cr-local .cr-coches{font-size:var(--t-md)}
.cr-offre{background:var(--encre);color:#fff;border-radius:var(--rc);padding:var(--e5);position:relative;overflow:hidden;box-shadow:var(--o4)}
.cr-offre::after{content:"";position:absolute;right:-6rem;top:-6rem;width:18rem;height:18rem;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--acc) 45%,transparent),transparent)}
.cr-offre>*{position:relative}
.cr-offre__t{font-family:var(--dis);font-weight:700;font-size:var(--t-lg);margin-bottom:.3rem}
.cr-offre__prix{font-family:var(--dis);font-weight:800;font-size:var(--t-3xl);letter-spacing:-.04em;line-height:1;color:var(--cyan);margin-bottom:var(--e3)}
.cr-offre p{color:rgba(255,255,255,.7);margin-bottom:var(--e4)}
.cr-autour,.cr-cmsloc{background:var(--fond2)}
.cr-communes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--e3)}
.cr-commune{display:flex;flex-direction:column;gap:.2rem;padding:var(--e4) var(--e4) var(--e5);background:#fff;border:1px solid var(--trait);border-radius:var(--rc);text-decoration:none;color:var(--encre);
box-shadow:var(--o1);position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.cr-commune::before{content:"";position:absolute;left:var(--e4);bottom:0;width:2rem;height:3px;background:var(--acc);transition:width .4s cubic-bezier(.16,1,.3,1)}
.cr-commune:hover{transform:translateY(-4px);box-shadow:var(--o3)}
.cr-commune:hover::before{width:100%;left:0}
.cr-commune__npa{font-family:var(--dis);font-weight:700;color:var(--acc);font-size:var(--t-xs);letter-spacing:.12em}
.cr-commune b{font-family:var(--dis);font-size:var(--t-lg);font-weight:700;letter-spacing:-.025em;line-height:1.15}
.cr-commune i{font-style:normal;color:var(--doux);font-size:var(--t-xs)}
.cr-pilules{display:flex;flex-wrap:wrap;gap:.45rem;margin:0}
.cr-pilules a{display:inline-block;padding:.45rem .95rem;border:1px solid var(--trait);border-radius:var(--r);text-decoration:none;color:var(--encre);font-size:var(--t-sm);font-weight:500;background:#fff;transition:border-color .2s,color .2s}
.cr-pilules a:hover{border-color:var(--acc);color:var(--acc)}
.cr-suite{margin-top:var(--e5)}
.cr-audit{background:var(--encre2);color:#fff}
.cr-audit__int{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--e7);align-items:center}
.cr-audit__p{color:rgba(255,255,255,.65)}
.cr-audit__liste{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--rc);padding:var(--e5);--encre:#fff;--acc:var(--cyan)}
.cr-audit__liste .cr-coches{color:#fff;font-size:var(--t-md)}

/* page 404 */
.cr-404__code{font-family:var(--dis);font-weight:800;font-size:clamp(5rem,16vw,13rem);line-height:.85;letter-spacing:-.06em;margin-bottom:var(--e3);
background:linear-gradient(120deg,var(--acc),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.cr-404__grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e5)}
@media(max-width:900px){.cr-404__grille{grid-template-columns:minmax(0,1fr)}}
/* pied unique du gabarit */
/* pied : ligne de marque, index en etiquettes, ligne de contact */
.cr-pied{background:var(--fond2);border-top:1px solid var(--trait);padding:var(--e6) 0 var(--e4);font-size:var(--t-sm)}
.cr-pied__marque{display:flex;justify-content:space-between;align-items:center;gap:var(--e4);flex-wrap:wrap;padding-bottom:var(--e4);border-bottom:2px solid var(--encre)}
.cr-pied__logo{font-family:var(--dis);font-weight:800;font-size:var(--t-xl);letter-spacing:-.03em}
.cr-pied__base{color:var(--doux);margin-top:.15rem}
.cr-pied__index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e5);padding:var(--e5) 0;border-bottom:1px solid var(--trait)}
.cr-pied__index .cr-etiq{margin-bottom:var(--e2)}
.cr-pied__l{display:flex;flex-wrap:wrap;gap:.35rem}
.cr-pied__l a{display:inline-block;padding:.3rem .7rem;border:1px solid var(--trait);border-radius:var(--r);background:#fff;color:var(--encre);text-decoration:none;font-size:var(--t-xs);font-weight:500}
.cr-pied__l a:hover{border-color:var(--acc);color:var(--acc)}
.cr-pied__coord{display:flex;gap:var(--e5);flex-wrap:wrap;padding:var(--e4) 0}
.cr-pied__coord .cr-coord{border:0;padding:0;color:var(--encre)}
.cr-pied__bas{color:var(--doux);font-size:var(--t-xs);padding-top:var(--e3);border-top:1px solid var(--trait)}
.cr-pied__bas a{color:inherit}
@media(max-width:900px){.cr-pied__index{grid-template-columns:minmax(0,1fr)}}

@media(max-width:1100px){
/* menu mobile : panneau sombre plein ecran, groupes replies */
.cr-menu{display:flex;flex-direction:column;align-items:stretch;position:fixed;top:5rem;left:0;right:0;bottom:0;background:var(--encre);padding:var(--e3) 4vw var(--e7);gap:0;overflow-y:auto;
transform:translateX(100%);visibility:hidden;transition:transform .4s cubic-bezier(.16,1,.3,1),visibility 0s .4s;z-index:39}
.cr-menu[data-ouvert]{transform:none;visibility:visible;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.cr-menu>a,.cr-menu__b{display:flex;justify-content:space-between;align-items:center;width:100%;padding:1.05rem 0;font-family:var(--dis);font-weight:700;font-size:var(--t-lg);color:#fff;border-bottom:1px solid rgba(255,255,255,.1);border-radius:0;letter-spacing:-.02em;text-align:left}
.cr-menu>a:hover,.cr-menu__b:hover{background:none}
.cr-menu__b::after{content:"";width:.55rem;height:.55rem;border-right:2px solid var(--cyan);border-bottom:2px solid var(--cyan);transform:rotate(45deg);transition:transform .3s;margin-right:.3rem}
.cr-menu__g[data-ouvert] .cr-menu__b::after{transform:rotate(225deg)}
.cr-menu__g{display:block}
.cr-menu__vol,.cr-menu__g:hover .cr-menu__vol{display:none;position:static;box-shadow:none;background:transparent;padding:0 0 var(--e3);min-width:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}
.cr-menu__g[data-ouvert] .cr-menu__vol,.cr-menu__g[data-ouvert]:hover .cr-menu__vol{display:grid}
.cr-menu__vol a{color:#fff;background:rgba(255,255,255,.06);padding:.6rem .75rem;border-radius:8px}
.cr-menu__pied{display:grid;gap:.6rem;margin-top:var(--e5)}
.cr-menu__pied .cr-bouton,.cr-menu__pied .cr-wa{justify-content:center}
.cr-menu__tel{display:flex;flex-direction:column;color:#fff;text-decoration:none;font-family:var(--dis);font-weight:700;font-size:var(--t-lg);margin-bottom:var(--e2)}
.cr-menu__tel i{font-style:normal;font-family:var(--txt);font-weight:500;font-size:var(--t-xs);text-transform:uppercase;letter-spacing:.14em;color:var(--cyan)}
.cr-menu-btn{display:flex}
.cr-tete{position:sticky;background:var(--encre);border-bottom:1px solid rgba(255,255,255,.08)}
.cr-tete__int{height:4.4rem}
.cr-hero{padding-top:var(--e4)}
.cr-menu{top:4.4rem}
.cr-tel{display:none}
.cr-hero__int,.cr-prod__int,.cr-contact__int,.cr-texte__int,.cr-local__int,.cr-audit__int{grid-template-columns:minmax(0,1fr)}
.cr-cartes,.cr-cms__int,.cr-communes,.cr-strip__int{grid-template-columns:repeat(2,minmax(0,1fr))}
.cr-pied__grille{grid-template-columns:repeat(2,minmax(0,1fr))}
.cr-zones__l,.cr-maille__l--4,.cr-maille__l--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cr-hero .cr-fen{max-width:32rem}
}
@media(max-width:680px){
body{font-size:16px;padding-bottom:4.6rem}
.cr-tete__cta{display:none}
.cr-logo{font-size:.92rem;white-space:normal;line-height:1.1;max-width:70%}
.cr-hero{padding-top:5.6rem}
.cr-h1{font-size:clamp(2.1rem,9.5vw,3rem)}
.cr-hero__act{flex-direction:column;align-items:stretch;gap:.6rem}
.cr-hero__act .cr-bouton,.cr-hero__act .cr-wa{justify-content:center}
.cr-bouton__ville{display:none}
.cr-hero__act .cr-bouton--ligne{display:none} /* deux boutons sur mobile, pas trois */
.cr-cartes,.cr-cms__int,.cr-gar__grille,.cr-strip__int,.cr-fiche__dl>div{grid-template-columns:minmax(0,1fr)}
.cr-communes{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.cr-commune{padding:var(--e3) var(--e3) var(--e4)}
.cr-commune b{font-size:var(--t-md)}
/* tableau comparatif : premiere colonne fixe, indication de defilement */
.cr-tableau table{min-width:34rem}
.cr-tableau tbody th{position:sticky;left:0;background:#fff;z-index:1;box-shadow:2px 0 0 var(--trait)}
.cr-tableau thead th:first-child{position:sticky;left:0;background:var(--encre);z-index:2}
.cr-tableau__cadre::before{content:"Faites défiler pour comparer les trois formules →";display:block;font-size:var(--t-xs);color:var(--doux);padding:.7rem 1.2rem 0}
.cr-fiche__dl>div{gap:.15rem}
.cr-local,.cr-autour,.cr-terr,.cr-audit,.cr-compar-z,.cr-cmsloc{padding:var(--e6) 0}
.cr-maille__l a,.cr-zones__l a{display:inline-block;padding:.4rem 0}
.cr-pied__l a,.cr-pilules a{padding:.5rem .9rem}
.cr-ariane a,.cr-ariane li{display:inline-block;padding:.3rem 0}
.cr-logo{padding:.5rem 0}
.cr-menu-btn{min-height:44px;min-width:44px;justify-content:center}
.cr-pied__bas a,.cr-lien{display:inline-block;padding:.45rem 0}
.cr-zones__l,.cr-maille__l--4,.cr-maille__l--3,.cr-maille__l--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cr-barre{display:flex}
.cr-hero .cr-fen{transform:none}
.cr-formules,.cr-texte,.cr-tableau,.cr-prod,.cr-gar,.cr-maillage,.cr-faq,.cr-zones,.cr-contact{padding:var(--e6) 0}
.cr-contact__d{padding:var(--e4)}
@media(max-width:680px){
/* __CIBLES_TACTILES__ — cibles tactiles : 40 px de haut au minimum.
   ⚠️ Mesure a 390 px (tools/audit_mobile.py) : fil d'Ariane 30 px, liens de
   tableau 19 px, liens du comparateur 15 a 21 px. Sous le seuil de 32 px, et
   loin des 44 px recommandes par Apple : ce sont des liens qu'on rate au doigt.
   min-height et non padding : le padding depend de la taille du texte, qui
   varie d'un bloc a l'autre — c'est pourquoi un padding de .3rem deja pose sur
   le fil d'Ariane le laissait a 30 px. */
.cr-ariane a,.cr-ariane li,
.cr-compar__l a,
.cr-fiche__dl dd a{display:inline-flex;align-items:center;min-height:40px}
}