/* ===== Design system NZ'Studio (kit d'origine, jetons inchangés) ===== */
/* NZ'Studio — jetons + base, concaténés pour le site statique. Généré depuis /jetons. */

/* ===== polices ===== */
/* NZ'Studio — familles de caractères. Fichiers servis par le site (aucune dépendance à Google Fonts). */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Anton-400-latin.woff2) format('woff2')}
@font-face{font-family:'Questrial';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Questrial-400-latin.woff2) format('woff2')}
@font-face{font-family:'Yellowtail';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Yellowtail-400-latin.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/JetBrainsMono-400-latin.woff2) format('woff2')}

:root{
  /* Display : capitales condensées, ultra-bold. Titres uniquement. */
  --font-display:"Anton","Arial Narrow",Impact,sans-serif; /* @kind font */
  /* Corps : géométrique, une seule graisse. Tout le texte courant + UI. */
  --font-sans:"Questrial","Helvetica Neue",Arial,sans-serif; /* @kind font */
  /* Mono : chiffres, montants, eyebrows, libellés techniques. */
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace; /* @kind font */
  /* Script : signature de marque. 1 usage par écran maximum. */
  --font-script:"Yellowtail","Brush Script MT",cursive; /* @kind font */
}


/* ===== couleurs ===== */
/* Strictement noir & blanc — valeurs reprises à l'identique du système NZ'Stratt. */
:root{
  /* Noir — la base : fonds, surfaces, élévations */
  --noir-1000:#000000;
  --noir-900:#0b0b0b;
  --noir-800:#141416;
  --noir-700:#1d1d20;
  --noir-600:#2a2a2e;
  --noir-500:#3a3a41;

  /* Ivoire & neutres — texte, surfaces claires, gris de support */
  --ivory-50:#faf9f6;
  --ivory-100:#f2f0ea;
  --ivory-200:#e5e1d7;
  --grey-400:#c9c9cf;
  --grey-500:#9a9aa1;
  --grey-600:#6e6e74;

  /* Alias sémantiques — ce que l'on utilise en pratique */
  --bg-canvas:var(--noir-1000);
  --surface-card:var(--noir-800);
  --surface-inset:var(--noir-700);
  --surface-raised:var(--noir-600);
  --accent:var(--ivory-50);
  --text-primary:var(--ivory-50);
  --text-secondary:var(--grey-400);
  --text-tertiary:var(--grey-500);
  --text-on-accent:var(--noir-1000);
  --border-hairline:rgba(250,249,246,.14);
  --border-strong:rgba(250,249,246,.34);
  --border-focus:var(--ivory-50);
  --hairline-rule:linear-gradient(90deg,rgba(250,249,246,0) 0%,rgba(250,249,246,.45) 50%,rgba(250,249,246,0) 100%); /* @kind color */
  --sheen-metal:linear-gradient(100deg,#6e6e74 0%,#c9c9cf 38%,#faf9f6 58%,#9a9aa1 100%); /* @kind color */
  --scrim-full:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.78) 62%,rgba(0,0,0,.94) 100%); /* @kind color */
  --scrim-flat:rgba(0,0,0,.62); /* @kind color */

  /* Inverse — planches et supports imprimés sur ivoire */
  --bg-canvas-inverse:var(--ivory-50);
  --surface-card-inverse:#ffffff;
  --text-primary-inverse:var(--noir-1000);
  --text-secondary-inverse:var(--grey-600);
  --border-hairline-inverse:rgba(0,0,0,.14);
}


/* ===== typographie ===== */
/* Échelle typographique — identique à NZ'Stratt. Display en clamp, corps en px. */
:root{
  --text-display-xl:clamp(56px,6.4vw,96px);
  --text-display-l:clamp(44px,4.8vw,72px);
  --text-display-m:clamp(36px,3.6vw,56px);
  --text-h1:44px;
  --text-h2:32px;
  --text-h3:24px;
  --text-body-l:18px;
  --text-body:16px;
  --text-body-s:14px;
  --text-caption:12px;
  --text-eyebrow:11px;

  --lh-display:0.92; /* @kind font */
  --lh-heading:1.06; /* @kind font */
  --lh-body:1.6; /* @kind font */
  --lh-tight:1.35; /* @kind font */

  --track-display:-0.01em; /* @kind font */
  --track-body:0; /* @kind font */
  --track-ui:0.08em; /* @kind font */
  --track-eyebrow:0.22em; /* @kind font */
  --track-nav:0.12em; /* @kind font */

  --weight-display:400; /* @kind font */ /* Anton n'a qu'une graisse */
  --weight-body:400; /* @kind font */
  --weight-mono:500; /* @kind font */
}


/* ===== espacements ===== */
/* Échelle d'espacement base 4 — générosité de blanc, rythme vertical large. */
:root{
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;
  --space-10:128px;
  --space-11:160px;

  --gutter:24px;
  --page-margin:clamp(24px,6vw,96px);
  --content-max:1200px;
  --measure:60ch; /* @kind other */
  --section-y:clamp(64px,10vw,160px); /* @kind spacing */
  --grid-columns:12; /* @kind other */
}


/* ===== rayons ===== */
/* Rayons — champs 8, cartes 20, contrôles pill. */
:root{
  --radius-xs:4px;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:20px;
  --radius-xl:28px;
  --radius-pill:999px;
  --border-width:1px; /* @kind other */
  --border-width-strong:2px; /* @kind other */
}


/* ===== elevation ===== */
/* Plat au repos ; l'ombre signale le flottant. */
:root{
  --shadow-xs:0 1px 2px rgba(0,0,0,.5);
  --shadow-sm:0 2px 8px rgba(0,0,0,.55);
  --shadow-md:0 8px 24px rgba(0,0,0,.6);
  --shadow-lg:0 24px 64px rgba(0,0,0,.72);
  --shadow-glow:0 0 0 1px rgba(250,249,246,.4),0 0 32px rgba(250,249,246,.08);
  --focus-ring:0 0 0 2px var(--noir-900),0 0 0 4px var(--ivory-50); /* @kind shadow */
}


/* ===== mouvement ===== */
/* Fondus et translations courtes · aucun rebond, aucune rotation. */
:root{
  --dur-fast:160ms; /* @kind other */
  --dur-base:240ms; /* @kind other */
  --dur-slow:420ms; /* @kind other */
  --dur-reveal:700ms; /* @kind other */
  --ease-standard:cubic-bezier(.22,.61,.36,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --press-scale:0.985; /* @kind other */
}


/* ===== base ===== */
/* Réglages de base — appliqués par les planches et les kits. */
:root{color-scheme:dark}
.nz-root{background:var(--bg-canvas);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
.nz-root a{color:var(--text-primary);text-decoration:none;border-bottom:1px solid var(--border-hairline);transition:border-color var(--dur-fast) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard)}
.nz-root a:hover{border-color:var(--border-strong);opacity:.86}
.nz-eyebrow{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
.nz-display{font-family:var(--font-display);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase}
.nz-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.nz-rule{height:1px;border:0;background:var(--hairline-rule)}
/* Thème clair — à poser sur toute section à fond ivoire. Réécrit les alias, les composants suivent. */.nz-clair{--bg-canvas:var(--ivory-50);--surface-card:#ffffff;--surface-inset:var(--ivory-100);--surface-raised:var(--ivory-200);--accent:var(--noir-1000);--text-primary:var(--noir-1000);--text-secondary:var(--grey-600);--text-tertiary:var(--grey-500);--text-on-accent:var(--ivory-50);--border-hairline:rgba(0,0,0,.14);--border-strong:rgba(0,0,0,.34);--border-focus:var(--noir-1000);--hairline-rule:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 100%); /* @kind color */--shadow-glow:0 0 0 1px rgba(0,0,0,.4),0 0 32px rgba(0,0,0,.06);--focus-ring:0 0 0 2px var(--ivory-50),0 0 0 4px var(--noir-1000);background:var(--bg-canvas);color:var(--text-primary)}

/* — Animations — fondus et translations courtes. Aucun rebond, aucune rotation. */
@keyframes nz-apparait{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes nz-fondu{from{opacity:0}to{opacity:1}}
/* Apparition au scroll : posée par ressources/reveal.js */
.nz-reveal{opacity:0;transform:translateY(16px);transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out)}
.nz-reveal.est-visible{opacity:1;transform:none}
/* Texte : chaque ligne monte un peu plus franchement que les blocs, avec un fondu plus long */
.nz-reveal-ligne{transform:translateY(22px);transition-duration:var(--dur-slow),var(--dur-slow)}
/* Liens de navigation : filet qui se déplie au survol */
.nz-root header nav a{position:relative;padding-bottom:4px}
.nz-root header nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--dur-base) var(--ease-standard)}
.nz-root header nav a:hover::after,.nz-root header nav a[aria-current="page"]::after{transform:scaleX(1)}
/* Cartes cliquables : le filet s'éclaircit, la surface monte de 2 px */
.nz-root section a>div{transition:transform var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard)}
.nz-root section a:hover>div{transform:translateY(-2px);border-color:var(--border-strong);box-shadow:var(--shadow-sm)}
.nz-root section a:active>div{transform:scale(var(--press-scale))}
/* Contrôles : pression uniforme */
.nz-root button:active,.nz-root a[role="button"]:active{transform:scale(var(--press-scale))}
.nz-root button{transition:transform var(--dur-fast) var(--ease-standard),background var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard)}
/* Champs : le filet s'affirme au focus */
.nz-root input,.nz-root textarea,.nz-root select{transition:border-color var(--dur-fast) var(--ease-standard),background var(--dur-fast) var(--ease-standard)}
.nz-root input:focus,.nz-root textarea:focus,.nz-root select:focus{outline:none;border-color:var(--border-focus)}
@media (prefers-reduced-motion:reduce){
.nz-reveal,.nz-reveal.est-visible,.nz-reveal-ligne{opacity:1;transform:none;transition:none}
.nz-root section a:hover>div,.nz-root section a:active>div,.nz-root button:active{transform:none}
.nz-root header nav a::after{transition:none}
}

/* — Animations, deuxième couche — */
/* Bandeau défilant : se met en pause au survol */
.nz-marquee:hover{animation-play-state:paused}
/* Avis clients : colonnes qui montent en boucle — même principe que le bandeau, en vertical.
   La piste contient deux fois la même liste ; elle remonte d'exactement une moitié, donc la boucle
   ne se voit pas. Le padding bas vaut l'écart entre les cartes, sinon le raccord saute. */
@keyframes nz-monte-avis{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.nz-avis-defile{max-height:min(740px,82vh);overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 10%,#000 90%,transparent 100%)}
.nz-colonne-avis{--duree-avis:20s /* @kind other */;flex:1 1 0;min-width:0;max-width:360px}
.nz-colonne-avis-piste{display:flex;flex-direction:column;gap:24px;padding-bottom:24px;animation:nz-monte-avis var(--duree-avis) linear infinite;will-change:transform}
/* Les deux exemplaires de la liste. Mise en page ici et non en style en ligne, sinon le
   display:none du repli sans animation ne peut pas l'emporter sur l'attribut style. */
.nz-avis-groupe{display:flex;flex-direction:column;gap:24px}
.nz-colonne-avis:hover .nz-colonne-avis-piste,.nz-colonne-avis:focus-within .nz-colonne-avis-piste{animation-play-state:paused}
/* Garde-fou mobile : une seule colonne visible, même si le calcul JS a lu la largeur
   avant que la balise viewport ne soit appliquée (Safari iOS peut renvoyer la largeur
   du viewport de mise en page — souvent 980px — au tout premier rendu). */
@media (max-width:767px){
.nz-avis-defile{flex-direction:column;align-items:stretch}
.nz-colonne-avis{max-width:none;width:100%}
.nz-colonne-avis:nth-child(n+2){display:none}
}
@media (prefers-reduced-motion:reduce){
/* Sans mouvement : les colonnes redeviennent des listes fixes, sans doublon ni fondu. */
.nz-avis-defile{max-height:none;-webkit-mask-image:none;mask-image:none}
.nz-colonne-avis-piste{animation:none;padding-bottom:0}
.nz-avis-copie{display:none}
}
/* En-tête : se compacte au défilement */
.nz-root header{transition:padding var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
.nz-root header.est-compact{padding-top:12px;padding-bottom:12px;box-shadow:var(--shadow-md);border-bottom-color:var(--border-strong)}
/* Jauge de défilement, en haut de page */
.nz-jauge{position:fixed;top:0;left:0;height:2px;width:0;background:var(--ivory-50);z-index:50;transition:width 90ms linear;pointer-events:none}
/* Variante collée au bas de l'en-tête, sur toute la largeur : repère de progression dans la page. */
.nz-jauge-entete{position:absolute;top:auto;bottom:0;height:2px;z-index:1}
/* Retour en haut */
.nz-haut{position:fixed;right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,32px);width:48px;height:48px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);background:var(--noir-1000);color:var(--ivory-50);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:40;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard),background var(--dur-fast) var(--ease-standard)}
.nz-haut.est-visible{opacity:1;transform:none;pointer-events:auto}
.nz-haut:hover{background:var(--ivory-50);color:var(--noir-1000);border-color:var(--ivory-50)}
.nz-haut:active{transform:scale(var(--press-scale))}
/* Variantes d'apparition : la direction alterne d'un bloc à l'autre */
.nz-reveal.nz-de-gauche{transform:translateX(-18px)}
.nz-reveal.nz-de-droite{transform:translateX(18px)}
.nz-reveal.nz-echelle{transform:scale(.985)}
.nz-reveal.est-visible{transform:none}
/* Titres display : apparition ligne par ligne, au chargement */
@keyframes nz-monte{from{transform:translateY(105%)}to{transform:none}}
.nz-ligne{display:block;overflow:hidden;padding:.14em 0 .1em;margin:-.14em 0 -.1em}
.nz-ligne>span{display:block;animation:nz-monte 760ms var(--ease-out) both}
/* Histoire : portrait + texte, asymétrique sur desktop ; empilés sous 700px (les fr seuls
   ne s'empilent jamais, ils se contentent de rétrécir chaque colonne). */
.nz-histoire-duo{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
@media (max-width:700px){.nz-histoire-duo{grid-template-columns:1fr}}
/* Bandeau d'accueil : texte à gauche, portable 3D à droite ; empilés sous 1000px. */
.nz-hero{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1.04fr);gap:clamp(12px,1.4vw,24px);align-items:center}
@media (max-width:1000px){
.nz-hero{grid-template-columns:1fr}
.nz-hero>div:last-child{order:2;height:320px;margin-top:24px}
}
/* Icônes de bouton : glissent au survol */
.nz-root button svg,.nz-root a svg{transition:transform var(--dur-base) var(--ease-standard)}
.nz-root button:hover svg,.nz-root a:hover svg{transform:translateX(3px)}
/* Étiquettes de filtre */
.nz-root span[style*="cursor: pointer"]>span{transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
/* Emplacements d'image : léger zoom arrière à l'apparition */
.nz-media{overflow:hidden}
.nz-media>*{transition:transform var(--dur-reveal) var(--ease-out)}
/* Accordéon : ouverture en hauteur */
.nz-repli{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--dur-base) var(--ease-standard),opacity var(--dur-base) var(--ease-standard);opacity:0}
.nz-repli.est-ouvert{grid-template-rows:1fr;opacity:1}
.nz-repli>*{overflow:hidden;min-height:0}
@media (prefers-reduced-motion:reduce){
.nz-marquee{animation:none}
.nz-jauge,.nz-haut{transition:none}
.nz-ligne>span{animation:none}
.nz-root button:hover svg,.nz-root a:hover svg{transform:none}
.nz-repli{transition:none}
}

/* — Animations de la page d'accueil — */
@keyframes nz-entre{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes nz-filet{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes nz-pouls{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes nz-descend{from{transform:translateY(-6px)}to{transform:translateY(6px)}}
/* Entrée du hero, cascade */
.nz-entre{animation:nz-entre 760ms var(--ease-out) both}
/* Filet qui se trace */
.nz-trace{transform-origin:left;animation:nz-filet 900ms var(--ease-out) both}
/* Invitation à défiler, en bas du hero */
.nz-defiler{display:inline-flex;flex-direction:column;align-items:center;gap:10px}
.nz-defiler i{display:block;width:1px;height:38px;background:currentColor;animation:nz-descend 1.6s var(--ease-standard) infinite alternate}
.nz-defiler span{animation:nz-pouls 2.4s var(--ease-standard) infinite}
/* Étiquette de métier : le numéro glisse, l'icône s'inverse */
.nz-root a:hover .nz-pastille{background:var(--text-primary);color:var(--bg-canvas);border-color:var(--text-primary)}
.nz-pastille{transition:background var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
/* Étape de méthode : le filet supérieur se trace à l'apparition */
.nz-etape{position:relative}
.nz-etape::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--border-strong);transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--ease-out)}
.nz-etape.est-visible::before,.est-visible .nz-etape::before{transform:scaleX(1)}
/* Chiffres clés : le filet sous le chiffre s'étire */
.nz-stat-filet{display:block;height:1px;background:var(--border-strong);transform:scaleX(0);transform-origin:left;transition:transform 700ms var(--ease-out)}
.est-visible .nz-stat-filet{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){
.nz-entre,.nz-trace,.nz-defiler i,.nz-defiler span{animation:none}
.nz-etape::before,.nz-stat-filet{transform:none;transition:none}
}

/* — Menu principal plein écran — logo à gauche, bouton à droite. À l'ouverture, trois panneaux
   glissent depuis la droite, puis les liens montent un à un ; les motifs suivent le survol.
   L'en-tête passe au-dessus du voile pour que le bouton reste cliquable, menu ouvert. */
.nz-entete{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px clamp(24px,4vw,64px);background:var(--noir-1000);border-bottom:1px solid var(--border-hairline)}
.nz-root .nz-entete-logo{display:flex;border-bottom:0}
.nz-menu-bouton{display:inline-flex;align-items:center;gap:13px;padding:11px 22px;border:1px solid var(--border-strong);border-radius:var(--radius-pill);background:none;color:var(--text-primary);cursor:pointer;font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--weight-mono);letter-spacing:var(--track-nav);text-transform:uppercase}
.nz-menu-bouton:hover{background:var(--ivory-50);color:var(--noir-1000);border-color:var(--ivory-50)}
.nz-menu-bouton-textes{display:block;height:1em;overflow:hidden;text-align:left}
.nz-menu-bouton-textes>span{display:block;line-height:1;transition:transform var(--dur-base) var(--ease-standard)}
.nz-menu-bouton.est-ouvert .nz-menu-bouton-textes>span{transform:translateY(-100%)}
/* Trois barres empilées, qui se croisent à l'ouverture : celle du milieu s'efface,
   les deux autres se rejoignent au centre et pivotent. */
.nz-menu-bouton-icone{position:relative;display:block;width:18px;height:12px;flex:none}
.nz-menu-bouton-icone>span{position:absolute;left:0;right:0;height:2px;background:currentColor;transition:transform var(--dur-base) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard)}
.nz-menu-bouton-icone>span:nth-child(1){top:0}
.nz-menu-bouton-icone>span:nth-child(2){top:5px}
.nz-menu-bouton-icone>span:nth-child(3){top:10px}
.nz-menu-bouton.est-ouvert .nz-menu-bouton-icone>span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.nz-menu-bouton.est-ouvert .nz-menu-bouton-icone>span:nth-child(2){opacity:0}
.nz-menu-bouton.est-ouvert .nz-menu-bouton-icone>span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
/* Voile et panneaux */
.nz-menu{position:fixed;inset:0;z-index:60;visibility:hidden;transition:visibility 0s linear var(--dur-slow)}
.nz-menu.est-ouvert{visibility:visible;transition-delay:0s}
.nz-menu-voile{position:absolute;inset:0;background:var(--scrim-flat);opacity:0;transition:opacity var(--dur-base) var(--ease-standard)}
.nz-menu.est-ouvert .nz-menu-voile{opacity:1}
.nz-menu-contenu{position:absolute;top:0;right:0;bottom:0;width:min(620px,100%);display:flex;align-items:center;overflow:hidden}
.nz-menu-panneau{position:absolute;inset:0;display:block;transform:translateX(101%);transition:transform var(--dur-slow) var(--ease-out)}
.nz-panneau-1{background:var(--noir-700)}
.nz-panneau-2{background:var(--noir-800)}
.nz-panneau-3{background:var(--noir-1000);border-left:1px solid var(--border-hairline)}
.nz-menu.est-ouvert .nz-menu-panneau{transform:none}
.nz-menu.est-ouvert .nz-panneau-2{transition-delay:.1s}
.nz-menu.est-ouvert .nz-panneau-3{transition-delay:.2s}
/* Motifs de fond, au survol d'un lien */
.nz-menu-formes{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.nz-menu-forme{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity var(--dur-base) var(--ease-standard)}
.nz-menu-forme.est-active{opacity:1}
.nz-menu-forme-element{opacity:0;transform:scale(.6);transform-box:fill-box;transform-origin:center;transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.nz-menu-forme.est-active .nz-menu-forme-element{opacity:1;transform:none}
/* Liens */
.nz-menu-liste{position:relative;z-index:2;width:100%;margin:0;padding:0 clamp(28px,5vw,64px);list-style:none;display:flex;flex-direction:column;gap:clamp(4px,1vw,10px)}
.nz-menu-item{overflow:hidden}
.nz-root .nz-menu-lien{display:block;padding:4px 0;border-bottom:0}
.nz-root .nz-menu-lien:hover{opacity:1}
.nz-menu-lien-texte{display:flex;align-items:center;font-family:var(--font-display);font-size:clamp(32px,5vw,60px);line-height:1.04;letter-spacing:var(--track-display);text-transform:uppercase;transform:translateY(140%) rotate(10deg);transform-origin:left top;transition:transform var(--dur-slow) var(--ease-out),opacity var(--dur-fast) var(--ease-standard)}
.nz-menu.est-ouvert .nz-menu-lien-texte{transform:none}
.nz-menu-lien:hover .nz-menu-lien-texte{opacity:.55}
.nz-menu-lien[aria-current="page"] .nz-menu-lien-texte{opacity:.45}
/* Page courante : une flèche devant le libellé. La gouttière est réservée sur tous les liens,
   sinon seul le lien courant se décalerait et les libellés ne seraient plus alignés. */
.nz-menu-lien-texte::before{content:"";flex:none;width:1.1em;font-family:var(--font-mono);font-size:.42em;line-height:1}
.nz-menu-lien[aria-current="page"] .nz-menu-lien-texte::before{content:"→"}
/* Notre méthode en frise horizontale : un rail, un point par étape, le jour et le texte dessous.
   L'apparition suit la chronologie — le rail se trace de gauche à droite, puis chaque point
   surgit à son tour, suivi de son texte, d'après le rang porté par --ordre. Tout est visible
   par défaut et n'est mis en retrait que tant que le bloc n'est pas révélé : sans JavaScript,
   la frise reste complète. */
.nz-rail{position:relative;margin-top:clamp(40px,5vw,64px)}
.nz-rail-ligne{position:absolute;left:0;right:0;top:6px;height:1px;background:var(--border-hairline);overflow:hidden}
.nz-rail-trace{display:block;width:100%;height:100%;background:var(--border-strong);transform-origin:left;transition:transform 1000ms var(--ease-out)}
.nz-reveal:not(.est-visible) .nz-rail-trace{transform:scaleX(0)}
.nz-rail-liste{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px);margin:0;padding:0;list-style:none}
.nz-rail-etape{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
/* Le halo reprend le fond de la section : le rail passe derrière le point, jamais au travers. */
.nz-rail-point{width:13px;height:13px;border-radius:var(--radius-pill);background:var(--text-primary);box-shadow:0 0 0 6px var(--bg-canvas);transition:transform var(--dur-base) var(--ease-out);transition-delay:calc(var(--ordre) * 300ms + 260ms)}
.nz-reveal:not(.est-visible) .nz-rail-point{transform:scale(0)}
.nz-rail-jour{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.nz-rail-titre{font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-primary)}
.nz-rail-texte{margin:2px 0 0;max-width:34ch;color:var(--text-secondary);line-height:var(--lh-body)}
.nz-rail-jour,.nz-rail-titre,.nz-rail-texte{transition:opacity var(--dur-slow) var(--ease-standard),transform var(--dur-slow) var(--ease-out);transition-delay:calc(var(--ordre) * 300ms + 420ms)}
.nz-reveal:not(.est-visible) .nz-rail-jour,.nz-reveal:not(.est-visible) .nz-rail-titre,.nz-reveal:not(.est-visible) .nz-rail-texte{opacity:0;transform:translateY(12px)}
.nz-rail-note{margin:clamp(28px,3.5vw,44px) 0 0;max-width:none;font-size:var(--text-body-s);line-height:var(--lh-body);color:var(--text-tertiary)}
/* Sous 760 px, trois colonnes deviennent illisibles : les étapes s'empilent, le rail s'efface
   et le point passe en marge, à gauche de chaque étape. */
@media (max-width:760px){
.nz-rail-liste{grid-template-columns:minmax(0,1fr);gap:28px}
.nz-rail-ligne{display:none}
.nz-rail-etape{position:relative;padding-left:28px}
.nz-rail-point{position:absolute;left:0;top:5px;box-shadow:none}
}
@media (prefers-reduced-motion:reduce){
.nz-rail-trace,.nz-rail-point,.nz-rail-jour,.nz-rail-titre,.nz-rail-texte{transition:none}
.nz-reveal:not(.est-visible) .nz-rail-trace,.nz-reveal:not(.est-visible) .nz-rail-point{transform:none}
.nz-reveal:not(.est-visible) .nz-rail-jour,.nz-reveal:not(.est-visible) .nz-rail-titre,.nz-reveal:not(.est-visible) .nz-rail-texte{opacity:1;transform:none}
}

/* Colonne épinglée : le titre suit le défilement de sa section, puis repart avec elle.
   Exige alignItems:start sur la grille — une colonne étirée n'a aucune marge pour coller.
   Coupé en une seule colonne, où le titre resterait planté devant le contenu. */
.nz-colle{position:sticky;top:clamp(88px,11vh,132px)}
@media (max-width:760px){.nz-colle{position:static}}
.nz-faq-titre{position:sticky;top:clamp(88px,11vh,132px)}
@media (max-width:760px){.nz-faq-titre{position:static}}

/* FAQ en fil de discussion : la question est une bulle « reçue », la réponse une bulle « envoyée »,
   décalée et inversée. Les couleurs viennent des alias, donc la section tient en clair comme en noir.
   Le dépliage réutilise .nz-repli — aucune bibliothèque d'animation n'est nécessaire. */
.nz-faq-fil{display:flex;flex-direction:column;gap:8px}
.nz-faq-horodatage{margin-bottom:10px;font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.nz-faq-question{display:flex;align-items:center;gap:14px;width:100%;padding:0;border:0;background:none;cursor:pointer;text-align:left;color:var(--text-primary);font-family:var(--font-sans)}
.nz-faq-bulle{display:inline-block;padding:14px 20px;border:1px solid var(--border-hairline);border-radius:var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-xs);background:var(--surface-inset);font-size:var(--text-body-l);line-height:var(--lh-tight);transition:background var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.nz-faq-question:hover .nz-faq-bulle,.nz-faq-question.est-ouvert .nz-faq-bulle{background:var(--surface-raised);border-color:var(--border-strong)}
/* Les signes se calent tous à droite plutôt que de suivre la fin de chaque bulle : sans cela,
   leur bord change à chaque question, au gré de la longueur du libellé. */
.nz-faq-signe{display:flex;flex:none;margin-left:auto;color:var(--text-tertiary);transition:color var(--dur-fast) var(--ease-standard)}
.nz-faq-question:hover .nz-faq-signe,.nz-faq-question.est-ouvert .nz-faq-signe{color:var(--text-primary)}
/* Le site fait glisser les icônes des boutons au survol : ici le signe doit rester en place. */
.nz-faq-question:hover svg{transform:none}
.nz-faq-reponse{margin:8px 0 6px clamp(28px,5vw,64px);max-width:46ch;padding:14px 20px;border-radius:var(--radius-lg) var(--radius-lg) var(--radius-xs) var(--radius-lg);background:var(--text-primary);color:var(--bg-canvas);font-size:var(--text-body);line-height:var(--lh-body)}

/* Offres de l'accueil : six cartes, trois par ligne — un compte rond, plus besoin de centrage.
   Colonnes en minmax(0,1fr) : sans le 0, un mot long élargirait la colonne et ferait déborder. */
.nz-grille-offres{display:grid;gap:24px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1150px){
.nz-grille-offres{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
.nz-grille-offres{grid-template-columns:minmax(0,1fr)}
}
/* Boutons des offres : tous identiques, et inversion au survol — fond plein, texte inversé.
   !important est ici nécessaire, non par facilité : le composant bouton pose ses couleurs en
   style en ligne (background, color, border-color), qu'une règle ordinaire ne peut pas surcharger. */
.nz-grille-offres a:hover{background:var(--text-primary)!important;color:var(--bg-canvas)!important;border-color:var(--text-primary)!important;opacity:1}
/* Très petits écrans : le logo et le bouton tiennent tout juste, on resserre les marges. */
@media (max-width:420px){
.nz-entete{padding:16px;gap:12px}
.nz-menu-bouton{padding:10px 16px;gap:11px}
}
@media (prefers-reduced-motion:reduce){
/* Sans mouvement : le menu s'affiche d'un bloc, sans glissement ni décalage. */
.nz-menu,.nz-menu-voile,.nz-menu-panneau,.nz-menu-lien-texte,.nz-menu-forme,.nz-menu-forme-element,.nz-menu-bouton-icone>span,.nz-menu-bouton-textes>span{transition:none}
.nz-menu-panneau,.nz-menu-lien-texte{transform:none}
}


/* NZ'Studio — classes de mise en page du site. Remplace les styles en ligne de la version React.
   Aucun jeton nouveau : tout vient de nz.css. */
body{margin:0}
.wrap{padding:0 clamp(24px,4vw,64px);max-width:1280px;margin:0 auto;box-sizing:border-box}
.wrap-hero{max-width:1560px;padding:0 clamp(24px,8.4vw,156px)}
.sec{padding:clamp(48px,7vw,112px) 0}
.sec-noir{background:var(--noir-1000)}
.sec-ivoire{background:var(--bg-canvas)}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:clamp(32px,5vw,80px)}
.duo-centre{align-items:center}
.duo-haut{align-items:start}
/* — Titres de section — */
.ouv{display:flex;flex-direction:column;align-items:flex-start}
.ouv-eyebrow{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
.ouv h2,.ouv h1{margin:20px 0 0;font-family:var(--font-display);font-size:var(--text-display-m);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;max-width:24ch}
.ouv-filet{display:block;width:170px;height:1px;background:var(--hairline-rule);margin-top:26px}
.ouv-lede{margin:26px 0 0;font-size:var(--text-body-l);line-height:var(--lh-body);color:var(--text-secondary);max-width:62ch}
/* — Boutons — */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border:1px solid var(--text-primary);border-radius:var(--radius-pill);background:var(--text-primary);color:var(--bg-canvas);font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--track-nav);text-transform:uppercase;cursor:pointer;text-decoration:none;box-sizing:border-box}
.nz-root a.btn{border-bottom:1px solid var(--text-primary);color:var(--bg-canvas)}
.btn:hover{opacity:.86}
.btn-sec{background:none;color:var(--text-primary);border-color:var(--border-strong)}
.nz-root a.btn-sec{border-bottom-color:var(--border-strong);color:var(--text-primary)}
.btn-sec:hover{background:var(--text-primary);color:var(--bg-canvas);border-color:var(--text-primary);opacity:1}
.btn-lg{padding:17px 30px;font-size:var(--text-body-s)}
.btn-sm{padding:11px 18px}
.btn-plein{width:100%;justify-content:center}
.btn svg{width:16px;height:16px}
.btn-lg svg{width:18px;height:18px}
/* — Cartes — */
.carte{border:1px solid var(--border-hairline);border-radius:var(--radius-lg);background:var(--surface-card);padding:28px;box-sizing:border-box}
.carte-32{padding:32px}
.carte-inset{background:var(--surface-inset);border-color:var(--border-hairline)}
.carte-trait{border:1px solid var(--border-strong);background:none}
/* — En-tête : logo officiel, version compacte (L « NZ » script + « 'Studio » display,
   même construction que composants/marque/Logo.jsx, taille 34 px). — */
.logo-nz{display:flex;align-items:baseline;white-space:nowrap;line-height:1;color:var(--ivory-50)}
.logo-nz-script{font-family:var(--font-script);font-size:36px;line-height:1;padding-right:.7px}
.logo-nz-display{font-family:var(--font-display);font-size:34px;line-height:1;letter-spacing:-.005em;text-transform:uppercase}
/* — Accueil : bandeau d'ouverture — */
.hero{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1.04fr);gap:clamp(12px,1.4vw,24px);align-items:center}
.hero-signature{display:inline-block;font-family:var(--font-script);font-size:clamp(24px,2.2vw,32px)}
.hero h1{margin:22px 0 0;font-family:var(--font-display);font-size:var(--text-display-l);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;white-space:nowrap}
.hero-lede{margin:26px 0 0;font-size:var(--text-body-l);line-height:var(--lh-body);color:var(--text-secondary);max-width:66ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:34px}
.hero-3d{position:relative;height:clamp(430px,46vw,640px);overflow:hidden}
.hero-3d three-d-stage{position:absolute;inset:0;height:100%}
.hero-3d-image{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--surface-inset);border-radius:var(--radius-lg)}
@media (max-width:1000px){.hero{grid-template-columns:1fr}.hero h1{white-space:normal}.hero-3d{height:346px;order:2}}
/* — Chiffres clés — */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);margin-top:clamp(48px,5.5vw,80px)}
.stat{display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center}
.stat-val{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-h1);line-height:1}
.stat-lbl{font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
/* — Bandeau défilant — */
.bandeau{background:var(--noir-1000);border-top:1px solid var(--border-hairline);border-bottom:1px solid var(--border-hairline);padding:22px 0;overflow:hidden}
.bandeau-piste{display:flex;gap:48px;width:max-content;align-items:center}
.bandeau-mot{display:flex;align-items:center;gap:48px;white-space:nowrap;font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
.bandeau-point{width:4px;height:4px;border-radius:999px;background:var(--grey-600);flex:none}
/* — Citation — */
.cite{display:flex;flex-direction:column;gap:22px}
.cite p{margin:0;font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--lh-heading);letter-spacing:var(--track-display);text-transform:uppercase}
.cite-auteur{font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
/* — Listes à coche — */
.coches{margin:22px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:16px;color:var(--text-secondary)}
.coches li{display:flex;gap:14px;align-items:flex-start}
.coches svg{width:18px;height:18px;flex:none;margin-top:2px}
/* — Offres — */
.offre{display:flex;flex-direction:column;height:100%;padding:20px}
.offre-tete{display:flex;flex-direction:column;align-items:center;gap:8px;padding-bottom:20px;border-bottom:1px solid var(--border-hairline)}
.offre-tete h3{margin:0;font-family:var(--font-display);font-size:clamp(17px,1.5vw,22px);line-height:var(--lh-heading);letter-spacing:var(--track-display);text-transform:uppercase;text-align:center}
.offre-apd{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.offre-prix{font-family:var(--font-display);font-size:clamp(26px,2.4vw,40px);line-height:1;letter-spacing:var(--track-display)}
.offre-periode{font-family:var(--font-mono);font-size:var(--text-body-s);color:var(--text-secondary)}
.offre-pour{font-size:var(--text-body-s);color:var(--text-secondary);text-align:center;line-height:var(--lh-tight);min-height:2.7em}
.offre-points{list-style:none;margin:0;padding:20px 0 0;display:flex;flex-direction:column;gap:12px;flex:1}
.offre-points li{display:flex;align-items:flex-start;gap:10px;font-size:var(--text-body-s);line-height:var(--lh-tight);color:var(--text-secondary)}
.offre-points li.hors{color:var(--text-tertiary)}
.pastille{display:grid;place-content:center;flex:none;width:18px;height:18px;border-radius:var(--radius-pill);background:var(--text-primary);color:var(--bg-canvas)}
.pastille svg{width:11px;height:11px}
.pastille-hors{background:var(--surface-raised);color:var(--text-tertiary)}
.offre-montant{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:20px;padding-top:18px;border-top:1px solid var(--border-hairline)}
.offre-pied{margin-top:16px}
/* — Avis — */
.avis-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.avis-notes{display:flex;align-items:flex-end;gap:28px}
.avis-note{display:flex;flex-direction:column;gap:8px}
.avis-sep{width:1px;height:56px;background:var(--border-hairline)}
.avis-carte{display:flex;flex-direction:column;gap:22px}
.avis-guillemet{font-family:var(--font-display);font-size:32px;line-height:.6;color:var(--text-tertiary)}
.avis-carte p{margin:0;font-size:var(--text-body);line-height:var(--lh-body);flex:1}
.avis-pied{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;border-top:1px solid var(--border-hairline);padding-top:18px}
.avis-qui{display:flex;flex-direction:column;gap:5px}
.avis-nom{font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.avis-role{font-size:var(--text-body-s);color:var(--text-tertiary)}
.avis-source{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary);white-space:nowrap}
/* — Appel — */
.appel{padding:clamp(48px,6vw,92px) 0;border-top:1px solid var(--border-hairline)}
.appel-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.appel h2{margin:0;font-family:var(--font-display);font-size:var(--text-display-m);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase}
/* — Formulaire — */
.form{display:flex;flex-direction:column;gap:20px}
.champ{display:flex;flex-direction:column;gap:10px}
.champ>span{font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
.champ input,.champ select,.champ textarea{width:100%;box-sizing:border-box;padding:14px 16px;border:1px solid var(--border-hairline);border-radius:var(--radius-md);background:var(--surface-inset);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-body)}
.champ textarea{resize:vertical}
.accord{display:flex;align-items:center;gap:12px;font-size:var(--text-body-s);color:var(--text-secondary)}
.reseaux{display:flex;gap:12px;margin-top:36px}
.rond{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);background:none;color:var(--text-primary);cursor:pointer}
.nz-root a.rond{border-bottom:1px solid var(--border-strong);color:var(--text-primary)}
.rond:hover{background:var(--text-primary);color:var(--bg-canvas)}
.rond svg{width:18px;height:18px}
.confirme{margin:0;padding:14px 18px;border-radius:var(--radius-md);background:var(--text-primary);color:var(--bg-canvas);font-size:var(--text-body-s)}
/* — Services : ligne de registre — */
.reg{display:flex;flex-wrap:wrap;align-items:baseline;gap:clamp(16px,3vw,40px);padding-bottom:20px;border-bottom:1px solid var(--border-strong)}
.reg-num{font-family:var(--font-mono);font-size:var(--text-body-s);color:var(--text-tertiary)}
.reg-nom{font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase}
.reg-vide{flex:1}
.reg-prix{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-body-s);color:var(--text-secondary)}
.reg-delai{font-size:var(--text-body-s);color:var(--text-tertiary)}
.svc h2{margin:clamp(28px,3.5vw,52px) 0 0;font-family:var(--font-display);font-size:var(--text-display-m);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;max-width:22ch}
.svc-texte{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:clamp(28px,4vw,72px);margin-top:clamp(30px,3.5vw,48px)}
.svc-promesse{margin:0;font-size:var(--text-body-l);line-height:var(--lh-body);max-width:46ch}
.svc-detail{display:flex;flex-direction:column;gap:16px;max-width:52ch}
.svc-detail p{margin:0;line-height:var(--lh-body);color:var(--text-secondary)}
.svc-pied{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:clamp(28px,3.5vw,44px)}
.svc-marque{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);font-family:var(--font-mono);font-size:var(--text-body-s);flex:none}
/* — Bandeau de titre des pages intérieures — */
.titre-page{padding:clamp(48px,6vw,88px) 0 clamp(40px,5vw,72px)}
.titre-page h1{margin:22px 0 0;font-family:var(--font-display);font-size:var(--text-display-l);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;max-width:20ch}
.titre-page .ouv-lede{max-width:56ch}
/* — Pied de page — */
.pied{background:var(--noir-1000);border-top:1px solid var(--border-hairline);padding:clamp(48px,6vw,80px) 0 40px}
.pied-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:40px}
.pied-marque{display:flex;flex-direction:column;gap:24px}
.pied-marque img{display:block;width:140px;height:auto;margin:-6px -8px}
.pied-coord{display:flex;flex-direction:column;gap:8px;font-size:var(--text-body-s);color:var(--text-secondary)}
.pied-col{display:flex;flex-direction:column;gap:18px}
.pied-col>span{font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.pied-liens{display:flex;flex-direction:column;gap:12px}
.nz-root .pied-liens a{font-size:var(--text-body-s);color:var(--text-secondary);border-bottom:0}
.pied-bas{margin-top:48px;padding-top:24px;border-top:1px solid var(--border-hairline);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--text-tertiary)}
/* Les icônes en ligne héritent de la couleur du texte. */
.ico{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Le signe de la FAQ : + fermé, − ouvert. */
.ico-minus{display:none}
.nz-faq-question.est-ouvert .ico-plus{display:none}
.nz-faq-question.est-ouvert .ico-minus{display:block}
/* La visionneuse 3D sert de vitrine : sa barre d'export et son aide ne sont pas du site. */

/* Cases à cocher : couleur de marque plutôt que le bleu du navigateur. */
.accord input{accent-color:var(--text-primary);width:16px;height:16px}

/* Propositions tarifaires */
.reg-apd{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.svc-budget{margin-left:auto;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-body-s);color:var(--text-secondary)}
.tarifs{width:100%;margin-top:clamp(32px,4vw,56px);border-collapse:collapse;text-align:left}
.tarifs th{padding:0 0 14px;font-family:var(--font-mono);font-size:var(--text-eyebrow);font-weight:400;letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary);border-bottom:1px solid var(--border-strong)}
.tarifs td{padding:20px 0;border-bottom:1px solid var(--border-hairline);font-size:var(--text-body);vertical-align:baseline}
.tarifs td:not(:first-child){white-space:nowrap;color:var(--text-secondary)}
@media (max-width:620px){.tarifs th:last-child,.tarifs td:last-child{display:none}}

/* Ajustements mobiles communs au site vitrine. */
html,body{overflow-x:clip}
img,video,svg{max-width:100%}
@media (max-width:640px){
.nz-root h1,.nz-root h2,.nz-root h3{white-space:normal!important;overflow-wrap:anywhere;hyphens:auto}
.nz-root main a,.nz-root section a,.nz-root section button,.nz-root .btn{max-width:100%;white-space:normal!important;text-align:center;line-height:1.25!important}
.nz-hero h1,.hero h1{white-space:normal!important}
.nz-colle,.nz-faq-titre{position:static!important}
}
@media (max-width:767px){.nz-avis-defile{flex-direction:column;align-items:stretch}.nz-colonne-avis{max-width:none;width:100%}.nz-colonne-avis:nth-child(n+2){display:none}}
@media (max-width:640px){.nz-stats-centre>div{justify-content:center;gap:40px!important}.nz-stats-centre>div>div{flex:1 1 100%;align-items:center!important;text-align:center}.nz-stats-centre .nz-num{letter-spacing:0}}
@media (max-width:640px){.nz-menu-lien-texte{font-size:clamp(46px,14vw,64px)!important}.nz-menu-liste{gap:10px!important}.nz-root .nz-menu-lien{padding:6px 0}}
/* Bouton flottant de prise de rendez-vous, présent sur toutes les pages. */
.nz-rdv{position:fixed;right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,32px);z-index:65;display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 24px 0 20px;border-radius:var(--radius-pill);background:var(--ivory-50);color:var(--noir-1000)!important;border:1px solid rgba(0,0,0,.18);box-shadow:0 10px 30px rgba(0,0,0,.28);font-family:var(--font-sans);font-size:13px;letter-spacing:var(--track-ui);text-transform:uppercase;text-decoration:none;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard)}
.nz-root .nz-rdv{border-bottom:1px solid rgba(0,0,0,.18)}
.nz-rdv:hover{background:var(--noir-1000);color:var(--ivory-50)!important;border-color:var(--ivory-50)}
.nz-rdv:active{transform:scale(var(--press-scale))}
.nz-rdv-ico{width:18px;height:18px;flex:none}
.nz-rdv-court{display:none}
.nz-haut{bottom:calc(clamp(16px,3vw,32px) + 64px)!important}
body:has(.nz-menu.est-ouvert) .nz-rdv{opacity:0;pointer-events:none}
@media (max-width:640px){
.nz-rdv{height:56px;padding:0 20px 0 18px;gap:8px;font-size:14px;letter-spacing:.08em;white-space:nowrap!important;line-height:1!important}
.nz-rdv-long{display:none}.nz-rdv-court{display:inline}
.nz-rdv-ico{width:20px;height:20px}
.nz-haut{bottom:calc(clamp(16px,3vw,32px) + 68px)!important}
}
/* Deux pulsations toutes les 5 s pour attirer l'œil. */
@keyframes nz-rdv-pulse{0%,20%,100%{transform:none;box-shadow:0 10px 30px rgba(0,0,0,.28)}5%,15%{transform:scale(1.07);box-shadow:0 0 0 6px rgba(250,249,246,.35),0 10px 30px rgba(0,0,0,.28)}10%{transform:none;box-shadow:0 10px 30px rgba(0,0,0,.28)}}
.nz-rdv{animation:nz-rdv-pulse 5s var(--ease-standard) 2s infinite}
.nz-rdv:hover,.nz-rdv:focus-visible{animation:none}
@media (prefers-reduced-motion:reduce){.nz-rdv{animation:none}}
@media (max-width:640px){
.nz-rdv,.nz-root .nz-rdv{border:2px solid var(--noir-1000)}
.nz-rdv{font-family:var(--font-display);font-size:20px;letter-spacing:.04em;padding:0 20px 0 16px}
.nz-rdv-ico{stroke-width:2.2}
}
.nz-rdv{font-family:var(--font-display);font-size:18px;letter-spacing:.04em}
@media (max-width:640px){.nz-rdv{font-size:20px}}

/* NZ'Studio — couche immersive (v2).
   Aucun jeton nouveau : couleurs, polices, rayons, ombres, durées et courbes viennent de nz.css.
   Les seules valeurs littérales sont des transparences de l'ivoire (250,249,246) et du noir,
   comme dans le design system lui-même. Mouvement : fondus et translations courtes. */

html{background:var(--noir-1000)}
body.nz-root{min-height:100vh}
.nz-root a.sans-filet,.nz-root .sans-filet a{border-bottom:0}
.nz-root a.sans-filet:hover{opacity:1}
:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-sm)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-64px;z-index:100;padding:12px 18px;border-radius:var(--radius-pill);background:var(--ivory-50);color:var(--noir-1000)!important;font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--track-nav);text-transform:uppercase;transition:top var(--dur-base) var(--ease-standard)}
.skip:focus{top:16px}

/* — Encre liquide : canevas fixe derrière tout le contenu — */
#encre{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}
.encre-repli{display:none;position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(40% 36% at 30% 38%,rgba(250,249,246,.26),rgba(250,249,246,0) 70%),
  radial-gradient(34% 32% at 70% 60%,rgba(250,249,246,.18),rgba(250,249,246,0) 70%),
  radial-gradient(26% 24% at 58% 24%,rgba(250,249,246,.12),rgba(250,249,246,0) 70%),
  radial-gradient(70% 60% at 50% 50%,rgba(250,249,246,.07),rgba(250,249,246,0) 80%),var(--noir-1000)}
.sans-encre #encre{display:none}
.sans-encre .encre-repli{display:block}
main,.pied{position:relative;z-index:1}
.sec-noir,.bandeau,.pied{background:var(--noir-1000)}

/* Voile : assombrit le centre pour la lecture, fond la base dans le noir de la section suivante. */
.voile{position:absolute;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(115% 95% at 50% 46%,rgba(0,0,0,.68) 0%,rgba(0,0,0,.68) 24%,rgba(0,0,0,.46) 52%,rgba(0,0,0,.12) 100%)}
.voile::after{content:"";position:absolute;inset:auto 0 0 0;height:28%;background:linear-gradient(180deg,rgba(0,0,0,0),var(--noir-1000))}
.voile-gauche{background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.5) 55%,rgba(0,0,0,.18) 100%)}

/* — En-tête fixe : transparent sur l'encre, noir et compact au défilement — */
.entete-fixe{position:fixed;top:0;left:0;right:0;z-index:70}
.entete-fixe .nz-entete{background:transparent;border-bottom-color:transparent;transition:padding var(--dur-base) var(--ease-standard),background var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard)}
.entete-fixe .nz-entete.est-compact{background:rgba(0,0,0,.78);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
body:has(.nz-menu.est-ouvert) .entete-fixe .nz-entete{background:transparent;box-shadow:none;border-bottom-color:transparent}
.entete-actions{display:flex;align-items:center;gap:12px}
.entete-actions .btn{display:none}
.verre{border:1px solid rgba(250,249,246,.16);background:rgba(250,249,246,.07);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.nav-verre{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:none;align-items:center;gap:26px;height:46px;padding:0 24px;border-radius:var(--radius-pill)}
.nz-root .nav-verre a{font-family:var(--font-mono);font-size:var(--text-caption);font-weight:var(--weight-mono);letter-spacing:var(--track-nav);text-transform:uppercase;color:var(--text-secondary);border-bottom:0;white-space:nowrap;transition:color var(--dur-fast) var(--ease-standard)}
.nz-root .nav-verre a:hover,.nz-root .nav-verre a[aria-current="page"]{color:var(--text-primary);opacity:1}
/* Grand écran : la pilule centrale fait office de menu, avec le bouton RDV à droite.
   Mobile et tablette : le bouton Menu ouvre le menu plein écran du kit. Jamais les deux à la fois. */
@media (min-width:1024px){
  .nav-verre{display:flex}
  .entete-actions .nz-menu-bouton{display:none}
}
/* Le bouton RDV de l'en-tête attend d'avoir la place à côté de la pilule (le bouton flottant prend le relais). */
@media (min-width:1180px){.entete-actions .btn{display:inline-flex}}

/* — Entrée de page : cascade au chargement — */
.js [data-entree]{opacity:0;transform:translateY(16px);transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out)}
.js .entete-fixe[data-entree]{transform:translateY(-12px)}
.js.est-charge [data-entree]{opacity:1;transform:none}
.mots-prets .mot{display:inline-block;overflow:hidden;vertical-align:top;padding:.12em 0 .08em;margin:-.12em 0 -.08em}
.mots-prets .mot>span{display:inline-block;transform:translateY(105%);opacity:0;transition:transform 760ms var(--ease-out),opacity 760ms var(--ease-out)}
.est-charge .mots-prets .mot>span{transform:none;opacity:1}

/* — Bandeau d'ouverture immersif — */
.hero-encre{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(112px,14vh,150px) clamp(20px,4vw,64px) clamp(104px,13vh,140px);text-align:center;overflow:hidden}
.hero-contenu{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;width:100%;max-width:1180px;will-change:opacity,transform}
.badge-verre{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;white-space:nowrap;border-radius:var(--radius-pill);font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
.point-pouls{width:6px;height:6px;border-radius:var(--radius-pill);background:var(--ivory-50);animation:nz-pouls 2.4s var(--ease-standard) infinite}
.hero-encre .hero-signature{margin-top:26px;color:var(--text-primary)}
.hero-titre{margin:14px 0 0;font-family:var(--font-display);font-size:clamp(52px,8.4vw,128px);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;color:var(--text-primary);text-wrap:balance}
.hero-encre .hero-lede{margin:26px auto 0;max-width:60ch;font-size:var(--text-body-l);line-height:var(--lh-body);color:var(--text-secondary)}
.barre-verre{display:flex;align-items:center;justify-content:space-between;gap:16px;width:min(620px,100%);margin-top:36px;padding:7px 7px 7px 26px;border-radius:var(--radius-pill);box-shadow:var(--shadow-xs)}
.barre-verre-texte{font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--track-ui);text-transform:uppercase;color:var(--text-secondary);text-align:left}
.barre-verre .btn{flex:none}
.nz-root .barre-verre .btn{white-space:nowrap!important}
.hero-encre .hero-signature{line-height:1.25}
.hero-secondaire{margin-top:22px}
.nz-root .lien-fleche{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--track-nav);text-transform:uppercase;color:var(--text-secondary);border-bottom:1px solid var(--border-hairline);padding-bottom:6px}
.nz-root .lien-fleche:hover{color:var(--text-primary);border-color:var(--border-strong);opacity:1}
.lien-fleche svg{width:14px;height:14px}
.hero-pied{position:absolute;z-index:2;left:0;right:0;bottom:clamp(20px,3.5vh,36px);display:flex;align-items:flex-end;justify-content:flex-end;padding:0 clamp(20px,4vw,64px);font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.hero-pied .nz-defiler{position:absolute;left:50%;bottom:0;transform:translateX(-50%);color:var(--text-secondary)}
@media (max-width:640px){
  .barre-verre{flex-direction:column;align-items:stretch;padding:16px;border-radius:var(--radius-xl);gap:14px}
  .barre-verre-texte{text-align:center}
  .barre-verre .btn{justify-content:center}
  .hero-pied{display:none}
  .badge-verre{letter-spacing:.12em}
}

/* — Manifeste : le texte s'éclaire mot à mot au défilement — */
.manifeste{position:relative}
.manifeste-colle{display:flex;align-items:center;min-height:100vh;padding:var(--section-y) 0}
.manifeste.est-anime{height:250vh}
.manifeste.est-anime .manifeste-colle{position:sticky;top:0;height:100vh;padding:0}
.manifeste-texte{margin:22px 0 0;font-family:var(--font-display);font-size:var(--text-display-l);line-height:1;letter-spacing:var(--track-display);text-transform:uppercase;max-width:22ch;text-wrap:balance}
.manifeste-mot{transition:opacity 120ms linear}
.manifeste.est-anime .manifeste-mot{opacity:.16}
.manifeste-note{margin-top:32px;max-width:52ch;color:var(--text-secondary);font-size:var(--text-body-l)}

/* — Chiffres clés — */
.chiffres{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.chiffre{display:flex;flex-direction:column;gap:14px}
.chiffre-val{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-display-m);line-height:1;letter-spacing:-.02em;color:var(--text-primary)}
.chiffre .stat-lbl{line-height:var(--lh-tight)}
@media (max-width:860px){.chiffres{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}}

/* — Galerie des services : verticale par défaut, horizontale et épinglée sur grand écran — */
.galerie{position:relative}
.galerie-colle{padding:var(--section-y) 0}
.galerie-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.galerie-progression{display:none;width:180px;height:1px;background:var(--border-hairline)}
.galerie-progression span{display:block;height:100%;background:var(--ivory-50);transform:scaleX(0);transform-origin:left}
.galerie-piste{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:24px;margin:clamp(40px,5vw,64px) auto 0;padding:0 clamp(24px,4vw,64px);max-width:1280px;box-sizing:border-box}
.galerie.est-horizontale .galerie-colle{position:sticky;top:0;height:100vh;padding:72px 0 0;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.galerie.est-horizontale .galerie-progression{display:block}
.galerie.est-horizontale .galerie-piste{display:flex;width:max-content;max-width:none;margin-left:0;padding:0 clamp(24px,4vw,64px);will-change:transform}
.galerie.est-horizontale .panneau{width:clamp(340px,30vw,440px);height:min(62vh,560px)}
/* Cartes de services : typographie et trait, aucune forme décorative. */
.nz-root a.panneau{position:relative;display:flex;flex-direction:column;gap:28px;min-height:460px;padding:30px 30px 26px;overflow:hidden;text-align:left!important;line-height:var(--lh-body)!important;border:1px solid var(--border-hairline);border-radius:var(--radius-lg);background:var(--surface-card);color:var(--text-primary);isolation:isolate;transition:transform var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
/* Filet métal au survol (jeton --sheen-metal du design system) */
.nz-root a.panneau::before{content:"";position:absolute;inset:0;padding:1px;border-radius:inherit;background:var(--sheen-metal);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity var(--dur-base) var(--ease-standard);pointer-events:none;z-index:2}
.nz-root a.panneau:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);opacity:1}
.nz-root a.panneau:hover::before{opacity:1}
.panneau-chiffre{position:absolute;right:-.04em;bottom:.42em;z-index:-1;font-family:var(--font-display);font-size:clamp(190px,17vw,250px);line-height:.8;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px rgba(250,249,246,.16);pointer-events:none;user-select:none;transition:color var(--dur-slow) var(--ease-standard),-webkit-text-stroke-color var(--dur-slow) var(--ease-standard),transform var(--dur-slow) var(--ease-out)}
.panneau:hover .panneau-chiffre{color:rgba(250,249,246,.05);-webkit-text-stroke-color:rgba(250,249,246,.42);transform:translateY(-6px)}
.panneau-haut{display:flex;align-items:center;justify-content:space-between;gap:16px}
.panneau-icone{display:grid;place-items:center;width:52px;height:52px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);color:var(--text-primary)}
.panneau-icone .ico{width:22px;height:22px;stroke-width:1.5}
.panneau-num{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary);white-space:nowrap}
.panneau-corps{flex:1}
.panneau h3{margin:0;font-family:var(--font-display);font-size:clamp(38px,3.2vw,52px);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;max-width:9ch}
.panneau-promesse{margin:16px 0 0;max-width:26ch;color:var(--text-secondary);font-size:var(--text-body-l);line-height:var(--lh-tight)}
.panneau-pied{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:20px;border-top:1px solid var(--border-hairline)}
.panneau-info{display:flex;flex-direction:column;gap:6px;min-width:0}
.panneau-info .offre-apd{font-size:10px}
.panneau-prix{font-family:var(--font-mono);font-weight:500;font-size:var(--text-body-l);font-variant-numeric:tabular-nums;white-space:nowrap}
.panneau-unite{font-size:var(--text-body-s);color:var(--text-secondary)}
.panneau-quand{font-family:var(--font-mono);font-size:var(--text-body-s);color:var(--text-secondary);line-height:var(--lh-tight)}
.panneau .svc-marque{width:48px;height:48px;transition:background var(--dur-base) var(--ease-standard),color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
.panneau .svc-marque svg{width:16px;height:16px}
.panneau:hover .svc-marque{background:var(--ivory-50);color:var(--noir-1000);border-color:var(--ivory-50)}
/* Dernière carte : le pack, en négatif */
.nz-root a.panneau-fin{background:var(--ivory-50);color:var(--noir-1000);border-color:var(--ivory-50)}
.panneau-fin .panneau-chiffre{-webkit-text-stroke-color:rgba(0,0,0,.14)}
.panneau-fin:hover .panneau-chiffre{color:rgba(0,0,0,.05);-webkit-text-stroke-color:rgba(0,0,0,.4)}
.panneau-fin .panneau-num,.panneau-fin .offre-apd{color:var(--grey-600)}
.panneau-fin .panneau-promesse,.panneau-fin .panneau-quand{color:var(--grey-600)}
.panneau-fin .panneau-pied{border-color:rgba(0,0,0,.14)}
.panneau-fin .svc-marque{border-color:rgba(0,0,0,.34)}
.panneau-fin:hover .svc-marque{background:var(--noir-1000);color:var(--ivory-50);border-color:var(--noir-1000)}
/* Le kit fait monter les blocs d'une carte cliquable au survol (section a>div) : ici c'est la carte
   entière qui monte, ses blocs intérieurs restent en place, sans ombre propre. */
.nz-root section a.panneau>div,.nz-root section a.panneau:hover>div,.nz-root section a.panneau:active>div{transform:none;box-shadow:none}
.nz-root section a.panneau:hover>.panneau-pied{border-color:var(--border-hairline)}
.nz-root section a.panneau-fin:hover>.panneau-pied{border-color:rgba(0,0,0,.14)}
@media (max-width:640px){
  .nz-root a.panneau{min-height:0}
  .panneau-chiffre{font-size:150px;bottom:1.15em}
  /* Mobile : prix puis délai l'un sous l'autre, la flèche à droite */
  .panneau-pied{grid-template-columns:minmax(0,1fr) auto;gap:14px 16px;align-items:center}
  .panneau-pied .panneau-info:nth-child(2){grid-row:2}
  .panneau-pied .svc-marque{grid-column:2;grid-row:1/3}
}

/* — Fondateur — */
.portrait{position:relative;border-radius:var(--radius-lg);aspect-ratio:4/5;background:var(--surface-inset)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:grayscale(1) contrast(1.06)}
.portrait.nz-reveal:not(.est-visible) img{transform:scale(1.06)}
.portrait-legende{position:absolute;left:16px;right:16px;bottom:16px;display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:var(--radius-md);background:rgba(0,0,0,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-secondary)}
.portrait-legende span:first-child{color:var(--text-primary)}
.principes{margin-top:36px;border-top:1px solid var(--border-hairline)}
.principe{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--border-hairline)}
.principe .rond{width:44px;height:44px}
.principe h3{margin:0;font-size:var(--text-caption);letter-spacing:var(--track-eyebrow);text-transform:uppercase;font-weight:400}
.principe p{margin:6px 0 0;color:var(--text-secondary);font-size:var(--text-body-s)}

/* — Offres : halo qui suit le pointeur, pack au filet métal — */
.projecteur{position:relative;isolation:isolate}
.projecteur::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;pointer-events:none;background:radial-gradient(380px circle at var(--px,50%) var(--py,50%),rgba(250,249,246,.07),transparent 60%);transition:opacity var(--dur-base) var(--ease-standard)}
.nz-clair .projecteur::before{background:radial-gradient(380px circle at var(--px,50%) var(--py,50%),rgba(0,0,0,.05),transparent 60%)}
.projecteur:hover::before{opacity:1}
.pack{position:relative;display:grid;gap:28px;align-items:center;margin-top:24px;padding:clamp(28px,3.5vw,44px);border-radius:var(--radius-lg);background:var(--noir-1000);color:var(--ivory-50)}
.pack::after{content:"";position:absolute;inset:0;padding:1px;border-radius:inherit;background:var(--sheen-metal);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.pack h3{margin:12px 0 0;font-family:var(--font-display);font-size:var(--text-display-m);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase}
.pack p{margin:10px 0 0;color:var(--grey-400)}
.pack-prix{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.pack-prix .offre-prix{font-size:var(--text-display-m)}
.pack-prix s{font-family:var(--font-mono);font-size:var(--text-body-s);color:var(--grey-500)}
.pack .nz-eyebrow{color:var(--grey-400)}
.nz-root .pack a.btn{background:var(--ivory-50);color:var(--noir-1000);border-color:var(--ivory-50)}
@media (min-width:960px){.pack{grid-template-columns:1.3fr auto auto;gap:48px}}
.offre{transition:transform var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard)}
.offre:hover{transform:translateY(-2px);border-color:var(--border-strong);box-shadow:var(--shadow-sm)}
.note-prix{margin:28px 0 0;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--text-tertiary)}

/* — Appel final, sur l'encre — */
.final-encre{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:clamp(112px,14vh,160px) 0;overflow:hidden}
.final-encre .voile{background:radial-gradient(120% 100% at 50% 50%,rgba(0,0,0,.72) 0%,rgba(0,0,0,.5) 50%,rgba(0,0,0,.2) 100%)}
.final-encre .voile::after{inset:0 0 auto 0;height:22%;background:linear-gradient(0deg,rgba(0,0,0,0),var(--noir-1000))}
.final-contenu{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center}
.final-titre{margin:22px 0 0;font-family:var(--font-display);font-size:clamp(52px,8vw,120px);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;max-width:14ch;text-wrap:balance}
.final-contenu .ouv-lede{text-align:center;max-width:56ch}
.final-contacts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 28px;margin-top:40px;font-family:var(--font-mono);font-size:var(--text-caption);letter-spacing:var(--track-ui);text-transform:uppercase;color:var(--text-secondary)}
.nz-root .final-contacts a{color:var(--text-secondary)}
.nz-root .final-contacts a:hover{color:var(--text-primary)}


/* — Bouton RDV : apparaît une fois le bandeau d'ouverture passé — */
.js .nz-rdv{opacity:0;visibility:hidden;transition:opacity var(--dur-base) var(--ease-standard),visibility 0s linear var(--dur-base),background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.js .nz-rdv.est-visible{opacity:1;visibility:visible;transition-delay:0s}

/* — Pages intérieures : bandeau de titre sur l'encre — */
.page-encre{position:relative;min-height:74vh;min-height:74svh;display:flex;align-items:flex-end;padding:clamp(140px,18vh,200px) 0 clamp(48px,7vw,96px);overflow:hidden}
.page-encre .voile::after{height:40%}
.page-encre .wrap{position:relative;z-index:2;width:100%}
.page-encre h1{margin:22px 0 0;font-family:var(--font-display);font-size:var(--text-display-xl);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase;max-width:18ch;text-wrap:balance}
.page-encre .ouv-lede{max-width:58ch}
.fil{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.nz-root .fil a{color:var(--text-secondary);border-bottom:0}
.fil li+li::before{content:"/";margin-right:10px;color:var(--grey-600)}
.faits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:clamp(36px,5vw,56px);border-top:1px solid var(--border-strong)}
.fait{padding:20px 24px 0 0}
.fait+.fait{padding-left:24px;border-left:1px solid var(--border-hairline)}
.fait dt{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.fait dd{margin:10px 0 0;color:var(--text-primary);line-height:var(--lh-tight)}
.fait-prix dd{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-body-l)}
@media (max-width:760px){.faits{grid-template-columns:1fr}.fait+.fait{padding-left:0;border-left:0;border-top:1px solid var(--border-hairline);margin-top:20px}}

/* Registre des autres services */
.registre{margin-top:clamp(32px,4vw,48px);border-top:1px solid var(--border-strong)}
.nz-root a.registre-ligne{display:grid;grid-template-columns:56px 1fr auto 44px;align-items:center;gap:16px;padding:20px 0;border-bottom:1px solid var(--border-hairline);color:var(--text-primary);transition:padding var(--dur-base) var(--ease-standard)}
.nz-root a.registre-ligne:hover{padding-left:10px;opacity:1}
.registre-ligne .reg-nom{font-size:var(--text-caption)}
.registre-ligne:hover .svc-marque{background:var(--ivory-50);color:var(--noir-1000);border-color:var(--ivory-50)}
.registre-ligne .svc-marque svg{width:16px;height:16px}
@media (max-width:640px){.nz-root a.registre-ligne{grid-template-columns:40px 1fr 44px}.registre-ligne .reg-prix{display:none}}

/* Paliers (réseaux sociaux) */
.paliers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:clamp(32px,4vw,48px)}
@media (max-width:860px){.paliers{grid-template-columns:1fr}}

/* Histoire : frise verticale */
.frise{margin:clamp(40px,5vw,64px) 0 0;padding:0;list-style:none;border-top:1px solid var(--border-hairline)}
.frise-etape{display:grid;grid-template-columns:56px 180px minmax(0,1fr);gap:16px 24px;padding:28px 0;border-bottom:1px solid var(--border-hairline)}
.frise-etape .reg-num{padding-top:6px}
.frise-etape .nz-rail-jour{padding-top:6px}
.frise-etape h3{margin:0;font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--lh-heading);letter-spacing:var(--track-display);text-transform:uppercase}
.frise-etape p{margin:10px 0 0;max-width:60ch;color:var(--text-secondary)}
.frise-etape.est-maintenant h3::after{content:"";display:inline-block;width:10px;height:10px;margin-left:14px;border-radius:var(--radius-pill);background:var(--ivory-50);vertical-align:middle;animation:nz-pouls 2.4s var(--ease-standard) infinite}
@media (max-width:760px){.frise-etape{grid-template-columns:40px 1fr}.frise-etape .nz-rail-jour{grid-column:2}.frise-etape>div{grid-column:2}}

/* Contact */
.contact-duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:24px}
.coord{display:flex;flex-direction:column;border-top:1px solid var(--border-hairline);margin-top:24px}
.nz-root .coord a,.coord div{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid var(--border-hairline);color:var(--text-primary)}
.coord span:first-child{display:flex;align-items:center;gap:12px;font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.infos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:clamp(32px,4vw,48px);border:1px solid var(--border-hairline);border-radius:var(--radius-lg);overflow:hidden;background:var(--border-hairline)}
.info{padding:28px;background:var(--bg-canvas)}
.info dt{font-family:var(--font-mono);font-size:var(--text-eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-tertiary)}
.info dd{margin:10px 0 0}
@media (max-width:640px){.infos{grid-template-columns:1fr}}

/* Pages légales */
.legal section{padding:28px 0;border-top:1px solid var(--border-hairline)}
.legal h2{margin:0;font-family:var(--font-display);font-size:var(--text-h3);line-height:var(--lh-heading);letter-spacing:var(--track-display);text-transform:uppercase}
.legal p{margin:14px 0 0;color:var(--text-secondary)}

@media (prefers-reduced-motion:reduce){
  .js [data-entree],.mots-prets .mot>span{opacity:1;transform:none;transition:none}
  .point-pouls,.frise-etape.est-maintenant h3::after{animation:none}
  .panneau-motif,.nz-root a.panneau,.offre,.nz-root a.registre-ligne{transition:none}
  .portrait.nz-reveal:not(.est-visible) img{transform:none}
}

/* Le kit centre le texte des boutons sous 640 px ; la FAQ, elle, reste une bulle de discussion alignée à gauche. */
.nz-root .nz-faq-question{text-align:left!important}
.panneau-num{white-space:nowrap}

/* — Titre écrit par l'encre — */
.titre-encre .hero-titre{color:transparent}
.titre-encre .hero-titre.mots-prets .mot>span{opacity:1;transform:none;transition:none}
/* Le voile protège le texte courant sous le titre, sans éteindre les lettres d'encre. */
.titre-encre .hero-encre .voile{background:
  radial-gradient(90% 52% at 50% 80%,rgba(0,0,0,.74) 0%,rgba(0,0,0,.5) 48%,rgba(0,0,0,0) 78%),
  radial-gradient(130% 100% at 50% 40%,rgba(0,0,0,0) 40%,rgba(0,0,0,.45) 100%)}
.titre-encre .hero-encre .hero-lede{text-shadow:0 1px 18px rgba(0,0,0,.9),0 0 2px rgba(0,0,0,.6)}

/* — Services : une carte fermée par service. Le nom est le titre, le prix est à côté,
   le bouton ferme la carte ; un vrai vide sépare chaque service du suivant. — */
.svc-liste{display:grid;gap:clamp(28px,3.5vw,48px)}
.svc-carte{padding:clamp(28px,4vw,52px);scroll-margin-top:100px}
.svc-carte-tete{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px 28px;padding-bottom:24px;border-bottom:1px solid var(--border-strong)}
.svc-carte-titres h2{margin:8px 0 0;font-family:var(--font-display);font-size:var(--text-display-m);line-height:var(--lh-display);letter-spacing:var(--track-display);text-transform:uppercase}
.svc-carte-prix{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right}
.svc-carte-prix .offre-prix{font-size:clamp(28px,2.6vw,40px)}
.svc-carte-promesse{margin:28px 0 0;font-family:var(--font-display);font-size:var(--text-h2);line-height:var(--lh-heading);letter-spacing:var(--track-display);text-transform:uppercase;color:var(--text-secondary)}
.svc-carte .svc-texte{margin-top:24px}
.svc-carte-pied{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:32px;padding-top:24px;border-top:1px solid var(--border-hairline)}
@media (max-width:760px){
  .svc-carte-tete{grid-template-columns:auto minmax(0,1fr)}
  .svc-carte-prix{grid-column:1/-1;flex-direction:row;align-items:baseline;flex-wrap:wrap;gap:4px 10px;text-align:left}
}
/* Méthode : chaque étape dans sa propre carte, pour la même raison. */
article.svc{border:1px solid var(--border-hairline);border-radius:var(--radius-lg);background:var(--surface-card);padding:clamp(28px,4vw,52px)}

/* Pages par ville : communes voisines, en texte simple (aucun lien) */
.alentours-texte{margin:16px 0 0;font-size:var(--text-body-l);line-height:var(--lh-body)}
.alentours-note{margin:14px 0 0;color:var(--text-secondary);font-size:var(--text-body-s)}

/* Correctif d'accessibilité : en thème clair, le texte tertiaire du kit (gris 500 sur ivoire)
   n'atteint que 2,7:1. Le gris 600 donne 4,8:1, au-dessus du seuil de 4,5:1. */
.nz-clair{--text-tertiary:var(--grey-600)}

/* Réseaux sociaux du pied de page : l'écart de la colonne (24 px) suffit, sans la marge du kit. */
.pied-marque .reseaux{margin-top:0}
