/* ===== tokens.css ===== */
:root{
  --ink-900: #141414;
  --ink-800: #232323;
  --ink-700: #3D3D3D;
  --ink-600: #5C5C5C;
  --ink-500: #767676;
  --ink-400: #9A9A98;
  --ink-300: #C4C4C1;
  --ink-200: #E4E4E1;
  --ink-100: #F0F0EE;
  --ink-50: #F6F6F5;
  --white: #FFFFFF;
  --green-500: #00E6B0;
  --point-halo: rgba(0,230,176,.28);
  --point-halo-ratio: 1.81;
  --green-600: #00C497;
  --green-700: #00875F;
  --green-800: #006B4C;
  --green-100: #D6FAF1;
  --green-50: #EEFDF8;
  --yellow-500: #ECF22E;
  --yellow-600: #D9DF1C;
  --yellow-700: #A8AD12;
  --yellow-100: #FAFBD0;
  --yellow-50: #FDFEEA;
  --red-600: #C8321E;
  --red-100: #FBE3DF;
  --orange-600: #C26A00;
  --orange-100: #FDEBD3;
  --blue-600: #2A5DA8;
  --blue-100: #DEE8F7;
  --success-600: #1E8E5A;
  --success-100: #DCF3E6;
  --text-1: var(--ink-900);
  --text-2: var(--ink-600);
  --text-3: var(--ink-500);
  --text-inverse: var(--white);
  --text-accent: var(--green-700);
  --text-link: var(--ink-900);
  --text-on-yellow: var(--ink-900);
  --text-on-ink: var(--white);
  --surface-page: var(--white);
  --surface-card: var(--white);
  --surface-sunken: var(--ink-50);
  --surface-muted: var(--ink-100);
  --surface-ink: var(--ink-900);
  --surface-ink-2: var(--ink-800);
  --surface-photo: var(--ink-800);
  --border-1: var(--ink-200);
  --border-2: var(--ink-300);
  --border-strong: var(--ink-900);
  --border-focus: var(--green-600);
  --accent: var(--green-500);
  --accent-soft: var(--green-100);
  --pro: var(--yellow-500);
  --pro-hover: var(--yellow-600);
  --pro-soft: var(--yellow-100);
  --status-neutral-fg: var(--ink-700);
  --status-neutral-bg: var(--ink-100);
  --status-info-fg: var(--blue-600);
  --status-info-bg: var(--blue-100);
  --status-success-fg: var(--success-600);
  --status-success-bg: var(--success-100);
  --status-warning-fg: var(--orange-600);
  --status-warning-bg: var(--orange-100);
  --status-danger-fg: var(--red-600);
  --status-danger-bg: var(--red-100);
  --status-active-fg: var(--green-800);
  --status-active-bg: var(--green-100);
  --overlay: rgba(20,20,20,.56);
  --font-sans: "Heebo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono: "JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --font-display: var(--font-sans);
  --font-body: var(--font-sans);
  --font-technical: var(--font-mono);
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;
  --weight-black: 900;
  --text-display-xl: clamp(44px,5vw,72px);
  --text-display-l: clamp(36px,4vw,56px);
  --text-display-m: 40px;
  --text-h1: 32px;
  --text-h2: 24px;
  --text-h3: 20px;
  --text-h4: 17px;
  --text-body-l: 18px;
  --text-body: 16px;
  --text-body-s: 14px;
  --text-caption: 13px;
  --text-micro: 12px;
  --text-mono: 13px;
  --text-mono-s: 11px;
  --leading-display: 0.95;
  --leading-heading: 1.1;
  --leading-body: 1.55;
  --leading-tight: 1.25;
  --tracking-display: -0.035em;
  --tracking-heading: -0.02em;
  --tracking-body: 0;
  --tracking-mono: 0.12em;
  --tracking-mono-tight: 0.02em;
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --gutter: 24px;
  --gutter-mobile: 16px;
  --container: 1200px;
  --container-narrow: 760px;
  --container-wide: 1440px;
  --sidebar-w: 248px;
  --topbar-h: 60px;
  --control-h-s: 32px;
  --control-h: 40px;
  --control-h-l: 48px;
  --touch-min: 44px;
  --radius-xs: 4px;
  --radius-s: 6px;
  --radius-m: 8px;
  --radius-l: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;
  --border-w: 1px;
  --border-w-strong: 1.5px;
  --shadow-none: none;
  --shadow-s: 0 1px 2px rgba(20,20,20,.06);
  --shadow-m: 0 4px 12px rgba(20,20,20,.08);
  --shadow-l: 0 16px 40px rgba(20,20,20,.16);
  --shadow-card: 0 1px 2px rgba(20,20,20,.04),0 10px 30px rgba(20,20,20,.07);
  --shadow-accent: 0 10px 28px rgba(0,230,176,.35);
  --ease-out: cubic-bezier(.2,.7,.2,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;
  --focus-ring: 0 0 0 3px var(--green-100),0 0 0 4.5px var(--green-600);
}


/* ===== base.css ===== */
/* ===== base.css — fondations + ARMOR Odoo V12 (scope .ww) =====
   Resets en :where(.ww) → spécificité (0,0,1) : n'importe quelle classe de composant les bat.
   Armor = défenses apprises sur le thème website.layout (lessons 2026-05-26/27/28, 06-17), préfixe #wrap. */

:where(.ww), :where(.ww) *, :where(.ww) *::before, :where(.ww) *::after { box-sizing: border-box; }
.ww {
  font-family: var(--font-sans); font-weight: var(--weight-regular); line-height: var(--leading-body);
  color: var(--text-1); background: var(--surface-page);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
/* --- règles globales d'éléments du DS (extraites du live : ds-element-rules.css) --- */
.ww { font-size: var(--text-body); font-feature-settings: "kern"; }
:where(.ww) ul, :where(.ww) ol { margin: 0; padding: 0; list-style: none; }
:where(.ww) img, :where(.ww) svg { display: block; }
:where(.ww) img { max-width: 100%; }
:where(.ww) p { margin: 0; text-wrap: pretty; }
/* titres (+ .ww-mock-hN = titres de l'écran factice, dégradés en div pour le SEO : un seul H1 par page) : le thème Odoo pose h1-h6{font-size/font-weight:300 !important} → valeurs DS en !important (les classes ww-t-* et .ww-hero .ww-h1, plus spécifiques, gardent la main) */
.ww h1, .ww h2, .ww h3, .ww h4, .ww .ww-mock-h1, .ww .ww-mock-h2, .ww .ww-mock-h3, .ww .ww-mock-h4 {
  margin: 0; font-family: var(--font-display) !important; letter-spacing: var(--tracking-heading) !important;
  line-height: var(--leading-heading) !important; color: var(--text-1) !important; text-wrap: pretty;
}
.ww h1, .ww .ww-mock-h1 { font-size: var(--text-h1) !important; font-weight: var(--weight-black) !important; letter-spacing: var(--tracking-display) !important; }
.ww h2, .ww .ww-mock-h2 { font-size: var(--text-h2) !important; font-weight: var(--weight-black) !important; }
.ww h3, .ww .ww-mock-h3 { font-size: var(--text-h3) !important; font-weight: var(--weight-bold) !important; }
.ww h4, .ww .ww-mock-h4 { font-size: var(--text-h4) !important; font-weight: var(--weight-bold) !important; }
/* liens : soulignés fins (DS), vert au survol ; les .ww-btn annulent le soulignement */
:where(.ww) a {
  color: var(--text-link); text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
  text-decoration-color: var(--ink-300); transition: text-decoration-color var(--dur-base) var(--ease-out);
}
:where(.ww) a:hover { text-decoration-color: var(--green-600); }
/* bootstrap (thème) pose sup{position:relative;top:-.5em;line-height:0;vertical-align:baseline} → retour au rendu de référence (UA) */
:where(.ww) sup { position: static; top: auto; line-height: inherit; vertical-align: super; }
:where(.ww) button { all: unset; box-sizing: border-box; cursor: pointer; font: inherit; color: inherit; display: inline-flex; }
:where(.ww) button:focus-visible, :where(.ww) a:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-s); }
.ww ::selection { background: var(--green-100); color: var(--ink-900); }

/* ===== ARMOR Odoo — actif sous #wrapwrap (thème website.layout) : couvre la landing (#wrap > .ww) ET le footer (#footer > .ww) ===== */
/* Le thème pose header{position:fixed}, margin-left:230px sur main/header/section, a{color:#000!important},
   b,strong{color:#000!important}, p{font-weight:300}, h1{font-size!important}. On RÉAFFIRME le design (préfixe #wrap = 1-2-x). */
/* footer du SITE (vue 2301 = footer v2) : le thème laisse footer.o_footer transparent (bg-light + .o_footer{transparent!important}) et décale
   #footer de 255/270 px à droite du menu fixe → la gouttière serait blanche : on peint le conteneur en encre (mesuré live 25/09). */
#wrapwrap > footer.o_footer { background: var(--ink-900) !important; }
/* Le thème décale #footer d'une valeur FIXE (255/260/270 px selon la largeur) alors que le menu latéral (sidebar v3) fait
   `--sb-width: clamp(280px, 22vw, 360px)` : à 1440 px, 23 px du footer passaient sous le menu. On aligne le décalage sur le menu
   (spécificité 2,2,2 > thème 2,2,1). Sur /workwith, chrome.css (même spécificité, chargé après) remet 0. */
@media (min-width: 992px) {
  html body:not(.editor_enable):not(.editor_has_snippets) #wrapwrap #footer { padding-left: var(--sb-width, 270px) !important; }
}
#wrapwrap .ww .ww-topbar { position: relative !important; top: auto !important; left: auto !important; width: auto !important; }  /* le thème pose header{position:fixed} ; bandeau non collant (écart n°2) */
#wrapwrap .ww .ww-rail-nav { position: fixed !important; }
#wrapwrap .ww section, #wrapwrap .ww footer, #wrapwrap .ww header, #wrapwrap .ww main, #wrapwrap .ww nav {
  margin-left: 0 !important; margin-right: 0 !important;
}
/* sections NON positionnées comme dans la référence : un `position:relative` ici (armor 24/09) faisait passer la section suivante
   par-dessus le point vert qui déborde du cadre du hero (Charles 25/09 : « le point vert n'est pas complet »). Le thème ne positionne
   pas les sections ; seul le footer garde la réaffirmation. */
#wrapwrap .ww section { position: static !important; }
#wrapwrap .ww footer { position: relative !important; top: auto !important; left: auto !important; width: auto !important; }
/* liens de contenu : hériter (les boutons .ww-btn ont leur propre couleur, voir components.css) */
#wrapwrap .ww a, #wrapwrap .ww strong, #wrapwrap .ww b { color: inherit !important; -webkit-text-fill-color: currentColor !important; }  /* (1,1,1) : les classes ww-t-* (1,2,0) et .ww-btn--* !important gardent leur couleur */
/* le thème pose p{font-family/font-size/font-weight/line-height: … !important} (0,0,1) : un <p> sans style propre doit HÉRITER
   comme dans le DS (mesuré 25/09 : « Tout part de là » 18.6 px devenait 25.2 px). Les classes ww-t-* (1,2,0 !important) gardent la main. */
/* le thème pose a{text-decoration:none !important} : on réaffirme le soulignement fin du DS ; les liens du design en `text-decoration:none`
   (classes ww-t-*, 1,2,0 !important) et les boutons .ww-btn gardent la main. */
#wrapwrap .ww a { text-decoration-line: underline !important; text-decoration-thickness: 1px !important; text-decoration-color: var(--ink-300) !important; }
#wrapwrap .ww a:hover { text-decoration-color: var(--green-600) !important; }
#wrapwrap .ww .ww-btn, #wrapwrap .ww .ww-btn:hover { text-decoration-line: none !important; }
#wrapwrap .ww p { font-family: inherit !important; font-size: inherit !important; font-weight: inherit !important; line-height: inherit !important; }
/* mesure live 25/09 : le thème force la taille des <p> (chapô hero 18 px au lieu de 17) → armor sur les p écrits à la main */
#wrapwrap .ww .ww-hero__lede { font-size: 19px !important; line-height: 1.5 !important; }   /* hero v1.4 : 19 px */


/* ===== components.css ===== */
/* ===== components.css — composants landing v2 (valeurs = styles inline du rendu de référence) =====
   Convention : classes de la référence conservées quand elles existent (.ww-hero, .ww-hero-in, .ww-hero-veil,
   .ww-grid2, .ww-hero-btns, .ww-h1, .ww-rail-nav) pour que responsive.css (extrait du DS) s'applique tel quel ;
   BEM `__` pour les parties qui n'étaient stylées qu'en inline. */

/* ---------- Bandeau (68 px encre, logo dans un U inversé) ----------
   ÉCART VOLONTAIRE n°2 (Charles 25/09 : « le sticky header n'est pas obligatoire ») : le bandeau défile avec la page
   (le design le pose en sticky). À REPORTER dans Claude Design. */
.ww-topbar {
  position: relative; z-index: 50; height: 68px;
  display: flex; align-items: flex-end; justify-content: center; padding: 0 24px;
  background: var(--ink-900); color: #fff;
}
.ww-logo-u {
  display: inline-flex; align-items: center; justify-content: center;
  height: 60px; padding: 0 28px; margin-top: 8px;
  border: 1px solid rgba(255,255,255,.55); border-bottom: 0; border-radius: 14px 14px 0 0;
}
.ww-logo-u img { height: 26px; width: auto; }
.ww-back { display: none; }

/* ---------- Atomes : bouton, pilule, kicker, point vert ---------- */
.ww-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 48px; padding: 0 22px; border-radius: var(--radius-m); border: 1px solid transparent;
  font-family: var(--font-sans); font-weight: var(--weight-bold); font-size: 16px; line-height: 1;
  cursor: pointer; white-space: nowrap; text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast);
}
.ww-btn svg { width: 18px; height: 18px; flex: 0 0 auto; }
.ww-btn:active { transform: translateY(1px); }
.ww-btn--accent  { background: var(--green-500); border-color: var(--green-500); color: var(--ink-900); }
.ww-btn--inverse { background: #fff; border-color: #fff; color: var(--ink-900); }
/* Hover/active = table V du Button DS (background: hov ? v.hbg : v.bg ; transform: act ? translateY(1px)).
   !important car les boutons générés gardent leur background inline. */
.ww-btn--accent:hover    { background: var(--green-600) !important; }
.ww-btn--pro:hover       { background: var(--yellow-600) !important; }
.ww-btn--primary:hover   { background: var(--ink-800) !important; }
.ww-btn--inverse:hover   { background: var(--ink-100) !important; }
.ww-btn--secondary:hover { background: var(--ink-50) !important; }
.ww-btn--ghost:hover     { background: var(--ink-100) !important; }
.ww-btn--danger:hover    { background: #A82717 !important; }
.ww-btn--accent:active, .ww-btn--pro:active, .ww-btn--primary:active, .ww-btn--inverse:active,
.ww-btn--secondary:active, .ww-btn--ghost:active, .ww-btn--danger:active { transform: translateY(1px) !important; }
/* actions rapides du mock (onMouseEnter → ink-50 dans le DS) */
.ww-quick > button:hover, .ww-quick > a:hover { background: var(--ink-50) !important; }
/* armor : le thème Odoo pose a{color:#000!important} — les boutons sont des <a> */
#wrapwrap .ww .ww-btn--accent, #wrapwrap .ww .ww-btn--inverse { color: var(--ink-900) !important; -webkit-text-fill-color: var(--ink-900) !important; }

.ww-kicker { font-family: var(--font-mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.ww-sep { width: 1px; height: 14px; background: rgba(255,255,255,.4); }
.ww-pills { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.ww-pill {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600;
  color: var(--ink-900); background: var(--yellow-500); padding: 4px 8px; border-radius: var(--radius-pill);
}
.ww-point {
  position: absolute; left: 50%; bottom: -6px; width: 12px; height: 12px; margin-left: -6px;
  border-radius: 6px; background: var(--green-500); box-shadow: 0 0 0 6px var(--point-halo);
}
.ww-dot { color: var(--green-500); }

/* ---------- Hero v1.4 (handoff ENTREE/landing-v1.4, 11/10) : titre sur fond encre, ligne chapô + boutons, photo encadrée en dessous
   (cadre 1 px blanc 50 %, rayon 20, marge 14 ; point vert centré sur la bordure basse ; fil de 96 px en tête de la section 01).
   Plus aucun texte sur la photo. Chapô = texte de la page (relu le 08/10), pas celui du handoff. ---------- */
.ww-hero { background: var(--ink-900); color: #fff; padding: 0 24px; }   /* 64 -> 24 px : même bord que la barre et les sections 02-07 entre 761 et 1327 px (audit UX 11/10) ; rien ne bouge au-dessus de 1328 px */
.ww-hero__wrap { max-width: 1200px; margin: 0 auto; box-sizing: border-box; display: grid; gap: 40px; padding-top: 24px; }   /* 56 -> 24 px sous la barre (Charles 11/10 : « diminue le vide noir ») */
.ww-hero__meta { display: flex; align-items: center; gap: 10px 12px; flex-wrap: wrap; }
.ww-hero__meta .ww-kicker { color: #fff; }
/* ÉCART VOLONTAIRE à la maquette — VALIDÉ Charles 25/09 : surtitre « L’espace professionnel d’idréva » en badge encre (style rail) pour signaler « plateforme »
   — point vert + Eyebrow ink (vert) 14 px / 500, plaque rgba(20,20,20,.72) + liseré .18, coins 10. À REPORTER dans Claude Design (source de vérité).
   Composant partagé `.ww-badge` (26/09, Charles : « harmoniser avec la landing ») : même rendu sur la page de connexion. */
.ww-hero__meta .ww-kicker, .ww-badge {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 500; letter-spacing: .12em;
  color: var(--green-500); /* Eyebrow DS, variante « ink » : vert sur fond encre */
  /* cran 1 : plaque encre (style du rail de progression) */
  padding: 8px 14px 8px 12px; border-radius: 10px;
  background: rgba(20,20,20,.72); border: 1px solid rgba(255,255,255,.18);
}
.ww-hero__meta .ww-kicker::before, .ww-badge::before {
  content: ""; width: 8px; height: 8px; border-radius: 4px; flex: 0 0 8px;
  background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo);
}
/* .ww-h1 est aussi utilisé par le DS dans le mock « Mon espace » (h1 « Bonjour Marie. », 52 px encre) → scoper au hero */
.ww-hero .ww-h1 { margin: 0; font-size: clamp(46px, 8.6cqi, 132px); font-weight: var(--weight-black); letter-spacing: -.055em; line-height: 1; color: #fff; max-width: 1100px; text-wrap: balance; }
.ww-h1__soft { color: var(--ink-400); }
.ww-hero__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; }
/* Charles 05/11 : « pourquoi les deux boutons passent si vite sous le paragraphe » -> la règle DS .ww-grid2 (1 colonne sous 1180 px) touchait aussi
   la rangée texte + boutons de la hero ; boutons gardés à droite du texte jusqu'à 900 px de large */
@media (min-width: 900px) { #wrapwrap .ww .ww-hero__row { grid-template-columns: minmax(0, 1fr) auto !important; } }
.ww-hero__lede { margin: 0; font-size: 19px; line-height: 1.5; color: var(--ink-200); max-width: 620px; text-wrap: pretty; }
.ww-hero-btns { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ww-hero__photo { position: relative; box-sizing: border-box; border: 1px solid rgba(255,255,255,.5); border-radius: 20px; padding: 14px; }
.ww-hero__photo > img { display: block; width: 100%; height: auto; aspect-ratio: 21 / 8; object-fit: cover; object-position: center 67%; border-radius: 12px; }
@media (max-width: 760px) { .ww-hero__photo > img { aspect-ratio: 4 / 3; } }

/* Typo armor (thème Odoo : h1{font-size/weight !important}) — hero uniquement ; les h1/h2/h3 générés portent leurs classes ww-t-* */
/* interligne .88 -> 1 (Charles 11/10 : « le texte se chevauche ») : en Heebo 900, f (0,760 em) + j (0,213 em) = 0,974 ; sous cette valeur deux lignes se touchent */
#wrapwrap .ww .ww-hero .ww-h1 { font-weight: 900 !important; line-height: 1 !important; letter-spacing: -.055em !important; color: #fff !important; }
#wrapwrap .ww .ww-hero .ww-h1 .ww-h1__soft { color: var(--ink-400) !important; }
/* portables 13-14 pouces (Charles 05/11 : « tout est un peu gros », « c'est le titre de la hero ») : 8,6cqi -> 6,9cqi (100 -> 80 px à 1162 px de large,
   132 px toujours atteint vers 1913 px) ; sous 1000 px de haut, le titre suit aussi la hauteur (10,8vh) ; largeur en em = les 3 lignes d'origine
   (« Le bon équipement, / chiffré juste, suivi / jusqu'à la pose. ») à toutes les tailles */
@media (min-width: 761px) { #wrapwrap .ww .ww-hero .ww-h1 { font-size: clamp(46px, 6.9cqi, 132px) !important; max-width: 8.4em !important; } }
@media (min-width: 761px) and (max-height: 1000px) { #wrapwrap .ww .ww-hero .ww-h1 { font-size: clamp(46px, min(6.9cqi, 10.8vh), 132px) !important; } }
@media (max-width: 760px) { #wrapwrap .ww .ww-hero .ww-h1 { font-size: 36px !important; } }
/* version anglaise (phase 1, Charles 05/11) : le titre anglais est plus long (5 lignes à 8,4 em) -> 10 em de large pour garder 3 lignes
   comme le français : la hero reste visible en entier (règle de Charles). Repère data-ww-lang posé par i18n_build.py sur la version anglaise. */
@media (min-width: 761px) { #wrapwrap [data-ww-lang="en"] .ww .ww-hero .ww-h1, [data-ww-lang="en"] #wrapwrap .ww .ww-hero .ww-h1 { max-width: 10em !important; } }

/* ---------- §02 : onglets 01–05 (états actif/inactif mesurés sur la référence) + scène à 5 cartes ---------- */
.ww-tab { color: var(--ink-500); transition: color .18s ease; }
.ww-tab.is-active, .ww-tab:hover { color: var(--ink-900); }
.ww-tab__dot { background: var(--ink-300); box-shadow: none; transition: background .18s ease, box-shadow .18s ease; }
.ww-tab.is-active .ww-tab__dot { background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo); }
.ww-tab__num { color: var(--ink-400); transition: color .18s ease; }
.ww-tab.is-active .ww-tab__num { color: var(--green-700); }
.ww-stage__card[hidden] { display: none !important; }

/* ---------- Rail de progression (fixe à droite, règle graduée + 6 ancres + point) ---------- */
.ww-rail-nav {
  position: fixed; right: 24px; top: 50%; transform: translateY(-50%); z-index: 60;
  height: 240px; width: 60px; border-radius: 10px;
  background: rgba(20,20,20,.72); border: 1px solid rgba(255,255,255,.18); color: #fff;
  transition: color .2s ease-out, background .2s ease-out;
}
.ww-rail-nav__axis { position: absolute; right: 14px; top: 20px; bottom: 20px; border-left: 1px solid; opacity: .6; }
.ww-rail-nav__tick { position: absolute; right: 14px; border-top: 1px solid; width: 4px; opacity: .35; }
.ww-rail-nav__tick--mid   { width: 8px;  opacity: .6; }
.ww-rail-nav__tick--major { width: 12px; opacity: .9; }
.ww-rail-nav__btn {
  position: absolute; right: 14px; transform: translateY(-50%);
  display: flex; align-items: center; height: 18px; padding-right: 20px; color: inherit; cursor: pointer;
}
/* 7 entrees (FAQ = 07, handoff 25/09) reparties de 36 a 204 px, pas 28 */
.ww-rail-nav__btn:nth-of-type(1) { top: 36px; }  .ww-rail-nav__btn:nth-of-type(2) { top: 64px; }
.ww-rail-nav__btn:nth-of-type(3) { top: 92px; }  .ww-rail-nav__btn:nth-of-type(4) { top: 120px; }
.ww-rail-nav__btn:nth-of-type(5) { top: 148px; } .ww-rail-nav__btn:nth-of-type(6) { top: 176px; }
.ww-rail-nav__btn:nth-of-type(7) { top: 204px; }
.ww-rail-nav__num { font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; font-weight: 500; opacity: .45; transition: opacity .2s ease-out; }
.ww-rail-nav__btn.is-active .ww-rail-nav__num, .ww-rail-nav__btn:hover .ww-rail-nav__num { opacity: 1; }
.ww-rail-nav__dot {
  position: absolute; right: 10.5px; top: 20px; width: 8px; height: 8px; margin-top: -4px;
  border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo);
  transition: top .12s linear;
}
.ww-rail-nav__cap { position: absolute; right: 10px; font-family: var(--font-mono); font-size: 8px; opacity: .6; line-height: 1; }
.ww-rail-nav__cap--top    { top: 5px;    letter-spacing: .1em; }
.ww-rail-nav__cap--bottom { bottom: 5px; letter-spacing: .12em; }

/* ---------- Mobile (≤760) : barres fixes + §06 segmenté + aperçu §03 à l'échelle (JS) ---------- */
.ww-progress__fill { display: block; height: 100%; width: 0%; background: var(--green-500); transition: width .12s linear; }
.ww-seg__tab { color: var(--text-2); font-weight: 500; background: transparent; box-shadow: none; }
.ww-seg__tab.is-active { color: var(--ink-900); font-weight: 700; background: #fff; box-shadow: var(--shadow-s); }
@media (max-width: 760px) {
  .ww-acc-card:not(.is-active) { display: none !important; }
  .ww-vitrine { padding-bottom: 76px; } /* place pour la barre collante (règle DS) */
}

/* mock « Mon espace » sous 760 : le DS rend le h1 « Bonjour Marie. » à 34 px (mesuré) — bat la classe ww-t-* (52 px) */
@media (max-width: 760px) { #wrapwrap .ww .ww-preview .ww-h1 { font-size: 34px !important; } }

/* §06 cartes d'accès Exploitant / Distributeur / Installateur (Charles 26/09 : « l'arrivée de l'entonnoir, ça doit être sans accroc ») :
   toute la carte est cliquable (workwith.js → le lien du bouton) et réagit au survol : levée 4 px + ombre forte, le bouton interne
   passe en état survolé en même temps. Au repos rien ne change (parité). Écart volontaire n°6 : le handoff n'a ni survol ni clic carte. */
.ww .ww-acc-card { cursor: pointer; transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
@media (hover: hover) and (min-width: 761px) {
  .ww .ww-acc-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-l); }
  /* conventions de survol du DS (hover.css) : carte claire → bordure encre ; carte encre → bordure verte + fond ink-800 ;
     la carte Installateur garde sa bordure jaune PRO+ (accent volontaire) */
  /* !important comme hover.css : les styles de repos des cartes sont des classes générées `#wrapwrap .ww .ww-s-*` (1,2,0) */
  .ww .ww-cat .ww-acc-card:nth-child(1):hover { border-color: var(--ink-900) !important; }
  .ww .ww-cat .ww-acc-card:nth-child(2):hover { border-color: var(--green-500) !important; background: var(--ink-800) !important; }
  .ww .ww-acc-card:hover .ww-btn--secondary { background: var(--ink-50) !important; }
}
.ww .ww-acc-card:focus-within { box-shadow: var(--shadow-l); }

/* §06 : 4 accès (Bureau d'études ajouté le 08/11). Charles : « garder les dimensions des cartes actuelles, défiler de la droite vers la gauche ».
   Ordinateur : 3 cartes visibles à leur largeur d'origine (384 px à 1440), la 4e arrive par les flèches ; téléphone : une carte et l'amorce
   de la suivante, défilement au doigt + points (le sélecteur segmenté, trop étroit pour 4 profils, est masqué). Sans JS : la rangée défile quand même. */
#wrapwrap .ww #ww-accs { display: grid; grid-template-columns: none !important; grid-auto-flow: column;   /* !important : bat responsive.css « .ww-cat { repeat(auto-fill, minmax(260px…)) !important } » (≤ 1180) */
  grid-auto-columns: calc((100% - 48px) / 3);
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: 4px;
  padding: 8px 4px 20px; margin: 56px -4px 0; scrollbar-width: none; }
#wrapwrap .ww #ww-accs::-webkit-scrollbar { display: none; }
#wrapwrap .ww #ww-accs > .ww-acc-card { scroll-snap-align: start; }
#wrapwrap .ww #ww-accs:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }
/* 09/11 (Charles : « sur les carrousels, passez les flèches au-dessus et non en dessous ») : la barre est AVANT la rangée, alignée à droite ;
   quand elle est visible, la rangée se rapproche (sinon la rangée garde son écart d'origine sous le titre) — §06 et §04 */
.ww-accs-nav { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 40px; }
#wrapwrap .ww .ww-accs-nav:not([hidden]) + #ww-accs, #wrapwrap .ww .ww-accs-nav:not([hidden]) + .ww-qui { margin-top: 12px; }
/* 10/11 (Charles : « il manque quelque chose pour indiquer qu'il faut défiler », puis « découper à la 3e carte » et « la première un peu
   décalée à droite ») : à l'ordinateur, deux cartes et la moitié de la troisième, coupée au bord de la colonne ; la rangée commence avec un
   retrait de 40 px (24 puis 40, Charles 10/11 ; le défilement se cale dessus) ; tablette : une carte et demie ; téléphone inchangé (une carte et l'amorce de la suivante).
   + compteur « 1–2 sur 5 » à côté des flèches. Pourcentages des pistes = largeur de contenu de la rangée (retrait déduit). */
@media (min-width: 761px) {
  #wrapwrap .ww #ww-accs { padding-left: 44px; scroll-padding-inline: 44px 4px; grid-auto-columns: calc((100% - 48px) / 2.5); }
  /* ombre des cartes (0 16px 40px = 56 px sous la carte) : la rangée défile horizontalement, donc elle coupe ce qui dépasse -> 56 px de marge
     intérieure en bas, compensés par une marge négative (l'espace jusqu'à la suite de la page ne change pas) — Charles 10/11 */
  #wrapwrap .ww #ww-accs { padding-bottom: 56px; margin-bottom: -36px; }   /* retrait 40 px (Charles 10/11 : « augmente encore un peu ») */
  /* Charles 10/11 (« le problème, c'est quand on agrandit la largeur de la page ») : la rangée déborde jusqu'au bord droit de l'ÉCRAN (marge
     négative = marge intérieure ; B = moitié de l'espace hors colonne, barre de défilement déduite par le script) -> la coupe se fait au bord de
     l'écran, plus de vide blanc à droite sur grand écran ; les cartes gardent leur taille (pistes = largeur de la colonne) */
  #wrapwrap .ww #ww-accs, #wrapwrap .ww .ww-qui { --ww-bleed: max(0px, calc((100vw - var(--ww-sbw, 0px) - 100%) / 2)); }
  #wrapwrap .ww #ww-accs { margin-right: calc(-1 * var(--ww-bleed)); padding-right: var(--ww-bleed); }   /* sans les 4 px de l'ombre : sinon 4 px de défilement horizontal */
  /* idem à GAUCHE (Charles 10/11 : « quand on défile, à gauche la coupure est aussi avant la fin de la fenêtre ») : la rangée s'étend jusqu'au
     bord gauche de l'écran ; au repos, la première carte reste à 40 px du titre (marge intérieure = débord + 40 px) */
  #wrapwrap .ww #ww-accs { margin-left: calc(-1 * var(--ww-bleed)); padding-left: calc(var(--ww-bleed) + 44px); }   /* scroll-padding-left exact posé par le script */
  #wrapwrap .ww .ww-qui { margin-right: calc(-1 * var(--ww-bleed)); padding-right: var(--ww-bleed); }
}
@media (min-width: 761px) and (max-width: 1100px) { #wrapwrap .ww #ww-accs { grid-auto-columns: calc((100% - 24px) / 1.5); } }
/* glisser à la souris (10/11) : main ouverte au survol de la rangée, main fermée pendant le glissé ; pendant le glissé, pas de calage
   (il se fait au relâché) ni de sélection de texte */
@media (hover: hover) and (pointer: fine) { #wrapwrap .ww #ww-accs, #wrapwrap .ww .ww-qui { cursor: grab; scroll-snap-type: none; }   /* souris : défilement libre, la rangée reste où on la lâche (10/11) ; flèches recalées par le script */
  /* 10/11 (capture de Charles : voile vert sur la carte) : appuyer puis bouger la souris SÉLECTIONNAIT le texte et l'image avant le seuil du
     glissé -> pas de sélection ni de glisser-déposer natif dans les rangées à la souris (cartes cliquables en entier, rien à copier) */
  #wrapwrap .ww #ww-accs, #wrapwrap .ww .ww-qui { user-select: none; -webkit-user-select: none; }
  #wrapwrap .ww #ww-accs img, #wrapwrap .ww .ww-qui img, #wrapwrap .ww #ww-accs a, #wrapwrap .ww .ww-qui a { -webkit-user-drag: none; } }
#wrapwrap .ww #ww-accs.is-drag, #wrapwrap .ww .ww-qui.is-drag { cursor: grabbing; scroll-snap-type: none; user-select: none; -webkit-user-select: none; }
#wrapwrap .ww #ww-accs.is-drag *, #wrapwrap .ww .ww-qui.is-drag * { cursor: grabbing !important; }
#wrapwrap .ww #ww-accs.is-drag > *, #wrapwrap .ww .ww-qui.is-drag > * { transition: none !important; transform: none !important; box-shadow: none !important; }   /* pas de survol pendant le glissé (10/11 : « pas hyper fluide ») */
#wrapwrap .ww .ww-accs-count { margin-right: 4px; font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; color: var(--text-3); font-variant-numeric: tabular-nums; }
@media (max-width: 760px) { #wrapwrap .ww .ww-accs-count { display: none; } }
.ww-accs-nav[hidden] { display: none !important; }
#wrapwrap .ww .ww-accs-btn { width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 1px solid var(--border-2); background: #fff; color: var(--ink-900);
  display: inline-grid; place-items: center; cursor: pointer; transition: border-color var(--dur-base) var(--ease-out); }
#wrapwrap .ww .ww-accs-btn:hover:not(:disabled) { border-color: var(--ink-900); }
#wrapwrap .ww .ww-accs-btn:disabled { opacity: .35; cursor: default; }
#wrapwrap .ww .ww-accs-btn:focus-visible, #wrapwrap .ww .ww-accs-dot:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }
.ww-accs-dots { display: none; gap: 2px; }
#wrapwrap .ww .ww-accs-dot { width: 24px; height: 24px; border: 0; background: transparent; padding: 0; display: inline-grid; place-items: center; cursor: pointer; }
#wrapwrap .ww .ww-accs-dot::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--ink-300); transition: width var(--dur-base) var(--ease-out); }
#wrapwrap .ww .ww-accs-dot.is-on::before { width: 20px; background: var(--ink-900); }
/* tablette : la règle « une carte et demie » (10/11) est plus haut ; l'ancienne « 2 cartes » (761-1000 px) est retirée, elle masquait l'amorce */
@media (hover: hover) and (min-width: 761px) { .ww .ww-cat .ww-acc-card:nth-child(4):hover { border-color: var(--ink-900) !important; } }
@media (max-width: 760px) {
  #sec-commencer .ww-show-m { display: none !important; }
  #wrapwrap .ww #ww-accs { grid-auto-columns: 86%; gap: 12px; margin-top: 32px; }
  #wrapwrap .ww #ww-accs > .ww-acc-card:not(.is-active) { display: grid !important; }
  .ww-accs-nav { justify-content: center; margin-top: 24px; }
  #wrapwrap .ww .ww-accs-btn { display: none; }
  .ww-accs-dots { display: inline-flex; }
}

/* version anglaise d'une page juridique (phase 2, 05/11) : bandeau « seule la version française fait foi », texte français conservé */
#wrapwrap .ww .ww-lang-note { max-width: 1200px; margin: 24px auto 0; box-sizing: border-box; padding: 12px 16px; border: 1px solid rgba(0, 230, 176, .45); border-radius: 8px;
  background: rgba(0, 230, 176, .08); font-size: 15px; line-height: 1.5; font-weight: 600; }
@media (max-width: 760px) { #wrapwrap .ww .ww-lang-note { margin: 16px 16px 0; } }

/* Vue d'ensemble, « Vos projets en cours » avec 1 ou 2 projets : la carte s'étire à la hauteur de la carte photo (Charles 06/11 : grand vide blanc).
   La place restante = emplacement des prochains projets (Charles 08/11 : « plus léger, sans fond gris, un truc comme + de projets à venir ») :
   pointillés, sans fond ; « + D'autres projets à venir » et le fil Devis -> Commande -> Projet en petit. */
#wrapwrap .ww-dash .dash-how { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; min-height: 96px;
  margin: 16px 26px 26px; padding: 18px 20px; box-sizing: border-box; border: 1.5px dashed var(--border-1); border-radius: 12px; background: transparent; text-align: center; }
#wrapwrap .ww-dash .dash-how__t { display: inline-flex; align-items: center; gap: 8px; }
#wrapwrap .ww-dash .dash-how__t b { font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 700 !important; color: var(--text-2) !important; }
#wrapwrap .ww-dash .dash-how__plus { width: 18px; height: 18px; flex: none; color: var(--text-2); }
#wrapwrap .ww-dash .dash-how__flow { list-style: none; margin: 0 !important; padding: 0 !important; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 6px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .04em; color: var(--text-2); }
#wrapwrap .ww-dash .dash-how__flow li { display: inline-flex; align-items: center; gap: 6px; }
#wrapwrap .ww-dash .dash-how__flow .dash-how__arr { width: 13px; height: 13px; flex: none; color: var(--ink-300); }
@media (max-width: 760px) { #wrapwrap .ww-dash .dash-how { margin: 14px 18px 18px; } }

/* /my/home — contrôle ui-ux-pro-max du 08/11 (Charles : « applique tes corrections sur la home »). Limité à la vue d'ensemble (#dash, id unique à la vue 2374).
   1. Focus clavier : 7 liens texte (« Tous les projets », « Reprendre », « Voir le dossier », « Suivre », « Consulter », « Contacter l'équipe »,
      « Toutes les actualités ») n'avaient aucun repère à la touche Tab -> anneau blanc + vert foncé (green-700 : 4,5:1 sur blanc, contraste du repère ≥ 3:1).
   2. Contraste : le vert des liens et des étiquettes vertes (green-700, #00875F) donnait 4,1 à 4,2:1 sur le fond gris (seuil 4,5) -> green-800 (#006B4C) ;
      étiquette grise « Estimation à ce stade » (text-3, 4,2:1) -> text-2.
   3. Cibles : liens texte de 22 px de haut -> 24 px mini (seuil web WCAG 2.5.8), 44 px au téléphone. */
html body #wrapwrap #dash a.dash-link, html body #wrapwrap #dash .dash-engage a { display: inline-flex; align-items: center; min-height: 24px; }
html body #wrapwrap #dash a.dash-link { color: var(--green-800) !important; }
html body #wrapwrap #dash a.dash-link:focus-visible, html body #wrapwrap #dash .dash-engage a:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-700); border-radius: 6px; }
html body #wrapwrap #dash .dash-eyebrow, html body #wrapwrap #dash .dash-plan__k { color: var(--green-800); }
html body #wrapwrap #dash .dash-callout__k { color: var(--text-2); }
@media (max-width: 760px) { html body #wrapwrap #dash a.dash-link, html body #wrapwrap #dash .dash-engage a { min-height: 44px; } }

/* 08/11 : lien des cartes Exploitants (§04, §06) vers la page /exploitants — texte de lien, la carte du §06 reste cliquable vers la demande d'accès */
#wrapwrap .ww .ww-more { display:inline-flex; align-items:center; gap:6px; min-height:24px; margin-top:12px; font-size:14px; font-weight:700; color:var(--ink-900);
  text-decoration:underline; text-decoration-color:var(--green-500); text-decoration-thickness:2px; text-underline-offset:4px }
#wrapwrap .ww .ww-more:hover { text-decoration-color:var(--ink-900) }
#wrapwrap .ww .ww-more:focus-visible { outline:2px solid var(--green-500); outline-offset:2px; border-radius:2px }

/* pied de page (Charles 10/11 : « workwith. idréva + la phrase ne sont pas centrés entre les traits et le point vert ») : le logo et la phrase
   se centrent dans le cadre en U (point vert au milieu du bas) ; la phrase garde sa largeur de lecture */
/* Charles 10/11 : « retire l'encadrement en bordure blanche et le point vert » -> le centrage entre les traits n'a plus lieu d'être :
   bloc de marque en haut à gauche, comme les autres colonnes et la ligne © du bas */
#wrapwrap .ww .ww-foot .ww-s-fedbf { padding-bottom: 0; justify-content: flex-start; }
#wrapwrap .ww .ww-foot .ww-s-296c9 { padding: 0; justify-items: start; text-align: left; }
/* Charles 10/11 : « réduis un peu le vide noir au-dessus » : 96 -> 64 px en haut du pied de page */
#wrapwrap .ww .ww-foot.ww-s-4d769 { padding-top: 80px; }   /* 96 -> 64 (« réduis un peu le vide »), puis 80 (« un peu trop fin, il manque de force ») */
/* Charles 10/11 : « le footer est devenu un peu trop fin, il manque de force » -> logo et phrase plus présents, bouton « Demander un accès » (l'action du site) */
#wrapwrap .ww .ww-foot .ww-s-c13e3 { height: 32px; }
#wrapwrap .ww .ww-foot .ww-s-0894c { font-size: 17px !important; max-width: 380px; }
#wrapwrap .ww .ww-foot .ww-foot__cta { justify-self: center; margin-top: 6px;   /* Charles 10/11 : « centré dans sa colonne » */
  gap: 10px; text-decoration: none !important; color: var(--ink-900) !important; }

/* §06 · Profil 03 Installateur mis en valeur (Charles 10/11 : « la mettre plus en valeur, c'est un profil important ») : la couleur jaune
   qu'elle portait déjà (bordure 1 px, pastille) devient franche — fond jaune très clair, bouton jaune plein ; bordure fine noire (10/11) ; aucun texte ajouté */
#wrapwrap .ww #acces-installateur { background: var(--yellow-50); border: 1px solid var(--ink-900); box-shadow: var(--shadow-m); }   /* 10/11 : bordure fine noire, plus de bordure ni de halo jaunes (Charles) */
#wrapwrap .ww #acces-installateur .ww-btn--secondary { background: var(--yellow-500) !important; border-color: var(--yellow-500) !important; color: var(--ink-900) !important; }
@media (hover: hover) {
  #wrapwrap .ww #acces-installateur:hover { box-shadow: var(--shadow-l); }
  #wrapwrap .ww #acces-installateur:hover .ww-btn--secondary { background: var(--yellow-600) !important; border-color: var(--yellow-600) !important; }
}

/* §05 « Notre engagement » : photo de l'atelier de production (P06, Charles 10/11) — à gauche le texte et « Nos engagements » ;
   à droite la photo (16:10) et, dessous, les 3 chiffres côte à côte (« la photo prend beaucoup de place, les KPI horizontaux sous la photo ») */
#wrapwrap .ww .ww-eng__more { margin-top: 32px; }
#wrapwrap .ww .ww-eng__r { min-width: 0; }
#wrapwrap .ww .ww-atelier { margin: 0; }
#wrapwrap .ww .ww-atelier img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: 50% 55%; border-radius: 16px; }
#wrapwrap .ww .ww-atelier figcaption { margin-top: 12px; font-family: var(--font-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-400); }
#wrapwrap .ww .ww-eng__r .ww-s-cef28 { margin-top: 28px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
#wrapwrap .ww .ww-eng__r .ww-proof--gl { grid-template-columns: 24px minmax(0, 1fr); grid-template-areas: 'ic num' 'lab lab'; align-items: center; gap: 8px 10px; padding: 2px 0 2px 16px; }
#wrapwrap .ww .ww-eng__r .ww-proof--gl > .ww-gl { grid-area: ic; width: 24px; height: 24px; }
#wrapwrap .ww .ww-eng__r .ww-s-66371 { grid-area: num; font-size: 26px; }
#wrapwrap .ww .ww-eng__r .ww-s-c6e9a { grid-area: lab; font-size: 13px; line-height: 1.4; }
#wrapwrap .ww #sec-engagement { padding-top: 112px; padding-bottom: 112px; }
@media (max-width: 760px) {
  #wrapwrap .ww .ww-atelier img { aspect-ratio: 4 / 3; border-radius: 12px; }
  #wrapwrap .ww .ww-eng__r .ww-s-cef28 { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  #wrapwrap .ww .ww-eng__r .ww-proof--gl { grid-template-columns: 28px auto minmax(0, 1fr); grid-template-areas: 'ic num lab'; gap: 14px; padding-left: 22px; }
  #wrapwrap .ww .ww-eng__r .ww-s-c6e9a { font-size: 14px; }
}

/* Charles 10/11 : « diminue le vide blanc sous la FAQ, le vide noir et le vide blanc ne sont pas égaux » : sous la FAQ (dernière section avant
   le pied de page) = haut du pied de page, 80 px ; au téléphone, la place de la barre collante (76 px) passe SOUS le pied de page (elle était
   entre la FAQ et le pied de page et ne protégeait pas la ligne ©) et seulement sur les pages qui ont cette barre */
#wrapwrap .ww .ww-faq { padding-bottom: 80px; }
@media (max-width: 760px) {
  #wrapwrap .ww-vitrine > section#sec-faq { padding-bottom: 80px !important; }
  #wrapwrap .ww-vitrine { padding-bottom: 0 !important; }
  #wrapwrap:has(.ww-sticky-bar) footer.ww-s-20a2a { padding-bottom: 108px; }
}


/* Héros : la vidéo tutoriel devient l'élément central (Charles 10/11 : « la vidéo, c'est important, un vrai élément central ») — grand bouton de lecture
   sur la photo du héros (« c'est peut-être la photo du héros qu'il faut remplacer par la vidéo ») : la photo sert d'affiche, au clic la vidéo la remplace
   et démarre dans le cadre. Rien ne change tant que data-video est vide */
/* Charles 10/11 : « garder les mêmes dimensions que la photo pour respecter le design » -> au repos, le cadre reste le bandeau 21:8 de la photo ;
   pendant la lecture seulement, il s'agrandit en douceur au format de la vidéo (16:9), sinon l'écran de workwith serait illisible (44 %), puis il revient au bandeau */
#wrapwrap .ww .ww-hero__photo > video { display: block; width: 100%; border-radius: 12px; background: #000; object-fit: cover; }   /* hauteur et fondu pilotés par workwith.js (1,1 s) */
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww .ww-hero__photo > video { transition: none; } }
#wrapwrap .ww .ww-hero__photo { position: relative; }
#wrapwrap .ww .ww-hero__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; display: inline-flex; align-items: center; gap: 16px;
  padding: 10px 26px 10px 10px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: rgba(18, 20, 19, .78); color: #fff; cursor: pointer;
  box-shadow: 0 18px 50px rgba(0,0,0,.45); transition: background .15s ease-out, box-shadow .15s ease-out; text-align: left; white-space: nowrap; }
#wrapwrap .ww .ww-hero__play[data-video=''] { display: none; }
#wrapwrap .ww .ww-hero__play:hover { background: rgba(18, 20, 19, .92); box-shadow: 0 22px 60px rgba(0,0,0,.55); }
#wrapwrap .ww .ww-hero__play:focus { outline: none; } #wrapwrap .ww .ww-hero__play:focus-visible { box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--green-500); }
#wrapwrap .ww .ww-hero__play-ico { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 32px; background: var(--green-500); color: var(--ink-900); flex: none;
  box-shadow: 0 0 0 8px rgba(0, 230, 176, .22); transition: transform .15s ease-out; }
#wrapwrap .ww .ww-hero__play:hover .ww-hero__play-ico { transform: scale(1.06); }
#wrapwrap .ww .ww-hero__play-t { display: grid; gap: 6px; }
#wrapwrap .ww .ww-hero__play-t b { font: 800 20px/1.15 var(--font-sans); letter-spacing: -.01em; }
#wrapwrap .ww .ww-hero__play-t small { font: 500 12px/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-300); }
@media (max-width: 760px) { #wrapwrap .ww .ww-hero__play { gap: 12px; padding: 8px 18px 8px 8px; } #wrapwrap .ww .ww-hero__play-ico { width: 48px; height: 48px; }
  #wrapwrap .ww .ww-hero__play-t b { font-size: 16px; } #wrapwrap .ww .ww-hero__play-t small { font-size: 10px; } }
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww .ww-hero__play, #wrapwrap .ww .ww-hero__play-ico { transition: none; } }

/* ---- §02 · étape « 00 » : vidéo « Suivre son projet » à la place de l'aperçu (Charles 10/11 : « au même endroit que les previews »,
        « une animation d'agrandissement », « une affiche du même type que la A », « la rotation se fait une fois la vidéo lue ») ----
   Au repos : la carte garde la taille des autres aperçus (affiche 16:9 + bandeau des étapes). Pendant la lecture, à l'ordinateur, la carte
   s'élargit sur toute la section en 1,1 s (marge et largeur pilotées par workwith.js) en recouvrant les onglets, qui s'effacent ; retour à la fin. */
#wrapwrap .ww .ww-vcard { position: relative; z-index: 1; width: 100%; margin-left: 0;
  transition: margin-left 1.1s cubic-bezier(.22, .61, .36, 1), width 1.1s cubic-bezier(.22, .61, .36, 1); }
#wrapwrap .ww .ww-vcard__frame { position: relative; flex: none; background: #000; }
#wrapwrap .ww .ww-vcard__poster { display: block; width: 100%; padding: 0; margin: 0; border: 0; border-radius: 0; background: #000; cursor: pointer; }
#wrapwrap .ww .ww-vcard__poster > img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; transition: opacity .2s ease; }
#wrapwrap .ww .ww-vcard__poster:hover > img { opacity: .92; }
#wrapwrap .ww .ww-vcard__poster:focus { outline: none; }
#wrapwrap .ww .ww-vcard__poster:focus-visible { box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 6px var(--green-500); }
#wrapwrap .ww .ww-vcard__video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #000; }
#wrapwrap .ww .ww-vcard__foot { flex: 1 1 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px;
  padding: 16px 24px; background: var(--surface-sunken); border-top: 1px solid var(--border-1); }
#wrapwrap .ww .ww-vcard__steps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
#wrapwrap .ww .ww-vcard__meta { font: 500 12px/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww .ww-vcard__x { margin-left: auto; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 16px;
  background: transparent; color: var(--ink-700); cursor: pointer; }
#wrapwrap .ww .ww-vcard__x[hidden] { display: none; }
#wrapwrap .ww .ww-vcard__x > svg { width: 20px; height: 20px; }
#wrapwrap .ww .ww-vcard__x:hover { background: var(--ink-100); color: var(--ink-900); }
#wrapwrap .ww .ww-vcard__x:focus { outline: none; } #wrapwrap .ww .ww-vcard__x:focus-visible { box-shadow: 0 0 0 2px var(--green-500); }
#wrapwrap .ww #sec-faire .ww-grid2 > .ww-hide-m { transition: opacity .5s ease .5s, visibility 0s linear 0s; }
#wrapwrap .ww #sec-faire .is-vplay > .ww-hide-m { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .35s ease, visibility 0s linear .35s; }
#wrapwrap .ww #sec-faire .is-vplay .ww-vcard__foot { display: none; }
#wrapwrap .ww #sec-faire .is-vplay .ww-vcard__frame { flex: 1 1 auto; display: flex; align-items: center; }   /* pendant l'agrandissement : fond noir sous la vidéo, pas de bande blanche */
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww .ww-vcard, #wrapwrap .ww #sec-faire .ww-grid2 > .ww-hide-m, #wrapwrap .ww #sec-faire .is-vplay > .ww-hide-m { transition: none; } }
#wrapwrap .ww .ww-vcard__lead { display: none; }
@media (max-width: 760px) { #wrapwrap .ww .ww-vcard__foot { flex-direction: column; align-items: flex-start; justify-content: center; gap: 14px; padding: 20px 16px; }
  #wrapwrap .ww .ww-vcard__lead { display: block; margin: 0; font: 400 16px/1.5 var(--font-sans); color: var(--text-2); }
  #wrapwrap .ww .ww-vcard__lead b { font-weight: 800; color: var(--ink-900); }
  #wrapwrap .ww .ww-vcard .ww-s-0cce2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; } }

/* ---- « Pour qui » : trait vertical retiré avec la section « Votre espace » (Charles 10/11 : « il reste un trait vertical au-dessus de la section 3 ») ; 128 px en haut comme les autres sections ---- */
#wrapwrap .ww-vitrine > section#sec-qui { padding-top: 128px; }


/* ===== generated.css ===== */
/* generated.css (genere par gen_body.py, ne pas editer) : ww-t-* = typo et couleurs des liens, gras, titres, paragraphes (important : bat le theme Odoo) ; ww-s-* = tous les autres styles inline du design, factorises en classes partagees */
#wrapwrap .ww .ww-t-f3bc7{color:rgb(255, 255, 255) !important;font-size:56px !important;font-weight:900 !important;letter-spacing:-0.035em !important;line-height:0.96 !important}
#wrapwrap .ww .ww-t-8ec96{color:var(--ink-300) !important;font-size:17px !important;line-height:1.55 !important}
#wrapwrap .ww .ww-t-d11d5{color:var(--ink-500) !important;font-family:var(--font-mono) !important;font-size:12px !important;letter-spacing:0.08em !important}
#wrapwrap .ww .ww-t-64e48{font-size:44px !important;font-weight:900 !important;letter-spacing:-0.035em !important;line-height:1 !important}
#wrapwrap .ww .ww-t-42ed4{color:var(--text-2) !important;font-size:17px !important;line-height:1.55 !important}
#wrapwrap .ww .ww-t-8ac43{font-size:52px !important;letter-spacing:-0.04em !important;line-height:0.95 !important}
#wrapwrap .ww .ww-t-6564a{color:var(--ink-600) !important;font-size:22px !important;letter-spacing:-0.01em !important}
#wrapwrap .ww .ww-t-adc77{font-size:28px !important;letter-spacing:-0.035em !important}
#wrapwrap .ww .ww-t-4b051{font-size:26px !important;font-weight:900 !important;letter-spacing:-0.035em !important;line-height:1.05 !important}
#wrapwrap .ww .ww-t-ea3a9{color:var(--ink-600) !important;font-size:17px !important;line-height:1.4 !important}
#wrapwrap .ww .ww-t-4699d{color:rgb(255, 255, 255) !important;font-size:15px !important;font-weight:700 !important;text-decoration-line:underline !important}
#wrapwrap .ww .ww-t-fe568{font-size:40px !important;font-weight:900 !important;letter-spacing:-0.035em !important;line-height:1 !important}
#wrapwrap .ww .ww-t-51af8{color:var(--text-2) !important;font-size:15px !important;line-height:1.55 !important}
#wrapwrap .ww .ww-t-fbf75{color:rgb(255, 255, 255) !important;font-size:44px !important;font-weight:900 !important;letter-spacing:-0.035em !important;line-height:1 !important}
#wrapwrap .ww .ww-t-7b578{font-size:60px !important;font-weight:900 !important;letter-spacing:-0.04em !important;line-height:0.94 !important}
#wrapwrap .ww .ww-t-6d98d{color:var(--text-2) !important;font-size:18px !important;line-height:1.5 !important}
#wrapwrap .ww .ww-t-9f81c{color:var(--text-2) !important;font-size:15px !important;line-height:1.5 !important}
#wrapwrap .ww .ww-t-6867a{color:var(--ink-300) !important;font-size:15px !important;line-height:1.5 !important}
#wrapwrap .ww .ww-t-173ea{color:var(--ink-300) !important;font-size:15px !important;line-height:1.55 !important}
#wrapwrap .ww .ww-t-32ec2{color:var(--ink-200) !important;font-size:15px !important;text-decoration:none !important}
#wrapwrap .ww .ww-t-237b9{color:var(--ink-200) !important;font-size:15px !important;line-height:1.5 !important}
#wrapwrap .ww .ww-t-704a8{color:rgb(255, 255, 255) !important;font-size:15px !important;font-weight:700 !important;text-decoration:none !important}
#wrapwrap .ww .ww-t-0d01d{color:var(--ink-400) !important;text-decoration:none !important}
#wrapwrap .ww .ww-t-dd404{color:var(--text-2) !important;font-size:14px !important;line-height:1.5 !important}
#wrapwrap .ww .ww-t-fddb5{color:var(--ink-900) !important;font-family:var(--font-sans) !important;font-size:16px !important;font-weight:700 !important;line-height:1 !important;text-decoration:none !important}
#wrapwrap .ww .ww-t-5fac2{color:var(--ink-900) !important;font-family:var(--font-sans) !important;font-size:14px !important;font-weight:700 !important;line-height:1 !important;text-decoration:none !important}
#wrapwrap .ww .ww-s-a599e{position:fixed;left:0px;right:0px;top:0px;height:3px;z-index:80;background:rgba(20, 20, 20, 0.08);pointer-events:none}
#wrapwrap .ww .ww-s-bc084{display:block;height:100%;width:0%;background:var(--green-500);transition:width 0.12s linear}
#wrapwrap .ww .ww-s-93795{position:fixed;left:0px;right:0px;bottom:0px;z-index:80;background:rgba(255, 255, 255, 0.96);border-top:1px solid var(--border-1);padding:12px 16px;gap:10px;box-sizing:border-box;align-items:center}
#wrapwrap .ww .ww-s-512d9{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0px 22px;border-radius:var(--radius-m);border:1px solid var(--ink-300);background:rgb(255, 255, 255);cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-8c46e{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;height:48px;padding:0px 22px;border-radius:var(--radius-m);border:1px solid var(--green-500);background:var(--green-500);cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-691ef{flex:0 0 auto;display:inline-block}
#wrapwrap .ww .ww-s-067e8{background:var(--ink-900);color:rgb(255, 255, 255);padding:0px 64px 128px}
#wrapwrap .ww .ww-s-f63fb{max-width:1200px;margin:0px auto;display:grid;grid-template-columns:minmax(0px, 1fr);justify-items:center}
#wrapwrap .ww .ww-s-82de9{display:block;width:0px;height:96px;border-left:1px solid rgba(255, 255, 255, 0.4)}
#wrapwrap .ww .ww-s-c3863{width:100%;max-width:1120px;display:grid;grid-template-columns:minmax(0px, 1.3fr) minmax(0px, 1fr);gap:48px;align-items:end;margin-top:8px}
#wrapwrap .ww .ww-s-080a8{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-400)}
#wrapwrap .ww .ww-s-b0043{margin-top:16px}
#wrapwrap .ww .ww-s-43bac{color:var(--green-500)}
#wrapwrap .ww .ww-s-f614a{display:grid;gap:16px;padding-bottom:6px}
#wrapwrap .ww .ww-s-5f7ab{text-transform:uppercase}
#wrapwrap .ww .ww-s-29e42{background:var(--surface-sunken);padding:128px 24px;overflow:hidden}
#wrapwrap .ww .ww-s-61185{max-width:1200px;margin:0px auto}
#wrapwrap .ww .ww-s-7dd56{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:48px;align-items:end}
#wrapwrap .ww .ww-s-d193c{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-accent);line-height:1.4}
#wrapwrap .ww .ww-s-00253{margin-top:12px}
#wrapwrap .ww .ww-s-e5bdc{max-width:520px}
#wrapwrap .ww .ww-s-34b91{display:none;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;margin:32px -16px 0px;padding:0px 16px 8px}
#wrapwrap .ww .ww-s-7d10e{cursor:pointer;flex:0 0 auto;scroll-snap-align:start;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0px 14px 0px 12px;border-radius:999px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--ink-200);font-size:15px;font-weight:700;white-space:nowrap}
#wrapwrap .ww .ww-s-85870{width:8px;height:8px;border-radius:4px;background:var(--ink-300);box-shadow:none}
#wrapwrap .ww .ww-s-4b6c8{cursor:pointer;flex:0 0 auto;scroll-snap-align:start;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0px 14px 0px 12px;border-radius:999px;background:var(--ink-900);color:rgb(255, 255, 255);border:1px solid var(--ink-900);font-size:15px;font-weight:700;white-space:nowrap}
#wrapwrap .ww .ww-s-c1a25{width:8px;height:8px;border-radius:4px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 4px}
#wrapwrap .ww .ww-s-724c3{display:grid;grid-template-columns:minmax(0px, 5fr) minmax(0px, 7fr);gap:40px;margin-top:64px;align-items:stretch}
#wrapwrap .ww .ww-s-cba2f{display:grid;align-content:start}
#wrapwrap .ww .ww-s-3b156{cursor:pointer;display:grid;grid-template-columns:24px minmax(0px, 1fr);gap:20px;padding:0px;min-height:88px}
#wrapwrap .ww .ww-s-6ca4a{position:relative;display:block}
#wrapwrap .ww .ww-s-deb1c{position:absolute;left:11px;top:0px;bottom:0px;width:1px;background:var(--ink-300)}
#wrapwrap .ww .ww-s-bf3bc{position:absolute;left:7.75px;top:22px;width:8px;height:8px;border-radius:4px}
#wrapwrap .ww .ww-s-a01a8{display:grid;gap:4px;padding:16px 0px 20px;border-bottom:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-8c8db{display:flex;align-items:baseline;gap:12px}
#wrapwrap .ww .ww-s-35e86{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em}
#wrapwrap .ww .ww-s-2d7a2{font-size:24px;font-weight:900;letter-spacing:-0.025em;line-height:1}
#wrapwrap .ww .ww-s-cae54{font-size:14px;line-height:1.5;color:var(--text-2)}
#wrapwrap .ww .ww-s-ef578{background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-l);border:1px solid var(--border-1);overflow:hidden;display:flex;flex-direction:column;min-height:520px}
#wrapwrap .ww .ww-s-eb8af{height:40px;display:flex;align-items:center;gap:8px;padding:0px 16px;border-bottom:1px solid var(--border-1);background:var(--ink-50)}
#wrapwrap .ww .ww-s-0926d{width:10px;height:10px;border-radius:5px;background:var(--ink-200)}
#wrapwrap .ww .ww-s-0cce2{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--text-3);letter-spacing:0.04em}
#wrapwrap .ww .ww-s-27bf4{flex:1 1 0%;padding:28px;display:grid;gap:18px;align-content:start;background:var(--surface-sunken)}
#wrapwrap .ww .ww-s-6e270{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
#wrapwrap .ww .ww-s-1f7b7{font-family:var(--font-mono);font-size:12px;color:var(--text-3)}
#wrapwrap .ww .ww-s-e77e3{font-size:26px;font-weight:900;letter-spacing:-0.03em;line-height:1.05}
#wrapwrap .ww .ww-s-d95ba{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:12px}
#wrapwrap .ww .ww-s-77f85{border-radius:var(--radius-l);padding:20px;box-sizing:border-box;background:rgb(255, 255, 255);border:1px solid rgba(20, 20, 20, 0.04);box-shadow:var(--shadow-card)}
#wrapwrap .ww .ww-s-b90f4{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-accent);margin-bottom:8px}
#wrapwrap .ww .ww-s-30ec7{font-family:var(--font-sans);font-weight:700;font-size:16px;line-height:1.25;margin-bottom:6px}
#wrapwrap .ww .ww-s-2b529{margin:0px}
#wrapwrap .ww .ww-s-27070{display:flex;gap:6px;flex-wrap:wrap}
#wrapwrap .ww .ww-s-1d883{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0px 10px;border-radius:999px;border:1px solid var(--ink-300);background:rgb(255, 255, 255);color:var(--ink-900);font-family:var(--font-sans);font-weight:700;font-size:12px;letter-spacing:0px;text-transform:none;white-space:nowrap}
#wrapwrap .ww .ww-s-65c0b{background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);display:grid;grid-template-columns:160px minmax(0px, 1fr);overflow:hidden}
#wrapwrap .ww .ww-s-f9207{position:relative;background:var(--ink-900);min-height:160px}
#wrapwrap .ww .ww-s-a16a4{position:absolute;inset:0px;width:100%;height:100%;object-fit:cover;object-position:center 40%}
#wrapwrap .ww .ww-s-9d01e{position:absolute;left:10px;top:10px}
#wrapwrap .ww .ww-s-1b60b{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0px 11px 0px 6.6px;border-radius:999px;border:1px solid var(--ink-900);background:var(--ink-900);color:rgb(255, 255, 255);font-family:var(--font-sans);font-weight:900;font-size:11px;letter-spacing:-0.02em;white-space:nowrap}
#wrapwrap .ww .ww-s-22b55{height:14px;display:block}
#wrapwrap .ww .ww-s-9dc3d{font-size:0.55em;font-weight:700;vertical-align:top;position:relative;top:0.15em;margin-left:1px}
#wrapwrap .ww .ww-s-df326{padding:18px 20px;display:grid;gap:10px}
#wrapwrap .ww .ww-s-5f7d7{font-size:19px;font-weight:700;letter-spacing:-0.02em}
#wrapwrap .ww .ww-s-4a2cb{font-family:var(--font-sans)}
#wrapwrap .ww .ww-s-92968{margin:0px;display:grid;grid-template-columns:repeat(2, minmax(0px, 1fr));column-gap:32px}
#wrapwrap .ww .ww-s-57e8c{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0px;border-bottom:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-693c3{font-size:14px;color:var(--text-2);margin:0px}
#wrapwrap .ww .ww-s-4d82d{margin:0px;font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--ink-900);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
#wrapwrap .ww .ww-s-2e57a{color:var(--text-3);margin-left:4px}
#wrapwrap .ww .ww-s-fac30{margin:0px;font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--ink-900);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
#wrapwrap .ww .ww-s-e0e9e{display:flex;gap:8px;flex-wrap:wrap}
#wrapwrap .ww .ww-s-eae20{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:32px;padding:0px 12px;border-radius:var(--radius-m);border:1px solid var(--yellow-500);background:var(--yellow-500);color:var(--ink-900);font-family:var(--font-sans);font-weight:700;font-size:13px;line-height:1;cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);text-decoration:none;white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-77f92{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:32px;padding:0px 12px;border-radius:var(--radius-m);border:1px solid var(--ink-300);background:rgb(255, 255, 255);color:var(--ink-900);font-family:var(--font-sans);font-weight:700;font-size:13px;line-height:1;cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);text-decoration:none;white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-9162f{display:grid;grid-template-columns:minmax(0px, 1fr) 220px;gap:12px;align-items:start}
#wrapwrap .ww .ww-s-b9ad6{background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);padding:20px;display:grid;gap:14px}
#wrapwrap .ww .ww-s-35e63{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#wrapwrap .ww .ww-s-16eb6{display:grid;gap:6px}
#wrapwrap .ww .ww-s-a3654{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-family:var(--font-sans);font-weight:700;font-size:14px;line-height:1.3;color:var(--ink-900)}
#wrapwrap .ww .ww-s-09284{min-width:0px}
#wrapwrap .ww .ww-s-b3f65{display:flex;align-items:stretch;height:40px;border:1px solid var(--ink-300);border-radius:var(--radius-m);background:rgb(255, 255, 255);box-shadow:none;box-sizing:border-box;overflow:hidden}
#wrapwrap .ww .ww-s-de706{display:inline-flex;align-items:center;padding:0px 10px;font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--text-2);background:var(--ink-50);border-right:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-92250{flex:1 1 0%;min-width:0px;border:0px;outline:0px;background:transparent;padding:0px 12px;font-family:var(--font-mono);font-size:15px;text-align:right;color:var(--ink-900)}
#wrapwrap .ww .ww-s-56bc2{display:inline-flex;align-items:center;padding:0px 12px;font-family:var(--font-mono);font-size:12px;color:var(--text-2);border-left:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-461c6{font-size:13px;color:var(--text-2)}
#wrapwrap .ww .ww-s-3baec{position:relative;height:40px}
#wrapwrap .ww .ww-s-10f76{width:100%;height:100%;appearance:none;border:1px solid var(--ink-300);border-radius:var(--radius-m);background:rgb(255, 255, 255);padding:0px 36px 0px 12px;font-family:var(--font-sans);font-size:15px;color:var(--ink-900);outline:0px;box-shadow:none;box-sizing:border-box;cursor:pointer}
#wrapwrap .ww .ww-s-df0ae{position:absolute;right:10px;top:0px;bottom:0px;display:inline-flex;align-items:center;pointer-events:none;color:var(--text-2)}
#wrapwrap .ww .ww-s-4db44{display:inline-flex;gap:10px;align-items:flex-start;cursor:pointer;opacity:1;font-family:var(--font-sans)}
#wrapwrap .ww .ww-s-3aa98{position:absolute;opacity:0;width:0px;height:0px}
#wrapwrap .ww .ww-s-4cd33{width:20px;height:20px;flex:0 0 auto;margin-top:1px;border-radius:5px;border:1.5px solid var(--ink-900);background:var(--ink-900);color:rgb(255, 255, 255);display:inline-flex;align-items:center;justify-content:center;transition:background var(--dur-fast)}
#wrapwrap .ww .ww-s-a736b{display:grid;gap:2px;min-width:0px}
#wrapwrap .ww .ww-s-c5894{font-size:14px;font-weight:500;color:var(--ink-900);line-height:1.4}
#wrapwrap .ww .ww-s-752a7{background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);padding:20px;display:grid;gap:10px}
#wrapwrap .ww .ww-s-d360b{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-3)}
#wrapwrap .ww .ww-s-0268c{font-family:var(--font-mono);font-size:28px;font-weight:600;letter-spacing:-0.02em}
#wrapwrap .ww .ww-s-09665{font-size:13px;color:var(--text-3)}
#wrapwrap .ww .ww-s-7e8c1{font-size:12px;color:var(--text-3);line-height:1.4}
#wrapwrap .ww .ww-s-3ff03{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;height:32px;padding:0px 12px;border-radius:var(--radius-m);border:1px solid var(--yellow-500);background:var(--yellow-500);color:var(--ink-900);font-family:var(--font-sans);font-weight:700;font-size:13px;line-height:1;cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);text-decoration:none;white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-fbdcf{background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);padding:22px 20px;display:grid;gap:18px}
#wrapwrap .ww .ww-s-60741{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
#wrapwrap .ww .ww-s-57ae1{font-size:16px;font-weight:700}
#wrapwrap .ww .ww-s-973cb{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0px 10px;border-radius:999px;background:var(--status-active-bg);color:var(--status-active-fg);font-family:var(--font-sans);font-weight:700;font-size:12px;white-space:nowrap}
#wrapwrap .ww .ww-s-eb6ea{width:6px;height:6px;border-radius:3px;background:currentcolor;flex:0 0 auto}
#wrapwrap .ww .ww-s-df74e{overflow-x:auto}
#wrapwrap .ww .ww-s-2a398{list-style:none;margin:0px;padding:0px;display:flex;flex-direction:row;gap:0px;font-family:var(--font-sans)}
#wrapwrap .ww .ww-s-de9bf{display:flex;flex-direction:column;flex:1 1 0%;gap:8px;min-width:0px}
#wrapwrap .ww .ww-s-29475{display:flex;align-items:center;flex-direction:row}
#wrapwrap .ww .ww-s-55298{width:24px;height:24px;border-radius:12px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;background:var(--ink-900);border:1.5px solid var(--ink-900);color:rgb(255, 255, 255);font-family:var(--font-mono);font-size:11px;font-weight:600}
#wrapwrap .ww .ww-s-d3fa5{flex:1 1 0%;background:var(--ink-900);height:1.5px;margin:0px 8px;align-self:center}
#wrapwrap .ww .ww-s-06324{padding-bottom:0px;padding-right:12px}
#wrapwrap .ww .ww-s-6db92{font-size:13px;font-weight:500;color:var(--ink-900);line-height:1.3}
#wrapwrap .ww .ww-s-651c0{font-family:var(--font-mono);font-size:11px;color:var(--text-3);margin-top:2px}
#wrapwrap .ww .ww-s-17be1{width:24px;height:24px;border-radius:12px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;background:var(--green-500);border:1.5px solid var(--green-500);color:var(--ink-900);font-family:var(--font-mono);font-size:11px;font-weight:600}
#wrapwrap .ww .ww-s-9c3c8{flex:1 1 0%;background:var(--ink-200);height:1.5px;margin:0px 8px;align-self:center}
#wrapwrap .ww .ww-s-62a41{font-size:13px;font-weight:700;color:var(--ink-900);line-height:1.3}
#wrapwrap .ww .ww-s-2d07a{width:24px;height:24px;border-radius:12px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;background:rgb(255, 255, 255);border:1.5px solid var(--ink-300);color:var(--ink-900);font-family:var(--font-mono);font-size:11px;font-weight:600}
#wrapwrap .ww .ww-s-794f0{font-size:13px;font-weight:500;color:var(--text-3);line-height:1.3}
#wrapwrap .ww .ww-s-66df0{display:flex;flex-direction:column;flex:0 0 auto;gap:8px;min-width:0px}
#wrapwrap .ww .ww-s-44dea{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:var(--radius-m);background:var(--status-info-bg);color:var(--ink-900);font-family:var(--font-sans)}
#wrapwrap .ww .ww-s-d3fdc{color:var(--status-info-fg);display:inline-flex;margin-top:1px}
#wrapwrap .ww .ww-s-349af{flex:1 1 0%;min-width:0px}
#wrapwrap .ww .ww-s-a4729{font-weight:700;font-size:14px;margin-bottom:2px}
#wrapwrap .ww .ww-s-2ea6a{font-size:14px;line-height:1.5;color:var(--ink-700)}
#wrapwrap .ww .ww-s-3dee6{display:grid;gap:12px}
#wrapwrap .ww .ww-s-b95a4{display:flex;justify-content:flex-end}
#wrapwrap .ww .ww-s-01e73{max-width:78%;display:grid;gap:6px}
#wrapwrap .ww .ww-s-54812{font-size:12px;font-weight:700;text-align:right}
#wrapwrap .ww .ww-s-af289{font-family:var(--font-mono);font-weight:400;color:var(--text-3)}
#wrapwrap .ww .ww-s-a58a3{padding:12px 16px;border-radius:12px;background:rgb(255, 255, 255);border:1px solid var(--border-1);font-size:15px;line-height:1.5}
#wrapwrap .ww .ww-s-f7dbb{display:flex}
#wrapwrap .ww .ww-s-dff98{font-size:12px;font-weight:700}
#wrapwrap .ww .ww-s-166a9{padding:12px 16px;border-radius:12px;background:var(--ink-100);font-size:15px;line-height:1.5}
#wrapwrap .ww .ww-s-faaa7{display:flex;gap:8px;align-items:center}
#wrapwrap .ww .ww-s-9cbbe{flex:1 1 0%}
#wrapwrap .ww .ww-s-a31da{display:flex;align-items:center;height:40px;border:1px solid var(--ink-300);border-radius:var(--radius-m);background:rgb(255, 255, 255);box-shadow:none;transition:box-shadow var(--dur-fast), border-color var(--dur-fast);box-sizing:border-box}
#wrapwrap .ww .ww-s-837b3{flex:1 1 0%;min-width:0px;height:100%;border:0px;outline:0px;background:transparent;padding:0px 12px;font-family:var(--font-sans);font-size:15px;color:var(--ink-900);text-align:left}
#wrapwrap .ww .ww-s-55d3d{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0px 16px;border-radius:var(--radius-m);border:1px solid var(--green-500);background:var(--green-500);color:var(--ink-900);font-family:var(--font-sans);font-weight:700;font-size:14px;line-height:1;cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);text-decoration:none;white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-9952d{background:rgb(255, 255, 255);padding:128px 24px 12px;overflow:visible}
#wrapwrap .ww .ww-s-60eec{position:relative;padding-bottom:18px;margin-top:64px}
#wrapwrap .ww .ww-s-2ff38{border-top:0px none rgb(20, 20, 20);border-right:1px solid rgb(20, 20, 20);border-bottom:1px solid rgb(20, 20, 20);border-left:1px solid rgb(20, 20, 20);border-radius:0px 0px 14px 14px;position:absolute;inset:0px;border-top:0px;border-radius:0px 0px 14px 14px;pointer-events:none}
#wrapwrap .ww .ww-s-a2305{position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;border-radius:6px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 6px}
#wrapwrap .ww .ww-s-e009d{margin:0px 18px}
#wrapwrap .ww .ww-s-a14f2{margin:0px auto;max-width:1120px;border-radius:12px;background:rgb(255, 255, 255);box-shadow:var(--shadow-l);border:1px solid var(--border-1);overflow:hidden}
#wrapwrap .ww .ww-s-c3110{position:relative;height:972px;overflow:hidden;background:var(--surface-sunken)}
#wrapwrap .ww .ww-s-81024{position:absolute;left:0px;top:0px;width:1400px;transform:scale(0.8);transform-origin:left top;padding:32px 40px 48px;box-sizing:border-box;pointer-events:none}
#wrapwrap .ww .ww-s-f185f{display:flex;gap:20px;align-items:stretch}
#wrapwrap .ww .ww-s-21fa8{position:relative;flex:0 0 auto;width:1.5px;align-self:stretch;height:auto;background:var(--ink-900);min-height:20px}
#wrapwrap .ww .ww-s-c32fc{position:absolute;top:0px;left:50%;transform:translateX(-50%);width:10px;height:10px;border-radius:50%;background:var(--green-500);box-shadow:none}
#wrapwrap .ww .ww-s-805bd{min-width:0px;flex:1 1 0%}
#wrapwrap .ww .ww-s-4ddbe{white-space:nowrap}
#wrapwrap .ww .ww-s-5371d{margin-top:10px}
#wrapwrap .ww .ww-s-1c113{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:58px;padding:0px 28px;border-radius:var(--radius-m);border:1px solid var(--green-500);background:var(--green-500);color:var(--ink-900);font-family:var(--font-sans);font-weight:700;font-size:17px;line-height:1;cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);text-decoration:none;white-space:nowrap;box-sizing:border-box;box-shadow:var(--shadow-accent);margin-top:8px}
#wrapwrap .ww .ww-s-2d7b1{cursor:pointer;display:flex;align-items:center;gap:16px;padding:22px 20px;background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);box-sizing:border-box;min-width:0px}
#wrapwrap .ww .ww-s-f04b2{display:block;font-weight:700;font-size:17px;letter-spacing:-0.01em;line-height:1.2}
#wrapwrap .ww .ww-s-40e00{display:block;font-size:14px;color:var(--text-2);margin-top:3px;line-height:1.3}
#wrapwrap .ww .ww-s-a092c{border-radius:var(--radius-l);padding:0px;box-sizing:border-box;background:rgb(255, 255, 255);border:1px solid rgba(20, 20, 20, 0.04);box-shadow:var(--shadow-card);display:flex;flex-direction:column}
#wrapwrap .ww .ww-s-33fdb{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 16px;padding:24px 26px 18px}
#wrapwrap .ww .ww-s-61672{cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--green-700);white-space:nowrap}
#wrapwrap .ww .ww-s-bebcd{padding:0px 26px;overflow-x:auto}
#wrapwrap .ww .ww-s-5d940{width:100%;min-width:640px;border-collapse:separate;border-spacing:0px;border:1px solid var(--border-1);border-radius:8px;overflow:hidden}
#wrapwrap .ww .ww-s-c29cd{text-align:left;font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--ink-700);padding:14px 18px;background:var(--ink-50);border-bottom:1px solid var(--border-1);border-left:0px}
#wrapwrap .ww .ww-s-e18c6{text-align:left;font-family:var(--font-sans);font-size:14px;font-weight:500;color:var(--ink-700);padding:14px 18px;background:var(--ink-50);border-bottom:1px solid var(--border-1);border-left:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-dac6d{padding:18px;border-bottom:1px solid var(--border-1);font-size:15px;vertical-align:middle}
#wrapwrap .ww .ww-s-3a6ee{font-weight:700;font-size:16px}
#wrapwrap .ww .ww-s-31a9a{font-size:14px;color:var(--text-2);margin-top:3px}
#wrapwrap .ww .ww-s-e4d77{padding:18px;border-bottom:1px solid var(--border-1);font-size:15px;vertical-align:middle;border-left:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-7ebd0{display:inline-flex;gap:8px;align-items:center}
#wrapwrap .ww .ww-s-aaaf1{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0px 11px 0px 6.6px;border-radius:999px;border:1px solid var(--ink-100);background:var(--ink-100);color:var(--ink-900);font-family:var(--font-sans);font-weight:900;font-size:11px;letter-spacing:-0.02em;white-space:nowrap}
#wrapwrap .ww .ww-s-7ee1b{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
#wrapwrap .ww .ww-s-8c286{width:10px;height:10px;border-radius:5px;background:var(--orange-600);flex:0 0 auto}
#wrapwrap .ww .ww-s-17442{width:10px;height:10px;border-radius:5px;background:var(--green-600);flex:0 0 auto}
#wrapwrap .ww .ww-s-803b5{padding:18px;border-bottom:0px;font-size:15px;vertical-align:middle}
#wrapwrap .ww .ww-s-4e9c4{padding:18px;border-bottom:0px;font-size:15px;vertical-align:middle;border-left:1px solid var(--border-1)}
#wrapwrap .ww .ww-s-a61af{width:10px;height:10px;border-radius:5px;background:var(--ink-500);flex:0 0 auto}
#wrapwrap .ww .ww-s-34e47{background:var(--green-50);border-radius:10px;padding:14px 18px;color:var(--ink-900);margin:20px 26px 26px}
#wrapwrap .ww .ww-s-d8ff9{display:flex;gap:14px;align-items:stretch}
#wrapwrap .ww .ww-s-4e87a{display:flex;gap:14px;align-items:flex-start}
#wrapwrap .ww .ww-s-03406{display:inline-flex;margin-top:2px;color:var(--ink-700)}
#wrapwrap .ww .ww-s-057cf{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-3);margin-bottom:4px}
#wrapwrap .ww .ww-s-23b20{font-size:15px;line-height:1.45;margin-top:0px}
#wrapwrap .ww .ww-s-01551{flex:0 0 auto}
#wrapwrap .ww .ww-s-c1cc5{border-radius:var(--radius-l);padding:0px;box-sizing:border-box;background:rgb(255, 255, 255);border:1px solid rgba(20, 20, 20, 0.04);box-shadow:var(--shadow-card);overflow:hidden;display:flex;flex-direction:column}
#wrapwrap .ww .ww-s-1206b{flex:1 1 0%;min-height:250px;position:relative}
#wrapwrap .ww .ww-s-afd8a{position:absolute;inset:0px;width:100%;height:100%;object-fit:cover;object-position:center 40%;display:block}
#wrapwrap .ww .ww-s-9c510{padding:26px 26px 28px}
#wrapwrap .ww .ww-s-4a909{margin-top:18px}
#wrapwrap .ww .ww-s-2f197{cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--green-700);white-space:nowrap}
#wrapwrap .ww .ww-s-5d1f5{margin-top:40px;margin-bottom:16px}
#wrapwrap .ww .ww-s-4ae04{cursor:pointer;display:flex;align-items:center;gap:16px;padding:18px 20px;background:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);box-sizing:border-box;min-width:0px}
#wrapwrap .ww .ww-s-d95a4{margin-top:20px;border-radius:12px;overflow:hidden;position:relative;height:220px;background:var(--ink-900);box-shadow:var(--shadow-card)}
#wrapwrap .ww .ww-s-935c0{position:absolute;inset:0px;width:100%;height:100%;object-fit:cover;object-position:center 30%}
#wrapwrap .ww .ww-s-b16c9{position:absolute;inset:0px;background:linear-gradient(90deg, rgba(20, 20, 20, 0.94) 0%, rgba(20, 20, 20, 0.78) 38%, rgba(20, 20, 20, 0.15) 70%, rgba(20, 20, 20, 0.05) 100%)}
#wrapwrap .ww .ww-s-9ebc3{position:absolute;left:36px;top:0px;bottom:0px;display:flex;flex-direction:column;justify-content:center;color:rgb(255, 255, 255);max-width:480px}
#wrapwrap .ww .ww-s-ef5bf{font-size:30px;font-weight:900;letter-spacing:-0.035em;line-height:1.05}
#wrapwrap .ww .ww-s-0b46c{font-size:16px;color:var(--ink-300);margin-top:10px}
#wrapwrap .ww .ww-s-00440{display:inline-flex;align-items:center;gap:8px;margin-top:18px;text-decoration-thickness:initial;text-decoration-style:initial;text-decoration-color:var(--green-500);text-underline-offset:5px}
#wrapwrap .ww .ww-s-fef0c{position:absolute;right:36px;top:0px;bottom:0px;display:flex;align-items:center}
#wrapwrap .ww .ww-s-2b375{border-left:2px solid var(--green-500);padding-left:16px;color:rgb(255, 255, 255);font-size:14px;line-height:1.45;max-width:150px;text-shadow:rgba(20, 20, 20, 0.6) 0px 1px 8px}
#wrapwrap .ww .ww-s-6b378{padding:0px 24px 128px}
#wrapwrap .ww .ww-s-6a721{display:grid;justify-items:center;margin-bottom:48px}
#wrapwrap .ww .ww-s-21394{display:block;width:0px;height:112px;border-left:1px solid var(--ink-900)}
#wrapwrap .ww .ww-s-d7e41{margin-top:12px;max-width:720px}
#wrapwrap .ww .ww-s-412af{display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));gap:16px;margin-top:64px}
#wrapwrap .ww .ww-s-a8741{background:var(--ink-50);border-radius:12px;padding:28px 26px;display:grid;gap:10px;align-content:start}
#wrapwrap .ww .ww-s-98011{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--green-700)}
#wrapwrap .ww .ww-s-ae090{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px}
#wrapwrap .ww .ww-s-d5ae7{background:var(--ink-900);color:rgb(255, 255, 255);padding:128px 24px}
#wrapwrap .ww .ww-s-787e3{max-width:1200px;margin:0px auto;display:grid;grid-template-columns:minmax(0px, 1.2fr) minmax(0px, 1fr);gap:56px;align-items:center}
#wrapwrap .ww .ww-s-553a6{margin-top:14px}
#wrapwrap .ww .ww-s-39d37{margin-top:20px;max-width:560px}
#wrapwrap .ww .ww-s-cef28{display:grid;gap:28px}
#wrapwrap .ww .ww-s-5e567{border-left:1px solid rgba(255, 255, 255, 0.35);padding:4px 0px 4px 22px;position:relative;display:grid;grid-template-columns:auto minmax(0px, 1fr);gap:20px;align-items:center}
#wrapwrap .ww .ww-s-9df50{position:absolute;left:-4.5px;top:0px;width:8px;height:8px;border-radius:4px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 4px}
#wrapwrap .ww .ww-s-66371{font-family:var(--font-mono);font-size:36px;font-weight:600;letter-spacing:-0.02em;white-space:nowrap}
#wrapwrap .ww .ww-s-c6e9a{font-size:15px;color:var(--ink-300);line-height:1.45}
#wrapwrap .ww .ww-s-c0590{padding:128px 24px;background:var(--surface-sunken)}
#wrapwrap .ww .ww-s-b4e6b{display:grid;grid-template-columns:minmax(0px, 1.15fr) minmax(0px, 1fr);gap:64px;align-items:end}
#wrapwrap .ww .ww-s-a8009{max-width:480px}
#wrapwrap .ww .ww-s-93259{display:none;margin-top:32px}
#wrapwrap .ww .ww-s-662da{display:flex;gap:4px;border-bottom-width:medium;border-bottom-style:none;border-bottom-color:currentcolor;padding:4px;background:var(--ink-100);border-radius:10px;width:fit-content}
#wrapwrap .ww .ww-s-4f6db{cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:14px;padding:6px 14px;border-radius:7px;border-bottom-width:medium;border-bottom-style:none;border-bottom-color:currentcolor;margin-bottom:0px;transition:color var(--dur-fast)}
#wrapwrap .ww .ww-s-186ae{display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));gap:24px;margin-top:64px;align-items:stretch}
#wrapwrap .ww .ww-s-dbbfb{position:relative;background:rgb(255, 255, 255);color:var(--ink-900);border-radius:12px;box-shadow:var(--shadow-card);padding:28px 26px 30px;display:grid;gap:16px;align-content:start;border:1px solid transparent}
#wrapwrap .ww .ww-s-ac399{display:flex;justify-content:space-between;align-items:center;gap:10px}
#wrapwrap .ww .ww-s-d907e{font-family:var(--font-mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;padding:4px 8px;border-radius:999px;background:var(--ink-100);color:var(--ink-900)}
#wrapwrap .ww .ww-s-e63bf{font-size:26px;font-weight:900;letter-spacing:-0.03em;line-height:1.02}
#wrapwrap .ww .ww-s-0bdd7{display:grid;gap:8px;margin-top:6px;padding-top:14px;border-top:1px solid var(--ink-200)}
#wrapwrap .ww .ww-s-2b0da{display:grid;grid-template-columns:14px minmax(0px, 1fr);gap:10px;align-items:start;font-size:14px;line-height:1.45}
#wrapwrap .ww .ww-s-f1347{width:6px;height:6px;border-radius:3px;background:currentcolor;opacity:0.5;margin-top:7px;margin-left:2px}
#wrapwrap .ww .ww-s-210f8{margin-top:auto;padding-top:10px}
#wrapwrap .ww .ww-s-c9ca4{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;height:40px;padding:0px 16px;border-radius:var(--radius-m);border:1px solid var(--ink-300);background:rgb(255, 255, 255);cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww .ww-s-a0929{position:relative;background:var(--ink-900);color:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);padding:28px 26px 30px;display:grid;gap:16px;align-content:start;border:1px solid var(--ink-900)}
#wrapwrap .ww .ww-s-a9291{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--green-500)}
#wrapwrap .ww .ww-s-da020{font-family:var(--font-mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;padding:4px 8px;border-radius:999px;background:var(--yellow-500);color:var(--ink-900)}
#wrapwrap .ww .ww-s-b7823{display:grid;gap:8px;margin-top:6px;padding-top:14px;border-top:1px solid var(--ink-700)}
#wrapwrap .ww .ww-s-d7208{position:relative;background:rgb(255, 255, 255);color:var(--ink-900);border-radius:12px;box-shadow:var(--shadow-card);padding:28px 26px 30px;display:grid;gap:16px;align-content:start;border:1px solid var(--yellow-500)}
#wrapwrap .ww .ww-s-a3d34{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;margin-top:40px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-3)}
#wrapwrap .ww .ww-s-20a2a{background:var(--ink-900);color:rgb(255, 255, 255);padding:0px 24px 32px}
#wrapwrap .ww .ww-s-4d769{display:grid;grid-template-columns:minmax(0px, 1.4fr) repeat(3, minmax(0px, 1fr));gap:48px;padding:96px 0px 48px;border-bottom:1px solid var(--ink-800)}
#wrapwrap .ww .ww-s-fedbf{position:relative;padding:0px 0px 26px;align-self:stretch;display:flex;flex-direction:column;justify-content:center}
#wrapwrap .ww .ww-s-a1ae7{position:absolute;inset:0px;border-width:0px 1px 1px;border-style:none solid solid;border-color:currentcolor rgba(255, 255, 255, 0.55) rgba(255, 255, 255, 0.55);border-image:initial;border-radius:0px 0px 14px 14px;pointer-events:none}
#wrapwrap .ww .ww-s-296c9{display:grid;gap:20px;align-content:start;padding:0px 24px}
#wrapwrap .ww .ww-s-c13e3{height:26px;display:block;justify-self:start}
#wrapwrap .ww .ww-s-0894c{max-width:360px}
#wrapwrap .ww .ww-s-76f39{display:grid;gap:14px;align-content:start}
#wrapwrap .ww .ww-s-fac02{font-family:var(--font-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-500)}
#wrapwrap .ww .ww-s-436b9{display:flex;gap:10px;margin-top:6px;align-items:center}
#wrapwrap .ww .ww-s-8d7df{height:22px}
#wrapwrap .ww .ww-s-843e0{font-size:13px;font-weight:700}
#wrapwrap .ww .ww-s-9b11a{font-size:0.6em}
#wrapwrap .ww .ww-s-8cdc8{height:22px;margin-left:8px}
#wrapwrap .ww .ww-s-b32a7{display:inline-flex;align-items:center;gap:8px}
#wrapwrap .ww .ww-s-a24f1{font-size:14px;color:var(--ink-400);line-height:1.5;margin-top:6px}
#wrapwrap .ww .ww-s-0f83e{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-top:24px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.06em;color:var(--ink-500)}
#wrapwrap .ww .ww-s-91552{display:flex;gap:24px;flex-wrap:wrap}


/* ===== faq.css ===== */
/* ===== faq.css — §07 Questions fréquentes (handoff Claude Design faq-v1.0, 25/09). CSS du handoff scopé .ww + tokens DS.
   Armor : la base pose h2{font-size !important} et p{font-size/line-height: inherit !important} (contre le thème) → les valeurs
   du design sont réaffirmées avec une spécificité supérieure ; b{color} idem (armor b{color:inherit!important}). ===== */
.ww .ww-faq{padding:128px 24px;background:#fff}
  .ww .ww-faq__in{max-width:1200px;margin:0 auto}
  .ww .ww-faq__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end}
  .ww .ww-faq__eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-700)}
  .ww .ww-faq__title{font-size:44px;font-weight:900;letter-spacing:-.035em;line-height:1;margin:14px 0 0}
  .ww .ww-faq__title b{color:var(--green-500);font-weight:900}
  .ww .ww-faq__lede{font-size:17px;line-height:1.55;color:var(--text-2);max-width:520px;margin:0}

  .ww .ww-faq__list{margin-top:64px;display:grid}
  .ww .ww-faq__item{display:grid;grid-template-columns:24px minmax(0,1fr);gap:20px}
  /* Le fil : trait 1 px ink-300, du premier au dernier point */
  .ww .ww-faq__rail{position:relative}
  .ww .ww-faq__rail::before{content:"";position:absolute;left:11px;top:0;bottom:0;width:1px;background:var(--ink-300)}
  .ww .ww-faq__item:first-child .ww-faq__rail::before{top:34px}
  .ww .ww-faq__item:last-child .ww-faq__rail::before{bottom:calc(100% - 38px)}
  .ww .ww-faq__dot{position:absolute;left:7.75px;top:34px;width:8px;height:8px;border-radius:4px;background:var(--ink-300);transition:all .18s ease-out}
  .ww .ww-faq__item.is-open .ww-faq__dot{background:var(--green-500);box-shadow:0 0 0 5px var(--point-halo)}

  .ww .ww-faq__body{border-bottom:1px solid var(--border-1)}
  .ww .ww-faq__q{margin:0}
  .ww .ww-faq__btn{appearance:none;background:none;border:0;margin:0;font:inherit;text-align:left;cursor:pointer;width:100%;
    display:grid;grid-template-columns:minmax(0,1fr) 24px;gap:16px;align-items:start;min-height:76px;padding:24px 0;color:var(--ink-700)}
  .ww .ww-faq__btn:focus-visible{outline:2px solid var(--green-500);outline-offset:4px;border-radius:4px}
  .ww .ww-faq__line{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:baseline}
  .ww .ww-faq__num{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
  .ww .ww-faq__text{font-size:24px;font-weight:900;letter-spacing:-.025em;line-height:1.15}
  .ww .ww-faq__icon{display:flex;height:28px;align-items:center;justify-content:center}
  .ww .ww-faq__icon svg{width:20px;height:20px}
  .ww .ww-faq__icon .v{transition:opacity .15s ease-out}
  .ww .ww-faq__item.is-open .ww-faq__btn{color:var(--ink-900)}
  .ww .ww-faq__item.is-open .ww-faq__num{color:var(--green-700)}
  .ww .ww-faq__item.is-open .ww-faq__icon .v{opacity:0}

  .ww .ww-faq__a{padding:0 40px 28px 128px;margin-top:-8px}
  .ww .ww-faq__a[hidden]{display:none}
  .ww .ww-faq__a p{margin:0;font-size:16px;line-height:1.6;color:var(--text-2);max-width:680px;text-wrap:pretty}

  @media (max-width:760px){
    .ww .ww-faq{padding:72px 16px}
    .ww .ww-faq__head{grid-template-columns:minmax(0,1fr);gap:16px}
    .ww .ww-faq__title{font-size:36px}
    .ww .ww-faq__btn{gap:12px}
    .ww .ww-faq__line{grid-template-columns:minmax(0,1fr);gap:8px}
    .ww .ww-faq__text{font-size:19px}
    .ww .ww-faq__a{padding:0 0 24px 0;margin-top:0}
  }

/* --- armor (spécificité > base/armor) --- */
#wrapwrap .ww .ww-faq__title { font-size: 44px !important; letter-spacing: -0.035em !important; line-height: 1 !important; font-weight: 900 !important; }
#wrapwrap .ww .ww-faq__title b { color: var(--green-500) !important; font-weight: 900 !important; }
#wrapwrap .ww .ww-faq__lede { font-size: 17px !important; line-height: 1.55 !important; }
#wrapwrap .ww .ww-faq__a p { font-size: 16px !important; line-height: 1.6 !important; }
#wrapwrap .ww .ww-faq__q { margin: 0 !important; }   /* le h3 ne porte pas de texte direct : ses spans fixent leur typo */
/* le prototype rend surtitre et repère en line-height normal (body normal) ; dans le DS ils hériteraient 1.55 / 1.15 → 3 px d'écart */
#wrapwrap .ww .ww-faq__eyebrow, #wrapwrap .ww .ww-faq__num { line-height: normal !important; }
@media (max-width: 760px) {
  #wrapwrap .ww .ww-faq__title { font-size: 36px !important; }
}


/* ===== login.css ===== */
/* ===== login.css — page de connexion /web/login (GENERE par build.py depuis ENTREE/connexion-v1.0, ne pas editer).
   Scope : racine `.ww.ww-login`, descendants `.ww .ww-login__x`, atomes `.ww-login .x` (priment sur les atomes .ww-btn du DS).
   Armor : base h1/h2 (font-size !important), p (inherit !important), a/b (color inherit !important), bootstrap label. ===== */
.ww.ww-login{min-height:100vh;display:flex;flex-direction:column}

  /* Bandeau : retour + logo dans un U inversé */
  .ww .ww-login__bar{position:sticky;top:0;z-index:5;height:68px;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;padding:0 24px;background:var(--ink-900)}
  .ww .ww-login__back{justify-self:start;display:inline-flex;align-items:center;gap:8px;height:40px;margin-bottom:10px;padding:0 12px 0 8px;border-radius:8px;color:var(--ink-300);font-size:14px;font-weight:700;text-decoration:none}
  .ww .ww-login__back:hover{background:var(--ink-800);color:#fff}
  .ww .ww-login__back svg{width:18px;height:18px}
  .ww .ww-login__logo{display:inline-flex;align-items:center;justify-content:center;height:60px;padding:0 28px;border:1px solid rgba(255,255,255,.55);border-bottom:0;border-radius:14px 14px 0 0}
  .ww .ww-login__logo img{height:26px;display:block}

  /* U qui reçoit : cadre + point sous le bord bas */
  .ww .ww-login__stage{flex:1;display:flex;flex-direction:column;padding:0 64px}
  .ww .ww-login__u{position:relative;flex:1;display:flex;flex-direction:column;max-width:1200px;width:100%;margin:0 auto;padding:18px 18px 18px;border:1px solid rgba(255,255,255,.55);border-radius:14px}
  .ww .ww-login__u::after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;border-radius:6px;background:var(--green-500);box-shadow:0 0 0 6px var(--point-halo)}
  .ww .ww-login__card{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 460px;min-height:620px;border-radius:12px;overflow:hidden;background:#fff}

  /* Colonne visuelle */
  .ww .ww-login__visual{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:40px 44px;background:var(--ink-900)}
  .ww .ww-login__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%}
  .ww .ww-login__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,20,.5) 0%,rgba(20,20,20,.25) 40%,rgba(20,20,20,.92) 100%)}
  .ww .ww-login__tags{position:relative;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .ww .ww-login__eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#fff}
  .ww .ww-login__sep{width:1px;height:14px;background:rgba(255,255,255,.4)}
  .ww .ww-login__pills{display:inline-flex;gap:6px;flex-wrap:wrap}
  .ww .ww-login__pill{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-900);background:var(--yellow-500);padding:4px 8px;border-radius:999px}
  .ww .ww-login__copy{position:relative;display:grid;gap:16px;max-width:520px}
  .ww .ww-login__h1{margin:0;font-size:52px;font-weight:900;letter-spacing:-.04em;line-height:.92;color:#fff}
  .ww-login .ww-dot{color:var(--green-500)}
  .ww .ww-login__lede{margin:0;font-size:16px;line-height:1.5;color:var(--ink-200)}
  .ww .ww-login__caption{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400)}

  /* Colonne formulaire */
  .ww .ww-login__formcol{display:flex;align-items:center;justify-content:center;padding:48px 44px;color:var(--ink-900)}
  .ww .ww-login__form{width:100%;max-width:372px;display:grid;gap:28px}
  .ww-login .ww-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-700)}
  .ww .ww-login__h2{margin:10px 0 0;font-size:34px;font-weight:900;letter-spacing:-.035em;line-height:1}
  .ww .ww-login__hint{margin:10px 0 0;font-size:15px;line-height:1.5;color:var(--text-2)}
  .ww-login .ww-fields{display:grid;gap:16px}
  .ww-login .ww-field{display:grid;gap:6px}
  .ww-login .ww-field label{font-size:14px;font-weight:700}
  .ww-login .ww-field label b{color:var(--red-600);font-weight:700}
  .ww-login .ww-input{position:relative}
  .ww-login .ww-input svg{position:absolute;left:12px;top:50%;width:16px;height:16px;margin-top:-8px;color:var(--ink-500);pointer-events:none}
  .ww-login .ww-input input{width:100%;height:40px;padding:0 12px 0 38px;font:inherit;font-size:15px;color:var(--ink-900);background:#fff;border:1px solid var(--border-2);border-radius:8px;outline:none;transition:border-color .15s ease-out,box-shadow .15s ease-out}
  .ww-login .ww-input input:focus{border-color:var(--ink-900);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500)}
  .ww-login .ww-input input[aria-invalid="true"]{border-color:var(--red-600)}
  .ww-login .ww-forgot{display:flex;justify-content:flex-end;font-size:14px}
  .ww-login .ww-alert{display:none;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:8px;background:var(--red-100);color:var(--red-600);font-size:14px;line-height:1.45}
  .ww-login .ww-alert.is-on{display:flex}
  .ww-login .ww-btn{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;font:inherit;font-weight:700;border-radius:8px;text-decoration:none;transition:background .15s ease-out}
  .ww-login .ww-btn:active{transform:translateY(1px)}
  .ww-login .ww-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500)}
  .ww-login .ww-btn svg{width:18px;height:18px}
  .ww-login .ww-btn--accent{height:48px;font-size:16px;background:var(--green-500);color:var(--ink-900);box-shadow:var(--shadow-accent)}
  .ww-login .ww-btn--accent:hover{background:var(--green-600)}
  .ww-login .ww-btn--secondary{height:40px;font-size:15px;background:#fff;color:var(--ink-900);border:1px solid var(--border-2)}
  .ww-login .ww-btn--secondary:hover{background:#F6F6F5}
  .ww .ww-login__signup{border-top:1px solid var(--border-1);padding-top:22px;display:grid;gap:10px}
  .ww .ww-login__signup strong{font-size:15px}
  .ww .ww-login__signup p{margin:0;font-size:14px;line-height:1.5;color:var(--text-2)}

  /* Pied : fil sous le point */
  .ww .ww-login__foot{padding:0 24px 28px;display:flex;flex-direction:column;align-items:center;gap:20px}
  .ww .ww-login__foot::before{content:"";display:block;width:0;height:56px;border-left:1px solid rgba(255,255,255,.4)}
  .ww .ww-login__links{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--ink-500)}
  .ww .ww-login__links a{color:var(--ink-400);text-decoration:none}
  .ww .ww-login__links a:hover{color:#fff}

  @media (max-width:1100px){.ww .ww-login__sep{display:none}.ww .ww-login__tags{flex-direction:column;align-items:flex-start;gap:10px}.ww .ww-login__card{grid-template-columns:minmax(0,1fr) 420px}.ww .ww-login__h1{font-size:44px}}
  @media (max-width:760px){
    .ww .ww-login__back span{display:none}
    .ww .ww-login__stage{padding:0 12px}
    .ww .ww-login__u{padding:12px}
    .ww .ww-login__card{grid-template-columns:minmax(0,1fr);min-height:0}
    /* Mobile : photo au-dessus, texte dessous — jamais de texte sur la photo */
    .ww .ww-login__visual{padding:0 0 32px;gap:20px;justify-content:flex-start}
    .ww .ww-login__img{position:static;height:200px;display:block}
    .ww .ww-login__veil, .ww .ww-login__sep{display:none}
    .ww .ww-login__tags, .ww .ww-login__copy{padding:0 20px}
    .ww .ww-login__h1{font-size:40px}
    .ww .ww-login__formcol{padding:32px 20px 36px}
    .ww-login .ww-input input{height:44px}
    .ww-login .ww-btn--secondary{height:44px}
    .ww .ww-login__links{gap:10px 20px}
    .ww .ww-login__links>*{white-space:nowrap}
  }

/* --- racine : le prototype rend en line-height normal (body sans line-height) et couleur blanche ; le DS hérite 1.55 / encre → mesuré 1 à 3 px d'écart --- */
#wrapwrap .ww.ww-login { line-height: normal; color: #fff; background: var(--ink-900) !important; }   /* la base .ww pose background:var(--surface-page) (blanc) */
#wrapwrap .ww-login footer { position: static !important; }   /* le pied positionné (armor globale) se peindrait par-dessus le point vert sous la carte (cf. page d'accès 26/09) */
/* --- armor (spécificité > base/armor/bootstrap) --- */
#wrapwrap .ww .ww-login__h1 { font-size: 52px !important; letter-spacing: -0.04em !important; line-height: 0.92 !important; font-weight: 900 !important; color: #fff !important; margin: 0 !important; }
#wrapwrap .ww .ww-login__h2 { font-size: 34px !important; letter-spacing: -0.035em !important; line-height: 1 !important; font-weight: 900 !important; margin: 10px 0 0 !important; }
#wrapwrap .ww .ww-login__lede { font-size: 16px !important; line-height: 1.5 !important; }
#wrapwrap .ww .ww-login__hint { font-size: 15px !important; line-height: 1.5 !important; }
#wrapwrap .ww .ww-login__signup p { font-size: 14px !important; line-height: 1.5 !important; }
#wrapwrap .ww-login .ww-field label { margin: 0 !important; display: block; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important; color: inherit !important; }
#wrapwrap .ww-login .ww-forgot a { font-size: 14px !important; }
.ww-login .ww-login__caption-logo { display: inline-block; height: 14px; width: auto; vertical-align: -3px; margin: 0 2px; }   /* logo SolidFit dans la legende, a la hauteur des capitales mono 11 px */
#wrapwrap .ww-login .ww-btn--secondary { font-size: 15px !important; }
#wrapwrap .ww-login .ww-btn--accent { font-size: 16px !important; }
#wrapwrap .ww-login .ww-field label b { color: var(--red-600) !important; }
#wrapwrap .ww .ww-login__back, #wrapwrap .ww .ww-login__links a { text-decoration-line: none !important; }
#wrapwrap .ww .ww-login__back { color: var(--ink-300) !important; }
#wrapwrap .ww .ww-login__back:hover { color: #fff !important; }
#wrapwrap .ww .ww-login__links a { color: var(--ink-400) !important; }
#wrapwrap .ww .ww-login__links a:hover { color: #fff !important; }
#wrapwrap .ww-login .ww-forgot a { color: var(--ink-900) !important; text-decoration-line: underline !important; }
#wrapwrap .ww-login .ww-btn--accent, #wrapwrap .ww-login .ww-btn--secondary { color: var(--ink-900) !important; }
/* message (ex. après réinitialisation) : même bloc, vert */
.ww-login .ww-alert--ok { background: var(--green-100); color: var(--green-700); }
/* auth_signup (vue 2373) injecte « Reset Password » après le bouton : le design a déjà « Mot de passe oublié ? » */
#wrapwrap .ww-login .ww-fields > .d-flex.small, #wrapwrap .ww .ww-login__form > .d-flex.small { display: none !important; }
/* --- armor thème (mesuré live 26/09) : header:not(.modal-header){position:fixed} ≥992, main:not(.modal-body) > *{margin-left:230px!important} (1,3,2),
   ancienne page de connexion : #wrapwrap:has(.oe_website_login_container) > main{display:flex;padding…} et .oe_website_login_container{display:flex;max-width:1000px} --- */
#wrapwrap .ww .ww-login__bar { position: sticky !important; top: 0 !important; left: auto !important; right: auto !important; width: auto !important; height: 68px !important; z-index: 5 !important; }
html body:not(.editor_enable):not(.editor_has_snippets) #wrapwrap .ww main > .ww-login__u { margin-left: auto !important; margin-right: auto !important; margin-top: 0 !important; }
html body:not(.editor_enable):not(.editor_has_snippets) #wrapwrap main > .oe_website_login_container { margin: 0 !important; padding: 0 !important; max-width: none !important; width: 100% !important; display: block !important; background: transparent !important; border-radius: 0 !important; overflow: visible !important; box-shadow: none !important; }
html body:not(.editor_enable):not(.editor_has_snippets) #wrapwrap:has(.oe_website_login_container) > main { display: block !important; padding: 0 !important; margin: 0 !important; min-height: 0 !important; width: auto !important; background: transparent !important; }
@media (max-width: 1100px) { #wrapwrap .ww .ww-login__h1 { font-size: 44px !important; } }
@media (max-width: 760px) { #wrapwrap .ww .ww-login__h1 { font-size: 40px !important; } }

/* --- mot de passe oublie (handoff mot-de-passe-v1.0) : panneaux forgot / sent / new / expired, rendus un seul a la fois par QWeb --- */
.ww .ww-login__links a, .ww .ww-login__links span, .ww .ww-login__pill { white-space: nowrap; }
#wrapwrap .ww-login .ww-rp-back { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; justify-self: start; font-size: 14px !important; font-weight: 700; white-space: nowrap; color: var(--ink-900) !important; text-decoration-line: none !important; }
#wrapwrap .ww-login .ww-rp-back:hover { color: var(--green-700) !important; }
#wrapwrap .ww-login a.ww-btn { text-decoration-line: none !important; }
.ww-login .ww-fielderr { display: none; font-size: 13px; line-height: 1.4; color: var(--red-600); margin-top: 6px; }
.ww-login [data-error="1"] .ww-fielderr { display: block; }
.ww-login [data-error="1"] .ww-input input[aria-invalid="true"] { border-color: var(--red-600); }
.ww-login .ww-thread { position: relative; padding-left: 28px; }
.ww-login .ww-thread::before { content: ""; position: absolute; left: 5px; top: 12px; bottom: 4px; border-left: 1px solid var(--ink-900); }
.ww-login .ww-thread__dot { position: absolute; left: 0; top: 0; width: 12px; height: 12px; border-radius: 6px; background: var(--green-500); box-shadow: 0 0 0 6px rgba(0,230,176,.28); }
#wrapwrap .ww-login .ww-mail { color: var(--ink-900) !important; overflow-wrap: anywhere; }
.ww-login .ww-note { background: var(--ink-50); border-radius: 12px; padding: 16px 18px; display: grid; gap: 6px; font-size: 14px; color: var(--text-2); line-height: 1.5; }
.ww-login .ww-note span { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
.ww-login .ww-panel form { margin: 0; }
.ww-login .ww-panel .ww-btn--secondary { width: 100%; }


/* ===== acces.css ===== */
/* ===== acces.css — page « Demander un acces » /workwith/demande-acces (GENERE par build.py depuis ENTREE/acces-v1.0, ne pas editer).
   Scope : racine `.ww.ww-acc`, descendants `.ww .ww-acc__x`, atomes/balises `.ww-acc .x`. Armor texte auto (armor_from) + armor theme. ===== */
.ww.ww-acc{min-height:100vh;display:flex;flex-direction:column;background:var(--ink-900)}

  /* Bandeau : retour + logo dans un U inversé (identique à la connexion) */
  .ww .ww-acc__bar{position:sticky;top:0;z-index:5;height:68px;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;padding:0 24px;background:var(--ink-900)}
  .ww .ww-acc__back{justify-self:start;display:inline-flex;align-items:center;gap:8px;height:40px;margin-bottom:10px;padding:0 12px 0 8px;border-radius:8px;color:var(--ink-300);font-size:14px;font-weight:700;text-decoration:none}
  .ww .ww-acc__back:hover{background:var(--ink-800);color:#fff}
  .ww .ww-acc__back svg{width:18px;height:18px}
  .ww .ww-acc__logo{display:inline-flex;align-items:center;justify-content:center;height:60px;padding:0 28px;border:1px solid rgba(255,255,255,.55);border-bottom:0;border-radius:14px 14px 0 0}
  .ww .ww-acc__logo img{height:26px;display:block}

  /* U qui reçoit + point */
  .ww .ww-acc__stage{flex:1;display:flex;flex-direction:column;padding:0 64px;background:var(--ink-900)}
  .ww .ww-acc__u{position:relative;flex:1;display:flex;flex-direction:column;max-width:1200px;width:100%;margin:0 auto;padding:18px;border:1px solid rgba(255,255,255,.55);border-radius:14px}
  .ww .ww-acc__u::after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;border-radius:6px;background:var(--green-500);box-shadow:0 0 0 6px var(--point-halo)}
  .ww .ww-acc__page{flex:1;background:#fff;color:var(--ink-900);border-radius:12px;padding:48px 56px 56px}
  .ww .ww-acc__grid{display:grid;grid-template-columns:280px minmax(0,1fr);gap:56px}

  /* Colonne gauche */
  .ww .ww-acc__aside{position:sticky;top:92px;align-self:start}
  .ww-acc .ww-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green-700)}
  .ww .ww-acc__h1{margin:14px 0 0;font-size:48px;font-weight:900;letter-spacing:-.04em;line-height:.94}
  .ww-acc .ww-dot{color:var(--green-500)}
  .ww .ww-acc__lede{margin:16px 0 0;font-size:16px;line-height:1.55;color:var(--text-2)}
  /* Le fil : 3 étapes, trait 1 px encre qui part du point vert */
  .ww-acc .ww-steps{margin-top:32px;display:grid;grid-template-columns:24px minmax(0,1fr);gap:0 16px}
  .ww-acc .ww-steps__rail{position:relative;grid-row:1/4}
  .ww-acc .ww-steps__rail::before{content:"";position:absolute;left:11px;top:6px;bottom:0;border-left:1px solid var(--ink-900)}
  .ww-acc .ww-steps__rail::after{content:"";position:absolute;left:5.5px;top:0;width:12px;height:12px;border-radius:6px;background:var(--green-500);box-shadow:0 0 0 6px var(--point-halo)}
  .ww-acc .ww-step{padding-bottom:22px}
  .ww-acc .ww-step:last-child{padding-bottom:0}
  .ww-acc .ww-step__k{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--text-3)}
  .ww-acc .ww-step__t{font-size:16px;font-weight:700;margin-top:4px;color:var(--text-2)}
  .ww-acc .ww-step:first-of-type .ww-step__t{color:var(--ink-900)}

  /* Formulaire */
  .ww-acc .ww-sec{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);margin:28px 0 12px}
  .ww-acc .ww-sec:first-child{margin-top:0}
  .ww-acc .ww-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border:0;margin:0;padding:0}
  .ww-acc .ww-type{position:relative;display:grid;gap:4px;min-height:44px;padding:14px 16px;border:1px solid var(--border-1);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .15s ease-out,background .15s ease-out}
  .ww-acc .ww-type:hover{border-color:var(--ink-900)}
  .ww-acc .ww-type input{position:absolute;opacity:0;pointer-events:none}
  .ww-acc .ww-type__n{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;color:var(--text-3)}
  .ww-acc .ww-type__l{font-size:17px;font-weight:700}
  .ww-acc .ww-type::after{content:"";position:absolute;top:16px;right:16px;width:10px;height:10px;border-radius:5px;background:transparent;transition:all .15s ease-out}
  .ww-acc .ww-type:has(input:checked){border-color:var(--ink-900);background:var(--ink-50)}
  .ww-acc .ww-type:has(input:checked)::after{background:var(--green-500);box-shadow:0 0 0 5px var(--point-halo)}
  .ww-acc .ww-type:has(input:focus-visible){box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500)}
  .ww-acc .ww-note{margin:10px 0 0;font-size:13px;color:var(--text-3)}
  .ww-acc .ww-g2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .ww-acc .ww-field{display:grid;gap:6px;align-content:start}
  .ww-acc .ww-field label{font-size:14px;font-weight:700}
  .ww-acc .ww-field label b{color:var(--red-600);font-weight:700}
  .ww-acc .ww-field small{font-size:13px;color:var(--text-3)}
  .ww-acc .ww-field small.is-err{color:var(--red-600)}
  .ww-acc .ww-input{position:relative}
  .ww-acc .ww-input svg{position:absolute;left:12px;top:50%;width:16px;height:16px;margin-top:-8px;color:var(--ink-500);pointer-events:none}
  .ww-acc .ww-input input{width:100%;height:40px;padding:0 12px;font:inherit;font-size:15px;color:var(--ink-900);background:#fff;border:1px solid var(--border-2);border-radius:8px;outline:none;transition:border-color .15s ease-out,box-shadow .15s ease-out}
  .ww-acc .ww-input svg+input{padding-left:38px}
  .ww-acc .ww-input input.mono{font-family:var(--font-mono);font-size:14px}
  .ww-acc .ww-input input:focus{border-color:var(--ink-900);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500)}
  .ww-acc .ww-input input[aria-invalid="true"]{border-color:var(--red-600)}
  .ww-acc .ww-check{display:flex;gap:10px;align-items:flex-start;margin-top:20px;font-size:14px;line-height:1.45;color:var(--text-2);cursor:pointer}
  .ww-acc .ww-check input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--ink-900);flex:none}
  .ww-acc .ww-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid var(--ink-200)}
  .ww-acc .ww-actions>span{font-size:13px;color:var(--text-3)}
  .ww-acc .ww-btn{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;border-radius:8px;text-decoration:none;white-space:nowrap;transition:background .15s ease-out}
  .ww-acc .ww-btn:active{transform:translateY(1px)}
  .ww-acc .ww-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500)}
  .ww-acc .ww-btn svg{width:18px;height:18px}
  .ww-acc .ww-btn--accent{height:48px;padding:0 22px;font-size:16px;background:var(--green-500);color:var(--ink-900);box-shadow:var(--shadow-accent)}
  .ww-acc .ww-btn--accent:hover{background:var(--green-600)}
  .ww-acc .ww-btn--accent:disabled{background:var(--ink-200);color:var(--ink-400);box-shadow:none;cursor:not-allowed}
  .ww-acc .ww-btn--secondary{height:40px;padding:0 16px;font-size:15px;background:#fff;color:var(--ink-900);border:1px solid var(--border-2)}
  .ww-acc .ww-btn--secondary:hover{background:var(--ink-50)}
  .ww-acc .ww-btn--ghost{height:40px;padding:0 14px;font-size:15px;background:transparent;color:var(--ink-900)}
  .ww-acc .ww-btn--ghost:hover{background:var(--ink-50)}

  /* Confirmation */
  .ww-acc .ww-sent{display:none}
  .ww-acc.is-sent .ww-form{display:none}
  .ww-acc.is-sent .ww-sent{display:block}
  .ww-acc .ww-sent h2{margin:10px 0 0;font-size:34px;font-weight:900;letter-spacing:-.035em;line-height:1}
  .ww-acc .ww-sent p{margin:12px 0 0;font-size:16px;line-height:1.5;color:var(--text-2);max-width:620px}
  .ww-acc .ww-sent b{color:var(--ink-900)}
  .ww-acc .ww-ref{font-family:var(--font-mono);font-size:14px;color:var(--ink-900)}
  .ww-acc .ww-track{margin:24px 0 0;padding:0;display:grid;gap:0;max-width:420px}
  .ww-acc .ww-track li{list-style:none;position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);gap:16px;padding-bottom:20px}
  .ww-acc .ww-track li:last-child{padding-bottom:0}
  .ww-acc .ww-track li::before{content:"";position:absolute;left:11px;top:14px;bottom:0;border-left:1px solid var(--ink-300)}
  .ww-acc .ww-track li:last-child::before{display:none}
  .ww-acc .ww-track i{position:relative;z-index:1;width:12px;height:12px;margin:4px 0 0 6px;border-radius:6px;border:1px solid var(--ink-300);background:#fff}
  .ww-acc .ww-track .done i{background:var(--ink-900);border-color:var(--ink-900)}
  .ww-acc .ww-track .cur i{background:var(--green-500);border-color:var(--green-500);box-shadow:0 0 0 5px var(--point-halo)}
  .ww-acc .ww-track strong{display:block;font-size:16px}
  .ww-acc .ww-track span{font-family:var(--font-mono);font-size:12px;color:var(--text-3)}
  .ww-acc .ww-track ul{margin:0;padding:0}
  .ww-acc .ww-sent__btns{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}

  /* Pied : fil sous le point */
  .ww .ww-acc__foot{background:var(--ink-900);padding:0 24px 28px;display:flex;flex-direction:column;align-items:center;gap:20px}
  .ww .ww-acc__foot::before{content:"";display:block;width:0;height:56px;border-left:1px solid rgba(255,255,255,.4)}
  .ww .ww-acc__links{display:flex;gap:24px;flex-wrap:wrap;justify-content:center;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--ink-500)}
  .ww .ww-acc__links a{color:var(--ink-400);text-decoration:none}
  .ww .ww-acc__links>*{white-space:nowrap}
  .ww .ww-acc__links a:hover{color:#fff}

  @media (max-width:1100px){
    .ww .ww-acc__grid{grid-template-columns:minmax(0,1fr);gap:40px}
    .ww .ww-acc__aside{position:static}
    .ww-acc .ww-steps{display:none}
  }
  @media (max-width:760px){
    .ww .ww-acc__back span{display:none}
    .ww .ww-acc__stage{padding:0 12px}
    .ww .ww-acc__u{padding:12px}
    .ww .ww-acc__page{padding:28px 20px 0}
    .ww .ww-acc__grid{gap:28px}
    .ww .ww-acc__h1{font-size:36px}
    /* Mobile : sélecteur segmenté à la place des cartes */
    .ww-acc .ww-types{gap:0;border:1px solid var(--border-2);border-radius:10px;overflow:hidden}
    .ww-acc .ww-type{border:0;border-radius:0;padding:10px 6px;text-align:center;min-height:56px;align-content:center;gap:2px}
    .ww-acc .ww-type+.ww-type{border-left:1px solid var(--border-2)}
    .ww-acc .ww-type__l{font-size:14px}
    .ww-acc .ww-type::after{top:8px;right:8px;width:8px;height:8px}
    .ww-acc .ww-type:has(input:checked){background:var(--ink-900);color:#fff}
    .ww-acc .ww-type:has(input:checked) .ww-type__n{color:var(--ink-300)}
    .ww-acc .ww-g2{grid-template-columns:minmax(0,1fr)}
    .ww-acc .ww-input input{height:44px}
    /* Action principale collante en bas */
    .ww-acc .ww-actions{position:sticky;bottom:0;margin:24px -20px 0;padding:12px 20px 16px;background:#fff;border-top:1px solid var(--border-1);border-radius:0 0 12px 12px;z-index:4}
    .ww-acc .ww-actions>span{display:none}
    .ww-acc .ww-actions .ww-btn{width:100%}
    .ww-acc .ww-sent{padding-bottom:28px}
    .ww-acc .ww-sent h2{font-size:30px}
    .ww-acc .ww-sent__btns .ww-btn{flex:1 1 100%;height:44px}
    .ww .ww-acc__links{gap:10px 20px}
    .ww .ww-acc__links>*{white-space:nowrap}
  }

/* --- armor texte (valeurs du handoff reaffirmees) --- */
#wrapwrap .ww .ww-acc__h1 { margin:14px 0 0 !important; font-size:48px !important; font-weight:900 !important; letter-spacing:-.04em !important; line-height:.94 !important; }
#wrapwrap .ww .ww-acc__lede { margin:16px 0 0 !important; font-size:16px !important; line-height:1.55 !important; color:var(--text-2) !important; }
#wrapwrap .ww-acc .ww-sent h2 { margin:10px 0 0 !important; font-size:34px !important; font-weight:900 !important; letter-spacing:-.035em !important; line-height:1 !important; }
#wrapwrap .ww-acc .ww-sent p { margin:12px 0 0 !important; font-size:16px !important; line-height:1.5 !important; color:var(--text-2) !important; }
#wrapwrap .ww-acc .ww-note { margin:10px 0 0 !important; font-size:13px !important; color:var(--text-3) !important; }
#wrapwrap .ww-acc .ww-step__k { font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.12em !important; color:var(--text-3) !important; }
#wrapwrap .ww-acc .ww-step__t { font-size:16px !important; font-weight:700 !important; margin-top:4px !important; color:var(--text-2) !important; }
#wrapwrap .ww-acc .ww-field label { font-size:14px !important; font-weight:700 !important; }
#wrapwrap .ww-acc .ww-check { margin-top:20px !important; font-size:14px !important; line-height:1.45 !important; color:var(--text-2) !important; }
#wrapwrap .ww .ww-acc__back { margin-bottom:10px !important; color:var(--ink-300) !important; font-size:14px !important; font-weight:700 !important; text-decoration:none !important; }
#wrapwrap .ww .ww-acc__links { font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.06em !important; color:var(--ink-500) !important; }
#wrapwrap .ww .ww-acc__links a { color:var(--ink-400) !important; text-decoration:none !important; }
#wrapwrap .ww-acc .ww-btn { font-weight:700 !important; text-decoration:none !important; }
#wrapwrap .ww-acc .ww-btn--accent { font-size:16px !important; color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-btn--secondary { font-size:15px !important; color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-btn--ghost { font-size:15px !important; color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-type__l { font-size:17px !important; font-weight:700 !important; }
#wrapwrap .ww-acc .ww-type__n { font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.12em !important; color:var(--text-3) !important; }
#wrapwrap .ww-acc .ww-sec { font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.12em !important; text-transform:uppercase !important; color:var(--text-3) !important; margin:28px 0 12px !important; }
#wrapwrap .ww-acc .ww-eyebrow { font-family:var(--font-mono) !important; font-size:12px !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--green-700) !important; }
#wrapwrap .ww-acc .ww-actions>span { font-size:13px !important; color:var(--text-3) !important; }
#wrapwrap .ww-acc .ww-ref { font-family:var(--font-mono) !important; font-size:14px !important; color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-input input { font-size:15px !important; color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-step:first-of-type .ww-step__t { color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-sent b { color:var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-input input.mono { font-family:var(--font-mono) !important; font-size:14px !important; }
@media (max-width:760px){ #wrapwrap .ww .ww-acc__h1 { font-size:36px !important; } #wrapwrap .ww-acc .ww-sent h2 { font-size:30px !important; } #wrapwrap .ww-acc .ww-type__l { font-size:14px !important; } #wrapwrap .ww-acc .ww-type:has(input:checked) .ww-type__n { color:var(--ink-300) !important; } }

/* --- racine : prototype en line-height normal / blanc / fond encre (le DS herite 1.55, encre, fond blanc) --- */
#wrapwrap .ww.ww-acc { line-height: normal; color: #fff; background: var(--ink-900) !important; --text-3: var(--ink-400); }  /* le handoff acces pose --text-3:#9A9A98 (= ink-400) la ou le DS landing pose ink-500 : override de page, a signaler a Claude Design */
/* --- armor theme (mesure live 26/09 sur /web/login) : header:not(.modal-header){position:fixed} >=992, main > *{margin-left:230px!important} --- */
#wrapwrap .ww .ww-acc__bar { position: sticky !important; top: 0 !important; left: auto !important; right: auto !important; width: auto !important; height: 68px !important; z-index: 5 !important; }
html body:not(.editor_enable):not(.editor_has_snippets) #wrapwrap .ww main > .ww-acc__u { margin-left: auto !important; margin-right: auto !important; margin-top: 0 !important; }
#wrapwrap .ww-acc .ww-field label, #wrapwrap .ww-acc .ww-type { margin: 0 !important; }  #wrapwrap .ww-acc .ww-check { margin-bottom: 0 !important; }   /* bootstrap label{margin-bottom} ; .ww-check garde son margin-top:20px (armor) */
#wrapwrap .ww-acc label { font-weight: 400 !important; }   /* theme : form label{font-weight:700} ; les labels de champ (.ww-field label, plus specifiques) restent en 700 */
#wrapwrap .ww-acc .ww-type { display: grid !important; }
#wrapwrap .ww-acc .ww-check { display: flex !important; }
#wrapwrap .ww-acc .ww-field label b { color: var(--red-600) !important; }
.ww-acc .ww-sec b { color: var(--red-600); font-weight: inherit; }  #wrapwrap .ww-acc .ww-sec b { color: var(--red-600) !important; }   /* asterisque « Votre accès * » (choix obligatoire) */
#wrapwrap .ww .ww-acc__back, #wrapwrap .ww .ww-acc__links a, #wrapwrap .ww-acc .ww-btn, #wrapwrap .ww-acc .ww-type { text-decoration-line: none !important; }
#wrapwrap .ww .ww-acc__back { color: var(--ink-300) !important; }  #wrapwrap .ww .ww-acc__back:hover { color: #fff !important; }
#wrapwrap .ww .ww-acc__links a { color: var(--ink-400) !important; }  #wrapwrap .ww .ww-acc__links a:hover { color: #fff !important; }
#wrapwrap .ww-acc .ww-btn--accent, #wrapwrap .ww-acc .ww-btn--secondary, #wrapwrap .ww-acc .ww-btn--ghost { color: var(--ink-900) !important; }
#wrapwrap .ww-acc .ww-btn:disabled { color: var(--ink-400) !important; }
#wrapwrap .ww-acc small.is-err, #wrapwrap .ww-acc .ww-srv-err { color: var(--red-600) !important; }
/* le pied de page (fond encre) est positionné par l'armor globale `#wrapwrap .ww footer{position:relative}` : il se peint PAR-DESSUS le point vert
   qui déborde de 6 px sous la carte (Charles 26/09 : « le point vert en bas est coupé »). Même cause que le hero de la landing (25/09) : statique comme le handoff. */
#wrapwrap .ww-acc footer { position: static !important; }
.ww-acc .ww-srv-err[hidden] { display: none; }
/* 08/11 : 4 types d'accès (Bureau d'études ajouté) ; 09/11 : 5 types (Collectivité ajoutée). Au-delà de 760 px les types sont des CARTES
   (bordure chacune, écart 12 px) : seule la grille change -> au-delà de 900 px, 3 + 2 sur une grille de 6 ; de 761 à 900 px, 2 colonnes, le 5e
   sur toute la largeur. Jusqu'à 760 px, sélecteur SEGMENTÉ (handoff) en 2 colonnes : traits entre les cases, le 5e sur toute la largeur. */
.ww-acc .ww-types { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.ww-acc .ww-type { grid-column: span 2; }
.ww-acc .ww-type:nth-child(n+4) { grid-column: span 3; }
@media (max-width:900px){ .ww-acc .ww-types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ww-acc .ww-type, .ww-acc .ww-type:nth-child(n+4) { grid-column: auto; } .ww-acc .ww-type:nth-child(5) { grid-column: 1 / -1; } }
@media (max-width:760px){ .ww-acc .ww-type + .ww-type { border-left: 0; }
  .ww-acc .ww-type:nth-child(2n) { border-left: 1px solid var(--border-2); } .ww-acc .ww-type:nth-child(n+3) { border-top: 1px solid var(--border-2); } }


/* ===== nav.css ===== */
/* ===== nav.css — navigation de la plateforme connectée (handoff navigation-v1.0, 26/09) : sidebar fixe 288 px, méga-menus, barre du haut
   (fil d'Ariane + cloche), tiroir mobile plein écran (< 1100 px). Adapté du CSS du prototype au DOM Odoo :
   #wrapwrap > header(masqué) + nav.ww-nav + header.ww-top + .ww-mega ×3 + main + footer. Armor : thème a{color:#000!important;
   text-decoration:none!important}, b{color:#000!important}, p/h2 !important, main > *{margin-left:230px!important}, #footer{padding-left}. ===== */
:root { --side-w: 288px; --top-h: 64px; }
.ww-nav svg.i, .ww-top svg.i, .ww-mega svg.i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ww-nav svg.i--16, .ww-top svg.i--16, .ww-mega svg.i--16 { width: 16px; height: 16px; }
.ww-nav svg.i--18, .ww-top svg.i--18, .ww-mega svg.i--18 { width: 18px; height: 18px; }
.ww-nav svg.i--22, .ww-top svg.i--22, .ww-mega svg.i--22 { width: 22px; height: 22px; }
.ww-pub svg.i--22, .ww-pub-panel svg.i--22 { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
/* liens : le thème pose a{color:#000!important} ; le prototype les met en encre (sans effet visible dans la sidebar, sauf parité) */
#wrapwrap .ww-nav a, #wrapwrap .ww-top a, #wrapwrap .ww-mega a { color: var(--ink-900) !important; }
.ww-nav .sr, .ww-mega .sr, .ww-pub .sr, .ww-pub-panel .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ww-nav button, .ww-top button, .ww-mega button { font: inherit; }

/* ---- LOT A · sidebar ---- */
#wrapwrap > .ww-nav { position: fixed; left: 0; top: 0; z-index: 60; width: var(--side-w); height: 100vh; overflow-y: auto; overflow-x: hidden; margin: 0; padding: 24px 16px 16px; box-sizing: border-box; background: var(--ink-900); color: #fff; display: flex; flex-direction: column; font-family: var(--font-sans); font-size: 16px; line-height: normal; -webkit-font-smoothing: antialiased; }
#wrapwrap > .ww-nav *, #wrapwrap > .ww-nav *::before, #wrapwrap > .ww-nav *::after { box-sizing: border-box; }
.ww-nav__head { position: relative; height: 52px; display: flex; align-items: center; justify-content: center; padding: 0 8px; }
.ww-nav__logo { display: inline-flex; }
.ww-nav__logo img { height: 52px; width: auto; display: block; }   /* handoff 44px ; Charles 26/09 : « agrandis un peu le logo » -> +18 % (ecart n°14) */
.ww-nav__close { display: none; position: absolute; right: -4px; top: 0; width: 44px; height: 44px; border: 0; border-radius: 8px; background: transparent; color: #fff; cursor: pointer; align-items: center; justify-content: center; font: inherit; }
.ww-nav__close:hover { background: var(--ink-800); }
.ww-company { margin-top: 24px; padding: 12px 14px; border-radius: 8px; background: var(--ink-800); display: flex; align-items: center; gap: 12px; min-width: 0; }
.ww-company__id { min-width: 0; flex: 1; display: grid; gap: 4px; }
.ww-company__k { font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-400); }
/* nom sur 2 lignes au plus (handoff espace-reserve-v1.0 : « Hydro Normandie / Distribution ») */
.ww-company__v { font-size: 14px; font-weight: 700; line-height: 1.25; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
/* logo de la societe (miniature de la fiche contact Odoo), a gauche — Charles 29/09 : « dans un rond » ; fond blanc (logos sombres ou
   transparents lisibles sur l'encre) ; 40 px, marge 4 px : un logo large (Tecnipul, Veolia) tient dans le cercle, teste en ligne.
   Sans logo : monogramme (2 initiales de la societe), meme rond (handoff espace-reserve-v1.0 §1, 10/10). */
.ww-company__mk { flex: none; width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--ink-900); display: inline-flex; align-items: center; justify-content: center; overflow: hidden;
  font-family: var(--font-sans); font-size: 14px; font-weight: 700; letter-spacing: .02em; box-shadow: 0 0 0 2px rgba(255, 255, 255, .08); }
.ww-company__mk img { width: 100%; height: 100%; padding: 4px; object-fit: contain; display: block; }
.ww-sections { flex: 1; display: grid; gap: 28px; align-content: start; margin-top: 32px; }
.ww-sec__t { height: 20px; white-space: nowrap; display: flex; align-items: center; gap: 8px; padding: 0 8px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-400); }
.ww-sec__t i { font-style: normal; color: var(--ink-600); }
.ww-sec__list { display: grid; margin: 8px 0 0; padding: 0; list-style: none; }
/* item : colonne 24 px = le fil (1,5 px) + le point actif ; puis la zone cliquable */
.ww-item { all: unset; box-sizing: border-box; cursor: pointer; width: 100%; height: 44px; display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: stretch; color: var(--ink-300); font-size: 15px; font-weight: 500; border-radius: 8px; }
#wrapwrap .ww-nav a.ww-item, #wrapwrap .ww-nav button.ww-item { color: var(--ink-300) !important; text-decoration: none !important; }
.ww-item__rail { position: relative; display: block; }
.ww-item__rail::before { content: ""; position: absolute; left: 11px; top: 0; bottom: 0; width: 1.5px; background: rgba(255,255,255,.28); }
.ww-item__rail::after { content: ""; position: absolute; left: 7.75px; top: 18px; width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo); opacity: 0; transition: opacity .16s ease-out; }
.ww-item__body { display: flex; align-items: center; gap: 12px; padding: 0 8px 0 10px; min-width: 0; border-radius: 8px; transition: background .12s ease-out; }
.ww-item:hover .ww-item__body { background: var(--ink-800); }
.ww-item:focus-visible .ww-item__body { box-shadow: 0 0 0 2px var(--green-500); }
.ww-item__l { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ww-item__n { font-family: var(--font-mono); font-size: 12px; color: var(--ink-300); }
.ww-item__chev { color: var(--ink-600); transition: transform .16s ease-out, color .16s ease-out; }
#wrapwrap .ww-nav .ww-item[aria-current="page"], #wrapwrap .ww-nav .ww-item[aria-expanded="true"] { color: #fff !important; font-weight: 700; }
.ww-item[aria-current="page"] .ww-item__rail::after, .ww-item[aria-expanded="true"] .ww-item__rail::after { opacity: 1; }
.ww-item[aria-expanded="true"] .ww-item__chev { color: #fff; transform: translateX(2px); }
/* chiffrage en cours = le panier website (hooks #my_cart / .my_cart_quantity conservés pour le compteur AJAX) ;
   dashboard v1.1 : rouvrir un brouillon = jaune PRO (contour, libellé, flèche) ; v1.2 : le point aussi */
#wrapwrap .ww-nav a.ww-draft { margin-top: 24px; display: grid; grid-template-columns: minmax(0, 1fr) 20px; gap: 2px 10px; align-items: center; margin-bottom: 16px; padding: 12px 14px; border-radius: 8px; border: 1px solid rgba(236,242,46,.5); color: #fff !important; text-decoration: none !important; transition: border-color .16s ease-out, background .16s ease-out; }
.ww-draft:hover { border-color: var(--yellow-500); background: var(--ink-800); }
.ww-draft__k { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--yellow-500); }
.ww-draft__k::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--yellow-500); box-shadow: 0 0 0 4px rgba(236,242,46,.28); }   /* dashboard v1.2 : point jaune (carte entièrement jaune PRO) */
.ww-draft svg { color: var(--yellow-500); }
.ww-draft__n { grid-column: 1 / 3; margin-top: 4px; font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ww-draft__m { grid-column: 1 / 3; font-size: 12px; color: var(--ink-400); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ww-draft .my_cart_quantity { display: none; }
.ww-foot { border-top: 1px solid var(--ink-800); padding-top: 8px; }
.ww-user { height: 48px; display: flex; align-items: center; gap: 10px; padding: 0 4px 0 8px; }
.ww-user__av { width: 28px; height: 28px; border-radius: 14px; background: #fff; color: var(--ink-900); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; flex: none; }
.ww-user__id { flex: 1; min-width: 0; display: grid; line-height: 1.2; }
#wrapwrap .ww-nav .ww-user__id b { font-size: 13px; color: #fff !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ww-user__id span { font-size: 11px; color: var(--ink-400); }
#wrapwrap .ww-nav a.ww-ico { width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-400) !important; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none !important; }
#wrapwrap .ww-nav a.ww-ico:hover { background: var(--ink-800); color: #fff !important; }
.ww-sign { display: flex; align-items: center; justify-content: center; height: 40px; margin-top: 8px; padding: 0 8px; border-top: 1px solid var(--ink-800); text-decoration: none; }
.ww-sign img { height: 16px; width: auto; display: block; opacity: .85; }
/* invité (provisoire, Charles 26/09 : « on verra ça plus tard ») : catalogue + guides, puis les deux entrées de l'entonnoir */
.ww-foot--guest { display: grid; gap: 8px; padding-top: 16px; }
#wrapwrap .ww-nav .ww-foot--guest .ww-btn { height: 40px; justify-content: center; text-decoration: none !important; }
#wrapwrap .ww-nav .ww-foot--guest .ww-btn--ghost { color: #fff !important; border: 1px solid var(--ink-600) !important; background: transparent !important; }
#wrapwrap .ww-nav .ww-foot--guest .ww-btn--accent { color: var(--ink-900) !important; }

/* ---- LOT B · méga-menus (fixés à droite de la sidebar ; un seul ouvert) ---- */
#wrapwrap > .ww-mega { position: fixed; top: 0; bottom: 0; left: var(--side-w); z-index: 70; display: none; align-items: flex-start; padding: 16px; pointer-events: none; margin: 0; font-family: var(--font-sans); line-height: normal; }
#wrapwrap > .ww-mega.is-open { display: flex; }
.ww-mega__panel { pointer-events: auto; width: 720px; max-width: calc(100vw - var(--side-w) - 32px); max-height: calc(100vh - 32px); overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; background: #fff; border-radius: 14px; box-shadow: var(--shadow-l); border: 1px solid rgba(20,20,20,.06); padding: 28px; animation: ww-in .16s ease-out; color: var(--ink-900); box-sizing: border-box; }
@keyframes ww-in { from { opacity: 0; transform: translateX(-6px); } to { opacity: 1; transform: none; } }
.ww-mega__back { display: none; }
.ww-mega__head { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 22px; }
.ww-mega__head > div { flex: 1; min-width: 0; }
#wrapwrap .ww-mega h2.ww-mega__t { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 24px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1.05 !important; color: var(--ink-900) !important; }
.ww-mega__t i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-mega p.ww-mega__d { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
.ww-mega__x { width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-600); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font: inherit; }
.ww-mega__x:hover { background: var(--ink-50); }
.ww-mega__cols { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 28px; }
.ww-mega__ct { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); padding-bottom: 10px; margin-bottom: 8px; border-bottom: 1px solid var(--border-1); }
.ww-mega__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.ww-mega__a, #wrapwrap .ww-mega a.ww-mega__a { display: flex; gap: 12px; align-items: flex-start; padding: 9px 10px; margin: 0 -10px; border-radius: 8px; min-width: 0; color: var(--ink-900) !important; text-decoration: none !important; }
a.ww-mega__a:hover { background: var(--ink-50); }
.ww-mega__a--empty { cursor: default; }
.ww-mega__a:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--green-500); }
.ww-mega__a .i { color: var(--ink-700); margin-top: 1px; }
.ww-mega__a > span { min-width: 0; flex: 1; display: grid; gap: 2px; }
#wrapwrap .ww-mega .ww-mega__a b { font-size: 15px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-mega .ww-mega__a small { font-size: 13px !important; line-height: 1.35 !important; color: var(--text-2) !important; }
/* espace reserve (handoff espace-reserve-v1.0) : entree mise en avant (fond jaune clair) + pastille « Reserve » noire a point jaune */
#wrapwrap .ww-mega a.ww-mega__a--res { background: #F8FAD2; }
#wrapwrap .ww-mega a.ww-mega__a--res:hover { background: #F2F5B4; }
#wrapwrap .ww-mega .ww-mega__a--res b { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#wrapwrap .ww-mega .ww-res { display: inline-flex; align-items: center; gap: 6px; height: 20px; padding: 0 8px; border-radius: 999px; background: var(--ink-900); color: #ECF22E !important;
  font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; line-height: 1 !important; }
#wrapwrap .ww-mega .ww-res i { width: 6px; height: 6px; border-radius: 3px; background: #ECF22E; }
/* « Vous etes ici » (handoff navigation-v1.2, 10/10) : entree de la page affichee ; vert = indicateur actif ; « Vos references » garde son jaune */
#wrapwrap .ww-mega a.ww-mega__a.is-current { background: rgba(0, 227, 174, .10); }
#wrapwrap .ww-mega a.ww-mega__a.is-current:hover { background: rgba(0, 227, 174, .16); }
#wrapwrap .ww-mega a.ww-mega__a--res.is-current, #wrapwrap .ww-mega a.ww-mega__a--res.is-current:hover { background: #F8FAD2; }
#wrapwrap .ww-mega .ww-mega__a.is-current b { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; font-weight: 800 !important; }
#wrapwrap .ww-mega .ww-here { display: inline-flex; align-items: center; gap: 6px; height: 20px; padding: 0 8px; border-radius: 999px; background: var(--ink-900); color: #fff !important;
  font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; line-height: 1 !important; }
#wrapwrap .ww-mega .ww-here i { flex: none; width: 6px; height: 6px; border-radius: 3px; background: var(--green-500); box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); }
.ww-mega__foot { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--border-1); display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
#wrapwrap .ww-mega .ww-mega__foot p { margin: 0 !important; flex: 1 1 320px; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-mega .ww-btn { height: 32px; padding: 0 12px; font-size: 14px; border-radius: 8px; }
#wrapwrap .ww-mega a.ww-btn--accent { color: var(--ink-900) !important; text-decoration: none !important; }

/* ---- LOT C · barre du haut : fil d'Ariane + cloche (fixe, à droite de la sidebar) ---- */
#wrapwrap > .ww-top { position: fixed !important; top: 0; left: var(--side-w); right: 0; z-index: 40; height: var(--top-h); display: flex; align-items: center; gap: 12px; margin: 0; padding: 12px 40px 0; background: var(--surface-sunken); font-family: var(--font-sans); box-sizing: border-box; line-height: normal; }
/* (padding-top de main : voir le bloc « mise en page Odoo », conditionné à body:has(#ww-nav)) */
.ww-burger { display: none; width: 44px; height: 44px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900); align-items: center; justify-content: center; cursor: pointer; flex: none; font: inherit; }
.ww-burger:hover { background: var(--ink-100); }
#wrapwrap .ww-top a.ww-bell { position: relative; width: 44px; height: 44px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900) !important; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: none; text-decoration: none !important; }
.ww-bell:hover { background: var(--ink-100); }
.ww-bell.has-new::after { content: ""; position: absolute; top: 11px; right: 11px; width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); border: 2px solid var(--surface-sunken); }

/* ---- mise en page Odoo : ACTIVE SEULEMENT quand le nouveau menu est rendu (body:has(#ww-nav)) : le CSS peut être déployé avant la vue
   sans toucher l'ancienne sidebar (qui vit dans #wrapwrap > header). Chrome du thème masqué, page décalée, décalages de l'ancienne sidebar annulés. ---- */
body:has(#ww-nav):not(.editor_enable) #wrapwrap > header:not(.ww-top):not(.ww-pub), body:has(#ww-pub):not(.editor_enable) #wrapwrap > header:not(.ww-top):not(.ww-pub),
body:has(#ww-nav):not(.editor_enable) #lcc-dropdown-overlay, body:has(#ww-pub):not(.editor_enable) #lcc-dropdown-overlay,
body:has(#ww-nav):not(.editor_enable) .iv2-mobile-burger, body:has(#ww-nav):not(.editor_enable) .iv2-mobile-overlay { display: none !important; }
body:has(#ww-nav) #wrapwrap > main, body:has(#ww-pub) #wrapwrap > main { padding-top: var(--top-h) !important; }
html body:has(#ww-nav), html body:has(#ww-pub) { background-color: var(--surface-sunken) !important; }   /* plus de bande blanche si un contenu deborde */
.ww-top__logo { display: inline-flex; align-items: center; }
.ww-top__logo img { height: 26px; width: auto; display: block; }
/* invité (lien à clé des e-mails, sans compte) : pas de sidebar -> annuler le décalage de l'ancien thème pour sa barre latérale d'origine
   (web.assets_frontend : #wrap { margin-left: 260px !important } de 992 à 1399 px, calc(50% - 455px) au-delà) ; contenu centré (Charles 29/09) */
@media (min-width: 768px) {
  html body:has(#ww-pub):not(.editor_enable):not(.editor_has_snippets) #wrapwrap #wrap, html body:has(#ww-pub):not(.editor_enable):not(.editor_has_snippets) #wrapwrap #wrap.o_portal_wrap { margin-left: auto !important; margin-right: auto !important; }
  html body:has(#ww-pub):not(.editor_enable):not(.editor_has_snippets) .o_footer_copyright { margin-left: 0 !important; }
  html body:has(#ww-pub):not(.editor_enable):not(.editor_has_snippets) #wrapwrap #footer { padding-left: 0 !important; }
}
@media (min-width: 1100px) {
  body:has(#ww-nav) #wrapwrap > main, body:has(#ww-nav) #wrapwrap > footer { margin-left: var(--side-w) !important; }
  html body:has(#ww-nav):not(.editor_enable):not(.editor_has_snippets) #wrapwrap main:not(.modal-body) > * { margin-left: 0 !important; margin-right: 0 !important; }
  html body:has(#ww-nav):not(.editor_enable):not(.editor_has_snippets) #wrapwrap #footer { padding-left: 0 !important; }
  html body:has(#ww-nav):not(.editor_enable) #wrapwrap #wrap { margin-left: 0 !important; }
}
/* ---- LOT D · mobile et tablette (< 1100 px) : tiroir plein écran, méga-menus plein écran par-dessus ---- */
@media (max-width: 1099px) {
  :root { --top-h: 56px; }
  #wrapwrap > .ww-nav { width: 100%; transform: translateX(-100%); visibility: hidden; pointer-events: none; z-index: 80; padding: 16px 16px calc(12px + env(safe-area-inset-bottom)); transition: transform .2s ease-out, visibility 0s linear .2s; }
  body.is-drawer #wrapwrap > .ww-nav { transform: none; visibility: visible; pointer-events: auto; transition: transform .2s ease-out, visibility 0s; }
  body.is-drawer { overflow: hidden; }
  .ww-nav__close { display: inline-flex; }
  .ww-item { height: 48px; font-size: 16px; }
  .ww-item__rail::after { top: 20px; }
  #wrapwrap .ww-nav a.ww-ico { width: 44px; height: 44px; }
  .ww-user { height: 56px; }
  .ww-burger { display: inline-flex; }
  #wrapwrap > .ww-top { left: 0; height: 56px; padding: 0 8px 0 4px; border-bottom: 1px solid var(--border-1); }
  body:has(#ww-nav) #wrapwrap > main, body:has(#ww-nav) #wrapwrap > footer { margin-left: 0 !important; }
  #wrapwrap > .ww-mega { left: 0; padding: 0; z-index: 90; }
  .ww-mega__panel { width: 100%; max-width: none; max-height: none; height: 100%; border-radius: 0; border: 0; box-shadow: none; padding: 0 16px 24px; animation: ww-slide .2s ease-out; }
  @keyframes ww-slide { from { transform: translateX(24px); opacity: .6; } to { transform: none; opacity: 1; } }
  .ww-mega__back { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 8px; height: 56px; margin: 0 -16px 12px; padding: 0 16px 0 8px; background: #fff; border-bottom: 1px solid var(--border-1); }
  .ww-mega__back button { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900); font-family: var(--font-sans); font-size: 15px; font-weight: 700; cursor: pointer; }
  .ww-mega__x { display: none; }
  #wrapwrap .ww-mega h2.ww-mega__t { font-size: 28px !important; }
  .ww-mega__cols { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .ww-mega__a { min-height: 48px; align-items: center; }
  .ww-mega__foot { flex-direction: column; align-items: stretch; }
  #wrapwrap .ww-mega .ww-mega__foot .ww-btn { height: 44px; }
}

/* ---- ajustements Charles (26/09, écart volontaire n°10 vs handoff) : sidebar +10 px de large (298), typographie de la sidebar +15 % ---- */
:root { --side-w: 298px; --nav-fz: 1.15; }
.ww-company__k { font-size: calc(10px * var(--nav-fz)); }
.ww-company__v { font-size: calc(14px * var(--nav-fz)); }
.ww-sec__t { font-size: calc(11px * var(--nav-fz)); }
.ww-item { font-size: calc(15px * var(--nav-fz)); }
.ww-item__n { font-size: calc(12px * var(--nav-fz)); }
.ww-draft__k { font-size: calc(10px * var(--nav-fz)); }
.ww-draft__n { font-size: calc(14px * var(--nav-fz)); }
.ww-draft__m { font-size: calc(12px * var(--nav-fz)); }
.ww-user__av { font-size: calc(11px * var(--nav-fz)); }
#wrapwrap .ww-nav .ww-user__id b { font-size: calc(13px * var(--nav-fz)); }
.ww-user__id span { font-size: calc(11px * var(--nav-fz)); }
@media (max-width: 1099px) { .ww-item { font-size: calc(16px * var(--nav-fz)); } }
.ww-user__id span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }   /* +15 % : la fonction · type ne passe plus à la ligne, elle se tronque comme le nom */
/* barre d'édition Odoo (administrateurs connectés au site) : fixe en haut, 46 px -> sidebar, barre et méga-menus décalés d'autant */
body:has(#oe_main_menu_navbar) #wrapwrap > .ww-nav { top: 46px; height: calc(100vh - 46px); }
body:has(#oe_main_menu_navbar) #wrapwrap > .ww-top { top: 46px; }
/* Pages portail connectees : le theme peint #wrapwrap.o_portal et #wrap en #ECECEC (!important, assets_frontend.0/1) alors que le handoff
   pose tout le contenu sur --surface-sunken (#F6F6F5) comme la barre du haut -> sans cette regle la barre du fil d'Ariane apparait
   comme un bandeau d'une autre couleur (Charles 26/09). Specificite > (1,1,0) obligatoire. */
html body:has(#ww-nav) #wrapwrap.o_portal, html body:has(#ww-nav) #wrapwrap.o_portal #wrap.o_portal_wrap { background-color: var(--surface-sunken) !important; }
/* le meme theme peint aussi SOUS #wrapwrap (box-shadow #ececec 0 100vh 0 100vh, assets_frontend.0) : #wrapwrap a la hauteur de l'ecran et le contenu
   le depasse -> la mention de bas de page (placee apres #wrap) tombait sur ce gris, une bande plus foncee (Charles 06/10) -> ombre a la couleur du fond */
html body:has(#ww-nav) #wrapwrap.o_portal { box-shadow: 0 100vh 0 100vh var(--surface-sunken) !important; }
body:has(#oe_main_menu_navbar) #wrapwrap > .ww-mega { top: 46px; }
/* body.o_connected_user porte deja padding-top:46px (Odoo) : main commence sous la barre d edition, seul --top-h est a ajouter (27/09 : 46 px comptes deux fois) */
/* fil d'Ariane natif du portail (.o_portal_submenu dans .o_portal.mt-3) et du shop (nav.shop-breadcrumb) : en doublon avec la barre du haut -> masqués
   quand le nouveau menu est rendu ; la ligne du portail reste si elle porte le pager précédent/suivant */
body:has(#ww-nav) .o_portal_submenu, body:has(#ww-nav) nav.shop-breadcrumb { display: none !important; }
body:has(#ww-nav) .o_portal.mt-3 > .row:not(:has(.record_pager)) { display: none !important; }

/* ---- navigation v1.1 (handoff ENTREE/navigation-v1.1, lot C, 29/09) : plus de fil d'Ariane ; lien parent sur les pages de détail ;
   desktop sans barre du haut (contenu à ~24 px du haut, cloche retirée : compteur sur « Échanges ») ; mobile : une barre de 56 px menu · logo · cloche ---- */
@media (min-width: 1100px) {
  #wrapwrap > .ww-mbar { display: none !important; }
  body:has(#ww-nav) { --top-h: 0px; }   /* repères collants (.qt-sgrp…) : plus de barre au-dessus */
  body:has(#ww-nav) #wrapwrap > main { padding-top: 4px !important; }   /* + ~20 px d'espacement propre aux pages = eyebrow à ~24 px */
}
@media (max-width: 1099px) {
  #wrapwrap > .ww-mbar { gap: 4px; padding: 0 4px; background: #fff; }
  .ww-mbar .ww-top__logo { flex: 1; display: flex; justify-content: center; }
  .ww-mbar .ww-top__logo img { height: 28px; width: auto; display: block; }
  .ww-mbar .ww-bell.has-new::after { border-color: #fff; }
}
/* lien parent : 1er élément du <main> (vue navigation) ; flèche alignée sur le bord du texte (contenu à 40 px, 16 px en mobile), 12 px avant l'eyebrow */
#wrapwrap a.ww-back { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 8px; margin: 12px 0 -8px 32px; border-radius: 8px;
  color: var(--ink-900) !important; text-decoration: none !important; font-family: var(--font-sans); font-size: 14px; font-weight: 700; line-height: 1; white-space: nowrap; background: transparent; }
#wrapwrap a.ww-back:hover { background: var(--ink-100); }
#wrapwrap a.ww-back:focus { outline: none; }
#wrapwrap a.ww-back:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--green-500); }
.ww-back svg.i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 1100px) {   /* la règle « main > * { margin-left: 0 !important } » (mise en page Odoo, plus haut) ne doit pas coller le lien à la sidebar */
  html body:has(#ww-nav):not(.editor_enable):not(.editor_has_snippets) #wrapwrap main:not(.modal-body) > a.ww-back { margin-left: 32px !important; }
}
@media (max-width: 1099px) { #wrapwrap a.ww-back { margin: 12px 0 -8px 8px; } }
/* configurateur du chiffrage : il garde son propre « Retour au chiffrage », pas de lien parent en plus */
body:has(#quote[data-has="1"]:is([data-mode="add"], [data-mode="config"])) #wrapwrap a.ww-back { display: none; }


/* ===== Echanges non lus (handoff navigation-v1.1, lot A bis, 30/09) : pastille verte, libelle blanc gras, ligne « De {expediteur} », point sur le bouton menu ===== */
.ww-item__n--new { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: #00E6B0; color: #141414; font-family: var(--font-mono); font-size: 12px; font-weight: 600; line-height: 1; }
/* le theme impose la couleur des liens de la barre (#wrapwrap .ww-nav a… !important) : memes armes, selecteur plus precis */
#wrapwrap .ww-nav .has-unread > a.ww-item { color: #fff !important; font-weight: 700 !important; }
.ww-item__from { box-sizing: border-box; display: grid; grid-template-columns: 24px minmax(0, 1fr); margin: -6px 0 6px; font-size: 12px; line-height: 1.4; }
#wrapwrap .ww-nav a.ww-item__from { color: #9A9A98 !important; text-decoration: none !important; }
#wrapwrap .ww-nav a.ww-item__from:hover { color: #fff !important; }
.ww-item__fromt { padding: 0 8px 0 42px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ww-burger { position: relative; }
.ww-burger.has-new::after { content: ""; position: absolute; top: 9px; right: 7px; width: 8px; height: 8px; border-radius: 4px; background: #00E6B0; border: 2px solid #fff; }

/* ---- barre du haut publique (handoff gamme-v1.2, « Barre publique commune », 01/10) : tout visiteur (remplace la barre invité) et, sur les pages
   vitrine (ww_vitrine), tout le monde. Encre, logo dans le U, Gammes ▾ (menu à vignettes) · Catalogue, un seul bouton ; ≤ 760 px menu · logo · icône. ---- */
body:has(#ww-pub) { --top-h: 68px; }
/* !important : entre 768 et 991 px l'ancien theme force « header { position: relative !important } » -> barre dans le flux + main decale de 68 px = bande blanche (Charles 01/10) */
#wrapwrap > .ww-pub { position: fixed !important; top: 0; left: 0; right: 0; z-index: 60; height: 68px; margin: 0; background: var(--ink-900); color: #fff; font-family: var(--font-sans); line-height: normal; }
body:has(#oe_main_menu_navbar) #wrapwrap > .ww-pub { top: 46px; }
.ww-pub__in { max-width: 1248px; height: 68px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: 16px; box-sizing: border-box; }
.ww-pub__left { grid-column: 1; justify-self: start; align-self: center; margin-top: 0; display: flex; align-items: center; gap: 4px; }
.ww-pub__nav { display: flex; gap: 4px; align-items: center; }
/* liens 16 -> 18 px (Charles 11/10) ; graisse remise à 500 (« diminue un peu le poids », même jour) */
#wrapwrap .ww-pub .ww-pub__link { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border: 0; border-radius: 8px; background: none; color: #C4C4C1 !important; font-family: var(--font-sans); font-size: 18px; font-weight: 500; line-height: 1; text-decoration: none !important; cursor: pointer; }
#wrapwrap .ww-pub .ww-pub__link:hover, #wrapwrap .ww-pub .ww-pub__link[aria-expanded="true"] { background: #232323; color: #fff !important; }
#wrapwrap .ww-pub .ww-pub__link.is-current { color: #fff !important; font-weight: 700; }
.ww-pub__link.is-current::before { content: ""; flex: none; width: 6px; height: 6px; margin-right: 4px; border-radius: 3px; background: var(--green-500); box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); }
.ww-pub__chev { width: 16px; height: 16px; transition: transform .15s; }
.ww-pub__link[aria-expanded="true"] .ww-pub__chev { transform: rotate(180deg); }
#wrapwrap .ww-pub a.ww-pub__logo { grid-column: 2; align-self: center; display: inline-flex; align-items: center; justify-content: center; height: 50px; padding: 0 28px; margin-top: 0; border: 0; border-radius: 0; box-sizing: border-box; text-decoration: none !important; }   /* header-public v1.1 (11/10) : plus de cadre en U, logo centre dans la barre de 68 px */
.ww-pub__logo img { height: 30px; width: auto; display: block; }   /* 26 -> 30 px (Charles 11/10 : « augmenter un peu le logo ») */
.ww-pub__act { grid-column: 3; justify-self: end; align-self: center; margin-top: 0;   /* centres dans la barre (Charles 01/10 : « plus de noir au-dessus qu'en dessous ») ; le logo aussi depuis v1.1 (plus de U) */ display: flex; align-items: center; gap: 8px; }
.ww-pub__burger { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: #fff !important; cursor: pointer; text-decoration: none !important; }
.ww-pub__burger:hover { background: #232323; }
.ww-pub__gm { position: relative; }
.ww-pub__menu { display: none; position: absolute; top: calc(100% + 12px); left: 0; z-index: 70; width: 560px; padding: 16px; box-sizing: border-box; background: #fff; color: var(--ink-900); border: 1px solid rgba(20, 20, 20, .06); border-radius: 12px; box-shadow: 0 12px 32px rgba(20, 20, 20, .16); }
.ww-pub__gm.is-open .ww-pub__menu { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
#wrapwrap .ww-pub a.ww-pub__ga { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px; border-radius: 8px; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-pub a.ww-pub__ga:hover { background: var(--ink-50); }
.ww-pub__ga b { display: block; font-size: 15px; font-weight: 700; }
.ww-pub__ga[aria-current="page"] b::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 8px; border-radius: 3px; background: var(--green-500); vertical-align: middle; }
.ww-pub__ga small { display: block; font-size: 12px; color: var(--text-3); }
.ww-pub__th { display: block; flex: none; width: 44px; height: 44px; border-radius: 8px; background: var(--ink-100); overflow: hidden; }
.ww-pub__th img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* « Votre métier » (menu Gammes de l'ordinateur) : glyphes métier de la landing à la place des photos (Charles 10/11) */
.ww-pub__th--gl { display: grid; place-items: center; background: var(--ink-900); color: #fff; }
.ww-pub__th--gl svg { display: block; width: 26px; height: 26px; }
.ww-pub__mfoot { grid-column: 1 / 3; display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--border-1); font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-pub .ww-pub__mfoot a { font-weight: 700; color: var(--green-700) !important; text-decoration: none !important; white-space: nowrap; }
#wrapwrap > .ww-pub-panel { display: none; position: fixed; inset: 0; z-index: 90; overflow: auto; padding: 0 16px; background: #fff; color: var(--ink-900); font-family: var(--font-sans); }
body.is-pubpanel #wrapwrap > .ww-pub-panel { display: block; }
/* utilisateur interne : la barre de l'éditeur Odoo (#oe_main_menu_navbar, 46 px, fixe, z-index 1040) recouvrait le haut du menu ☰
   (logo, FR | EN, croix) — vu en ligne le 06/11 ; les clients n'ont pas cette barre */
body.o_connected_user #wrapwrap > .ww-pub-panel { top: 46px; }
body.is-pubpanel { overflow: hidden; }
.ww-pub-panel__head { height: 64px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; border-bottom: 1px solid var(--border-1); }
.ww-pub-panel__head img { height: 24px; width: auto; display: block; }
.ww-pub-panel__x { width: 44px; height: 44px; margin-right: -8px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900); cursor: pointer; }
.ww-pub-panel__sec { padding: 16px 0 8px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
.ww-pub-panel__sec.is-current { color: var(--ink-900); }
.ww-pub-panel__sec.is-current::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 3px; background: var(--green-500); box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); vertical-align: middle; }
#wrapwrap .ww-pub-panel a.ww-pub-panel__a { display: flex; align-items: center; gap: 12px; min-height: 52px; margin: 0 -8px; padding: 6px 8px; border-radius: 8px; font-size: 17px; font-weight: 500; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-pub-panel a.ww-pub-panel__a:hover { background: var(--ink-50); }
.ww-pub-panel__a .ww-pub__th { width: 40px; height: 40px; }
.ww-pub-panel__a small { margin-left: auto; font-size: 13px; font-weight: 400; color: var(--text-3); white-space: nowrap; }
.ww-pub-panel__acts { display: grid; gap: 10px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-pub-panel a.ww-btn { width: 100%; height: 48px; box-sizing: border-box; justify-content: center; text-decoration: none !important; }
#wrapwrap .ww-pub-panel a.ww-btn--accent { color: var(--ink-900) !important; }
#wrapwrap .ww-pub-panel a.ww-btn--secondary { color: var(--ink-900) !important; background: #fff !important; border: 1px solid var(--border-1) !important; }
/* menu ☰ (Charles 10/11 : « le menu en version mobile est beaucoup trop vertical » avec les 5 pages métier) : mesuré à 390 × 844, panneau de
   1 195 px et « Demander un accès » à 1 044 px, hors écran. Gammes, Votre métier et idréva en 2 colonnes ; métiers avec les glyphes de la
   landing ; boutons d'accès côte à côte, collés en bas du panneau ; page courante = case grisée (aria-current annonce « page actuelle ») */
.ww-pub-panel__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 8px; margin: 0 -8px; }
.ww-pub-panel__grid > .ww-pub-panel__gh { grid-column: 1 / -1; padding-left: 8px !important; }
#wrapwrap .ww-pub-panel .ww-pub-panel__grid a.ww-pub-panel__a { box-sizing: border-box; min-width: 0; min-height: 48px; margin: 0; gap: 10px; font-size: 16px; line-height: 1.2; text-wrap: balance; }
#wrapwrap .ww-pub-panel .ww-pub-panel__grid a.ww-pub-panel__a[aria-current="page"] { background: var(--ink-50); font-weight: 700; }
.ww-pub-panel__grid .ww-pub-panel__a small { display: none; }
.ww-pub-panel__grid .ww-pub-panel__a .ww-pub__th { flex: none; }
.ww-pub-panel__g { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 16px; background: var(--ink-900); color: #fff; }
.ww-pub-panel__g svg { display: block; width: 20px; height: 20px; }
#wrapwrap > .ww-pub-panel .ww-pub-panel__acts { position: sticky; bottom: 0; z-index: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 16px -16px 0;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-pub-panel .ww-pub-panel__acts a.ww-btn { padding: 0 8px; white-space: nowrap; }
@media (max-width: 359px) { #wrapwrap > .ww-pub-panel .ww-pub-panel__acts { grid-template-columns: 1fr; } }
/* bouton « remonter » du thème (z-index 999) par-dessus le panneau ouvert (z-index 90) — vu le 10/11 */
body.is-pubpanel .back-to-top-btn { display: none !important; }
@media (max-width: 760px) {
  .ww-pub__in { grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 8px; padding: 0 16px; }   /* 16 px = gouttiere mobile des pages (alignement, Charles 01/10) */
  #wrapwrap .ww-pub a.ww-pub__logo { justify-self: center; padding: 0 20px; }
  .ww-pub__logo img { height: 24px; }
  .ww-pub__nav { display: none !important; }
  .ww-pub__burger { display: inline-flex; }
}
/* 761-1079 px : Gammes, Catalogue et idréva ne tiennent plus à gauche du logo -> menu ☰ et panneau plein écran, comme sur téléphone
   (Charles 11/10 : « le menu idréva disparaît quand on réduit l'écran ») ; logo et compte gardent leur taille d'ordinateur */
@media (max-width: 1079px) { #wrapwrap .ww-pub .ww-pub__nav { display: none !important; } #wrapwrap .ww-pub .ww-pub__burger { display: inline-flex; } }
@media (min-width: 1080px) { #wrapwrap > .ww-pub-panel { display: none !important; } }
/* ---- compte (handoff header-public-v1.0, §3) : un seul bouton a droite. Visiteur : casque + « Se connecter » (11 px gras), discret ;
   connecte : miniature 36 px (photo, sinon initiales) + point vert. Clic -> infobulle blanche (272 px, fleche) ; mobile : rond 44 px, infobulle pleine largeur ---- */
.ww-pub__acct { position: relative; }
/* choix de la langue FR | EN (phase 1 anglais, 05/11) : a gauche du bouton compte ; visible des seuls internes tant que l'anglais n'est pas active */
.ww-pub__acct:has(> .ww-pub__lang) { display: flex; align-items: center; gap: 10px; }
.ww-pub__lang { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid #3a3a3a; border-radius: 8px; }
#wrapwrap .ww-pub .ww-pub__lang a { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 28px; padding: 0 6px; border-radius: 5px;
  font-size: 12px; font-weight: 700; letter-spacing: .04em; line-height: 1; color: var(--ink-400) !important; text-decoration: none !important; }
#wrapwrap .ww-pub .ww-pub__lang a:hover { color: #fff !important; }
#wrapwrap .ww-pub .ww-pub__lang a[aria-current="true"] { background: #2b2b2b; color: #fff !important; }
#wrapwrap .ww-pub .ww-pub__lang a:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--green-500); }
/* sous 1080 px (barre avec menu ☰) : le choix FR | EN quitte la barre (il chevauchait le logo sur téléphone, Charles 06/11) et passe dans
   l'en-tête du menu ☰, à gauche de la croix ; couleurs du panneau blanc */
@media (max-width: 1079px) { #wrapwrap .ww-pub .ww-pub__acct > .ww-pub__lang { display: none !important; } .ww-pub__acct:has(> .ww-pub__lang) { display: block; } }
.ww-pub-panel__head .ww-pub__lang { margin-left: auto; margin-right: 12px; border-color: var(--border-1); }
#wrapwrap > .ww-pub-panel .ww-pub__lang a { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 36px; padding: 0 8px; border-radius: 6px;
  font-size: 13px; font-weight: 700; letter-spacing: .04em; line-height: 1; color: var(--ink-500) !important; text-decoration: none !important; }
#wrapwrap > .ww-pub-panel .ww-pub__lang a[aria-current="true"] { background: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-pub .ww-pub__acbtn { position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; height: 52px; padding: 4px 12px; border: 0; border-radius: 8px; background: transparent; color: #C4C4C1; font-family: var(--font-sans); cursor: pointer; transition: background .12s cubic-bezier(.2, .7, .2, 1), color .12s; }
#wrapwrap .ww-pub .ww-pub__acbtn:hover, #wrapwrap .ww-pub .ww-pub__acbtn[aria-expanded="true"] { background: #232323; color: #fff; }
#wrapwrap .ww-pub .ww-pub__acbtn:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--ink-900), 0 0 0 4px var(--green-500); }
.ww-pub__hat { flex: none; width: 26px; height: 26px; }   /* casque + libelle agrandis (Charles 01/10) : 20 -> 26 px, 11 -> 14 px */
.ww-pub__acl { font-size: 15px; font-weight: 700; line-height: 1; white-space: nowrap; }
#wrapwrap .ww-pub .ww-pub__acbtn--user { width: 40px; height: 40px; padding: 0; border-radius: 20px; }
.ww-pub__av { display: inline-flex; flex: none; align-items: center; justify-content: center; box-sizing: border-box; width: 36px; height: 36px; border-radius: 18px; background: #fff center / cover no-repeat; color: var(--ink-900); font-size: 13px; font-weight: 700; letter-spacing: .02em; line-height: 1; }
.ww-pub__dot { position: absolute; top: 0; right: 0; width: 10px; height: 10px; border-radius: 5px; background: var(--green-500); box-shadow: 0 0 0 2px var(--ink-900), 0 0 0 6px rgba(0, 230, 176, .28); }
.ww-pub__pop { display: none; position: absolute; right: 0; top: calc(100% + 12px); z-index: 80; width: 272px; padding: 16px; box-sizing: border-box; border: 1px solid var(--border-1); border-radius: 12px; background: #fff; color: var(--ink-900); box-shadow: var(--shadow-l, 0 16px 40px rgba(20, 20, 20, .16)); text-align: left; font-family: var(--font-sans); line-height: 1.4; }
.ww-pub__pop::before { content: ""; position: absolute; right: 14px; top: -6px; width: 12px; height: 12px; background: #fff; transform: rotate(45deg); border-left: 1px solid rgba(20, 20, 20, .06); border-top: 1px solid rgba(20, 20, 20, .06); }
.ww-pub__acct.is-open .ww-pub__pop { display: block; animation: ww-pub-in .14s ease-out; }
@keyframes ww-pub-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.ww-pub__popin { display: grid; gap: 12px; }
.ww-pub__popk { display: grid; gap: 6px; justify-items: start; }
.ww-pub__popk small { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--green-700); }
.ww-pub__popk img { display: block; height: 22px; width: auto; }
.ww-pub__who { display: grid; gap: 2px; padding-bottom: 12px; border-bottom: 1px solid var(--border-1); }
.ww-pub__who b { font-size: 15px; }
.ww-pub__who small { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-pub a.ww-pub__popgo { width: 100%; height: 40px; justify-content: space-between; padding: 0 16px; box-sizing: border-box; font-size: 14px; color: var(--ink-900) !important; text-decoration: none !important; }
.ww-pub__arr { flex: none; width: 16px; height: 16px; }
#wrapwrap .ww-pub a.ww-pub__popa { display: grid; gap: 2px; margin: 0 -4px; padding: 10px 12px; border-radius: 8px; font-size: 14px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-pub a.ww-pub__popa small { font-size: 12px; font-weight: 400; color: var(--text-2); }
#wrapwrap .ww-pub a.ww-pub__popa:hover { background: var(--ink-100); }
#wrapwrap .ww-pub a.ww-pub__popa--out { color: var(--text-2) !important; font-weight: 500; }
@media (max-width: 760px) {
  #wrapwrap .ww-pub .ww-pub__acbtn { width: 44px; height: 44px; padding: 0; border-radius: 22px; gap: 0; }
  .ww-pub__acl { display: none; }
  .ww-pub__hat { width: 24px; height: 24px; }   /* telephone : casque seul, a la taille du burger */
  .ww-pub__pop { position: fixed; left: 12px; right: 12px; top: 72px; width: auto; }
  body:has(#oe_main_menu_navbar) .ww-pub__pop { top: 118px; }
  .ww-pub__pop::before { right: 20px; }
}
/* pages visiteur a barre publique (catalogue, fiche produit) : contenu aligne sur la barre — 1 200 px utiles, gouttiere 24 px
   (Charles 01/10 : « le contenu est moins large que les elements du header ») ; le theme bornait #wrap a 1 140 px avec 40 px de retrait */
@media (min-width: 761px) {
  html body:has(#ww-pub):not(.editor_enable):not(.editor_has_snippets) #wrapwrap #wrap.js_sale { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
  html body:has(#ww-pub) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-cat, html body:has(#ww-pub) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-prod { max-width: 1248px !important; width: 100% !important; margin-left: auto !important; margin-right: auto !important; padding-left: 24px !important; padding-right: 24px !important; box-sizing: border-box !important; }
}

/* ---- audit UX du 01/10 ---- */
/* pied de page des pages shop pour un visiteur : une ancienne vue de styles du shop le masque (#wrapwrap:has(.oe_website_sale) > footer.o_footer) */
html body:has(#ww-pub) #wrapwrap:has(.oe_website_sale) > footer.o_footer { display: block !important; }
/* focus clavier de la barre : meme anneau que le bouton compte (le theme imposait un anneau noir sur fond encre) */
#wrapwrap .ww-pub .ww-pub__link:focus-visible, #wrapwrap .ww-pub a.ww-pub__logo:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--ink-900), 0 0 0 4px var(--green-500); }
/* ☰ et croix du panneau : le JS y déplace le focus (dialogue) -> la règle button:focus du thème dessinait un anneau orange après un clic souris (audit UX 11/10) ; anneau au clavier seulement */
#wrapwrap .ww-pub .ww-pub__burger:focus, #wrapwrap > .ww-pub-panel .ww-pub-panel__x:focus { outline: none !important; }
#wrapwrap .ww-pub .ww-pub__burger:focus-visible, #wrapwrap > .ww-pub-panel .ww-pub-panel__x:focus-visible { box-shadow: 0 0 0 2px var(--ink-900), 0 0 0 4px var(--green-500); }
@media (max-width: 760px) { #wrapwrap .ww-pub a.ww-pub__popgo { height: 44px; } #wrapwrap .ww-pub a.ww-pub__popa { min-height: 44px; } }
/* bas des pages shop visiteur : 64 px entre le dernier bloc et le pied de page (le theme ajoutait 32 + 60 px ; Charles 01/10 « grand vide ») */
html body:has(#ww-pub) #wrapwrap #wrap.js_sale { padding-bottom: 0 !important; }
html body:has(#ww-pub) #wrapwrap #wrap.js_sale > .oe_structure.mb32 { margin-bottom: 0 !important; }
/* le theme impose .js_sale { min-height: 100vh } : sur un ecran haut, page courte = vide sous le contenu (Charles 01/10, 525 px mesures a 1400 px de haut) ; sans lui le pied de page suit le contenu et, page tres courte, descend jusqu'en bas de l'ecran (#wrapwrap en flex) */
html body:has(#ww-pub) #wrapwrap #wrap.js_sale { min-height: 0; }@media (max-width: 1080px) { #wrapwrap .ww-pub .ww-pub__link--eng { display: none; } }
/* menu « idréva » (Charles 11/10) : Qui sommes-nous + Nos engagements, même composant que Gammes ; sous 1080 px : dans le menu ☰ */
.ww-pub__gm.is-open .ww-pub__menu--id { width: 520px; }
   /* « Engagements » (08/10) : plus la place entre la nav et le logo sous 1080 px ; reste dans le menu mobile et le pied de page */


/* ===== dash.css ===== */
/* ===== dash.css — vue d'ensemble /my/home (GENERE par dash_build.py depuis ENTREE/dashboard-v1.0, ne pas editer).
   Classes du prototype prefixees dash- (Bootstrap : .card .btn .badge), tout sous .ww-dash ; armor theme. ===== */
/* ===== LOT F · Vue d'ensemble ===== */
  .ww-dash{padding:20px 40px 64px;max-width:1440px}
  .ww-dash .dash-head{display:flex;--x:0;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin:8px 0 32px}
  .ww-dash .dash-repere{position:relative;padding-left:28px;flex:1 1 520px;min-width:0}
  .ww-dash .dash-repere::before{content:"";position:absolute;left:5px;top:6px;bottom:2px;width:1.5px;background:var(--ink-900)}
  .ww-dash .dash-repere::after{content:"";position:absolute;left:0;top:0;width:12px;height:12px;border-radius:6px;background:var(--green-500);box-shadow:0 0 0 6px var(--point-halo)}
  .ww-dash .dash-h1{margin:0;font-size:52px;font-weight:900;letter-spacing:-.04em;line-height:.95}
  .ww-dash .dash-h1 i{font-style:normal;color:var(--green-500)}
  .ww-dash .dash-sub{margin:10px 0 0;text-wrap:balance;font-size:22px;color:var(--ink-600);letter-spacing:-.01em}
  .ww-dash .dash-btn{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;border-radius:8px;text-decoration:none;white-space:nowrap;height:40px;padding:0 16px;font-size:15px;transition:background .15s ease-out}
  .ww-dash .dash-btn:active{transform:translateY(1px)}
  .ww-dash .dash-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500)}
  .ww-dash .dash-btn--accent{background:var(--green-500);color:var(--ink-900);box-shadow:var(--shadow-accent)}
  .ww-dash .dash-btn--accent:hover{background:var(--green-600)}
  .ww-dash .dash-btn--xl{height:58px;padding:0 28px;font-size:17px}
  .ww-dash .dash-btn--ghost{background:transparent;color:var(--ink-900)}
  .ww-dash .dash-btn--ghost:hover{background:var(--ink-100)}
  .ww-dash .dash-eyebrow{font-family:var(--font-mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--green-700)}
  .ww-dash .dash-card{background:#fff;border-radius:12px;box-shadow:0 1px 2px rgba(20,20,20,.04),0 8px 24px -12px rgba(20,20,20,.16)}
  /* Chiffrage en cours */
  .ww-dash .dash-draft{margin-bottom:40px}
  .ww-dash .dash-draft__grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;margin-top:12px;align-items:stretch}
  .ww-dash .dash-draft__main{padding:24px 26px;display:grid;gap:18px;align-content:start}
  .ww-dash .dash-draft__top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
  .ww-dash .dash-draft__ref{font-family:var(--font-mono);font-size:12px;color:var(--text-3)}
  .ww-dash .dash-draft__name{font-size:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700;letter-spacing:-.02em;margin-top:4px}
  .ww-dash .dash-draft__meta{font-size:14px;color:var(--text-2);margin-top:4px}
  .ww-dash .dash-badge{display:inline-flex;align-items:center;gap:8px;height:26px;padding:0 10px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap}
  .ww-dash .dash-badge--pending{background:#FFF3E0;color:#9A4E00}
  .ww-dash .dash-badge--pending::before{content:"";width:8px;height:8px;border-radius:4px;background:#E07A00}
  .ww-dash .dash-badge--active{background:#E3F8F1;color:#00875F}.ww-dash .dash-badge--active::before{content:"";width:8px;height:8px;border-radius:4px;background:#00C497}
  .ww-dash .dash-badge--info{background:var(--ink-100);color:var(--ink-700)}.ww-dash .dash-badge--info::before{content:"";width:8px;height:8px;border-radius:4px;background:var(--ink-500)}
  .ww-dash .dash-stepper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
  .ww-dash .dash-stepper li{position:relative;padding-top:18px;font-size:13px;color:var(--text-3)}
  .ww-dash .dash-stepper li::before{content:"";position:absolute;left:0;right:0;top:5px;height:1.5px;background:var(--ink-200)}
  .ww-dash .dash-stepper li::after{content:"";position:absolute;left:0;top:0;width:12px;height:12px;border-radius:6px;background:#fff;border:1.5px solid var(--ink-300);box-sizing:border-box}
  .ww-dash .dash-stepper li.done{color:var(--ink-900)}.ww-dash .dash-stepper li.done::before{background:var(--ink-900)}.ww-dash .dash-stepper li.done::after{background:var(--ink-900);border-color:var(--ink-900)}
  .ww-dash .dash-stepper li.cur{color:var(--ink-900);font-weight:700}.ww-dash .dash-stepper li.cur::after{background:var(--green-500);border-color:var(--green-500);box-shadow:0 0 0 4px var(--point-halo)}
  .ww-dash .dash-stepper b{display:block;font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.1em;color:var(--text-3);margin-bottom:2px}
  .ww-dash .dash-draft__actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
  .ww-dash .dash-draft__saved{font-size:13px;color:var(--text-3);margin-left:auto;white-space:nowrap}
  .ww-dash .dash-draft__side{padding:24px 26px}
  .ww-dash .dash-callout{background:var(--ink-50);border-radius:8px;padding:16px 18px}
  .ww-dash .dash-callout__k{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
  .ww-dash .dash-callout__v{font-family:var(--font-mono);font-size:28px;font-weight:600;letter-spacing:-.02em;margin-top:6px}
  .ww-dash .dash-callout__v small{font-size:14px;font-weight:500;color:var(--text-2);margin-left:6px}
  .ww-dash .dash-draft__side p{margin:14px 0 0;font-size:14px;color:var(--text-2);line-height:1.5}
  /* Accès rapides */
  .ww-dash .dash-quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
  .ww-dash .dash-quick a{display:flex;align-items:center;gap:16px;padding:22px 20px;color:var(--ink-900);text-decoration:none;min-width:0;transition:box-shadow .15s ease-out}
  .ww-dash .dash-quick a:hover{box-shadow:0 1px 2px rgba(20,20,20,.06),0 12px 28px -12px rgba(20,20,20,.24)}
  .ww-dash .dash-quick .i{width:40px;height:40px;stroke-width:1.25}
  .ww-dash .dash-quick--s .i{width:36px;height:36px}
  .ww-dash .dash-quick--s a{padding:18px 20px}
  .ww-dash .dash-quick span{flex:1;min-width:0;display:grid;gap:3px}
  .ww-dash .dash-quick b{font-size:17px;letter-spacing:-.01em;line-height:1.2}
  .ww-dash .dash-quick small{font-size:14px;color:var(--text-2);line-height:1.3}
  .ww-dash .dash-quick .dash-chev{width:20px;height:20px;color:var(--ink-700);flex:none}
  /* Deux colonnes */
  .ww-dash .dash-two{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;margin-top:20px;align-items:stretch}
  .ww-dash .dash-card--col{display:flex;flex-direction:column}
  .ww-dash .dash-card__head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 16px;padding:24px 26px 18px}
  .ww-dash .dash-h2{margin:0;white-space:nowrap;font-size:28px;font-weight:900;letter-spacing:-.035em;line-height:1.05}
  .ww-dash .dash-link{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--green-700);white-space:nowrap}
  .ww-dash .dash-link .i{width:18px;height:18px;stroke-width:2}
  .ww-dash .dash-tblwrap{padding:0 26px;overflow-x:auto}
  .ww-dash table{width:100%;min-width:640px;border-collapse:separate;border-spacing:0;border:1px solid var(--border-1);border-radius:8px;overflow:hidden}
  .ww-dash th{text-align:left;font-size:14px;font-weight:500;color:var(--ink-700);padding:14px 18px;background:var(--ink-50);border-bottom:1px solid var(--border-1)}
  .ww-dash th+th, .ww-dash td+td{border-left:1px solid var(--border-1)}
  .ww-dash td{padding:18px;border-bottom:1px solid var(--border-1);font-size:15px;vertical-align:middle}
  .ww-dash tr:last-child td{border-bottom:0}
  .ww-dash td b{display:block;font-size:16px}
  .ww-dash td small{display:block;font-size:14px;color:var(--text-2);margin-top:3px}
  .ww-dash .dash-tech{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:999px;background:var(--ink-100);font-family:var(--font-mono);font-size:11px;color:var(--ink-700);margin-left:8px;vertical-align:middle}
  .ww-dash .dash-st{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
  .ww-dash .dash-st::before{content:"";width:10px;height:10px;border-radius:5px;background:var(--dot,var(--ink-500))}
  .ww-dash .dash-plan{margin:20px 26px 26px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px 18px;border-radius:8px;background:#E3F8F1}
  .ww-dash .dash-plan .i{color:var(--green-700)}
  .ww-dash .dash-plan__k{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-700)}
  .ww-dash .dash-plan__v{font-size:15px;font-weight:700;margin-top:2px}
  .ww-dash .dash-photo{overflow:hidden}
  .ww-dash .dash-photo__img{flex:1;min-height:250px;position:relative}
  .ww-dash .dash-photo__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
  .ww-dash .dash-photo__body{padding:26px 26px 28px}
  .ww-dash .dash-photo__body h3{margin:0;font-size:26px;font-weight:900;letter-spacing:-.035em;line-height:1.05}
  .ww-dash .dash-photo__body p{margin:10px 0 18px;font-size:17px;color:var(--ink-600);line-height:1.4}
  .ww-dash .dash-h2--sec{margin:40px 0 16px}
  /* Bandeau engagement */
  .ww-dash .dash-engage{margin-top:20px;border-radius:12px;overflow:hidden;position:relative;height:220px;background:var(--ink-900)}
  .ww-dash .dash-engage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
  .ww-dash .dash-engage__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,20,20,.94) 0%,rgba(20,20,20,.78) 38%,rgba(20,20,20,.15) 70%,rgba(20,20,20,.05) 100%)}
  .ww-dash .dash-engage__txt{position:absolute;left:36px;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;color:#fff;max-width:480px}
  .ww-dash .dash-engage__txt strong{white-space:nowrap;font-size:30px;font-weight:900;letter-spacing:-.035em;line-height:1.05}
  .ww-dash .dash-engage__txt strong i{font-style:normal;color:var(--green-500)}
  .ww-dash .dash-engage__txt span{font-size:16px;color:var(--ink-300);margin-top:10px}
  .ww-dash .dash-engage__txt a{display:inline-flex;align-items:center;gap:8px;margin-top:18px;color:#fff;font-weight:700;font-size:15px;text-decoration:underline;text-decoration-color:var(--green-500);text-underline-offset:5px}
  .ww-dash .dash-engage__side{position:absolute;right:36px;top:0;bottom:0;display:flex;align-items:center}
  .ww-dash .dash-engage__side p{margin:0;border-left:2px solid var(--green-500);padding:10px 16px;color:#fff;font-size:14px;line-height:1.45;max-width:190px;background:rgba(20,20,20,.6);border-radius:0 8px 8px 0}
  /* État vide (nouvel utilisateur) */
  .ww-dash .dash-empty{display:none;padding:40px 26px 44px;text-align:center}
  .ww-dash .dash-empty .i{width:40px;height:40px;stroke-width:1.25;color:var(--ink-500)}
  .ww-dash .dash-empty h3{margin:14px 0 0;font-size:20px;font-weight:700}
  .ww-dash .dash-empty p{margin:8px auto 20px;max-width:420px;font-size:15px;color:var(--text-2);line-height:1.5}
  .ww-dash.is-empty .dash-draft, .ww-dash.is-empty .dash-tblwrap, .ww-dash.is-empty .dash-plan{display:none}
  .ww-dash.is-empty .dash-empty{display:block}
  .ww-dash .dash-sub--empty{display:none}
  .ww-dash.is-empty .dash-sub--full{display:none}
  .ww-dash.is-empty .dash-sub--empty{display:block}
  .ww-dash .dash-sticky-cta{display:none}
  .ww-dash .dash-tblwrap{overflow-y:hidden}
  /* v1.1 · Jaune PRO : toute action « Reprendre le chiffrage » */
  .ww-dash .dash-btn--pro{background:var(--yellow-500);color:var(--ink-900)}
  .ww-dash .dash-btn--pro:hover{background:var(--yellow-600)}
  .ww-dash.is-empty .only-full{display:none!important}
  .ww-dash .only-empty{display:none!important}
  .ww-dash.is-empty .only-empty{display:inline-flex!important}
  /* v1.1 · Indicateur « En fabrication » (projet avec ordre de fabrication en cours) */
  .ww-dash .dash-act{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
  .ww-dash .dash-head .dash-repere{flex:1 1 auto;min-width:min(100%,600px)}
  .ww-dash .dash-fab{box-sizing:border-box;height:58px;padding:0 22px 0 20px;border-radius:8px;border:1px solid var(--ink-900);background:#fff;color:var(--ink-900);display:inline-flex;align-items:center;gap:14px;text-decoration:none;max-width:100%;transition:background .15s ease-out}
  .ww-dash .dash-fab:hover{background:#F6F6F5}
  .ww-dash .dash-fab__dot{flex:none;width:10px;height:10px;border-radius:5px;background:var(--green-500);box-shadow:0 0 0 5px var(--point-halo)}
  .ww-dash .dash-fab__txt{display:grid;gap:3px;min-width:0}
  .ww-dash .dash-fab__k{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-700)}
  .ww-dash .dash-fab__n{font-size:16px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ww-dash .dash-fab .i{margin-left:6px}
  /* v1.2 · Plusieurs ordres de fabrication : le bloc devient un bouton qui ouvre une infobulle */
  .ww-dash .dash-fabw{position:relative;display:inline-flex;max-width:100%}
  .ww-dash .dash-fabw .dash-fab{width:100%;cursor:pointer;font:inherit}
  .ww-dash .dash-fab--many .dash-fab__chev{margin-left:auto;padding-left:6px;transition:transform .15s ease-out}
  .ww-dash .dash-fab[aria-expanded="true"]{background:var(--ink-900);color:#fff}
  .ww-dash .dash-fab[aria-expanded="true"] .dash-fab__k{color:var(--green-500)}
  .ww-dash .dash-fab[aria-expanded="true"] .dash-fab__chev{transform:rotate(180deg)}
  .ww-dash .dash-fabpop{position:absolute;top:calc(100% + 8px);left:0;z-index:60;width:max(100%,440px);background:#fff;border:1px solid var(--ink-900);border-radius:12px;box-shadow:0 24px 48px -16px rgba(20,20,20,.28),0 2px 6px rgba(20,20,20,.08);overflow:hidden}
  .ww-dash .dash-fabpop[hidden], .ww-dash .dash-fab--one[hidden], .ww-dash .dash-fabw[hidden]{display:none!important}
  .ww-dash .dash-fabpop__h{display:flex;justify-content:space-between;align-items:baseline;padding:14px 18px 10px;font-family:var(--font-mono);color:var(--ink-500)}
  .ww-dash .dash-fabpop__h span:first-child{font-size:11px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
  .ww-dash .dash-fabpop__h span:last-child{font-size:12px}
  .ww-dash .dash-fabpop__it{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:0 14px;align-items:center;padding:14px 18px;min-height:44px;border-top:1px solid var(--border-1);color:var(--ink-900);text-decoration:none}
  .ww-dash .dash-fabpop__it:hover{background:#F6F6F5}
  .ww-dash .dash-fabpop__dot{width:10px;height:10px;border-radius:5px;justify-self:center;background:var(--ink-900)}
  .ww-dash .dash-fabpop__b{display:grid;gap:6px;min-width:0}
  .ww-dash .dash-fabpop__n{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ww-dash .dash-fabpop__p{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-600)}
  .ww-dash .dash-fabpop__p>span:first-child{white-space:nowrap}
  .ww-dash .dash-fabpop__bar{flex:1;display:flex;gap:2px}
  .ww-dash .dash-fabpop__bar i{flex:1;height:4px;border-radius:1px;background:var(--ink-200)}
  .ww-dash .dash-fabpop__bar i.on{background:var(--green-500)}
  .ww-dash .dash-fabpop__d{text-align:right;white-space:nowrap;min-width:90px;font-family:var(--font-mono)}
  .ww-dash .dash-fabpop__d small{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500)}
  .ww-dash .dash-fabpop__d b{display:block;font-size:13px;font-weight:600}

  @media (max-width:1180px){
    .ww-dash .dash-two{grid-template-columns:minmax(0,1fr)}
    .ww-dash .dash-draft__grid{grid-template-columns:minmax(0,1fr)}
    .ww-dash .dash-quick{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
    .ww-dash .dash-engage__side{display:none}
  }
  @media (max-width:760px){
    .ww-dash{padding:16px 16px 96px}
    .ww-dash .dash-head{margin:4px 0 24px;gap:16px}
    .ww-dash .dash-head .dash-act{width:100%}
    .ww-dash .dash-head .dash-act>.dash-btn{display:none!important}
    .ww-dash .dash-fab{flex:1 1 100%}
    .ww-dash .dash-fab .i{margin-left:auto}
    .ww-dash .dash-fabw{width:100%}
    .ww-dash .dash-fabpop{width:100%}
    .ww-dash .dash-fabpop__it{grid-template-columns:12px minmax(0,1fr)}
    .ww-dash .dash-fabpop__d{display:none}
    .ww-dash .dash-h1{font-size:38px}
    .ww-dash .dash-sub{font-size:17px}
    .ww-dash .dash-repere{padding-left:24px}
    .ww-dash .dash-draft{margin-bottom:28px}
    .ww-dash .dash-draft__main, .ww-dash .dash-draft__side{padding:18px}
    .ww-dash .dash-draft__name{font-size:19px;white-space:normal}
    .ww-dash .dash-stepper{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
    .ww-dash .dash-stepper li{font-size:0}
    .ww-dash .dash-stepper li b{font-size:11px}
    .ww-dash .dash-stepper li.cur{font-size:12px}
    .ww-dash .dash-draft__saved{margin-left:0;flex-basis:100%}
    .ww-dash .dash-draft__actions .dash-btn{flex:1 1 auto;height:44px}
    /* Carrousel d'accès rapides */
    .ww-dash .dash-quick{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 8px;scrollbar-width:none}
    .ww-dash .dash-quick::-webkit-scrollbar{display:none}
    .ww-dash .dash-quick a{flex:0 0 78%;scroll-snap-align:start;padding:18px 16px;min-height:56px}
    .ww-dash .dash-quick .i{width:32px;height:32px}
    .ww-dash .dash-quick b{font-size:16px}
    .ww-dash .dash-card__head{padding:20px 18px 12px}
    .ww-dash .dash-h2{font-size:24px}
    .ww-dash .dash-h2--sec{margin:32px 0 12px}
    /* Tableau → liste clé/valeur */
    .ww-dash .dash-tblwrap{padding:0 18px 18px}
    .ww-dash table, .ww-dash thead, .ww-dash tbody, .ww-dash tr, .ww-dash td{display:block}
    .ww-dash table{min-width:0;border:0;border-radius:0;overflow:visible}
    .ww-dash thead{display:none}
    .ww-dash tr{border:1px solid var(--border-1);border-radius:8px;padding:14px 16px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center}
    .ww-dash tr+tr{margin-top:10px}
    .ww-dash td{padding:0;border:0!important;font-size:14px}
    .ww-dash td:first-child{grid-column:1/3}
    .ww-dash td:nth-child(2){color:var(--text-2)}
    .ww-dash td:nth-child(3){grid-column:1/2}
    .ww-dash td:nth-child(4){grid-column:2/3;grid-row:3;justify-self:end}
    .ww-dash .dash-plan{margin:0 18px 18px;grid-template-columns:auto minmax(0,1fr);padding:14px}
    .ww-dash .dash-plan .dash-link{grid-column:2;justify-self:start}
    .ww-dash .dash-photo__img{min-height:200px}
    .ww-dash .dash-photo__body{padding:20px 18px 22px}
    .ww-dash .dash-photo__body h3{font-size:22px}
    .ww-dash .dash-photo__body p{font-size:15px}
    /* Bandeau : photo au-dessus, texte en dessous, jamais superposés */
    .ww-dash .dash-engage{height:auto;background:var(--ink-900)}
    .ww-dash .dash-engage img{position:static;display:block;width:100%;height:180px}
    .ww-dash .dash-engage__veil{display:none}
    .ww-dash .dash-engage__txt{position:static;padding:20px 18px 24px;max-width:none}
    .ww-dash .dash-engage__txt strong{font-size:24px;white-space:normal}
    .ww-dash .dash-h2{white-space:normal}
    /* Action principale collante en bas */
    .ww-dash .dash-sticky-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--border-1)}
    .ww-dash .dash-sticky-cta .dash-btn{width:100%;height:48px;font-size:16px}
  }

/* ---- ecart handoff vs DS (a remonter a Claude Design) : ombre accent plus courte sur le dashboard ---- */
/* Charles 26/09 : le jaune DS (#ECF22E) est reserve au chiffrage EN COURS -> seul « Reprendre le chiffrage » (carte Chiffrage en cours) est jaune ;
   « Nouveau chiffrage » garde le vert accent du handoff. Charles 27/09 : avec un chiffrage en cours, l en-tete et le CTA collant
   affichent « Reprendre le chiffrage » (jaune, panier) a la place de « Nouveau chiffrage ». Ecart n°13 vs handoff. */
.ww-dash { --shadow-accent: 0 6px 16px -6px rgba(0,230,176,.55); }
#wrapwrap .ww-dash .dash-btn--resume { background: var(--yellow-500) !important; color: var(--text-on-yellow) !important; box-shadow: 0 6px 16px -6px rgba(236,242,46,.6); }
#wrapwrap .ww-dash .dash-btn--resume:hover { background: var(--yellow-600) !important; }
#wrapwrap .ww-dash .dash-btn--resume:focus-visible { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--yellow-700); }
/* ---- armor theme Odoo (h1/h2/h3/p/a/b en !important) et conteneur portail ---- */
/* theme portail mesure le 26/09 (web.assets_frontend.0.css) : `body:not(.editor_enable):not(.editor_has_snippets) #wrapwrap #wrap.o_portal_wrap{max-width:1140px!important}` (>=1200),
   `#wrapwrap #wrap.o_portal_wrap{padding-right:20px!important}`, `.o_portal_my_home .o_portal_docs.list-group{display:flex!important}` (+ <style id=idreva-cockpit-style>) -> specificite superieure obligatoire */
html body:has(#ww-nav) #wrapwrap #wrap.o_portal_wrap:has(.ww-dash) { max-width: none !important; width: auto !important; padding: 0 !important; margin-left: 0 !important; }
#wrapwrap .container.mb64:has(.ww-dash) { padding: 0 !important; max-width: none !important; margin: 0 !important; }
#wrapwrap #wrap .o_portal_my_home > .o_portal_docs.ww-dash__legacy, #wrapwrap .ww-dash__legacy { display: none !important; }
/* le markup du bloc « Aucun projet » est conditionnel (t-if) : un panier sans projet doit le voir (le prototype ne le montrait qu'en etat vide global) */
#wrapwrap .ww-dash .dash-empty { display: block !important; }
/* decision D (Charles 26/09) : pas de guide sur le tableau de bord -> bouton flottant de l'onboarding (vue 3321, insere par JS dans le premier h1) masque ici */
#wrapwrap .ww-dash .idreva-ob-fab, html body:has(.ww-dash) #idreva-ob-fab { display: none !important; }
#wrapwrap .ww-dash { padding: 12px 40px 64px; max-width: none; margin: 0; font-family: var(--font-sans); color: var(--ink-900); line-height: normal; -webkit-font-smoothing: antialiased; }
#wrapwrap .ww-dash *, #wrapwrap .ww-dash *::before, #wrapwrap .ww-dash *::after { box-sizing: border-box; }
.ww-dash svg.i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ww-dash svg.i--18 { width: 18px; height: 18px; }
#wrapwrap .ww-dash h1.dash-h1 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 52px !important; font-weight: 900 !important; letter-spacing: -.04em !important; line-height: .95 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash h2.dash-h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 28px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1.05 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash h2.dash-h2--sec { margin: 40px 0 16px !important; }
#wrapwrap .ww-dash .dash-photo__body h3 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1.05 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash .dash-empty h3 { margin: 14px 0 0 !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 700 !important; line-height: normal !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash p.dash-sub { margin: 10px 0 0 !important; font-family: var(--font-sans) !important; font-size: 22px !important; font-weight: 400 !important; line-height: normal !important; color: var(--ink-600) !important; }
#wrapwrap .ww-dash .dash-photo__body p { margin: 10px 0 18px !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 400 !important; line-height: 1.4 !important; color: var(--ink-600) !important; }
#wrapwrap .ww-dash .dash-draft__side p { margin: 14px 0 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-dash .dash-empty p { margin: 8px auto 0 !important; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-dash .dash-engage__side p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.45 !important; color: #fff !important; }
#wrapwrap .ww-dash a.dash-link { color: var(--green-700) !important; text-decoration: none !important; }
#wrapwrap .ww-dash a.dash-link--lg { font-size: 16px; }
#wrapwrap .ww-dash .dash-quick a { color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-dash a.dash-btn { text-decoration: none !important; }
#wrapwrap .ww-dash a.dash-fab { color: var(--ink-900) !important; text-decoration: none !important; }   /* v1.1 : le thème colore et souligne les liens */
#wrapwrap .ww-dash button.dash-fab { margin: 0; text-align: left; box-shadow: none; color: var(--ink-900) !important; }   /* v1.2 : bouton à plusieurs dossiers */
#wrapwrap .ww-dash button.dash-fab[aria-expanded="true"] { color: #fff !important; }
#wrapwrap .ww-dash a.dash-fabpop__it { color: var(--ink-900) !important; text-decoration: none !important; }
/* point d'un dossier = son ÉTAT, mêmes signes que la page atelier : vert + halo = pointé ces 3 derniers jours ; anneau encre = commencé,
   en attente ; anneau gris = pas commencé ; encre plein = terminé */
#wrapwrap .ww-dash .dash-fabpop__dot.is-run { background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo); }
#wrapwrap .ww-dash .dash-fabpop__dot.is-wait { background: #fff; box-shadow: inset 0 0 0 2px var(--ink-900); }
#wrapwrap .ww-dash .dash-fabpop__dot.is-next { background: #fff; box-shadow: inset 0 0 0 1.5px var(--ink-300); }
#wrapwrap .ww-dash .dash-fabpop__dot.is-done { background: var(--ink-900); }
#wrapwrap .ww-dash a.dash-fabpop__all { display: block; padding: 12px 18px; border-top: 1px solid var(--border-1); font-size: 14px !important; font-weight: 700 !important; color: var(--green-700) !important; text-decoration: none !important; }
#wrapwrap .ww-dash a.dash-btn--accent { color: var(--ink-900) !important; }
#wrapwrap .ww-dash a.dash-btn--ghost { color: var(--ink-900) !important; }
#wrapwrap .ww-dash .dash-engage__txt a { color: #fff !important; text-decoration: underline !important; text-decoration-color: var(--green-500) !important; }
#wrapwrap .ww-dash .dash-engage__txt strong, #wrapwrap .ww-dash .dash-engage__txt strong i { color: #fff !important; }
#wrapwrap .ww-dash .dash-engage__txt strong i { color: var(--green-500) !important; }
#wrapwrap .ww-dash td b, #wrapwrap .ww-dash .dash-quick b, #wrapwrap .ww-dash .dash-plan__v { color: var(--ink-900) !important; }
#wrapwrap .ww-dash table { margin: 0; }
@media (max-width: 760px) {
  #wrapwrap .ww-dash { padding: 16px 16px 96px; }
  #wrapwrap .ww-dash h1.dash-h1 { font-size: 38px !important; }
  #wrapwrap .ww-dash h2.dash-h2 { font-size: 24px !important; }
  #wrapwrap .ww-dash h2.dash-h2--sec { margin: 32px 0 12px !important; }
  #wrapwrap .ww-dash p.dash-sub { font-size: 17px !important; }
  #wrapwrap .ww-dash .dash-photo__body h3 { font-size: 22px !important; }
  #wrapwrap .ww-dash .dash-photo__body p { font-size: 15px !important; }
}
/* « Vos projets en cours » : liste de cartes (la mise en page téléphone, plus haut) dès que le BLOC est trop étroit pour 4 colonnes, quelle que soit
   la largeur d'écran (Charles 07/10 : de 1 180 à 1 600 px, menu + carte contact de 400 px, le tableau débordait de 640 px et les noms longs
   tenaient sur 5 lignes). Requête de conteneur : un navigateur qui ne la connaît pas garde le tableau défilant (comportement d'avant). */
#wrapwrap .ww-dash .dash-tblwrap { container-type: inline-size; }
@container (max-width: 880px) {
  #wrapwrap .ww-dash .dash-tblwrap table, #wrapwrap .ww-dash .dash-tblwrap thead, #wrapwrap .ww-dash .dash-tblwrap tbody,
  #wrapwrap .ww-dash .dash-tblwrap tr, #wrapwrap .ww-dash .dash-tblwrap td { display: block; }
  #wrapwrap .ww-dash .dash-tblwrap table { min-width: 0; border: 0; border-radius: 0; overflow: visible; }
  #wrapwrap .ww-dash .dash-tblwrap thead { display: none; }
  #wrapwrap .ww-dash .dash-tblwrap tr { border: 1px solid var(--border-1); border-radius: 8px; padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; align-items: center; }
  #wrapwrap .ww-dash .dash-tblwrap tr + tr { margin-top: 10px; }
  #wrapwrap .ww-dash .dash-tblwrap td { padding: 0; border: 0 !important; font-size: 14px; }
  #wrapwrap .ww-dash .dash-tblwrap td:first-child { grid-column: 1 / 3; }
  #wrapwrap .ww-dash .dash-tblwrap td:nth-child(2) { color: var(--text-2); }
  #wrapwrap .ww-dash .dash-tblwrap td:nth-child(3) { grid-column: 1 / 2; }
  #wrapwrap .ww-dash .dash-tblwrap td:nth-child(4) { grid-column: 2 / 3; grid-row: 3; justify-self: end; }
}


/* ===== news.css ===== */
/* ===== news.css — actualites /my/news + bloc Nouveautes du tableau de bord (GENERE par news_build.py depuis ENTREE/actualites-v1.0, ne pas editer).
   LOT G du prototype : classes du tableau de bord -> dash-*, autres -> nw-* ; tout sous .ww-dash ; armor theme. ===== */
/* ===== LOT G · Actualités ===== */
  .ww-dash .nw-view{display:none}.ww-dash .nw-view.nw-is-on{display:block}
  .ww-dash .nw-pills{display:flex;gap:8px;flex-wrap:wrap;margin:0;padding:0;list-style:none}
  .ww-dash .nw-pill{appearance:none;border:1px solid var(--border-1);background:#fff;color:var(--ink-700);height:36px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:700;display:inline-flex;align-items:center;gap:8px;cursor:pointer;white-space:nowrap}
  .ww-dash .nw-pill small{font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--text-3)}
  .ww-dash .nw-pill:hover{border-color:var(--ink-900)}
  .ww-dash .nw-pill[aria-pressed="true"]{background:var(--ink-900);color:#fff;border-color:var(--ink-900)}
  .ww-dash .nw-pill[aria-pressed="true"] small{color:var(--ink-300)}
  .ww-dash .nw-tag{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid var(--border-2,#C4C4C1);color:var(--ink-900);white-space:nowrap}
  .ww-dash .nw-tag--filled{background:var(--ink-900);color:#fff;border-color:var(--ink-900)}
  .ww-dash .nw-meta{font-family:var(--font-mono);font-size:12px;color:var(--text-3);white-space:nowrap}
  .ww-dash .nw-news-head{margin:8px 0 24px}
  .ww-dash .nw-news-h1{margin:10px 0 0;font-size:44px;font-weight:900;letter-spacing:-.04em;line-height:.95}
  .ww-dash .nw-news-h1 i, .ww-dash .dash-h2 i{font-style:normal;color:var(--green-500)}
  .ww-dash .nw-news-lede{margin:12px 0 0;font-size:17px;color:var(--ink-600);max-width:560px;line-height:1.5}
  .ww-dash .nw-featured{display:grid;grid-template-columns:minmax(0,1fr) 400px;margin-top:20px;overflow:hidden;text-align:left;cursor:pointer;color:inherit;text-decoration:none;transition:box-shadow .15s ease-out}
  .ww-dash .nw-featured:hover{box-shadow:0 1px 2px rgba(20,20,20,.06),0 12px 28px -12px rgba(20,20,20,.24)}
  .ww-dash .nw-featured__body{padding:30px 32px 32px;display:grid;gap:14px;align-content:center}
  .ww-dash .nw-featured__body h2{margin:0;font-size:30px;font-weight:900;letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
  .ww-dash .nw-featured__body p{margin:0;font-size:16px;line-height:1.5;color:var(--ink-700)}
  .ww-dash .nw-featured__img{position:relative;min-height:300px;background:var(--ink-800)}
  .ww-dash .nw-featured__img img, .ww-dash .nw-ncard__img img, .ww-dash .nw-art__hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .ww-dash .nw-ph{position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-400);line-height:1.6}
  .ww-dash .nw-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
  .ww-dash .nw-ngrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px}
  .ww-dash .nw-ncard{display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;min-width:0;text-align:left;cursor:pointer;color:inherit;text-decoration:none;transition:box-shadow .15s ease-out}
  .ww-dash .nw-ncard:hover{box-shadow:0 1px 2px rgba(20,20,20,.06),0 12px 28px -12px rgba(20,20,20,.24)}
  .ww-dash .nw-ncard__img{position:relative;height:170px;background:var(--ink-800)}
  .ww-dash .nw-ncard__body{padding:18px 20px 22px;display:grid;gap:10px;align-content:start}
  .ww-dash .nw-ncard__body h3{margin:0;font-size:19px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
  .ww-dash .nw-ncard__body p{margin:0;font-size:14px;line-height:1.45;color:var(--text-2)}
  .ww-dash .nw-ncard[hidden]{display:none}
  .ww-dash .nw-empty-news{display:none;margin-top:20px;padding:40px 24px;text-align:center}
  .ww-dash .nw-empty-news h3{margin:12px 0 6px;font-size:20px}.ww-dash .nw-empty-news p{margin:0;color:var(--text-2);font-size:15px}
  /* Article */
  .ww-dash .nw-art{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;align-items:start;max-width:1160px}
  .ww-dash .nw-art__h1{margin:16px 0 0;font-size:44px;font-weight:900;letter-spacing:-.04em;line-height:.98;text-wrap:balance}
  .ww-dash .nw-art__lede{margin:16px 0 0;font-size:19px;line-height:1.45;color:var(--ink-600);text-wrap:pretty}
  .ww-dash .nw-art__hero{position:relative;height:380px;border-radius:12px;overflow:hidden;background:var(--ink-800);margin-top:28px}
  .ww-dash .nw-art__body{display:grid;gap:18px;margin-top:32px;max-width:680px}
  .ww-dash .nw-art__body p{margin:0;font-size:17px;line-height:1.6;color:var(--ink-800)}
  .ww-dash .nw-art__nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:40px;padding-top:20px;border-top:1px solid var(--border-1)}
  .ww-dash .nw-art__nav a{display:grid;gap:4px;max-width:46%;text-decoration:none;color:inherit}
  .ww-dash .nw-art__nav a.nw-next{text-align:right;justify-items:end}
  .ww-dash .nw-art__nav a b{font-size:15px;line-height:1.3}
  .ww-dash .nw-art__nav a span{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
  .ww-dash .nw-aside{display:grid;gap:16px;position:sticky;top:84px}
  .ww-dash .nw-aside .dash-card{padding:22px 24px}
  .ww-dash .nw-aside .dash-card--sunken{background:var(--ink-50);box-shadow:none;border:1px solid var(--border-1);padding:20px 24px;display:grid;gap:10px;justify-items:start;text-align:left}
  .ww-dash .nw-aside .dash-card--sunken p{margin:0;font-size:14px;line-height:1.5;color:var(--ink-700)}
  .ww-dash .nw-prod__ref{font-family:var(--font-mono);font-size:12px;color:var(--text-3);margin-top:14px}
  .ww-dash .nw-prod__name{font-size:20px;font-weight:700;letter-spacing:-.02em;margin-top:4px}
  .ww-dash .nw-prod__from{font-size:14px;color:var(--text-2);margin-top:4px}.ww-dash .nw-prod__from b{font-family:var(--font-mono);color:var(--ink-900);font-weight:600}
  .ww-dash .nw-prod__btns{display:grid;gap:8px;margin-top:14px}
  .ww-dash .dash-btn--secondary{background:#fff;color:var(--ink-900);border:1px solid var(--border-2,#C4C4C1)}.ww-dash .dash-btn--secondary:hover{background:var(--ink-50)}
  .ww-dash .dash-btn--s{height:32px;padding:0 12px;font-size:14px}
  .ww-dash .nw-facts{display:grid;margin-top:10px}
  .ww-dash .nw-facts div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:10px 0;border-bottom:1px solid var(--border-1);font-size:14px}
  .ww-dash .nw-facts div span:first-child{color:var(--text-2)}.ww-dash .nw-facts div span:last-child{font-family:var(--font-mono);font-size:13px;text-align:right}
  /* Bloc Nouveautés du tableau de bord */
  .ww-dash .nw-newsblock{margin-top:40px}
  .ww-dash .nw-newsblock__head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:16px}
  .ww-dash .nw-newsblock .dash-quick a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:start;padding:16px}
  .ww-dash .nw-nb__img{position:relative;display:block;width:96px;height:96px;border-radius:8px;overflow:hidden;background:var(--ink-800)}
  .ww-dash .nw-nb__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .ww-dash .nw-nb__img .nw-ph{font-size:9px;padding:8px}
  .ww-dash .nw-nb__t{display:grid;gap:5px;min-width:0}
  .ww-dash .nw-nb__k{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--green-700)}
  .ww-dash .nw-nb__title{font-size:16px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
  .ww-dash .nw-newsblock .dash-quick .dash-chev{display:none}
  @media (max-width:1180px){.ww-dash .nw-featured, .ww-dash .nw-art{grid-template-columns:minmax(0,1fr)}.ww-dash .nw-featured__img{order:-1;min-height:220px}.ww-dash .nw-ngrid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.ww-dash .nw-aside{position:static}}
  @media (max-width:760px){
    .ww-dash .nw-news-h1{font-size:34px}.ww-dash .nw-news-lede{font-size:15px}
    .ww-dash .nw-pills{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px 6px;scrollbar-width:none}.ww-dash .nw-pills::-webkit-scrollbar{display:none}
    .ww-dash .nw-featured__img{min-height:200px}.ww-dash .nw-featured__body{padding:20px 18px 22px}.ww-dash .nw-featured__body h2{font-size:24px}
    .ww-dash .nw-ncard__img{height:160px}
    .ww-dash .nw-art__h1{font-size:32px}.ww-dash .nw-art__lede{font-size:16px}.ww-dash .nw-art__hero{height:220px}.ww-dash .nw-art__body p{font-size:16px}
    .ww-dash .nw-art__nav a{max-width:100%}
    .ww-dash .nw-newsblock .dash-quick a{flex:0 0 86%;display:grid}
    .ww-dash .nw-newsblock .dash-quick{display:flex}
    
  }

  
/* ---- armor theme Odoo pour la page /my/news et le bloc Nouveautes (h1/h2/h3/p/a en !important) ---- */
#wrapwrap .ww-dash h1.nw-news-h1 { margin: 10px 0 0 !important; font-family: var(--font-sans) !important; font-size: 44px !important; font-weight: 900 !important; letter-spacing: -.04em !important; line-height: .95 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash h1.nw-art__h1 { margin: 16px 0 0 !important; font-family: var(--font-sans) !important; font-size: 44px !important; font-weight: 900 !important; letter-spacing: -.04em !important; line-height: .98 !important; color: var(--ink-900) !important; text-wrap: balance; }
#wrapwrap .ww-dash p.nw-news-lede { margin: 12px 0 0 !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--ink-600) !important; max-width: 560px; }
#wrapwrap .ww-dash p.nw-art__lede { margin: 16px 0 0 !important; font-family: var(--font-sans) !important; font-size: 19px !important; font-weight: 400 !important; line-height: 1.45 !important; color: var(--ink-600) !important; }
#wrapwrap .ww-dash .nw-featured__body h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 30px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1.02 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-featured__body p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--ink-700) !important; }
#wrapwrap .ww-dash .nw-ncard__body h3 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 19px !important; font-weight: 700 !important; letter-spacing: -.02em !important; line-height: 1.2 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-ncard__body p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.45 !important; color: var(--text-2) !important; }
/* le prototype masque .empty-news par CSS et l affiche par JS ; ici le markup est conditionnel (t-if) -> toujours visible quand present */
#wrapwrap .ww-dash .nw-empty-news { display: block !important; }
#wrapwrap .ww-dash .nw-empty-news h3 { margin: 12px 0 6px !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 700 !important; line-height: normal !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-empty-news p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 400 !important; line-height: normal !important; color: var(--text-2) !important; }
#wrapwrap .ww-dash .nw-art__body p, #wrapwrap .ww-dash .nw-art__body li { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 400 !important; line-height: 1.6 !important; color: var(--ink-800) !important; }
#wrapwrap .ww-dash .nw-art__body h2 { margin: 10px 0 0 !important; font-family: var(--font-sans) !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: -.03em !important; line-height: 1.1 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-art__body h3 { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 700 !important; line-height: 1.2 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-art__body ul, #wrapwrap .ww-dash .nw-art__body ol { margin: 0; padding-left: 22px; display: grid; gap: 6px; }
#wrapwrap .ww-dash .nw-art__body img { max-width: 100%; height: auto; border-radius: 8px; }
#wrapwrap .ww-dash .nw-art__body a { color: var(--green-700) !important; text-decoration: underline !important; }
#wrapwrap .ww-dash .nw-art__body strong, #wrapwrap .ww-dash .nw-art__body b { color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-aside .dash-card--sunken p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--ink-700) !important; }
#wrapwrap .ww-dash a.nw-featured, #wrapwrap .ww-dash a.nw-ncard, #wrapwrap .ww-dash .nw-art__nav a { color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-dash .nw-meta, #wrapwrap .ww-dash .nw-art__nav a span, #wrapwrap .ww-dash .nw-prod__ref, #wrapwrap .ww-dash .nw-pill small { color: var(--text-3) !important; }
#wrapwrap .ww-dash a.nw-pill { color: var(--ink-700) !important; text-decoration: none !important; }
#wrapwrap .ww-dash a.nw-pill[aria-pressed="true"] { color: #fff !important; }
#wrapwrap .ww-dash a.nw-pill[aria-pressed="true"] small { color: var(--ink-300) !important; }
#wrapwrap .ww-dash .nw-tag { color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-tag--filled { color: #fff !important; }
#wrapwrap .ww-dash .nw-nb__k { color: var(--green-700) !important; }
/* pastille « Nouveau » du dernier article (bloc Nouveautes, Charles 13/10) ; flex 0 : .dash-quick span met flex 1 a tous les span */
#wrapwrap .ww-dash .nw-nb__k { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
#wrapwrap .ww-dash .nw-nb__new { flex: 0 0 auto; width: auto; display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; background: #00C497; color: var(--ink-900) !important; font-family: var(--font-sans); font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: none; line-height: 1; }
#wrapwrap .ww-dash .nw-nb__title, #wrapwrap .ww-dash .nw-art__nav a b, #wrapwrap .ww-dash .nw-prod__from b, #wrapwrap .ww-dash .nw-prod__name { color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-facts div span:first-child, #wrapwrap .ww-dash .nw-prod__from { color: var(--text-2) !important; }
#wrapwrap .ww-dash a.dash-btn--secondary { color: var(--ink-900) !important; }
#wrapwrap .ww-dash .nw-ph { color: var(--ink-400) !important; }
#wrapwrap .ww-dash .nw-login { padding: 40px; font-family: var(--font-sans); font-size: 16px; }
@media (max-width: 760px) {
  #wrapwrap .ww-dash h1.nw-news-h1 { font-size: 34px !important; }
  #wrapwrap .ww-dash h1.nw-art__h1 { font-size: 32px !important; }
  #wrapwrap .ww-dash p.nw-news-lede { font-size: 15px !important; }
  #wrapwrap .ww-dash p.nw-art__lede { font-size: 16px !important; }
  #wrapwrap .ww-dash .nw-featured__body h2 { font-size: 24px !important; }
  #wrapwrap .ww-dash .nw-art__body p, #wrapwrap .ww-dash .nw-art__body li { font-size: 16px !important; }
}


/* ===== quote.css ===== */
/* ===== quote.css — chiffrage lot C1 (handoff chiffrage-v1.0 : D1 liste, D2/D6 panier, M1/M2/M6 mobile) : classes qt-* sur socle dash-* (racine ww-dash ww-quote).
   GENERE par quote_build.py, ne pas editer. ===== */
/* --- conteneur boutique (/shop/cart) : meme largeur / fond que le portail sous la navigation --- */
html body:has(#ww-nav) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-quote { max-width: none !important; width: auto !important; margin: 0 !important; padding: 12px 40px 64px !important; }
html body:has(#ww-nav) #wrapwrap:has(.ww-quote) { background-color: var(--surface-sunken) !important; }
html body:has(#ww-nav) #wrapwrap #wrap.js_sale:has(.ww-quote) { margin: 0 !important; padding: 0 !important; max-width: none !important; }
#wrapwrap .ww-quote .qt-qty__btn .fa { font-family: var(--font-sans) !important; font-weight: 700; font-size: 16px; line-height: 1; }
#wrapwrap .ww-quote .qt-qty__btn .fa-minus::before { content: "−" !important; }
#wrapwrap .ww-quote .qt-qty__btn .fa-plus::before { content: "+" !important; }
#wrapwrap .ww-quote .qt-mono, #wrapwrap .ww-quote .nw-meta { font-family: var(--font-mono); }
/* le theme impose a TOUT lien du panier `.oe_website_sale .oe_cart a{text-transform:uppercase;border-radius:999px;color:#fff;padding:12px 32px !important}` (mesure 27/09) */
html body #wrapwrap .ww-quote .oe_cart a { text-transform: none !important; border-radius: 0 !important; padding: 0 !important; background: transparent !important; color: var(--ink-900) !important; box-shadow: none !important; }
html body #wrapwrap .ww-quote .oe_cart a.dash-btn { border-radius: 8px !important; padding: 0 16px !important; }
html body #wrapwrap .ww-quote .oe_cart a.dash-btn--secondary { background: #fff !important; border: 1px solid var(--border-2, #C4C4C1); }
html body #wrapwrap .ww-quote .oe_cart a.dash-btn--secondary:hover { background: var(--ink-50) !important; }
html body #wrapwrap .ww-quote .oe_cart a.dash-btn--accent { background: var(--green-500) !important; }
html body #wrapwrap .ww-quote .oe_cart a.dash-btn--resume { background: var(--yellow-500) !important; }
html body #wrapwrap .ww-quote .oe_cart a.qt-act { color: var(--ink-700) !important; }
html body #wrapwrap .ww-quote .oe_cart a.qt-qty__btn { border-radius: 0 !important; }
/* cartes de categorie et fiche produit chargee dans la page : le remise a zero des liens ci-dessus ne doit pas les toucher */
html body #wrapwrap .ww-quote .oe_cart a.qt-cat { padding: 16px !important; border-radius: 12px !important; background: var(--surface-card) !important; color: var(--ink-900) !important; }
@media (max-width: 760px) { html body #wrapwrap .ww-quote .oe_cart a.qt-cat { padding: 12px !important; } }
/* boutons de quantite de la fiche injectee : regles dans pv.css (meme specificite, placees apres) */
/* le theme impose a TOUT paragraphe font-size 18 px / font-weight 300 / line-height en !important (mesure 28/09) */
html body #wrapwrap .ww-quote p { font-weight: 400 !important; line-height: 1.5 !important; }
html body #wrapwrap .ww-quote p.qt-cats__foot { font-size: 13px !important; color: var(--text-3) !important; }
html body #wrapwrap .ww-quote .qt-step2__empty p { font-size: 14px !important; }
html body #wrapwrap .ww-quote p.qt-rail__hint { font-size: 15px !important; }
html body #wrapwrap .ww-quote p.qt-config__wait { font-size: 15px !important; }
html body #wrapwrap .ww-quote.qc p.qc-lede { font-size: 17px !important; line-height: 1.55 !important; }
html body #wrapwrap .ww-quote.qc .qc-steps__body p { font-size: 14px !important; line-height: 1.55 !important; }
html body #wrapwrap .ww-quote.qc .qc-callout p { font-size: 15px !important; line-height: 1.55 !important; }
#wrapwrap .ww-quote .nw-meta { font-size: 12px; color: var(--text-3) !important; letter-spacing: .02em; }
/* --- en-tete + stepper (D2) --- */
#wrapwrap .ww-quote .qt-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin: 8px 0 20px; }
#wrapwrap .ww-dash .qt-row[hidden], #wrapwrap .ww-dash .qt-empty[hidden] { display: none !important; }   /* recherche des listes (29/09) */
/* page devis : meme espace sous le fil d'Ariane que la fiche article (28 px) — le bloc portail d'Odoo (ancien fil d'Ariane, masque)
   gardait sa marge de 16 px (Charles 29/09 : « beaucoup de vide entre le bouton et le fil d'Ariane ») */
html body:has(#order.ww-order) #wrapwrap main > .o_portal.container { margin-top: 0 !important; }
#wrapwrap .ww-quote h1.qt-h1 { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 36px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-quote .qt-badge { margin-top: 6px; }
#wrapwrap .ww-quote .dash-badge--muted { background: var(--ink-100); color: var(--ink-700); }
#wrapwrap .ww-quote .dash-badge--muted::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--ink-500); }
#wrapwrap .ww-quote .dash-badge--info { background: #E6F0FF; color: #1D4ED8; }
#wrapwrap .ww-quote .dash-badge--info::before { background: #3B82F6; }
#wrapwrap .ww-quote .dash-badge--active::before { background: var(--green-500); }
#wrapwrap .ww-quote .qt-stepper { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 24px; padding: 0; list-style: none; }
#wrapwrap .ww-quote .qt-stepper li { position: relative; padding-top: 34px; font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-quote .qt-stepper li::before { content: ""; position: absolute; left: 30px; right: 0; top: 11px; height: 1.5px; background: var(--ink-200); }
#wrapwrap .ww-quote .qt-stepper li:last-child::before { display: none; }
#wrapwrap .ww-quote .qt-stepper__dot { position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 12px; border: 1.5px solid var(--ink-300); background: #fff; color: var(--ink-700); font-family: var(--font-mono); font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
#wrapwrap .ww-quote .qt-stepper li.is-cur .qt-stepper__dot { background: var(--green-500); border-color: var(--green-500); color: var(--ink-900); box-shadow: 0 0 0 4px var(--point-halo); }
#wrapwrap .ww-quote .qt-stepper li b { display: block; font-size: 14px; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-stepper li.is-cur b { font-weight: 700; }
#wrapwrap .ww-quote .qt-stepper li small { display: block; margin-top: 2px; font-family: var(--font-mono); font-size: 11px; color: var(--text-3); }
/* --- grille page --- */
#wrapwrap .ww-quote .qt-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
#wrapwrap .ww-quote .qt-main { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); min-width: 0; }
#wrapwrap .ww-quote .qt-cartpart { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); min-width: 0; }   /* Solutions / Votre chiffrage / Livraison espacees (Charles 28/09 : « collees ») */
#wrapwrap .ww-quote .qt-aside { display: grid; gap: 16px; position: sticky; top: 84px; grid-template-columns: minmax(0, 1fr); min-width: 0; }
#wrapwrap .ww-quote .dash-card { padding: 0; }
#wrapwrap .ww-quote h2.qt-h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 18px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.2 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-quote .qt-count { font-family: var(--font-mono); font-weight: 500; color: var(--text-3); margin-left: 6px; }
#wrapwrap .ww-quote .qt-sol__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 20px 24px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-sol__t { display: grid; gap: 6px; min-width: 0; }
#wrapwrap .ww-quote .qt-sol__step { display: block; }
#wrapwrap .ww-quote h2.qt-sol__eh { margin: 4px 0 6px !important; }
#wrapwrap .ww-quote .qt-sol__cnt { justify-self: start; display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 10px; border-radius: 999px; background: var(--ink-100); font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-2); }
#wrapwrap .ww-quote .qt-sol__cnt b { margin: 0; font-weight: 600; color: var(--ink-900); }   /* titre d'etape, comme « Ou livrer ? » (Charles 09/10) */
/* --- lignes = solutions (table native restylee : <tr> obligatoire pour le JS d Odoo) --- */
#wrapwrap .ww-quote table.qt-lines { width: 100%; border-collapse: collapse; margin: 0; }
#wrapwrap .ww-quote table.qt-lines, #wrapwrap .ww-quote table.qt-lines > tbody { display: block; width: 100%; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line { display: grid; }   /* la ligne reste un <tr> (JS natif closest('tr')) mais en grille : miniature a gauche (handoff D2) */
#wrapwrap .ww-quote tr.qt-line { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto auto; gap: 18px; align-items: start; padding: 22px 24px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote tr.qt-line:last-child { border-bottom: 0; }
#wrapwrap .ww-quote tr.qt-line.optional_product { background: var(--ink-50); }
#wrapwrap .ww-quote tr.qt-line > td { display: block; padding: 0 !important; border: 0 !important; vertical-align: top; }
#wrapwrap .ww-quote .qt-thumb { position: relative; display: block; width: 88px; height: 88px; border-radius: 8px; overflow: hidden; background: #fff; }
#wrapwrap .ww-quote .qt-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-quote .qt-thumb__ph { position: absolute; inset: 0; background: var(--ink-50, #F6F6F5); display: grid; place-items: center; font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); text-align: center; padding: 6px; }
#wrapwrap .ww-quote .qt-thumb--xs { width: 36px; height: 36px; border-radius: 6px; flex: none; }
#wrapwrap .ww-quote .qt-thumb--xs .qt-thumb__ph { font-size: 7px; padding: 2px; letter-spacing: 0; }
#wrapwrap .ww-quote .qt-line__ref { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#wrapwrap .ww-quote .qt-line__body { min-width: 0; }
#wrapwrap .ww-quote .qt-line__name { overflow-wrap: anywhere; margin-top: 6px; font-size: 17px; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-line__sum { overflow-wrap: anywhere; margin-top: 6px; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.7; color: var(--ink-700); }
#wrapwrap .ww-quote .qt-line__acts { display: flex; gap: 18px; margin-top: 12px; flex-wrap: wrap; }
#wrapwrap .ww-quote a.qt-act { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 700; color: var(--ink-700) !important; text-decoration: none !important; }
#wrapwrap .ww-quote a.qt-act:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-quote .qt-line__qty { padding-top: 22px !important; }
#wrapwrap .ww-quote .qt-qty { display: inline-flex; align-items: center; height: 44px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; overflow: hidden; width: auto; }
#wrapwrap .ww-quote a.qt-qty__btn { width: 36px; height: 42px; display: inline-flex; align-items: center; justify-content: center; color: var(--ink-900) !important; text-decoration: none !important; font-size: 13px; }
#wrapwrap .ww-quote a.qt-qty__btn:hover { background: var(--ink-50); }
#wrapwrap .ww-quote input.qt-qty__in, #wrapwrap .ww-quote span.qt-qty__in { width: 40px; height: 42px; border: 0; text-align: center; font-family: var(--font-sans); font-size: 16px; font-weight: 700; color: var(--ink-900); background: transparent; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
#wrapwrap .ww-quote .qt-line__price { text-align: right; padding-top: 24px !important; min-width: 120px; }
#wrapwrap .ww-quote .qt-line__price b { display: block; font-family: var(--font-mono); font-size: 17px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-quote .qt-line__price small { display: block; margin-top: 4px; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-quote .qt-empty { padding: 40px 24px 44px; text-align: center; }
#wrapwrap .ww-quote .qt-empty svg.i { width: 40px; height: 40px; stroke-width: 1.25; color: var(--ink-500); }
#wrapwrap .ww-quote .qt-empty h3 { margin: 14px 0 0 !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 700 !important; line-height: normal !important; color: var(--ink-900) !important; }
#wrapwrap .ww-quote .qt-empty p { margin: 8px auto 20px !important; max-width: 460px; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-quote div.qt-empty.js_cart_lines { padding: 40px 24px 44px; }
/* --- livraison --- */
#wrapwrap .ww-quote .qt-ship { padding: 20px 24px 22px; }
#wrapwrap .ww-quote .qt-ship__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 14px; }
#wrapwrap .ww-quote .qt-lbl { display: block; font-size: 14px; font-weight: 700; color: var(--ink-900); margin-bottom: 8px; }
#wrapwrap .ww-quote .qt-ship__grid b { display: block; font-size: 15px; font-weight: 500; color: var(--ink-900); min-height: 44px; padding: 11px 14px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; }
#wrapwrap .ww-quote .qt-ship__grid small { display: block; margin-top: 6px; font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-quote p.qt-ship__note { margin: 14px 0 0 !important; font-family: var(--font-sans) !important; font-size: 13px !important; line-height: 1.5 !important; color: var(--text-3) !important; }
/* --- rail --- */
#wrapwrap .ww-quote .qt-rail { padding: 20px 20px 22px; }
#wrapwrap .ww-quote .qt-rail--empty p { margin: 12px 0 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-quote .qt-mini { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-mini__row { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-mini__name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-quote .qt-mini__name b { font-family: var(--font-mono); font-weight: 500; color: var(--ink-700); }
#wrapwrap .ww-quote .qt-mini__row > b.qt-mono { font-size: 14px; font-weight: 500; white-space: nowrap; }
#wrapwrap .ww-quote #cart_total { margin: 0; }
#wrapwrap .ww-quote .qt-totals__row { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0 0; font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-quote .qt-totals__row b { font-weight: 500; color: var(--ink-900); font-size: 14px; }
#wrapwrap .ww-quote .qt-totals__row--disc b { color: var(--green-700); }
#wrapwrap .ww-quote .qt-totals__total { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-1); font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-totals__total b { margin-left: auto; font-family: var(--font-mono); font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
#wrapwrap .ww-quote .qt-totals__total small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-quote p.qt-totals__note { margin: 10px 0 0 !important; font-family: var(--font-sans) !important; font-size: 12.5px !important; line-height: 1.45 !important; color: var(--text-3) !important; }
#wrapwrap .ww-quote .qt-rail__acts { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin-top: 16px; }
#wrapwrap .ww-quote .qt-rail__acts .dash-btn { width: 100%; }
#wrapwrap .ww-quote .qt-rail__saved { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-family: var(--font-mono); font-size: 11px; color: var(--text-3); margin-top: 4px; }
#wrapwrap .ww-quote .qt-doubt { padding: 20px 24px 22px; display: grid; gap: 8px; justify-items: start; background: var(--ink-50); box-shadow: none; border: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-doubt b { font-size: 17px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-doubt p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--ink-700) !important; }
#wrapwrap .ww-quote a.dash-btn--secondary { background: #fff; color: var(--ink-900) !important; border: 1px solid var(--border-2, #C4C4C1); text-decoration: none !important; }
#wrapwrap .ww-quote a.dash-btn--secondary:hover { background: var(--ink-50); }
#wrapwrap .ww-quote a.dash-btn--s { height: 32px; padding: 0 12px; font-size: 14px; }
#wrapwrap .ww-quote a.dash-btn--resume { background: var(--yellow-500) !important; color: var(--text-on-yellow) !important; box-shadow: 0 6px 16px -6px rgba(236,242,46,.6); }
#wrapwrap .ww-quote a.dash-btn--resume:hover { background: var(--yellow-600) !important; }
#wrapwrap .ww-quote .qt-sticky { display: none; }
/* --- liste D1 --- */
#wrapwrap .ww-quote .qt-list__head { margin-bottom: 28px; }
#wrapwrap .ww-quote .qt-cur { margin-bottom: 36px; }
#wrapwrap .ww-quote .qt-cur .dash-draft__main, #wrapwrap .ww-quote .qt-cur .dash-draft__side { padding: 24px 26px; }
#wrapwrap .ww-quote .qt-list__bar { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
#wrapwrap .ww-quote .qt-list__tools { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
#wrapwrap .ww-quote .qt-filters { display: inline-flex; gap: 4px; padding: 4px; border-radius: 10px; background: var(--ink-100); }
#wrapwrap .ww-quote .qt-filters a { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 8px; font-size: 14px; font-weight: 700; color: var(--ink-700) !important; text-decoration: none !important; }
#wrapwrap .ww-quote .qt-filters a[aria-pressed="true"] { background: #fff; color: var(--ink-900) !important; box-shadow: 0 1px 2px rgba(20,20,20,.08); }
#wrapwrap .ww-quote .qt-filters a small { font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: var(--text-3); }
#wrapwrap .ww-quote .qt-search { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; min-width: 280px; color: var(--text-3); margin: 0; font-weight: 400; }
#wrapwrap .ww-quote .qt-search input { border: 0; outline: 0; flex: 1 1 auto; min-width: 0; font-family: var(--font-sans); font-size: 15px; color: var(--ink-900); background: transparent; }
#wrapwrap .ww-quote .qt-rows { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
#wrapwrap .ww-quote a.qt-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(112px, max-content) minmax(136px, max-content) 172px minmax(176px, max-content); gap: 20px; align-items: center; padding: 20px 24px; color: var(--ink-900) !important; text-decoration: none !important; transition: box-shadow .15s ease-out; }
#wrapwrap .ww-quote a.qt-row:hover { box-shadow: 0 1px 2px rgba(20,20,20,.06), 0 12px 28px -12px rgba(20,20,20,.24); }
#wrapwrap .ww-quote .qt-row__title { display: block; font-size: 17px; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; }
#wrapwrap .ww-quote .qt-row__meta { margin-top: 6px; font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-quote .qt-row__meta .qt-mono { font-size: 12px; color: var(--ink-700); }
#wrapwrap .ww-quote .qt-row__proj b { display: block; font-size: 15px; font-weight: 700; }
#wrapwrap .ww-quote .qt-row__proj small { display: block; margin-top: 4px; font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-quote .qt-row__date { white-space: nowrap; }
#wrapwrap .ww-quote .qt-row__date-alt { display: none !important; }
#wrapwrap .ww-quote .qt-lbl-s { display: block; font-size: 11px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--text-3); margin-bottom: 4px; }
#wrapwrap .ww-quote .qt-row__date b { font-size: 13px; font-weight: 500; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-row__amount { text-align: right; white-space: nowrap; }
#wrapwrap .ww-quote .qt-row__amount b { font-family: var(--font-mono); font-size: 16px; font-weight: 600; }
#wrapwrap .ww-quote .qt-row__amount small { margin-left: 6px; font-family: var(--font-mono); font-size: 11px; color: var(--text-3); }
#wrapwrap .ww-quote .qt-row__act { display: flex; justify-content: flex-end; }
#wrapwrap .ww-quote .qt-row .dash-btn { pointer-events: none; }
/* --- tablette --- */

/* ---- Charles 27/09 : polices des cartes de devis +10 % (panier, page devis, listes, rail) — ecart n°20 vs handoff ---- */
#wrapwrap .ww-quote .qt-line__ref .nw-meta { font-size: 13.2px; }
#wrapwrap .ww-quote .qt-line__name { font-size: 18.7px; }
#wrapwrap .ww-quote .qt-line__sum { font-size: 13.75px; }
#wrapwrap .ww-quote .qt-line__desc { margin-top: 6px; white-space: pre-line; overflow-wrap: anywhere; font-size: 14px; line-height: 1.55; color: var(--text-2); }   /* descriptif de la ligne, comme le PDF (29/09) */
#wrapwrap .ww-quote a.qt-act { font-size: 15.4px; }
#wrapwrap .ww-quote input.qt-qty__in, #wrapwrap .ww-quote span.qt-qty__in { font-size: 17.6px; }
#wrapwrap .ww-quote .qt-line__price b { font-size: 18.7px; }
#wrapwrap .ww-quote .qt-line__price small { font-size: 13.2px; }
#wrapwrap .ww-quote .qo-line__qty b { font-size: 17.6px; }
#wrapwrap .ww-quote .qt-lbl-s { font-size: 12.1px; }
#wrapwrap .ww-quote h2.qt-h2 { font-size: 19.8px !important; }
#wrapwrap .ww-quote .qt-lbl { font-size: 15.4px; }
#wrapwrap .ww-quote .qt-ship__grid b { font-size: 16.5px; }
#wrapwrap .ww-quote .qt-ship__grid small, #wrapwrap .ww-quote p.qt-ship__note { font-size: 14.3px !important; }
#wrapwrap .ww-quote .qt-mini__row, #wrapwrap .ww-quote .qt-mini__row > b.qt-mono { font-size: 15.4px; }
#wrapwrap .ww-quote .qt-totals__row, #wrapwrap .ww-quote .qt-totals__row b { font-size: 15.4px; }
#wrapwrap .ww-quote .qt-totals__total { font-size: 16.5px; }
#wrapwrap .ww-quote .qt-totals__total b { font-size: 24.2px; }
#wrapwrap .ww-quote p.qt-totals__note { font-size: 13.75px !important; }
#wrapwrap .ww-quote .qt-row__title { font-size: 18.7px; }
#wrapwrap .ww-quote .qt-row__meta { font-size: 14.3px; }
#wrapwrap .ww-quote .qt-row__meta .qt-mono { font-size: 13.2px; }
#wrapwrap .ww-quote .qt-row__proj b { font-size: 16.5px; }
#wrapwrap .ww-quote .qt-row__proj small, #wrapwrap .ww-quote .qt-row__date b { font-size: 14.3px; }
#wrapwrap .ww-quote .qt-row__amount b { font-size: 17.6px; }
#wrapwrap .ww-quote .qt-row .dash-badge { font-size: 14.3px; height: 28px; }
#wrapwrap .ww-order .qo-terms__grid b, #wrapwrap .ww-order .qo-pick { font-size: 15.4px; }
#wrapwrap .ww-order p.qo-terms__note, #wrapwrap .ww-order p.qo-chat__hint { font-size: 15.4px !important; }
#wrapwrap .ww-order .qo-contact__row b { font-size: 16.5px; }
#wrapwrap .ww-order .qo-contact__row small { font-size: 14.3px; }
@media (max-width: 1320px) {
  #wrapwrap .ww-quote a.qt-row { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(136px, max-content) 172px minmax(176px, max-content); }
  #wrapwrap .ww-quote .qt-row__date { display: none; }
  #wrapwrap .ww-quote .qt-row__date-alt { display: block !important; font-family: var(--font-mono); font-size: 13.2px; color: var(--text-3); margin-top: 2px; }
}
@media (max-width: 1180px) {
  #wrapwrap .ww-quote .qt-grid { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-quote .qt-aside { position: static; }
  #wrapwrap .ww-quote a.qt-row { grid-template-columns: minmax(0, 1fr) auto; }
  #wrapwrap .ww-quote .qt-row__proj, #wrapwrap .ww-quote .qt-row__state, #wrapwrap .ww-quote .qt-row__date { grid-column: 1 / -1; }
}
/* --- telephone --- */
@media (max-width: 760px) {
  html body:has(#ww-nav) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-quote { padding: 16px 16px 120px !important; }
  #wrapwrap .ww-quote h1.qt-h1 { font-size: 28px !important; }
  #wrapwrap .ww-quote .qt-stepper li small { display: none; }
  #wrapwrap .ww-quote .qt-stepper li b { font-size: 13px; }
  #wrapwrap .ww-quote .qt-sol__head { padding: 16px; }
  #wrapwrap .ww-quote tr.qt-line { grid-template-columns: 64px minmax(0, 1fr); gap: 12px 14px; padding: 16px; }
  #wrapwrap .ww-quote .qt-thumb { width: 64px; height: 64px; }
  #wrapwrap .ww-quote .qt-line__qty { grid-column: 1 / 2; padding-top: 0 !important; }
  #wrapwrap .ww-quote .qt-line__price { grid-column: 2 / 3; padding-top: 0 !important; align-self: center; }
  #wrapwrap .ww-quote .qt-line__qty .qt-qty { height: 44px; }
  #wrapwrap .ww-quote .qt-ship { padding: 16px; }
  #wrapwrap .ww-quote .qt-ship__grid { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-quote .qt-rail .qt-rail__acts .dash-btn--resume { display: none; }
  /* ordre du handoff M2/M6 : Solutions, Recapitulatif, Livraison, Doute */
  #wrapwrap .ww-quote .qt-main, #wrapwrap .ww-quote .qt-aside, #wrapwrap .ww-quote .qt-cartpart { display: contents; }   /* le regroupement ne casse plus l'ordre mobile */
  #wrapwrap .ww-quote .qt-sol { order: 1; } #wrapwrap .ww-quote .qt-rail { order: 2; } #wrapwrap .ww-quote .qt-ship { order: 3; } #wrapwrap .ww-quote .qt-doubt { order: 4; }
  #wrapwrap .ww-quote .qt-grid { gap: 16px; }
  #wrapwrap .ww-quote .qt-sticky { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--border-1); }
  #wrapwrap .ww-quote .qt-sticky small { display: block; font-size: 12px; color: var(--text-3); }
  #wrapwrap .ww-quote .qt-sticky b { display: block; font-family: var(--font-mono); font-size: 18px; font-weight: 600; color: var(--ink-900); }
  #wrapwrap .ww-quote .qt-sticky .dash-btn { height: 48px; padding: 0 20px; }
  #wrapwrap .ww-quote .qt-list__head .dash-btn--xl { display: none; }
  #wrapwrap .ww-quote .qt-cur { margin-bottom: 28px; }
  #wrapwrap .ww-quote .qt-cur .dash-draft__main, #wrapwrap .ww-quote .qt-cur .dash-draft__side { padding: 18px; }
  /* les filtres défilent DANS la largeur de l'écran : sans min-width 0, la rangée prenait la largeur de ses 4 boutons et la page débordait
     de 6 à 26 px sur téléphone (contrôle de toutes les vues, 06/10) */
  #wrapwrap .ww-quote .qt-list__tools { width: 100%; min-width: 0; }
  #wrapwrap .ww-quote .qt-filters { width: 100%; min-width: 0; overflow-x: auto; }
  #wrapwrap .ww-quote .qt-search { width: 100%; min-width: 0; }
  #wrapwrap .ww-quote a.qt-row { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 16px; }
  #wrapwrap .ww-quote .qt-row__amount { text-align: left; }
  #wrapwrap .ww-quote .qt-row__act { justify-content: flex-start; }
}

/* ---- Lignes du chiffrage : grille nommee, prioritaire sur le tableau « Vos projets » du tableau de bord (dash.css : table min-width 640px,
   tr/td en grille mobile, td:first-child pleine largeur) qui fuyait via la racine commune .ww-dash (27/09). Miniature a gauche (handoff D2 / M2). ---- */
#wrapwrap .ww-quote table.qt-lines { display: block; width: 100%; min-width: 0 !important; border: 0 !important; border-radius: 0 !important; overflow: visible !important; border-spacing: 0; }
#wrapwrap .ww-quote table.qt-lines > tbody { display: block; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line, #wrapwrap .ww-order .qo-lines > .qt-line.qo-line {
  display: grid; grid-template-columns: 88px minmax(0, 1fr) auto auto; grid-template-areas: "thumb body qty price";
  gap: 18px; align-items: start; padding: 22px 24px; margin: 0; border: 0; border-bottom: 1px solid var(--border-1); border-radius: 0; background: transparent; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line:last-child, #wrapwrap .ww-order .qo-lines > .qt-line.qo-line:last-child { border-bottom: 0; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td { justify-self: stretch; padding: 0 !important; border: 0 !important; font-size: inherit; color: inherit; vertical-align: top; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td.qt-line__thumb, #wrapwrap .ww-order .qo-lines > .qo-line > .qt-line__thumb { grid-area: thumb; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td.qt-line__body, #wrapwrap .ww-order .qo-lines > .qo-line > .qt-line__body { grid-area: body; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td.qt-line__qty, #wrapwrap .ww-order .qo-lines > .qo-line > .qo-line__qty { grid-area: qty; }
#wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td.qt-line__price, #wrapwrap .ww-order .qo-lines > .qo-line > .qt-line__price { grid-area: price; justify-self: end; }
@media (max-width: 1320px) {
  #wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line, #wrapwrap .ww-order .qo-lines > .qt-line.qo-line {
    grid-template-columns: 88px minmax(0, 1fr) auto; grid-template-areas: "thumb body body" "thumb qty price"; row-gap: 14px; }
  #wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td.qt-line__qty, #wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line > td.qt-line__price,
  #wrapwrap .ww-order .qo-lines > .qo-line > .qo-line__qty, #wrapwrap .ww-order .qo-lines > .qo-line > .qt-line__price { padding-top: 0 !important; align-self: center; }
  #wrapwrap .ww-order .qo-lines > .qo-line > .qo-line__qty { text-align: left; }
}
@media (max-width: 760px) {
  #wrapwrap .ww-quote table.qt-lines > tbody > tr.qt-line, #wrapwrap .ww-order .qo-lines > .qt-line.qo-line {
    grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "thumb body body" "qty qty price"; gap: 12px 14px; padding: 16px; }
  #wrapwrap .ww-quote .qt-thumb { width: 64px; height: 64px; }
}

/* ---- envoi en une page : champs, plan, dialogue (handoff D7 ; mobile = feuille en bas) ---- */
#wrapwrap .ww-quote .qt-info { padding: 20px 24px 22px; display: grid; gap: 14px; }
#wrapwrap .ww-quote .qt-field { display: grid; gap: 6px; min-width: 0; align-content: start; }
#wrapwrap .ww-quote .qt-field .qt-lbl { margin: 0; }
#wrapwrap .ww-quote .qt-req { color: #C2410C; }
#wrapwrap .ww-quote .qt-input { width: 100%; min-height: 44px; padding: 10px 14px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; font-family: var(--font-sans); font-size: 16px; color: var(--ink-900); box-shadow: none; }
#wrapwrap .ww-quote textarea.qt-input { min-height: 88px; resize: vertical; line-height: 1.45; }
#wrapwrap .ww-quote .qt-input:focus { outline: none; border-color: var(--ink-900); box-shadow: 0 0 0 3px var(--point-halo); }
#wrapwrap .ww-quote .qt-select { appearance: auto; }
#wrapwrap .ww-quote .qt-field small { font-size: 13.2px; color: var(--text-3); }
#wrapwrap .ww-quote a.qt-link-s { color: var(--green-700) !important; font-weight: 700; text-decoration: none !important; padding: 0 !important; }
#wrapwrap .ww-quote .qt-err { margin: 0 !important; font-size: 13.2px !important; color: #B42318 !important; font-family: var(--font-sans) !important; }
#wrapwrap .ww-quote .qt-err a { color: #B42318 !important; text-decoration: underline !important; font-weight: 700; }
#wrapwrap .ww-quote .qt-ship__grid .qt-field b { display: none; }
#wrapwrap .ww-quote label.qt-file { position: relative; cursor: pointer; margin: 0; }
#wrapwrap .ww-quote label.qt-file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
#wrapwrap .ww-quote .qt-plan-list { font-family: var(--font-mono); font-size: 12.1px; color: var(--ink-700); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-cgv { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 0; font-size: 14.3px; font-weight: 400; color: var(--ink-800); cursor: pointer; }
#wrapwrap .ww-quote .qt-cgv input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--ink-900); flex: none; }
#wrapwrap .ww-quote .qt-cgv a { color: var(--green-700) !important; text-decoration: underline !important; }
body.qt-modal { overflow: hidden; }   /* volet des articles standard (STD_JS) */
@media (max-width: 760px) {
  #wrapwrap .ww-quote .qt-info { padding: 16px; }
  #wrapwrap .ww-quote .qt-info { order: 2; } #wrapwrap .ww-quote .qt-rail { order: 3; } #wrapwrap .ww-quote .qt-ship { order: 4; } #wrapwrap .ww-quote .qt-doubt { order: 5; }
}

@media print {
  .ww-nav, .ww-top, .ww-mega, header, footer, #oe_main_menu_navbar, .qt-sticky, .qt-rail__acts, .qt-file, .qt-line__acts, .qt-dialog { display: none !important; }
  html body #wrapwrap > main { padding-top: 0 !important; margin-left: 0 !important; }
  #wrapwrap .ww-quote .qt-grid { grid-template-columns: minmax(0, 1fr) 300px; }
  #wrapwrap .ww-quote .qt-aside { position: static; }
}

#wrapwrap .ww-quote .qt-row__state { display: grid; gap: 4px; justify-items: start; align-content: center; min-width: 0; }
#wrapwrap .ww-quote .qt-row__act { justify-self: end; }
#wrapwrap .ww-quote .qt-row__hint { font-size: 12px; line-height: 1.3; color: var(--text-3); }

/* ecran « Nouveau chiffrage » (panier vide) */
#wrapwrap .ww-quote .qt-new small { font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-quote .qt-grid--new .qt-main > .qt-info.qt-new { order: -1; }
#wrapwrap .ww-quote .qt-cats { padding: 24px 26px 26px; container-type: inline-size; }
#wrapwrap .ww-quote .qt-cats__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 18px; }
#wrapwrap .ww-quote .qt-cats__step { font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-quote .qt-cats__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
/* « Vos articles dedies » (PRO+) : bandeau au-dessus des familles, visible en sur mesure comme en standard */
@container (min-width: 560px) { #wrapwrap .ww-quote .qt-cats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@supports not (container-type: inline-size) { @media (min-width: 1100px) { #wrapwrap .ww-quote .qt-cats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } }
#wrapwrap .ww-quote a.qt-cat { display: grid; gap: 8px; padding: 16px; border: 1px solid var(--border-1); border-radius: 12px; background: var(--surface-card); color: var(--ink-900) !important; text-decoration: none !important; transition: box-shadow .15s ease-out, border-color .15s ease-out; min-width: 0; }
#wrapwrap .ww-quote a.qt-cat:hover { box-shadow: var(--shadow-m); border-color: var(--ink-300, #C4C4C1); }
#wrapwrap .ww-quote .qt-cat__media { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: var(--ink-800, #232323); }
#wrapwrap .ww-quote .qt-cat__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-quote .qt-cat__ph { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-300, #9A9A98); }
#wrapwrap .ww-quote .qt-cat__row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: 4px; }
#wrapwrap .ww-quote .qt-cat__row b { font-size: 19px; font-weight: 700; line-height: 1.25; min-width: 0; }
#wrapwrap .ww-quote .qt-cat__row small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-quote .qt-cat__desc { font-size: 15px; line-height: 1.45; color: var(--text-2); }
#wrapwrap .ww-quote .qt-rail--empty .qt-rail__hint { margin: 10px 0 14px; font-size: 15px; line-height: 1.5; color: var(--text-2); padding-bottom: 14px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-rail--empty .qt-rail__acts .dash-btn[disabled] { opacity: .45; cursor: not-allowed; pointer-events: none; }

/* parcours « Ajouter une solution » dans la page (modes cart / add) */
#wrapwrap .ww-quote[data-mode="add"] .qt-cartpart, #wrapwrap .ww-quote[data-mode="add"]:not([data-pick="std"]):not([data-pick="mine"]) .qt-sticky { display: none !important; }
#wrapwrap .ww-quote[data-mode="cart"] .qt-add, #wrapwrap .ww-quote:not([data-mode="config"]) .qt-config { display: none; }
#wrapwrap .ww-quote[data-mode="config"] .qt-add, #wrapwrap .ww-quote[data-mode="config"] .qt-cartpart, #wrapwrap .ww-quote[data-mode="config"] .qt-aside, #wrapwrap .ww-quote[data-mode="config"] .qt-sticky { display: none !important; }
#wrapwrap .ww-quote[data-mode="config"] .qt-grid { grid-template-columns: minmax(0, 1fr) !important; }
#wrapwrap .ww-quote .qt-h1__cfg { display: none; }
#wrapwrap .ww-quote[data-mode="config"] .qt-h1__cfg { display: inline; }
#wrapwrap .ww-quote[data-mode="config"] .qt-h1__cart, #wrapwrap .ww-quote[data-mode="config"] .qt-h1__add { display: none; }
#wrapwrap .ww-quote .qt-config__nav { margin: 0 0 16px; }
#wrapwrap .ww-quote .qt-config__wait { padding: 40px 0; text-align: center; color: var(--text-3); }
/* configurateur D5 dans le chiffrage : le titre « Ajouter : … » du chiffrage remplace l'en-tete de fiche */
#wrapwrap .ww-quote .qt-config #ww-product .pv-head, #wrapwrap .ww-quote .qt-config #ww-product .pv-back { display: none !important; }
#wrapwrap .ww-quote .qt-add { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; min-width: 0; }
#wrapwrap .ww-quote .qt-back { display: none; margin: 0 0 16px; }
#wrapwrap .ww-quote[data-mode="add"] .qt-back { display: inline-flex; }
#wrapwrap .ww-quote .qt-h1__add { display: none; }
#wrapwrap .ww-quote[data-mode="add"] .qt-h1__add { display: inline; }
#wrapwrap .ww-quote[data-mode="add"][data-has="1"] .qt-h1__cart { display: none; }
#wrapwrap .ww-quote .qt-cat__txt { display: grid; gap: 6px; min-width: 0; }
#wrapwrap .ww-quote .qt-cat__go { display: none; color: var(--text-3); }
#wrapwrap .ww-quote .qt-cats__foot { margin: 18px 0 0; font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-quote .qt-cats__foot a, #wrapwrap .ww-quote .qt-step2__empty a { color: var(--ink-900) !important; text-decoration: underline !important; }
#wrapwrap .ww-quote .qt-step2 { padding: 0; overflow: hidden; }
#wrapwrap .ww-quote .qt-step2__head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 18px 26px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-step2__head .qt-h2 { margin: 0; flex: 1 1 auto; }
#wrapwrap .ww-quote .qt-step2__head .qt-count { font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-quote .qt-prow { display: grid; grid-template-columns: 88px minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 20px 26px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-prow:first-child { border-top: 0; }
#wrapwrap .ww-quote .qt-pgroup { padding: 14px 26px 6px; font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--green-700); border-top: 1px solid var(--border-1); background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-pgroup:first-child { border-top: 0; }
#wrapwrap .ww-quote .qt-pgroup + .qt-prow { border-top: 0; }
#wrapwrap .ww-quote .qt-prow__body { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-quote .qt-prow__name { font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-prow__desc { font-size: 14px; line-height: 1.45; color: var(--text-2); }
#wrapwrap .ww-quote .qt-prow__price { font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-quote .qt-prow__price b { font-family: var(--font-mono); font-weight: 600; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-prow__act form { margin: 0; }
/* v1.2 : groupes du 3e niveau = intertitres collants sous la barre du haut (64 / 56 px ; + 46 px barre Odoo pour un compte interne) */
#wrapwrap .ww-quote .qt-sgrp { position: sticky; top: var(--top-h, 64px); z-index: 2; display: flex; align-items: baseline; gap: 6px; padding: 10px 16px; border-top: 1px solid var(--border-1); border-bottom: 1px solid var(--border-1); background: var(--ink-50, #F6F6F5); font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
#wrapwrap .ww-quote .qt-sgrp:first-child { border-top: 0; }
#wrapwrap .ww-quote .qt-sgrp b { font-weight: 600; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-sgrp span { color: var(--text-3); }
#wrapwrap .ww-quote .qt-sgrp + .qt-srow { border-top: 0; }
body:has(#oe_main_menu_navbar) #wrapwrap .ww-quote .qt-sgrp { top: calc(var(--top-h, 64px) + 46px); }
/* « Ajouter une solution » : action principale de la carte, en vert (Charles 28/09) */
html body #wrapwrap .ww-quote .oe_cart a.qt-addsol { background: var(--green-500) !important; border: 0 !important; color: var(--ink-900) !important; box-shadow: var(--shadow-accent, 0 6px 16px -6px rgba(0, 230, 176, .55)); }
html body #wrapwrap .ww-quote .oe_cart a.qt-addsol:hover { background: var(--green-600, #00C497) !important; }
@media (max-width: 760px) { #wrapwrap .ww-quote .qt-sgrp { padding: 10px 12px; } html body #wrapwrap .ww-quote button.qt-std__clear { min-height: 44px; } }
/* ligne ajoutee depuis Articles standard : surbrillance breve (Charles 28/09) */
@keyframes qtNew { 0%, 35% { background: var(--green-100, #D9FBF1); } 100% { background: transparent; } }
#wrapwrap .ww-quote tr.qt-line.is-new { animation: qtNew 2.6s ease-out; }
/* nom du chiffrage : Valider (Charles 28/09) */
#wrapwrap .ww-quote .qt-name { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: stretch; min-width: 0; }
html body #wrapwrap .ww-quote button.qt-name__ok { height: auto; min-height: 44px; padding: 0 16px; gap: 6px; background: #fff; color: var(--ink-900); border: 1px solid var(--border-2, #C4C4C1); box-shadow: none; transition: none; }
html body #wrapwrap .ww-quote button.qt-name__ok:hover { background: var(--ink-50, #F6F6F5); }
html body #wrapwrap .ww-quote button.qt-name__ok.is-done { border-color: var(--green-500); color: var(--green-800, #0B5E47); }
#wrapwrap .ww-quote .qt-name__ok svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-quote small.qt-name__msg { color: var(--green-700); font-weight: 700; }
#wrapwrap .ww-quote small.qt-name__msg.is-bad { color: #B42318; }
#wrapwrap .ww-quote small.qt-name__msg[hidden] { display: none !important; }
#wrapwrap .ww-quote .qt-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
html body #wrapwrap .ww-quote button.qt-rename { appearance: none; display: inline-flex; align-items: center; gap: 6px; height: 34px; margin: 6px 0 0; padding: 0 12px; border: 1px solid var(--border-1); border-radius: 8px; background: #fff; box-shadow: none; font: inherit; font-size: 14px; font-weight: 700; line-height: 1; color: var(--ink-900); white-space: nowrap; cursor: pointer; }
html body #wrapwrap .ww-quote button.qt-rename:hover { background: var(--ink-50, #F6F6F5); border-color: var(--ink-400, #9A9A98); }
html body #wrapwrap .ww-quote button.qt-rename:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-quote .qt-rename svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-quote .qt-rename[hidden], #wrapwrap .ww-quote section.qt-new[hidden], #wrapwrap .ww-quote .qt-field[hidden] { display: none !important; }
#wrapwrap .ww-quote[data-mode="config"] .qt-rename, #wrapwrap .ww-quote[data-mode="add"][data-has="1"] .qt-rename { display: none !important; }   /* titre « Ajouter… » : pas de nom affiche */
@media (max-width: 760px) { html body #wrapwrap .ww-quote button.qt-rename { height: 44px; } }
/* visiteur : chiffrage reserve aux comptes (aucun prix sans connexion) */
#wrapwrap .ww-quote.qt-gate-wrap { padding-top: 40px; padding-bottom: 64px; }
#wrapwrap .ww-quote .qt-gate { display: grid; gap: 14px; max-width: 640px; padding: 32px 36px; }
#wrapwrap .ww-quote .qt-gate .qt-h1 { margin: 0; }
#wrapwrap .ww-quote .qt-gate .qt-h1 i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-quote .qt-gate p { margin: 0 !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.55 !important; color: var(--text-2) !important; }
#wrapwrap .ww-quote .qt-gate__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
#wrapwrap .ww-quote .qt-gate__acts a.dash-btn--secondary { background: #fff; color: var(--ink-900) !important; border: 1px solid var(--border-2, #C4C4C1); text-decoration: none !important; }
@media (max-width: 760px) { #wrapwrap .ww-quote .qt-gate { padding: 24px 20px; } #wrapwrap .ww-quote .qt-gate__acts .dash-btn { flex: 1 1 100%; justify-content: center; height: 48px; } }
/* ===== Articles standard (handoff chiffrage-standard-v1.0, 28/09) : selecteur de parcours, recherche, vignettes de familles, liste a ajout direct ===== */
#wrapwrap .ww-quote .qt-cats__head { margin-bottom: 14px; }
#wrapwrap .ww-quote h2.qt-pick__h { margin: 0; font-family: var(--font-body, inherit); font-size: 16px !important; font-weight: 700 !important; line-height: 1.3 !important; letter-spacing: 0 !important; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-quote .qt-pick__step { font-size: 11px; letter-spacing: .12em; }
#wrapwrap .ww-quote .qt-pick { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; margin: 0 0 16px; padding: 4px; border: 1px solid var(--border-1); border-radius: 10px; background: var(--ink-50, #F6F6F5); }
html body #wrapwrap .ww-quote button.qt-pick__o { appearance: none; display: grid; gap: 2px; align-content: center; min-width: 0; min-height: 56px; margin: 0; padding: 10px 16px; border: 0; border-radius: 8px; background: transparent; box-shadow: none; font: inherit; text-align: left; color: var(--text-2); cursor: pointer; }
html body #wrapwrap .ww-quote button.qt-pick__o[aria-selected="true"] { background: #fff; box-shadow: var(--shadow-card); color: var(--ink-900); }
html body #wrapwrap .ww-quote button.qt-pick__o:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-quote .qt-pick__t { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 15px; font-weight: 700; line-height: 1.3; white-space: nowrap; }
#wrapwrap .ww-quote .qt-pick__s { overflow: hidden; font-family: var(--font-mono); font-size: 11px; line-height: 1.4; color: var(--text-3); white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-quote .qt-sdot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 4px rgba(0, 230, 176, .28); }
#wrapwrap .ww-quote .qt-pick__o[aria-selected="false"] .qt-sdot { display: none; }
#wrapwrap .ww-quote:not([data-pick="std"]) .qt-std, #wrapwrap .ww-quote[data-pick="std"] .qt-cats__grid, #wrapwrap .ww-quote[data-pick="mine"] .qt-cats__grid, #wrapwrap .ww-quote:not([data-pick="mine"]) .qt-mine { display: none !important; }
/* onglet « Vos references » (handoff espace-reserve-v1.0 §4) : point et ajout en jaune #ECF22E (le client engage) */
#wrapwrap .ww-quote .qt-pick__o[data-pick="mine"] .qt-sdot { background: #ECF22E; box-shadow: 0 0 0 4px rgba(236, 242, 46, .35); }
#wrapwrap .ww-quote .qt-mine__note { display: flex; align-items: center; gap: 10px; margin: 0 0 12px !important; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-quote .qt-mine__dot { flex: none; width: 8px; height: 8px; border-radius: 4px; background: #ECF22E; box-shadow: 0 0 0 1px var(--ink-900); }
html body #wrapwrap .ww-quote .qt-mine .dash-btn--accent { background: #ECF22E !important; color: var(--ink-900) !important; box-shadow: none !important; }
html body #wrapwrap .ww-quote .qt-mine .dash-btn--accent:hover { background: #DDE31F !important; }
#wrapwrap .ww-quote .qt-std { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; min-width: 0; }
html body #wrapwrap .ww-quote input.qt-std__q { box-sizing: border-box; width: 100% !important; height: 44px !important; margin: 0 !important; padding: 0 14px !important; border: 1px solid var(--border-1) !important; border-radius: 8px !important; background: #fff !important; box-shadow: none !important; font-family: inherit; font-size: 15px !important; color: var(--ink-900) !important; }
html body #wrapwrap .ww-quote input.qt-std__q:focus { outline: none; border-color: var(--ink-900) !important; box-shadow: 0 0 0 1px var(--ink-900) !important; }
#wrapwrap .ww-quote .qt-std__fams { display: flex; gap: 10px; min-width: 0; padding: 2px; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-quote .qt-std__fams::-webkit-scrollbar { display: none; }
html body #wrapwrap .ww-quote button.qt-sfam { appearance: none; flex: none; display: grid; gap: 8px; width: 132px; margin: 0; padding: 6px; border: 1px solid var(--border-1); border-radius: 12px; background: #fff; box-shadow: none; font: inherit; text-align: left; color: var(--ink-900); cursor: pointer; transition: border-color .12s ease-out; }
html body #wrapwrap .ww-quote button.qt-sfam:hover { border-color: var(--ink-400, #9A9A98); }
html body #wrapwrap .ww-quote button.qt-sfam.is-on { border-color: var(--ink-900); box-shadow: 0 0 0 1px var(--ink-900); }
html body #wrapwrap .ww-quote button.qt-sfam:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-quote .qt-sfam__th { position: relative; display: flex; align-items: center; justify-content: center; height: 72px; border-radius: 8px; overflow: hidden; background: var(--ink-900); }
#wrapwrap .ww-quote .qt-sfam__th--all { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-sfam__th img, #wrapwrap .ww-quote .qt-srow__th img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-quote .qt-sfam__grid { display: grid; grid-template-columns: repeat(2, 18px); gap: 4px; }
#wrapwrap .ww-quote .qt-sfam__grid i { display: block; width: 18px; height: 18px; border-radius: 4px; background: var(--ink-200); }
#wrapwrap .ww-quote .qt-sfam__grid i:first-child { background: var(--ink-900); }
#wrapwrap .ww-quote svg.qt-sfam__ico, #wrapwrap .ww-quote svg.qt-srow__ico { width: 22px; height: 22px; color: var(--ink-500); fill: none; stroke: currentColor; stroke-width: 1.5; }
#wrapwrap .ww-quote .qt-sfam__th .qt-sdot { position: absolute; top: 6px; left: 6px; display: none; }
#wrapwrap .ww-quote .qt-sfam.is-on .qt-sdot { display: block; }
#wrapwrap .ww-quote .qt-sfam__lb { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; min-width: 0; padding: 0 4px 2px; }
#wrapwrap .ww-quote .qt-sfam__lb b { min-width: 0; overflow: hidden; font-size: 13px; font-weight: 500; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-quote .qt-sfam.is-on .qt-sfam__lb b { font-weight: 700; }
#wrapwrap .ww-quote .qt-sfam__lb small { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--text-3); }
#wrapwrap .ww-quote .qt-std__list { overflow: hidden; overflow: clip; border: 1px solid var(--border-1); border-radius: 12px; background: #fff; }   /* clip : ne casse pas les intertitres collants (v1.2) */
#wrapwrap .ww-quote .qt-srow { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; align-items: center; gap: 16px; padding: 12px 16px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-srow:first-child { border-top: 0; }
#wrapwrap .ww-quote .qt-srow__th { position: relative; display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 8px; overflow: hidden; background: var(--ink-900); }
#wrapwrap .ww-quote .qt-srow__th.is-prod { background: #fff; box-shadow: inset 0 0 0 1px var(--border-1); }
#wrapwrap .ww-quote .qt-srow__th.is-prod img { object-fit: contain; }
#wrapwrap .ww-quote .qt-srow__body { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-quote .qt-srow__name { font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-srow__tag { display: flex; }
#wrapwrap .ww-quote .qt-srow__ref { font-family: var(--font-mono); font-size: 12px; line-height: 1.45; color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-srow__mp { display: none; }
#wrapwrap .ww-quote .qt-srow__price { font-family: var(--font-mono); font-size: 14px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-quote .qt-srow__price small { font-size: 12px; font-weight: 400; color: var(--text-3); }
html body #wrapwrap .ww-quote button.qt-srow__add { height: 36px; padding: 0 14px; font-size: 14px; gap: 6px; transition: none; }   /* changement d'etat franc (vert -> secondaire) */
html body #wrapwrap .ww-quote button.qt-srow__add.dash-btn--secondary { background: #fff; color: var(--ink-900); border: 1px solid var(--border-2, #C4C4C1); box-shadow: none; }
html body #wrapwrap .ww-quote button.qt-srow__add.dash-btn--secondary:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-srow__add svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-quote .qt-srow__add.is-busy { opacity: .6; cursor: progress; }
#wrapwrap .ww-quote p.qt-std__wait, #wrapwrap .ww-quote p.qt-std__none { margin: 0 !important; padding: 24px !important; text-align: center; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
html body #wrapwrap .ww-quote .oe_cart a.qt-std__all { display: inline !important; height: auto !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; font-size: inherit !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--ink-900) !important; text-decoration: underline !important; }
#wrapwrap .ww-quote p.qt-std__note { margin: 0 !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-3) !important; }
/* v1.1 : sous-familles (puces), repere + Effacer, ligne cliquable, fiche article (panneau / plein ecran mobile) */
#wrapwrap .ww-quote .qt-std__subs { display: flex; gap: 8px; min-width: 0; padding: 2px; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-quote .qt-std__subs::-webkit-scrollbar { display: none; }
#wrapwrap .ww-quote .qt-std__subs[hidden], #wrapwrap .ww-quote .qt-std__path[hidden], #wrapwrap .ww-quote .qt-sheet[hidden], #wrapwrap .ww-quote .qt-step2[hidden] { display: none !important; }
html body #wrapwrap .ww-quote button.qt-ssub { appearance: none; flex: none; display: inline-flex; align-items: center; gap: 8px; height: 36px; margin: 0; padding: 0 14px; border: 1px solid var(--border-1); border-radius: 999px; background: #fff; box-shadow: none; font: inherit; font-size: 14px; font-weight: 500; line-height: 1; color: var(--ink-900); white-space: nowrap; cursor: pointer; }
html body #wrapwrap .ww-quote button.qt-ssub:hover { border-color: var(--ink-400, #9A9A98); }
html body #wrapwrap .ww-quote button.qt-ssub.is-on { border-color: var(--ink-900); background: var(--ink-900); color: #fff; font-weight: 700; }
html body #wrapwrap .ww-quote button.qt-ssub:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-quote .qt-ssub small { font-family: var(--font-mono); font-size: 11px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-quote .qt-ssub.is-on small { color: var(--ink-300, #C4C4C1); }
#wrapwrap .ww-quote .qt-ssub .qt-sdot { display: none; width: 6px; height: 6px; box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); }
#wrapwrap .ww-quote .qt-ssub.is-on .qt-sdot { display: block; }
#wrapwrap .ww-quote .qt-std__path { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; }
#wrapwrap .ww-quote .qt-std__crumb { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
html body #wrapwrap .ww-quote button.qt-std__clear { appearance: none; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; font: inherit; font-size: 13px; color: var(--text-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
html body #wrapwrap .ww-quote .oe_cart a.qt-std__deep { display: inline !important; height: auto !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 13px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--text-2) !important; text-decoration: underline !important; }
#wrapwrap .ww-quote .qt-srow { cursor: pointer; transition: background .12s ease-out; }
#wrapwrap .ww-quote .qt-srow:hover { background: var(--ink-50, #F6F6F5); }
html body #wrapwrap .ww-quote button.qt-srow__open { appearance: none; justify-self: start; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; font: inherit; font-size: 15px; font-weight: 700; line-height: 1.3; text-align: left; color: var(--ink-900); text-decoration: underline; text-decoration-color: var(--ink-200); text-decoration-thickness: 1px; text-underline-offset: 4px; overflow-wrap: anywhere; cursor: pointer; }
html body #wrapwrap .ww-quote button.qt-srow__open:hover { text-decoration-color: var(--ink-900); }
html body #wrapwrap .ww-quote button.qt-srow__open:focus-visible { outline: none; border-radius: 4px; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-quote .qt-sheet { position: fixed; inset: 0; z-index: 1065; }
#wrapwrap .ww-quote .qt-sheet__veil { position: absolute; inset: 0; background: rgba(20, 20, 20, .42); }
#wrapwrap .ww-quote .qt-sheet__panel { position: absolute; top: 12px; right: 12px; bottom: 12px; width: 480px; max-width: calc(100% - 24px); display: flex; flex-direction: column; overflow: hidden; border-radius: 14px; background: #fff; box-shadow: var(--shadow-l, 0 16px 40px rgba(20, 20, 20, .16)); transform: translateX(16px); opacity: 0; transition: transform .18s ease-out, opacity .18s ease-out; }
#wrapwrap .ww-quote .qt-sheet.is-in .qt-sheet__panel { transform: none; opacity: 1; }
#wrapwrap .ww-quote .qt-sheet__panel:focus { outline: none; }
#wrapwrap .ww-quote .qt-sheet__head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 56px; padding: 0 8px 0 20px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-sheet__ref { flex: 1; min-width: 0; overflow: hidden; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; text-overflow: ellipsis; }
html body #wrapwrap .ww-quote button.qt-sheet__x { appearance: none; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--ink-900); cursor: pointer; }
html body #wrapwrap .ww-quote button.qt-sheet__x:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-sheet__x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-quote .qt-sheet__body { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 20px; padding: 24px 28px 28px; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; }
#wrapwrap .ww-quote .qt-sheet__ph { position: relative; flex: none; display: flex; align-items: center; justify-content: center; height: 300px; border-radius: 12px; overflow: hidden; background: var(--ink-900); color: var(--ink-500); }
#wrapwrap .ww-quote .qt-sheet__ph.is-prod { background: #fff; box-shadow: inset 0 0 0 1px var(--border-1); }
#wrapwrap .ww-quote .qt-sheet__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-quote .qt-sheet__ph.is-prod img { object-fit: contain; padding: 12px; }
#wrapwrap .ww-quote svg.qt-sheet__ico { width: 40px; height: 40px; fill: none; stroke: currentColor; stroke-width: 1.5; }
#wrapwrap .ww-quote .qt-sheet__lbl { position: absolute; left: 12px; bottom: 12px; padding: 4px 8px; border-radius: 4px; background: rgba(20, 20, 20, .72); font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: #fff; white-space: nowrap; }
#wrapwrap .ww-quote .qt-sheet__id { display: grid; gap: 8px; }
#wrapwrap .ww-quote .qt-sheet__eb { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--green-700); }
#wrapwrap .ww-quote h2.qt-sheet__t { margin: 0 !important; font-family: var(--font-display, inherit) !important; font-size: 28px !important; font-weight: 900 !important; line-height: 1.08 !important; letter-spacing: -.035em !important; color: var(--ink-900) !important; text-wrap: pretty; }
#wrapwrap .ww-quote h2.qt-sheet__t i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-quote p.qt-sheet__d { margin: 0 !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.55 !important; color: var(--text-2) !important; }
#wrapwrap .ww-quote .qt-sheet__specs { flex: none; border: 1px solid var(--border-1); border-radius: 10px; }
#wrapwrap .ww-quote .qt-sheet__row { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; padding: 10px 14px; border-top: 1px solid var(--border-1); font-size: 14px; line-height: 1.45; }
#wrapwrap .ww-quote .qt-sheet__row:first-child { border-top: 0; }
#wrapwrap .ww-quote .qt-sheet__row span { color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-sheet__row b { min-width: 0; font-weight: 500; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-sheet__docs { display: grid; gap: 10px; }
#wrapwrap .ww-quote .qt-sheet__h { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
/* « Plans & documents » (handoff apercu-documents-v1.0) : grille 56 px | texte | actions 44 px ; ligne en apercu = fond vert pale + « EN APERCU » */
#wrapwrap .ww-quote .qt-sheet__dh { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
#wrapwrap .ww-quote .qt-sheet__dn { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-quote .qt-sheet__dlist { border: 1px solid var(--border-1); border-radius: 12px; background: #fff; overflow: hidden; }
#wrapwrap .ww-quote .qt-sheet__doc { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 8px 12px 12px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-sheet__doc:first-child { border-top: 0; }
#wrapwrap .ww-quote .qt-sheet__doc[data-wwp-url] { cursor: pointer; }
#wrapwrap .ww-quote .qt-sheet__doc[data-wwp-url]:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-sheet__doc.is-viewing, #wrapwrap .ww-quote .qt-sheet__doc.is-viewing:hover { background: rgba(0, 227, 174, .08); }
#wrapwrap .ww-quote .qt-sheet__doc:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-quote .qt-sheet__dth { position: relative; display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 8px; background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-sheet__dth i { position: relative; display: block; width: 30px; height: 40px; background: #fff linear-gradient(var(--ink-900), var(--ink-900)) 0 0 / 100% 7px no-repeat; box-shadow: 0 1px 3px rgba(20, 20, 20, .18); }
#wrapwrap .ww-quote .qt-sheet__dth i::after { content: ""; position: absolute; left: 5px; right: 5px; top: 12px; height: 19px; background: repeating-linear-gradient(var(--ink-200) 0 2px, transparent 2px 5px); }
#wrapwrap .ww-quote .qt-sheet__dth--plan i { width: 44px; height: 31px; background: #fff; }
#wrapwrap .ww-quote .qt-sheet__dth--plan i::after { left: 5px; right: auto; top: 5px; width: 18px; height: 20px; background: none; border: 1px solid var(--ink-700); border-right: 0; }
#wrapwrap .ww-quote .qt-sheet__dth--plan i::before { content: ""; position: absolute; right: 4px; bottom: 4px; width: 14px; height: 7px; border: 1px solid var(--ink-700); }
#wrapwrap .ww-quote .qt-sheet__dtx { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-quote .qt-sheet__dtx b { font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-sheet__dtx small { font-family: var(--font-mono); font-size: 11px; line-height: 1.4; color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-sheet__dnow { display: none; align-items: center; gap: 8px; margin-top: 2px; font-family: var(--font-mono); font-size: 11px; font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--green-700); }
#wrapwrap .ww-quote .qt-sheet__dnow::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); }
#wrapwrap .ww-quote .qt-sheet__doc.is-viewing .qt-sheet__dnow { display: inline-flex; }
#wrapwrap .ww-quote .qt-sheet__dact { display: flex; }
html body #wrapwrap .ww-quote .qt-sheet__dib { appearance: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900) !important; text-decoration: none !important; cursor: pointer; }
html body #wrapwrap .ww-quote .qt-sheet__dib:hover { background: var(--ink-100); }
html body #wrapwrap .ww-quote .qt-sheet__dib:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-quote .qt-sheet__dib svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
html body #wrapwrap .ww-quote a.qt-sheet__more { align-self: flex-start; display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--text-2) !important; text-decoration: underline !important; text-underline-offset: 3px; }
#wrapwrap .ww-quote .qt-sheet__foot { flex: none; display: grid; gap: 12px; padding: 16px 28px; border-top: 1px solid var(--border-1); background: #fff; }
#wrapwrap .ww-quote .qt-sheet__pr { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
#wrapwrap .ww-quote .qt-sheet__pr b { font-family: var(--font-mono); font-size: 20px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-quote .qt-sheet__pr b small { font-size: 12px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-quote .qt-sheet__pr > span { font-size: 12px; line-height: 1.4; text-align: right; color: var(--text-3); }
#wrapwrap .ww-quote .qt-sheet__act { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
#wrapwrap .ww-quote .qt-sheet__qty { display: inline-flex; align-items: center; height: 44px; border: 1px solid var(--border-1); border-radius: 8px; }
#wrapwrap .ww-quote .qt-sheet__qty[hidden] { display: none; }
#wrapwrap .ww-quote .qt-sheet__act:has(> .qt-sheet__qty[hidden]) .qt-sheet__add { grid-column: 1 / -1; }   /* « Choisir l'option » pleine largeur */
html body #wrapwrap .ww-quote .qt-sheet__qty button { appearance: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 42px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--ink-900); cursor: pointer; }
html body #wrapwrap .ww-quote .qt-sheet__qty button:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-quote .qt-sheet__qty svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
#wrapwrap .ww-quote .qt-sheet__qty output { min-width: 28px; font-family: var(--font-mono); font-size: 15px; font-weight: 600; text-align: center; color: var(--ink-900); }
html body #wrapwrap .ww-quote button.qt-sheet__add { width: 100%; height: 44px; min-width: 0; padding: 0 14px; font-size: 15px; gap: 0; overflow: hidden; }
#wrapwrap .ww-quote .qt-sheet__add svg { flex: none; width: 16px; height: 16px; margin-right: 8px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-quote .qt-sheet__add span { white-space: pre; }
@media (max-width: 760px) {
  #wrapwrap .ww-quote .qt-cats { padding: 20px 16px; }
  #wrapwrap .ww-quote .qt-std__fams { margin: 0 -16px; padding: 2px 16px; }   /* la rangee defile jusqu'aux bords de la carte (handoff) */
  html body #wrapwrap .ww-quote button.qt-pick__o { padding: 8px 10px; }
  #wrapwrap .ww-quote .qt-pick__t { font-size: 14px; }
  #wrapwrap .ww-quote .qt-pick__k { display: none; }
  /* 3 onglets (avec « Vos références ») sur 390 px : libellés sur 2 lignes, sans débordement */
  #wrapwrap .ww-quote .qt-pick:has([data-pick="mine"]) button.qt-pick__o { padding: 8px; }
  #wrapwrap .ww-quote .qt-pick:has([data-pick="mine"]) .qt-pick__t { gap: 6px; font-size: 13px; line-height: 1.2; white-space: normal; }
  html body #wrapwrap .ww-quote button.qt-sfam { width: 116px; }
  #wrapwrap .ww-quote .qt-sfam__th { height: 64px; }
  #wrapwrap .ww-quote .qt-srow { grid-template-columns: 48px minmax(0, 1fr) 44px; gap: 12px; padding: 10px 12px; }
  #wrapwrap .ww-quote .qt-srow__th { width: 48px; height: 48px; }
  #wrapwrap .ww-quote .qt-srow__price { display: none; }
  #wrapwrap .ww-quote .qt-srow__mp { display: inline; }
  html body #wrapwrap .ww-quote button.qt-srow__add, html body #wrapwrap .ww-quote button.qt-srow__add.dash-btn--secondary { width: 44px; height: 44px; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--ink-900); }
  #wrapwrap .ww-quote .qt-srow__add span { display: none; }
  #wrapwrap .ww-quote .qt-srow__add svg { width: 22px; height: 22px; }
  #wrapwrap .ww-quote .qt-std__subs { margin: 0 -16px; padding: 2px 16px; }
  html body #wrapwrap .ww-quote button.qt-ssub { height: 44px; }
  #wrapwrap .ww-quote .qt-sheet__panel { top: 0; right: 0; bottom: 0; width: 100%; max-width: none; border-radius: 0; transform: translateY(12px); }
  #wrapwrap .ww-quote .qt-sheet__body { padding: 20px 16px 24px; }
  #wrapwrap .ww-quote .qt-sheet__ph { height: 220px; }
  #wrapwrap .ww-quote h2.qt-sheet__t { font-size: 26px !important; }
  #wrapwrap .ww-quote .qt-sheet__row { grid-template-columns: 112px minmax(0, 1fr); }
  #wrapwrap .ww-quote .qt-sheet__foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
}
@media (max-width: 420px) { #wrapwrap .ww-quote .qt-sheet__ak { display: none; } }
/* echelles par tranche : une ligne par gamme, hauteur a saisir, la bonne fiche s'ouvre (v2.20) */
#wrapwrap .ww-quote .qt-prow[hidden] { display: none !important; }
#wrapwrap .ww-quote .qt-prow--h { grid-template-columns: 88px minmax(0, 1fr) minmax(220px, 280px); }
#wrapwrap .ww-quote .qt-hgt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; align-items: end; }
#wrapwrap .ww-quote .qt-hgt__f { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 10px; margin: 0; font-size: 13px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-quote .qt-hgt__rg { font-family: var(--font-mono); font-size: 12px; font-weight: 400; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-quote .qt-hgt__box { position: relative; display: block; min-width: 0; }
html body #wrapwrap .ww-quote input.qt-hgt__in { width: 100% !important; height: 44px !important; margin: 0 !important; padding: 0 52px 0 14px !important; border: 1px solid var(--border-1) !important; border-radius: 8px !important; background: var(--surface-card) !important; font-family: var(--font-mono) !important; font-size: 15px !important; color: var(--ink-900) !important; box-shadow: none !important; }
#wrapwrap .ww-quote .qt-hgt__box em { position: absolute; top: 1px; right: 1px; bottom: 1px; width: 44px; display: grid; place-items: center; border-left: 1px solid var(--border-1); font-style: normal; font-family: var(--font-mono); font-size: 13px; color: var(--text-3); pointer-events: none; }
#wrapwrap .ww-quote .qt-hgt .qt-hgo { height: 44px; }
#wrapwrap .ww-quote .qt-hgt__err { grid-column: 1 / -1; font-size: 13px; line-height: 1.4; color: #B42318; }
#wrapwrap .ww-quote #ww-product .qt-switch { justify-self: start; margin-top: 2px; }
@media (max-width: 760px) { #wrapwrap .ww-quote .qt-prow.qt-prow--h { grid-template-columns: 64px minmax(0, 1fr); } #wrapwrap .ww-quote .qt-prow--h .qt-hgt { grid-column: 1 / -1; } #wrapwrap .ww-quote .qt-hgt .qt-hgo { width: auto !important; } }
@media (max-width: 360px) { #wrapwrap .ww-quote .qt-hgt { grid-template-columns: minmax(0, 1fr); } #wrapwrap .ww-quote .qt-hgt .qt-hgo { width: 100% !important; } }
#wrapwrap .ww-quote .qt-step2__empty { padding: 22px 26px 26px; font-size: 15px; }
#wrapwrap .ww-quote .qt-step2__empty p { margin: 6px 0 0; color: var(--text-2); }
#wrapwrap .ww-quote .qt-toast { position: fixed; z-index: 1070; right: 24px; bottom: 24px; display: flex; align-items: flex-start; gap: 12px; width: min(380px, calc(100vw - 32px)); padding: 14px 14px 14px 16px; background: var(--surface-card); color: var(--text-1); border: 1px solid var(--border-1); border-radius: 12px; box-shadow: var(--shadow-l); opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease; }
#wrapwrap .ww-quote .qt-toast.is-in { opacity: 1; transform: none; }
#wrapwrap .ww-quote .qt-toast[hidden] { display: none; }
#wrapwrap .ww-quote .qt-toast__ico { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--green-100); color: var(--green-800); }
#wrapwrap .ww-quote .qt-toast__ico svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-quote .qt-toast__txt { flex: 1; min-width: 0; display: grid; gap: 2px; padding-top: 5px; }
#wrapwrap .ww-quote .qt-toast__txt b { font-size: 15px; font-weight: 700; }
#wrapwrap .ww-quote .qt-toast__d { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-quote .qt-toast__x { flex: none; width: 32px; height: 32px; border: 0; background: transparent; color: var(--text-3); font-size: 22px; line-height: 1; cursor: pointer; border-radius: 6px; }
@media (max-width: 760px) {
  #wrapwrap .ww-quote a.qt-cat { grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px; min-height: 44px; }
  #wrapwrap .ww-quote .qt-cat__media { aspect-ratio: 1 / 1; width: 72px; }
  #wrapwrap .ww-quote .qt-cat__go { display: inline-flex; }
  #wrapwrap .ww-quote .qt-cat__desc { font-size: 13px; }
  #wrapwrap .ww-quote .qt-cat__row b { font-size: 16px; }
  #wrapwrap .ww-quote .qt-prow { grid-template-columns: 64px minmax(0, 1fr); padding: 16px; }
  #wrapwrap .ww-quote .qt-prow__act { grid-column: 1 / -1; }
  #wrapwrap .ww-quote .qt-prow__act .dash-btn, #wrapwrap .ww-quote .qt-prow__act form { width: 100%; justify-content: center; }
  #wrapwrap .ww-quote .qt-step2__head { padding: 14px 16px; }
  #wrapwrap .ww-quote .qt-toast { left: 16px; right: 16px; bottom: 16px; width: auto; }
}

/* --- C1b : page du devis / de la commande (lecture) --- */
#wrapwrap .ww-order .qo-note { padding: 0 24px 12px; font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-order .qo-msg { padding: 14px 18px; font-size: 14px; color: var(--ink-800); margin-bottom: 16px; background: var(--ink-50); box-shadow: none; border: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-msg--ok { border-color: var(--green-500); }
#wrapwrap .ww-order .qo-msg a { color: var(--green-700) !important; text-decoration: underline !important; }
#wrapwrap .ww-order .qo-picks { display: grid; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-pick { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; }
#wrapwrap .ww-order .qo-terms { padding: 0; overflow: hidden; }
html body #wrapwrap .ww-order summary.qo-terms__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; list-style: none; cursor: pointer; }
#wrapwrap .ww-order summary.qo-terms__head::-webkit-details-marker { display: none; }
html body #wrapwrap .ww-order summary.qo-terms__head:hover { background: var(--ink-50); }
#wrapwrap .ww-order .qo-terms__ht { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-order .qo-terms__t { font-size: 20px; font-weight: 900; letter-spacing: -.02em; line-height: 1.2; color: var(--ink-900); }
#wrapwrap .ww-order .qo-terms__ht small { font-size: 12px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-order .qo-terms__tg { flex: none; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-order .qo-terms__tg::after { content: ""; width: 7px; height: 7px; margin-bottom: 3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
#wrapwrap .ww-order .qo-terms[open] .qo-terms__tg::after { transform: rotate(-135deg); margin-bottom: -3px; }
#wrapwrap .ww-order .qo-terms__off, #wrapwrap .ww-order .qo-terms[open] .qo-terms__on { display: none; }
#wrapwrap .ww-order .qo-terms[open] .qo-terms__off { display: inline; }
#wrapwrap .ww-order .qo-terms__body { padding: 0 24px 22px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-terms__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 14px; margin-top: 14px; }
#wrapwrap .ww-order .qo-terms__grid b { font-size: 14px; font-weight: 600; color: var(--ink-900); }
#wrapwrap .ww-order p.qo-terms__note { margin: 14px 0 0 !important; font-family: var(--font-sans) !important; font-size: 13px !important; line-height: 1.5 !important; color: var(--text-2) !important; white-space: pre-line; }
#wrapwrap .ww-order .qo-chat { padding: 20px 24px 22px; }
#wrapwrap .ww-order p.qo-chat__hint { margin: 6px 0 14px !important; font-family: var(--font-sans) !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-order .qo-chat__ph { padding: 24px; border: 1px dashed var(--border-2, #C4C4C1); border-radius: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); text-align: center; }
#wrapwrap .ww-order .qo-ttc { font-size: 13px; }
#wrapwrap .ww-order .qo-ttc b { color: var(--text-2); font-size: 13px; }
#wrapwrap .ww-order .qo-contact { padding: 20px 20px 22px; display: grid; gap: 14px; }
/* carte Adresses (30/09) : meme lecture que les cartes de la page « Demande envoyee » */
#wrapwrap .ww-order .qo-adr { padding: 18px 20px 20px; display: grid; gap: 16px; }
#wrapwrap .ww-order .qo-adr__b { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-order .qo-adr__b + .qo-adr__b { padding-top: 16px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-adr b { font-size: 15px; font-weight: 700; color: var(--ink-900); line-height: 1.35; overflow-wrap: anywhere; }
#wrapwrap .ww-order .qo-adr small { display: block; font-size: 14px; color: var(--text-2); line-height: 1.45; overflow-wrap: anywhere; }
@media (min-width: 761px) and (max-height: 900px) { #wrapwrap .ww-order .qt-aside { position: static; } }   /* colonne plus haute que l'ecran d'un portable : elle defile avec la page */
@media (max-width: 760px) { #wrapwrap .ww-quote .qo-adr { order: 2; } }   /* telephone : juste apres le recapitulatif */
#wrapwrap .ww-order .qo-contact__row { display: flex; align-items: center; gap: 12px; }
#wrapwrap .ww-order .qo-contact__av { flex: none; width: 44px; height: 44px; border-radius: 22px; overflow: hidden; background: var(--ink-900); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; }
#wrapwrap .ww-order .qo-contact__av img { width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww-order .qo-contact__row b { display: block; font-size: 15px; color: var(--ink-900); }
#wrapwrap .ww-order .qo-contact .dash-btn { justify-self: start; }
#wrapwrap .ww-order .qo-opts { padding: 20px 24px 22px; }
#wrapwrap .ww-order .qo-opt { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 12px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-opt__name { flex: 1 1 260px; font-size: 15px; font-weight: 600; color: var(--ink-900); white-space: pre-line; }
#wrapwrap .ww-order .qo-opt__price del { color: var(--text-3); font-size: 13px; margin-right: 6px; }
#wrapwrap .ww-order .qo-signed { display: grid; gap: 2px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border-1); font-size: 14px; }
#wrapwrap .ww-order .qo-signed small { color: var(--text-3); }
#wrapwrap .ww-order .qo-signed__img { max-width: 180px; max-height: 60px; margin-top: 6px; }
@media (max-width: 760px) {
  #wrapwrap .ww-order .qo-line .qt-line__price { grid-column: 2 / 3; padding-top: 0 !important; align-self: center; }
  html body #wrapwrap .ww-order summary.qo-terms__head { padding: 16px; }
  #wrapwrap .ww-order .qo-terms__body { padding: 0 16px 16px; }
  #wrapwrap .ww-order .qo-terms__t { font-size: 18px; }
  html body #wrapwrap .ww-order button.qo-chat__head { padding: 16px; }
  #wrapwrap .ww-order .qo-chat__body { padding: 0 16px 16px; }
  #wrapwrap .ww-order .qo-chat__t { font-size: 18px; }
}
/* --- page devis v1.1 (handoff ENTREE/devis-v1.1, 30/09) --- */
#wrapwrap .ww-quote .dash-badge--blue { background: #E6F0FF; color: #1D4ED8; }
#wrapwrap .ww-quote .dash-badge--blue::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: #3B82F6; }
#wrapwrap .ww-order .qo-dot { font-style: normal; color: var(--green-500); }
html body #wrapwrap .ww-order p.qo-sub { margin: 10px 0 0 !important; font-family: var(--font-sans) !important; font-size: 15px !important; line-height: 1.4 !important; color: var(--text-2) !important; }
/* etapes : carte blanche ; faite = pastille encre + coche, en cours = pastille verte, a venir = cercle vide */
#wrapwrap .ww-order .qo-steps { padding: 20px 24px; margin-bottom: 16px; }
#wrapwrap .ww-order .qo-steps__l { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
#wrapwrap .ww-order .qo-steps__l li { position: relative; padding-left: 40px; min-height: 28px; }
#wrapwrap .ww-order .qo-steps__l li::after { content: ""; position: absolute; left: 28px; right: 12px; top: 13px; height: 1.5px; background: var(--ink-200); z-index: 0; }
#wrapwrap .ww-order .qo-steps__l li:last-child::after { display: none; }
#wrapwrap .ww-order .qo-steps__l li.is-done::after { background: var(--ink-900); }
#wrapwrap .ww-order .qo-steps__l b { position: relative; z-index: 1; display: inline-block; margin-left: -12px; padding: 0 10px 0 12px; background: #fff; font-size: 15px; font-weight: 700; color: var(--ink-900); line-height: 28px; }
#wrapwrap .ww-order .qo-steps__l li:not(.is-done):not(.is-cur) b { color: var(--text-3); font-weight: 600; }
#wrapwrap .ww-order .qo-steps__l small { display: block; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); line-height: 1.35; }
#wrapwrap .ww-order .qo-steps__dot { position: absolute; left: 0; top: 0; z-index: 1; width: 28px; height: 28px; border-radius: 14px; border: 1.5px solid var(--ink-300); background: #fff; color: var(--ink-700); font-family: var(--font-mono); font-size: 12px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
#wrapwrap .ww-order .qo-steps__dot .i { width: 14px; height: 14px; stroke-width: 2.6; }
#wrapwrap .ww-order li.is-done .qo-steps__dot { background: var(--ink-900); border-color: var(--ink-900); color: #fff; }
#wrapwrap .ww-order li.is-cur .qo-steps__dot { background: var(--green-500); border-color: var(--green-500); color: var(--ink-900); box-shadow: 0 0 0 4px var(--point-halo); }
#wrapwrap .ww-order .qo-steps__m { display: none; }
/* bandeau d'etat */
#wrapwrap .ww-order .qo-band { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; padding: 20px 24px; border-radius: 12px; background: var(--green-50); }
#wrapwrap .ww-order .qo-band--muted { background: var(--ink-50); border: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-band__t { min-width: 0; }
#wrapwrap .ww-order .qo-band__eb { font-family: var(--font-mono); font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--green-700); }
#wrapwrap .ww-order .qo-band--muted .qo-band__eb { color: var(--text-3); }
#wrapwrap .ww-order .qo-band__t > b { display: block; margin-top: 6px; font-size: 16px; font-weight: 700; color: var(--ink-900); }
html body #wrapwrap .ww-order .qo-band__t p { margin: 4px 0 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-order .qo-band .dash-btn { flex: none; }
/* sections et lignes */
#wrapwrap .ww-order .qo-grp { display: grid; gap: 12px; margin-bottom: 28px; }
#wrapwrap .ww-order .qo-sec { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 2px; }
#wrapwrap .ww-order .qo-sec__n { font-size: 13px; color: var(--green-700); }
html body #wrapwrap .ww-order h2.qo-sec__t { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 22px !important; font-weight: 900 !important; letter-spacing: -.02em !important; line-height: 1.2 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-order .qo-sec__m { margin-left: auto; font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-order .qo-note { padding: 0 4px; font-size: 14px; color: var(--text-2); white-space: pre-line; }
#wrapwrap .ww-order .qo-card { padding: 0; overflow: hidden; }
#wrapwrap .ww-order .qo-card__top { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 20px; align-items: start; padding: 20px 22px; }
#wrapwrap .ww-order .qo-card__img { width: 112px; height: 112px; border-radius: 10px; border: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-card__main { min-width: 0; }
#wrapwrap .ww-order .qo-card__ref { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--text-3); }
html body #wrapwrap .ww-order h3.qo-card__name { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 700 !important; letter-spacing: 0 !important; line-height: 1.3 !important; color: var(--ink-900) !important; }
html body #wrapwrap .ww-order p.qo-card__sum { margin: 6px 0 0 !important; font-size: 14px !important; line-height: 1.45 !important; color: var(--text-2) !important; }
#wrapwrap .ww-order .qo-card__acts { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 12px; }
#wrapwrap .ww-order .qo-card__price { text-align: right; }
#wrapwrap .ww-order .qo-card__price b { display: block; font-size: 20px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-order .qo-card__price small { display: block; margin-top: 4px; font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-order .qo-card__price .qt-qty { margin: 10px 0 0 auto; }
#wrapwrap .ww-order .qo-card__price .qt-act { display: block; margin-top: 8px; font-size: 13px; }
html body #wrapwrap .ww-order button.qo-card__cfg { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; margin: 0; padding: 0 22px; border: 0; border-top: 1px solid var(--border-1); border-radius: 0; background: var(--ink-50); font-family: var(--font-sans); font-size: 14px; font-weight: 700; color: var(--ink-900); text-align: left; cursor: pointer; }
html body #wrapwrap .ww-order button.qo-card__cfg:hover { background: var(--ink-100); }
#wrapwrap .ww-order .qo-card__cfgl::after { content: ""; display: inline-block; width: 7px; height: 7px; margin: 0 0 3px 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
#wrapwrap .ww-order .qo-card__cfg[aria-expanded="true"] .qo-card__cfgl::after { transform: rotate(-135deg); margin-bottom: -1px; }
#wrapwrap .ww-order .qo-card__cfg small { font-size: 12px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-order .qo-card__tbl { padding: 4px 22px 14px; background: var(--ink-50); }
#wrapwrap .ww-order .qo-card__tbl[hidden] { display: none; }
#wrapwrap .ww-order .qo-kv { display: grid; grid-template-columns: minmax(120px, 36%) minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 11px 0; border-top: 1px solid var(--border-1); font-size: 14px; }
#wrapwrap .ww-order .qo-kv:first-child { border-top: 0; }
#wrapwrap .ww-order .qo-kv span { color: var(--text-2); }
#wrapwrap .ww-order .qo-kv b { font-weight: 700; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-order .qo-kv--full { grid-template-columns: minmax(0, 1fr); }
#wrapwrap .ww-order .qo-kv--full b { font-weight: 400; color: var(--text-2); }
/* recapitulatif */
#wrapwrap .ww-order .qo-recap { display: grid; gap: 0; }
#wrapwrap .ww-order .qo-recap__h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 12px; }
#wrapwrap .ww-order .qo-recap__h .qt-mono { font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-order .qo-recap__r { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-order .qo-recap__r b { font-size: 15px; font-weight: 500; color: var(--ink-900); }
#wrapwrap .ww-order .qo-recap__ttc { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 10px; padding-top: 14px; border-top: 1.5px solid var(--ink-900); }
#wrapwrap .ww-order .qo-recap__ttc span { font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-order .qo-recap__ttc b { font-size: 30px; font-weight: 600; letter-spacing: -.02em; color: var(--ink-900); white-space: nowrap; }
html body #wrapwrap .ww-order p.qo-recap__note { margin: 12px 0 0 !important; font-family: var(--font-sans) !important; font-size: 13px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-order .qo-vbar { height: 6px; margin-top: 14px; border-radius: 3px; background: var(--ink-100); overflow: hidden; }
#wrapwrap .ww-order .qo-vbar i { display: block; height: 100%; border-radius: 3px; background: var(--green-500); }
html body #wrapwrap .ww-order p.qo-recap__due { margin: 8px 0 0 !important; font-family: var(--font-mono) !important; font-size: 12px !important; line-height: 1.4 !important; color: var(--text-2) !important; }
#wrapwrap .ww-order .qo-recap .qt-rail__acts { margin-top: 18px; }
#wrapwrap .ww-order .qo-recap .dash-btn { width: 100%; justify-content: center; }
#wrapwrap .ww-order .qo-recap .dash-btn--ghost { border: 1px dashed var(--border-2); }
/* adresses : libelles verts, lien de correction en gras */
#wrapwrap .ww-order .qo-adr .dash-eyebrow { color: var(--green-700); }
html body #wrapwrap .ww-order a.qo-adr__fix { justify-self: start; font-size: 14px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; }
html body #wrapwrap .ww-order a.qo-adr__fix:hover { text-decoration: underline !important; text-underline-offset: 3px; }
/* charge d'affaires : telephone et e-mail gardes */
#wrapwrap .ww-order .qo-contact__row small { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-order small.qo-contact__sla { font-family: var(--font-mono); font-size: 12px; color: var(--green-700); }
#wrapwrap .ww-order .qo-contact__co { display: grid; gap: 4px; padding-top: 12px; border-top: 1px solid var(--border-1); }
html body #wrapwrap .ww-order .qo-contact__co a { font-size: 14px; color: var(--ink-800) !important; text-decoration: none !important; overflow-wrap: anywhere; }
html body #wrapwrap .ww-order .qo-contact__co a:hover { text-decoration: underline !important; }
#wrapwrap .ww-order .qo-sticky { display: none; }
/* objet du devis (note d'en-tete du charge d'affaires) */
#wrapwrap .ww-order .qo-obj { padding: 18px 22px; margin-bottom: 24px; }
#wrapwrap .ww-order .qo-obj__l { display: grid; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
#wrapwrap .ww-order .qo-obj__l li { position: relative; padding-left: 16px; font-size: 15px; line-height: 1.5; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-order .qo-obj__l li::before { content: ""; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 3px; background: var(--green-500); }
#wrapwrap .ww-order .qo-obj__l li:only-child { padding-left: 0; }
#wrapwrap .ww-order .qo-obj__l li:only-child::before { display: none; }
/* echanges replies par defaut */
#wrapwrap .ww-order .qo-chat { padding: 0; overflow: hidden; }
html body #wrapwrap .ww-order button.qo-chat__head { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; margin: 0; padding: 20px 24px; border: 0; border-radius: 0; background: transparent; font-family: var(--font-sans); text-align: left; cursor: pointer; }
html body #wrapwrap .ww-order button.qo-chat__head:hover { background: var(--ink-50); }
#wrapwrap .ww-order .qo-chat__ht { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-order .qo-chat__t { font-size: 20px; font-weight: 900; letter-spacing: -.02em; line-height: 1.2; color: var(--ink-900); }
#wrapwrap .ww-order .qo-chat__ht small { font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-order .qo-chat__tg { flex: none; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-order .qo-chat__tg::after { content: ""; width: 7px; height: 7px; margin-bottom: 3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .15s ease; }
#wrapwrap .ww-order .qo-chat__head[aria-expanded="true"] .qo-chat__tg::after { transform: rotate(-135deg); margin-bottom: -3px; }
#wrapwrap .ww-order .qo-chat__body { padding: 0 24px 22px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-order .qo-chat__body[hidden] { display: none !important; }
/* descriptif d'un article standard : se lit comme un texte (lignes libres sans filet), les « Cle : valeur » restent en deux colonnes */
#wrapwrap .ww-order .qo-card__tbl--desc { padding-top: 12px; }
#wrapwrap .ww-order .qo-card__tbl--desc .qo-kv--full { padding: 2px 0; border-top: 0; }
#wrapwrap .ww-order .qo-card__tbl--desc .qo-kv--full b { line-height: 1.55; }
@media (max-width: 1180px) {
  #wrapwrap .ww-order .qo-steps__l b { font-size: 14px; }
}
@media (max-width: 760px) {
  /* ordre telephone : lignes, recapitulatif, adresses, charge d'affaires, livraison, conditions, echanges */
  #wrapwrap .ww-order .qo-obj, #wrapwrap .ww-order .qo-grp, #wrapwrap .ww-order .qo-opts { order: 1; }
  #wrapwrap .ww-order .qo-obj { padding: 16px; margin-bottom: 8px; }
  #wrapwrap .ww-order .qo-recap { order: 2; }
  #wrapwrap .ww-quote .qo-adr { order: 3; }
  #wrapwrap .ww-order .qo-contact { order: 4; }
  #wrapwrap .ww-order .qt-ship { order: 5; }
  #wrapwrap .ww-order .qo-terms { order: 6; }
  #wrapwrap .ww-order .qo-chat { order: 7; }
  #wrapwrap .ww-order .qo-grp { margin-bottom: 8px; }
  #wrapwrap .ww-order .qo-steps { padding: 16px; }
  #wrapwrap .ww-order .qo-steps__l { display: none; }
  #wrapwrap .ww-order .qo-steps__m { display: block; }
  #wrapwrap .ww-order .qo-steps__mh { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
  #wrapwrap .ww-order .qo-steps__mh b { font-size: 15px; font-weight: 700; color: var(--ink-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #wrapwrap .ww-order .qo-steps__mh span { flex: none; font-size: 12px; color: var(--text-3); }
  #wrapwrap .ww-order .qo-steps__bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin-top: 10px; }
  #wrapwrap .ww-order .qo-steps__bar i { height: 4px; border-radius: 2px; background: var(--ink-200); }
  #wrapwrap .ww-order .qo-steps__bar i.is-done { background: var(--ink-900); }
  #wrapwrap .ww-order .qo-steps__bar i.is-cur { background: var(--green-500); }
  #wrapwrap .ww-order .qo-band { flex-direction: column; align-items: stretch; gap: 14px; padding: 18px 16px; }
  #wrapwrap .ww-order .qo-band .dash-btn { justify-content: center; }
  #wrapwrap .ww-order .qo-sec__m { margin-left: 0; flex-basis: 100%; }
  html body #wrapwrap .ww-order h2.qo-sec__t { font-size: 20px !important; }
  #wrapwrap .ww-order .qo-card__top { grid-template-columns: 72px minmax(0, 1fr); gap: 12px 14px; padding: 16px; }
  #wrapwrap .ww-order .qo-card__img { width: 72px; height: 72px; }
  #wrapwrap .ww-order .qo-card__price { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; text-align: left; padding-top: 12px; border-top: 1px solid var(--border-1); }
  #wrapwrap .ww-order .qo-card__price b { font-size: 18px; }
  #wrapwrap .ww-order .qo-card__price small { margin-top: 0; }
  html body #wrapwrap .ww-order button.qo-card__cfg { padding: 0 16px; }
  #wrapwrap .ww-order .qo-card__tbl { padding: 4px 16px 12px; }
  #wrapwrap .ww-order .qo-kv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  #wrapwrap .ww-order.has-sticky { padding-bottom: 96px; }
  #wrapwrap .ww-order .qo-sticky { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--border-1); }
  #wrapwrap .ww-order .qo-sticky small { display: block; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
  #wrapwrap .ww-order .qo-sticky b { display: block; font-size: 20px; font-weight: 600; color: var(--ink-900); }
  #wrapwrap .ww-order .qo-sticky .dash-btn { height: 48px; padding: 0 20px; }
}
@media print { #wrapwrap .ww-order .qo-sticky, #wrapwrap .ww-order .qo-band .dash-btn, #wrapwrap .ww-order .qo-card__cfg { display: none !important; } #wrapwrap .ww-order .qo-card__tbl[hidden] { display: block !important; } }

/* ===== page « Votre demande est partie » (handoff demande-envoyee-v1.0) — racine .qc ===== */
#wrapwrap .ww-quote.qc { padding-top: 12px; padding-bottom: 48px; }
#wrapwrap .ww-quote.qc .qc-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
#wrapwrap .ww-quote.qc .qc-main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; min-width: 0; }
@media (min-width: 1280px) {
  #wrapwrap .ww-quote.qc .qc-grid { grid-template-columns: minmax(0, 1fr) 340px; }
  #wrapwrap .ww-quote.qc .qc-side { position: sticky; top: 84px; }
}
#wrapwrap .ww-quote.qc .dash-card { border-radius: 12px; box-shadow: var(--shadow-card); }
/* carte titre */
#wrapwrap .ww-quote.qc .qc-hero { padding: 36px 40px; }
#wrapwrap .ww-quote.qc .qc-repere::before { bottom: 18px; }
#wrapwrap .ww-quote.qc .qc-eyebrow { color: var(--green-700); letter-spacing: .12em; }
#wrapwrap .ww-quote.qc h1.qc-h1 { font-family: var(--font-display); font-weight: 900 !important; font-size: 40px !important; line-height: 1.05 !important; letter-spacing: -.02em; margin: 10px 0 14px; color: var(--ink-900); }
#wrapwrap .ww-quote.qc .qc-h1 i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-quote.qc .qc-lede { font-size: 17px; line-height: 1.55; color: var(--text-2); max-width: 600px; margin: 0 0 22px; }
#wrapwrap .ww-quote.qc .qc-lede b { color: var(--ink-900); font-weight: 700; }
#wrapwrap .ww-quote.qc .qc-acts { display: flex; flex-wrap: wrap; gap: 10px; }
/* etapes */
#wrapwrap .ww-quote.qc .qc-steps { padding: 26px 28px; }
#wrapwrap .ww-quote.qc .qc-steps__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-quote.qc .qc-steps__head .dash-eyebrow { color: var(--green-700); }
#wrapwrap .ww-quote.qc .qc-steps__pos, #wrapwrap .ww-quote.qc .qc-steps__when, #wrapwrap .ww-quote.qc .qc-steps__n { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-quote.qc .qc-steps__list { list-style: none; margin: 0; padding: 0; position: relative; }
#wrapwrap .ww-quote.qc .qc-steps__list::before { content: ""; position: absolute; left: 13px; top: 0; bottom: 0; width: 1.5px; background: var(--ink-200); }
#wrapwrap .ww-quote.qc .qc-steps__list li { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; column-gap: 14px; align-items: start; padding: 18px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-quote.qc .qc-steps__list li:first-child { border-top: 0; }
#wrapwrap .ww-quote.qc .qc-steps__dot { display: block !important; grid-column: 1; grid-row: 1; justify-self: center; margin-top: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--surface-card); border: 1.5px solid var(--ink-300); position: relative; z-index: 1; }
#wrapwrap .ww-quote.qc .qc-steps__list li.is-cur .qc-steps__dot { width: 12px; height: 12px; margin-top: 4px; border: 0; background: var(--green-500); box-shadow: 0 0 0 5px var(--point-halo, rgba(0, 230, 176, .28)); }
#wrapwrap .ww-quote.qc .qc-steps__t { font-size: 16px; font-weight: 700; color: var(--ink-900); line-height: 1.35; }
#wrapwrap .ww-quote.qc .qc-steps__n { margin-right: 8px; }
#wrapwrap .ww-quote.qc .qc-steps__body p { margin: 6px 0 0; font-size: 14px; line-height: 1.55; color: var(--text-2); max-width: 560px; }
#wrapwrap .ww-quote.qc .qc-steps__body { grid-column: 2; grid-row: 1; min-width: 0; }
#wrapwrap .ww-quote.qc .qc-steps__when { grid-column: 3; grid-row: 1; padding-top: 3px; }
/* callout */
#wrapwrap .ww-quote.qc .qc-callout { position: relative; display: flex; gap: 14px; align-items: flex-start; padding: 18px 22px 18px 34px; border-radius: 12px; background: var(--surface-muted); }
#wrapwrap .ww-quote.qc .qc-callout::before { content: ""; position: absolute; left: 18px; top: 16px; width: 10px; height: 10px; border-radius: 50%; background: var(--green-500); }
#wrapwrap .ww-quote.qc .qc-callout::after { content: ""; position: absolute; left: 22px; top: 26px; bottom: 16px; width: 1.5px; background: var(--ink-900); }
#wrapwrap .ww-quote.qc svg.qc-callout__i { display: block !important; flex: none; width: 20px; height: 20px; margin-left: 4px; fill: none; stroke: var(--ink-700, #5C5C5C); stroke-width: 1.6; stroke-linecap: round; }
#wrapwrap .ww-quote.qc .qc-callout .dash-eyebrow { color: var(--text-3); }
#wrapwrap .ww-quote.qc .qc-callout p { margin: 4px 0 0; font-size: 15px; line-height: 1.55; color: var(--ink-900); }
/* trois cartes */
#wrapwrap .ww-quote.qc .qc-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 1000px) { #wrapwrap .ww-quote.qc .qc-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
#wrapwrap .ww-quote.qc .qc-card { padding: 18px 20px; display: grid; gap: 6px; align-content: start; }
#wrapwrap .ww-quote.qc .qc-card .dash-eyebrow { color: var(--text-3); }
#wrapwrap .ww-quote.qc .qc-card b { font-size: 15px; font-weight: 700; color: var(--ink-900); line-height: 1.35; overflow-wrap: anywhere; }
#wrapwrap .ww-quote.qc .qc-card small { font-size: 13px; color: var(--text-2); line-height: 1.45; }
/* colonne solutions */
#wrapwrap .ww-quote.qc .qc-side { padding: 22px 24px; min-width: 0; }
#wrapwrap .ww-quote.qc .qc-side__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 12px; }
#wrapwrap .ww-quote.qc .qc-side__head .dash-eyebrow { color: var(--green-700); }
#wrapwrap .ww-quote.qc .qc-line { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-quote.qc .qc-thumb { width: 56px; height: 56px; border-radius: 8px; }
#wrapwrap .ww-quote.qc .qc-line__body { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-quote.qc .qc-line__name { font-size: 14px; font-weight: 700; color: var(--ink-900); line-height: 1.3; }
#wrapwrap .ww-quote.qc .qc-line__sum { font-size: 12px; color: var(--text-2); line-height: 1.4; }
#wrapwrap .ww-quote.qc .qc-line__foot { display: flex; justify-content: space-between; gap: 10px; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); margin-top: 2px; }
#wrapwrap .ww-quote.qc .qc-line__foot b { color: var(--ink-900); font-weight: 500; white-space: nowrap; }
#wrapwrap .ww-quote.qc .qc-tot { display: grid; gap: 8px; padding-top: 14px; border-top: 1px solid var(--border-1); font-size: 14px; }
#wrapwrap .ww-quote.qc .qc-tot__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; color: var(--text-2); }
#wrapwrap .ww-quote.qc .qc-tot__row b { font-family: var(--font-mono); font-weight: 500; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-quote.qc .qc-tot__grand { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--border-1); color: var(--ink-900); font-weight: 700; }
#wrapwrap .ww-quote.qc .qc-tot__grand b { font-size: 20px; font-weight: 600; }
#wrapwrap .ww-quote.qc p.qc-tot__note { margin: 4px 0 0; font-size: 12px !important; line-height: 1.45; color: var(--text-3); }
/* mobile */
@media (max-width: 600px) {
  #wrapwrap .ww-quote.qc .qc-hero { padding: 24px 20px; }
  #wrapwrap .ww-quote.qc h1.qc-h1 { font-size: 32px !important; }
  #wrapwrap .ww-quote.qc .qc-acts { flex-direction: column; }
  #wrapwrap .ww-quote.qc .qc-acts .dash-btn { width: 100%; justify-content: center; }
  #wrapwrap .ww-quote.qc .qc-steps { padding: 22px 20px; }
  #wrapwrap .ww-quote.qc .qc-steps__list li { grid-template-columns: 28px minmax(0, 1fr); }
  #wrapwrap .ww-quote.qc .qc-steps__when { grid-column: 2; grid-row: 2; padding-top: 8px; white-space: normal; }
  #wrapwrap .ww-quote.qc .qc-side { padding: 22px 20px; }
}

/* ===== Envoi du chiffrage (handoff envoi-chiffrage-v1.0, sans etape Projet) : modes #livraison / #envoi de la page Chiffrage — envoi_build.py ===== */
#wrapwrap .ww-quote .qt-env { display: grid; gap: 16px; min-width: 0; }
#wrapwrap .ww-quote:not([data-mode="send"]) .qt-env { display: none !important; }
#wrapwrap .ww-quote[data-mode="send"] .qt-cartpart, #wrapwrap .ww-quote[data-mode="send"] .qt-add, #wrapwrap .ww-quote[data-mode="send"] .qt-config,
#wrapwrap .ww-quote[data-mode="send"] .qt-sticky, #wrapwrap .ww-quote[data-mode="send"] .qt-rail__acts, #wrapwrap .ww-quote[data-mode="send"] .qt-alert,
#wrapwrap .ww-quote[data-mode="send"] .qt-back, #wrapwrap .ww-quote[data-mode="send"] .qt-rename { display: none !important; }   /* en-tete, parcours, recapitulatif et « Un doute » restent : seule la zone centrale change */
#wrapwrap .ww-quote .qt-rail__edit { display: none; }
#wrapwrap .ww-quote[data-mode="send"] .qt-rail__edit { display: inline; font-size: 13px; font-weight: 700; color: var(--ink-900) !important; text-decoration-line: none !important; }
#wrapwrap .ww-quote[data-mode="send"] .qt-rail__edit:hover { color: var(--green-700) !important; }
#wrapwrap .ww-quote .qt-rail__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
#wrapwrap .ww-quote .qt-ship__note { align-self: end; margin: 0 0 4px !important; font-family: var(--font-sans) !important; font-size: 13.2px !important; font-weight: 400 !important; line-height: 1.45 !important; color: var(--text-3) !important; }
/* panneaux */
#wrapwrap .ww-quote .qt-epanes { padding: 32px 36px; }
#wrapwrap .ww-quote .qt-eeb { color: var(--green-700); }
#wrapwrap .ww-quote h2.qt-eh { margin: 10px 0 0 !important; font-family: var(--font-sans) !important; font-size: 36px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1 !important; color: var(--ink-900) !important; text-wrap: balance; }
#wrapwrap .ww-quote h2.qt-eh i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-quote p.qt-elead { margin: 10px 0 0 !important; max-width: 560px; font-family: var(--font-sans) !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-quote .qt-esec { display: block; margin-top: 28px; }
#wrapwrap .ww-quote .qt-radio { width: 16px; height: 16px; border-radius: 8px; border: 1.5px solid #C9C9C6; display: grid; place-items: center; flex: none; }
#wrapwrap .ww-quote .qt-radio::after { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--ink-900); opacity: 0; }
#wrapwrap .ww-quote [aria-pressed="true"] > .qt-radio { border-color: var(--ink-900); }
#wrapwrap .ww-quote [aria-pressed="true"] > .qt-radio::after { opacity: 1; }
#wrapwrap .ww-quote .qt-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
#wrapwrap .ww-quote button.qt-opt, #wrapwrap .ww-quote button.qt-addr { appearance: none; margin: 0; font: inherit; color: var(--ink-900) !important; text-align: left; cursor: pointer; box-shadow: none; }
#wrapwrap .ww-quote button.qt-opt { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 10px; align-items: center; align-content: start; min-height: 64px; padding: 14px 16px; border: 1px solid var(--border-1) !important; border-radius: 12px; background: #fff !important; }
#wrapwrap .ww-quote button.qt-opt[aria-pressed="true"] { border-color: var(--ink-900) !important; background: var(--ink-50) !important; }
#wrapwrap .ww-quote .qt-opt strong { font-size: 15px; font-weight: 700; line-height: 1.25; }
#wrapwrap .ww-quote .qt-opt small { grid-column: 2; font-size: 13px; color: var(--text-2); line-height: 1.4; }
#wrapwrap .ww-quote .qt-addrs { display: grid; margin-top: 10px; border: 1px solid var(--border-1); border-radius: 12px; overflow: hidden; }
#wrapwrap .ww-quote button.qt-addr { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; width: 100%; min-height: 56px; padding: 14px 16px; border: 0 !important; border-radius: 0; background: #fff !important; }
#wrapwrap .ww-quote button.qt-addr + button.qt-addr { border-top: 1px solid var(--border-1) !important; }
#wrapwrap .ww-quote button.qt-addr[aria-pressed="true"] { background: var(--ink-50) !important; }
#wrapwrap .ww-quote button.qt-opt:focus-visible, #wrapwrap .ww-quote button.qt-addr:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-quote .qt-addr .qt-radio { grid-row: 1 / 3; }
#wrapwrap .ww-quote .qt-addr strong { font-size: 15px; font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-addr small { grid-column: 2; font-size: 13px; color: var(--text-2); min-width: 0; overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-addr em { grid-row: 1 / 3; grid-column: 3; font-style: normal; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-quote .qt-enew { display: grid; gap: 16px; margin-top: 20px; }
#wrapwrap .ww-quote .qt-enew[hidden], #wrapwrap .ww-quote .qt-eship[hidden], #wrapwrap .ww-quote .qt-epick[hidden], #wrapwrap .ww-quote .qt-epane[hidden], #wrapwrap .ww-quote .qt-eerr[hidden] { display: none !important; }
#wrapwrap .ww-quote .qt-eg { display: grid; gap: 16px; align-items: start; }
#wrapwrap .ww-quote .qt-eg--2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
#wrapwrap .ww-quote .qt-eg--3 { grid-template-columns: 160px minmax(0, 1fr) minmax(0, 1fr); }
#wrapwrap .ww-quote .qt-efield { margin: 0; }
#wrapwrap .ww-quote .qt-efield .qt-lbl { font-size: 13px !important; margin: 0; }
#wrapwrap .ww-quote .qt-req { font-style: normal; color: #D92D20; }
#wrapwrap .ww-quote .qt-input[aria-invalid="true"] { border-color: #D92D20; }
#wrapwrap .ww-quote p.qt-ehint { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.45 !important; color: var(--text-3) !important; }
#wrapwrap .ww-quote .qt-eacc { display: grid; gap: 12px; margin-top: 14px; }
#wrapwrap .ww-quote label.qt-esec { margin-bottom: 0; }
#wrapwrap .ww-quote .qt-edate { display: grid; gap: 6px; max-width: 280px; margin-top: 14px; }
#wrapwrap .ww-quote .qt-edate small { font-size: 13.2px; color: var(--text-3); }
#wrapwrap .ww-quote label.qt-echeck { display: flex; gap: 10px; align-items: flex-start; margin: 0; font-size: 14px; font-weight: 500; line-height: 1.4; color: var(--ink-900); cursor: pointer; }
#wrapwrap .ww-quote .qt-echeck input { width: 20px; height: 20px; margin: 0; accent-color: var(--ink-900); flex: none; }
#wrapwrap .ww-quote .qt-echeck small { display: block; margin-top: 2px; font-size: 13px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-quote .qt-ecall { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; padding: 16px 18px; border-radius: 12px; margin-top: 24px; }
#wrapwrap .ww-quote .qt-ecall--sunken { background: var(--ink-100); }
#wrapwrap .ww-quote .qt-ecall--pro { background: #F8FAC0; }
#wrapwrap .ww-quote .qt-ecall .dash-eyebrow { display: block; margin-bottom: 4px; color: var(--ink-700); }
#wrapwrap .ww-quote p.qt-ecall__p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-quote .qt-edot { width: 8px; height: 8px; margin-top: 4px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo); }
#wrapwrap .ww-quote .qt-edot--ink { background: var(--ink-900); box-shadow: none; }
#wrapwrap .ww-quote .qt-erecap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-top: 24px; }
#wrapwrap .ww-quote .qt-erecap > div { display: grid; gap: 8px; align-content: start; padding: 18px 20px; border-radius: 12px; background: var(--ink-50); min-width: 0; }
#wrapwrap .ww-quote .qt-erecap__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
#wrapwrap .ww-quote .qt-erecap__top a { min-height: 32px; display: inline-flex; align-items: center; font-size: 13px; font-weight: 700; color: var(--ink-900) !important; text-decoration-line: none !important; }
#wrapwrap .ww-quote .qt-erecap__top a:hover { color: var(--green-700) !important; }
#wrapwrap .ww-quote .qt-erecap__t { font-size: 15px; overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-erecap__l { font-size: 13px; line-height: 1.45; color: var(--text-2); overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-erecap__l[hidden], #wrapwrap .ww-quote .qt-erecap__t[hidden], #wrapwrap .ww-quote .qt-erecap__list[hidden] { display: none; }
#wrapwrap .ww-quote ul.qt-erecap__list { display: grid; gap: 4px; margin: 2px 0 0 !important; padding: 0 !important; list-style: none; }
#wrapwrap .ww-quote .qt-erecap__list li { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; line-height: 1.4; color: var(--text-2); min-width: 0; }
#wrapwrap .ww-quote .qt-erecap__list li span { min-width: 0; overflow-wrap: anywhere; }
#wrapwrap .ww-quote .qt-erecap__list li b { flex: none; font-family: var(--font-mono); font-weight: 500; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-quote .qt-erecap__list .qt-erecap__more { color: var(--text-3); }
#wrapwrap .ww-quote .qt-erecap__tot { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-top: 8px; border-top: 1px solid var(--border-1); font-size: 14px; font-weight: 700; }
#wrapwrap .ww-quote .qt-erecap__tot b { font-family: var(--font-mono); font-size: 16px; font-weight: 600; white-space: nowrap; }
#wrapwrap .ww-quote .qt-env .qt-cgv { margin-top: 20px; }
#wrapwrap .ww-quote .qt-eerr { margin-top: 16px !important; }
#wrapwrap .ww-quote .qt-efoot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-quote .qt-efoot .dash-btn { gap: 8px; }
#wrapwrap .ww-quote .qt-esend.is-busy { opacity: .6; cursor: progress; }
/* etape 03 : popup au-dessus de l'ecran (comme l'ancienne boite d'envoi) */
#wrapwrap .ww-quote .qt-emodal { position: fixed; inset: 0; z-index: 1060; display: flex; align-items: center; justify-content: center; padding: 24px; }
#wrapwrap .ww-quote .qt-emodal[hidden] { display: none !important; }
#wrapwrap .ww-quote .qt-emodal__s { position: absolute; inset: 0; background: rgba(20,20,20,.42); }
#wrapwrap .ww-quote .qt-emodal__card { position: relative; width: 100%; max-width: 620px; max-height: calc(100vh - 48px); overflow-y: auto; padding: 28px 32px 24px; border-radius: 16px; background: #fff; box-shadow: 0 12px 40px rgba(20,20,20,.18); }
#wrapwrap .ww-quote .qt-emodal .qt-efoot { margin-top: 24px; }
html.qt-elock, html.qt-elock body { overflow: hidden; }
@media (max-width: 1180px) {
  #wrapwrap .ww-quote[data-mode="send"] .qt-grid { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-quote[data-mode="send"] .qt-aside { position: static; }
}
@media (max-width: 760px) {
  #wrapwrap .ww-quote .qt-epanes { padding: 24px 20px 0; }
  #wrapwrap .ww-quote h2.qt-eh { font-size: 30px !important; }
  #wrapwrap .ww-quote .qt-modes, #wrapwrap .ww-quote .qt-eg--2, #wrapwrap .ww-quote .qt-eg--3, #wrapwrap .ww-quote .qt-erecap { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-quote .qt-efoot { position: sticky; bottom: 0; z-index: 3; margin: 24px -20px 0; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px)); background: #fff; }
  #wrapwrap .ww-quote .qt-emodal { align-items: flex-end; padding: 0; }
  #wrapwrap .ww-quote .qt-emodal__card { max-width: none; max-height: 92vh; padding: 22px 20px 0; border-radius: 16px 16px 0 0; }
  #wrapwrap .ww-quote .qt-efoot .dash-btn { min-height: 48px; }
  #wrapwrap .ww-quote .qt-efoot .dash-btn:last-child { flex: 1; min-width: 0; justify-content: center; }
  #wrapwrap .ww-quote .qt-hide-m { display: none; }
}


/* ===== cat.css ===== */
/* ===== cat.css — lot C2a page Catalogue (handoff catalogue-v1.0) : racine .ww-cat ===== */
html body:has(#ww-nav) #wrapwrap #wrap.js_sale:has(.ww-cat) { margin: 0 !important; padding: 0 !important; max-width: none !important; }
html body:has(#ww-nav) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-cat { max-width: none !important; width: auto !important; margin: 0 !important; padding: 12px 40px 64px !important; }
@media (max-width: 760px) { html body:has(#ww-nav) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-cat { padding: 16px 16px 96px !important; } }
#wrapwrap .ww-cat .cg-mono { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
/* en-tete */
#wrapwrap .ww-cat .cg-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin-bottom: 20px; }
#wrapwrap .ww-cat .cg-head__txt { flex: 1 1 520px; min-width: 0; }
#wrapwrap .ww-cat .cg-eyebrow { color: var(--green-700); }
#wrapwrap .ww-cat h1.cg-h1 { font-family: var(--font-display); font-weight: 900 !important; font-size: 40px !important; line-height: 1.05 !important; letter-spacing: -.02em; margin: 8px 0 12px; color: var(--ink-900); }
#wrapwrap .ww-cat .cg-h1 i, #wrapwrap .ww-cat .cg-h2 i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-cat .cg-lede { font-size: 17px; line-height: 1.55; color: var(--text-2); max-width: 640px; margin: 0; }
/* onglets de section */
#wrapwrap .ww-cat .cg-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border-1); overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-cat .cg-tabs::-webkit-scrollbar { display: none; }
#wrapwrap .ww-cat .cg-tab { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 14px; font-size: 15px; font-weight: 500; color: var(--text-2) !important; text-decoration: none !important; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
#wrapwrap .ww-cat .cg-tab small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-cat .cg-tab.is-on { color: var(--ink-900) !important; font-weight: 700; border-bottom-color: var(--ink-900); }
#wrapwrap .ww-cat .cg-tab:hover { color: var(--ink-900) !important; }
/* repere de section */
#wrapwrap .ww-cat .cg-sec { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; container-type: inline-size; }
#wrapwrap .ww-cat .cg-repere { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; }
#wrapwrap .ww-cat .cg-repere__txt { position: relative; padding-left: 28px; flex: 1 1 520px; min-width: 0; }
#wrapwrap .ww-cat .cg-repere__txt::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 2px; width: 1.5px; background: var(--ink-900); }
#wrapwrap .ww-cat .cg-repere__txt::after { content: ""; position: absolute; left: 0; top: 0; width: 12px; height: 12px; border-radius: 6px; background: var(--green-500); box-shadow: 0 0 0 6px var(--point-halo, rgba(0, 230, 176, .28)); }
#wrapwrap .ww-cat .cg-repere .dash-eyebrow { color: var(--green-700); }
#wrapwrap .ww-cat .cg-repere--pro .cg-repere__txt::after { background: #ECF22E; box-shadow: 0 0 0 6px rgba(236, 242, 46, .35); }
#wrapwrap .ww-cat .cg-repere--pro .dash-eyebrow { display: inline-block; background: var(--ink-900); color: #ECF22E; padding: 3px 10px; border-radius: 4px; }
#wrapwrap .ww-cat .cg-co { color: #ECF22E; }
#wrapwrap .ww-cat h2.cg-h2 { font-family: var(--font-display); font-weight: 900 !important; font-size: 26px !important; line-height: 1.15 !important; letter-spacing: -.01em; margin: 8px 0 8px; color: var(--ink-900); }
#wrapwrap .ww-cat .cg-repere p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--text-2); max-width: 620px; }
#wrapwrap .ww-cat .cg-only { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 8px; background: var(--ink-900); color: #fff; font-size: 14px; font-weight: 500; }
#wrapwrap .ww-cat .cg-only__dot { width: 10px; height: 10px; border-radius: 50%; background: #ECF22E; }
/* cartes familles (configurateur) */
#wrapwrap .ww-cat .cg-fams { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
@container (min-width: 1120px) { #wrapwrap .ww-cat .cg-fams { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
#wrapwrap .ww-cat .cg-fam { display: grid; grid-template-columns: 216px minmax(0, 1fr); min-height: 232px; overflow: hidden; padding: 0; border-radius: 12px; transition: box-shadow .15s ease-out; }
#wrapwrap .ww-cat .cg-fam:hover, #wrapwrap .ww-cat .cg-card:hover { box-shadow: var(--shadow-m); }
#wrapwrap .ww-cat .cg-fam__media, #wrapwrap .ww-cat .cg-card__media, #wrapwrap .ww-cat .cg-ref__media { position: relative; display: block; background: var(--ink-800, #232323); min-height: 100%; overflow: hidden; }
#wrapwrap .ww-cat .cg-fam__media img, #wrapwrap .ww-cat .cg-card__media img, #wrapwrap .ww-cat .cg-ref__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-cat .cg-card__media img, #wrapwrap .ww-cat .cg-ref__media img { object-fit: contain; background: #fff; }
#wrapwrap .ww-cat .cg-ph { position: absolute; inset: 0; display: grid; place-items: center; padding: 16px; text-align: center; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-300, #9A9A98); }
#wrapwrap .ww-cat .ww-tech.cg-tech-on { position: absolute; top: 12px; left: 12px; z-index: 1; }
#wrapwrap .ww-cat .cg-fam__body { padding: 26px 26px 22px; display: grid; gap: 10px; align-content: start; }
#wrapwrap .ww-cat h3.cg-fam__name { font-family: var(--font-body, Heebo, sans-serif) !important; font-size: 24px !important; font-weight: 700 !important; line-height: 1.2; margin: 0; color: var(--ink-900); }
#wrapwrap .ww-cat .cg-fam__body p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--text-2); }
#wrapwrap .ww-cat .cg-params { list-style: none; margin: 2px 0 0; padding: 0 0 16px; display: flex; flex-wrap: wrap; gap: 6px 16px; font-family: var(--font-mono); font-size: 13px; color: var(--ink-800, #3D3D3D); border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-cat .cg-fam__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 12px; padding-top: 4px; }
#wrapwrap .ww-cat .cg-fam__body { min-width: 0; }
#wrapwrap .ww-cat h3.cg-fam__name, #wrapwrap .ww-cat .cg-fam__body p { overflow-wrap: anywhere; }
#wrapwrap .ww-cat .cg-from { font-size: 14px; color: var(--text-2); white-space: nowrap; }
#wrapwrap .ww-cat .cg-fam__foot svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; }
/* bandeau de pied */
#wrapwrap .ww-cat .cg-band { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 18px 22px; border-radius: 12px; background: var(--ink-50, #F0F0EE); }
#wrapwrap .ww-cat .cg-band p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink-800, #3D3D3D); max-width: 640px; }
/* equipements : pilules, sous-familles, recherche */
#wrapwrap .ww-cat .cg-pills, #wrapwrap .ww-cat .cg-subs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
#wrapwrap .ww-cat .cg-pills::-webkit-scrollbar, #wrapwrap .ww-cat .cg-subs::-webkit-scrollbar { display: none; }
#wrapwrap .ww-cat .cg-pill, #wrapwrap .ww-cat .cg-sub { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--border-1); background: var(--surface-card); font-size: 14px; font-weight: 500; color: var(--ink-800, #3D3D3D) !important; text-decoration: none !important; white-space: nowrap; }
#wrapwrap .ww-cat .cg-sub { height: 32px; font-size: 13px; background: transparent; }
#wrapwrap .ww-cat .cg-pill small, #wrapwrap .ww-cat .cg-sub small { font-family: var(--font-mono); font-size: 11px; color: var(--text-3); }
#wrapwrap .ww-cat .cg-pill.is-on { background: var(--ink-900); border-color: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-cat .cg-pill.is-on small { color: var(--ink-300, #C4C4C1); }
#wrapwrap .ww-cat .cg-sub.is-on { border-color: var(--ink-900); color: var(--ink-900) !important; font-weight: 700; }
/* grille produits */
#wrapwrap .ww-cat .cg-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
@container (min-width: 620px) { #wrapwrap .ww-cat .cg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (min-width: 980px) { #wrapwrap .ww-cat .cg-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
#wrapwrap .ww-cat .cg-card { display: flex; flex-direction: column; padding: 0; overflow: hidden; border-radius: 12px; transition: box-shadow .15s ease-out; }
#wrapwrap .ww-cat .cg-card__media { aspect-ratio: 16 / 10; min-height: 0; flex: none; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-cat .cg-card__body { flex: 1; display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 18px; }
#wrapwrap .ww-cat .cg-card__ref { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
#wrapwrap .ww-cat .cg-tag { font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; background: var(--ink-100, #E4E4E1); color: var(--ink-700, #5C5C5C); }
#wrapwrap .ww-cat h3.cg-card__name { font-family: var(--font-body, Heebo, sans-serif) !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.3; margin: 0; }
#wrapwrap .ww-cat .cg-card__name a, #wrapwrap .ww-cat .cg-ref__name a { color: var(--ink-900) !important; font-weight: inherit !important; text-decoration: none !important; }
#wrapwrap .ww-cat .cg-card__desc { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-2); }
#wrapwrap .ww-cat .cg-card__foot { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border-1); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
#wrapwrap .ww-cat .cg-card__foot form { margin: 0; }
#wrapwrap .ww-cat .cg-link { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: 14px; color: var(--green-700) !important; text-decoration: none !important; }
#wrapwrap .ww-cat .cg-link svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-cat .cg-price { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-cat .cg-price b { font-size: 14px; font-weight: 600; color: var(--ink-900); }
#wrapwrap .ww-cat .cg-empty { padding: 28px; text-align: center; }
#wrapwrap .ww-cat .cg-empty p { margin: 6px 0 0; color: var(--text-2); }
#wrapwrap .ww-cat .cg-pager { display: flex; justify-content: center; }
/* pagination au design (Charles 01/10 : « suit l'ancien design ») : boutons 40 px (44 en mobile), coins 8, page courante en encre */
#wrapwrap .ww-cat .cg-pager { margin-top: 32px; }
#wrapwrap .ww-cat .cg-pager .pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0 !important; padding: 0; list-style: none; }
#wrapwrap .ww-cat .cg-pager .page-item { margin: 0 !important; }
#wrapwrap .ww-cat .cg-pager .page-link { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; margin: 0 !important; padding: 0 12px; border: 1px solid var(--border-1) !important; border-radius: 8px !important; background: #fff !important; color: var(--ink-900) !important; font-family: var(--font-sans); font-size: 14px; font-weight: 500; line-height: 1; text-decoration: none !important; box-shadow: none !important; }
#wrapwrap .ww-cat .cg-pager .page-link:hover { background: var(--ink-50) !important; border-color: var(--ink-300) !important; }
#wrapwrap .ww-cat .cg-pager .page-item.active .page-link { background: var(--ink-900) !important; border-color: var(--ink-900) !important; color: #fff !important; font-weight: 700; }
#wrapwrap .ww-cat .cg-pager .page-item.disabled .page-link { background: transparent !important; border-color: transparent !important; color: var(--text-3) !important; pointer-events: none; }
@media (max-width: 760px) { #wrapwrap .ww-cat .cg-pager .page-link { min-width: 44px; height: 44px; } }
/* vos references */
#wrapwrap .ww-cat .cg-refs { display: grid; gap: 12px; }
/* catalogue v1.1 : la ligne entiere ouvre la fiche laterale ; plan du produit ; action jaune (regle du catalogue reserve) */
#wrapwrap .ww-cat .cg-ref[data-v], #wrapwrap .ww-cat .cg-card[data-v] { cursor: pointer; }
#wrapwrap .ww-cat .cg-ref[data-v] { transition: box-shadow .15s ease; }
#wrapwrap .ww-cat .cg-ref[data-v]:hover { box-shadow: var(--shadow-m); }
#wrapwrap .ww-cat .cg-ref__hist { display: grid; gap: 4px; justify-items: start; }
html body #wrapwrap .ww-cat a.cg-ref__plan { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-size: 13px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; overflow-wrap: anywhere; }
html body #wrapwrap .ww-cat a.cg-ref__plan:hover { text-decoration: underline !important; text-underline-offset: 3px; }
#wrapwrap .ww-cat .cg-ref__plan svg { flex: none; width: 16px; height: 16px; }
html body #wrapwrap .ww-cat .cg-sec--mine .dash-btn--accent { background: #ECF22E !important; color: var(--ink-900) !important; }
html body #wrapwrap .ww-cat .cg-sec--mine .dash-btn--accent:hover { background: #DDE31F !important; }
#wrapwrap .ww-cat .cg-repere--pro .dash-eyebrow { max-width: 100%; white-space: normal; line-height: 1.6; }
@media (max-width: 900px) {
  #wrapwrap .ww-cat .cg-repere { flex-direction: column; align-items: flex-start; }
  #wrapwrap .ww-cat .cg-repere__txt { flex-basis: auto; width: 100%; }
}
#wrapwrap .ww-cat .cg-ref { display: grid; grid-template-columns: 150px minmax(0, 2fr) minmax(0, 1.2fr) 170px auto; gap: 20px; align-items: center; padding: 14px; border-radius: 12px; }
#wrapwrap .ww-cat .cg-ref__media { height: 110px; border-radius: 8px; }
#wrapwrap .ww-cat .cg-reserved { position: absolute; top: 10px; left: 10px; padding: 3px 9px; border-radius: 999px; background: var(--ink-900); color: #ECF22E; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
#wrapwrap .ww-cat .cg-ref__main { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-cat h3.cg-ref__name { font-family: var(--font-body, Heebo, sans-serif) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.3; margin: 0; }
#wrapwrap .ww-cat .cg-ref__main small, #wrapwrap .ww-cat .cg-ref__hist { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-cat .cg-ref__price { display: grid; gap: 2px; }
#wrapwrap .ww-cat .cg-ref__price .dash-eyebrow { color: var(--text-3); }
#wrapwrap .ww-cat .cg-ref__price b { font-family: var(--font-mono); font-size: 17px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-cat .cg-ref__price b small { font-size: 12px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-cat .cg-ref__price > small { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-cat .cg-ref__act form { margin: 0; }
@container (max-width: 1060px) {
  #wrapwrap .ww-cat .cg-ref { grid-template-columns: 120px minmax(0, 1fr) auto; grid-template-areas: "media main price" "media hist act"; }
  #wrapwrap .ww-cat .cg-ref__media { grid-area: media; height: 100%; min-height: 110px; }
  #wrapwrap .ww-cat .cg-ref__main { grid-area: main; } #wrapwrap .ww-cat .cg-ref__hist { grid-area: hist; }
  #wrapwrap .ww-cat .cg-ref__price { grid-area: price; } #wrapwrap .ww-cat .cg-ref__act { grid-area: act; justify-self: end; }
}
@container (max-width: 700px) {
  #wrapwrap .ww-cat .cg-fam { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-cat .cg-fam__media { height: 180px; min-height: 0; }
  #wrapwrap .ww-cat .cg-fam__body { padding: 18px; }
}
@container (max-width: 620px) {
  #wrapwrap .ww-cat .cg-ref { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "main" "hist" "price" "act"; gap: 10px; }
  #wrapwrap .ww-cat .cg-ref__media { height: 160px; }
  #wrapwrap .ww-cat .cg-ref__act, #wrapwrap .ww-cat .cg-ref__act form, #wrapwrap .ww-cat .cg-ref__act .dash-btn { width: 100%; justify-self: stretch; justify-content: center; }
}
/* ---- « Vos references » : bandeau noir + cartes photo (handoff espace-reserve-v1.0 D4, 10/10) ; jaune #ECF22E reserve a cet espace ---- */
#wrapwrap .ww-cat .cg-rhero { position: relative; margin: 0 0 24px; padding: 30px 32px 22px 70px; border-radius: 16px; background: var(--ink-900); color: #fff; }
#wrapwrap .ww-cat .cg-rhero::before { content: ""; position: absolute; left: 43px; top: 46px; height: calc(100% - 130px); min-height: 120px; width: 1px; background: rgba(236, 242, 46, .45); }
#wrapwrap .ww-cat .cg-rhero__dot { position: absolute; left: 36px; top: 33px; width: 15px; height: 15px; border-radius: 8px; background: #ECF22E; box-shadow: 0 0 0 5px rgba(236, 242, 46, .22); }
#wrapwrap .ww-cat .cg-rhero__in { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 40px; flex-wrap: wrap; }
#wrapwrap .ww-cat .cg-rhero__main { flex: 1 1 460px; min-width: 0; }
#wrapwrap .ww-cat .cg-rhero__k { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #ECF22E; }
#wrapwrap .ww-cat .cg-rhero__sep { color: rgba(255, 255, 255, .5); }
#wrapwrap .ww-cat .cg-rhero__co { display: inline-flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, .82); }
#wrapwrap .ww-cat .cg-rhero__mk { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 5px; overflow: hidden; background: #fff; color: var(--ink-900); font-family: var(--font-sans); font-size: 9px; font-weight: 800; letter-spacing: 0; vertical-align: middle; }
#wrapwrap .ww-cat .cg-rhero__mk img { width: 100%; height: 100%; object-fit: contain; padding: 2px; }
#wrapwrap .ww-cat .cg-rhero__mk--s { width: 18px; height: 18px; margin: 0 6px 0 2px; }
html body #wrapwrap .ww-cat h2.cg-rhero__t { margin: 14px 0 0 !important; font-family: var(--font-sans) !important; font-size: 40px !important; font-weight: 900 !important; letter-spacing: -.035em !important; line-height: 1 !important; color: #fff !important; }
#wrapwrap .ww-cat h2.cg-rhero__t i { font-style: normal; color: #ECF22E; }
html body #wrapwrap .ww-cat p.cg-rhero__lead { margin: 18px 0 0 !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.4 !important; color: #fff !important; }
html body #wrapwrap .ww-cat p.cg-rhero__p { max-width: 600px; margin: 8px 0 0 !important; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.55 !important; color: rgba(255, 255, 255, .82) !important; }
#wrapwrap .ww-cat .cg-rhero__ca { display: flex; align-items: center; gap: 12px; margin-top: 18px; font-size: 14px; line-height: 1.45; color: rgba(255, 255, 255, .82); }
#wrapwrap .ww-cat .cg-rhero__av { flex: none; width: 36px; height: 36px; border-radius: 18px; overflow: hidden; background: #fff; color: var(--ink-900); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; }
#wrapwrap .ww-cat .cg-rhero__av img { width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww-cat .cg-rhero__w { font-weight: 700; color: #fff; }
#wrapwrap .ww-cat .cg-rhero__kpis { display: grid; grid-template-columns: repeat(3, auto); border: 1px solid rgba(255, 255, 255, .16); border-radius: 12px; }
#wrapwrap .ww-cat .cg-rhero__kpis > div { display: grid; gap: 4px; padding: 14px 20px; }
#wrapwrap .ww-cat .cg-rhero__kpis > div + div { border-left: 1px solid rgba(255, 255, 255, .16); }
#wrapwrap .ww-cat .cg-rhero__n { font-family: var(--font-mono); font-size: 26px; font-weight: 500; line-height: 1; color: #fff; }
#wrapwrap .ww-cat .cg-rhero__n--y { color: #ECF22E; }
#wrapwrap .ww-cat .cg-rhero__kpis > div > span:last-child { font-size: 13px; color: rgba(255, 255, 255, .72); white-space: nowrap; }
#wrapwrap .ww-cat .cg-rhero__f { display: flex; align-items: flex-start; gap: 8px; margin: 22px 0 0 -34px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 13px; line-height: 1.5; color: rgba(255, 255, 255, .72); }
#wrapwrap .ww-cat .cg-rhero__f .cg-lock { flex: none; margin-top: 2px; }
#wrapwrap .ww-cat .cg-refs--cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
#wrapwrap .ww-cat .cg-refs--cards .cg-ref { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "media media" "main main" "hist hist" "price act"; gap: 0; align-items: end; padding: 0; border-radius: 14px; overflow: hidden; }
#wrapwrap .ww-cat .cg-refs--cards .cg-ref__media { grid-area: media; height: 220px; min-height: 0; border-radius: 0; }
#wrapwrap .ww-cat .cg-refs--cards .cg-ref__main { grid-area: main; align-self: start; padding: 18px 20px 0; }
#wrapwrap .ww-cat .cg-refs--cards .cg-ref__hist { grid-area: hist; align-self: start; margin: 0 20px; padding: 10px 0 14px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-cat .cg-refs--cards .cg-ref__price { grid-area: price; padding: 14px 12px 18px 20px; }
#wrapwrap .ww-cat .cg-refs--cards .cg-ref__act { grid-area: act; justify-self: end; padding: 14px 20px 18px 0; }
#wrapwrap .ww-cat .cg-ref__pr { font-family: var(--font-mono); font-size: 18px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-cat .cg-ref__pr small { font-size: 12px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-cat .cg-ref__pv { position: absolute; top: 10px; right: 10px; padding: 4px 10px; border-radius: 999px; background: #fff; color: var(--ink-900); font-size: 12px; font-weight: 700; white-space: nowrap; box-shadow: 0 1px 3px rgba(20, 20, 20, .16); }
@container (max-width: 1060px) {
  #wrapwrap .ww-cat .cg-refs--cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #wrapwrap .ww-cat .cg-refs--cards .cg-ref { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "media media" "main main" "hist hist" "price act"; }
  #wrapwrap .ww-cat .cg-refs--cards .cg-ref__media { height: 200px; }
}
@container (max-width: 620px) {
  #wrapwrap .ww-cat .cg-refs--cards { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-cat .cg-refs--cards .cg-ref { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "main" "hist" "price" "act"; gap: 0; }
  #wrapwrap .ww-cat .cg-refs--cards .cg-ref__price { padding: 14px 20px 6px; }
  #wrapwrap .ww-cat .cg-refs--cards .cg-ref__act { justify-self: stretch; padding: 8px 20px 18px; }
  #wrapwrap .ww-cat .cg-rhero { padding: 24px 18px 18px 44px; }
  #wrapwrap .ww-cat .cg-rhero::before { left: 25px; top: 38px; }
  #wrapwrap .ww-cat .cg-rhero__dot { left: 18px; top: 24px; width: 13px; height: 13px; }
  html body #wrapwrap .ww-cat h2.cg-rhero__t { font-size: 30px !important; }
  #wrapwrap .ww-cat .cg-rhero__kpis { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #wrapwrap .ww-cat .cg-rhero__kpis > div { padding: 12px; }
  #wrapwrap .ww-cat .cg-rhero__kpis > div > span:last-child { white-space: normal; font-size: 12px; }
  #wrapwrap .ww-cat .cg-rhero__f { margin-left: -26px; }
}
/* le theme impose a TOUT paragraphe 18 px / 300 en !important */
html body #wrapwrap .ww-cat p { font-weight: 400 !important; line-height: 1.5 !important; }
html body #wrapwrap .ww-cat p.cg-lede { font-size: 17px !important; line-height: 1.55 !important; }
html body #wrapwrap .ww-cat .cg-repere p, html body #wrapwrap .ww-cat .cg-fam__body p, html body #wrapwrap .ww-cat .cg-empty p { font-size: 15px !important; }
html body #wrapwrap .ww-cat .cg-band p, html body #wrapwrap .ww-cat p.cg-card__desc { font-size: 14px !important; }
/* notification d'ajout */
#wrapwrap .ww-cat .cg-toast { position: fixed; z-index: 1070; right: 24px; bottom: 24px; display: flex; align-items: flex-start; gap: 12px; width: min(380px, calc(100vw - 32px)); padding: 14px 14px 14px 16px; background: var(--surface-card); color: var(--text-1); border: 1px solid var(--border-1); border-radius: 12px; box-shadow: var(--shadow-l); opacity: 0; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease; }
#wrapwrap .ww-cat .cg-toast.is-in { opacity: 1; transform: none; }
#wrapwrap .ww-cat .cg-toast[hidden] { display: none; }
#wrapwrap .ww-cat .cg-toast__ico { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--green-100); color: var(--green-800); }
#wrapwrap .ww-cat .cg-toast__ico svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-cat .cg-toast__txt { flex: 1; min-width: 0; display: grid; gap: 2px; padding-top: 5px; }
#wrapwrap .ww-cat .cg-toast__txt b { font-size: 15px; font-weight: 700; }
#wrapwrap .ww-cat .cg-toast__d { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-cat .cg-toast__txt a { font-size: 13px; font-weight: 700; color: var(--green-700) !important; }
#wrapwrap .ww-cat .cg-toast__x { flex: none; width: 32px; height: 32px; border: 0; background: transparent; color: var(--text-3); font-size: 22px; line-height: 1; cursor: pointer; border-radius: 6px; }
/* mobile */
@media (max-width: 760px) {
  #wrapwrap .ww-cat h1.cg-h1 { font-size: 32px !important; }
  #wrapwrap .ww-cat h3.cg-fam__name { font-size: 20px !important; }
  #wrapwrap .ww-cat .cg-head .dash-btn { width: 100%; justify-content: center; }
  #wrapwrap .ww-cat .cg-toast { left: 16px; right: 16px; bottom: 16px; width: auto; }
}

/* ===== Equipements (handoff equipements-v1.0, 28/09) : controle segmente, tags de normes, cartes, points photo, toast encre ===== */
#wrapwrap .ww-cat .cg-sec--std { gap: 18px; }
#wrapwrap .ww-cat .cg-seg { display: inline-flex; gap: 2px; max-width: 100%; padding: 4px; border-radius: 10px; background: #E9E9E6; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-cat .cg-seg::-webkit-scrollbar { display: none; }
#wrapwrap .ww-cat .cg-seg__i { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--text-2) !important; text-decoration: none !important; white-space: nowrap; }
#wrapwrap .ww-cat .cg-seg__i small { font-family: var(--font-mono); font-size: 11px; color: var(--text-3); }
#wrapwrap .ww-cat .cg-seg__i:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-cat .cg-seg__i.is-on { background: #fff; color: var(--ink-900) !important; font-weight: 700; box-shadow: 0 1px 2px rgba(20, 20, 20, .08); }
/* carte */
#wrapwrap .ww-cat .cg-card { cursor: pointer; }
#wrapwrap .ww-cat .cg-card:has(:focus-visible) { outline: 2px solid var(--green-500); outline-offset: 2px; }   /* clavier seulement (Charles 10/10 : « je n'aime pas ces bordures vertes » apres la fiche) */
#wrapwrap .ww-cat .cg-card__media { position: relative; background: #fff; }
#wrapwrap .ww-cat .cg-card__media:has(.cg-ph) { background: var(--surface-photo, var(--ink-800, #232323)); }
#wrapwrap .ww-cat .cg-card__link { position: absolute; inset: 0; display: block; }
#wrapwrap .ww-cat .cg-card__media .cg-ph { position: absolute; left: 16px; right: 16px; bottom: 14px; top: auto; display: block; text-align: left; font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-300, #9A9A98); }
#wrapwrap .ww-cat .cg-dots { position: absolute; right: 8px; bottom: 8px; z-index: 2; display: flex; gap: 0; padding: 2px 4px; border-radius: 999px; background: rgba(255, 255, 255, .85); }
#wrapwrap .ww-cat .cg-dot { width: 20px; height: 20px; padding: 0; border: 0; background: transparent; display: grid; place-items: center; cursor: pointer; }
#wrapwrap .ww-cat .cg-dot i { display: block; width: 8px; height: 8px; border-radius: 50%; background: rgba(20, 20, 20, .25); }
#wrapwrap .ww-cat .cg-dot.is-on i { background: var(--ink-900); }
#wrapwrap .ww-cat .cg-card__body { padding: 20px 22px 22px; gap: 8px; }
#wrapwrap .ww-cat .cg-card__ref { flex-wrap: nowrap; justify-content: space-between; min-width: 0; }
#wrapwrap .ww-cat .cg-card__ref .cg-mono { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-cat .cg-card__ref .cg-tag { flex: none; margin-left: auto; }
#wrapwrap .ww-cat .cg-card__ref .cg-tag + .cg-tag { margin-left: 6px; }
#wrapwrap .ww-cat .cg-tag--etude { background: var(--ink-900); color: #fff; }
#wrapwrap .ww-cat h3.cg-card__name { font-size: 20px !important; letter-spacing: -.02em; }
#wrapwrap .ww-cat .cg-card__desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#wrapwrap .ww-cat .cg-card__foot { margin-top: auto; padding-top: 14px; }
#wrapwrap .ww-cat .cg-price { font-size: 13px; }
#wrapwrap .ww-cat .cg-price b { font-size: 13px; }
#wrapwrap .ww-cat .cg-empty .dash-btn { margin-top: 14px; }
/* toast du handoff : encre, bas droite (bas centre en mobile), fermeture auto 5 s */
#wrapwrap .ww-cat .cg-toast { background: var(--ink-900, #141414); color: #fff; border: 0; }
#wrapwrap .ww-cat .cg-toast__ico { background: transparent; color: var(--green-500); }
#wrapwrap .ww-cat .cg-toast__txt b { color: #fff; }
#wrapwrap .ww-cat .cg-toast__d { color: var(--ink-300, #C4C4C1); }
#wrapwrap .ww-cat .cg-toast__txt a { color: var(--green-500) !important; }
#wrapwrap .ww-cat .cg-toast__x { color: var(--ink-300, #9A9A98); }
@media (max-width: 760px) {
  #wrapwrap .ww-cat .cg-card__media { aspect-ratio: 16 / 9; }
  #wrapwrap .ww-cat .cg-card__foot .dash-btn { min-height: 44px; }
  #wrapwrap .ww-cat .cg-toast { left: 16px; right: 16px; width: auto; bottom: 16px; }
}
/* ===== Equipements v1.1 (handoff equipements-v1.1, 28/09) : recherche sur les 3 onglets, rail familles › sous-familles, puces, intertitres, chemin ===== */
#wrapwrap .ww-cat .cg-tabrow { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-bottom: 28px; }
#wrapwrap .ww-cat .cg-tabrow .cg-tabs { flex: 1 1 420px; min-width: 0; }
#wrapwrap .ww-cat .cg-q { flex: 0 1 360px; min-width: 0; margin: 0; }
#wrapwrap .ww-cat .cg-q__f { display: flex; align-items: center; height: 44px; border: 1px solid var(--border-1); border-radius: 8px; background: var(--surface-card, #fff); }
#wrapwrap .ww-cat .cg-q__f:focus-within { border-color: var(--ink-900); box-shadow: 0 0 0 3px rgba(0, 230, 176, .35); }
#wrapwrap .ww-cat .cg-q__go { flex: none; display: grid; place-items: center; width: 44px; height: 42px; padding: 0; border: 0; background: transparent; color: var(--text-2); cursor: pointer; }
#wrapwrap .ww-cat input.cg-q__in { flex: 1; min-width: 0; height: 42px; margin: 0; padding: 0 8px 0 0; border: 0 !important; border-radius: 0; background: transparent !important; box-shadow: none !important; outline: 0; font-size: 15px; color: var(--ink-900); -webkit-appearance: none; appearance: none; }
#wrapwrap .ww-cat input.cg-q__in::placeholder { color: var(--text-3); opacity: 1; }
#wrapwrap .ww-cat input.cg-q__in::-webkit-search-cancel-button { display: none; }
#wrapwrap .ww-cat .cg-q__x { flex: none; display: grid; place-items: center; width: 42px; height: 42px; color: var(--text-3) !important; }
#wrapwrap .ww-cat .cg-q__x:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-cat .cg-q svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-cat .cg-q__x svg.i { width: 16px; height: 16px; }
#wrapwrap .ww-cat .cg-q__n { flex: none; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
/* disposition : rail a gauche (>= 1180 px, hors recherche) ; dessous : rangee de familles + puces de sous-familles */
#wrapwrap .ww-cat .cg-std { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
#wrapwrap .ww-cat .cg-std__main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; min-width: 0; container-type: inline-size; }
#wrapwrap .ww-cat .cg-rail { display: none; }
@media (min-width: 1180px) {
  #wrapwrap .ww-cat .cg-std:has(> .cg-rail) { grid-template-columns: 240px minmax(0, 1fr); }
  @container (min-width: 500px) { #wrapwrap .ww-cat .cg-std__main .cg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }   /* 1180-1400 px avec rail : 2 colonnes */
  #wrapwrap .ww-cat .cg-rail { display: block; }
  #wrapwrap .ww-cat .cg-std:has(> .cg-rail) .cg-frow { display: none; }
  @container (min-width: 740px) { #wrapwrap .ww-cat .cg-std__main .cg-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }   /* 1440 px avec rail : 3 colonnes (handoff) */
}
#wrapwrap .ww-cat .cg-rail ul { list-style: none; margin: 0; padding: 0; }
#wrapwrap .ww-cat .cg-rail__k { padding: 0 0 12px 20px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-cat .cg-rail__l { position: relative; }
#wrapwrap .ww-cat .cg-rail__l::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--ink-200, #E4E4E1); }
#wrapwrap .ww-cat .cg-rail__f, #wrapwrap .ww-cat .cg-rail__i { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; text-decoration: none !important; line-height: 1.3; }
#wrapwrap .ww-cat .cg-rail__f { min-height: 40px; padding: 6px 0 6px 20px; font-size: 15px; font-weight: 500; color: var(--ink-900) !important; }
#wrapwrap .ww-cat .cg-rail__f.is-on { font-weight: 700; }
#wrapwrap .ww-cat .cg-rail__f.is-on::before { content: ""; position: absolute; left: -4px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 5px rgba(0, 230, 176, .28); }
#wrapwrap .ww-cat .cg-rail__s { padding: 0 0 6px 34px !important; }
#wrapwrap .ww-cat .cg-rail__i { min-height: 34px; padding: 4px 0; font-size: 13px; font-weight: 500; color: var(--text-2) !important; }
#wrapwrap .ww-cat .cg-rail__i span::before { content: "—"; margin-right: 8px; color: var(--ink-300, #C4C4C1); font-weight: 400; }
#wrapwrap .ww-cat .cg-rail__i.is-on { font-weight: 700; color: var(--ink-900) !important; }
#wrapwrap .ww-cat .cg-rail__f:hover, #wrapwrap .ww-cat .cg-rail__i:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-cat .cg-rail__f span, #wrapwrap .ww-cat .cg-rail__i span { min-width: 0; }
#wrapwrap .ww-cat .cg-rail small { flex: none; font-family: var(--font-mono); font-size: 12px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-cat .cg-frow { display: grid; gap: 12px; min-width: 0; }
#wrapwrap .ww-cat .cg-frow .cg-seg { justify-self: start; }
#wrapwrap .ww-cat .cg-chips { display: flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
#wrapwrap .ww-cat .cg-chips::-webkit-scrollbar { display: none; }
#wrapwrap .ww-cat .cg-chip { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--border-1); background: var(--surface-card, #fff); font-size: 14px; font-weight: 500; color: var(--ink-900) !important; text-decoration: none !important; white-space: nowrap; }
#wrapwrap .ww-cat .cg-chip small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-cat .cg-chip.is-on { background: var(--ink-900); border-color: var(--ink-900); color: #fff !important; font-weight: 700; }
#wrapwrap .ww-cat .cg-chip.is-on small { color: var(--ink-300, #C4C4C1); }
/* niveau 3 : intertitres dans la grille */
#wrapwrap .ww-cat h3.cg-grp { display: flex; align-items: baseline; gap: 10px; margin: 8px 0 0; padding-bottom: 10px; border-bottom: 1px solid var(--border-1); font-family: var(--font-body, Heebo, sans-serif) !important; font-size: 16px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ink-900); }
#wrapwrap .ww-cat h3.cg-grp small { font-family: var(--font-mono); font-size: 12px; font-weight: 400; color: var(--text-3); }
/* carte : chemin Famille › Sous-famille */
#wrapwrap .ww-cat .cg-card__path { font-family: var(--font-mono); font-size: 12px; color: var(--green-700); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* aucun resultat */
#wrapwrap .ww-cat .cg-nores { display: grid; gap: 8px; justify-items: start; padding: 28px; text-align: left; }
#wrapwrap .ww-cat .cg-nores .dash-eyebrow { color: var(--green-700); }
#wrapwrap .ww-cat .cg-nores b { font-size: 17px; line-height: 1.35; color: var(--ink-900); }
#wrapwrap .ww-cat .cg-nores p { max-width: 620px; }
#wrapwrap .ww-cat .cg-nores__acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 8px; }
#wrapwrap .ww-cat .cg-nores .dash-btn { margin-top: 0; }
#wrapwrap .ww-cat .cg-nores svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 760px) {
  #wrapwrap .ww-cat .cg-tabrow { gap: 12px; }
  #wrapwrap .ww-cat .cg-tabrow .cg-tabs, #wrapwrap .ww-cat .cg-q { flex: 1 1 100%; }
  #wrapwrap .ww-cat .cg-nores .dash-btn { min-height: 44px; }
}
/* ---- visiteur non connecte (handoff catalogue-public-v1.0, 01/10) : reperes, pieds « Voir la fiche / Prix pro », ligne d'etat, bandeau Espace pro ---- */
#wrapwrap .ww-cat .cg-head--pub .cg-head__txt { position: relative; padding-left: 32px; }
#wrapwrap .ww-cat .cg-head--pub .cg-head__txt::before { content: ""; position: absolute; left: 5px; top: 8px; bottom: 4px; width: 1.5px; background: var(--ink-900); }
#wrapwrap .ww-cat .cg-head--pub .cg-head__txt::after { content: ""; position: absolute; left: 0; top: 2px; width: 12px; height: 12px; border-radius: 6px; background: var(--green-500); box-shadow: 0 0 0 6px rgba(0, 230, 176, .28); }
#wrapwrap .ww-cat .cg-head--pub h1.cg-h1 { font-size: 64px !important; line-height: 1 !important; letter-spacing: -.035em !important; }   /* 07/11 : 0,92 faisait se chevaucher les lettres sur téléphone (audit UX) ; interligne 1 et approche de la landing */
#wrapwrap .ww-cat .cg-head--pub .cg-lede { font-size: 17px; max-width: 680px; }
#wrapwrap .ww-cat .cg-pubfoot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; }
#wrapwrap .ww-cat .cg-see { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--green-700) !important; text-decoration: none !important; white-space: nowrap; cursor: pointer; }
#wrapwrap .ww-cat .cg-see svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; }
#wrapwrap .ww-cat .cg-lockm, #wrapwrap .ww-cat .cg-state .cg-lockm { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
#wrapwrap .ww-cat svg.cg-lock { flex: none; width: 14px; height: 14px; fill: none; stroke: currentColor; }
#wrapwrap .ww-cat .cg-state { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; margin: 0 0 16px; }
#wrapwrap .ww-cat .cg-proband { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px 32px; margin: 48px 0 0; padding: 28px 32px; border: 1px solid var(--border-1); border-radius: 12px; background: #fff; }
#wrapwrap .ww-cat .cg-proband .dash-eyebrow { color: var(--green-700); }
#wrapwrap .ww-cat .cg-proband h2.cg-h2 { margin: 6px 0 8px; }
html body #wrapwrap .ww-cat .cg-proband p { margin: 0; max-width: 620px; font-size: 15px !important; line-height: 1.55; color: var(--text-2); }
#wrapwrap .ww-cat .cg-proband__acts { display: flex; flex-wrap: wrap; gap: 10px; }
#wrapwrap .ww-cat .cg-proband__acts .dash-btn { min-height: 48px; }
@media (max-width: 760px) {
  #wrapwrap .ww-cat .cg-head--pub h1.cg-h1 { font-size: 34px !important; }
  #wrapwrap .ww-cat .cg-seg__i { height: 44px; }
  #wrapwrap .ww-cat .cg-dot { width: 44px; height: 44px; }
  #wrapwrap .ww-cat .cg-proband { grid-template-columns: 1fr; padding: 24px 20px; }
  #wrapwrap .ww-cat .cg-proband__acts .dash-btn { flex: 1 1 100%; justify-content: center; }
}


/* ===== pv.css ===== */
/* ===== pv.css — fiche produit configurable au format du configurateur du handoff chiffrage (D5), page produit ET page chiffrage (Charles 28/09) ===== */
html body:has(#ww-nav) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-prod { max-width: none !important; width: auto !important; margin: 0 !important; padding: 12px 40px 64px !important; }
html body:has(#ww-nav) #wrapwrap #wrap.js_sale:has(.ww-prod) { margin: 0 !important; padding: 0 !important; max-width: none !important; }
@media (max-width: 760px) { html body:has(#ww-nav) #wrapwrap #wrap.js_sale > .oe_website_sale.ww-prod { padding: 16px 16px 112px !important; } }
#wrapwrap #ww-product { container-type: inline-size; }
/* elements montres par le script (accroche, puce, onglets, etiquettes) : masques tant qu'ils portent hidden, quel que soit leur display */
#wrapwrap #ww-product [hidden] { display: none !important; }
/* ancien habillage de la fiche (SCSS personnalise « bootstrap_overridden_frontend », piece jointe 278176) : quadrillage + pictogramme SVG
   en fond de #product_detail -> retires sous le design workwith (Charles 29/09 : « je vois un SVG en arriere-plan ») */
html body #wrapwrap #product_detail.ww-prod::before, html body #wrapwrap #product_detail.ww-prod::after { content: none !important; display: none !important; background: none !important; }
/* en-tete */
#wrapwrap #ww-product .pv-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin-bottom: 22px; }
#wrapwrap #ww-product .pv-head__txt { flex: 1 1 520px; min-width: 0; }
#wrapwrap #ww-product .pv-eyebrow { color: var(--green-700); }
#wrapwrap #ww-product .pv-eyebrow:empty { display: none; }
#wrapwrap #ww-product .pv-eyebrow span + span::before { content: " · "; }
#wrapwrap #ww-product .pv-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 8px 0 8px; }
#wrapwrap #ww-product .pv-etude { font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; background: var(--ink-900); color: #fff; }
html body #wrapwrap #ww-product p.pv-sol__etude { margin: 8px 0 16px; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap #ww-product h1.pv-h1 { font-family: var(--font-display); font-weight: 900 !important; font-size: 38px !important; line-height: 1.08 !important; letter-spacing: -.02em; margin: 0; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap #ww-product .pv-range { display: inline-flex; align-items: center; padding: 5px 12px; border-radius: 999px; border: 1.5px solid var(--ink-900); font-family: var(--font-mono); font-size: 13px; font-weight: 500; color: var(--ink-900); white-space: nowrap; }
#wrapwrap #ww-product .pv-lede { margin: 0; max-width: 640px; font-size: 16px; line-height: 1.55; color: var(--text-2); }
#wrapwrap #ww-product .pv-head__acts { display: flex; flex-wrap: wrap; gap: 10px; }
/* grille */
#wrapwrap #ww-product .pv-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: start; }
@container (min-width: 980px) { #wrapwrap #ww-product .pv-grid { grid-template-columns: minmax(0, 1fr) 360px; } #wrapwrap #ww-product .pv-side { position: sticky; top: 84px; } }
#wrapwrap #ww-product form.pv-form { margin: 0; }
#wrapwrap #ww-product .pv-main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; min-width: 0; }
#wrapwrap #ww-product .dash-card { border-radius: 12px; box-shadow: var(--shadow-card); }
/* photo */
/* carte produit compacte */
#wrapwrap #ww-product .pv-config.is-empty { display: none; }
/* carte produit : dans le chiffrage seulement (titre « Ajouter : … ») ; sur la fiche, l'en-tete porte deja le nom */
#wrapwrap .ww-prod #ww-product .pv-pcard { display: none; }
#wrapwrap #ww-product .pv-pcard { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 20px; align-items: center; padding: 20px; }
#wrapwrap #ww-product .pv-pcard__media { position: relative; width: 120px; height: 120px; padding: 0; border: 1px solid var(--border-1); border-radius: 8px; background: #fff; overflow: hidden; cursor: zoom-in; }
#wrapwrap #ww-product .pv-pcard__media img { display: block; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap #ww-product .pv-pcard__ph { display: grid; place-items: center; height: 100%; font-family: var(--font-mono); font-size: 11px; color: var(--ink-300, #9A9A98); }
#wrapwrap #ww-product .pv-pcard__txt { display: grid; gap: 6px; min-width: 0; }
#wrapwrap #ww-product .pv-pcard__ref { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
#wrapwrap #ww-product .pv-pcard__ref:empty { display: none; }
#wrapwrap #ww-product .pv-pcard__code { font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap #ww-product .pv-pcard__name { font-size: 20px; font-weight: 700; line-height: 1.25; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap #ww-product .pv-pcard__use { font-size: 15px; line-height: 1.45; color: var(--text-2); }
#wrapwrap #ww-product .pv-pcard__use:empty { display: none; }
/* sections (cartes) */
#wrapwrap #ww-product .pv-config, #wrapwrap #ww-product .pv-qty, #wrapwrap #ww-product .pv-info { padding: 22px 24px 24px; }
#wrapwrap #ww-product h2.pv-sec__t { margin: 0 0 16px; font-family: var(--font-body, inherit); font-size: 17px !important; font-weight: 700 !important; line-height: 1.3 !important; letter-spacing: 0; color: var(--ink-900); }
#wrapwrap #ww-product .pv-photo { padding: 0; margin-bottom: 18px; }
#wrapwrap #ww-product .pv-photo__media { position: relative; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: var(--ink-800, #232323); }
#wrapwrap #ww-product .pv-photo__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center 35%; background: #fff; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap #ww-product .pv-photo__ph { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-300, #9A9A98); }
#wrapwrap #ww-product .pv-photo__tags { position: absolute; top: 12px; right: 12px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
#wrapwrap #ww-product .pv-thumbs { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; scrollbar-width: none; }
#wrapwrap #ww-product .pv-thumbs::-webkit-scrollbar { display: none; }
#wrapwrap #ww-product .pv-thumb { flex: none; width: 76px; height: 57px; padding: 0; border: 1px solid var(--border-1); border-radius: 8px; background: #fff; overflow: hidden; cursor: pointer; }
#wrapwrap #ww-product .pv-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap #ww-product .pv-thumb.is-on { border: 2px solid var(--ink-900); }
#wrapwrap #ww-product .pv-photo__tags span { padding: 4px 10px; border-radius: 999px; background: var(--ink-900); color: #fff; font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
/* onglets */
#wrapwrap #ww-product .pv-card { padding: 0; }
#wrapwrap #ww-product .pv-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border-1); margin-bottom: 18px; overflow-x: auto; scrollbar-width: none; }
#wrapwrap #ww-product .pv-tabs::-webkit-scrollbar { display: none; }
#wrapwrap #ww-product .pv-tab { flex: none; height: 48px; padding: 0 14px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: transparent; font-size: 15px; font-weight: 500; color: var(--text-2); white-space: nowrap; cursor: pointer; }
#wrapwrap #ww-product .pv-tab small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap #ww-product .pv-tab.is-on { color: var(--ink-900); font-weight: 700; border-bottom-color: var(--ink-900); }
#wrapwrap #ww-product .pv-desc__txt { margin: 0 0 16px; font-size: 16px; line-height: 1.6; color: var(--ink-800, #3D3D3D); white-space: pre-line; }
#wrapwrap #ww-product #hr_product_attributes_simple, #wrapwrap #ww-product #product_attributes_simple { display: none !important; }
#wrapwrap #ww-product .pv-specs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 32px; margin: 0; }
@container (min-width: 760px) { #wrapwrap #ww-product .pv-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
#wrapwrap #ww-product .pv-spec { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap #ww-product .pv-spec dt { font-weight: 400; font-size: 14px; color: var(--text-2); min-width: 0; }
#wrapwrap #ww-product .pv-spec dd { margin: 0; font-size: 14px; font-weight: 500; color: var(--ink-900); text-align: right; }
#wrapwrap #ww-product .pv-spec dd.is-num { font-family: var(--font-mono); font-size: 13px; }
#wrapwrap #ww-product .pv-spec--txt dt { color: var(--ink-900); }
#wrapwrap #ww-product .pv-specs:empty { display: none; }
#wrapwrap #ww-product .pv-rich { display: grid; gap: 12px; margin-bottom: 18px; }
#wrapwrap #ww-product .pv-rich .pv-desc__txt { margin: 0; }
#wrapwrap #ww-product .pv-rich h4, #wrapwrap #ww-product .pv-pose h4 { margin: 6px 0 0; font-family: var(--font-body, inherit); font-size: 15px !important; font-weight: 700 !important; color: var(--ink-900); }
#wrapwrap #ww-product .pv-rich ul { margin: 0; padding-left: 18px; }
#wrapwrap #ww-product .pv-rich li { font-size: 15px; line-height: 1.5; color: var(--ink-800, #3D3D3D); }
#wrapwrap #ww-product .pv-norms { list-style: none; margin: 0; padding: 0; display: grid; }
#wrapwrap #ww-product .pv-norm { display: grid; gap: 4px; padding: 14px 0; border-top: 1px solid var(--border-1); }
#wrapwrap #ww-product .pv-norm:first-child { border-top: 0; padding-top: 2px; }
#wrapwrap #ww-product .pv-norm code { padding: 0; background: none; font-family: var(--font-mono); font-size: 12px; letter-spacing: .04em; color: var(--green-700); }
#wrapwrap #ww-product .pv-norm b { font-size: 15px; color: var(--ink-900); }
#wrapwrap #ww-product .pv-norm span { font-size: 14px; line-height: 1.5; color: var(--text-2); }
#wrapwrap #ww-product .pv-pose { display: grid; gap: 10px; }
#wrapwrap #ww-product .pv-pose ol { list-style: none; margin: 0; padding: 0; display: grid; }
#wrapwrap #ww-product .pv-pose li { position: relative; padding: 10px 0 10px 30px; border-top: 1px solid var(--border-1); font-size: 15px; line-height: 1.5; color: var(--ink-800, #3D3D3D); }
#wrapwrap #ww-product .pv-pose li:first-child { border-top: 0; }
#wrapwrap #ww-product .pv-pose li::before { content: ""; position: absolute; left: 4px; top: 17px; width: 10px; height: 10px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo, rgba(0, 230, 176, .28)); }
#wrapwrap #ww-product .pv-pose li a, #wrapwrap #ww-product .pv-callout a { font-weight: 700; color: var(--ink-900) !important; text-decoration: underline !important; }
#wrapwrap #ww-product .pv-callout { display: grid; gap: 2px; margin-top: 18px; padding: 14px 16px; border-radius: 10px; background: var(--surface-muted, #F0F0EE); font-size: 14px; line-height: 1.5; color: var(--text-2); }
#wrapwrap #ww-product .pv-callout b { color: var(--ink-900); }
#wrapwrap #ww-product .pv-none { margin: 0; font-size: 15px; color: var(--text-2); }
#wrapwrap #ww-product .pv-docs { display: grid; }
#wrapwrap #ww-product .pv-doc { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 0; border-top: 1px solid var(--border-1); }
#wrapwrap #ww-product .pv-doc:first-child { border-top: 0; }
#wrapwrap #ww-product .pv-doc__ext { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 8px; border: 1px solid var(--border-1); background: var(--ink-50, #F6F6F5); font-family: var(--font-mono); font-size: 10px; letter-spacing: .04em; color: var(--ink-700, #5C5C5C); }
#wrapwrap #ww-product .pv-doc__txt { display: grid; gap: 3px; min-width: 0; }
#wrapwrap #ww-product .pv-doc__txt b { font-size: 15px; color: var(--ink-900); }
#wrapwrap #ww-product .pv-doc__txt small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap #ww-product .pv-doc__acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
@container (max-width: 560px) { #wrapwrap #ww-product .pv-doc { grid-template-columns: 40px minmax(0, 1fr); } #wrapwrap #ww-product .pv-doc__acts { grid-column: 2; justify-content: flex-start; } }
/* configuration : un champ par attribut Odoo, options en cartes radio (menus natifs conserves, masques) */
#wrapwrap #ww-product ul.js_add_cart_variants { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
#wrapwrap #ww-product li.variant_attribute { position: relative; display: grid; gap: 10px; margin: 0; padding: 0; }
#wrapwrap #ww-product li.variant_attribute.d-none { display: none !important; }
#wrapwrap #ww-product li.variant_attribute .attribute_name { display: block; font-size: 15px; font-weight: 700; color: var(--ink-900); line-height: 1.35; }
#wrapwrap #ww-product li.variant_attribute.pv-req .attribute_name::after { content: " *"; color: var(--orange-600, #C2410C); }
#wrapwrap #ww-product .pv-ah { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px; }
#wrapwrap #ww-product .pv-ah .attribute_name { flex: 1 1 auto; min-width: 0; }
#wrapwrap #ww-product .pv-bounds, #wrapwrap #ww-product .pv-note { flex: none; margin-left: auto; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap #ww-product .pv-note { color: var(--orange-600, #C2410C); }
#wrapwrap #ww-product li.variant_attribute select.form-control { padding: 0 36px 0 14px !important; text-indent: 0 !important; width: 100% !important; }
#wrapwrap #ww-product li.variant_attribute select.form-control, #wrapwrap #ww-product li.variant_attribute input.variant_custom_value { height: 48px; border: 1px solid var(--border-1); border-radius: 8px; font-size: 15px; color: var(--ink-900); box-shadow: none; background-color: var(--surface-card); }
#wrapwrap #ww-product li.variant_attribute select.pv-proxied { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; }
#wrapwrap #ww-product .pv-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
#wrapwrap #ww-product .pv-opt { position: relative; display: grid; gap: 4px; align-content: start; min-height: 56px; margin: 0; padding: 12px 14px 12px 42px; border: 1px solid var(--border-1); border-radius: 10px; background: var(--surface-card); text-align: left; cursor: pointer; transition: border-color .15s, background-color .15s; }
#wrapwrap #ww-product .pv-opt::before { content: ""; position: absolute; left: 14px; top: 14px; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--ink-300, #C4C4C1); background: #fff; }
#wrapwrap #ww-product .pv-opt b { font-size: 15px; font-weight: 500; line-height: 1.35; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap #ww-product .pv-opt small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap #ww-product .pv-opt:hover { border-color: var(--ink-500, #767676); }
#wrapwrap #ww-product .pv-opt:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap #ww-product .pv-opt.is-on { border-color: var(--ink-900); background: var(--ink-50, #F6F6F5); }
#wrapwrap #ww-product .pv-opt.is-on b { font-weight: 700; }
#wrapwrap #ww-product .pv-opt.is-on::before { border: 5px solid var(--ink-900); }
#wrapwrap #ww-product .pv-opt.is-off { opacity: .45; cursor: not-allowed; }
#wrapwrap #ww-product .pv-opt.is-off b { text-decoration: line-through; }
#wrapwrap #ww-product li.variant_attribute input.variant_custom_value { font-family: var(--font-mono); font-size: 16px; }
#wrapwrap #ww-product li.variant_attribute ul.list-unstyled { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin: 0; padding: 0; }
#wrapwrap #ww-product li.variant_attribute ul.list-unstyled, #wrapwrap #ww-product li.variant_attribute ul.list-unstyled > li { list-style: none !important; }
#wrapwrap #ww-product li.variant_attribute ul.list-unstyled > li::marker { content: none; }
/* valeur unique a saisir (ex. hauteur) : Odoo cree le champ DANS le label du choix unique -> masquer le choix seulement, champ pleine largeur */
#wrapwrap #ww-product li.variant_attribute ul.list-unstyled:has(> li:only-child input[data-is_custom="True"]) { grid-template-columns: minmax(0, 1fr); }
#wrapwrap #ww-product li.variant_attribute ul.list-unstyled:has(> li:only-child input[data-is_custom="True"]) label > div { display: none !important; }
#wrapwrap #ww-product li.variant_attribute input.variant_custom_value { display: block; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 14px !important; }
#wrapwrap #ww-product li.variant_attribute.pv-mm label { position: relative; }
#wrapwrap #ww-product li.variant_attribute.pv-mm input.variant_custom_value { padding-right: 60px !important; }
#wrapwrap #ww-product li.variant_attribute.pv-mm label:has(input.variant_custom_value)::after { content: "mm"; position: absolute; top: 1px; right: 1px; bottom: 1px; width: 48px; display: grid; place-items: center; border-left: 1px solid var(--border-1); font-family: var(--font-mono); font-size: 13px; color: var(--text-3); pointer-events: none; }
#wrapwrap #ww-product li.variant_attribute li.js_attribute_value label { display: block; margin: 0; padding: 0; width: 100%; cursor: pointer; }
#wrapwrap #ww-product li.variant_attribute li.js_attribute_value label > div { display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 12px 14px; border: 1px solid var(--border-1); border-radius: 10px; font-size: 15px; }
#wrapwrap #ww-product li.variant_attribute li.js_attribute_value input:checked + .radio_input_value { font-weight: 700; }
#wrapwrap #ww-product li.variant_attribute li.js_attribute_value label > div:has(input:checked) { border-color: var(--ink-900); background: var(--ink-50, #F6F6F5); }
#wrapwrap #ww-product li.variant_attribute .badge { font-family: var(--font-mono); font-weight: 500; background: var(--ink-100, #E4E4E1); color: var(--ink-700, #5C5C5C); }
#wrapwrap #ww-product .pv-err { color: #B42318; font-size: 13px; }
/* quantite (groupe natif deplace dans la carte) */
#wrapwrap #ww-product .pv-qty__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
#wrapwrap #ww-product .pv-qty__slot:empty { display: none; }
#wrapwrap #ww-product .pv-qty__unit { font-size: 14px; color: var(--text-2); }
#wrapwrap #ww-product .pv-qty__unit b { font-family: var(--font-mono); font-weight: 600; color: var(--ink-900); }
/* Odoo borne .css_quantity a 125 px (le groupe en fait 152) et le theme ajoute 6 px de marge + coins au champ : debordement sur « Prix unitaire » (28/09) */
html body #wrapwrap .oe_website_sale #ww-product .pv-form .css_quantity { width: auto !important; max-width: none !important; flex: none; display: flex; flex-wrap: nowrap; margin: 0 !important; }
#wrapwrap #ww-product .css_quantity .input-group-prepend, #wrapwrap #ww-product .css_quantity .input-group-append { display: flex; margin: 0; }
/* theme : boutons .btn en pilules noires 12 px 32 px (mesure 28/09) ; specificite >= la regle du chiffrage, placee apres */
html body #wrapwrap .oe_website_sale #ww-product .pv-form .css_quantity a.btn { width: 48px; min-width: 0 !important; height: 48px; padding: 0 !important; display: inline-flex !important; align-items: center; justify-content: center; border: 1px solid var(--border-1) !important; border-radius: 0 !important; background: var(--surface-card) !important; color: var(--ink-900) !important; box-shadow: none !important; }
html body #wrapwrap .oe_website_sale #ww-product .pv-form .input-group-prepend a.btn { border-radius: 8px 0 0 8px !important; }
html body #wrapwrap .oe_website_sale #ww-product .pv-form .input-group-append a.btn { border-radius: 0 8px 8px 0 !important; }
/* le theme elargit le champ (62 px mesure en ligne) */
html body #wrapwrap .oe_website_sale #ww-product .pv-form .css_quantity input.quantity { width: 56px !important; min-width: 0 !important; max-width: 56px !important; flex: none !important; height: 48px; margin: 0 !important; padding: 0 !important; text-align: center; border: 1px solid var(--border-1); border-left: 0; border-right: 0; border-radius: 0 !important; font-family: var(--font-mono); font-size: 16px; box-shadow: none; }
html body #wrapwrap .oe_website_sale #ww-product .pv-form .css_quantity a.btn i, html body #wrapwrap .oe_website_sale #ww-product .pv-form .css_quantity a.btn .fa { color: var(--ink-900) !important; font-size: 13px !important; }
/* « Cette solution » (rail) */
#wrapwrap #ww-product .pv-sol { display: grid; padding: 22px 22px 20px; }
#wrapwrap #ww-product .pv-sol__k { color: var(--text-3); }
#wrapwrap #ww-product .pv-sol__name { margin: 8px 0 12px; font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--ink-900); }
#wrapwrap #ww-product .pv-sol__sum { margin: 0; }
#wrapwrap #ww-product .pv-sol__kv, #wrapwrap #ww-product .pv-sol__row { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 10px 0; border-top: 1px solid var(--border-1); font-size: 14px; }
#wrapwrap #ww-product .pv-sol__kv dt, #wrapwrap #ww-product .pv-sol__row > span { flex: none; max-width: 48%; font-weight: 400; color: var(--text-2); }
#wrapwrap #ww-product .pv-sol__kv dd { margin: 0; font-family: var(--font-mono); font-size: 12.5px; text-align: right; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap #ww-product .pv-sol__kv.is-miss dd { color: var(--orange-600, #C2410C); }
#wrapwrap #ww-product .pv-sol__qty { font-family: var(--font-mono); font-weight: 500; }
#wrapwrap #ww-product .pv-sol__unit .product_price { margin: 0 !important; }
#wrapwrap #ww-product .pv-sol__unit h4 { margin: 0 !important; font-family: var(--font-mono) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.4 !important; text-align: right; color: var(--ink-900); }
#wrapwrap #ww-product .pv-sol__unit .oe_price { font-family: var(--font-mono) !important; font-weight: 500 !important; }
#wrapwrap #ww-product .pv-sol__unit h4.css_non_editable_mode_hidden { display: none; }
#wrapwrap #ww-product.pv-quote .pv-sol__unit .product_price { display: none; }
#wrapwrap #ww-product.pv-quote .pv-sol__unit::after { content: "Au devis"; font-family: var(--font-mono); font-size: 13px; color: var(--ink-900); }
#wrapwrap #ww-product.pv-quote .pv-line { font-size: 20px; }
#wrapwrap #ww-product .pv-sol__q { margin: 0 0 12px; font-size: 13px; line-height: 1.45; color: var(--text-2); }
#wrapwrap #ww-product .pv-sol__total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 6px 0 16px; padding-top: 14px; border-top: 1px solid var(--ink-900); }
#wrapwrap #ww-product .pv-sol__total span { font-size: 16px; font-weight: 700; color: var(--ink-900); }
#wrapwrap #ww-product .pv-line { font-family: var(--font-mono); font-size: 26px; font-weight: 600; letter-spacing: -.01em; color: var(--ink-900); white-space: nowrap; }
#wrapwrap #ww-product .css_not_available_msg { margin: 0 0 12px; }
#wrapwrap #ww-product .pv-add { display: flex; }
#wrapwrap #ww-product .pv-add #add_to_cart { flex: 1 1 auto; justify-content: center; height: 48px; }
#wrapwrap #ww-product #add_to_cart.is-blocked, #wrapwrap #ww-product .pv-sticky__add.is-blocked { opacity: .5; cursor: not-allowed; }
#wrapwrap #ww-product .o_add_wishlist_dyn { display: none !important; }
#wrapwrap #ww-product .availability_messages:empty { display: none; }
#wrapwrap #ww-product .pv-sol__miss { margin: 10px 0 0; font-size: 13px; color: var(--orange-600, #C2410C); }
#wrapwrap #ww-product .pv-cancel { justify-self: center; margin-top: 12px; padding: 8px 12px; font-size: 15px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap #ww-product .pv-cancel:hover { text-decoration: underline !important; }
#wrapwrap #ww-product .pv-add__note { margin: 12px 0 0; font-size: 13px; line-height: 1.45; color: var(--text-3); }
#wrapwrap #ww-product .pv-login { text-align: center; }
#wrapwrap #ww-product .pv-login p { margin: 6px 0 12px; font-size: 14px; color: var(--text-2); }
#wrapwrap #ww-product .pv-login .dash-btn { width: 100%; min-height: 44px; justify-content: center; }
#wrapwrap #ww-product .pv-login .dash-btn + .dash-btn { margin-top: 8px; }
/* le theme impose a TOUT paragraphe 18 px / 300 en !important */
html body #wrapwrap #ww-product p { font-weight: 400 !important; line-height: 1.5 !important; }
html body #wrapwrap #ww-product p.pv-lede, html body #wrapwrap #ww-product p.pv-desc__txt { font-size: 16px !important; line-height: 1.6 !important; }
html body #wrapwrap #ww-product p.pv-add__note, html body #wrapwrap #ww-product p.pv-sol__miss, html body #wrapwrap #ww-product p.pv-sol__q { font-size: 13px !important; }
html body #wrapwrap #ww-product p.pv-none { font-size: 15px !important; }
html body #wrapwrap #ww-product .pv-login p { font-size: 14px !important; }
/* barre collante mobile : « Ligne HT » + Ajouter ; le rail disparait (handoff chiffrage M5) */
#wrapwrap #ww-product .pv-sticky { display: none; }
@media (max-width: 760px) {
  #wrapwrap #ww-product .pv-head__acts { display: none; }
  #wrapwrap #ww-product h1.pv-h1 { font-size: 28px !important; }
  #wrapwrap #ww-product .pv-photo__media { aspect-ratio: 4 / 3; }
  #wrapwrap #ww-product .pv-side:not(.is-public) { display: none; }
  #wrapwrap #ww-product .pv-pcard { grid-template-columns: 72px minmax(0, 1fr); gap: 14px; padding: 16px; }
  #wrapwrap #ww-product .pv-pcard__media { width: 72px; height: 72px; }
  #wrapwrap #ww-product .pv-pcard__name { font-size: 17px; }
  #wrapwrap #ww-product .pv-config, #wrapwrap #ww-product .pv-qty, #wrapwrap #ww-product .pv-info { padding: 18px 16px 20px; }
  #wrapwrap #ww-product .pv-opts, #wrapwrap #ww-product li.variant_attribute ul.list-unstyled { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap #ww-product .pv-sticky { position: fixed; z-index: 40; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: var(--surface-card); border-top: 1px solid var(--border-1); }
  #wrapwrap #ww-product .pv-sticky__txt { display: grid; min-width: 0; }
  #wrapwrap #ww-product .pv-sticky__txt small { font-size: 12px; color: var(--text-3); }
  #wrapwrap #ww-product .pv-sticky__price { font-family: var(--font-mono); font-size: 18px; font-weight: 600; white-space: nowrap; }
  #wrapwrap #ww-product .pv-sticky__add { height: 48px; flex: none; }
}


/* ===== tech.css ===== */
/* ===== etiquette technologie (TechTag du DS : glyphe + nom + ™ ; jamais verte) ===== */
#wrapwrap .ww-tech { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 13px 0 8px; border-radius: 999px; border: 1px solid var(--ink-300, #C4C4C1);
  background: #fff; color: var(--ink-900, #141414); font-family: var(--font-sans, inherit); font-size: 13px; font-weight: 900; letter-spacing: -.02em; line-height: 1; white-space: nowrap; vertical-align: middle; flex: none; }
#wrapwrap .ww-tech .ww-tech__g { width: 18px; height: 18px; flex: none; display: block; }
#wrapwrap .ww-tech .ww-tech__n { display: inline-flex; align-items: flex-start; }
#wrapwrap .ww-tech sup { position: relative; top: -.1em; margin-left: 1px; font-size: .62em; font-weight: 700; line-height: 1; vertical-align: baseline; }
#wrapwrap .ww-tech--filled { background: var(--ink-900, #141414); border-color: var(--ink-900, #141414); color: #fff; }
#wrapwrap .ww-tech--muted { background: var(--ink-100, #E4E4E1); border-color: var(--ink-100, #E4E4E1); }
#wrapwrap .ww-tech--s { height: 22px; gap: 4px; padding: 0 11px 0 6px; font-size: 11px; }
#wrapwrap .ww-tech--s .ww-tech__g { width: 14px; height: 14px; }
#wrapwrap .ww-tech--l { height: 34px; gap: 7px; padding: 0 15px 0 9px; font-size: 15px; }
#wrapwrap .ww-tech--l .ww-tech__g { width: 24px; height: 24px; }


/* ===== hover.css ===== */
/* ===== hover.css : etats hover/active/focus du DS (regles .scpN:hover injectees par le runtime + hover des composants) ===== */
.ww .scp0:hover { background: var(--ink-800) !important; color: rgb(255, 255, 255) !important; }
.ww .scp1:hover { border-color: var(--ink-900) !important; }
.ww .scp2:hover { background: var(--ink-800) !important; }
.ww .scp3:hover { border-color: var(--green-500) !important; background: var(--ink-800) !important; }
.ww .scp4:hover { box-shadow: var(--shadow-m) !important; }
.ww .scp5:hover { background: var(--ink-50) !important; }
.ww a:hover { text-decoration-color: var(--green-600); }
.ww :focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-s); }
.ww a:hover { text-decoration-color: var(--green-500); }


/* ===== responsive.css ===== */
.ww-quick { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 16px; }
.ww-two { display: grid; grid-template-columns: minmax(0px, 1fr) 400px; gap: 20px; margin-top: 20px; align-items: stretch; }
.ww-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; flex-wrap: wrap; margin-bottom: 28px; }
.ww-menu { display: none !important; }
.ww-show-m { display: none !important; }
.ww-snap { scrollbar-width: none; }
.ww-snap::-webkit-scrollbar { display: none; }
.ww-mobile-bar { display: none !important; }
@media (max-width: 1180px) {
  .ww-two { grid-template-columns: minmax(0px, 1fr); }
  .ww-quick { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.ww-rail { grid-template-columns: minmax(0px, 1fr) !important; }
  .ww-cat { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; }
  .ww-hero-btns { flex-wrap: wrap; flex-direction: row !important; width: auto !important; }
  .ww-hero-btns > * { flex: 0 0 auto; }
  .ww-row { grid-template-columns: minmax(0px, 1fr) !important; }
.ww-threads { display: none !important; }
  .ww-grid2 { grid-template-columns: minmax(0px, 1fr) !important; }
}
@media (max-width: 1100px) {
  .ww-access-grid { grid-template-columns: minmax(0px, 1fr) !important; gap: 40px !important; }
  .ww-access-aside { position: static !important; }
  .ww-hide-mid { display: none !important; }
.ww-side { display: none !important; }
.ww-menu { display: inline-flex !important; }
.ww-login { grid-template-columns: minmax(0px, 1fr) !important; }
}
@media (max-width: 760px) {
.ww-h1 { font-size: 36px !important; white-space: normal !important; }
  .ww-hero-side { display: none !important; }
  .ww-grid2 { grid-template-columns: minmax(0px, 1fr) !important; }
.ww-grid3 { grid-template-columns: minmax(0px, 1fr) !important; }
.ww-compose > div { flex-basis: 100%; }
  .ww-photo { aspect-ratio: 4 / 3 !important; }
  .ww-mobile-bar { display: flex !important; }
  .ww-hide-m { display: none !important; }
.ww-threads { display: none !important; }
  .ww-row { grid-template-columns: minmax(0px, 1fr) !important; }
.ww-vitrine h1 { font-size: 34px !important; }
.ww-vitrine input + *, .ww-vitrine label + div { min-height: 0px; }
.ww-login-copy h1 { font-size: 32px !important; }
.ww-vitrine.access .ww-login > div:last-child { padding: 28px 20px !important; }
  .ww-access-page { padding: 28px 18px 40px !important; }
  .ww-access-grid { grid-template-columns: minmax(0px, 1fr) !important; gap: 32px !important; }
  .ww-access-aside { position: static !important; }
  .ww-show-m { display: flex !important; }
  .ww-vitrine { padding-bottom: 76px; }
.ww-vitrine .ww-cat { margin-top: 24px !important; }
  .ww-preview-in { padding: 16px 12px 24px !important; }
  .ww-foot { grid-template-columns: minmax(0px, 1fr) !important; gap: 32px !important; }
  .ww-hero { padding: 0px 16px !important; }
  .ww-hero-btns { flex-wrap: wrap; flex-direction: row !important; width: auto !important; }
  .ww-hero-btns > * { flex: 0 0 auto; }
  .ww-hero-in { background: var(--ink-900) !important; min-height: 0px !important; }
  .ww-hero-in img { height: 300px !important; bottom: auto !important; }
  .ww-hero-veil { height: 300px !important; bottom: auto !important; background: linear-gradient(180deg,rgba(20,20,20,.1) 0%,rgba(20,20,20,.15) 55%,var(--ink-900) 100%) !important; }
  .ww-hero-in > .ww-grid2 { padding: 240px 20px 28px !important; }
  .ww-hero-in h1 { font-size: 34px !important; }
  .ww-hero-in p { font-size: 15px !important; }
.ww-login-copy { padding: 96px 24px 24px; position: relative !important; left: auto !important; right: auto !important; bottom: auto !important; gap: 14px !important; }
}
[data-mobile] .ww-menu, [data-mobile] .ww-mobile-bar, [data-mobile] .ww-show-m { display: flex !important; }
[data-mobile] .ww-vitrine { padding-bottom: 76px; }
[data-mobile] .ww-h1 { font-size: 36px !important; white-space: normal !important; }
[data-mobile] .ww-vitrine h1 { font-size: 40px !important; }
[data-mobile] .ww-vitrine h2 { font-size: 30px !important; }
[data-mobile] .ww-foot { grid-template-columns: minmax(0px, 1fr) !important; gap: 32px !important; }
[data-mobile] .ww-cta-btns > * { flex: 1 1 100%; }
[data-mobile] .ww-cta-btns button { width: 100%; }
[data-mobile] .ww-vitrine section { padding-top: 72px !important; padding-bottom: 72px !important; }
[data-mobile] .ww-vitrine #sec-metier { padding-top: 0px !important; }
[data-mobile] .ww-vitrine #sec-metier, [data-mobile] .ww-vitrine #sec-commencer { padding-left: 16px !important; padding-right: 16px !important; }
[data-mobile] .ww-vitrine .ww-cat { margin-top: 24px !important; }
[data-mobile] .ww-vitrine h1 { font-size: 34px !important; }
[data-mobile] .ww-vitrine input + *, .ww-vitrine label + div { min-height: 0px; }
[data-mobile] .ww-access-page { padding: 28px 18px 40px !important; }
[data-mobile] .ww-access-grid { grid-template-columns: minmax(0px, 1fr) !important; gap: 32px !important; }
[data-mobile] .ww-access-aside { position: static !important; }
[data-mobile] .ww-preview-in { padding: 16px 12px 24px !important; }
[data-mobile] .ww-vitrine .ww-hero { padding-top: 0px !important; padding-bottom: 0px !important; }
[data-mobile] .ww-grid3 { grid-template-columns: minmax(0px, 1fr) !important; }
[data-mobile] .ww-photo { aspect-ratio: 4 / 3 !important; }
[data-mobile] .ww-hero { padding: 0px 12px !important; }
[data-mobile] .ww-hero-btns { flex-wrap: wrap; flex-direction: row !important; width: auto !important; }
.ww-hero-btns > * { flex: 0 0 auto; }
.ww-hero-in { background: var(--ink-900) !important; min-height: 0px !important; }
[data-mobile] .ww-hero-in img { height: 300px !important; bottom: auto !important; }
[data-mobile] .ww-hero-veil { height: 300px !important; bottom: auto !important; background: linear-gradient(180deg,rgba(20,20,20,.1) 0%,rgba(20,20,20,.15) 55%,var(--ink-900) 100%) !important; }
[data-mobile] .ww-hero-in > .ww-grid2 { padding: 240px 20px 28px !important; }
[data-mobile] .ww-hero-in h1 { font-size: 34px !important; }
[data-mobile] .ww-hero-in p { font-size: 15px !important; }
[data-mobile] .ww-preview { height: 300px !important; }
[data-mobile] .ww-preview-in { transform: scale(0.27) !important; width: 1400px !important; }

/* rail de progression : seulement quand la marge l'accueille sans chevaucher le contenu (audit 01/10 : recouvrement mesure de 1 101 a 1 414 px) */
@media (max-width: 1414px) { .ww-rail-nav { display: none !important; } }
/* gouttiere mobile 16 px partout (= barre publique) : pied de page et sections de la landing etaient a 24 px (audit 01/10) */
@media (max-width: 760px) {
  #wrapwrap .ww .ww-footer { padding-left: 16px !important; padding-right: 16px !important; }
  #wrapwrap .ww-vitrine > section[id^="sec-"]:not(#sec-metier) { padding-left: 16px !important; padding-right: 16px !important; }
  /* air vertical mobile 72 px (handoff v1.4) : les règles [data-mobile] ci-dessus n'existent qu'en maquette, 4 sections restaient à 128 px (audit UX 11/10) */
  #wrapwrap .ww-vitrine > section[id^="sec-"] { padding-top: 72px !important; padding-bottom: 72px !important; }
  #wrapwrap .ww-vitrine > section#sec-metier { padding-top: 0 !important; }   /* « Pour qui » reprend 72 px : son trait vertical (lien depuis « Votre espace », retirée) est retiré aussi (10/11) */
  /* cibles tactiles 44 px (onglets de Commencer, boutons d'accès) */
  #wrapwrap .ww .ww-seg__tab, #wrapwrap .ww-vitrine #sec-commencer a[class*="ww-btn--"] { min-height: 44px; }
}
/* §01 : bord à 24 px comme les autres sections entre 761 et 1327 px (était 64 px, style de la maquette) */
#wrapwrap .ww-vitrine > section#sec-metier { padding-left: 24px; padding-right: 24px; }
/* surtitre du héros sur deux lignes entre 761 et 820 px : le séparateur restait seul en bout de ligne */
@media (max-width: 820px) { #wrapwrap .ww .ww-hero .ww-sep { display: none !important; } }
@media (max-width: 760px) { .ww-snap { scroll-padding-left: 16px; } }
/* titres de section : un peu plus « affiche » (Charles 11/10) — jusqu'à 64 px (40 à 60 avant), Qui sommes-nous va jusqu'à 76 ;
   interligne 1 : en Heebo 900, f + j = 0,974 em, sous cette valeur deux lignes peuvent se toucher (landing/_interligne.js) */
#wrapwrap .ww-vitrine > section[id^="sec-"] h2 { line-height: 1 !important; }
@media (min-width: 761px) { #wrapwrap .ww-vitrine > section[id^="sec-"] h2 { font-size: clamp(44px, 4.6cqi, 64px) !important; } }
/* mobile : un seul niveau de titre de section, 36 px (32 à 60 px selon les sections avant ; « Vos chantiers… » faisait 5 lignes à 60 px) */
@media (max-width: 760px) { #wrapwrap .ww-vitrine > section[id^="sec-"] h2 { font-size: 36px !important; } }

/* Barre d'action collante de la landing (téléphone) : Charles 07/11 « sur mon iPhone j'ai les boutons en double » — elle était affichée en
   permanence, par-dessus les boutons du haut. Cachée par défaut ; workwith.js l'affiche (.is-on) seulement quand les boutons du haut et la
   section « Commencer » (qui a ses propres boutons) sont hors de l'écran. Sans IntersectionObserver, workwith.js l'affiche comme avant.
   visibility (jamais aria-hidden) : cachée, elle sort aussi de l'ordre de tabulation et des lecteurs d'écran. */
#wrapwrap .ww .ww-sticky-bar { transform: translateY(110%); visibility: hidden; transition: transform .2s ease, visibility 0s linear .2s; }
#wrapwrap .ww .ww-sticky-bar.is-on { transform: none; visibility: visible; transition: transform .25s ease, visibility 0s linear 0s; }
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww .ww-sticky-bar, #wrapwrap .ww .ww-sticky-bar.is-on { transition: none; } }

/* Landing §02 « Tout se passe dans le même dossier » au téléphone (Charles 08/11 : « problèmes de superposition de texte dans les cards »).
   Onglet 04 Suivre : la frise à 5 étapes tenait sur une ligne de ~280 px -> « Plans approuvés » chevauchait « En fabrication ».
   Au téléphone, elle passe en frise VERTICALE (repère à gauche, intitulé et date à droite, trait vertical entre les repères).
   Onglet 02 Choisir : la fiche « Passage / Hauteur maxi / Matériau / Norme » sur 2 colonnes -> « PRV isophtalique » chevauchait « Norme » :
   une seule colonne au téléphone. Sélecteurs par structure (une seule <ol> et une seule <dl> dans la section). */
@media (max-width: 760px) {
  #wrapwrap #sec-faire ol { flex-direction: column; gap: 0; }
  #wrapwrap #sec-faire ol > li { flex-direction: row; align-items: flex-start; gap: 12px; flex: 0 0 auto; position: relative; padding-bottom: 14px; }
  #wrapwrap #sec-faire ol > li:last-child { padding-bottom: 0; }
  #wrapwrap #sec-faire ol > li > div:first-child > span + span { position: absolute; left: 11px; top: 26px; bottom: -2px; width: 1.5px; height: auto; margin: 0; flex: none; }
  #wrapwrap #sec-faire ol > li > div + div { padding: 2px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; min-width: 0; }
  #wrapwrap #sec-faire ol > li > div + div > div { margin-top: 0; }
  #wrapwrap #sec-faire dl { grid-template-columns: minmax(0, 1fr); }
}


/* ===== e403.css ===== */

/* ===== Erreurs 403 + 404 (handoffs erreur-403-v1.0 28/09, erreurs-v1.1 30/09) : fond gris clair, carte blanche ombrée deux colonnes ; mobile < 1100 px : une colonne plein écran ===== */
html body:has(.ww-err):not(.editor_enable) #wrapwrap > header, html body:has(.ww-err):not(.editor_enable) #wrapwrap > footer,
html body:has(.ww-err) .iv2-mobile-burger, html body:has(.ww-err) .iv2-mobile-overlay, html body:has(.ww-err) .back-to-top-btn { display: none !important; }
html body:has(.ww-err), html body:has(.ww-err) #wrapwrap { background: #F6F6F5 !important; }
/* en ligne 28/09 : les onboardings (vues 3357-3359…, #idreva-ob) se declenchent sur l'adresse (/my/projects…) et s'ouvraient par-dessus la page 403 */
html body:has(.ww-err) #idreva-ob, html body:has(.ww-err) #idreva-ob-fab { display: none !important; }
html body:has(.ww-err) { overflow: auto !important; }
html body:has(.ww-err) #wrapwrap > main { margin: 0 !important; padding: 0 !important; }
html body #wrapwrap #wrap.ww-err { margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; }   /* le theme ajoute 40 px au bloc #wrap */
#wrapwrap .ww-err { font-family: var(--font-sans); color: var(--ink-900); -webkit-font-smoothing: antialiased; }
#wrapwrap .ww-err .e4-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 32px 24px; box-sizing: border-box; }
#wrapwrap .ww-err .e4-card { display: grid; grid-template-columns: minmax(0, 1fr) 380px; width: 100%; max-width: 1080px; min-height: 600px; overflow: hidden; border: 1px solid #E4E4E1; border-radius: 16px; background: #fff; box-shadow: 0 24px 48px -24px rgba(20, 20, 20, .18); }
#wrapwrap .ww-err .e4-col { display: grid; align-content: space-between; gap: 28px; padding: 40px 48px; min-width: 0; background: #fff; }
#wrapwrap .ww-err .e4-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
html body #wrapwrap .ww-err a.e4-back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 14px !important; font-weight: 500 !important; color: var(--text-2) !important; text-decoration: none !important; }
html body #wrapwrap .ww-err a.e4-back:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-err .e4-http { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-err .e4-main { position: relative; padding-left: 32px; }
#wrapwrap .ww-err .e4-main::before { content: ''; position: absolute; left: 5.25px; top: 6px; bottom: 0; width: 1.5px; background: var(--ink-900); }
#wrapwrap .ww-err .e4-main::after { content: ''; position: absolute; left: 0; top: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 6px rgba(0, 230, 176, .28); }
#wrapwrap .ww-err .e4-eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; line-height: 12px; color: #00875F; }
#wrapwrap .ww-err h1.e4-h1 { margin: 14px 0 0 !important; max-width: 560px; font-family: var(--font-display, var(--font-sans)) !important; font-size: 44px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: -.035em !important; color: var(--ink-900) !important; text-wrap: balance; }
#wrapwrap .ww-err .e4-h1 i, #wrapwrap .ww-err .e4-h2 i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-err p.e4-lede { margin: 16px 0 0 !important; max-width: 520px; font-size: 17px !important; font-weight: 400 !important; line-height: 1.55 !important; color: var(--text-2) !important; }
#wrapwrap .ww-err .e4-causes { margin: 24px 0 0; padding: 0; list-style: none; }
#wrapwrap .ww-err .e4-cause { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 4px 12px; align-items: start; padding: 16px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-err .e4-cause:last-child { border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-err .e4-n { padding-top: 2px; font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: #00875F; }
#wrapwrap .ww-err .e4-cause__body { min-width: 0; }
#wrapwrap .ww-err .e4-cause__t { display: block; font-size: 16px; font-weight: 700; line-height: 1.35; color: var(--ink-900) !important; }
#wrapwrap .ww-err p.e4-cause__d { margin: 4px 0 0 !important; max-width: 460px; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
html body #wrapwrap .ww-err a.e4-act { display: inline-flex; align-items: center; gap: 6px; padding-top: 1px; font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900) !important; text-decoration: none !important; white-space: nowrap; }
html body #wrapwrap .ww-err a.e4-act:hover span { text-decoration: underline; text-underline-offset: 3px; }
#wrapwrap .ww-err .e4-acts { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; }
#wrapwrap .ww-err .e4-acts__btns { display: flex; flex-wrap: wrap; gap: 8px; }
html body #wrapwrap .ww-err a.e4-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 8px; font-size: 15px !important; font-weight: 700 !important; text-decoration: none !important; white-space: nowrap; }
html body #wrapwrap .ww-err a.e4-btn--accent { background: var(--green-500); color: var(--ink-900) !important; box-shadow: 0 6px 16px -6px rgba(0, 230, 176, .55); }
html body #wrapwrap .ww-err a.e4-btn--accent:hover { background: var(--green-600, #00C497); }
html body #wrapwrap .ww-err a.e4-btn--ghost { background: transparent; color: var(--ink-900) !important; }
html body #wrapwrap .ww-err a.e4-btn--ghost:hover { background: var(--ink-50, #F6F6F5); }
html body #wrapwrap .ww-err a.e4-btn--inverse { width: 100%; background: #fff; color: var(--ink-900) !important; }
html body #wrapwrap .ww-err a.e4-btn--inverse:hover { background: var(--ink-100, #EDEDEB); }
#wrapwrap .ww-err .e4-i { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-err .e4-act .e4-i { width: 16px; height: 16px; }
#wrapwrap .ww-err p.e4-already { margin: 0 !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.4 !important; color: var(--text-3) !important; }
html body #wrapwrap .ww-err p.e4-already a { font-weight: 700 !important; color: var(--ink-900) !important; text-decoration: none !important; }
html body #wrapwrap .ww-err p.e4-already a:hover { text-decoration: underline !important; }
#wrapwrap .ww-err .e4-side { display: flex; flex-direction: column; gap: 24px; padding: 36px 36px 32px; background: #141414; color: #fff; }
#wrapwrap .ww-err .e4-u { position: relative; max-width: 240px; padding: 22px 22px 18px; border: 1px solid rgba(255, 255, 255, .4); border-top: 0; border-radius: 0 0 14px 14px; }
#wrapwrap .ww-err .e4-u__dot { position: absolute; left: -6px; top: -6px; width: 12px; height: 12px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 6px rgba(0, 230, 176, .28); }
#wrapwrap .ww-err img.e4-u__logo { display: block; width: 100%; height: auto; border: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-err .e4-side__txt { display: grid; gap: 10px; }
#wrapwrap .ww-err .e4-side__k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #9A9A98; }
#wrapwrap .ww-err h2.e4-h2 { margin: 0 !important; font-family: var(--font-display, var(--font-sans)) !important; font-size: 24px !important; font-weight: 900 !important; line-height: 1.08 !important; letter-spacing: -.03em !important; color: #fff !important; }
#wrapwrap .ww-err p.e4-side__p { margin: 0 !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.55 !important; color: #C4C4C1 !important; }
#wrapwrap .ww-err .e4-types { margin: 6px 0 0; padding: 0; list-style: none; border-top: 1px solid #232323; }
#wrapwrap .ww-err .e4-types li { display: flex; align-items: baseline; gap: 14px; padding: 12px 0; border-bottom: 1px solid #232323; }
#wrapwrap .ww-err .e4-types span { font-family: var(--font-mono); font-size: 11px; color: #9A9A98; }
#wrapwrap .ww-err .e4-types b { font-size: 14px; font-weight: 700; color: #fff !important; }   /* le theme force b en noir (!important) */
#wrapwrap .ww-err .e4-side__foot { display: grid; gap: 12px; margin-top: auto; }
#wrapwrap .ww-err p.e4-side__note { margin: 0 !important; text-align: center; font-size: 12px !important; font-weight: 400 !important; line-height: 1.5 !important; color: #9A9A98 !important; }
#wrapwrap .ww-err .e4-links { margin: 24px 0 0; padding: 0; list-style: none; }
#wrapwrap .ww-err .e4-links li { border-top: 1px solid var(--border-1); }
#wrapwrap .ww-err .e4-links li:last-child { border-bottom: 1px solid var(--border-1); }
html body #wrapwrap .ww-err a.e4-link { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; margin: 0 -12px; padding: 16px 12px; border-radius: 8px; color: var(--ink-900) !important; text-decoration: none !important; transition: background .15s ease; }
html body #wrapwrap .ww-err a.e4-link:hover { background: #F6F6F5; }
#wrapwrap .ww-err .e4-link .e4-n { padding-top: 0; }
#wrapwrap .ww-err .e4-link__body { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-err .e4-link .e4-cause__d { font-size: 14px; line-height: 1.5; color: var(--text-2); }
#wrapwrap .ww-err .e4-link > .e4-i { width: 18px; height: 18px; }
html body #wrapwrap .ww-err a:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); border-radius: 6px; }
@media (max-width: 1099px) {
  #wrapwrap .ww-err .e4-page { display: block; min-height: 0; padding: 0; }
  #wrapwrap .ww-err .e4-card { grid-template-columns: minmax(0, 1fr); min-height: 0; border: 0; border-radius: 0; box-shadow: none; }
  html body #wrapwrap .ww-err a.e4-link { margin: 0 -8px; padding: 16px 8px; }
  #wrapwrap .ww-err .e4-col { align-content: start; gap: 24px; padding: 20px 20px 28px; }
  #wrapwrap .ww-err .e4-http { display: none; }
  #wrapwrap .ww-err h1.e4-h1 { font-size: 36px !important; }
  #wrapwrap .ww-err .e4-cause { grid-template-columns: 32px minmax(0, 1fr); }
  html body #wrapwrap .ww-err a.e4-act { grid-column: 2; min-height: 44px; }
  #wrapwrap .ww-err .e4-acts { display: grid; justify-content: start; gap: 16px; }   /* M2 : boutons cote a cote, « Deja connecte ? » dessous */
  html body #wrapwrap .ww-err a.e4-btn { height: 48px; }
  #wrapwrap .ww-err .e4-side { padding: 28px 20px 24px; border-left: 0; }
  #wrapwrap .ww-err .e4-side__foot { margin-top: 8px; }
  html body #wrapwrap .ww-err p.e4-already a { display: inline-flex; align-items: center; min-height: 44px; }   /* cible tactile >= 44 px (checklist 6) */
}


/* ===== navprogress.css ===== */
/* ===== Indicateur de navigation (v2.28, Charles 28/09) : fine barre verte en haut pendant le chargement de la page suivante ===== */
.ww-navbar { position: fixed; top: 0; left: 0; right: 0; z-index: 2147483000; height: 3px; pointer-events: none; opacity: 0; transform: scaleX(0); transform-origin: 0 50%; background: var(--green-500, #00E6B0); box-shadow: 0 0 8px rgba(0, 230, 176, .55); }
.ww-navbar.is-on { opacity: 1; animation: wwNavbar 9s cubic-bezier(.08, .8, .2, 1) forwards; }
@keyframes wwNavbar { 0% { transform: scaleX(0); } 8% { transform: scaleX(.3); } 40% { transform: scaleX(.7); } 100% { transform: scaleX(.94); } }
@media (prefers-reduced-motion: reduce) { .ww-navbar.is-on { animation: none; transform: scaleX(.6); } }


/* ===== projects.css ===== */
/* ===== projects.css — module Projets (handoff projets-v1.0, 29/09) : racine .ww-proj ===== */
#wrapwrap .ww-proj .pj-mono { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-proj.ww-proj--card .pj-mono { font-size: 13px; }
#wrapwrap .ww-proj .pj-kicker { font-family: var(--font-mono); font-size: 11px; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); margin: 0; }
#wrapwrap .ww-proj.ww-proj--card .pj-kicker { font-size: 12px; }
#wrapwrap .ww-proj .pj-kicker span { color: var(--ink-900); }
#wrapwrap .ww-proj .pj-ell { display: block; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-proj svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
#wrapwrap .ww-proj svg.i--16 { width: 16px; height: 16px; }
#wrapwrap .ww-proj svg.i--22 { width: 22px; height: 22px; }
/* ---- liste */
#wrapwrap .ww-proj .pj-head { margin-bottom: 20px; }
#wrapwrap .ww-proj .pj-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; }
#wrapwrap .ww-proj .pj-seg { display: inline-flex; gap: 2px; padding: 4px; border-radius: 10px; background: #E9E9E6; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-proj .pj-seg__i { flex: none; height: 36px; padding: 0 14px; border: 0; border-radius: 8px; background: transparent; font-size: 14px; font-weight: 500; color: var(--text-2); cursor: pointer; }
#wrapwrap .ww-proj .pj-seg__i.is-on { background: #fff; color: var(--ink-900); font-weight: 700; box-shadow: 0 1px 2px rgba(20, 20, 20, .08); }
#wrapwrap .ww-proj .pj-search { display: inline-flex; align-items: center; gap: 8px; height: 44px; margin: 0 0 0 auto; padding: 0 14px; flex: 0 1 300px; min-width: 0; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; color: var(--text-3); }
#wrapwrap .ww-proj .pj-search input { flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 15px; color: var(--ink-900); box-shadow: none; }
#wrapwrap .ww-proj .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; }
/* menu « Trier » : apparence native neutralisee (Safari ignorait fond et bordure : degrade, ombre, double fleche ; Charles 05/10 « c'est moche ») */
html body #wrapwrap .ww-proj .pj-sort select { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 44px; margin: 0; padding: 0 42px 0 14px; border: 1px solid var(--border-1); border-radius: 8px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23141414' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 16px 16px; box-shadow: none; font-family: var(--font-sans); font-size: 15px; font-weight: 500; line-height: 1; color: var(--ink-900); cursor: pointer; }
html body #wrapwrap .ww-proj .pj-sort select:hover { border-color: var(--ink-900); }
html body #wrapwrap .ww-proj .pj-sort select:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap .ww-proj .pj-list { padding: 0; overflow: hidden; border-radius: 12px; }
#wrapwrap .ww-proj .pj-cols, #wrapwrap .ww-proj .pj-row { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.4fr) minmax(0, 1.1fr) minmax(0, 1.2fr) minmax(0, 1.3fr) 24px; gap: 16px; align-items: center; padding: 0 22px; }
#wrapwrap .ww-proj .pj-cols { height: 46px; border-bottom: 1px solid var(--border-1); font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-proj a.pj-row { min-height: 104px; padding-top: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--border-1); color: var(--ink-900) !important; text-decoration: none !important; transition: background .12s ease-out; }
#wrapwrap .ww-proj a.pj-row:last-of-type { border-bottom: 0; }
#wrapwrap .ww-proj a.pj-row:hover { background: #FAFAF9; }
#wrapwrap .ww-proj a.pj-row:focus-visible { outline: 2px solid var(--green-500); outline-offset: -2px; }
#wrapwrap .ww-proj .pj-c { display: grid; gap: 4px; min-width: 0; font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-proj .pj-c b { color: var(--ink-900); font-weight: 700; }
#wrapwrap .ww-proj .pj-c--proj, #wrapwrap .ww-proj .pj-c--am { display: flex; align-items: center; gap: 14px; }
#wrapwrap .ww-proj .pj-c__txt { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-proj .pj-c__txt small, #wrapwrap .ww-proj .pj-c small { font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-proj .pj-c small.pj-mono { font-size: 12px; }
#wrapwrap .ww-proj .pj-thumb { flex: none; width: 48px; height: 48px; border-radius: 8px; overflow: hidden; background: #fff; border: 1px solid var(--border-1); box-sizing: border-box; }
#wrapwrap .ww-proj .pj-thumb img { width: 100%; height: 100%; object-fit: contain; background: #fff; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-proj .pj-name { font-size: 16px; line-height: 1.3; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-proj .pj-equip { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-proj .pj-c--track { justify-items: start; }
#wrapwrap .ww-proj .pj-bar { display: block; width: 100%; max-width: 180px; height: 4px; border-radius: 2px; background: var(--ink-100, #E4E4E1); overflow: hidden; }
#wrapwrap .ww-proj .pj-bar i { display: block; height: 100%; background: var(--ink-900); }
#wrapwrap .ww-proj .pj-ship { display: inline-flex; align-items: center; gap: 8px; }
#wrapwrap .ww-proj .pj-av { flex: none; display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--ink-900); color: #fff; font-size: 12px; font-weight: 700; }
#wrapwrap .ww-proj.ww-proj--card .pj-av { font-size: 13px; }
#wrapwrap .ww-proj .pj-av--grey { background: var(--ink-100, #E4E4E1); color: var(--ink-900); }
#wrapwrap .ww-proj .pj-av--icon { border-radius: 8px; background: var(--ink-50, #F0F0EE); color: var(--ink-900); border: 1px solid var(--border-1); }
#wrapwrap .ww-proj .pj-go { color: var(--text-3); display: grid; place-items: center; }
#wrapwrap .ww-proj .pj-row[hidden], #wrapwrap .ww-proj .pj-none[hidden] { display: none !important; }
#wrapwrap .ww-proj .pj-none { padding: 28px 22px; color: var(--text-2); }
#wrapwrap .ww-proj .pj-empty { padding: 28px; display: grid; gap: 8px; justify-items: start; }
#wrapwrap .ww-proj .pj-pager { display: flex; justify-content: center; margin-top: 16px; }
/* ---- fiche : en-tete, grille, colonne de droite collante */
#wrapwrap .ww-proj .pj-dhead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; margin: 8px 0 20px; }
#wrapwrap .ww-proj .pj-dhead__txt { flex: 1 1 520px; min-width: 0; }
#wrapwrap .ww-proj .pj-eyebrow { color: var(--green-700); text-transform: uppercase; }
#wrapwrap .ww-proj h1.pj-h1 { font-size: 38px !important; margin: 6px 0 6px; }
#wrapwrap .ww-proj h1.pj-h1 i { font-style: normal; color: var(--green-500); }
html body #wrapwrap .ww-proj p.pj-sub { margin: 0; font-size: 15px !important; font-weight: 400 !important; color: var(--text-2); }
#wrapwrap .ww-proj .pj-dhead__acts { display: flex; flex-wrap: wrap; gap: 10px; }
#wrapwrap .ww-proj .pj-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
#wrapwrap .ww-proj .pj-main, #wrapwrap .ww-proj .pj-side { display: grid; gap: 16px; min-width: 0; }
#wrapwrap .ww-proj .pj-side { order: -1; }
@media (min-width: 1180px) {
  #wrapwrap .ww-proj .pj-grid { grid-template-columns: minmax(0, 1fr) 320px; }
  #wrapwrap .ww-proj .pj-side { order: 0; position: sticky; top: 24px; }   /* navigation v1.1 : plus de barre du haut (84 px avant) */
}
#wrapwrap .ww-proj .pj-sec { padding: 26px 28px; display: grid; gap: 20px; }
#wrapwrap .ww-proj .pj-sec__h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
#wrapwrap .ww-proj h2.pj-kicker { font-size: 11px !important; line-height: 1.4 !important; font-weight: 400 !important; }
#wrapwrap .ww-proj.ww-proj--card h2.pj-kicker { font-size: 12px !important; }
/* A faire */
#wrapwrap .ww-proj .pj-todo { padding: 22px; }
#wrapwrap .ww-proj .pj-todo__h { display: flex; align-items: center; gap: 10px; }
#wrapwrap .ww-proj .pj-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--green-500); box-shadow: 0 0 0 4px rgba(0, 230, 176, .28); }
#wrapwrap .ww-proj h2.pj-todo__t { flex: 1; margin: 0; font-family: var(--font-display); font-size: 17px !important; font-weight: 900 !important; line-height: 1.2 !important; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card h2.pj-todo__t { font-size: 18.5px !important; }
#wrapwrap .ww-proj .pj-todo__l { margin: 12px 0 0 4px; border-left: 1px solid var(--ink-900); padding-left: 16px; display: grid; }
#wrapwrap .ww-proj a.pj-task { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 10px 0; border-bottom: 1px solid var(--border-1); color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-proj a.pj-task:last-child { border-bottom: 0; }
#wrapwrap .ww-proj .pj-task__t { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-proj .pj-task__t b { font-size: 14px; font-weight: 700; }
#wrapwrap .ww-proj.ww-proj--card .pj-task__t b { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-task__t small { font-size: 11px; }
#wrapwrap .ww-proj.ww-proj--card .pj-task__t small { font-size: 12px; }
html body #wrapwrap .ww-proj p.pj-todo__none { margin: 12px 0 0; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2); }
html body #wrapwrap .ww-proj.ww-proj--card p.pj-todo__none { font-size: 15.5px !important; }
/* intervenants */
#wrapwrap .ww-proj .pj-people { padding: 22px; display: grid; gap: 0; }
#wrapwrap .ww-proj .pj-people .pj-kicker { margin-bottom: 8px; }
#wrapwrap .ww-proj .pj-person { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-1); min-width: 0; }
#wrapwrap .ww-proj .pj-person:last-child { border-bottom: 0; }
#wrapwrap .ww-proj .pj-person .pj-av { width: 36px; height: 36px; }
#wrapwrap .ww-proj .pj-person__t { flex: 1; display: grid; gap: 2px; min-width: 0; font-size: 14px; }
#wrapwrap .ww-proj.ww-proj--card .pj-person__t { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-person__t b { font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj .pj-person__t small { font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-proj.ww-proj--card .pj-person__t small { font-size: 13px; }
/* encart « Plans du projet » : gabarit « Intervenants » + pastille d'etat, texte et actions de validation */
#wrapwrap .ww-proj .pj-planscard__h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
#wrapwrap .ww-proj .pj-planscard__h .pj-kicker { margin: 0; }
#wrapwrap .ww-proj .pj-planscard .pj-person { border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-proj .pj-planscard .pj-pdf { height: 32px; padding: 0 10px; }
#wrapwrap .ww-proj .pj-planscard__n { overflow-wrap: anywhere; line-height: 1.3; }
#wrapwrap .ww-proj a.pj-planscard__all { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 14px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-proj.ww-proj--card a.pj-planscard__all { font-size: 15.5px; }
#wrapwrap .ww-proj a.pj-planscard__all:hover { text-decoration: underline !important; }   /* reference complete du plan (pas de troncature) */
html body #wrapwrap .ww-proj p.pj-planscard__txt { margin: 14px 0 12px !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2); }
html body #wrapwrap .ww-proj.ww-proj--card p.pj-planscard__txt { font-size: 15.5px !important; }
#wrapwrap .ww-proj .pj-planscard__acts { display: flex; flex-wrap: wrap; gap: 8px; }
#wrapwrap .ww-proj .pj-planscard__acts .dash-btn { flex: 1 1 auto; justify-content: center; }
/* 01 avancement : frise (verticale en mobile) + journal */
#wrapwrap .ww-proj ol.pj-steps { list-style: none; margin: 0; padding: 0; display: grid; }
#wrapwrap .ww-proj .pj-st { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 48px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-proj .pj-st b { font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card .pj-st b { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-st:not(.is-done):not(.is-on) b { color: var(--text-3); }
#wrapwrap .ww-proj .pj-st__dot { display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; border: 1px solid var(--ink-300, #C4C4C1); background: #fff; justify-self: center; }
#wrapwrap .ww-proj .pj-st__dot svg { display: none; width: 10px; height: 10px; color: #fff; stroke: #fff; }   /* le pictogramme suit currentColor */
#wrapwrap .ww-proj .pj-st.is-done .pj-st__dot { background: var(--ink-900); border-color: var(--ink-900); }
#wrapwrap .ww-proj .pj-st.is-done .pj-st__dot svg { display: block; }
#wrapwrap .ww-proj .pj-st.is-on .pj-st__dot { width: 12px; height: 12px; border: 0; background: var(--green-500); box-shadow: 0 0 0 6px rgba(0, 230, 176, .28); }
@media (min-width: 760px) {
  #wrapwrap .ww-proj ol.pj-steps { grid-template-columns: repeat(6, minmax(0, 1fr)); padding-bottom: 20px; border-bottom: 1px solid var(--border-1); }
  #wrapwrap .ww-proj .pj-st { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; gap: 6px; min-height: 0; border-bottom: 0; }
  #wrapwrap .ww-proj .pj-st::before { content: ""; position: absolute; top: 8px; left: 50%; width: 100%; height: 1px; background: var(--ink-200, #E4E4E1); }
  #wrapwrap .ww-proj .pj-st.is-done::before { background: var(--ink-900); }
  #wrapwrap .ww-proj .pj-st:last-child::before { display: none; }
  #wrapwrap .ww-proj .pj-st__dot { position: relative; z-index: 1; margin-bottom: 6px; }
  #wrapwrap .ww-proj .pj-st.is-on .pj-st__dot { margin: 2px 0 8px; }
  #wrapwrap .ww-proj .pj-st b { font-size: 14px; }
  #wrapwrap .ww-proj.ww-proj--card .pj-st b { font-size: 15.5px; }
}
#wrapwrap .ww-proj .pj-log { display: grid; gap: 12px; }
#wrapwrap .ww-proj ol.pj-log__l { list-style: none; margin: 0; padding: 0 0 0 6px; }
#wrapwrap .ww-proj .pj-ev { position: relative; display: flex; justify-content: space-between; gap: 16px; padding: 8px 0 8px 26px; font-size: 15px; }
#wrapwrap .ww-proj.ww-proj--card .pj-ev { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-ev::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--ink-900); }
#wrapwrap .ww-proj .pj-ev:first-child::before { top: 50%; }
#wrapwrap .ww-proj .pj-ev:last-child::before { bottom: 50%; }
#wrapwrap .ww-proj .pj-ev:only-child::before { display: none; }
#wrapwrap .ww-proj .pj-ev::after { content: ""; position: absolute; left: -3.5px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--ink-900); }
#wrapwrap .ww-proj .pj-ev.is-last::after { left: -5.5px; width: 12px; height: 12px; margin-top: -6px; background: var(--green-500); box-shadow: 0 0 0 5px rgba(0, 230, 176, .28); }
#wrapwrap .ww-proj .pj-ev b { font-weight: 400; color: var(--ink-900); }
#wrapwrap .ww-proj .pj-ev.is-last b { font-weight: 700; }
#wrapwrap .ww-proj .pj-ev .pj-mono { flex: none; }
/* 02 livraison */
#wrapwrap .ww-proj .pj-facts { display: grid; grid-template-columns: minmax(0, 1fr); border: 1px solid var(--border-1); border-radius: 10px; }
#wrapwrap .ww-proj .pj-facts > div { display: grid; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--border-1); min-width: 0; }
#wrapwrap .ww-proj .pj-facts > div:last-child { border-bottom: 0; }
@media (min-width: 760px) {
  #wrapwrap .ww-proj .pj-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #wrapwrap .ww-proj .pj-facts > div { border-bottom: 0; border-right: 1px solid var(--border-1); }
  #wrapwrap .ww-proj .pj-facts > div:last-child { border-right: 0; }
}
#wrapwrap .ww-proj .pj-fact { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--ink-900); min-width: 0; flex-wrap: wrap; }
#wrapwrap .ww-proj.ww-proj--card .pj-fact { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-fact.pj-mono { font-size: 15px; font-weight: 500; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card .pj-fact.pj-mono { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-fact small { font-size: 12px; color: var(--text-3); font-weight: 400; }
#wrapwrap .ww-proj.ww-proj--card .pj-fact small { font-size: 13px; }
#wrapwrap .ww-proj ol.pj-checks { list-style: none; margin: -8px 0 0; padding: 0; }
/* 03 livraison, etude et plans : une seule ligne */
#wrapwrap .ww-proj .pj-ship1 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 14px 16px; border: 1px solid var(--border-1); border-radius: 10px; font-size: 15px; color: var(--text-2); }
#wrapwrap .ww-proj.ww-proj--card .pj-ship1 { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-ship1 b { color: var(--ink-900); font-weight: 700; }
#wrapwrap .ww-proj .pj-ship1 svg.i { color: var(--ink-900); }
#wrapwrap .ww-proj .pj-report { justify-self: start; }
/* 02 articles du projet */
#wrapwrap .ww-proj .pj-arts__src { display: flex; align-items: center; gap: 8px; margin: -8px 0 0; font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-proj.ww-proj--card .pj-arts__src { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-dot--s { width: 8px; height: 8px; box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); }
#wrapwrap .ww-proj ul.pj-arts__l { list-style: none; margin: -8px 0 0; padding: 0; min-width: 0; }
#wrapwrap .ww-proj li.pj-art { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto auto; align-items: center; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-proj li.pj-art.is-more { display: none; }
#wrapwrap .ww-proj .pj-arts.is-open li.pj-art.is-more { display: grid; }
#wrapwrap .ww-proj .pj-art__img { position: relative; display: block; width: 56px; height: 56px; border-radius: 8px; overflow: hidden; background: #fff; border: 1px solid var(--border-1); box-sizing: border-box; }   /* fond blanc, photo entiere (Charles 29/09 : fond noir moche, liseré gris aux angles) */
#wrapwrap .ww-proj .pj-art__img img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 3px; box-sizing: border-box; object-fit: contain; background: #fff; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-proj .pj-art__img .qt-thumb__ph { position: absolute; inset: 0; display: grid; place-items: center; padding: 4px; font-family: var(--font-mono); font-size: 8px; letter-spacing: .04em; text-transform: uppercase; text-align: center; color: var(--text-3); background: var(--ink-50, #F6F6F5); overflow: hidden; word-break: break-all; }
#wrapwrap .ww-proj.ww-proj--card .pj-art__img .qt-thumb__ph { font-size: 9px; }
#wrapwrap .ww-proj .pj-art__t { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-proj .pj-art__t b { font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card .pj-art__t b { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-art__cfg { font-size: 13px; line-height: 1.4; color: var(--text-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#wrapwrap .ww-proj.ww-proj--card .pj-art__cfg { font-size: 14.5px; }
#wrapwrap .ww-proj .pj-art__t small { font-size: 11px; }
#wrapwrap .ww-proj.ww-proj--card .pj-art__t small { font-size: 12px; }
#wrapwrap .ww-proj .pj-art__q { font-size: 14px; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-proj.ww-proj--card .pj-art__q { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-art__st { white-space: nowrap; }
#wrapwrap .ww-proj .pj-arts__f { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
#wrapwrap .ww-proj button.pj-arts__more { height: 44px; padding: 0; border: 0; background: transparent; font-family: var(--font-sans); font-size: 14px; font-weight: 700; color: var(--ink-900); cursor: pointer; }
#wrapwrap .ww-proj.ww-proj--card button.pj-arts__more { font-size: 15.5px; }
/* photos d'expedition EMB- (29/09) : grille de vignettes carrees (recadrees par Odoo, 320 px), 8 visibles puis « Voir les N photos » ; original au clic */
#wrapwrap .ww-proj .pj-emb { display: grid; gap: 12px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-proj .pj-emb__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
#wrapwrap .ww-proj .pj-emb__h .pj-kicker { margin: 0; }
#wrapwrap .ww-proj .pj-emb__h .pj-mono { font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-proj.ww-proj--card .pj-emb__h .pj-mono { font-size: 13px; }
html body #wrapwrap .ww-proj p.pj-emb__p { margin: 0 !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2); }
html body #wrapwrap .ww-proj.ww-proj--card p.pj-emb__p { font-size: 15.5px !important; }
#wrapwrap .ww-proj ul.pj-emb__l { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0 !important; padding: 0 !important; list-style: none; }
#wrapwrap .ww-proj .pj-emb__i { margin: 0; }
#wrapwrap .ww-proj .pj-emb__i.is-more { display: none; }
#wrapwrap .ww-proj .pj-emb.is-open .pj-emb__i.is-more { display: block; }
#wrapwrap .ww-proj .pj-emb__i a { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; border: 1px solid var(--border-1); border-radius: 8px; background: #fff; }
#wrapwrap .ww-proj .pj-emb__i img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
#wrapwrap .ww-proj .pj-emb__i a:hover img { transform: scale(1.03); }
#wrapwrap .ww-proj .pj-emb__i a:focus-visible { outline: 2px solid var(--ink-900); outline-offset: 2px; }
#wrapwrap .ww-proj .pj-emb__c { position: absolute; left: 6px; bottom: 6px; padding: 3px 6px; border-radius: 4px; background: var(--ink-900); color: #fff; font-family: var(--font-mono); font-size: 10px; line-height: 1.3; letter-spacing: .1em; text-transform: uppercase; }
#wrapwrap .ww-proj.ww-proj--card .pj-emb__c { font-size: 11px; }
#wrapwrap .ww-proj button.pj-emb__more { justify-self: start; height: 44px; padding: 0; border: 0; background: transparent; font-family: var(--font-sans); font-size: 14px; font-weight: 700; color: var(--ink-900); cursor: pointer; }
#wrapwrap .ww-proj.ww-proj--card button.pj-emb__more { font-size: 15.5px; }
#wrapwrap .ww-proj button.pj-emb__more:hover { text-decoration: underline; }
@media (max-width: 760px) { #wrapwrap .ww-proj ul.pj-emb__l { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 420px) { #wrapwrap .ww-proj ul.pj-emb__l { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww-proj .pj-emb__i img { transition: none; } }
#wrapwrap .ww-proj a.pj-arts__go { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; min-height: 44px; font-size: 14px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-proj.ww-proj--card a.pj-arts__go { font-size: 15.5px; }
#wrapwrap .ww-proj a.pj-arts__go:hover { text-decoration: underline !important; }
#wrapwrap .ww-proj a.pj-arts__resume { margin-left: auto; }
#wrapwrap .ww-proj ol.pj-checks li { display: grid; grid-template-columns: 40px minmax(0, 1fr); padding: 14px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-proj ol.pj-checks li:last-child { border-bottom: 0; }
#wrapwrap .ww-proj ol.pj-checks b { font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card ol.pj-checks b { font-size: 16.5px; }
html body #wrapwrap .ww-proj ol.pj-checks p { margin: 4px 0 0; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2); }
html body #wrapwrap .ww-proj.ww-proj--card ol.pj-checks p { font-size: 15.5px !important; }
#wrapwrap .ww-proj .pj-ship-sec > .dash-btn { justify-self: start; }
/* 03 dossier */
#wrapwrap .ww-proj .pj-dossier__k { margin: 24px 0 12px; }
#wrapwrap .ww-proj .pj-dossier { padding: 8px 24px 24px; }
#wrapwrap .ww-proj .pj-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border-1); overflow-x: auto; scrollbar-width: none; margin-bottom: 8px; }
#wrapwrap .ww-proj .pj-tab { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 48px; padding: 0 12px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: transparent; font-size: 15px; font-weight: 500; color: var(--text-2); cursor: pointer; }
#wrapwrap .ww-proj.ww-proj--card .pj-tab { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-tab small { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-proj.ww-proj--card .pj-tab small { font-size: 13px; }
#wrapwrap .ww-proj .pj-tab.is-on { color: var(--ink-900); font-weight: 700; border-bottom-color: var(--ink-900); }
#wrapwrap .ww-proj .pj-tab:hover { color: var(--ink-900); background: transparent; }
#wrapwrap .ww-proj .pj-tab:focus, #wrapwrap .ww-proj .pj-tab:active { outline: 0 !important; box-shadow: none !important; }
/* anneau bleu Bootstrap « button:focus » (-webkit-focus-ring-color) laisse apres un clic : retire, focus clavier garde */
#wrapwrap .ww-proj button:focus:not(:focus-visible) { outline: 0 !important; }
#wrapwrap .ww-proj .pj-tab:focus-visible { outline: 2px solid var(--ink-900) !important; outline-offset: -6px; border-radius: 8px; }
#wrapwrap .ww-proj .pj-orow { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 18px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-proj .pj-orow__t { display: grid; gap: 6px; min-width: 0; flex: 1 1 320px; }
#wrapwrap .ww-proj .pj-orow__t b { font-size: 16px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card .pj-orow__t b { font-size: 17.5px; }
#wrapwrap .ww-proj .pj-orow__t small { font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-proj.ww-proj--card .pj-orow__t small { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-orow__r { display: grid; justify-items: end; gap: 10px; }
#wrapwrap .ww-proj .pj-amount { font-size: 18px !important; font-weight: 600; color: var(--ink-900) !important; }
#wrapwrap .ww-proj.ww-proj--card .pj-amount { font-size: 20px !important; }
#wrapwrap .ww-proj .pj-amount small { font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-proj.ww-proj--card .pj-amount small { font-size: 13px; }
#wrapwrap .ww-proj .pj-pro { margin: 12px 0 4px; padding: 12px 14px; border-radius: 8px; background: #ECF22E; color: var(--ink-900); font-size: 14px; }
#wrapwrap .ww-proj.ww-proj--card .pj-pro { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-pro b { margin-right: 6px; }
#wrapwrap .ww-proj .pj-pane > .pj-kicker { margin: 16px 0 12px; }
#wrapwrap .ww-proj .pj-plans { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
#wrapwrap .ww-proj a.pj-plan { display: grid; gap: 8px; min-width: 0; color: var(--ink-900) !important; text-decoration: none !important; font-size: 13px; }
#wrapwrap .ww-proj.ww-proj--card a.pj-plan { font-size: 14.5px; }
#wrapwrap .ww-proj .pj-plan__v { aspect-ratio: 4 / 3; display: grid; place-items: center; align-content: center; gap: 6px; border: 1px solid var(--border-1); border-radius: 8px; background: var(--ink-50, #F6F6F5); color: var(--text-2); }
#wrapwrap .ww-proj .pj-pane > .pj-docs__k { margin: 20px 0 12px; }
#wrapwrap .ww-proj .pj-plans { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
#wrapwrap .ww-proj a.pj-plan { gap: 0; border: 1px solid var(--border-1); border-radius: 10px; overflow: hidden; background: #fff; }
#wrapwrap .ww-proj a.pj-plan:hover { border-color: var(--ink-900); }
#wrapwrap .ww-proj .pj-plan__v { position: relative; aspect-ratio: 4 / 3; border: 0; border-radius: 0; background: var(--ink-50, #F0F0EE); color: var(--text-3); }
#wrapwrap .ww-proj .pj-plan__v > svg { width: 40px; height: 40px; }
#wrapwrap .ww-proj .pj-plan__b { position: absolute; top: 10px; left: 10px; padding: 4px 8px; border-radius: 4px; background: var(--ink-900); color: #fff; font-family: var(--font-mono); font-size: 10px; line-height: 1.3; letter-spacing: .12em; text-transform: uppercase; }
#wrapwrap .ww-proj.ww-proj--card .pj-plan__b { font-size: 11px; }
#wrapwrap .ww-proj .pj-plan__b.is-new { background: var(--green-500); color: var(--ink-900); }   /* nouvelle version du BE depuis la derniere validation */
#wrapwrap .ww-proj .pj-new { font: inherit; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj .pj-plan__f { display: grid; gap: 2px; min-width: 0; padding: 10px 12px 12px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-proj .pj-plan__f b { font-size: 14px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card .pj-plan__f b { font-size: 15.5px; }
#wrapwrap .ww-proj .pj-plan__f small { font-size: 11px; }
#wrapwrap .ww-proj.ww-proj--card .pj-plan__f small { font-size: 12px; }
#wrapwrap .ww-proj ul.pj-docs { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-proj li.pj-doc { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-proj li.pj-doc > svg { flex: none; color: var(--text-3); }
#wrapwrap .ww-proj .pj-doc__t { flex: 1 1 auto; display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-proj .pj-doc__t b { font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-proj.ww-proj--card .pj-doc__t b { font-size: 16.5px; }
#wrapwrap .ww-proj .pj-tagp { flex: none; padding: 3px 8px; border-radius: 4px; background: var(--ink-50, #F0F0EE); font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-2); white-space: nowrap; }
#wrapwrap .ww-proj.ww-proj--card .pj-tagp { font-size: 11px; }
#wrapwrap .ww-proj a.pj-pdf { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 1px solid var(--border-1); border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-proj.ww-proj--card a.pj-pdf { font-size: 14.5px; }
#wrapwrap .ww-proj a.pj-pdf:hover { border-color: var(--ink-900); }
/* encart « Votre projet à l'atelier » en tete de fiche (Charles 05/10 : « un vrai plus, juste posé au milieu » -> tout en haut) */
#wrapwrap .ww-proj a.pj-live { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "k go" "v go" "bar bar"; align-items: center; gap: 12px 32px; margin: 0 0 24px; padding: 24px 28px; border-radius: 14px; background: var(--ink-900); color: #fff !important; text-decoration: none !important; box-shadow: var(--shadow-card); transition: background .15s ease-out; }
#wrapwrap .ww-proj a.pj-live:hover { background: #000; }
#wrapwrap .ww-proj a.pj-live:focus-visible { outline: 2px solid var(--green-500); outline-offset: 3px; }
#wrapwrap .ww-proj .pj-live__k { grid-area: k; display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 12px !important; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--green-500) !important; }
#wrapwrap .ww-proj .pj-live__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.4); }
#wrapwrap .ww-proj .pj-live__dot.is-run { background: var(--green-500); animation: pjLive 1.8s ease-out infinite; }
@keyframes pjLive { 0% { box-shadow: 0 0 0 0 rgba(0,230,176,.55); } 100% { box-shadow: 0 0 0 10px rgba(0,230,176,0); } }
#wrapwrap .ww-proj .pj-live__v { grid-area: v; display: flex; align-items: center; gap: 16px; min-width: 0; }
#wrapwrap .ww-proj .pj-live__pct { flex: none; font-family: var(--font-mono); font-size: 44px !important; font-weight: 600; letter-spacing: -.03em; line-height: 1; color: #fff !important; }
#wrapwrap .ww-proj .pj-live__pct small { font-size: 22px !important; color: #fff !important; }
#wrapwrap .ww-proj .pj-live__l { display: grid; gap: 4px; min-width: 0; font-size: 17px !important; font-weight: 700; line-height: 1.3; color: #fff !important; }
#wrapwrap .ww-proj .pj-live__l small { font-size: 14px !important; font-weight: 400; color: rgba(255,255,255,.68) !important; }
#wrapwrap .ww-proj .pj-live__bar { grid-area: bar; display: block; height: 6px; border-radius: 999px; background: rgba(255,255,255,.14); overflow: hidden; }
#wrapwrap .ww-proj .pj-live__bar i { display: block; height: 100%; border-radius: inherit; background: var(--green-500); }
#wrapwrap .ww-proj .pj-live__go { grid-area: go; height: 48px; padding: 0 22px; font-size: 16px; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww-proj .pj-live__dot.is-run { animation: none; } }
@media (max-width: 760px) {
  #wrapwrap .ww-proj a.pj-live { grid-template-columns: minmax(0, 1fr); grid-template-areas: "k" "v" "bar" "go"; gap: 14px; padding: 20px 18px; }
  #wrapwrap .ww-proj .pj-live__pct { font-size: 36px !important; }
  #wrapwrap .ww-proj .pj-live__go { width: 100%; justify-content: center; }
}
/* projets termines (archives Odoo), 05/10 : onglet « Terminés » du filtre (meme dessin que « Mes commandes »), lignes compactes */
#wrapwrap .ww-proj .qt-filters { display: inline-flex; gap: 4px; padding: 4px; border-radius: 10px; background: var(--ink-100); }
#wrapwrap .ww-proj .qt-filters a { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 8px; font-size: 14px; font-weight: 700; color: var(--ink-700) !important; text-decoration: none !important; }
#wrapwrap .ww-proj .qt-filters a[aria-pressed="true"] { background: #fff; color: var(--ink-900) !important; box-shadow: 0 1px 2px rgba(20,20,20,.08); }
#wrapwrap .ww-proj .qt-filters a small { font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: var(--text-3); }
#wrapwrap .ww-proj .pj-more { margin-top: 16px; }
@media (max-width: 760px) {
  #wrapwrap .ww-proj .qt-filters { width: 100%; }
  #wrapwrap .ww-proj .qt-filters a { flex: 1; justify-content: center; }
  #wrapwrap .ww-proj .pj-more { width: 100%; justify-content: center; }
}
/* mobile */
@media (max-width: 1099px) {
  #wrapwrap .ww-proj .pj-cols { display: none; }
  #wrapwrap .ww-proj .pj-list { background: transparent; box-shadow: none; display: grid; gap: 12px; }
  #wrapwrap .ww-proj a.pj-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px 16px; padding: 18px; border: 0; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); }
  #wrapwrap .ww-proj .pj-c--proj, #wrapwrap .ww-proj .pj-c--track, #wrapwrap .ww-proj .pj-c--am { grid-column: 1 / -1; }
  #wrapwrap .ww-proj .pj-go { display: none; }
  #wrapwrap .ww-proj .pj-bar { max-width: none; }
}
@media (max-width: 760px) {
  #wrapwrap .ww-proj .pj-tools { display: grid; grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-proj .pj-search { margin: 0; flex: none; width: 100%; }
  html body #wrapwrap .ww-proj .pj-sort select { width: 100%; }
  #wrapwrap .ww-proj h1.pj-h1 { font-size: 32px !important; }
  #wrapwrap .ww-proj .pj-dhead__acts, #wrapwrap .ww-proj .pj-dhead__acts .dash-btn { width: 100%; justify-content: center; }
  #wrapwrap .ww-proj .pj-sec { padding: 20px 18px; }
  #wrapwrap .ww-proj .pj-arts { min-width: 0; }
  #wrapwrap .ww-proj ul.pj-arts__l { display: flex; gap: 12px; margin: 0 -18px; padding: 2px 18px 8px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 18px; scrollbar-width: thin; }
  #wrapwrap .ww-proj li.pj-art, #wrapwrap .ww-proj li.pj-art.is-more { flex: none; width: 240px; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "img img" "txt txt" "q st"; align-items: center; gap: 10px 8px; padding: 12px; border: 1px solid var(--border-1); border-radius: 12px; scroll-snap-align: start; }
  #wrapwrap .ww-proj .pj-art__img { grid-area: img; width: 100%; height: 120px; }
  #wrapwrap .ww-proj .pj-art__t { grid-area: txt; }
  #wrapwrap .ww-proj .pj-art__q { grid-area: q; }
  #wrapwrap .ww-proj .pj-art__st { grid-area: st; justify-self: end; }
  #wrapwrap .ww-proj button.pj-arts__more { display: none; }
  #wrapwrap .ww-proj .pj-dossier { padding: 4px 16px 16px; }
  #wrapwrap .ww-proj .pj-orow__r { justify-items: start; }
  #wrapwrap .ww-proj .pj-ev { flex-wrap: wrap; gap: 2px 12px; }
  #wrapwrap .ww-proj li.pj-doc { flex-wrap: wrap; }
  #wrapwrap .ww-proj .pj-doc__t { flex-basis: calc(100% - 40px); }
  #wrapwrap .ww-proj li.pj-doc .pj-tagp { margin-left: 36px; }
  #wrapwrap .ww-proj a.pj-pdf { margin-left: auto; }
  #wrapwrap .ww-proj .dash-btn { min-height: 44px; }
}


/* ===== chat.css ===== */
/* ===== chat.css — zone d'echange commune (devis, commande, projet) : racine .wwc (chat_build.py, 29/09) ===== */
#wrapwrap .wwc { --wwc-fs: 15px; }
#wrapwrap .ww-proj--card .wwc { --wwc-fs: 16.5px; }   /* fiche projet : polices +10 % (Charles 29/09) */
#wrapwrap .wwc:not(.is-open) .wwc-thread, #wrapwrap .wwc.is-open .wwc-msgs--prev, #wrapwrap .wwc.is-open .wwc-open { display: none !important; }
#wrapwrap .wwc .wwc-open { margin-top: 20px; }
html body #wrapwrap .wwc p.wwc-hint { margin: 16px 0 !important; font-family: var(--font-sans) !important; font-size: calc(var(--wwc-fs) - 1px) !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .wwc .wwc-mono { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .wwc .wwc-av { flex: none; display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--ink-900); color: #fff; font-size: 12px; font-weight: 700; }
#wrapwrap .wwc .wwc-av--grey { background: var(--ink-100, #E4E4E1); color: var(--ink-900); }
#wrapwrap .wwc .wwc-av.has-photo { background-color: transparent !important; background-size: cover; background-position: center; background-repeat: no-repeat; }
#wrapwrap .pj-av:has(> img), #wrapwrap .qo-contact__av:has(> img) { background: transparent !important; }
#wrapwrap .pj-av img, #wrapwrap .qo-contact__av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; border: 0 !important; box-shadow: none !important; }
#wrapwrap .wwc .wwc-msg { display: flex; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .wwc .wwc-msg__c { flex: 1 1 auto; min-width: 0; }
#wrapwrap .wwc .wwc-msg__h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin-bottom: 4px; }
#wrapwrap .wwc .wwc-msg__h b { font-size: var(--wwc-fs); font-weight: 700; color: var(--ink-900); }
#wrapwrap .wwc .wwc-msg__b { font-family: var(--font-sans); font-size: var(--wwc-fs); line-height: 1.55; color: var(--text-2); overflow-wrap: anywhere; }
html body #wrapwrap .wwc .wwc-msg__b p { margin: 0 0 6px; font-size: inherit !important; line-height: inherit !important; }
html body #wrapwrap .wwc .wwc-msg__b p:last-child { margin: 0; }
/* apercu = extrait texte de 3 lignes : e-mails Odoo complets (logo, encadres, bouton) et reponses citant l'historique -> aplatis, images et citations masquees */
#wrapwrap .wwc .wwc-msgs--prev .wwc-msg__b { max-height: 4.65em; overflow: hidden; -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
html body #wrapwrap .wwc .wwc-msgs--prev .wwc-msg__b * { display: inline !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important;
  font-family: inherit !important; font-size: inherit !important; line-height: inherit !important; font-weight: inherit !important; color: inherit !important; text-align: left !important; width: auto !important; height: auto !important; }
html body #wrapwrap .wwc .wwc-msgs--prev .wwc-msg__b :is(p, div, table, tr, li, h1, h2, h3, h4)::after { content: " "; }
html body #wrapwrap .wwc .wwc-msg__b :is(img, style, blockquote, [data-o-mail-quote], div:has(> blockquote), div:has(> [data-o-mail-quote])) { display: none !important; }
#wrapwrap .wwc .wwc-msg__att { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
#wrapwrap .wwc .wwc-msg__att a { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 4px 10px; border: 1px solid var(--border-1); border-radius: 6px; font-size: 13px; color: var(--ink-900) !important; text-decoration: none !important; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .wwc .wwc-msg__att svg.i { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .wwc .wwc-msgs--full { margin-top: 8px; border-top: 1px solid var(--border-1); }
#wrapwrap .wwc .wwc-msgs--full .wwc-msg__b { overflow-x: auto; }
#wrapwrap .wwc .wwc-msgs--full .wwc-msg__b img { max-width: 100% !important; height: auto !important; }
#wrapwrap .wwc .wwc-msgs--full .wwc-msg__b table { max-width: 100% !important; }
/* zone de reponse d'Odoo au design workwith (avant : avatar, champ gris, « ENVOYER » en capitales, cadre) ; sa liste, son entete et sa pagination masques */
html body #wrapwrap .wwc .wwc-thread :is(.o_portal_chatter_header, .o_portal_chatter_header + hr, .o_portal_chatter_messages, .o_portal_chatter_footer) { display: none !important; }
html body #wrapwrap .wwc .o_portal_chatter { margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer { margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer > hr, html body #wrapwrap .wwc .o_portal_chatter_avatar { display: none !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer .media { display: block !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer .media-body { margin: 0 !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer_form > .mb32 { margin: 0 !important; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
html body #wrapwrap .wwc textarea[name="message"] { flex: 1 0 100%; width: 100% !important; min-height: 120px; margin: 0 !important; padding: 12px 14px !important; border: 1px solid var(--border-1) !important; border-radius: 10px !important;
  background: #fff !important; box-shadow: none !important; font-family: var(--font-sans) !important; font-size: var(--wwc-fs) !important; line-height: 1.5 !important; color: var(--ink-900) !important; resize: vertical; }
html body #wrapwrap .wwc textarea[name="message"]::placeholder { color: var(--text-3); opacity: 1; }
html body #wrapwrap .wwc textarea[name="message"]:focus { outline: none !important; border-color: var(--ink-900) !important; box-shadow: 0 0 0 3px rgba(0, 230, 176, .28) !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer_error:not([style*="block"]) { display: none; }
html body #wrapwrap .wwc .o_portal_chatter_composer_error { flex: 1 0 100%; margin: 0 !important; border-radius: 8px; font-size: 14px; }
html body #wrapwrap .wwc .o_portal_chatter_attachments { flex: 1 0 100%; margin: 0 !important; display: flex; flex-wrap: wrap; gap: 8px; }
html body #wrapwrap .wwc .o_portal_chatter_attachments:empty { display: none; }
html body #wrapwrap .wwc .o_portal_chatter_composer_btn, html body #wrapwrap .wwc .o_portal_chatter_attachment_btn {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; height: 44px; margin: 0 !important; padding: 0 18px !important; border-radius: 10px !important;
  font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important; line-height: 1 !important; box-shadow: none !important; opacity: 1 !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer_btn { order: 2; border: 0 !important; background: var(--green-500) !important; color: var(--ink-900) !important; }
html body #wrapwrap .wwc .o_portal_chatter_composer_btn:hover { background: var(--green-600, #00C497) !important; }
html body #wrapwrap .wwc .o_portal_chatter_attachment_btn { order: 1; border: 1px solid var(--border-1) !important; background: #fff !important; color: var(--ink-900) !important; }
html body #wrapwrap .wwc .o_portal_chatter_attachment_btn:hover { border-color: var(--ink-900) !important; }
html body #wrapwrap .wwc .o_portal_chatter_attachment_btn::after { content: "Joindre un fichier"; }
html body #wrapwrap .wwc .o_portal_chatter_attachment_btn .fa { font-size: 16px; }
/* repli : zone de reponse indisponible (visiteur sans cle) -> encart workwith au lieu du « Laisser un commentaire » d'Odoo */
#wrapwrap .wwc .wwc-login { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding: 16px 18px; border: 1px solid var(--border-1); border-radius: 10px; background: var(--ink-50, #F6F6F5); }
html body #wrapwrap .wwc .wwc-login p { margin: 0 !important; font-family: var(--font-sans) !important; font-size: var(--wwc-fs) !important; line-height: 1.5 !important; color: var(--ink-900) !important; }
#wrapwrap .wwc .wwc-login .dash-btn { flex: none; }
@media (max-width: 760px) {
  #wrapwrap .wwc .wwc-open { width: 100%; justify-content: center; }
  html body #wrapwrap .wwc .o_portal_chatter_composer_btn, html body #wrapwrap .wwc .o_portal_chatter_attachment_btn { flex: 1 1 100%; }
}


/* ===== sheet.css ===== */
/* fiche laterale commune ww-sheet — derivee de la fiche du chiffrage (qt-sheet) */
body.ww-modal { overflow: hidden; }
#wrapwrap .ww-sheet[hidden] { display: none !important; }
#wrapwrap .ww-sheet { position: fixed; inset: 0; z-index: 1065; }
#wrapwrap .ww-sheet .ww-sheet__veil { position: absolute; inset: 0; background: rgba(20, 20, 20, .42); }
#wrapwrap .ww-sheet .ww-sheet__panel { position: absolute; top: 12px; right: 12px; bottom: 12px; width: 480px; max-width: calc(100% - 24px); display: flex; flex-direction: column; overflow: hidden; border-radius: 14px; background: #fff; box-shadow: var(--shadow-l, 0 16px 40px rgba(20, 20, 20, .16)); transform: translateX(16px); opacity: 0; transition: transform .18s ease-out, opacity .18s ease-out; }
#wrapwrap .ww-sheet.is-in .ww-sheet__panel { transform: none; opacity: 1; }
#wrapwrap .ww-sheet .ww-sheet__panel:focus { outline: none; }
#wrapwrap .ww-sheet .ww-sheet__head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 56px; padding: 0 8px 0 20px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-sheet .ww-sheet__ref { flex: 1; min-width: 0; overflow: hidden; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; text-overflow: ellipsis; }
html body #wrapwrap .ww-sheet button.ww-sheet__x { appearance: none; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--ink-900); cursor: pointer; }
html body #wrapwrap .ww-sheet button.ww-sheet__x:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-sheet .ww-sheet__x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-sheet .ww-sheet__body { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 20px; padding: 24px 28px 28px; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; }
#wrapwrap .ww-sheet .ww-sheet__ph { position: relative; flex: none; display: flex; align-items: center; justify-content: center; height: 300px; border-radius: 12px; overflow: hidden; background: var(--ink-900); color: var(--ink-500); }
#wrapwrap .ww-sheet .ww-sheet__ph.is-prod { background: #fff; box-shadow: inset 0 0 0 1px var(--border-1); }
#wrapwrap .ww-sheet .ww-sheet__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
#wrapwrap .ww-sheet .ww-sheet__ph.is-prod img { object-fit: contain; padding: 12px; }
#wrapwrap .ww-sheet svg.ww-sheet__ico { width: 40px; height: 40px; fill: none; stroke: currentColor; stroke-width: 1.5; }
#wrapwrap .ww-sheet .ww-sheet__lbl { position: absolute; left: 12px; bottom: 12px; padding: 4px 8px; border-radius: 4px; background: rgba(20, 20, 20, .72); font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: #fff; white-space: nowrap; }
#wrapwrap .ww-sheet .ww-sheet__id { display: grid; gap: 8px; }
#wrapwrap .ww-sheet .ww-sheet__eb { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--green-700); }
#wrapwrap .ww-sheet h2.ww-sheet__t { margin: 0 !important; font-family: var(--font-display, inherit) !important; font-size: 28px !important; font-weight: 900 !important; line-height: 1.08 !important; letter-spacing: -.035em !important; color: var(--ink-900) !important; text-wrap: pretty; }
#wrapwrap .ww-sheet h2.ww-sheet__t i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-sheet p.ww-sheet__d { margin: 0 !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.55 !important; color: var(--text-2) !important; }
#wrapwrap .ww-sheet .ww-sheet__specs { flex: none; border: 1px solid var(--border-1); border-radius: 10px; }
#wrapwrap .ww-sheet .ww-sheet__row { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; padding: 10px 14px; border-top: 1px solid var(--border-1); font-size: 14px; line-height: 1.45; }
#wrapwrap .ww-sheet .ww-sheet__row:first-child { border-top: 0; }
#wrapwrap .ww-sheet .ww-sheet__row span { color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap .ww-sheet .ww-sheet__row b { min-width: 0; font-weight: 500; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-sheet .ww-sheet__docs { display: grid; gap: 10px; }
#wrapwrap .ww-sheet .ww-sheet__h { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-sheet .ww-sheet__dh { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
#wrapwrap .ww-sheet .ww-sheet__dn { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-sheet .ww-sheet__dlist { border: 1px solid var(--border-1); border-radius: 12px; background: #fff; overflow: hidden; }
#wrapwrap .ww-sheet .ww-sheet__doc { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 8px 12px 12px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-sheet .ww-sheet__doc:first-child { border-top: 0; }
#wrapwrap .ww-sheet .ww-sheet__doc[data-wwp-url] { cursor: pointer; }
#wrapwrap .ww-sheet .ww-sheet__doc[data-wwp-url]:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-sheet .ww-sheet__doc.is-viewing, #wrapwrap .ww-sheet .ww-sheet__doc.is-viewing:hover { background: rgba(0, 227, 174, .08); }
#wrapwrap .ww-sheet .ww-sheet__doc:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-sheet .ww-sheet__dth { position: relative; display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 8px; background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-sheet .ww-sheet__dth i { position: relative; display: block; width: 30px; height: 40px; background: #fff linear-gradient(var(--ink-900), var(--ink-900)) 0 0 / 100% 7px no-repeat; box-shadow: 0 1px 3px rgba(20, 20, 20, .18); }
#wrapwrap .ww-sheet .ww-sheet__dth i::after { content: ""; position: absolute; left: 5px; right: 5px; top: 12px; height: 19px; background: repeating-linear-gradient(var(--ink-200) 0 2px, transparent 2px 5px); }
#wrapwrap .ww-sheet .ww-sheet__dth--plan i { width: 44px; height: 31px; background: #fff; }
#wrapwrap .ww-sheet .ww-sheet__dth--plan i::after { left: 5px; right: auto; top: 5px; width: 18px; height: 20px; background: none; border: 1px solid var(--ink-700); border-right: 0; }
#wrapwrap .ww-sheet .ww-sheet__dth--plan i::before { content: ""; position: absolute; right: 4px; bottom: 4px; width: 14px; height: 7px; border: 1px solid var(--ink-700); }
#wrapwrap .ww-sheet .ww-sheet__dtx { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-sheet .ww-sheet__dtx b { font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-sheet .ww-sheet__dtx small { font-family: var(--font-mono); font-size: 11px; line-height: 1.4; color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap .ww-sheet .ww-sheet__dnow { display: none; align-items: center; gap: 8px; margin-top: 2px; font-family: var(--font-mono); font-size: 11px; font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--green-700); }
#wrapwrap .ww-sheet .ww-sheet__dnow::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 3px rgba(0, 230, 176, .28); }
#wrapwrap .ww-sheet .ww-sheet__doc.is-viewing .ww-sheet__dnow { display: inline-flex; }
#wrapwrap .ww-sheet .ww-sheet__dact { display: flex; }
html body #wrapwrap .ww-sheet .ww-sheet__dib { appearance: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900) !important; text-decoration: none !important; cursor: pointer; }
html body #wrapwrap .ww-sheet .ww-sheet__dib:hover { background: var(--ink-100); }
html body #wrapwrap .ww-sheet .ww-sheet__dib:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-sheet .ww-sheet__dib svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
html body #wrapwrap .ww-sheet a.ww-sheet__more { align-self: flex-start; display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--text-2) !important; text-decoration: underline !important; text-underline-offset: 3px; }
#wrapwrap .ww-sheet .ww-sheet__foot { flex: none; display: grid; gap: 12px; padding: 16px 28px; border-top: 1px solid var(--border-1); background: #fff; }
#wrapwrap .ww-sheet .ww-sheet__pr { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
#wrapwrap .ww-sheet .ww-sheet__pr b { font-family: var(--font-mono); font-size: 20px; font-weight: 600; color: var(--ink-900); white-space: nowrap; }
#wrapwrap .ww-sheet .ww-sheet__pr b small { font-size: 12px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-sheet .ww-sheet__pr > span { font-size: 12px; line-height: 1.4; text-align: right; color: var(--text-3); }
#wrapwrap .ww-sheet .ww-sheet__act { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; }
#wrapwrap .ww-sheet .ww-sheet__qty { display: inline-flex; align-items: center; height: 44px; border: 1px solid var(--border-1); border-radius: 8px; }
#wrapwrap .ww-sheet .ww-sheet__qty[hidden] { display: none; }
#wrapwrap .ww-sheet .ww-sheet__act:has(> .ww-sheet__qty[hidden]) .ww-sheet__add { grid-column: 1 / -1; }
html body #wrapwrap .ww-sheet .ww-sheet__qty button { appearance: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 42px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none; color: var(--ink-900); cursor: pointer; }
html body #wrapwrap .ww-sheet .ww-sheet__qty button:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-sheet .ww-sheet__qty svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
#wrapwrap .ww-sheet .ww-sheet__qty output { min-width: 28px; font-family: var(--font-mono); font-size: 15px; font-weight: 600; text-align: center; color: var(--ink-900); }
html body #wrapwrap .ww-sheet button.ww-sheet__add { width: 100%; height: 44px; min-width: 0; padding: 0 14px; font-size: 15px; gap: 0; overflow: hidden; }
#wrapwrap .ww-sheet .ww-sheet__add svg { flex: none; width: 16px; height: 16px; margin-right: 8px; fill: none; stroke: currentColor; stroke-width: 2; }
#wrapwrap .ww-sheet .ww-sheet__add span { white-space: pre; }
@media (max-width: 760px) {
  #wrapwrap .ww-sheet .ww-sheet__panel { top: 0; right: 0; bottom: 0; width: 100%; max-width: none; border-radius: 0; transform: translateY(12px); }
  #wrapwrap .ww-sheet .ww-sheet__body { padding: 20px 16px 24px; }
  #wrapwrap .ww-sheet .ww-sheet__ph { height: 220px; }
  #wrapwrap .ww-sheet h2.ww-sheet__t { font-size: 26px !important; }
  #wrapwrap .ww-sheet .ww-sheet__row { grid-template-columns: 112px minmax(0, 1fr); }
  #wrapwrap .ww-sheet .ww-sheet__foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
}
@media (max-width: 420px) {
  #wrapwrap .ww-sheet .ww-sheet__ak { display: none; }
}
/* complements catalogue v1.1 : etiquette techno et pastille sur la photo, reference reservee en jaune, pied a liens */
#wrapwrap .ww-sheet .ww-sheet__tag { position: absolute; top: 12px; left: 12px; z-index: 1; }
#wrapwrap .ww-sheet .ww-sheet__pill { position: absolute; top: 12px; right: 12px; z-index: 1; padding: 3px 9px; border-radius: 999px; background: var(--ink-900); color: #ECF22E; font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
#wrapwrap .ww-sheet .ww-sheet__i, #wrapwrap .ww-sheet svg.i { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
html body #wrapwrap .ww-sheet.is-res button.ww-sheet__add, html body #wrapwrap .ww-sheet.is-res .ww-sheet__act--links a.dash-btn--accent { background: #ECF22E !important; color: var(--ink-900) !important; }
html body #wrapwrap .ww-sheet.is-res button.ww-sheet__add:hover, html body #wrapwrap .ww-sheet.is-res .ww-sheet__act--links a.dash-btn--accent:hover { background: #DDE31F !important; }
#wrapwrap .ww-sheet .ww-sheet__act--links { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
#wrapwrap .ww-sheet .ww-sheet__lock { display: grid; gap: 6px; margin: 20px 0 0; padding: 14px 16px; border-radius: 12px; background: var(--surface-sunken); font-size: 14px; line-height: 1.5; color: var(--text-2); }
#wrapwrap .ww-sheet .ww-sheet__lockh { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ink-900); }
html body #wrapwrap .ww-sheet .ww-sheet__act--links a.dash-btn { height: 44px; justify-content: center; text-decoration: none !important; }
html body #wrapwrap .ww-sheet .ww-sheet__act--links a.dash-btn svg { width: 18px; height: 18px; }


/* ===== terms.css ===== */
/* ===== terms.css — conditions d'utilisation (handoff confidentialite-v1.0) : fenetre de lecture + mention de bas de page ===== */
#wrapwrap .ww-cgu { position: fixed; inset: 0; z-index: 1070; display: flex; align-items: center; justify-content: center; padding: 24px; }
#wrapwrap .ww-cgu[hidden] { display: none !important; }
#wrapwrap .ww-cgu__veil { position: absolute; inset: 0; background: rgba(20, 20, 20, .56); }
#wrapwrap .ww-cgu__dlg { position: relative; display: flex; flex-direction: column; width: 100%; max-width: 640px; max-height: 100%; overflow: hidden; border-radius: 14px; background: #fff; box-shadow: var(--shadow-l, 0 24px 64px rgba(20, 20, 20, .24)); outline: none; }
#wrapwrap .ww-cgu__body { flex: 1; min-height: 0; overflow-y: auto; padding: 32px 32px 8px; scrollbar-width: thin; }
#wrapwrap .ww-cgu__head { position: relative; padding: 0 0 22px 28px; }
#wrapwrap .ww-cgu__head::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 0; width: 1.5px; background: var(--ink-900, #141414); }
#wrapwrap .ww-cgu__head::after { content: ""; position: absolute; left: 0; top: 0; width: 12px; height: 12px; border-radius: 6px; background: var(--green-500, #00E6B0); box-shadow: 0 0 0 6px rgba(0, 230, 176, .28); }
#wrapwrap .ww-cgu__eb { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--green-700, #00875F); }
html body #wrapwrap h2.ww-cgu__t { margin: 10px 0 0 !important; font-family: var(--font-sans, Heebo, sans-serif) !important; font-size: 30px !important; font-weight: 900 !important; line-height: 1.08 !important; letter-spacing: -.035em !important; color: var(--ink-900, #141414) !important; text-transform: none !important; }
#wrapwrap h2.ww-cgu__t i { font-style: normal; color: var(--green-500, #00E6B0); }
html body #wrapwrap p.ww-cgu__lead { margin: 12px 0 0 !important; font-size: 16px !important; line-height: 1.55 !important; color: var(--text-2, #5C5C5C) !important; }
#wrapwrap ol.ww-cgu__l { margin: 0 !important; padding: 0 !important; list-style: none; border-top: 1px solid var(--border-1, #E4E4E1); }
#wrapwrap .ww-cgu__it { display: grid; grid-template-columns: 52px minmax(0, 1fr); padding: 18px 0; border-bottom: 1px solid var(--border-1, #E4E4E1); }
#wrapwrap .ww-cgu__it:last-child { border-bottom: 0; }
#wrapwrap .ww-cgu__n { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: 12px; line-height: 22px; color: var(--text-3, #767676); }
html body #wrapwrap .ww-cgu__it b { display: block; font-size: 16px !important; font-weight: 700 !important; line-height: 1.35 !important; color: var(--ink-900, #141414) !important; }
html body #wrapwrap .ww-cgu__it p { margin: 6px 0 0 !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2, #5C5C5C) !important; }
#wrapwrap .ww-cgu__foot { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 32px 20px; border-top: 1px solid var(--border-1, #E4E4E1); background: #fff; }
#wrapwrap .ww-cgu__v { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: 12px; color: var(--text-3, #767676); }
html body #wrapwrap button.ww-cgu__close { appearance: none; display: inline-flex; align-items: center; justify-content: center; height: 44px; margin: 0; padding: 0 22px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; box-shadow: none; font-family: var(--font-sans, Heebo, sans-serif); font-size: 15px; font-weight: 700; color: var(--ink-900, #141414); cursor: pointer; }
html body #wrapwrap button.ww-cgu__close:hover { border-color: var(--ink-900, #141414); }
body.ww-cgu-on { overflow: hidden; }
@media (max-width: 760px) {
  #wrapwrap .ww-cgu { padding: 0; }
  #wrapwrap .ww-cgu__dlg { max-width: none; height: 100%; border-radius: 0; }
  #wrapwrap .ww-cgu__body { padding: 24px 20px 8px; }
  html body #wrapwrap h2.ww-cgu__t { font-size: 26px !important; }
  #wrapwrap .ww-cgu__foot { padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); }
  html body #wrapwrap button.ww-cgu__close { flex: 1; }
}
/* ecran d'acceptation (premiere connexion, nouvelle version) : pied avec case + Refuser / Accepter ; aucun jaune (action courante, vert) */
#wrapwrap .ww-cgu--accept { z-index: 1080; }
#wrapwrap .ww-cgu__foot--accept { display: grid; gap: 14px; margin: 0; }
#wrapwrap label.ww-cgu__chk { display: flex; align-items: flex-start; gap: 12px; margin: 0 !important; font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--ink-900, #141414); cursor: pointer; }
#wrapwrap .ww-cgu__chk input { flex: none; width: 20px; height: 20px; margin: 0; accent-color: var(--ink-900, #141414); }
#wrapwrap .ww-cgu__acts { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
html body #wrapwrap a.ww-cgu__no { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900, #141414) !important; text-decoration: none !important; border-radius: 8px; }
html body #wrapwrap a.ww-cgu__no:hover { background: var(--ink-50, #F6F6F5); }
html body #wrapwrap button.ww-cgu__yes { appearance: none; display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 48px; margin: 0; padding: 0 22px; border: 0; border-radius: 8px; background: var(--green-500, #00E6B0); box-shadow: none; font-family: var(--font-sans, Heebo, sans-serif); font-size: 16px; font-weight: 700; color: var(--ink-900, #141414); cursor: pointer; }
html body #wrapwrap button.ww-cgu__yes:hover { background: var(--green-600, #00C497); }
html body #wrapwrap button.ww-cgu__yes:disabled { background: rgba(0, 230, 176, .45); color: rgba(20, 20, 20, .45); cursor: not-allowed; }
#wrapwrap .ww-cgu__yes svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 760px) {
  #wrapwrap .ww-cgu__acts { flex-direction: column-reverse; align-items: stretch; }
  html body #wrapwrap button.ww-cgu__yes { width: 100%; }
  html body #wrapwrap a.ww-cgu__no { justify-content: center; }
}
/* notification « Conditions acceptees le … » (retour de l'action serveur, ?cgu=ok) */
#wrapwrap .ww-cgu-toast { position: fixed; right: 24px; bottom: 24px; z-index: 1085; display: flex; align-items: center; gap: 10px; max-width: calc(100% - 48px); padding: 14px 18px; border-radius: 10px; background: var(--ink-900, #141414); color: #fff; font-size: 14px; font-weight: 500; box-shadow: var(--shadow-l, 0 24px 64px rgba(20, 20, 20, .24)); }
#wrapwrap .ww-cgu-toast::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 5px; background: var(--green-500, #00E6B0); }
@media (max-width: 760px) { #wrapwrap .ww-cgu-toast { left: 16px; right: 16px; bottom: 16px; max-width: none; } }
/* demande d'acces : 2e case (conditions) et lien de lecture aligne sur le libelle (case 18 px + ecart 10 px) */
html body #wrapwrap .ww-acc .ww-check + .ww-check { margin-top: 12px !important; }
html body #wrapwrap .ww-acc a.ww-cgu-read { display: inline-flex; align-items: center; min-height: 32px; margin: 2px 0 0 28px; font-size: 13px !important; font-weight: 700 !important; color: var(--ink-900, #141414) !important; text-decoration: none !important; }
html body #wrapwrap .ww-acc a.ww-cgu-read:hover { text-decoration: underline !important; text-underline-offset: 3px; }
/* mention de bas de page : derniere ligne du contenu, discrete */
html body #wrapwrap p.ww-mention { max-width: 760px; margin: 24px auto 0 !important; padding: 0 16px 24px !important; font-family: var(--font-sans, Heebo, sans-serif) !important; font-size: 12px !important; line-height: 1.6 !important; text-align: center; text-wrap: balance; color: var(--ink-400, #9A9A98) !important; }
html body #wrapwrap p.ww-mention a { color: inherit !important; text-decoration: underline !important; text-decoration-thickness: 1px; text-underline-offset: 3px; }
html body #wrapwrap p.ww-mention a:hover { color: var(--ink-900, #141414) !important; }


/* ===== account.css ===== */

/* ===== Compte et entreprise /my/account (handoff compte-v1.0, 30/09) : racine .ww-account ===== */
#wrapwrap .ww-account .ac-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
html body #wrapwrap .ww-account a.ac-logout { flex: none; }
#wrapwrap .ww-account .ac-i { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-account .ac-tabs { display: flex; gap: 4px; margin-bottom: 20px; border-bottom: 1px solid var(--border-1); overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-account .ac-tabs::-webkit-scrollbar { display: none; }
html body #wrapwrap .ww-account button.ac-tab { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 48px; margin: 0 0 -1px; padding: 0 14px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; font-family: var(--font-sans); font-size: 15px; font-weight: 500; color: var(--text-2); cursor: pointer; }
html body #wrapwrap .ww-account button.ac-tab[aria-selected="true"] { border-bottom-color: var(--ink-900); color: var(--ink-900); font-weight: 700; }
#wrapwrap .ww-account .ac-tab small { font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-account .ac-pane[hidden] { display: none !important; }
#wrapwrap .ww-account .ac-cols { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
#wrapwrap .ww-account .ac-side { display: grid; gap: 16px; min-width: 0; }
#wrapwrap .ww-account .ac-card { padding: 22px 24px; min-width: 0; }
#wrapwrap .ww-account .ac-card--muted { background: var(--ink-50); box-shadow: none; border: 1px solid var(--border-1); }
#wrapwrap .ww-account .ac-card--flush { padding: 0; overflow: hidden; }
html body #wrapwrap .ww-account .ac-h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 18px !important; font-weight: 700 !important; letter-spacing: 0 !important; line-height: 1.3 !important; color: var(--ink-900) !important; }
html body #wrapwrap .ww-account .ac-h3 { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 16px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-account .ac-k { color: var(--green-700); }
html body #wrapwrap .ww-account p.ac-p { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-account .ac-pre { white-space: pre-line; }
#wrapwrap .ww-account .ac-sep, #wrapwrap .ww-account .ac-sep-a { margin-top: 14px !important; padding-top: 14px; border-top: 1px solid var(--border-1); display: block; }
html body #wrapwrap .ww-account a.ac-sep-a { display: inline-flex; border-top: 0; padding-top: 0; }
/* formulaire */
#wrapwrap .ww-account .ac-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
#wrapwrap .ww-account .ac-f { display: grid; gap: 6px; margin: 0; min-width: 0; }
#wrapwrap .ww-account .ac-f--full { grid-column: 1 / -1; }
#wrapwrap .ww-account .ac-f__l { font-size: 14px; font-weight: 700; color: var(--ink-900); }
html body #wrapwrap .ww-account .ac-in { width: 100%; height: 44px; margin: 0; padding: 0 12px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; font-family: var(--font-sans); font-size: 15px; color: var(--ink-900); box-shadow: none; }
/* listes deroulantes : meme dessin que les champs (apparence native neutralisee, chevron) — 05/10 */
html body #wrapwrap .ww-account select.ac-in { -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 42px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23141414' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 16px 16px; cursor: pointer; }
html body #wrapwrap .ww-account select.ac-in:disabled { background-color: var(--surface-sunken, #F4F4F2); cursor: default; }
html body #wrapwrap .ww-account .ac-in--mono { font-family: var(--font-mono); font-size: 14px; }
html body #wrapwrap .ww-account .ac-in:focus { outline: none; border-color: var(--ink-900); box-shadow: 0 0 0 3px var(--point-halo); }
html body #wrapwrap .ww-account .ac-in[readonly], html body #wrapwrap .ww-account .ac-in:disabled { background: var(--ink-50); color: var(--text-2); cursor: default; }
#wrapwrap .ww-account .ac-ro { display: flex; align-items: center; height: 44px; padding: 0 12px; border: 1px solid var(--border-1); border-radius: 8px; background: var(--ink-50); font-size: 15px; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-account .ac-f__h { font-size: 13px; color: var(--text-3); }
#wrapwrap .ww-account .ac-foot { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
html body #wrapwrap .ww-account p.ac-note { margin: 18px 0 0 !important; padding: 12px 14px; border-radius: 8px; background: var(--ink-50); font-size: 14px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
/* entreprise ; remise = pastille jaune PRO (handoff : « jaune = donnee qui chiffre le pro ») */
#wrapwrap .ww-account .ac-rem { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
#wrapwrap .ww-account .ac-pill { flex: none; display: inline-flex; align-items: baseline; padding: 6px 12px; border-radius: 8px; background: #ECF22E; font-size: 28px; font-weight: 600; line-height: 1; color: var(--ink-900); }
#wrapwrap .ww-account .ac-pill small { margin-left: 2px; font-size: 16px; }
#wrapwrap .ww-account .ac-co { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
#wrapwrap .ww-account .ac-co__id { display: flex; align-items: center; gap: 14px; min-width: 0; }
#wrapwrap .ww-account img.ac-logo { flex: none; width: 48px; height: 48px; padding: 4px; border-radius: 50%; background: #fff; object-fit: contain; box-shadow: 0 0 0 1px var(--border-1); }   /* pastille comme la barre laterale */
#wrapwrap .ww-account .ac-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; margin-top: 12px; }
#wrapwrap .ww-account .ac-spec { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--border-1); font-size: 14px; min-width: 0; }
#wrapwrap .ww-account .ac-spec span { flex: none; color: var(--text-2); }
#wrapwrap .ww-account .ac-spec b { font-weight: 700; color: var(--ink-900); text-align: right; overflow-wrap: anywhere; }
#wrapwrap .ww-account .ac-spec i { font-style: normal; color: var(--text-3); }
#wrapwrap .ww-account .ac-alert { display: flex; gap: 12px; margin-top: 18px; padding: 14px 16px; border-radius: 10px; background: #E6F0FF; color: #1D4ED8; }
#wrapwrap .ww-account .ac-alert b { display: block; font-size: 14px; color: var(--ink-900); }
html body #wrapwrap .ww-account .ac-alert p { margin: 2px 0 0 !important; font-size: 14px !important; line-height: 1.5 !important; color: var(--ink-800) !important; }
/* utilisateurs */
#wrapwrap .ww-account .ac-uhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 22px 24px 18px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-account .ac-uhead p.ac-p { max-width: 460px; }
#wrapwrap .ww-account .ac-users { margin: 0; padding: 0; list-style: none; }
#wrapwrap .ww-account .ac-user { display: grid; grid-template-columns: 40px minmax(0, 1.6fr) minmax(0, 1.4fr) 170px; gap: 16px; align-items: center; padding: 14px 24px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-account .ac-user:last-child { border-bottom: 0; }
#wrapwrap .ww-account .ac-av { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--ink-100); font-size: 12px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-account .ac-user__who { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-account .ac-user__who b { font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-account .ac-user__who b small { font-size: 13px; font-weight: 400; color: var(--text-3); }
#wrapwrap .ww-account .ac-user__who > small { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-account .ac-user__mail { font-size: 14px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-account .ac-toast { position: fixed; right: 24px; bottom: 24px; z-index: 1085; display: flex; align-items: center; gap: 10px; max-width: calc(100% - 48px); padding: 14px 18px; border-radius: 10px; background: var(--ink-900); color: #fff; font-size: 14px; font-weight: 500; box-shadow: var(--shadow-l); }
#wrapwrap .ww-account .ac-toast[hidden] { display: none !important; }
#wrapwrap .ww-account .ac-toast .ac-i { color: var(--green-500); }
#wrapwrap .ww-account .ac-toast.is-err .ac-i { color: #FF8A00; }
@media (max-width: 1180px) { #wrapwrap .ww-account .ac-cols { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  html body #wrapwrap .ww-account a.ac-logout { display: none; }   /* deconnexion : dans le tiroir de navigation */
  #wrapwrap .ww-account .ac-card { padding: 18px 16px; }
  #wrapwrap .ww-account .ac-card--flush { padding: 0; }
  #wrapwrap .ww-account .ac-grid2, #wrapwrap .ww-account .ac-specs { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-account .ac-foot .dash-btn { flex: 1 1 auto; justify-content: center; }
  #wrapwrap .ww-account .ac-uhead { padding: 18px 16px 16px; }
  #wrapwrap .ww-account .ac-uhead .dash-btn { width: 100%; justify-content: center; }
  #wrapwrap .ww-account .ac-user { grid-template-columns: 36px minmax(0, 1fr); gap: 4px 12px; align-items: start; padding: 14px 16px; }
  #wrapwrap .ww-account .ac-user > * { grid-column: 2; }
  #wrapwrap .ww-account .ac-user .ac-av { grid-column: 1; grid-row: 1 / span 3; }
  #wrapwrap .ww-account .ac-toast { left: 16px; right: 16px; bottom: 16px; max-width: none; }
}


/* ===== messages.css ===== */

/* ===== Vos echanges /my/messages (handoff echanges-v1.0, 30/09) : racine .ww-msgs ===== */
#wrapwrap .ww-msgs .ms-i { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-msgs .ms-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
#wrapwrap .ww-msgs .ms-grid { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 16px; align-items: start; }
/* liste des fils */
#wrapwrap .ww-msgs .ms-list { display: grid; gap: 8px; min-width: 0; }
html body #wrapwrap .ww-msgs a.ms-item { display: grid; gap: 4px; min-width: 0; padding: 16px 18px; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); color: var(--ink-900) !important; text-decoration: none !important; border-left: 3px solid transparent; }
html body #wrapwrap .ww-msgs a.ms-item:hover { box-shadow: var(--shadow-m); }
html body #wrapwrap .ww-msgs a.ms-item.is-on { border-left-color: var(--green-500); }
#wrapwrap .ww-msgs .ms-item[hidden] { display: none !important; }
#wrapwrap .ww-msgs .ms-item__top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; min-width: 0; }
#wrapwrap .ww-msgs .ms-item__t { font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-msgs .ms-item__h { flex: none; font-family: var(--font-mono); font-size: 11px; color: var(--text-3); }
#wrapwrap .ww-msgs .ms-item__who { font-size: 13px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-msgs .ms-item__last { display: flex; align-items: center; gap: 10px; min-width: 0; margin-top: 4px; }
#wrapwrap .ww-msgs .ms-item__txt { flex: 1 1 auto; min-width: 0; font-size: 14px; color: var(--ink-800); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-msgs .has-new .ms-item__txt { font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-msgs .ms-item__n { flex: none; min-width: 26px; padding: 2px 8px; border-radius: 999px; background: var(--green-500); font-family: var(--font-mono); font-size: 11px; font-weight: 600; text-align: center; color: var(--ink-900); }
html body #wrapwrap .ww-msgs a.ms-more { justify-self: center; padding: 10px 14px; font-size: 14px; font-weight: 700; color: var(--ink-900) !important; text-decoration: underline !important; text-underline-offset: 3px; }
#wrapwrap .ww-msgs .ms-empty { padding: 18px; font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-msgs .ms-empty b { display: block; font-size: 15px; color: var(--ink-900); }
#wrapwrap .ww-msgs .ms-search { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 12px; border: 1px solid var(--border-2, #C4C4C1); border-radius: 8px; background: #fff; color: var(--text-3); }
html body #wrapwrap .ww-msgs .ms-search input { flex: 1 1 auto; min-width: 0; height: 40px; margin: 0; padding: 0; border: 0 !important; background: transparent; font-family: var(--font-sans); font-size: 15px; color: var(--ink-900); box-shadow: none !important; outline: none; }
/* nouvel echange */
#wrapwrap .ww-msgs .ms-new { position: relative; }
/* nouveau sujet = piste CRM (Charles 10/10) : panneau a la place du fil ; memes champs que la zone de reponse d'Odoo */
#wrapwrap .ww-msgs.is-new .ms-thread:not(.ms-compose) { display: none; }
html body #wrapwrap .ww-msgs.is-new a.ms-item.is-on { border-left-color: transparent; }
html body #wrapwrap .ww-msgs .wwc input.ms-subject { flex: 1 0 100%; width: 100%; height: 48px; margin: 0; padding: 0 14px; border: 1px solid var(--border-1) !important; border-radius: 10px !important;
  background: #fff !important; box-shadow: none !important; font-family: var(--font-sans) !important; font-size: var(--wwc-fs) !important; font-weight: 700 !important; color: var(--ink-900) !important; }
html body #wrapwrap .ww-msgs .wwc input.ms-subject::placeholder { color: var(--text-3); font-weight: 400; opacity: 1; }
html body #wrapwrap .ww-msgs .wwc input.ms-subject:focus { outline: none !important; border-color: var(--ink-900) !important; box-shadow: 0 0 0 3px rgba(0, 230, 176, .28) !important; }
html body #wrapwrap .ww-msgs label.ms-filebtn { position: relative; overflow: hidden; cursor: pointer; }
#wrapwrap .ww-msgs input.ms-file { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
html body #wrapwrap .ww-msgs label.ms-filebtn:has(:focus-visible) { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap .ww-msgs .ms-files { order: 3; flex: 1 0 100%; font-size: 13px; color: var(--text-2); overflow-wrap: anywhere; }
#wrapwrap .ww-msgs .ms-files:empty { display: none; }
html body #wrapwrap .ww-msgs p.ms-err { flex: 1 0 100%; margin: 0; padding: 10px 14px; border-radius: 8px; background: var(--red-100); color: var(--red-600) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.45 !important; }
#wrapwrap .ww-msgs .ms-or { display: grid; gap: 12px; justify-items: start; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border-1); }
html body #wrapwrap .ww-msgs .ms-or p { margin: 0; font-size: 14px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
html body #wrapwrap .ww-msgs .wwc .o_portal_chatter_composer_btn[disabled] { opacity: .45 !important; cursor: not-allowed; }
#wrapwrap .ww-msgs .ms-or .ms-pick { left: 0; right: auto; }
#wrapwrap .ww-msgs .ms-thread { scroll-margin-top: 16px; }
html body #wrapwrap .ww-msgs p.ms-pick__none { display: grid; gap: 12px; justify-items: start; margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-2); }
html body #wrapwrap .ww-msgs .ms-new > summary { list-style: none; cursor: pointer; }
#wrapwrap .ww-msgs .ms-new > summary::-webkit-details-marker { display: none; }
#wrapwrap .ww-msgs .ms-pick { position: absolute; right: 0; top: calc(100% + 8px); z-index: 40; display: grid; gap: 10px; width: min(420px, calc(100vw - 32px)); padding: 16px; border: 1px solid var(--border-1); border-radius: 12px; background: #fff; box-shadow: var(--shadow-l); }
html body #wrapwrap .ww-msgs p.ms-pick__h { margin: 0 !important; font-size: 14px !important; line-height: 1.45 !important; color: var(--text-2) !important; }
#wrapwrap .ww-msgs .ms-pick__l { display: grid; max-height: 340px; overflow-y: auto; }
#wrapwrap .ww-msgs .ms-pick__k { padding: 10px 4px 4px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--green-700); }
html body #wrapwrap .ww-msgs a.ms-pick__a { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; padding: 8px; border-radius: 8px; font-size: 14px; color: var(--ink-900) !important; text-decoration: none !important; }
html body #wrapwrap .ww-msgs a.ms-pick__a:hover { background: var(--ink-50); }
#wrapwrap .ww-msgs .ms-pick__a[hidden] { display: none !important; }
#wrapwrap .ww-msgs .ms-pick__a .ms-i { color: var(--text-3); }
/* fil ouvert */
#wrapwrap .ww-msgs .ms-thread { padding: 0; min-width: 0; min-height: 560px; overflow: hidden; }
#wrapwrap .ww-msgs .ms-back { display: none; }
#wrapwrap .ww-msgs .ms-thread__h { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 24px; border-bottom: 1px solid var(--border-1); }
html body #wrapwrap .ww-msgs .ms-thread__t { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--ink-900) !important; overflow-wrap: anywhere; }
html body #wrapwrap .ww-msgs p.ms-thread__who { margin: 4px 0 0 !important; font-size: 14px !important; color: var(--text-2) !important; }
#wrapwrap .ww-msgs .ms-thread__b { padding: 8px 24px 20px; }
/* bulles : les miens a droite (blanc + filet), ceux d'idreva a gauche (gris) */
#wrapwrap .ww-msgs .wwc .wwc-msg { max-width: 78%; }
#wrapwrap .ww-msgs .wwc .wwc-msg--me { margin-left: auto; flex-direction: row-reverse; text-align: left; }
html body #wrapwrap .ww-msgs .wwc .wwc-msg__b { padding: 12px 16px; border-radius: 12px; background: var(--ink-50); color: var(--ink-900) !important; }
html body #wrapwrap .ww-msgs .wwc .wwc-msg__b p { color: var(--ink-900) !important; margin: 0 !important; }
#wrapwrap .ww-msgs .wwc .wwc-msg--me .wwc-msg__b { background: #fff; border: 1px solid var(--border-1); }
#wrapwrap .ww-msgs .wwc .wwc-msg--me .wwc-msg__h { justify-content: flex-end; }
#wrapwrap .ww-msgs .wwc .wwc-msg--me .wwc-msg__att { justify-content: flex-end; }
html body #wrapwrap .ww-msgs p.ms-login { margin: 40px 0 !important; text-align: center; }
@media (max-width: 1099px) {
  #wrapwrap .ww-msgs .ms-grid { grid-template-columns: minmax(0, 1fr); }
  /* deux vues : liste (defaut) ou fil (?fil=) */
  #wrapwrap .ww-msgs:not(.has-fil) .ms-thread { display: none; }
  #wrapwrap .ww-msgs.is-new .ms-head, #wrapwrap .ww-msgs.is-new .ms-list { display: none; }
  #wrapwrap .ww-msgs.is-new .ms-thread.ms-compose { display: block; }
  #wrapwrap .ww-msgs.has-fil .ms-head, #wrapwrap .ww-msgs.has-fil .ms-list { display: none; }
  html body #wrapwrap .ww-msgs a.ms-back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px 0; font-size: 14px; font-weight: 700; color: var(--ink-900) !important; text-decoration: none !important; }
  #wrapwrap .ww-msgs .ms-thread { min-height: 0; }
  #wrapwrap .ww-msgs .ms-thread__h { padding: 12px 16px 16px; flex-wrap: wrap; }
  #wrapwrap .ww-msgs .ms-thread__b { padding: 4px 16px 16px; }
  #wrapwrap .ww-msgs .wwc .wwc-msg { max-width: 92%; }
  #wrapwrap .ww-msgs .ms-new { width: 100%; }
  #wrapwrap .ww-msgs .ms-pick { left: 0; right: auto; width: 100%; }
  /* composeur colle en bas du fil sur telephone */
  #wrapwrap .ww-msgs.has-fil .o_portal_chatter_composer { position: sticky; bottom: 0; z-index: 5; padding: 12px 0 calc(12px + env(safe-area-inset-bottom)); background: #fff; }
  #wrapwrap .ww-msgs.has-fil .wwc-hint { display: none; }
}


/* ===== gamme.css ===== */
/* ===== gamme.css — pages gamme publiques (handoff gamme-v1.2, pilote Trappes) : racine .ww-gamme, classes gm-* ===== */
#wrapwrap .ww-gamme { --halo:rgba(0,230,176,.28); --shadow-accent:0 6px 16px -6px rgba(0,230,176,.55); --shadow-m:0 12px 32px -12px rgba(20,20,20,.25),0 1px 3px rgba(20,20,20,.08); --air:128px; --gutter:24px }
#wrapwrap .ww-gamme .gm-wrap { max-width:1248px; margin:0 auto; padding:0 var(--gutter) }   /* = barre publique (audit 01/10) */
#wrapwrap .ww-gamme .gm-mono { font-family:var(--font-mono) !important }
#wrapwrap .ww-gamme .gm-eyebrow { white-space:nowrap; font-family:var(--font-mono) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:.12em !important; text-transform:uppercase; color:var(--green-700) !important }
#wrapwrap .ww-gamme .gm-eyebrow--ink { color:var(--text-3) !important }
#wrapwrap .ww-gamme .gm-h1 { font-size:56px !important; font-weight:900 !important; letter-spacing:-.035em !important; line-height:1 !important; text-wrap:pretty }
#wrapwrap .ww-gamme .gm-h2 { font-size:40px !important; font-weight:900 !important; letter-spacing:-.035em !important; line-height:1.05 !important; text-wrap:pretty }
#wrapwrap .ww-gamme .gm-h3 { font-size:20px !important; font-weight:700 !important; letter-spacing:-.01em !important; line-height:1.25 !important }
#wrapwrap .ww-gamme .gm-lede { font-size:18px !important; color:var(--text-2) !important; text-wrap:pretty }
#wrapwrap .ww-gamme .gm-dot { color:var(--green-500) !important }
#wrapwrap .ww-gamme .gm-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:48px; padding:0 20px; border:1px solid transparent; border-radius:8px; font-size:15px !important; font-weight:700 !important; text-decoration:none !important; cursor:pointer; white-space:nowrap; transition:background .15s ease-out,border-color .15s ease-out,transform .1s }
#wrapwrap .ww-gamme .gm-btn:active { transform:translateY(1px) }
#wrapwrap .ww-gamme .gm-btn--accent { background:var(--green-500); color:var(--ink-900) !important; box-shadow:var(--shadow-accent) }
#wrapwrap .ww-gamme .gm-btn--accent:hover { background:var(--green-600) }
#wrapwrap .ww-gamme .gm-btn--secondary { background:#fff; color:var(--ink-900) !important; border-color:var(--ink-300) }
#wrapwrap .ww-gamme .gm-btn--secondary:hover { background:var(--ink-50); border-color:var(--ink-900) }
#wrapwrap .ww-gamme .gm-btn--ghost { background:transparent; color:var(--ink-900) !important }
#wrapwrap .ww-gamme .gm-btn--ghost:hover { background:var(--ink-50) }
#wrapwrap .ww-gamme .gm-btn--inverse { background:#fff; color:var(--ink-900) !important }
#wrapwrap .ww-gamme .gm-btn--inverse:hover { background:var(--ink-100) }
#wrapwrap .ww-gamme .gm-btn--sm { height:40px; padding:0 16px; font-size:14px !important }
#wrapwrap .ww-gamme .gm-btn:focus-visible { outline:none; box-shadow:0 0 0 2px #fff,0 0 0 4px var(--green-500) }
#wrapwrap .ww-gamme .gm-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap }
#wrapwrap .ww-gamme .gm-hero { padding:64px 0 var(--air) }
#wrapwrap .ww-gamme .gm-hero__grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:56px; align-items:center }
#wrapwrap .ww-gamme .gm-hero__txt { position:relative; display:grid; gap:20px; padding-left:44px }
#wrapwrap .ww-gamme .gm-hero__txt::before { content:""; position:absolute; left:5.5px; top:6px; width:12px; height:12px; border-radius:6px; background:var(--green-500); box-shadow:0 0 0 6px var(--halo) }
#wrapwrap .ww-gamme .gm-hero__txt::after { content:""; position:absolute; left:11px; top:24px; bottom:6px; border-left:1px solid var(--ink-900) }
#wrapwrap .ww-gamme .gm-hero__tags { display:flex; gap:6px; flex-wrap:wrap }
#wrapwrap .ww-gamme .gm-htag { white-space:nowrap; display:inline-flex; align-items:center; height:24px; padding:0 8px; border-radius:6px; background:var(--ink-900); color:#fff !important; font-family:var(--font-mono) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:.08em !important; text-transform:uppercase }
#wrapwrap .ww-gamme .gm-htag--line { background:transparent; color:var(--ink-700) !important; box-shadow:inset 0 0 0 1px var(--ink-300) }
#wrapwrap .ww-gamme .gm-pro { display:grid; grid-template-columns:minmax(232px,1fr) minmax(0,2.1fr) auto; gap:32px; align-items:center; margin-top:56px; padding:28px 32px; border-radius:12px; background:var(--surface-sunken); border:1px solid var(--border-1) }
#wrapwrap .ww-gamme .gm-pro__id { display:flex; flex-direction:column; align-items:flex-start; gap:10px }
#wrapwrap .ww-gamme .gm-pro__t { display:block; white-space:nowrap; font-size:20px !important; font-weight:900 !important; letter-spacing:-.025em !important; line-height:1.2 !important }
#wrapwrap .ww-gamme .gm-pro__t i { font-style:normal; color:var(--green-500) !important }
#wrapwrap .ww-gamme .gm-pro__price { display:inline-flex; align-items:center; gap:8px; height:28px; padding:0 10px; border-radius:8px; background:#fff; border:1px solid var(--border-1); font-family:var(--font-mono) !important; font-size:12px !important; color:var(--text-2) !important; white-space:nowrap }
#wrapwrap .ww-gamme .gm-pro__price b { font-weight:600 !important; color:var(--ink-900) !important; filter:blur(4px); user-select:none }
#wrapwrap .ww-gamme .gm-pro__price svg { width:14px; height:14px; color:var(--ink-500) !important }
#wrapwrap .ww-gamme .gm-pro__list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:0; padding:0 0 0 32px; list-style:none; border-left:1px solid var(--border-1) }
#wrapwrap .ww-gamme .gm-pro__list li { display:grid; gap:4px; align-content:start }
#wrapwrap .ww-gamme .gm-pro__list .gm-mono { font-size:11px !important; letter-spacing:.12em !important; color:var(--green-700) !important }
#wrapwrap .ww-gamme .gm-pro__list b { font-size:15px !important; line-height:1.3 !important }
#wrapwrap .ww-gamme .gm-pro__list li>span:last-child { font-size:13px !important; line-height:1.45 !important; color:var(--text-2) !important }
#wrapwrap .ww-gamme .gm-pro__go { display:grid; gap:10px; justify-items:center }
#wrapwrap .ww-gamme .gm-pro__go .gm-btn svg { transition:transform .15s ease-out }
#wrapwrap .ww-gamme .gm-pro__go .gm-btn:hover svg { transform:translateX(3px) }
#wrapwrap .ww-gamme .gm-pro__alt { font-size:14px !important; color:var(--text-2) !important; white-space:nowrap }
#wrapwrap .ww-gamme .gm-pro__alt a { font-weight:700 !important; color:var(--ink-900) !important }
@media (max-width:1180px) {
  #wrapwrap .ww-gamme .gm-pro { grid-template-columns:minmax(0,1fr) auto }
  #wrapwrap .ww-gamme .gm-pro__list { grid-column:1/-1; grid-row:2; padding:20px 0 0; border-left:0; border-top:1px solid var(--border-1) }
}
#wrapwrap .ww-gamme .gm-hero__cta { display:flex; gap:10px; flex-wrap:wrap; margin-top:8px }
#wrapwrap .ww-gamme .gm-hero__link { align-self:center; font-weight:700 !important; text-decoration:none !important; padding:0 6px; white-space:nowrap }
#wrapwrap .ww-gamme .gm-hero__facts { display:grid; grid-template-columns:repeat(3,auto); gap:32px; margin-top:16px; padding-top:24px; border-top:1px solid var(--border-1); justify-content:start }
#wrapwrap .ww-gamme .gm-fact b { display:block; font-family:var(--font-mono) !important; font-size:26px !important; font-weight:600 !important; letter-spacing:-.02em !important; line-height:1 !important }
#wrapwrap .ww-gamme .gm-fact span { display:block; font-size:13px !important; color:var(--text-2) !important; margin-top:6px }
#wrapwrap .ww-gamme .gm-u { position:relative; padding:0 0 28px }
#wrapwrap .ww-gamme .gm-u__frame { position:absolute; inset:36px 0 0; border:1px solid var(--ink-900); border-top:0; border-radius:0 0 14px 14px; pointer-events:none }
#wrapwrap .ww-gamme .gm-u__pt { position:absolute; left:50%; bottom:-6px; width:12px; height:12px; border-radius:6px; background:var(--green-500); box-shadow:0 0 0 6px var(--halo); transform:translateX(-50%) }
#wrapwrap .ww-gamme .gm-photo { position:relative; background:var(--ink-800); border-radius:12px; overflow:hidden; aspect-ratio:4/3; margin:0 28px }
#wrapwrap .ww-gamme .gm-photo img { width:100%; height:100%; object-fit:cover }
#wrapwrap .ww-gamme .gm-photo__ph { position:absolute; left:12px; bottom:12px; right:auto; max-width:calc(100% - 24px); display:inline-flex; align-items:center; min-height:26px; padding:4px 10px; box-sizing:border-box; border-radius:8px; background:var(--ink-900); color:#fff !important; font-family:var(--font-mono) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:.08em !important; text-transform:uppercase; line-height:1.35 !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
#wrapwrap .ww-gamme .gm-photo--sq { aspect-ratio:1 }
#wrapwrap .ww-gamme .gm-photo--wide { aspect-ratio:16/10 }
#wrapwrap .ww-gamme .gm-photo--flush { margin:0 }
#wrapwrap .ww-gamme .gm-sec { padding:var(--air) 0 }
#wrapwrap .ww-gamme .gm-sec--ink { background:var(--ink-900); color:#fff !important }
#wrapwrap .ww-gamme .gm-sec--sunken { background:var(--surface-sunken) }
#wrapwrap .ww-gamme .gm-sec--ink .gm-lede, #wrapwrap .ww-gamme .gm-sec--ink .gm-fact span { color:var(--ink-300) !important }
#wrapwrap .ww-gamme .gm-sec--ink .gm-eyebrow { color:var(--green-500) !important }
#wrapwrap .ww-gamme .gm-head { display:grid; grid-template-columns:24px minmax(0,1fr); gap:0 20px; margin-bottom:48px; max-width:820px }
#wrapwrap .ww-gamme .gm-rep { position:relative }
#wrapwrap .ww-gamme .gm-rep::before { content:""; position:absolute; left:11px; top:6px; bottom:0; width:1.5px; background:var(--ink-900) }
#wrapwrap .ww-gamme .gm-rep::after { content:""; position:absolute; left:6px; top:0; width:12px; height:12px; border-radius:6px; background:var(--green-500) }
#wrapwrap .ww-gamme .gm-sec--ink .gm-rep::before { background:rgba(255,255,255,.55) }
#wrapwrap .ww-gamme .gm-head__num { display:flex; gap:10px; align-items:baseline; margin-bottom:14px; white-space:nowrap }
#wrapwrap .ww-gamme .gm-head__num .gm-eyebrow--ink { color:var(--text-3) !important }
#wrapwrap .ww-gamme .gm-sec--ink .gm-head__num .gm-eyebrow--ink { color:var(--ink-400) !important }
#wrapwrap .ww-gamme .gm-head .gm-lede { margin-top:16px; max-width:640px }
#wrapwrap .ww-gamme .gm-grid3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px }
#wrapwrap .ww-gamme .gm-card { background:#fff; border:1px solid var(--border-1); border-radius:12px; padding:24px; display:grid; gap:12px; align-content:start }
#wrapwrap .ww-gamme .gm-sec--ink .gm-card { background:var(--ink-800); border-color:transparent; color:#fff !important }
#wrapwrap .ww-gamme .gm-card .gm-photo { margin:0 0 6px }
#wrapwrap .ww-gamme .gm-card p { color:var(--text-2) !important; font-size:15px !important }
#wrapwrap .ww-gamme .gm-sec--ink .gm-card p { color:var(--ink-300) !important }
#wrapwrap .ww-gamme .gm-tag { display:inline-flex; align-items:center; height:24px; padding:0 10px; border-radius:12px; border:1px solid var(--ink-300); font-size:12px !important; font-weight:500 !important; color:var(--ink-700) !important; white-space:nowrap }
#wrapwrap .ww-gamme .gm-tag--mono { font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.04em !important }
#wrapwrap .ww-gamme .gm-why { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px }
#wrapwrap .ww-gamme .gm-why__item { display:grid; gap:12px; padding:28px 24px; border-radius:12px; background:var(--ink-800) }
#wrapwrap .ww-gamme .gm-why__q { font-size:22px !important; font-weight:900 !important; letter-spacing:-.03em !important; line-height:1.1 !important }
#wrapwrap .ww-gamme .gm-why__q small { display:block; font-family:var(--font-mono) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:.12em !important; text-transform:uppercase; color:var(--ink-400) !important; margin-bottom:10px }
#wrapwrap .ww-gamme .gm-why__a { color:var(--ink-300) !important; font-size:15px !important }
#wrapwrap .ww-gamme .gm-why__proof { margin-top:6px; padding-top:14px; border-top:1px solid rgba(255,255,255,.14); display:flex; gap:10px; align-items:baseline }
#wrapwrap .ww-gamme .gm-why__proof b { font-family:var(--font-mono) !important; font-size:24px !important; font-weight:600 !important; letter-spacing:-.02em !important; color:#fff !important }
#wrapwrap .ww-gamme .gm-why__proof span { font-size:13px !important; color:var(--ink-300) !important }
#wrapwrap .ww-gamme .gm-anat { margin-top:48px; display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:48px; align-items:center }
#wrapwrap .ww-gamme .gm-anat__list { display:grid; gap:0; counter-reset:a }
#wrapwrap .ww-gamme .gm-anat__row { display:grid; grid-template-columns:40px 1fr; gap:16px; padding:18px 0; border-top:1px solid rgba(255,255,255,.14) }
#wrapwrap .ww-gamme .gm-anat__row:last-child { border-bottom:1px solid rgba(255,255,255,.14) }
#wrapwrap .ww-gamme .gm-anat__row i { font-style:normal; font-family:var(--font-mono) !important; font-size:12px !important; color:var(--ink-400) !important; padding-top:3px }
#wrapwrap .ww-gamme .gm-anat__row b { display:block; font-size:16px !important }
#wrapwrap .ww-gamme .gm-anat__row span { display:block; font-size:14px !important; color:var(--ink-300) !important; margin-top:2px }
#wrapwrap .ww-gamme .gm-anat__photos { display:grid; grid-template-columns:1fr 1fr; gap:12px }
#wrapwrap .ww-gamme .gm-anat__photos .gm-photo { margin:0 }
#wrapwrap .ww-gamme .gm-anat__photos .gm-photo:first-child { grid-column:1/3 }
#wrapwrap .ww-gamme .gm-made { margin-top:40px; display:flex; gap:8px 24px; align-items:baseline; flex-wrap:wrap; font-size:15px !important; color:var(--ink-300) !important }
#wrapwrap .ww-gamme .gm-made span { white-space:nowrap }
@media (max-width:760px) {
  #wrapwrap .ww-gamme .gm-made span { white-space:normal }
}
#wrapwrap .ww-gamme .gm-made b { color:#fff !important }
#wrapwrap .ww-gamme .gm-range { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px }
#wrapwrap .ww-gamme .gm-range__card { display:grid; gap:0; background:#fff; border:1px solid var(--border-1); border-radius:12px; overflow:hidden; text-decoration:none !important; color:var(--ink-900) !important; transition:border-color .15s }
#wrapwrap .ww-gamme .gm-range__card:hover { border-color:var(--ink-900) }
#wrapwrap .ww-gamme .gm-range__card .gm-photo { border-radius:0; margin:0; aspect-ratio:4/3 }
#wrapwrap .ww-gamme .gm-range__body { padding:20px 22px 22px; display:grid; gap:8px }   /* regle du prototype perdue au portage (filtre « body »), retablie 01/10 */
#wrapwrap .ww-gamme .gm-range__meta { display:grid; gap:4px }
#wrapwrap .ww-gamme .gm-range__meta .gm-mono { font-size:12px !important; color:var(--text-3) !important; letter-spacing:.06em !important; text-transform:uppercase; order:-1 }
#wrapwrap .ww-gamme .gm-range__n { display:inline-flex; align-items:center; gap:6px; font-size:14px !important; font-weight:700 !important; margin-top:6px }
#wrapwrap .ww-gamme .gm-specs { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:24px; align-items:start }
#wrapwrap .ww-gamme .gm-spec { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 24px }
#wrapwrap .ww-gamme .gm-spec div { display:grid; gap:2px; padding:14px 0; border-bottom:1px solid var(--border-1) }
#wrapwrap .ww-gamme .gm-spec span { font-size:13px !important; color:var(--text-3) !important }
#wrapwrap .ww-gamme .gm-spec b { font-family:var(--font-mono) !important; font-size:15px !important; font-weight:600 !important }
#wrapwrap .ww-gamme .gm-docs { display:grid; gap:0 }
#wrapwrap .ww-gamme .gm-doc { display:grid; grid-template-columns:40px 1fr auto; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--border-1); text-decoration:none !important; color:var(--ink-900) !important }
#wrapwrap .ww-gamme .gm-doc:last-child { border-bottom:0 }
#wrapwrap .ww-gamme .gm-doc__ic { width:40px; height:40px; border-radius:8px; background:var(--ink-100); display:inline-flex; align-items:center; justify-content:center; color:var(--ink-700) !important }
#wrapwrap .ww-gamme .gm-doc b { display:block; font-size:15px !important }
#wrapwrap .ww-gamme .gm-doc small { display:block; font-size:12px !important; color:var(--text-3) !important; font-family:var(--font-mono) !important }
#wrapwrap .ww-gamme .gm-doc__act { font-size:13px !important; font-weight:700 !important; display:inline-flex; align-items:center; gap:6px; white-space:nowrap }
#wrapwrap .ww-gamme .gm-doc--locked .gm-doc__ic { background:var(--ink-50); color:var(--ink-500) !important }
#wrapwrap .ww-gamme .gm-doc--locked .gm-doc__act { color:var(--text-3) !important; font-weight:500 !important }
#wrapwrap .ww-gamme .gm-doc--locked .gm-doc__act .gm-lock { display:inline-flex; align-items:center; gap:5px; height:22px; padding:0 8px; border-radius:11px; background:var(--ink-100); font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.1em !important; text-transform:uppercase; color:var(--ink-700) !important }
#wrapwrap .ww-gamme .gm-docs__note a { color:var(--ink-900) !important; text-decoration:underline !important; text-decoration-color:var(--ink-300) !important; text-underline-offset:3px !important }
#wrapwrap .ww-gamme .gm-docs__note a:hover { text-decoration-color:var(--green-500) !important }
#wrapwrap .ww-gamme .gm-norm { display:grid; grid-template-columns:24px 1fr; gap:0 16px; padding:22px 24px; border-radius:12px; background:var(--ink-50) }
#wrapwrap .ww-gamme .gm-norm .gm-rep::before { top:4px; height:calc(100% - 4px) }
#wrapwrap .ww-gamme .gm-norm b { font-size:16px !important; display:block }
#wrapwrap .ww-gamme .gm-norm p { font-size:14px !important; color:var(--text-2) !important; margin-top:4px }
#wrapwrap .ww-gamme .gm-norm .gm-mono { font-size:12px !important; color:var(--text-3) !important; margin-top:10px }
#wrapwrap .ww-gamme .gm-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 }
#wrapwrap .ww-gamme .gm-step { position:relative; padding:0 24px 0 0; display:grid; grid-template-columns:24px 1fr; gap:0 16px }
#wrapwrap .ww-gamme .gm-step .gm-rep::before { background:var(--ink-900) }
#wrapwrap .ww-gamme .gm-step .gm-rep--off::after { background:#fff; border:1.5px solid var(--ink-300); width:9px; height:9px; left:7.5px; top:1.5px }
#wrapwrap .ww-gamme .gm-step .gm-rep--on::after { box-shadow:0 0 0 5px var(--halo) }
#wrapwrap .ww-gamme .gm-step__n { font-family:var(--font-mono) !important; font-size:12px !important; color:var(--text-3) !important }
#wrapwrap .ww-gamme .gm-step b { display:block; font-size:20px !important; font-weight:700 !important; letter-spacing:-.01em !important; margin:6px 0 8px; line-height:1.2 !important }
#wrapwrap .ww-gamme .gm-step p { font-size:15px !important; color:var(--text-2) !important }
#wrapwrap .ww-gamme .gm-step__t { display:inline-block; white-space:nowrap; margin-top:12px; font-family:var(--font-mono) !important; font-size:12px !important; color:var(--green-700) !important }
#wrapwrap .ww-gamme .gm-final { margin-top:56px; padding:40px; border-radius:12px; background:var(--ink-900); color:#fff !important; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:24px; align-items:center }
#wrapwrap .ww-gamme .gm-final .gm-h3 { font-size:26px !important; font-weight:900 !important; letter-spacing:-.03em !important }
#wrapwrap .ww-gamme .gm-final p { color:var(--ink-300) !important; margin-top:8px; font-size:15px !important }
#wrapwrap .ww-gamme .gm-final__cta { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end }
#wrapwrap .ww-gamme .gm-final .gm-btn--secondary { background:transparent; color:#fff !important; border-color:rgba(255,255,255,.4) }
#wrapwrap .ww-gamme .gm-final .gm-btn--secondary:hover { background:var(--ink-800); border-color:#fff }
#wrapwrap .ww-gamme.is-anim .gm-fade { opacity:0; transform:translateY(8px); transition:opacity .4s ease-out,transform .4s ease-out }
#wrapwrap .ww-gamme.is-anim .gm-fade.is-in { opacity:1; transform:none }
@media (prefers-reduced-motion:reduce) {
  #wrapwrap .ww-gamme.is-anim .gm-fade { opacity:1; transform:none; transition:none }
}
@media (max-width:760px) {
  #wrapwrap .ww-gamme .gm-hero__txt { padding-left:32px }
  #wrapwrap .ww-gamme .gm-hero__txt::before { left:0 }
  #wrapwrap .ww-gamme .gm-hero__txt::after { left:5.5px }
  #wrapwrap .ww-gamme .gm-pro { grid-template-columns:minmax(0,1fr); gap:20px; margin-top:40px; padding:22px 18px }
  #wrapwrap .ww-gamme .gm-pro__list { grid-template-columns:minmax(0,1fr); gap:14px }
  #wrapwrap .ww-gamme .gm-pro__go { justify-items:stretch }
  #wrapwrap .ww-gamme .gm-pro__go .gm-btn { width:100% }
  #wrapwrap .ww-gamme .gm-pro__alt { text-align:center }
}
@media (max-width:1100px) {
  /* (parite landing 01/10) plus de rythme 96 px en tablette : la landing garde 128 px jusqu'au mobile */
  #wrapwrap .ww-gamme .gm-h1 { font-size:46px !important }
  #wrapwrap .ww-gamme .gm-h2 { font-size:34px !important }
  #wrapwrap .ww-gamme .gm-hero__grid { gap:40px }
  #wrapwrap .ww-gamme .gm-why, #wrapwrap .ww-gamme .gm-range, #wrapwrap .ww-gamme .gm-grid3 { grid-template-columns:repeat(2,minmax(0,1fr)) }
  #wrapwrap .ww-gamme .gm-anat { grid-template-columns:1fr; gap:32px }
  #wrapwrap .ww-gamme .gm-specs { grid-template-columns:1fr }
  #wrapwrap .ww-gamme .gm-steps { grid-template-columns:1fr; gap:28px }
  #wrapwrap .ww-gamme .gm-step { padding-right:0 }
}
@media (max-width:760px) {
  #wrapwrap .ww-gamme { --air:72px; --gutter:16px }
  #wrapwrap .ww-gamme .gm-h1 { font-size:36px !important }
  #wrapwrap .ww-gamme .gm-h2 { font-size:30px !important }
  #wrapwrap .ww-gamme .gm-lede { font-size:16px !important }
  #wrapwrap .ww-gamme .gm-hero { padding:24px 0 var(--air) }
  #wrapwrap .ww-gamme .gm-hero__grid { grid-template-columns:1fr; gap:28px }
  #wrapwrap .ww-gamme .gm-hero__grid .gm-u { order:-1 }
  #wrapwrap .ww-gamme .gm-u__frame { inset:24px 0 0 }
  #wrapwrap .ww-gamme .gm-photo { margin:0 20px }
  #wrapwrap .ww-gamme .gm-hero__cta { display:grid; grid-template-columns:1fr }
  #wrapwrap .ww-gamme .gm-hero__cta .gm-btn { width:100% }
  #wrapwrap .ww-gamme .gm-hero__link { text-align:center; padding:10px 0 }
  #wrapwrap .ww-gamme .gm-hero__facts { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px }
  #wrapwrap .ww-gamme .gm-fact b { font-size:22px !important }
  #wrapwrap .ww-gamme .gm-fact span { font-size:12px !important }
  #wrapwrap .ww-gamme .gm-head { margin-bottom:32px; gap:0 14px }
  #wrapwrap .ww-gamme .gm-grid3, #wrapwrap .ww-gamme .gm-why, #wrapwrap .ww-gamme .gm-range { grid-template-columns:1fr; gap:16px }
  #wrapwrap .ww-gamme .gm-anat__photos { grid-template-columns:1fr 1fr }
  #wrapwrap .ww-gamme .gm-spec { grid-template-columns:1fr }
  #wrapwrap .ww-gamme .gm-doc { grid-template-columns:40px 1fr }
  #wrapwrap .ww-gamme .gm-doc__act { grid-column:2 }
  #wrapwrap .ww-gamme .gm-final { grid-template-columns:1fr; padding:28px 20px }
  #wrapwrap .ww-gamme .gm-final__cta { justify-content:stretch; display:grid }
}

/* ---- complements d'integration (gamme-v1.2 -> Odoo, 01/10) ---- */
#wrapwrap .ww-gamme { background: #fff; color: var(--ink-900); font-family: var(--font-sans); line-height: 1.55; }
#wrapwrap .ww-gamme .gm-i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-gamme .gm-i--16 { width: 16px; height: 16px; }
#wrapwrap .ww-gamme .gm-i--12 { width: 12px; height: 12px; }
#wrapwrap .ww-gamme img { display: block; max-width: 100%; }
#wrapwrap .ww-gamme h1, #wrapwrap .ww-gamme h2, #wrapwrap .ww-gamme h3, #wrapwrap .ww-gamme p, #wrapwrap .ww-gamme ol { margin: 0; }
/* section encre : le socle .ww force les titres en encre et les gras en « inherit » */
#wrapwrap .ww-gamme .gm-sec--ink h2, #wrapwrap .ww-gamme .gm-sec--ink h3, #wrapwrap .ww-gamme .gm-final .gm-h3 { color: #fff !important; }
#wrapwrap .ww-gamme .gm-hero__txt h1 { color: var(--ink-900) !important; }
/* liens : le theme et le socle imposent couleur et soulignement */
#wrapwrap .ww-gamme a.gm-btn, #wrapwrap .ww-gamme a.gm-range__card, #wrapwrap .ww-gamme a.gm-doc, #wrapwrap .ww-gamme a.gm-hero__link { text-decoration: none !important; }
#wrapwrap .ww-gamme a.gm-hero__link { color: var(--ink-900) !important; }
#wrapwrap .ww-gamme .gm-final a.gm-btn--secondary { color: #fff !important; }
#wrapwrap .ww-gamme .gm-pro__alt a, #wrapwrap .ww-gamme .gm-docs__note a { color: var(--ink-900) !important; text-decoration: underline !important; text-decoration-color: var(--ink-300) !important; text-underline-offset: 3px; }
/* etiquette dans une carte (grille) : pas etiree sur toute la largeur */
#wrapwrap .ww-gamme .gm-card .gm-tag { justify-self: start; }
/* note sous les documents (visiteur) : style present quel que soit l'etat (bug du prototype) */
#wrapwrap .ww-gamme .gm-docs__note { margin: 14px 0 0; font-size: 13px !important; color: var(--text-3) !important; line-height: 1.5 !important; }
#wrapwrap .ww-gamme .gm-doc--open .gm-doc__act { color: var(--ink-900) !important; font-weight: 700 !important; }
#wrapwrap .ww-gamme .gm-specs__side { display: grid; gap: 24px; }
#wrapwrap .ww-gamme .gm-anat__list { margin-top: 16px; }
#wrapwrap .ww-gamme .gm-norm b { margin-top: 8px; }
/* carte de sous-famille sans equipement (T2 a venir) : non cliquable */
#wrapwrap .ww-gamme .gm-range__card--soon { cursor: default; }
#wrapwrap .ww-gamme .gm-range__card--soon:hover { border-color: var(--border-1); }
#wrapwrap .ww-gamme .gm-range__n--soon { font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .06em !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-gamme .gm-range__body p { color: var(--text-2) !important; font-size: 15px !important; }
/* pas de texte pose sur une photo en mobile (regle du brief) */
@media (max-width: 760px) { #wrapwrap .ww-gamme .gm-photo__ph { display: none; } }

/* ---- alignement typographique sur la landing (Charles 01/10 : « les polices de la page Trappes utilisent les mêmes tailles que la landing ») ;
   valeurs mesurées sur la landing à 1440 et 390 px. Mobile : titres de section à 34 px (= H1 mobile de la landing), nos H2 étant longs (référencement). ---- */
#wrapwrap .ww-gamme .gm-h1 { font-size: 64px !important; line-height: .92 !important; letter-spacing: -.04em !important; }
#wrapwrap .ww-gamme .gm-h2 { font-size: 44px !important; line-height: 1 !important; letter-spacing: -.035em !important; }
#wrapwrap .ww-gamme .gm-h3, #wrapwrap .ww-gamme .gm-step b, #wrapwrap .ww-gamme .gm-why__q { font-size: 24px !important; font-weight: 900 !important; line-height: 1.15 !important; letter-spacing: -.025em !important; }
#wrapwrap .ww-gamme .gm-final .gm-h3 { font-size: 28px !important; line-height: 1.1 !important; }
#wrapwrap .ww-gamme .gm-hero .gm-lede { font-size: 17px !important; line-height: 1.5 !important; }
#wrapwrap .ww-gamme .gm-head .gm-lede { font-size: 17px !important; line-height: 1.55 !important; }
#wrapwrap .ww-gamme .gm-hero__txt .gm-eyebrow { font-size: 14px !important; font-weight: 500 !important; letter-spacing: .12em !important; }
#wrapwrap .ww-gamme .gm-btn { font-size: 16px !important; }
#wrapwrap .ww-gamme .gm-htag { font-weight: 600 !important; letter-spacing: .1em !important; }
#wrapwrap .ww-gamme .gm-fact b { font-size: 36px !important; }
/* (parite landing 01/10) H1 a 64 px jusqu'au mobile, comme la landing (plus de palier 48 px en tablette) */
@media (max-width: 760px) {
  #wrapwrap .ww-gamme .gm-h1 { font-size: 34px !important; }
  #wrapwrap .ww-gamme .gm-h2 { font-size: 34px !important; }
  #wrapwrap .ww-gamme .gm-h3, #wrapwrap .ww-gamme .gm-step b, #wrapwrap .ww-gamme .gm-why__q { font-size: 20px !important; }
  #wrapwrap .ww-gamme .gm-final .gm-h3 { font-size: 24px !important; }
  #wrapwrap .ww-gamme .gm-fact b { font-size: 26px !important; }
}

/* ---- audit UX du 01/10 (agent workwith-ux-design-auditor) ---- */
/* cibles tactiles >= 44 px en mobile (liens « Le demander », note des documents) */
@media (max-width: 760px) {
  #wrapwrap .ww-gamme .gm-pro__alt a, #wrapwrap .ww-gamme .gm-docs__note a { display: inline-flex; align-items: center; min-height: 44px; }
}
/* etiquettes mono : meme echelle que la landing (11 px, 600, +0,1 em) */
#wrapwrap .ww-gamme .gm-range__card .gm-mono, #wrapwrap .ww-gamme .gm-range__n--soon, #wrapwrap .ww-gamme .gm-lock { font-size: 11px !important; font-weight: 600 !important; letter-spacing: .1em !important; }
/* contraste AA du petit texte gris sur les fonds gris (4,2 -> 6,2 : 1) */
#wrapwrap .ww-gamme .gm-sec--sunken { --text-3: var(--ink-600); }
#wrapwrap .ww-gamme .gm-docs__acts a + a { margin-left: 16px; }   /* le « · » est retire : l'espace separe les deux liens */
@media (max-width: 760px) { #wrapwrap .ww-gamme .gm-docs__acts { display: flex; flex-wrap: wrap; gap: 0 16px; } #wrapwrap .ww-gamme .gm-docs__acts a + a { margin-left: 0; } }   /* liens de la note : 44 px sans casser l'interligne (audit 01/10) */

/* ===== Parité landing (Charles 01/10 : « les pages type trappe s'alignent exactement avec la landing ») =====
   Chaque style de texte de la page gamme = un style relevé sur la landing (script _parite_landing.js, agent workwith-parite-landing).
   FAQ : composant de la landing (faq.css) ; seul le fond reste « sunken » pour garder l'alternance des sections de la page. */
#wrapwrap .ww-gamme .ww-faq.gm-faq-sec { background: var(--surface-sunken); }
#wrapwrap .ww-gamme .gm-fact b { line-height: 1.55 !important; }                                   /* = « 48 h » (mono 36/600, interligne 1,55) */
#wrapwrap .ww-gamme .gm-photo__ph { letter-spacing: .12em !important; line-height: 1.4 !important; } /* = surtitre mono 11/500 +0,12 em */
#wrapwrap .ww-gamme .gm-final .gm-h3 { letter-spacing: -.035em !important; }                         /* = titre 28/900 −0,035 em */
#wrapwrap .ww-gamme .gm-pro__t { font-size: 24px !important; line-height: 1.15 !important; letter-spacing: -.025em !important; } /* = 24/900 */
#wrapwrap .ww-gamme .gm-pro__price b { font-weight: 400 !important; }                                /* = mono 12/400 */
#wrapwrap .ww-gamme .gm-pro__list b { font-size: 17px !important; line-height: 1.2 !important; letter-spacing: -.01em !important; } /* = « Chiffrer un équipement » 17/700 */
#wrapwrap .ww-gamme .gm-pro__list li>span:last-child { font-size: 14px !important; line-height: 1.5 !important; }              /* = texte 14/400 */
#wrapwrap .ww-gamme .gm-tag--mono { font-weight: 400 !important; }                                   /* = mono 11/400 +0,04 em */
#wrapwrap .ww-gamme .gm-why__q small { line-height: 1.4 !important; }                                /* = surtitre mono 11/500 */
#wrapwrap .ww-gamme .gm-why__proof b { font-size: 28px !important; line-height: 1.55 !important; }   /* = mono 28/600 */
#wrapwrap .ww-gamme .gm-spec b { font-size: 13px !important; font-weight: 500 !important; }          /* = valeurs mono 13/500 */
#wrapwrap .ww-gamme .gm-pro__t { line-height: 1 !important; }                                        /* = 24/900 interligne 1 (« Choisir ») */
#wrapwrap .ww-gamme .gm-btn { padding: 0 22px; }                                                   /* = bouton 48 px de la landing */
#wrapwrap .ww-gamme .gm-step__t { color: var(--text-3) !important; }                                /* = mono 12/400 #767676 */
#wrapwrap .ww-gamme .gm-sec--ink .gm-eyebrow { color: var(--ink-400) !important; font-weight: 400 !important; letter-spacing: .14em !important; } /* = « 01 — Notre métier » sur fond encre */
/* téléphone : la landing garde ses tailles ; seules réductions admises = celles de la landing (titre 36, question 19) */
@media (max-width: 760px) {
  #wrapwrap .ww-gamme .gm-h2 { font-size: 36px !important; }                                        /* = titre de FAQ landing en mobile */
  #wrapwrap .ww-gamme .gm-h3, #wrapwrap .ww-gamme .gm-step b, #wrapwrap .ww-gamme .gm-why__q { font-size: 19px !important; } /* = question de FAQ landing en mobile */
  #wrapwrap .ww-gamme .gm-final .gm-h3 { font-size: 28px !important; }                              /* = 28/900, gardé en mobile sur la landing */
  #wrapwrap .ww-gamme .gm-fact b { font-size: 28px !important; }                                    /* = mono 28/600 */
  #wrapwrap .ww-gamme .gm-fact span { font-size: 13px !important; }
}
#wrapwrap .ww-gamme .gm-doc__act { font-size: 14px !important; }                                   /* « Ouvrir → » = 14/700 (connecté) */
/* contrôle de parité du 01/10 (fiche workwith-parite-landing) */
#wrapwrap .ww-gamme .gm-head { grid-template-columns: minmax(0, 1fr); }      /* n°1 : surtitre + H2 au bord du contenu, comme la landing et la FAQ (était 24 px + 20 px) */
#wrapwrap .ww-gamme .gm-head > .gm-rep { display: none; }                   /*       le repère point + fil du handoff gamme n'existe pas sur la landing */
#wrapwrap .ww-gamme .ww-faq__title { margin: 14px 0 0 !important; }         /* n°2 : la remise à zéro des h2 de la page effaçait la marge du composant (faq.css) */
#wrapwrap .ww-gamme .gm-head .gm-lede { margin-top: 20px; }                 /* n°4 : 20 px sous le titre, comme la landing */
#wrapwrap .ww-gamme .gm-sec--sunken .gm-card { --text-3: var(--ink-500); }  /* n°5 : cartes blanches = gris normal de la landing (#767676, AA 4,54:1) */
/* ===== Gamme Échelles (handoff gamme-echelles-v1.0) : cartes famille avec sous-familles en liens + colonne « Bientôt au catalogue » — styles existants seulement ===== */
#wrapwrap .ww-gamme .gm-range__subs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
#wrapwrap .ww-gamme a.gm-tag { color: var(--ink-700) !important; text-decoration: none !important; transition: border-color .15s ease-out; }
#wrapwrap .ww-gamme a.gm-tag:hover { border-color: var(--ink-900); color: var(--ink-900) !important; }
#wrapwrap .ww-gamme .gm-range__card--fam:hover { border-color: var(--ink-900); }   /* carte entière cliquable (Charles 02/10) : même survol que les autres cartes de gamme */
#wrapwrap .ww-gamme .gm-range__card--fam .gm-hero__link { margin-top: 4px; }
#wrapwrap .ww-gamme .gm-range__soon { display: grid; gap: 24px; align-content: start; }
@media (max-width: 760px) { #wrapwrap .ww-gamme .gm-range__soon { gap: 16px; } }
/* contrôle de parité Gamme Échelles (agent workwith-parite-landing, 01/10) — corrige aussi Trappes (titres de cartes, chiffres clés) */
#wrapwrap .ww-gamme .gm-range__card, #wrapwrap .ww-gamme .gm-range__body { align-content: start; }   /* titres de cartes sur une même ligne (la grille étirait ses lignes) */
#wrapwrap .ww-gamme .gm-range__card--fam a.gm-hero__link { justify-self: start; padding-left: 0; padding-right: 0; text-align: left; text-decoration: underline !important; text-decoration-thickness: 1px !important; text-decoration-color: var(--ink-300) !important; text-underline-offset: 3px !important; }   /* = lien fléché de la landing */
#wrapwrap .ww-gamme .gm-range__card--fam a.gm-hero__link:hover { text-decoration-color: var(--green-600) !important; }
@media (min-width: 1101px) { #wrapwrap .ww-gamme .gm-steps { row-gap: 40px; } }   /* 6 étapes visiteur : deux rangées séparées de 40 px (maquette) */
@media (min-width: 761px) and (max-width: 1100px) { #wrapwrap .ww-gamme .gm-range__soon { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); } }   /* TK50 / TR70 côte à côte en tablette */
@media (max-width: 1100px) { #wrapwrap .ww-gamme .gm-fact b { font-size: 28px !important; white-space: nowrap; } #wrapwrap .ww-gamme .gm-hero__facts { column-gap: 24px; } }   /* chiffres clés sur une ligne = mono 28/600 */
@media (max-width: 760px) {
  #wrapwrap .ww-gamme a.gm-tag { position: relative; }
  #wrapwrap .ww-gamme a.gm-tag::before { content: ""; position: absolute; inset: -10px 0; }   /* pastille 24 px, cible tactile 44 px */
  #wrapwrap .ww-gamme .gm-range__subs { gap: 20px 8px; }
  #wrapwrap .ww-gamme a.gm-range__n { min-height: 44px; }
  #wrapwrap .ww-gamme .gm-hero__facts { grid-template-columns: repeat(3, auto); justify-content: space-between; column-gap: 8px; }
}
/* ===== Page famille (Échelles eau potable ACS, handoff echelle-acs-v1.0) : mises en page seulement, aucun nouveau style de texte ===== */
#wrapwrap .ww-gamme .gm-crumb { margin-bottom: 14px; flex-wrap: wrap; }
#wrapwrap .ww-gamme .gm-crumb a.gm-eyebrow { color: var(--text-3) !important; text-decoration: none !important; }
#wrapwrap .ww-gamme .gm-crumb a.gm-eyebrow:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-gamme .gm-grid3--4 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
#wrapwrap .ww-gamme .gm-fam2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px; }   /* 1/3 sur mesure | 2/3 sous-familles étirées (maquette) */
#wrapwrap .ww-gamme .gm-fam2__sub { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
#wrapwrap .ww-gamme .gm-steps--col { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
@media (max-width: 1100px) {
  #wrapwrap .ww-gamme .gm-fam2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }   /* sur mesure | 4 sous-familles empilées : jamais une photo plein écran */
  #wrapwrap .ww-gamme .gm-fam2__sub { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-gamme .gm-grid3--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }   /* 2×2 = .gm-grid3 en tablette */
  #wrapwrap .ww-famille .gm-final { grid-template-columns: minmax(0, 1fr); }   /* texte final connecté pleine largeur (99 px à 850 sinon) */
  #wrapwrap .ww-famille .gm-final__cta { justify-content: flex-start; }
}
@media (max-width: 760px) {
  #wrapwrap .ww-gamme .gm-grid3--4, #wrapwrap .ww-gamme .gm-fam2, #wrapwrap .ww-gamme .gm-fam2__sub { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #wrapwrap .ww-famille .gm-final__cta { justify-content: stretch; }   /* rétablit la règle mobile .gm-final__cta */
  #wrapwrap .ww-gamme .gm-crumb a.gm-eyebrow { position: relative; }
  #wrapwrap .ww-gamme .gm-crumb a.gm-eyebrow::before { content: ""; position: absolute; inset: -14px 0; }   /* cible tactile 44 px sans rehausser la rangée */
  #wrapwrap .ww-gamme .gm-hero__txt > .gm-eyebrow { white-space: normal; }   /* surtitre du héros : retour à la ligne à 360 (toutes les pages gamme) */
}
#wrapwrap .ww-gamme .gm-crumb .gm-eyebrow { font-size: 11px !important; }   /* fil d'Ariane = surtitre de section de la landing 11/500 (maquette) */
#wrapwrap .ww-gamme .gm-fam2__sub .gm-range__meta .gm-mono { order: 0; }   /* description sous le titre : titres des sous-familles alignés */
#wrapwrap .ww-gamme .gm-fam2__sub .gm-range__card .gm-photo { aspect-ratio: 16/9 }   /* photos des sous-familles (rendus produit, Charles 12/10) : plus basses que la carte « sur mesure » */
/* carte « sur mesure » (Charles 12/10 : vide sous le texte) : la photo prend toute la hauteur laissée par les sous-familles ; le rendu est large et
   l'échelle petite au centre d'une grille vide -> recadré (cover) sur l'échelle, seuls les bords vides sont coupés. Tablette : sous-familles en 2 × 2 */
@media (min-width: 761px) {
  #wrapwrap .ww-gamme .gm-fam2 > .gm-range__card { grid-template-rows: minmax(0, 1fr) auto; align-content: stretch; }
  #wrapwrap .ww-gamme .gm-fam2 > .gm-range__card > .gm-photo { aspect-ratio: auto; min-height: 260px; }
  #wrapwrap .ww-gamme .gm-fam2 > .gm-range__card > .gm-photo img { position: absolute; inset: 0; object-fit: cover; }
  #wrapwrap .ww-gamme .gm-fam2__sub { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* ===== Cartes cliquables et photos d'usage (Charles 02/10 : « toutes les cards cliquables », « les photos de la section 02 prennent toute la place ») ===== */
#wrapwrap .ww-gamme #usages .gm-card > .gm-photo:first-child { margin: -24px -24px 6px; border-radius: 11px 11px 0 0; }   /* photo bord à bord dans sa carte */
#wrapwrap .ww-gamme .gm-photo--tall { aspect-ratio: 4/5; }   /* photos verticales (Échelles) ; les photos horizontales (Trappes) gardent 16/10 */
#wrapwrap .ww-gamme a.gm-card--link { text-decoration: none !important; color: var(--ink-900) !important; transition: border-color .15s; }
#wrapwrap .ww-gamme a.gm-card--link:hover { border-color: var(--ink-900); }
#wrapwrap .ww-gamme a.gm-card--link .gm-range__n { margin-top: auto; }
#wrapwrap .ww-gamme .gm-range__card--fam { position: relative; cursor: pointer; }
#wrapwrap .ww-gamme .gm-range__card--fam a.gm-range__go { color: inherit !important; text-decoration: none !important; }
#wrapwrap .ww-gamme .gm-range__card--fam a.gm-range__go::after { content: ""; position: absolute; inset: 0; z-index: 0; }   /* le titre couvre toute la carte */
#wrapwrap .ww-gamme .gm-range__card--fam .gm-range__subs a, #wrapwrap .ww-gamme .gm-range__card--fam a.gm-range__n, #wrapwrap .ww-gamme .gm-range__card--fam a.gm-hero__link { position: relative; z-index: 1; }   /* les liens internes restent au-dessus */
#wrapwrap .ww-gamme .ww-tech.gm-tech-on { position: absolute; top: 12px; left: 12px; z-index: 2; pointer-events: none; }   /* étiquette SolidFit sur la photo, comme dans le catalogue */
/* ===== Glyphes idréva × workwith. (pages produit seulement, Charles 02/10) : trait = couleur du texte, point vert #00E6B0 ===== */
#wrapwrap .ww-gamme .gm-gl { display: block; flex: none; width: 24px; height: 24px; }
#wrapwrap .ww-gamme .gm-gl--32 { width: 32px; height: 32px; }
#wrapwrap .ww-gamme .gm-spec div.gm-spec__gl { grid-template-columns: 24px minmax(0, 1fr); gap: 2px 12px; align-items: center; }   /* caractéristiques : glyphe à gauche du libellé et de la valeur */
#wrapwrap .ww-gamme .gm-spec div.gm-spec__gl > .gm-gl { grid-row: 1 / span 2; color: var(--ink-900); }
#wrapwrap .ww-gamme .gm-why__item > .gm-gl { color: #fff; }   /* pourquoi le composite (fond encre) */
#wrapwrap .ww-gamme .gm-step .gm-gl { margin-bottom: 10px; color: var(--ink-900); }   /* commander : glyphe au-dessus du numéro d'étape */
/* Garde-corps (handoff gamme-garde-corps-v1.0, 07/10) : 2 familles selon la pose -> 2 colonnes, 1 colonne <= 760 px (2 classes : passe devant .gm-range des media plus bas) */
#wrapwrap .ww-gamme .gm-range.gm-range--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { #wrapwrap .ww-gamme .gm-range.gm-range--2 { grid-template-columns: minmax(0, 1fr); } }
/* Garde-corps 07/10 : cartes d'usage — glyphe au-dessus de l'étiquette (= étapes §06) et emplacement photo en attendant les photos (Charles) */
#wrapwrap .ww-gamme .gm-card .gm-card__k { display: flex; align-items: center; gap: 10px; }   /* glyphe 24 px + étiquette sur la même ligne */
#wrapwrap .ww-gamme .gm-card .gm-card__k .gm-gl { flex: none; color: var(--ink-900); }
#wrapwrap .ww-gamme .gm-photo.gm-photo--ph { display: grid; place-items: center; background: var(--ink-50); }
#wrapwrap .ww-gamme .gm-photo.gm-photo--ph span { font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--text-2) !important; }
/* Pages gamme 07/10 (agent parité, Charles « on harmonise ») : numéros des questions fermées #767676 sur fond gris = 4,20:1 < AA -> gris du texte secondaire ; la question ouverte garde son vert */
#wrapwrap .ww .gm-faq-sec .ww-faq__item:not(.is-open) .ww-faq__num { color: var(--text-2) !important; }
/* Pages gamme — parité Grilles 07/10 */
@media (max-width: 1100px) { #wrapwrap .ww-gamme .gm-hero__txt > .gm-eyebrow { white-space: normal; } }   /* surtitre long : à la ligne au lieu de déborder (850) */
#wrapwrap .ww-gamme .gm-range__card.gm-range__card--sister { align-self: start; }   /* carte « page sœur » sans photo : hauteur naturelle */
#wrapwrap .ww-gamme a.gm-card.gm-card--link { grid-template-rows: auto auto auto 1fr; }   /* cartes d'usage cliquables : lignes « famille → » alignées */
#wrapwrap .ww-gamme .gm-nw { white-space: nowrap; }   /* « anti-chute », « garde-corps » jamais coupés au trait d'union (H1, H2) */

/* ---- cadres photo (v2.76.51, Charles 07/10 : « tu as des photos qui sont coupées ») : le cadre suit la photo au lieu de la rogner ---- */
#wrapwrap .ww-gamme .gm-photo.gm-photo--render { background: #fff; }   /* rendus 3D et visuels catalogue sur fond blanc : posés entiers, jamais recadrés */
#wrapwrap .ww-gamme .gm-photo--render img { object-fit: contain; }
#wrapwrap .ww-gamme .gm-anat__photos--v { grid-template-columns: 2fr 1fr; }   /* anatomie en photos verticales : une grande à gauche, deux petites empilées */
#wrapwrap .ww-gamme .gm-anat__photos--v .gm-photo { aspect-ratio: auto; }
#wrapwrap .ww-gamme .gm-anat__photos--v .gm-photo:first-child { grid-column: 1; grid-row: 1 / 3; aspect-ratio: 3/4; }
#wrapwrap .ww-gamme .gm-anat__photos--v .gm-photo img { position: absolute; inset: 0; }   /* la grande photo fixe la hauteur, les petites partagent ses deux rangées */
@media (min-width: 761px) and (max-width: 1100px) {   /* anatomie sous la liste, pleine largeur : trois photos verticales côte à côte */
  #wrapwrap .ww-gamme .gm-anat__photos--v { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #wrapwrap .ww-gamme .gm-anat__photos--v .gm-photo, #wrapwrap .ww-gamme .gm-anat__photos--v .gm-photo:first-child { grid-row: auto; aspect-ratio: 3/4; }
}
#wrapwrap .ww-gamme .gm-photo__ph { white-space: normal; text-overflow: clip; }   /* légende trop longue pour son cadre : à la ligne, jamais tronquée (petits cadres de l'anatomie, 1101–1440) */

/* ===== Échelle des titres v2 (Charles 07/11 : « respecter une harmonie entre les titres H1, H2, H3, H4 » ; « la landing peut avoir
   un peu de différence, sur la hero notamment » ; échelle mesurée par l'agent UX : rapport H1/H2 1,33, titres de 2 à 4 lignes en
   demi-colonne, H1 toujours au-dessus des H2, interligne 1). BLOC FINAL : prime sur les règles de taille précédentes. ===== */
#wrapwrap .ww-gamme .gm-h1 { font-size: 64px !important; line-height: 1 !important; letter-spacing: -.035em !important; }
#wrapwrap .ww-gamme .gm-h2, #wrapwrap .ww-gamme .gm-faq-sec .ww-faq__title { font-size: 48px !important; line-height: 1 !important; letter-spacing: -.035em !important; }
#wrapwrap .ww-gamme .gm-h3, #wrapwrap .ww-gamme .gm-why__q, #wrapwrap .ww-gamme .gm-final .gm-h3 { font-size: 24px !important; font-weight: 900 !important; line-height: 1.15 !important; letter-spacing: -.025em !important; }
#wrapwrap .ww-gamme .gm-step b { font-size: 20px !important; font-weight: 700 !important; line-height: 1.2 !important; letter-spacing: -.01em !important; }   /* H4 : titres d'étape */
#wrapwrap .ww-gamme .gm-sec--sunken .gm-eyebrow, #wrapwrap .ww-gamme .gm-faq-sec .ww-faq__eyebrow,
#wrapwrap .ww-gamme .gm-faq-sec .ww-faq__item.is-open .ww-faq__num { color: var(--green-800) !important; }   /* contraste AA sur fond gris (4,19 -> 6:1) */
@media (min-width: 761px) and (max-width: 1199px) {
  #wrapwrap .ww-gamme .gm-h1 { font-size: 48px !important; }
  #wrapwrap .ww-gamme .gm-h2, #wrapwrap .ww-gamme .gm-faq-sec .ww-faq__title { font-size: 44px !important; }
}
@media (max-width: 760px) {
  #wrapwrap .ww-gamme .gm-h1 { font-size: 38px !important; }
  #wrapwrap .ww-gamme .gm-h2, #wrapwrap .ww-gamme .gm-faq-sec .ww-faq__title { font-size: 30px !important; }
  #wrapwrap .ww-gamme .gm-h3, #wrapwrap .ww-gamme .gm-why__q, #wrapwrap .ww-gamme .gm-final .gm-h3 { font-size: 20px !important; }
  #wrapwrap .ww-gamme .gm-step b { font-size: 18px !important; }
}


/* ===== legal.css ===== */
/* ===== legal.css — pages légales publiques (handoff pages-legales-v1.0, 07/10/2026) : racine .ww-legal, classes lg-* =====
   Valeurs du handoff, alignées sur les styles de la landing (contrôle de parité du 08/10) ; « !important » là où le thème Odoo impose tailles, graisses et couleurs (titres, p 300, liens noirs soulignés). */
#wrapwrap .ww-legal { --gutter:24px; --air:128px; background:#fff; color:var(--ink-900); font-family:var(--font-sans); line-height:1.55 }
#wrapwrap .ww-legal h1, #wrapwrap .ww-legal h2, #wrapwrap .ww-legal h3, #wrapwrap .ww-legal p, #wrapwrap .ww-legal ol, #wrapwrap .ww-legal ul, #wrapwrap .ww-legal dl, #wrapwrap .ww-legal dd { margin:0 }
#wrapwrap .ww-legal .lg-wrap { max-width:1248px; margin:0 auto; padding:0 var(--gutter) }   /* = barre publique et pages gamme */
#wrapwrap .ww-legal .lg-mono { font-family:var(--font-mono) !important }
#wrapwrap .ww-legal .lg-eyebrow { white-space:nowrap; font-family:var(--font-mono) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:.12em !important; text-transform:uppercase; color:var(--green-700) !important }
#wrapwrap .ww-legal .lg-eyebrow--ink { color:var(--text-3) !important }
#wrapwrap .ww-legal .lg-dot { color:var(--green-500) !important }
#wrapwrap .ww-legal .lg-read .lg-h3 { font-size:19px !important; font-weight:700 !important; letter-spacing:-.02em !important; line-height:1.55 !important; color:var(--ink-900) !important }   /* (1,3,0) > .lg-read p : sinon le titre de l'encadré tombait en 17/400 */
#wrapwrap .ww-legal .lg-i { width:16px; height:16px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round }
#wrapwrap .ww-legal a { color:var(--ink-900) !important; text-decoration:underline !important; text-decoration-thickness:1px !important; text-underline-offset:3px; text-decoration-color:var(--ink-300) !important }
#wrapwrap .ww-legal a:hover { text-decoration-color:var(--green-500) !important }
#wrapwrap .ww-legal a:focus-visible, #wrapwrap .ww-legal button:focus-visible, #wrapwrap .ww-legal summary:focus-visible { outline:2px solid var(--green-500); outline-offset:2px; border-radius:4px }

/* en-tête du document */
#wrapwrap .ww-legal .lg-head { padding-top:56px; padding-bottom:40px; display:grid; gap:14px }
#wrapwrap .ww-legal .lg-h1 { font-size:52px !important; font-weight:900 !important; letter-spacing:-.04em !important; line-height:.95 !important; max-width:18ch; color:var(--ink-900) !important; text-wrap:pretty }
#wrapwrap .ww-legal .lg-date { font-size:12px !important; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3) !important }
#wrapwrap .ww-legal .lg-docs { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px }
#wrapwrap .ww-legal .lg-docs a, #wrapwrap .ww-legal .lg-docs span { display:inline-flex; align-items:center; white-space:nowrap; height:36px; padding:0 14px; border-radius:999px; border:1px solid var(--border-1); font-size:14px !important; text-decoration:none !important; color:var(--ink-900) !important }
#wrapwrap .ww-legal .lg-docs a:hover { background:var(--ink-50) }
#wrapwrap .ww-legal .lg-docs [aria-current] { background:var(--ink-900); color:#fff !important; border-color:var(--ink-900) }

/* sommaire + colonne de lecture */
#wrapwrap .ww-legal .lg-grid { display:grid; grid-template-columns:260px minmax(0,1fr); gap:48px 64px; padding-top:48px; padding-bottom:var(--air); border-top:1px solid var(--border-1) }
#wrapwrap .ww-legal .lg-toc__d { position:sticky; top:92px; max-height:calc(100vh - 180px); overflow:auto; display:grid; gap:14px; align-content:start; padding-right:8px }
#wrapwrap .ww-legal .lg-toc__m { display:none }
#wrapwrap .ww-legal .lg-toc__list { margin:0; padding:0; list-style:none; display:grid; gap:2px; border-left:1px solid var(--border-1) }
#wrapwrap .ww-legal .lg-toc__list a { display:grid; grid-template-columns:28px minmax(0,1fr); gap:8px; align-items:baseline; padding:8px 12px; margin-left:-1px; border-left:1px solid transparent; font-size:14px !important; color:var(--text-2) !important; text-decoration:none !important; line-height:1.3 !important }
#wrapwrap .ww-legal .lg-toc__list a .lg-mono { font-size:11px !important; line-height:1.55; color:var(--text-3) }
#wrapwrap .ww-legal .lg-toc__list a:hover { color:var(--ink-900) !important }
#wrapwrap .ww-legal .lg-toc__list a[aria-current] { color:var(--ink-900) !important; font-weight:700 !important; border-left-color:var(--ink-900) }
#wrapwrap .ww-legal .lg-toc__list a[aria-current] .lg-mono { color:var(--green-700) }
#wrapwrap .ww-legal .lg-read { max-width:68ch; font-size:17px; line-height:1.55 }
#wrapwrap .ww-legal .lg-read p, #wrapwrap .ww-legal .lg-read li { font-size:17px !important; font-weight:400 !important; line-height:1.55 !important; color:var(--ink-900) }
#wrapwrap .ww-legal .lg-read p { margin:0 0 16px; text-wrap:pretty }
#wrapwrap .ww-legal .lg-read p:last-child { margin-bottom:0 }
#wrapwrap .ww-legal .lg-sec { padding:0 0 48px; margin:0 0 48px; border-bottom:1px solid var(--border-1); scroll-margin-top:96px }
#wrapwrap .ww-legal .lg-sec__t { display:flex; align-items:baseline; gap:14px; font-size:28px !important; font-weight:900 !important; letter-spacing:-.035em !important; line-height:1.1 !important; margin:0 0 20px !important; color:var(--ink-900) !important; text-wrap:pretty }
#wrapwrap .ww-legal .lg-sec__n { font-size:13px !important; font-weight:500 !important; letter-spacing:0; line-height:1.55; color:var(--green-700) !important; flex:none }
#wrapwrap .ww-legal .lg-read h3 { font-size:17px !important; font-weight:700 !important; letter-spacing:-.01em !important; line-height:1.2 !important; margin:28px 0 10px !important; color:var(--ink-900) !important; scroll-margin-top:96px }
#wrapwrap .ww-legal .lg-read h3:first-child { margin-top:0 !important }
#wrapwrap .ww-legal .lg-read b { font-weight:700 !important; color:var(--ink-900) !important }
#wrapwrap .ww-legal .lg-read .lg-art { font-family:var(--font-mono) !important; font-size:13px !important; font-weight:500 !important; letter-spacing:0; color:var(--text-3) !important; margin-right:4px }   /* n° de sous-article des CGV (« 4-1 ») */

/* fiche d'identité, copier, liste, tableau, encadré contact, pied du document */
#wrapwrap .ww-legal .lg-fiche { margin:0 0 16px; display:grid; border-top:1px solid var(--border-1) }
#wrapwrap .ww-legal .lg-fiche > div { display:grid; grid-template-columns:200px minmax(0,1fr); gap:16px; padding:12px 0; border-bottom:1px solid var(--border-1) }
#wrapwrap .ww-legal .lg-fiche dt { font-family:var(--font-mono) !important; font-size:12px !important; font-weight:400 !important; letter-spacing:.08em; line-height:1.55; text-transform:uppercase; color:var(--text-3) !important; padding-top:4px }
#wrapwrap .ww-legal .lg-fiche dd { margin:0; font-size:16px !important; line-height:1.55 !important; color:var(--ink-900) }
#wrapwrap .ww-legal .lg-copy { display:inline-flex; align-items:center; gap:8px }
#wrapwrap .ww-legal .lg-copy .lg-mono, #wrapwrap .ww-legal .lg-tbl .lg-mono { font-size:13px !important; font-weight:500 !important; line-height:1.55 }   /* n° copiables, noms de cookies : mono 13/500 de la landing */
#wrapwrap .ww-legal .lg-copy__btn { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; padding:0; border-radius:6px; border:1px solid var(--border-1); background:#fff; color:var(--text-2); cursor:pointer }
#wrapwrap .ww-legal .lg-copy__btn:hover { background:var(--ink-50); color:var(--ink-900) }
#wrapwrap .ww-legal .lg-copy__btn.is-done { color:var(--green-700); border-color:var(--green-500) }
#wrapwrap .ww-legal .lg-liste { margin:0 0 16px; padding:0; list-style:none; display:grid; gap:8px }
#wrapwrap .ww-legal .lg-liste li { position:relative; padding-left:22px }
#wrapwrap .ww-legal .lg-liste li::before { content:""; position:absolute; left:0; top:.72em; width:10px; height:1px; background:var(--ink-900) }
#wrapwrap .ww-legal .lg-tbl { margin:0 0 16px; border:1px solid var(--border-1); border-radius:12px; overflow:hidden }
#wrapwrap .ww-legal .lg-tbl table { width:100%; border-collapse:collapse; font-size:15px; margin:0 }
#wrapwrap .ww-legal .lg-tbl th { text-align:left; font-family:var(--font-mono) !important; font-size:11px !important; letter-spacing:.12em; line-height:1.55; text-transform:uppercase; font-weight:500 !important; color:var(--text-3) !important; background:var(--ink-50); padding:12px 16px; border-bottom:1px solid var(--border-1) }
#wrapwrap .ww-legal .lg-tbl td { padding:12px 16px; border-bottom:1px solid var(--border-1); vertical-align:top; font-size:15px !important; color:var(--ink-900) }
#wrapwrap .ww-legal .lg-tbl tr:last-child td { border-bottom:0 }
#wrapwrap .ww-legal .lg-tbl td:last-child { color:var(--text-2) }
#wrapwrap .ww-legal .lg-contact { margin:8px 0 32px; padding:24px 26px; background:var(--ink-50); border-radius:12px; display:grid; gap:8px }
#wrapwrap .ww-legal .lg-contact p { margin:0 }
#wrapwrap .ww-legal .lg-tbl th, #wrapwrap .ww-legal .lg-contact .lg-eyebrow { color:var(--text-2) !important }   /* 11 px sur gris clair : #767676 / vert 4,2:1 < 4,5 -> encre 2 (≈ 6:1), comme gamme.css */
#wrapwrap .ww-legal .lg-read .lg-end { font-size:12px !important; letter-spacing:0; line-height:1.55 !important; color:var(--text-3) }
#wrapwrap .ww-legal .lg-end a { color:var(--text-2) !important }

@media (max-width:1024px) {
  #wrapwrap .ww-legal .lg-grid { grid-template-columns:220px minmax(0,1fr); gap:40px }
  #wrapwrap .ww-legal .lg-h1 { font-size:44px !important; line-height:1 !important; letter-spacing:-.035em !important }
}
@media (max-width:850px) {
  #wrapwrap .ww-legal .lg-grid { grid-template-columns:minmax(0,1fr); gap:24px; padding-top:24px }
  #wrapwrap .ww-legal .lg-toc__d { display:none }
  #wrapwrap .ww-legal .lg-toc__m { display:block; border:1px solid var(--border-1); border-radius:12px }
  #wrapwrap .ww-legal .lg-toc__m summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; padding:14px 16px; font-weight:700; font-size:15px }
  #wrapwrap .ww-legal .lg-toc__m summary::-webkit-details-marker { display:none }
  #wrapwrap .ww-legal .lg-toc__m[open] summary .lg-i { transform:rotate(180deg) }
  #wrapwrap .ww-legal .lg-toc__m .lg-toc__list { border-left:0; padding:0 8px 8px }
  #wrapwrap .ww-legal .lg-toc__m .lg-toc__list a { padding:10px 8px; min-height:44px; align-items:center }
  #wrapwrap .ww-legal .lg-read p, #wrapwrap .ww-legal .lg-read li { font-size:16px !important; line-height:1.6 !important }
  #wrapwrap .ww-legal .lg-head { padding-top:32px; gap:12px }
  #wrapwrap .ww-legal .lg-h1 { font-size:40px !important }
  #wrapwrap .ww-legal .lg-sec { padding-bottom:36px; margin-bottom:36px }
  #wrapwrap .ww-legal .lg-sec__t { font-size:24px !important; line-height:1 !important; letter-spacing:-.025em !important }
  #wrapwrap .ww-legal .lg-fiche > div { grid-template-columns:minmax(0,1fr); gap:4px }
}
@media (max-width:760px) {
  #wrapwrap .ww-legal { --gutter:16px; --air:72px }
  #wrapwrap .ww-legal .lg-h1 { font-size:34px !important; line-height:.92 !important; letter-spacing:-.04em !important }   /* = H1 mobile de la landing et des pages gamme */
  #wrapwrap .ww-legal .lg-docs a, #wrapwrap .ww-legal .lg-docs span { height:44px }   /* cibles tactiles 44 px */
  #wrapwrap .ww-legal .lg-copy__btn { width:44px; height:44px }
  /* tableaux empilés en fiches seulement en mobile : à 850 ils tiennent dans la colonne de 68 ch */
  #wrapwrap .ww-legal .lg-tbl { border:0; border-radius:0 }
  #wrapwrap .ww-legal .lg-tbl thead { display:none }
  #wrapwrap .ww-legal .lg-tbl table, #wrapwrap .ww-legal .lg-tbl tbody, #wrapwrap .ww-legal .lg-tbl tr, #wrapwrap .ww-legal .lg-tbl td { display:block }
  #wrapwrap .ww-legal .lg-tbl tr { border:1px solid var(--border-1); border-radius:12px; margin-bottom:10px; padding:6px 0 }
  #wrapwrap .ww-legal .lg-tbl td { border:0; padding:8px 16px }
  #wrapwrap .ww-legal .lg-tbl td::before { content:attr(data-l); display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; line-height:1.55; text-transform:uppercase; color:var(--text-3); margin-bottom:2px }
}
@media print {
  #wrapwrap .ww-pub, #wrapwrap footer, #wrapwrap .ww-legal .lg-toc, #wrapwrap .ww-legal .lg-docs, #wrapwrap .ww-legal .lg-copy__btn { display:none !important }
  #wrapwrap .ww-legal .lg-grid { display:block; border:0; padding:0 }
  #wrapwrap .ww-legal .lg-read { max-width:none }
  #wrapwrap .ww-legal .lg-read p, #wrapwrap .ww-legal .lg-read li { font-size:11pt !important }
  #wrapwrap .ww-legal .lg-sec { break-inside:avoid-page }
  #wrapwrap .ww-legal .lg-read a[href^="http"]::after, #wrapwrap .ww-legal .lg-read a[href^="mailto"]::after { content:" (" attr(href) ")"; font-size:.85em; color:#555 }
  #wrapwrap .ww-legal .lg-head { padding:0 0 24px }
}


/* ===== engage.css ===== */
/* ===== engage.css — « Nos engagements » /my/engagements (handoff engagement-v1.0, 08/10/2026) : racine .ww-dash.ww-engage, classes en-* =====
   En-tête = classes de la Vue d'ensemble (dash-head, dash-repere, dash-h1, dash-eyebrow). Colonnes réglées sur la largeur du BLOC (requête de
   conteneur) : la barre latérale prend 280 à 360 px, la largeur d'écran ne dit rien de la place réelle (leçon du 07/10). */
#wrapwrap .ww-engage { --en-card: 0 1px 2px rgba(20,20,20,.04), 0 4px 16px rgba(20,20,20,.05); --en-halo: rgba(0,230,176,.28); container-type: inline-size; max-width: 1240px; }
#wrapwrap .ww-engage.ww-engage--pub { box-sizing: border-box; max-width: 1248px; margin: 0 auto; padding: 48px 24px 96px; }   /* page publique /engagements : pleine largeur, bords = barre publique */
@media (max-width: 760px) { #wrapwrap .ww-engage.ww-engage--pub { padding: 24px 16px 72px; } }
#wrapwrap .ww-engage h2, #wrapwrap .ww-engage h3, #wrapwrap .ww-engage p, #wrapwrap .ww-engage ul { margin: 0; }
#wrapwrap .ww-engage ul { padding: 0; list-style: none; }
#wrapwrap .ww-engage p, #wrapwrap .ww-engage li { font-weight: 400 !important; }
#wrapwrap .ww-engage i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-engage .en-lbl { font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3) !important; }

/* en-tête : repère de la Vue d'ensemble + bloc EcoVadis */
#wrapwrap .ww-engage .en-head { align-items: flex-end; margin-bottom: 40px; }
#wrapwrap .ww-engage .en-head .dash-h1 { margin-top: 0; text-wrap: balance; }
#wrapwrap .ww-engage .en-h1k { display: block; margin-bottom: 12px; line-height: 1.2; }   /* surtitre placé dans le H1 (référencement), même rendu qu'avant */
#wrapwrap .ww-engage .en-head .dash-repere { flex: 1 1 520px; }   /* la Vue d'ensemble met « auto » (titre court) : ici le titre long repousserait le bloc EcoVadis à la ligne */
#wrapwrap .ww-engage .en-lead { font-size: 18px !important; line-height: 1.5 !important; color: var(--ink-600) !important; margin-top: 16px; max-width: 620px; }
#wrapwrap .ww-engage .en-eco { flex: 0 1 400px; background: var(--ink-900); color: #fff; border-radius: 12px; padding: 22px 24px; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; }
#wrapwrap .ww-engage .en-score { font-family: var(--font-mono) !important; font-size: 44px !important; font-weight: 600 !important; line-height: 1 !important; letter-spacing: -.03em; color: #fff !important; }
#wrapwrap .ww-engage .en-score small { font-size: 16px; color: var(--ink-400); font-weight: 500; }
#wrapwrap .ww-engage .en-eco .en-lbl { color: var(--green-500) !important; }
#wrapwrap .ww-engage .en-eco p { font-size: 15px !important; line-height: 1.4 !important; margin-top: 6px; color: #fff !important; }
#wrapwrap .ww-engage .en-eco b { color: #fff !important; font-weight: 700 !important; }
#wrapwrap .ww-engage .en-eco__sub { display: flex; gap: 18px; margin-top: 10px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-300); }
#wrapwrap .ww-engage .en-eco__sub b { font-size: 16px; }

/* trois repères dans un U */
#wrapwrap .ww-engage .en-u { position: relative; padding: 0 0 18px; margin-bottom: 56px; }
#wrapwrap .ww-engage .en-u__frame { position: absolute; inset: 0; border: 1px solid var(--ink-900); border-top: 0; border-radius: 0 0 14px 14px; pointer-events: none; }
#wrapwrap .ww-engage .en-u__dot { position: absolute; left: 50%; bottom: -6px; margin-left: -6px; width: 12px; height: 12px; border-radius: 6px; background: var(--green-500); box-shadow: 0 0 0 6px var(--en-halo); }
#wrapwrap .ww-engage .en-u__src { padding: 0 18px 12px; }
#wrapwrap .ww-engage .en-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 0 18px; }
#wrapwrap .ww-engage .en-kpi { background: #fff; border-radius: 12px; box-shadow: var(--en-card); padding: 22px 24px; }
#wrapwrap .ww-engage .en-kpi__v { font-family: var(--font-mono); font-size: 34px; font-weight: 600; line-height: 1; letter-spacing: -.02em; }
#wrapwrap .ww-engage .en-kpi__v small, #wrapwrap .ww-engage .en-val small { font-size: 15px; font-weight: 500; color: var(--text-2); margin-left: 6px; }
#wrapwrap .ww-engage .en-kpi__l { font-size: 15px; color: var(--text-2); margin-top: 8px; line-height: 1.4; }

/* quatre engagements */
#wrapwrap .ww-engage .en-sec-h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 16px; flex-wrap: wrap; margin-bottom: 16px; }
#wrapwrap .ww-engage .en-sec-h__t { font-size: 28px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: -.035em !important; color: var(--ink-900) !important; }
#wrapwrap .ww-engage .en-sec-h > span { font-size: 14px; color: var(--text-3); }
#wrapwrap .ww-engage .en-blks { display: grid; gap: 20px; }
#wrapwrap .ww-engage .en-blk { display: grid; grid-template-columns: minmax(0, 1fr) 400px; background: #fff; border-radius: 12px; box-shadow: var(--en-card); overflow: hidden; }
#wrapwrap .ww-engage .en-blk--alt { grid-template-columns: 400px minmax(0, 1fr); }
#wrapwrap .ww-engage .en-blk--alt .en-blk__txt { order: 2; }
#wrapwrap .ww-engage .en-blk--alt .en-blk__side { border-left: 0; border-right: 1px solid var(--border-1); }
#wrapwrap .ww-engage .en-blk__txt { padding: 28px 30px 30px; display: grid; gap: 18px; align-content: start; min-width: 0; }
#wrapwrap .ww-engage .en-blk__num { display: flex; align-items: center; gap: 12px; }
#wrapwrap .ww-engage .en-g { font-family: var(--font-mono); font-size: 12px; letter-spacing: .14em; color: var(--green-700); }
#wrapwrap .ww-engage .en-line { width: 24px; height: 1px; background: var(--ink-300); }
#wrapwrap .ww-engage .en-k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-engage .en-h2 { font-size: 30px !important; font-weight: 900 !important; line-height: 1.02 !important; letter-spacing: -.035em !important; color: var(--ink-900) !important; text-wrap: balance; }
#wrapwrap .ww-engage .en-blk__txt > p { font-size: 16px !important; line-height: 1.55 !important; color: var(--ink-700) !important; max-width: 560px; }
#wrapwrap .ww-engage .en-proofs { border-top: 1px solid var(--border-1); }
#wrapwrap .ww-engage .en-proofs li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 14px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--border-1); font-size: 15px !important; line-height: 1.45 !important; color: var(--ink-900); }
#wrapwrap .ww-engage .en-tick { display: block; width: 10px; height: 1px; background: var(--ink-900); align-self: center; }
#wrapwrap .ww-engage .en-m { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-engage .en-blk__side { background: var(--ink-50); display: grid; grid-template-rows: auto minmax(0, 1fr); border-left: 1px solid var(--border-1); min-width: 0; }
#wrapwrap .ww-engage .en-blk__img { position: relative; height: 200px; background: var(--ink-800); overflow: hidden; }
#wrapwrap .ww-engage .en-blk__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
#wrapwrap .ww-engage .en-ph { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center; font-family: var(--font-mono); font-size: 11px; line-height: 1.6; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-400); }
#wrapwrap .ww-engage .en-blk__kpi { padding: 22px 26px 26px; display: grid; gap: 14px; align-content: start; }
#wrapwrap .ww-engage .en-blk__kpi p { font-size: 15px !important; line-height: 1.5 !important; color: var(--ink-700) !important; }
#wrapwrap .ww-engage .en-callout { background: #fff; border: 1px solid var(--border-1); border-radius: 12px; padding: 16px 18px; display: grid; gap: 6px; }
#wrapwrap .ww-engage .en-val { font-family: var(--font-mono); font-size: 28px; font-weight: 600; line-height: 1; letter-spacing: -.02em; }

/* le mot du dirigeant */
#wrapwrap .ww-engage .en-word { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 20px; margin-top: 56px; }
#wrapwrap .ww-engage .en-quote { background: var(--ink-900); color: #fff; border-radius: 12px; padding: 32px 34px; display: grid; gap: 20px; align-content: center; }
#wrapwrap .ww-engage .en-quote .dash-eyebrow { color: var(--ink-400); }
#wrapwrap .ww-engage .en-quote p { font-size: 22px !important; line-height: 1.35 !important; letter-spacing: -.01em; font-weight: 500 !important; color: #fff !important; text-wrap: pretty; }
#wrapwrap .ww-engage .en-who { display: flex; align-items: center; gap: 12px; padding-top: 8px; }
#wrapwrap .ww-engage .en-who__dot { width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 4px var(--en-halo); flex: none; }
#wrapwrap .ww-engage .en-who b { display: block; font-size: 15px; color: #fff !important; }
#wrapwrap .ww-engage .en-who span { font-size: 13px; color: var(--ink-400); }
#wrapwrap .ww-engage .en-photo { position: relative; min-height: 300px; border-radius: 12px; overflow: hidden; background: var(--ink-800); }
#wrapwrap .ww-engage .en-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
#wrapwrap .ww-engage .en-photo__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 18px; background: linear-gradient(180deg, rgba(20,20,20,0), rgba(20,20,20,.55)); font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #fff; }

/* documents */
#wrapwrap .ww-engage .en-docs { margin-top: 56px; }
#wrapwrap .ww-engage .en-docgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#wrapwrap .ww-engage .en-doc { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 18px; align-items: start; padding: 18px 20px 20px; background: #fff; border-radius: 12px; box-shadow: var(--en-card); color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-engage a.en-doc:hover { box-shadow: 0 8px 24px rgba(20,20,20,.1); }
#wrapwrap .ww-engage .en-thumb { display: block; width: 96px; height: 128px; border-radius: 4px; overflow: hidden; background: var(--ink-50); border: 1px solid var(--border-1); box-shadow: 0 6px 14px -8px rgba(20,20,20,.35); position: relative; }
#wrapwrap .ww-engage .en-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
#wrapwrap .ww-engage .en-thumb .en-ph { font-size: 10px; line-height: 1.4; letter-spacing: .08em; padding: 8px; }
#wrapwrap .ww-engage .en-doc__b { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-engage .en-doc__t { font-size: 17px; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; }
#wrapwrap .ww-engage .en-doc__d { font-size: 14px; color: var(--text-2); line-height: 1.4; }
#wrapwrap .ww-engage .en-doc__act { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 8px; }
#wrapwrap .ww-engage .en-dl { font-weight: 700; font-size: 14px; color: var(--green-700); white-space: nowrap; }
#wrapwrap .ww-engage .en-soon { font-family: var(--font-mono); font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; }   /* PDF pas encore en ligne */
#wrapwrap .ww-engage .en-meta { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }

/* pied */
#wrapwrap .ww-engage .en-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-engage .en-foot p { font-size: 15px !important; color: var(--text-2) !important; max-width: 620px; }

/* largeur du bloc de contenu (et non de l'écran) */
@container (max-width: 940px) {
  #wrapwrap .ww-engage .en-blk, #wrapwrap .ww-engage .en-blk--alt, #wrapwrap .ww-engage .en-word { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-engage .en-blk--alt .en-blk__txt { order: 0; }
  #wrapwrap .ww-engage .en-blk__side, #wrapwrap .ww-engage .en-blk--alt .en-blk__side { border-left: 0; border-right: 0; border-top: 1px solid var(--border-1); }
  #wrapwrap .ww-engage .en-docgrid { grid-template-columns: minmax(0, 1fr); }
}
@container (max-width: 640px) {
  #wrapwrap .ww-engage .en-kpis { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-engage .en-eco { grid-template-columns: minmax(0, 1fr); flex-basis: 100%; }
  #wrapwrap .ww-engage .en-h2 { font-size: 26px !important; }
  #wrapwrap .ww-engage .en-blk__txt { padding: 22px 20px 24px; }
  #wrapwrap .ww-engage .en-blk__img { height: 180px; }
  #wrapwrap .ww-engage .en-quote { padding: 26px 22px; }
  #wrapwrap .ww-engage .en-quote p { font-size: 19px !important; }
  #wrapwrap .ww-engage .en-photo { min-height: 240px; }
  #wrapwrap .ww-engage .en-foot .dash-btn { width: 100%; height: 48px; }
}


/* ===== docs.css ===== */
/* ===== docs.css — page « Documents » /my/docs, handoff documents-v1.0 (09/10) : racine .ww-ddocs ; classes dd-* (jamais .row/.btn/.pill : Bootstrap) ===== */
#wrapwrap .ww-ddocs { --dd-halo: rgba(0,230,176,.28); --dd-shadow: 0 1px 2px rgba(20,20,20,.04), 0 4px 16px rgba(20,20,20,.05); --dd-shadow-l: 0 12px 40px rgba(20,20,20,.14); }
#wrapwrap .ww-ddocs svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
/* en-tete */
#wrapwrap .ww-ddocs .dd-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px 32px; flex-wrap: wrap; margin-bottom: 24px; }
#wrapwrap .ww-ddocs .dd-head__t { flex: 1 1 440px; min-width: 0; }
#wrapwrap .ww-ddocs .dd-eb { display: block; }
#wrapwrap .ww-ddocs h1.dd-h1 { margin: 10px 0 0 !important; }
#wrapwrap .ww-ddocs p.dd-intro { margin: 10px 0 0 !important; max-width: 600px; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; text-wrap: pretty; }
/* outils */
/* retour « Mes documents » (documents reserves) */
#wrapwrap .ww-ddocs a.dd-back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--text-2) !important; font-size: 14px; font-weight: 700; text-decoration: none !important; }
#wrapwrap .ww-ddocs a.dd-back:hover { color: var(--ink-900) !important; }
/* bandeau d'entree des documents reserves (handoff espace-reserve-v1.0, D5) : noir, point jaune #ECF22E */
#wrapwrap .ww-ddocs a.dd-resb { display: flex; align-items: center; gap: 20px; margin: 0 0 24px; padding: 18px 24px 18px 20px; border-radius: 14px; background: var(--ink-900); color: #fff !important; text-decoration: none !important; }
#wrapwrap .ww-ddocs a.dd-resb:hover { background: #000; }
#wrapwrap .ww-ddocs a.dd-resb:focus-visible { outline: none; box-shadow: 0 0 0 3px #ECF22E; }
#wrapwrap .ww-ddocs .dd-resb__th { flex: none; display: flex; padding: 6px; border-radius: 6px; background: #fff; }
#wrapwrap .ww-ddocs .dd-resb__th i { position: relative; width: 26px; height: 36px; margin-left: -4px; border: 1px solid var(--ink-200); border-radius: 2px; background: #fff linear-gradient(var(--ink-900), var(--ink-900)) 4px 5px / 12px 2px no-repeat; box-shadow: -1px 0 0 #fff; }
#wrapwrap .ww-ddocs .dd-resb__th i:first-child { margin-left: 0; }
#wrapwrap .ww-ddocs .dd-resb__th i::after { content: ""; position: absolute; left: 4px; right: 4px; top: 11px; height: 14px; background: repeating-linear-gradient(var(--ink-200) 0 1px, transparent 1px 4px); }
#wrapwrap .ww-ddocs .dd-resb__th i:last-child::before { content: ""; position: absolute; right: 2px; bottom: 2px; width: 5px; height: 5px; border-radius: 3px; background: #ECF22E; box-shadow: 0 0 0 1px var(--ink-900); }
#wrapwrap .ww-ddocs .dd-resb__t { flex: 1; min-width: 0; display: grid; gap: 4px; }
#wrapwrap .ww-ddocs .dd-resb__k { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #ECF22E; }
#wrapwrap .ww-ddocs .dd-resb__k::before { content: ""; width: 8px; height: 8px; border-radius: 4px; background: #ECF22E; box-shadow: 0 0 0 3px rgba(236,242,46,.28); }
#wrapwrap .ww-ddocs .dd-resb__t b { font-size: 17px; font-weight: 700; line-height: 1.3; color: #fff !important; }
#wrapwrap .ww-ddocs .dd-resb__go { flex: none; display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: #fff; }
#wrapwrap .ww-ddocs .dd-tools { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; padding-top: 20px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-ddocs .dd-pills { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
#wrapwrap .ww-ddocs .dd-pills[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-pills::-webkit-scrollbar { display: none; }
#wrapwrap .ww-ddocs button.dd-pill { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border: 1px solid var(--ink-200); border-radius: 999px; background: #fff; color: var(--ink-900); font-family: var(--font-sans); font-size: 14px; font-weight: 700; white-space: nowrap; cursor: pointer; }
#wrapwrap .ww-ddocs .dd-pill b { font-family: var(--font-mono); font-size: 12px; font-weight: 500; color: var(--text-3) !important; }   /* theme : #wrapwrap b { color: black !important } */
#wrapwrap .ww-ddocs button.dd-pill[aria-pressed="true"] { background: var(--ink-900); border-color: var(--ink-900); color: #fff; }
#wrapwrap .ww-ddocs .dd-pill[aria-pressed="true"] b { color: rgba(255,255,255,.6) !important; }
#wrapwrap .ww-ddocs .dd-tools__r { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
#wrapwrap .ww-ddocs .dd-sort { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--ink-100); }
#wrapwrap .ww-ddocs[data-sp="lib"] .dd-sort, #wrapwrap .ww-ddocs[data-sp="ded"] .dd-sort { display: none; }
#wrapwrap .ww-ddocs[data-sp="ded"] .dd-tools { justify-content: flex-end; }
#wrapwrap .ww-ddocs .dd-sort button { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: var(--text-2); font-family: var(--font-sans); font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer; }
#wrapwrap .ww-ddocs .dd-sort button svg.i { width: 15px; height: 15px; }
#wrapwrap .ww-ddocs .dd-sort button[aria-pressed="true"] { background: #fff; color: var(--ink-900); box-shadow: 0 1px 2px rgba(20,20,20,.12); }
#wrapwrap .ww-ddocs label.dd-search { display: flex; align-items: center; gap: 8px; width: 240px; max-width: 100%; height: 40px; margin: 0; padding: 0 12px; border: 1px solid var(--ink-200); border-radius: 8px; background: #fff; color: var(--text-3); }
#wrapwrap .ww-ddocs .dd-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-family: var(--font-sans); font-size: 14px; color: var(--ink-900); -webkit-appearance: none; appearance: none; }
#wrapwrap .ww-ddocs .dd-search:focus-within { border-color: var(--ink-900); box-shadow: 0 0 0 3px var(--dd-halo); }
/* nouveaux cette semaine */
#wrapwrap .ww-ddocs .dd-new { margin-bottom: 28px; }
#wrapwrap .ww-ddocs .dd-new[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-new__h { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
#wrapwrap .ww-ddocs .dd-halo { width: 12px; height: 12px; flex: none; border-radius: 6px; background: var(--green-500); box-shadow: 0 0 0 6px var(--dd-halo); }
#wrapwrap .ww-ddocs .dd-new__h h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 900 !important; line-height: 1.2 !important; letter-spacing: -.025em !important; white-space: nowrap; color: var(--ink-900) !important; }
#wrapwrap .ww-ddocs .dd-new__h > span:last-child { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-new__g { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
#wrapwrap .ww-ddocs button.dd-nc { display: grid; grid-template-rows: 132px auto; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 12px; background: #fff; box-shadow: var(--dd-shadow); overflow: hidden; text-align: left; cursor: pointer; font-family: var(--font-sans); color: var(--ink-900); }
#wrapwrap .ww-ddocs button.dd-nc:hover { box-shadow: var(--dd-shadow-l); }
#wrapwrap .ww-ddocs .dd-nc__v { position: relative; display: flex; align-items: flex-end; justify-content: center; padding-top: 18px; background: var(--ink-100); overflow: hidden; }
#wrapwrap .ww-ddocs .dd-sheet { width: 96px; height: 118px; display: grid; grid-template-rows: auto auto 1fr; gap: 8px; padding: 12px 10px; background: #fff; border: 1px solid var(--ink-200); border-bottom: 0; border-radius: 3px 3px 0 0; box-shadow: 0 8px 20px rgba(20,20,20,.10); }
#wrapwrap .ww-ddocs .dd-sheet i { display: block; height: 4px; width: 55%; background: var(--ink-900); }
#wrapwrap .ww-ddocs .dd-sheet em { font-style: normal; font-family: var(--font-mono); font-size: 7px; letter-spacing: .08em; color: var(--text-3); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#wrapwrap .ww-ddocs .dd-sheet > span { display: grid; gap: 4px; align-content: start; }
#wrapwrap .ww-ddocs .dd-l { display: block; height: 2px; background: var(--ink-200); }
#wrapwrap .ww-ddocs .dd-ext { position: absolute; top: 12px; left: 12px; padding: 3px 7px; border-radius: 4px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; }
#wrapwrap .ww-ddocs .dd-nc__b { display: grid; gap: 4px; padding: 14px 16px 16px; min-width: 0; }
#wrapwrap .ww-ddocs .dd-nc__p { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--green-700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-nc__n { font-size: 15px; font-weight: 700; letter-spacing: -.01em; line-height: 1.3; min-height: 39px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
#wrapwrap .ww-ddocs .dd-nc__m { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
/* couleurs de format */
#wrapwrap .ww-ddocs .dd-fmt--plan { background: var(--ink-900); color: #fff; }
#wrapwrap .ww-ddocs .dd-fmt--devis { background: var(--yellow-500); color: var(--ink-900); }
#wrapwrap .ww-ddocs .dd-fmt--doc { background: var(--green-500); color: var(--ink-900); }
/* groupes */
#wrapwrap .ww-ddocs .dd-groups { display: grid; gap: 16px; }
#wrapwrap .ww-ddocs .dd-grp { background: #fff; border-radius: 12px; box-shadow: var(--dd-shadow); overflow: hidden; }
#wrapwrap .ww-ddocs .dd-grp__h { display: flex; align-items: center; gap: 8px; padding: 6px 12px 6px 8px; }
#wrapwrap .ww-ddocs button.dd-grp__tg { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; min-height: 52px; margin: 0; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; text-align: left; cursor: pointer; font-family: var(--font-sans); color: var(--ink-900); }
#wrapwrap .ww-ddocs button.dd-grp__tg:hover { background: var(--ink-50); }
#wrapwrap .ww-ddocs .dd-chev { display: inline-flex; color: var(--text-3); transition: transform .15s; }
#wrapwrap .ww-ddocs .dd-grp[data-closed] .dd-chev { transform: rotate(-90deg); }
#wrapwrap .ww-ddocs .dd-grp[data-closed] .dd-rows { display: none; }
#wrapwrap .ww-ddocs .dd-grp__n { display: flex; align-items: baseline; gap: 4px 12px; min-width: 0; flex-wrap: wrap; }
#wrapwrap .ww-ddocs .dd-grp__n b { font-size: 18px; font-weight: 900; line-height: 1.15; letter-spacing: -.025em; overflow-wrap: anywhere; }
#wrapwrap .ww-ddocs .dd-grp__n span { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-grp__new { display: inline-flex; align-items: center; gap: 6px; flex: none; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--green-700); white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-grp__new::before { content: ""; width: 6px; height: 6px; border-radius: 3px; background: var(--green-500); }
#wrapwrap .ww-ddocs a.dd-grp__lk { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 8px; border-radius: 8px; font-size: 14px; color: var(--text-2) !important; text-decoration-line: none !important; white-space: nowrap; }
#wrapwrap .ww-ddocs a.dd-grp__lk:hover { color: var(--green-700) !important; }
#wrapwrap .ww-ddocs a.dd-grp__lk svg.i { width: 14px; height: 14px; }
/* lignes */
#wrapwrap .ww-ddocs .dd-src { display: grid; }
#wrapwrap .ww-ddocs .dd-src[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-row { display: grid; grid-template-columns: 40px minmax(0, 1fr) 150px 104px auto; gap: 0 16px; align-items: center; min-height: 72px; padding: 10px 12px 10px 20px; border-top: 1px solid var(--border-1); cursor: pointer; }
#wrapwrap .ww-ddocs .dd-row:hover { background: var(--ink-50); }
#wrapwrap .ww-ddocs .dd-row:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-ddocs .dd-mini { position: relative; width: 40px; height: 52px; display: grid; grid-template-rows: auto 1fr; gap: 3px; padding: 5px 4px; border: 1px solid var(--ink-200); border-radius: 3px; background: #fff; box-shadow: 0 1px 2px rgba(20,20,20,.06); overflow: hidden; }
#wrapwrap .ww-ddocs .dd-mini i { display: block; height: 2px; width: 60%; background: var(--ink-900); }
#wrapwrap .ww-ddocs .dd-mini > span { display: grid; gap: 2px; align-content: start; }
#wrapwrap .ww-ddocs .dd-mini .dd-l { height: 1px; }
#wrapwrap .ww-ddocs .dd-mini__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; background: #fff; }
#wrapwrap .ww-ddocs .dd-mini em { z-index: 1; position: absolute; left: 0; right: 0; bottom: 0; height: 13px; display: flex; align-items: center; justify-content: center; font-style: normal; font-family: var(--font-mono); font-size: 7px; letter-spacing: .08em; }
#wrapwrap .ww-ddocs .dd-row__t { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-ddocs .dd-row__n { font-size: 15px; font-weight: 700; letter-spacing: -.01em; color: var(--ink-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-nd { display: inline-block; vertical-align: middle; width: 8px; height: 8px; margin: 0 10px 2px 2px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 4px var(--dd-halo); }
#wrapwrap .ww-ddocs .dd-row__s { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-row__pj { display: none; }
#wrapwrap .ww-ddocs.is-js[data-sort="date"] .dd-row__pj { display: inline; }
#wrapwrap .ww-ddocs .dd-row__ty { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-ddocs .dd-mk { width: 6px; height: 6px; flex: none; border-radius: 1px; outline: 1px solid rgba(20,20,20,.12); }
#wrapwrap .ww-ddocs .dd-mk--plan { background: var(--ink-900); }
#wrapwrap .ww-ddocs .dd-mk--devis { background: var(--yellow-500); }
#wrapwrap .ww-ddocs .dd-mk--doc { background: var(--green-500); }
#wrapwrap .ww-ddocs .dd-row__ty span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wrapwrap .ww-ddocs .dd-row__d { font-family: var(--font-mono); font-size: 13px; color: var(--text-2); white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-row__a { display: flex; gap: 2px; justify-content: flex-end; }
#wrapwrap .ww-ddocs .dd-ib { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ink-700) !important; cursor: pointer; text-decoration-line: none !important; }
#wrapwrap .ww-ddocs .dd-ib:hover { background: var(--ink-100); color: var(--ink-900) !important; }
#wrapwrap .ww-ddocs .dd-empty { display: grid; gap: 6px; padding: 48px 24px; border-radius: 12px; background: #fff; box-shadow: var(--dd-shadow); text-align: center; font-size: 15px; color: var(--text-2); }
#wrapwrap .ww-ddocs .dd-empty[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-empty b { font-size: 17px; color: var(--ink-900); }
/* volet d'apercu */
#wrapwrap .ww-ddocs .dd-dv { position: fixed; inset: 0; z-index: 1050; }
#wrapwrap .ww-ddocs .dd-dv[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-dv__s { position: absolute; inset: 0; background: rgba(20,20,20,.42); }
#wrapwrap .ww-ddocs .dd-dv__p { position: absolute; top: 12px; right: 12px; bottom: 12px; width: 480px; max-width: calc(100% - 24px); display: flex; flex-direction: column; overflow: hidden; border-radius: 14px; background: #fff; box-shadow: var(--dd-shadow-l); }
#wrapwrap .ww-ddocs .dd-dv__h { height: 56px; flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 8px 0 20px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-ddocs .dd-dv__h > span { flex: 1; min-width: 0; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wrapwrap .ww-ddocs .dd-dv__b { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 20px; padding: 24px 28px 28px; }
#wrapwrap .ww-ddocs .dd-dv__b > * { flex-shrink: 0; }   /* sinon les infos (6 cases) sont rognees au lieu de faire defiler le volet */
#wrapwrap .ww-ddocs button.dd-dv__full { position: absolute; right: 10px; bottom: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 0; border-radius: 999px; background: var(--ink-900); color: #fff; font-family: var(--font-sans); font-size: 13px; font-weight: 700; cursor: pointer; }
#wrapwrap .ww-ddocs button.dd-dv__full[hidden] { display: none; }
#wrapwrap .ww-ddocs button.dd-dv__full svg.i { width: 15px; height: 15px; }
#wrapwrap .ww-ddocs button.dd-dv__full:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-ddocs .dd-dv__v:has(.dd-dv__full:not([hidden])) { cursor: zoom-in; }
#wrapwrap .ww-ddocs .dd-dv__v { position: relative; flex: none; height: 280px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: var(--ink-100); }
#wrapwrap .ww-ddocs .dd-big { width: 170px; height: 224px; display: grid; grid-template-rows: auto auto 1fr; gap: 12px; padding: 18px 16px; border: 1px solid var(--ink-200); border-radius: 4px; background: #fff; box-shadow: 0 8px 24px rgba(20,20,20,.12); }
#wrapwrap .ww-ddocs .dd-big i { display: block; height: 6px; width: 55%; border-radius: 2px; background: var(--ink-900); }
#wrapwrap .ww-ddocs .dd-big em { font-style: normal; font-family: var(--font-mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); overflow-wrap: anywhere; }
#wrapwrap .ww-ddocs .dd-big > span { display: grid; gap: 6px; align-content: start; }
#wrapwrap .ww-ddocs .dd-l--b { height: 3px; }
#wrapwrap .ww-ddocs .dd-big[hidden], #wrapwrap .ww-ddocs .dd-dv__cv[hidden], #wrapwrap .ww-ddocs .dd-dv__img[hidden] { display: none !important; }
#wrapwrap .ww-ddocs .dd-dv__cv, #wrapwrap .ww-ddocs .dd-dv__img { max-width: calc(100% - 40px); max-height: calc(100% - 40px); background: #fff; border: 1px solid var(--ink-200); border-radius: 4px; box-shadow: 0 8px 24px rgba(20,20,20,.12); object-fit: contain; }
#wrapwrap .ww-ddocs .dd-nc__v.has-real .dd-sheet { display: none; }
#wrapwrap .ww-ddocs .dd-nc__cv, #wrapwrap .ww-ddocs .dd-nc__img { align-self: flex-end; width: 132px; max-height: 114px; object-fit: cover; object-position: top center; background: #fff; border: 1px solid var(--ink-200); border-bottom: 0; border-radius: 3px 3px 0 0; box-shadow: 0 8px 20px rgba(20,20,20,.10); }
#wrapwrap .ww-ddocs .dd-nc__img { height: 114px; }
#wrapwrap .ww-ddocs .dd-ext { z-index: 1; }
/* chargement de l'apercu : squelette qui scintille, barre de progression verte, page reelle en fondu */
#wrapwrap .ww-ddocs .dd-dv__cv, #wrapwrap .ww-ddocs .dd-dv__img, #wrapwrap .ww-ddocs .dd-nc__cv, #wrapwrap .ww-ddocs .dd-nc__img { opacity: 0; transition: opacity .3s ease-out, transform .3s ease-out; transform: translateY(4px); }
#wrapwrap .ww-ddocs .dd-dv__cv.is-in, #wrapwrap .ww-ddocs .dd-dv__img.is-in, #wrapwrap .ww-ddocs .dd-nc__cv.is-in, #wrapwrap .ww-ddocs .dd-nc__img.is-in { opacity: 1; transform: none; }
#wrapwrap .ww-ddocs .is-loading .dd-l, #wrapwrap .ww-ddocs .is-loading .dd-big i, #wrapwrap .ww-ddocs .is-loading .dd-sheet i {
  background: linear-gradient(90deg, var(--ink-200) 0%, var(--ink-100) 40%, var(--ink-200) 80%); background-size: 240% 100%; animation: dd-shim 1.2s ease-in-out infinite; }
@keyframes dd-shim { from { background-position: 100% 0; } to { background-position: 0 0; } }
#wrapwrap .ww-ddocs .dd-dv__bar { position: absolute; left: 12px; right: 12px; bottom: 44px; height: 3px; border-radius: 2px; background: rgba(20,20,20,.08); overflow: hidden; }
#wrapwrap .ww-ddocs .dd-dv__bar[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-dv__bar i { display: block; height: 100%; width: var(--p, 0%); border-radius: 2px; background: var(--green-500); box-shadow: 0 0 0 3px var(--dd-halo); transition: width .2s ease-out; }
#wrapwrap .ww-ddocs .dd-dv__bar.is-indet i { width: 32%; animation: dd-indet 1.1s ease-in-out infinite; }
@keyframes dd-indet { from { margin-left: -32%; } to { margin-left: 100%; } }
/* ===== documents reserves (handoff espace-reserve-v1.0 D6/D7, lot 3 du 10/10) : noir + jaune #ECF22E reserve a cet espace ===== */
#wrapwrap .ww-ddocs .dd-rhero { position: relative; margin: 0 0 28px; padding: 36px 40px 26px 76px; border-radius: 16px; background: var(--ink-900); color: #fff; overflow: hidden; }
#wrapwrap .ww-ddocs .dd-rhero::before { content: ""; position: absolute; left: 49px; top: 52px; height: 150px; width: 1px; background: rgba(255,255,255,.28); }
#wrapwrap .ww-ddocs .dd-rhero__dot { position: absolute; left: 42px; top: 39px; width: 15px; height: 15px; border-radius: 8px; background: #ECF22E; box-shadow: 0 0 0 5px rgba(236,242,46,.22); }
#wrapwrap .ww-ddocs .dd-rhero__k { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #ECF22E; }
#wrapwrap .ww-ddocs .dd-rhero__sep { color: rgba(255,255,255,.5); }
#wrapwrap .ww-ddocs .dd-rhero__co { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.82); }
#wrapwrap .ww-ddocs .dd-rhero__mk, #wrapwrap .ww-ddocs .dd-dcard__mk { display: inline-flex; align-items: center; justify-content: center; overflow: hidden; background: #fff; color: var(--ink-900); font-family: var(--font-sans); font-weight: 800; letter-spacing: 0; }
#wrapwrap .ww-ddocs .dd-rhero__mk { width: 22px; height: 22px; border-radius: 5px; font-size: 9px; }
#wrapwrap .ww-ddocs .dd-rhero__mk img, #wrapwrap .ww-ddocs .dd-dcard__mk img { width: 100%; height: 100%; object-fit: contain; padding: 2px; }
#wrapwrap .ww-ddocs h1.dd-rhero__t { margin: 16px 0 0 !important; font-size: 46px !important; line-height: 1 !important; color: #fff !important; text-wrap: balance; }
#wrapwrap .ww-ddocs h1.dd-rhero__t i { font-style: normal; color: #ECF22E; }
#wrapwrap .ww-ddocs p.dd-rhero__p { max-width: 640px; margin: 18px 0 0 !important; font-family: var(--font-sans) !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.55 !important; color: rgba(255,255,255,.86) !important; text-wrap: pretty; }
#wrapwrap .ww-ddocs .dd-rhero__f { display: flex; flex-wrap: wrap; gap: 10px 32px; margin: 26px 0 0 -34px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.14); font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.75); }
#wrapwrap .ww-ddocs .dd-rhero__f > span { display: inline-flex; align-items: flex-start; gap: 8px; max-width: 420px; }
#wrapwrap .ww-ddocs .dd-rhero__f svg.i { width: 15px; height: 15px; margin-top: 2px; }
#wrapwrap .ww-ddocs .dd-dtools { display: flex; justify-content: space-between; align-items: center; gap: 12px 16px; flex-wrap: wrap; margin-bottom: 20px; }
#wrapwrap .ww-ddocs .dd-dpills { display: inline-flex; gap: 4px; padding: 4px; border-radius: 12px; background: var(--ink-100); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-ddocs .dd-dpills::-webkit-scrollbar { display: none; }
#wrapwrap .ww-ddocs button.dd-dpill { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px; border: 0; border-radius: 9px; background: transparent; color: var(--text-2); font-family: var(--font-sans); font-size: 14px; font-weight: 700; white-space: nowrap; cursor: pointer; }
#wrapwrap .ww-ddocs button.dd-dpill span { font-family: var(--font-mono); font-size: 12px; font-weight: 500; opacity: .7; }
#wrapwrap .ww-ddocs button.dd-dpill[aria-pressed="true"] { background: #fff; color: var(--ink-900); box-shadow: 0 1px 2px rgba(20,20,20,.08); }
#wrapwrap .ww-ddocs .dd-dtools__r { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-ddocs .dd-dgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
#wrapwrap .ww-ddocs .dd-dcard { display: grid; grid-template-columns: 180px minmax(0, 1fr); min-width: 0; border: 1px solid var(--border-1); border-radius: 14px; background: #fff; overflow: hidden; cursor: pointer; transition: box-shadow .15s ease-out; }
#wrapwrap .ww-ddocs .dd-dcard[hidden] { display: none; }
#wrapwrap .ww-ddocs .dd-dcard:hover { box-shadow: var(--dd-shadow); }
#wrapwrap .ww-ddocs .dd-dcard:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--green-500); }
#wrapwrap .ww-ddocs .dd-dcard__v { display: flex; align-items: center; justify-content: center; padding: 22px; background: var(--ink-50); }
#wrapwrap .ww-ddocs .dd-dcard__sheet { position: relative; display: flex; flex-direction: column; width: 132px; height: 172px; border-radius: 3px; background: #fff; box-shadow: 0 1px 2px rgba(20,20,20,.08), 0 6px 18px rgba(20,20,20,.08); overflow: hidden; }
#wrapwrap .ww-ddocs .dd-dcard__band { flex: none; display: flex; align-items: center; justify-content: space-between; height: 30px; padding: 0 8px; background: var(--ink-900); }
#wrapwrap .ww-ddocs .dd-dcard__mk { width: 16px; height: 16px; border-radius: 3px; font-size: 7px; }
#wrapwrap .ww-ddocs .dd-dcard__x { font-family: var(--font-mono); font-size: 8px; color: #ECF22E; }
#wrapwrap .ww-ddocs .dd-dcard__img { flex: 1; min-height: 0; width: 100%; object-fit: cover; object-position: top; }
#wrapwrap .ww-ddocs .dd-dcard__cv { flex: 1; min-height: 0; width: 100%; object-fit: contain; object-position: top; }
#wrapwrap .ww-ddocs .dd-dcard__ph { flex: 1; display: grid; align-content: start; gap: 6px; padding: 12px 10px; }
#wrapwrap .ww-ddocs .dd-dcard__ph > i { display: block; height: 40px; margin-bottom: 4px; background: var(--ink-50); }
#wrapwrap .ww-ddocs .dd-dcard__ph .dd-l { display: block; height: 2px; background: var(--ink-200); }
#wrapwrap .ww-ddocs .dd-dcard__res { position: absolute; right: 6px; bottom: 6px; display: inline-flex; align-items: center; gap: 4px; height: 14px; padding: 0 6px; border-radius: 999px; background: var(--ink-900); color: #ECF22E; font-family: var(--font-mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
#wrapwrap .ww-ddocs .dd-dcard__res i { width: 4px; height: 4px; border-radius: 2px; background: #ECF22E; }
#wrapwrap .ww-ddocs .dd-dcard__b { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 22px 24px; }
#wrapwrap .ww-ddocs .dd-dcard__m { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; }
#wrapwrap .ww-ddocs .dd-dcard__k { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: var(--ink-900); color: #ECF22E; font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
#wrapwrap .ww-ddocs .dd-dcard__ref { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-ddocs h3.dd-dcard__t { margin: 12px 0 0 !important; font-family: var(--font-sans) !important; font-size: 17px !important; font-weight: 800 !important; line-height: 1.3 !important; letter-spacing: -.01em !important; color: var(--ink-900) !important; overflow-wrap: anywhere; }
#wrapwrap .ww-ddocs .dd-dcard__s { margin-top: 10px; font-size: 13px; line-height: 1.45; color: var(--text-2); }
#wrapwrap .ww-ddocs .dd-dcard__d { margin-top: 4px; font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-ddocs .dd-dcard__a { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 18px; }
#wrapwrap .ww-ddocs .dd-dbtn { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 1px solid var(--ink-200); border-radius: 8px; background: #fff; color: var(--ink-900) !important; font-family: var(--font-sans); font-size: 14px; font-weight: 700; text-decoration: none !important; cursor: pointer; }
#wrapwrap .ww-ddocs .dd-dbtn:hover { background: var(--ink-50); }
#wrapwrap .ww-ddocs .dd-dbtn svg.i { width: 16px; height: 16px; }
#wrapwrap .ww-ddocs a.dd-rfoot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 28px; padding: 22px 26px; border: 1px solid var(--border-1); border-radius: 14px; background: #fff; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-ddocs a.dd-rfoot:hover { box-shadow: var(--dd-shadow); }
#wrapwrap .ww-ddocs a.dd-rfoot > span:first-child { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-ddocs .dd-rfoot__t { font-size: 17px; font-weight: 800; letter-spacing: -.01em; }
#wrapwrap .ww-ddocs .dd-rfoot__s { font-size: 14px; color: var(--text-2); }
#wrapwrap .ww-ddocs .dd-rfoot__go { flex: none; display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; }
#wrapwrap .ww-ddocs .dd-facts__w[hidden], #wrapwrap .ww-ddocs .dd-dv__conf[hidden] { display: none !important; }
#wrapwrap .ww-ddocs p.dd-dv__conf { display: flex; gap: 10px; align-items: flex-start; margin: 0 !important; padding: 12px 14px; border-radius: 10px; background: var(--ink-50); font-family: var(--font-sans) !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-ddocs p.dd-dv__conf svg.i { width: 16px; height: 16px; margin-top: 2px; }
#wrapwrap .ww-ddocs .dd-dv--res .dd-dv__dl { background: var(--ink-900); color: #fff !important; box-shadow: none; }
#wrapwrap .ww-ddocs .dd-dv--res .dd-dv__dl:hover { background: #000; }
@media (max-width: 1280px) { #wrapwrap .ww-ddocs .dd-dgrid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  #wrapwrap .ww-ddocs .dd-rhero { padding: 26px 20px 20px 44px; border-radius: 14px; }
  #wrapwrap .ww-ddocs .dd-rhero::before { left: 25px; top: 42px; height: 120px; }
  #wrapwrap .ww-ddocs .dd-rhero__dot { left: 19px; top: 28px; width: 13px; height: 13px; }
  #wrapwrap .ww-ddocs h1.dd-rhero__t { font-size: 32px !important; }
  #wrapwrap .ww-ddocs p.dd-rhero__p { font-size: 15px !important; }
  #wrapwrap .ww-ddocs .dd-rhero__f { margin-left: -24px; gap: 10px; }
  #wrapwrap .ww-ddocs .dd-dtools { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }
  #wrapwrap .ww-ddocs .dd-dtools__r { display: none; }
  #wrapwrap .ww-ddocs .dd-dcard { grid-template-columns: 112px minmax(0, 1fr); }
  #wrapwrap .ww-ddocs .dd-dcard__v { padding: 14px 10px; }
  #wrapwrap .ww-ddocs .dd-dcard__sheet { width: 88px; height: 116px; }
  #wrapwrap .ww-ddocs .dd-dcard__band { height: 22px; padding: 0 6px; }
  #wrapwrap .ww-ddocs .dd-dcard__b { padding: 16px 14px; }
  #wrapwrap .ww-ddocs h3.dd-dcard__t { font-size: 15px !important; }
  #wrapwrap .ww-ddocs .dd-dcard__a { gap: 8px; }
  #wrapwrap .ww-ddocs .dd-dbtn { height: 36px; padding: 0 12px; font-size: 13px; }
  #wrapwrap .ww-ddocs a.dd-rfoot { flex-direction: column; align-items: flex-start; padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  #wrapwrap .ww-ddocs .is-loading .dd-l, #wrapwrap .ww-ddocs .is-loading .dd-big i, #wrapwrap .ww-ddocs .is-loading .dd-sheet i, #wrapwrap .ww-ddocs .dd-dv__bar.is-indet i { animation: none; }
  #wrapwrap .ww-ddocs .dd-dv__cv, #wrapwrap .ww-ddocs .dd-dv__img, #wrapwrap .ww-ddocs .dd-nc__cv, #wrapwrap .ww-ddocs .dd-nc__img { transition: none; transform: none; }
}
#wrapwrap .ww-ddocs .dd-dv__tag { position: absolute; left: 12px; bottom: 12px; padding: 4px 8px; border-radius: 4px; background: rgba(20,20,20,.72); color: #fff; font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
#wrapwrap .ww-ddocs .dd-dv__p2 { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--green-700); }
#wrapwrap .ww-ddocs h2.dd-dv__h2 { margin: 6px 0 0 !important; font-family: var(--font-sans) !important; font-size: 26px !important; font-weight: 900 !important; line-height: 1.08 !important; letter-spacing: -.035em !important; color: var(--ink-900) !important; text-wrap: pretty; overflow-wrap: anywhere; }
#wrapwrap .ww-ddocs h2.dd-dv__h2 i { font-style: normal; color: var(--green-500); }
#wrapwrap .ww-ddocs dl.dd-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0 !important; border: 1px solid var(--border-1); border-radius: 10px; background: var(--border-1); overflow: hidden; }
#wrapwrap .ww-ddocs .dd-facts > div { display: grid; gap: 2px; padding: 12px 14px; background: #fff; min-width: 0; }
#wrapwrap .ww-ddocs .dd-facts dt { margin: 0 !important; font-family: var(--font-mono); font-size: 10px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-ddocs .dd-facts dd { margin: 0 !important; font-size: 14px; font-weight: 700; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-ddocs .dd-dv__f { flex: none; display: flex; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-ddocs .dd-dv__f .dash-btn { min-height: 44px; }
#wrapwrap .ww-ddocs .dd-dv__f .dd-dv__dl { flex: 1; justify-content: center; gap: 8px; }
#wrapwrap .ww-ddocs .dd-dv__f [hidden] { display: none !important; }
html.dd-lock, html.dd-lock body { overflow: hidden; }
@media (max-width: 760px) {
  #wrapwrap .ww-ddocs p.dd-intro { font-size: 15px !important; }
  #wrapwrap .ww-ddocs a.dd-resb { gap: 14px; padding: 14px 16px; }
  #wrapwrap .ww-ddocs .dd-resb__th { display: none; }
  #wrapwrap .ww-ddocs .dd-resb__t b { font-size: 15px; }
  #wrapwrap .ww-ddocs .dd-tools { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 12px; }   /* avec wrap, « stretch » prend la largeur du plus large -> debordement (vu le 09/10) */
  #wrapwrap .ww-ddocs .dd-pills { margin: 0 -16px; padding: 0 16px; scroll-padding-inline: 16px; }
  #wrapwrap .ww-ddocs .dd-tools__r { flex-wrap: nowrap; width: 100%; min-width: 0; }
  #wrapwrap .ww-ddocs label.dd-search { flex: 1 1 0; width: auto; min-width: 0; height: 44px; }
  #wrapwrap .ww-ddocs .dd-sort button { width: 44px; height: 38px; padding: 0; justify-content: center; }
  #wrapwrap .ww-ddocs .dd-sort button span { display: none; }
  #wrapwrap .ww-ddocs .dd-new__g { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; margin: 0 -16px; padding: 0 16px 4px; scrollbar-width: none; }
  #wrapwrap .ww-ddocs button.dd-nc { flex: 0 0 72%; scroll-snap-align: start; }
  #wrapwrap .ww-ddocs a.dd-grp__lk, #wrapwrap .ww-ddocs .dd-row__ty, #wrapwrap .ww-ddocs .dd-row__d, #wrapwrap .ww-ddocs .dd-ib--eye { display: none; }
  #wrapwrap .ww-ddocs .dd-row { grid-template-columns: 40px minmax(0, 1fr) auto; padding: 10px 4px 10px 16px; }
  #wrapwrap .ww-ddocs .dd-dv__p { top: auto; left: 0; right: 0; bottom: 0; width: auto; max-width: none; height: 92%; border-radius: 16px 16px 0 0; }
}


/* ===== invoices.css ===== */
/* ===== invoices.css — « Mes factures » /my/invoices + page d'une facture, handoff factures-v1.0 (10/10) : racine .ww-inv ; classes iv-*
   (jamais .row/.btn/.pill/.badge : Bootstrap ; jamais fa- : Font Awesome) ; le theme impose #wrapwrap b { color: black !important } -> pas de <b> ===== */
#wrapwrap .ww-inv { --iv-shadow: var(--shadow-card); --iv-red: var(--red-600); }
#wrapwrap .ww-inv svg.i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
#wrapwrap .ww-inv .iv-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
#wrapwrap .ww-inv .iv-r { text-align: right; }
#wrapwrap .ww-inv .iv-t { font-size: 15px; font-weight: 700; letter-spacing: -.01em; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-s { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-inv .iv-s.iv-mono { font-size: 12px; color: var(--text-3); }
/* en-tete */
#wrapwrap .ww-inv .iv-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px 24px; flex-wrap: wrap; margin-bottom: 24px; }
#wrapwrap .ww-inv .iv-head__t { flex: 1 1 440px; min-width: 0; }
#wrapwrap .ww-inv .dash-eyebrow { display: block; }
#wrapwrap .ww-inv h1.iv-h1 { margin: 10px 0 0 !important; overflow-wrap: anywhere; }
#wrapwrap .ww-inv--d h1.iv-h1 { font-size: 40px !important; line-height: 1.02 !important; letter-spacing: -.035em !important; }
#wrapwrap .ww-inv p.iv-intro, #wrapwrap .ww-inv p.iv-sub, #wrapwrap .ww-inv p.iv-p { font-family: var(--font-sans) !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-2) !important; text-wrap: pretty; }
#wrapwrap .ww-inv p.iv-intro { margin: 10px 0 0 !important; max-width: 600px; font-size: 17px !important; }
#wrapwrap .ww-inv p.iv-sub { margin: 8px 0 0 !important; font-size: 16px !important; }
#wrapwrap .ww-inv p.iv-sub .iv-mono { font-size: 14px; }
#wrapwrap .ww-inv p.iv-p { margin: 14px 0 0 !important; font-size: 14px !important; }
/* statuts */
#wrapwrap .ww-inv .iv-st { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 13px; font-weight: 700; white-space: nowrap; }
#wrapwrap .ww-inv .iv-st::before { content: ""; width: 7px; height: 7px; border-radius: 4px; background: currentColor; }
#wrapwrap .ww-inv .iv-st--open { background: #FFF1E0; color: #A85A00; }
#wrapwrap .ww-inv .iv-st--late { background: var(--red-100); color: var(--iv-red); }
#wrapwrap .ww-inv .iv-st--paid { background: #E3F8F1; color: var(--green-700); }
#wrapwrap .ww-inv .iv-st--ref { background: var(--ink-100); color: var(--ink-700); }
#wrapwrap .ww-inv .iv-st--l { height: 30px; padding: 0 12px; }
#wrapwrap .ww-inv .iv-h { font-size: 12px; font-weight: 700; white-space: nowrap; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-h--late { color: var(--iv-red); }
#wrapwrap .ww-inv .iv-h--paid, #wrapwrap .ww-inv .iv-h--ref { color: var(--text-3); }
/* chiffres */
#wrapwrap .ww-inv .iv-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 28px; }
#wrapwrap .ww-inv .iv-kpi { display: grid; gap: 6px; align-content: start; min-width: 0; padding: 20px 22px; border: 0; border-radius: 12px; background: #fff; box-shadow: var(--iv-shadow); text-align: left; font: inherit; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-kpi__k { display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); white-space: nowrap; }
#wrapwrap .ww-inv .iv-kpi__v { font-family: var(--font-mono); font-size: 28px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; font-variant-numeric: tabular-nums; }
#wrapwrap .ww-inv .iv-kpi__s { font-size: 13px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wrapwrap .ww-inv button.iv-kpi--late { cursor: pointer; transition: box-shadow .15s ease-out; }
#wrapwrap .ww-inv button.iv-kpi--late:hover { box-shadow: var(--shadow-m), var(--iv-shadow); }
#wrapwrap .ww-inv button.iv-kpi--late:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
#wrapwrap .ww-inv .iv-kpi--late .iv-kpi__k { color: var(--iv-red); }
#wrapwrap .ww-inv .iv-kpi--late .iv-kpi__k i { width: 8px; height: 8px; border-radius: 4px; background: var(--iv-red); flex: none; }
#wrapwrap .ww-inv .iv-kpi--late .iv-kpi__v { color: var(--iv-red); }
#wrapwrap .ww-inv .iv-kpi__go { font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-inv button.iv-kpi--late.is-zero { cursor: default; }
#wrapwrap .ww-inv .iv-kpi--late.is-zero .iv-kpi__k, #wrapwrap .ww-inv .iv-kpi--late.is-zero .iv-kpi__v { color: var(--text-3); }
#wrapwrap .ww-inv .iv-kpi--late.is-zero .iv-kpi__k i { background: var(--ink-300); }
/* outils */
#wrapwrap .ww-inv .iv-tools { display: flex; justify-content: space-between; align-items: center; gap: 12px 16px; flex-wrap: wrap; margin-bottom: 16px; }
#wrapwrap .ww-inv .iv-pills { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; min-width: 0; max-width: 100%; }
#wrapwrap .ww-inv .iv-pills::-webkit-scrollbar { display: none; }
#wrapwrap .ww-inv button.iv-pill { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border: 1px solid var(--ink-200); border-radius: 999px; background: #fff; color: var(--ink-900); font-family: var(--font-sans); font-size: 14px; font-weight: 700; white-space: nowrap; cursor: pointer; }
#wrapwrap .ww-inv .iv-pill__n { font-family: var(--font-mono); font-size: 12px; font-weight: 500; opacity: .6; }
#wrapwrap .ww-inv button.iv-pill[aria-pressed="true"] { background: var(--ink-900); border-color: var(--ink-900); color: #fff; }
#wrapwrap .ww-inv .iv-search { display: flex; align-items: center; gap: 8px; width: 280px; max-width: 100%; height: 40px; margin: 0; padding: 0 12px; border: 1px solid var(--ink-200); border-radius: 8px; background: #fff; color: var(--text-3); }
#wrapwrap .ww-inv .iv-search input { flex: 1; min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; font: inherit; font-size: 14px; color: var(--ink-900); }
/* tableau */
#wrapwrap .ww-inv .iv-table { border-radius: 12px; background: #fff; box-shadow: var(--iv-shadow); overflow: hidden; }
#wrapwrap .ww-inv .iv-hd, #wrapwrap .ww-inv .iv-row { display: grid; grid-template-columns: 170px minmax(0, 1fr) 140px 112px 140px 44px; gap: 0 16px; align-items: center; padding: 0 12px 0 24px; }
#wrapwrap .ww-inv .iv-hd { min-height: 44px; border-bottom: 1px solid var(--border-1); background: var(--ink-50); font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-inv .iv-row { grid-template-areas: "ref proj due st amt dl"; min-height: 72px; padding-top: 12px; padding-bottom: 12px; border-top: 1px solid var(--border-1); cursor: pointer; }
#wrapwrap .ww-inv .iv-hd + .iv-row { border-top: 0; }
#wrapwrap .ww-inv .iv-row[hidden] { display: none !important; }
#wrapwrap .ww-inv .iv-row:hover { background: var(--ink-50); }
#wrapwrap .ww-inv .iv-row:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
#wrapwrap .ww-inv .iv-c { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-inv .iv-c > * { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wrapwrap .ww-inv .iv-c--ref { grid-area: ref; } #wrapwrap .ww-inv .iv-c--pj { grid-area: proj; } #wrapwrap .ww-inv .iv-c--due { grid-area: due; }
#wrapwrap .ww-inv .iv-c--st { grid-area: st; display: block; } #wrapwrap .ww-inv .iv-c--amt { grid-area: amt; justify-items: end; text-align: right; } #wrapwrap .ww-inv .iv-c--dl { grid-area: dl; display: flex; justify-content: flex-end; }
#wrapwrap .ww-inv a.iv-ref { font-family: var(--font-mono); font-size: 15px; font-weight: 600; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-inv .iv-c--due .iv-mono { font-size: 13px; }
#wrapwrap .ww-inv .iv-amt { font-family: var(--font-mono); font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-900); }
#wrapwrap .ww-inv a.iv-ib { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 8px; color: var(--ink-900) !important; }
#wrapwrap .ww-inv a.iv-ib:hover { background: var(--ink-100); }
#wrapwrap .ww-inv .iv-empty { display: block; padding: 48px 24px; text-align: center; color: var(--text-2); border-top: 1px solid var(--border-1); }
#wrapwrap .ww-inv .iv-empty[hidden] { display: none; }
#wrapwrap .ww-inv .iv-table.iv-empty { border-top: 0; }
#wrapwrap .ww-inv .iv-empty__t { display: block; margin-bottom: 6px; font-size: 17px; font-weight: 700; color: var(--ink-900); }
/* page d'une facture */
#wrapwrap .ww-inv .iv-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; align-items: start; }
#wrapwrap .ww-inv .iv-main { display: grid; gap: 24px; min-width: 0; }
#wrapwrap .ww-inv .iv-card { min-width: 0; padding: 24px 26px; border-radius: 12px; background: #fff; box-shadow: var(--iv-shadow); }
#wrapwrap .ww-inv .iv-sh { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; }
#wrapwrap .ww-inv .iv-sh__n { font-family: var(--font-mono); font-size: 12px; color: var(--text-3); }
#wrapwrap .ww-inv .iv-h2, #wrapwrap .ww-inv h2.iv-h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 900 !important; letter-spacing: -.025em !important; line-height: 1.15 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-inv .iv-lh, #wrapwrap .ww-inv .iv-line { display: grid; grid-template-columns: minmax(0, 1fr) 56px 104px 120px; gap: 4px 16px; }
#wrapwrap .ww-inv .iv-lh { padding: 10px 0; border-bottom: 1px solid var(--border-1); font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-inv .iv-line { grid-template-areas: "n q u t"; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-inv .iv-line__n { grid-area: n; display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-inv .iv-line__n .iv-t { line-height: 1.35; overflow-wrap: anywhere; }
#wrapwrap .ww-inv .iv-line__n .iv-s.iv-mono { overflow-wrap: anywhere; }
#wrapwrap .ww-inv .iv-line__q, #wrapwrap .ww-inv .iv-line__u, #wrapwrap .ww-inv .iv-line__t { font-size: 14px; text-align: right; white-space: nowrap; }
#wrapwrap .ww-inv .iv-line__q { grid-area: q; } #wrapwrap .ww-inv .iv-line__u { grid-area: u; color: var(--text-2); } #wrapwrap .ww-inv .iv-line__t { grid-area: t; font-weight: 600; }
#wrapwrap .ww-inv .iv-sect { padding: 16px 0 8px; border-bottom: 1px solid var(--border-1); font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-900); font-weight: 600; white-space: pre-line; }
#wrapwrap .ww-inv .iv-note { padding: 10px 0; border-bottom: 1px solid var(--border-1); font-size: 13px; line-height: 1.5; color: var(--text-2); white-space: pre-line; }
#wrapwrap .ww-inv .iv-tot { display: grid; grid-template-columns: 1fr auto; max-width: 340px; margin: 16px 0 0 auto; font-size: 14px; }
#wrapwrap .ww-inv .iv-tot dt { padding: 8px 0; font-weight: 400; color: var(--text-2); }
#wrapwrap .ww-inv .iv-tot dd { margin: 0; padding: 8px 0; text-align: right; white-space: nowrap; }
#wrapwrap .ww-inv .iv-tot .iv-tot__t { padding-top: 12px; border-top: 1px solid var(--ink-900); font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-tot dd.iv-tot__t { font-size: 18px; font-weight: 600; }
#wrapwrap .ww-inv .iv-pay__r { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; min-height: 48px; padding: 8px 0; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-inv .iv-pay__k { font-size: 13px; color: var(--text-2); }
#wrapwrap .ww-inv .iv-pay__v { font-size: 15px; font-weight: 700; color: var(--ink-900); overflow-wrap: anywhere; }
#wrapwrap .ww-inv .iv-pay__v.iv-mono { font-weight: 600; }
#wrapwrap .ww-inv .iv-hl { padding: 2px 6px; border-radius: 4px; background: var(--green-100); }
#wrapwrap .ww-inv button.iv-copy { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
#wrapwrap .ww-inv button.iv-copy:hover { background: var(--ink-100); }
#wrapwrap .ww-inv button.iv-copy.is-done { color: var(--green-700); }
#wrapwrap .ww-inv button.iv-copy svg.i { width: 16px; height: 16px; }
#wrapwrap .ww-inv .iv-call { display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: 12px; background: var(--ink-50); }
#wrapwrap .ww-inv .iv-call svg.i { color: var(--green-700); margin-top: 1px; }
#wrapwrap .ww-inv .iv-call__k { display: block; font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-call__t { display: block; margin-top: 2px; font-size: 14px; line-height: 1.5; color: var(--text-2); }
#wrapwrap .ww-inv .iv-g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
#wrapwrap .ww-inv .iv-box { display: grid; gap: 4px; align-content: start; padding: 16px 18px; border-radius: 12px; background: var(--ink-50); font-size: 14px; line-height: 1.5; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-box__k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); margin-bottom: 4px; }
/* conditions (repliees) */
#wrapwrap .ww-inv details.iv-terms { padding: 0; overflow: hidden; }
#wrapwrap .ww-inv .iv-terms summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; padding: 12px 26px; cursor: pointer; list-style: none; }
#wrapwrap .ww-inv .iv-terms summary::-webkit-details-marker { display: none; }
#wrapwrap .ww-inv .iv-terms summary:hover { background: var(--ink-50); }
#wrapwrap .ww-inv .iv-terms summary .iv-sh { margin: 0; }
#wrapwrap .ww-inv .iv-terms__tg { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; white-space: nowrap; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-terms__off { display: none; }
#wrapwrap .ww-inv .iv-terms[open] .iv-terms__on { display: none; }
#wrapwrap .ww-inv .iv-terms[open] .iv-terms__off { display: inline; }
#wrapwrap .ww-inv .iv-terms[open] .iv-terms__tg svg { transform: rotate(180deg); }
#wrapwrap .ww-inv .iv-terms__dl { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr); margin: 0; padding: 0 26px 20px; }
#wrapwrap .ww-inv .iv-terms__dl dt { padding: 12px 16px 12px 0; border-top: 1px solid var(--border-1); font-size: 13px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-terms__dl dd { margin: 0; padding: 12px 0; border-top: 1px solid var(--border-1); font-size: 14px; line-height: 1.5; color: var(--text-2); text-wrap: pretty; }
/* echanges (composant commun .wwc) */
#wrapwrap .ww-inv .iv-chat { padding: 0; overflow: hidden; }
#wrapwrap .ww-inv button.iv-chat__h { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; padding: 12px 26px; border: 0; background: transparent; font: inherit; text-align: left; cursor: pointer; }
#wrapwrap .ww-inv button.iv-chat__h:hover { background: var(--ink-50); }
#wrapwrap .ww-inv .iv-chat__h .iv-sh { margin: 0; }
#wrapwrap .ww-inv .iv-chat__b { padding: 0 26px 24px; }
/* colonne d'action */
#wrapwrap .ww-inv .iv-aside { position: sticky; top: 84px; display: grid; gap: 16px; min-width: 0; }
#wrapwrap .ww-inv .iv-sum { display: grid; gap: 14px; padding: 22px 24px; }
#wrapwrap .ww-inv .iv-sum__a { display: grid; gap: 4px; }
#wrapwrap .ww-inv .iv-sum__v { font-family: var(--font-mono); font-size: 32px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--ink-900); }
#wrapwrap .ww-inv .iv-sum__dl { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; margin: 0; padding: 12px 0; border-top: 1px solid var(--border-1); border-bottom: 1px solid var(--border-1); font-size: 14px; }
#wrapwrap .ww-inv .iv-sum__dl dt { font-weight: 400; color: var(--text-2); }
#wrapwrap .ww-inv .iv-sum__dl dd { margin: 0; text-align: right; white-space: nowrap; }
#wrapwrap .ww-inv .iv-sum__dl dd.iv-h { font-size: 14px; }
#wrapwrap .ww-inv .iv-btn { width: 100%; }
#wrapwrap .ww-inv .iv-links { padding: 8px 24px; }
#wrapwrap .ww-inv a.iv-lk { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; min-height: 56px; padding: 8px 0; border-bottom: 1px solid var(--border-1); color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-inv a.iv-lk:last-child { border-bottom: 0; }
#wrapwrap .ww-inv a.iv-lk > span { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-inv a.iv-lk .iv-t { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wrapwrap .ww-inv .iv-lk__k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .ww-inv .iv-ca { display: grid; gap: 12px; padding: 18px 20px; border-radius: 12px; background: var(--ink-50); }
#wrapwrap .ww-inv .iv-ca__r { display: flex; gap: 12px; align-items: center; min-width: 0; }
#wrapwrap .ww-inv .iv-ca__r > span:last-child { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-inv .iv-ca__av { flex: none; width: 40px; height: 40px; border-radius: 20px; overflow: hidden; background: var(--ink-900); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; }
#wrapwrap .ww-inv .iv-ca__av img { width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww-inv .iv-ca .dash-btn--secondary { background: #fff; }
@media (max-width: 1180px) {
  #wrapwrap .ww-inv .iv-grid { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-inv .iv-aside { position: static; order: -1; }
  #wrapwrap .ww-inv .iv-hd { display: none; }
  #wrapwrap .ww-inv .iv-row { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "ref amt" "proj st" "due dl"; gap: 8px 16px; padding: 16px 12px 12px 20px; }
  #wrapwrap .ww-inv .iv-c--st { justify-self: end; }
  #wrapwrap .ww-inv .iv-row .iv-c--dl { align-self: end; }
}
@media (max-width: 760px) {
  #wrapwrap .ww-inv p.iv-intro { font-size: 15px !important; }
  #wrapwrap .ww-inv--d h1.iv-h1 { font-size: 32px !important; }
  #wrapwrap .ww-inv .iv-kpis { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 0 -16px 24px; padding: 0 16px 4px; scrollbar-width: none; }
  #wrapwrap .ww-inv .iv-kpis::-webkit-scrollbar { display: none; }
  #wrapwrap .ww-inv .iv-kpis > * { flex: 0 0 78%; scroll-snap-align: start; }
  #wrapwrap .ww-inv .iv-tools { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }   /* en colonne : jamais wrap (lecon du 09/10) */
  #wrapwrap .ww-inv .iv-pills { margin: 0 -16px; padding: 0 16px; }
  #wrapwrap .ww-inv .iv-search { width: 100%; height: 44px; }
  #wrapwrap .ww-inv .iv-card { padding: 20px 18px; }
  #wrapwrap .ww-inv .iv-terms summary, #wrapwrap .ww-inv button.iv-chat__h { padding: 12px 18px; }
  #wrapwrap .ww-inv .iv-terms__dl { grid-template-columns: minmax(0, 1fr); padding: 0 18px 16px; }
  #wrapwrap .ww-inv .iv-terms__dl dt { padding-bottom: 0; }
  #wrapwrap .ww-inv .iv-terms__dl dt:empty { display: none; }
  #wrapwrap .ww-inv .iv-terms__dl dt:not(:empty) + dd { border-top: 0; padding-top: 4px; }
  #wrapwrap .ww-inv .iv-chat__b { padding: 0 18px 20px; }
  #wrapwrap .ww-inv .iv-lh { display: none; }
  #wrapwrap .ww-inv .iv-line { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "n n" "q t"; }
  #wrapwrap .ww-inv .iv-line__u { display: none; }
  #wrapwrap .ww-inv .iv-line__q { text-align: left; color: var(--text-2); }
  #wrapwrap .ww-inv .iv-line__q::before { content: "Qté "; font-family: var(--font-sans); }
  #wrapwrap .ww-inv .iv-pay__r { grid-template-columns: minmax(0, 1fr) auto; }
  #wrapwrap .ww-inv .iv-pay__k { grid-column: 1 / -1; }
  #wrapwrap .ww-inv .iv-g2 { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-inv .iv-tot { max-width: none; }
}


/* ===== preview.css ===== */
/* ===== preview.css — apercu des plans et documents (handoff apercu-documents-v1.0, 10/10) : volet .wwp-* ===== */
html.wwp-lock, html.wwp-lock body { overflow: hidden !important; }
#wrapwrap .wwp { position: fixed; inset: 0; z-index: 1080; display: flex; align-items: center; justify-content: center; padding: 12px; }
#wrapwrap .wwp[hidden] { display: none !important; }
#wrapwrap .wwp__veil { position: absolute; inset: 0; background: rgba(20, 20, 20, .5); }
#wrapwrap .wwp__p { position: relative; display: flex; flex-direction: column; width: min(780px, 100%); height: 100%; border-radius: 14px; background: #fff; overflow: hidden; box-shadow: var(--shadow-l, 0 16px 40px rgba(20, 20, 20, .16)); }
#wrapwrap .wwp__p:focus { outline: none; }
/* second volet, colle a gauche de la fiche laterale (480 px + 12 + 12) */
#wrapwrap .wwp--side { inset: auto; padding: 0; pointer-events: none; }
#wrapwrap .wwp--side .wwp__veil { display: none; }
#wrapwrap .wwp--side .wwp__p { position: fixed; top: 12px; bottom: 12px; right: 504px; width: min(780px, calc(100% - 528px)); height: auto; pointer-events: auto; }
/* barre du haut */
#wrapwrap .wwp__h { flex: none; display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 6px 10px 6px 20px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .wwp__ti { flex: 1; min-width: 0; display: grid; gap: 2px; }
#wrapwrap .wwp__k { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
#wrapwrap .wwp__t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-sans); font-size: 15px; font-weight: 700; color: var(--ink-900); }
#wrapwrap .wwp__zoom { flex: none; display: flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--border-1); border-radius: 10px; }
#wrapwrap .wwp__zv { min-width: 52px; text-align: center; font-family: var(--font-mono); font-size: 12px; color: var(--ink-900); font-variant-numeric: tabular-nums; }
html body #wrapwrap .wwp button.wwp__zb, html body #wrapwrap .wwp .wwp__ib, html body #wrapwrap .wwp button.wwp__nav { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900) !important; text-decoration: none !important; cursor: pointer; }
html body #wrapwrap .wwp button.wwp__zb { width: 34px; height: 34px; }
html body #wrapwrap .wwp button.wwp__zb:hover, html body #wrapwrap .wwp .wwp__ib:hover, html body #wrapwrap .wwp button.wwp__nav:hover { background: var(--ink-100); }
html body #wrapwrap .wwp button:disabled { opacity: .35; cursor: default; background: transparent; }
html body #wrapwrap .wwp button.wwp__back { display: none; flex: none; align-items: center; gap: 8px; height: 44px; margin: 0; padding: 0 10px 0 4px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-900); font-family: var(--font-sans); font-size: 14px; font-weight: 700; cursor: pointer; }
#wrapwrap .wwp svg.wwp-i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
#wrapwrap .wwp :focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-500); }
/* chargement */
#wrapwrap .wwp__bar { flex: none; height: 3px; background: var(--ink-100); overflow: hidden; }
#wrapwrap .wwp__bar[hidden] { display: none; }
#wrapwrap .wwp__bar i { display: block; height: 100%; width: var(--p, 30%); background: var(--green-500); transition: width .2s ease-out; }
#wrapwrap .wwp__bar.is-indet i { width: 30%; animation: wwp-indet 1.1s ease-in-out infinite; }
@keyframes wwp-indet { 0% { transform: translateX(-100%); } 100% { transform: translateX(340%); } }
/* lecture : une page, blanche, ombree ; au-dela de 100 % elle defile */
#wrapwrap .wwp__b { flex: 1; min-height: 0; overflow: auto; background: var(--ink-100); overscroll-behavior: contain; }
#wrapwrap .wwp__fr { min-height: 100%; min-width: 100%; width: max-content; display: flex; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; }
#wrapwrap .wwp__pg { display: block; height: auto; background: #fff; box-shadow: 0 1px 2px rgba(20, 20, 20, .08), 0 8px 24px rgba(20, 20, 20, .12); }
html body #wrapwrap .wwp p.wwp__st { margin: 0 !important; font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--text-3) !important; }
/* barre du bas : pages + mention */
#wrapwrap .wwp__ft { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px 20px; min-height: 64px; padding: 8px 16px; border-top: 1px solid var(--border-1); background: #fff; }
#wrapwrap .wwp__pages { flex: 0 1 auto; min-width: 0; display: flex; align-items: center; gap: 6px; }
#wrapwrap .wwp__pages[hidden] { display: none; }
#wrapwrap .wwp__thumbs { min-width: 0; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px; }
#wrapwrap .wwp__thumbs::-webkit-scrollbar { display: none; }
html body #wrapwrap .wwp button.wwp__th { flex: none; display: flex; align-items: flex-end; justify-content: center; width: 30px; height: 40px; margin: 0; padding: 0 0 3px; border: 1px solid var(--border-1); border-radius: 3px; background: #fff; color: var(--text-2); font-family: var(--font-mono); font-size: 10px; cursor: pointer; }
html body #wrapwrap .wwp button.wwp__th:hover { border-color: var(--ink-400); }
html body #wrapwrap .wwp button.wwp__th.is-on { border: 2px solid var(--green-500); color: var(--ink-900); }
html body #wrapwrap .wwp p.wwp__conf { flex: 1 1 260px; display: flex; align-items: flex-start; gap: 8px; max-width: 360px; margin: 0 0 0 auto !important; font-family: var(--font-sans) !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.45 !important; color: var(--text-2) !important; }
#wrapwrap .wwp__conf[hidden] { display: none !important; }
#wrapwrap .wwp__conf svg.wwp-i { width: 15px; height: 15px; margin-top: 1px; }
@media (prefers-reduced-motion: reduce) { #wrapwrap .wwp__bar.is-indet i { animation: none; width: 100%; opacity: .5; } }
/* 761-1100 px : toute la largeur, au-dessus de la fiche */
@media (max-width: 1100px) { #wrapwrap .wwp--side .wwp__p { left: 12px; right: 12px; width: auto; } }
/* telephone : plein ecran, « Retour a la fiche », pas de zoom (pincement), vignettes qui defilent, mention sous les vignettes */
@media (max-width: 760px) {
  #wrapwrap .wwp { padding: 0; }
  #wrapwrap .wwp__p, #wrapwrap .wwp--side .wwp__p { inset: 0; width: 100%; height: 100%; border-radius: 0; }
  #wrapwrap .wwp__h { padding: 6px 8px; }
  #wrapwrap .wwp__zoom { display: none; }
  html body #wrapwrap .wwp.wwp--side button.wwp__back { display: inline-flex; }   /* priorite > regle de base des boutons */
  html body #wrapwrap .wwp.wwp--side .wwp__ib.wwp__c { display: none; }
  html body #wrapwrap .wwp--side button.wwp__back span { display: none; }   /* fleche seule : le titre reste lisible */
  #wrapwrap .wwp__ft { flex-direction: column; align-items: stretch; gap: 8px; padding: 8px 12px 12px; }
  #wrapwrap .wwp__pages { width: 100%; }
  #wrapwrap .wwp__thumbs { flex: 1; }
  html body #wrapwrap .wwp p.wwp__conf { max-width: none; margin: 0 !important; }
  #wrapwrap .wwp__fr { padding: 12px; }
}


/* ===== admin.css ===== */

/* ===== Administration : comptes de la plateforme /my/admin-comptes (Charles 03/10) : racine .ww-admin (réutilise .ww-account / .ac-*) ===== */
#wrapwrap .ww-admin .ad-sum { margin-top: 6px; }
#wrapwrap .ww-admin .ad-search { position: relative; display: block; width: min(360px, 100%); flex: none; }
#wrapwrap .ww-admin .ad-search .ac-i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--text-3); pointer-events: none; }
html body #wrapwrap .ww-admin .ad-search input.ac-in { padding-left: 40px; }
#wrapwrap .ww-admin .ad-warn { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 18px; padding: 12px 14px; border-radius: 10px; background: var(--red-100, #FBE3DF); color: var(--ink-900) !important; font-size: 14px !important; line-height: 1.5 !important; }
#wrapwrap .ww-admin .ad-warn .ac-i { color: var(--red-600, #C8321E); margin-top: 2px; }
#wrapwrap .ww-admin .ad-warn--todo { background: var(--ink-100, #E4E4E1); }
#wrapwrap .ww-admin .ad-list { display: grid; gap: 16px; }
#wrapwrap .ww-admin .ad-co[hidden], #wrapwrap .ww-admin .ad-none[hidden] { display: none !important; }
#wrapwrap .ww-admin .ad-co__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 12px; }
#wrapwrap .ww-admin .ad-co__head .ac-h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
#wrapwrap .ww-admin .ad-tag { white-space: nowrap; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; border: 1px solid var(--ink-300, #C4C4C1); font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase; color: var(--text-2) !important; }
#wrapwrap .ww-admin .ad-tag--type { border-color: var(--green-700, #00875F); color: var(--green-700, #00875F) !important; }
#wrapwrap .ww-admin .ad-tag--todo { border-style: dashed; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-co__side { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px 16px; }
#wrapwrap .ww-admin .ad-type { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
#wrapwrap .ww-admin .ad-type__l { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 13px !important; color: var(--text-3) !important; white-space: nowrap; }
html body #wrapwrap .ww-admin select.ad-type__sel { height: 36px; width: auto; min-width: 140px; padding: 0 34px 0 10px; background-position: right 10px center; }   /* chevron du select.ac-in (05/10) */
#wrapwrap .ww-admin .ad-tag--disc { border-color: var(--ink-900); color: var(--ink-900) !important; }
html body #wrapwrap .ww-admin input.ad-disc__in { height: 36px; width: 76px; padding: 0 8px; text-align: right; }
#wrapwrap .ww-admin .ad-tag--pro { border-color: var(--ink-900); background: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-admin .ad-user { grid-template-columns: 36px minmax(0, 1.2fr) minmax(0, 1.2fr) auto auto auto; }
#wrapwrap .ww-admin .ad-user__last { font-size: 13px !important; color: var(--text-3) !important; white-space: nowrap; }
#wrapwrap .ww-admin .ad-user__acts { display: inline-flex; align-items: center; gap: 8px; }
#wrapwrap .ww-admin .ad-inline { display: inline; margin: 0; }
html body #wrapwrap .ww-admin button.ad-btn { height: 36px; padding: 0 12px; font-size: 13px !important; }
#wrapwrap .ww-admin a.ad-link { display: inline-flex; align-items: center; gap: 6px; font-size: 13px !important; color: var(--text-2) !important; text-decoration: none !important; white-space: nowrap; }
#wrapwrap .ww-admin a.ad-link:hover { color: var(--ink-900) !important; }
#wrapwrap .ww-admin .ad-add { border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .ad-add__sum { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px; cursor: pointer; font-weight: 700; list-style: none; }
#wrapwrap .ww-admin .ad-add__sum::-webkit-details-marker { display: none; }
#wrapwrap .ww-admin .ad-add__form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 12px; align-items: end; padding: 4px 20px 18px; }
#wrapwrap .ww-admin .ad-add__h { grid-column: 1 / -1; font-size: 13px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-tools { display: flex; align-items: center; gap: 8px; flex: none; }
#wrapwrap .ww-admin .ad-msg__n { font-weight: 400; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-msg__form { grid-template-columns: minmax(0, 1fr) auto; }
#wrapwrap .ww-admin .ad-msg__subj, #wrapwrap .ww-admin .ad-msg__body { grid-column: 1 / -1; }
html body #wrapwrap .ww-admin textarea.ad-msg__ta { height: auto; min-height: 120px; padding: 10px 12px; resize: vertical; line-height: 1.5 !important; }
#wrapwrap .ww-admin .ad-msg__form .dash-btn { grid-column: 2; justify-self: end; }
/* onglets : ceux du compte puis l'administration (Charles 04/10 : « pilotage est dans la partie engrenage de mon compte ») — même trait que button.ac-tab */
html body #wrapwrap .ww-account a.ac-tab { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 48px; margin: 0 0 -1px; padding: 0 14px; border-bottom: 2px solid transparent; font-family: var(--font-sans); font-size: 15px; font-weight: 500; color: var(--text-2) !important; text-decoration: none !important; }
html body #wrapwrap .ww-account a.ac-tab:hover { color: var(--ink-900) !important; }
html body #wrapwrap .ww-account a.ac-tab[aria-current="page"] { border-bottom-color: var(--ink-900); color: var(--ink-900) !important; font-weight: 700; }
#wrapwrap .ww-account .ac-tabs__sep { flex: none; align-self: center; width: 1px; height: 22px; margin: 0 8px; background: var(--border-1); }
#wrapwrap .ww-admin .ad-intro { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 16px; }
#wrapwrap .ww-admin .ad-intro .ad-sum { margin: 0; }
/* Pilotage : ligne « À relancer » vers la liste « À faire aujourd'hui » de Sociétés (Charles 04/10) */
#wrapwrap .ww-admin a.ad-relance { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0 0 12px; padding: 12px 16px; border: 1px solid var(--border-1); border-radius: 10px; background: #fff; color: var(--ink-900) !important; font-size: 14px !important; text-decoration: none !important; }
#wrapwrap .ww-admin a.ad-relance:hover { border-color: var(--ink-900); }
#wrapwrap .ww-admin .ad-relance__l { flex: 1 1 auto; color: var(--text-2) !important; }
#wrapwrap .ww-admin .ad-relance__go { font-weight: 700; white-space: nowrap; }
#wrapwrap .ww-admin .ad-pane[hidden] { display: none !important; }
/* Communication */
#wrapwrap .ww-admin .ad-u { display: none !important; }
#wrapwrap .ww-admin .ad-table--hist th[scope="row"] { white-space: normal; min-width: 160px; }
#wrapwrap .ww-admin .ad-table--hist th[scope="row"] small { display: block; margin-top: 2px; font-size: 12px !important; }
#wrapwrap .ww-admin .ad-table--hist th[scope="row"] small.ad-only-m { display: none; }
/* Pilotage : meilleur utilisateur par type (Charles 04/10) */
#wrapwrap .ww-admin .ad-bests { margin: 0 0 16px; }
#wrapwrap .ww-admin .ad-bests .ac-h2 small { display: block; margin: 4px 0 0; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .08em !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-bests__g { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 10px; }
#wrapwrap .ww-admin .ad-best { display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: 10px; row-gap: 2px; align-content: start; padding: 16px 18px; }
#wrapwrap .ww-admin .ad-best__k { grid-column: 1 / -1; margin-bottom: 8px; font-family: var(--font-mono) !important; font-size: 11px !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--green-700, #00875F) !important; }
#wrapwrap .ww-admin .ad-best .ac-av { grid-row: span 2; align-self: center; }
#wrapwrap .ww-admin .ad-best__n { grid-column: 2; font-size: 15px !important; overflow-wrap: anywhere; }
#wrapwrap .ww-admin .ad-best__co { grid-column: 2; font-size: 13px !important; color: var(--text-3) !important; overflow-wrap: anywhere; }
#wrapwrap .ww-admin .ad-best__s { grid-column: 1 / -1; margin-top: 10px; font-size: 14px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .ad-best .ad-link { grid-column: 1 / -1; justify-self: start; margin-top: 6px; }
#wrapwrap .ww-admin .ad-best__none { grid-column: 1 / -1; margin: 0; font-size: 14px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0 0 12px; }
#wrapwrap .ww-admin .ad-kpi__l em { display: block; margin-top: 4px; font-style: normal; font-family: var(--font-mono) !important; font-size: 10px !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--green-700, #00875F) !important; }
#wrapwrap .ww-admin .ad-tabs2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 12px; margin: 0 0 16px; }
#wrapwrap .ww-admin .ad-tab { padding: 18px 20px; }
#wrapwrap .ww-admin .ad-note { margin: -4px 0 16px; font-size: 13px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-tabs2 { margin-bottom: 12px; }
#wrapwrap .ww-admin .ad-tab__t { margin: 0 0 10px; font-size: 15px !important; font-weight: 700 !important; }
#wrapwrap .ww-admin .ad-table { width: 100%; min-width: 0; border: 0; border-radius: 0; overflow: visible; border-collapse: collapse; font-size: 14px !important; }
/* les tableaux de .ww-dash deviennent des cartes empilées sous 900 px : pas ceux-ci (4 colonnes courtes) */
#wrapwrap .ww-admin .ad-table { display: table; }
#wrapwrap .ww-admin .ad-table thead { display: table-header-group; }
#wrapwrap .ww-admin .ad-table tbody { display: table-row-group; }
#wrapwrap .ww-admin .ad-table tr { display: table-row; margin: 0; padding: 0; border: 0; border-radius: 0; }
#wrapwrap .ww-admin .ad-table th, #wrapwrap .ww-admin .ad-table td { display: table-cell; padding: 8px 6px; background: none; border: 0; border-bottom: 1px solid var(--border-1) !important; text-align: right; white-space: nowrap; font-size: 14px !important; color: var(--text-1) !important; }
#wrapwrap .ww-admin .ad-table tbody tr:last-child th, #wrapwrap .ww-admin .ad-table tbody tr:last-child td { border-bottom: 0 !important; }
#wrapwrap .ww-admin .ad-table thead th { white-space: normal; vertical-align: bottom; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-table th[scope="row"], #wrapwrap .ww-admin .ad-table thead th:first-child { text-align: left; font-weight: 600; }
#wrapwrap .ww-admin .ad-table .ad-table__p { display: inline; margin: 0; font-size: 12px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-table th[scope="row"] small { font-weight: 400; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-table td { font-family: var(--font-mono) !important; }
#wrapwrap .ww-admin .ad-bar { display: inline-block; vertical-align: middle; width: 64px; height: 6px; margin-right: 8px; border-radius: 3px; background: linear-gradient(90deg, var(--ink-900) var(--w, 0%), var(--ink-100, #E4E4E1) var(--w, 0%)); }
#wrapwrap .ww-admin .ad-bar--g { background: linear-gradient(90deg, var(--green-600, #00C497) var(--w, 0%), var(--ink-100, #E4E4E1) var(--w, 0%)); }
#wrapwrap .ww-admin .ad-kpi { display: grid; gap: 6px; padding: 18px 20px; }
#wrapwrap .ww-admin .ad-kpi__v { font-family: var(--font-mono) !important; font-size: 28px !important; font-weight: 600 !important; letter-spacing: -.02em !important; line-height: 1.1 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .ad-kpi__v small { font-size: 15px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-kpi__l { font-size: 13px !important; color: var(--text-2) !important; line-height: 1.4 !important; }
#wrapwrap .ww-admin .ad-todo { margin: 0 0 16px; padding: 20px; display: grid; gap: 8px; }
#wrapwrap .ww-admin .ad-todo__s { border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .ad-todo__h { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; cursor: pointer; font-weight: 700; list-style: none; }
#wrapwrap .ww-admin .ad-todo__h::-webkit-details-marker { display: none; }
#wrapwrap .ww-admin .ad-todo__n { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 8px; border-radius: 999px; background: var(--red-600, #C8321E); color: #fff !important; font-family: var(--font-mono) !important; font-size: 12px !important; }
#wrapwrap .ww-admin .ad-todo__n.is-zero { background: var(--ink-100, #E4E4E1); color: var(--text-2) !important; }
#wrapwrap .ww-admin .ad-todo__l { display: grid; gap: 2px; margin: 0 0 12px; padding: 0; list-style: none; }
#wrapwrap .ww-admin .ad-todo__i { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 40px; padding: 6px 0; border-bottom: 1px dashed var(--border-1); }
#wrapwrap .ww-admin .ad-todo__co, #wrapwrap .ww-admin .ad-todo__d { font-size: 13px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-todo__i .ad-link { margin-left: auto; }
#wrapwrap .ww-admin .ad-todo__ok { margin: 0 0 12px; font-size: 14px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .ad-none { padding: 24px; text-align: center; color: var(--text-3) !important; }
@media (max-width: 900px) {
  #wrapwrap .ww-admin .ad-user { grid-template-columns: 36px minmax(0, 1fr) auto; }
  #wrapwrap .ww-admin .ad-user .ac-user__mail, #wrapwrap .ww-admin .ad-user__last { grid-column: 2 / -1; }
  #wrapwrap .ww-admin .ad-user__acts { grid-column: 2 / -1; }
  #wrapwrap .ww-admin .ad-add__form { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-admin .ad-search { width: 100%; }
  #wrapwrap .ww-admin .ad-tools { align-items: stretch; }
  #wrapwrap .ww-admin .ad-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #wrapwrap .ww-admin .ad-kpis > .ad-kpi:last-child { grid-column: 1 / -1; }
  #wrapwrap .ww-admin .ad-tabs2 { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-admin .ad-bests__g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #wrapwrap .ww-admin .ad-hist, #wrapwrap .ww-admin .ad-mm { overflow-x: auto; }
  #wrapwrap .ww-admin .ad-tab { overflow-x: auto; }
  #wrapwrap .ww-admin .ad-bar { width: 36px; }
  #wrapwrap .ww-admin .ad-todo__i .ad-link { margin-left: 0; }
  #wrapwrap .ww-admin .ad-msg__form .dash-btn { grid-column: 1; justify-self: stretch; }
  html body #wrapwrap .ww-admin button.ad-btn, #wrapwrap .ww-admin a.ad-link { min-height: 44px; }   /* cible tactile */
  #wrapwrap .ww-admin .ad-co__head { flex-direction: column; align-items: stretch; }   /* conditions sous le nom de la société */
  #wrapwrap .ww-admin .ad-co__side { justify-content: flex-start; }
  #wrapwrap .ww-admin .ad-type { flex-wrap: wrap; }
  html body #wrapwrap .ww-admin select.ad-type__sel, html body #wrapwrap .ww-admin input.ad-disc__in { height: 44px; }
}
/* bandeau « connecté en tant que » (toutes les pages, vue 3420) : fixé en bas, rouge, jamais masqué */
#wrapwrap .ww-imp { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1090; display: flex; align-items: center; gap: 12px; padding: 12px 20px; background: var(--red-600, #C8321E); color: #fff !important; font-size: 14px !important; line-height: 1.4 !important; box-shadow: 0 -6px 18px rgba(20, 20, 20, .18); }
#wrapwrap .ww-imp__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: #fff; }
#wrapwrap .ww-imp__t { flex: 1 1 auto; color: #fff !important; }
#wrapwrap .ww-imp b { color: #fff !important; }
#wrapwrap a.ww-imp__back { flex: none; display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 8px; background: #fff; color: var(--red-600, #C8321E) !important; font-weight: 700; text-decoration: none !important; white-space: nowrap; }
html body:has(.ww-imp) #wrapwrap { padding-bottom: 64px; }
#wrapwrap .ww-imp-cgu { padding: 28px; gap: 12px; }
#wrapwrap .ww-imp-cgu h2 { font-size: 22px !important; font-weight: 900 !important; letter-spacing: -.02em !important; }
#wrapwrap .ww-imp-cgu .dash-btn { align-self: flex-start; }
@media (max-width: 600px) { #wrapwrap .ww-admin .ad-table thead th { letter-spacing: .02em !important; } #wrapwrap .ww-admin .ad-table--hist th[scope="row"] { min-width: 0; } #wrapwrap .ww-admin .ad-table--hist .ad-col-d { display: none; } #wrapwrap .ww-admin .ad-table--hist th[scope="row"] small.ad-only-m { display: block; } #wrapwrap .ww-admin .ad-table--hist .ad-table__p, #wrapwrap .ww-admin .ad-table--evo .ad-table__p { display: block; } #wrapwrap .ww-admin .ad-hist, #wrapwrap .ww-admin .ad-mm { padding-left: 14px; padding-right: 14px; } #wrapwrap .ww-admin .ad-tab { padding: 16px 14px; } #wrapwrap .ww-admin .ad-bar { display: none; } #wrapwrap .ww-admin .ad-table th, #wrapwrap .ww-admin .ad-table td { padding: 8px 4px; } #wrapwrap .ww-admin .ad-table th[scope="row"] small { display: block; } #wrapwrap .ww-imp { flex-wrap: wrap; } #wrapwrap a.ww-imp__back { width: 100%; justify-content: center; } }

/* ===== Pilotage v1.0 (handoff Claude Design admin-pilotage-v1.0, 05/10) : préfixe pl- ===== */
#wrapwrap .ww-admin .pl { display: grid; gap: 16px; }
#wrapwrap .ww-admin .pl-mono { font-family: var(--font-mono) !important; font-size: .92em; white-space: nowrap; }
#wrapwrap .ww-admin .pl-ey { font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .pl-seg { display: inline-flex; gap: 4px; padding: 4px; border-radius: 10px; background: #fff; box-shadow: var(--shadow-card); }
#wrapwrap .ww-admin .pl-seg a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 7px; font-size: 13px !important; font-weight: 700 !important; line-height: 1; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-admin .pl-seg a[aria-current] { background: var(--ink-100, #EDEDEA); }
#wrapwrap .ww-admin .pl-card { padding: 24px 26px; min-width: 0; }
#wrapwrap .ww-admin .pl-card__h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 0 0 18px; }
#wrapwrap .ww-admin .pl-card__t { font-size: 16px !important; font-weight: 700 !important; line-height: 1.3; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-top { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; }
#wrapwrap .ww-admin .pl-kpi { display: grid; gap: 24px; align-content: start; padding: 26px 28px; border-radius: 12px; background: var(--ink-900); color: #fff; }
#wrapwrap .ww-admin .pl-kpi__ey { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--green-500) !important; }
#wrapwrap .ww-admin .pl-dot { flex: none; width: 10px; height: 10px; border-radius: 5px; background: var(--green-500); box-shadow: 0 0 0 5px var(--point-halo, rgba(0,230,176,.28)); }
#wrapwrap .ww-admin .pl-kpi__g { display: grid; grid-template-columns: 1fr 1fr; }
#wrapwrap .ww-admin .pl-kpi__g > div { display: grid; gap: 8px; align-content: start; }
#wrapwrap .ww-admin .pl-kpi__g > div:first-child { padding-right: 24px; border-right: 1px solid rgba(255,255,255,.16); }
#wrapwrap .ww-admin .pl-kpi__g > div:last-child { padding-left: 24px; }
#wrapwrap .ww-admin .pl-kpi__n { font-family: var(--font-mono) !important; font-size: 64px !important; font-weight: 600 !important; line-height: .95 !important; letter-spacing: -.03em !important; color: #fff !important; }
#wrapwrap .ww-admin .pl-kpi__n small { margin-left: 4px; font-size: 28px !important; }
#wrapwrap .ww-admin .pl-kpi__l { font-size: 15px !important; font-weight: 700 !important; color: #fff !important; }
#wrapwrap .ww-admin .pl-kpi__s { font-size: 13px !important; line-height: 1.45 !important; color: rgba(255,255,255,.72) !important; }
#wrapwrap .ww-admin .pl-fun { display: grid; gap: 12px; }
#wrapwrap .ww-admin .pl-fun__r { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; align-items: baseline; }
#wrapwrap .ww-admin .pl-fun__l { font-size: 14px !important; line-height: 1.3; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-fun__n { font-family: var(--font-mono) !important; font-size: 15px !important; font-weight: 600 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-fun__n small { margin-left: 6px; font-size: 12px !important; font-weight: 400 !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .pl-bar { grid-column: 1 / -1; display: block; height: 8px; border-radius: 4px; background: var(--ink-100, #EDEDEA); overflow: hidden; }
#wrapwrap .ww-admin .pl-bar i { display: block; height: 100%; border-radius: 4px; background: var(--ink-900); }
#wrapwrap .ww-admin .pl-bar i.on { background: var(--green-500); }
#wrapwrap .ww-admin .pl-ctx { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .pl-ctx b { font-family: var(--font-mono) !important; font-size: 22px !important; font-weight: 600 !important; line-height: 1.2; white-space: nowrap; }
#wrapwrap .ww-admin .pl-ctx > span { flex: 1 1 200px; font-size: 13px !important; line-height: 1.4; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-sech { display: flex; align-items: baseline; gap: 12px; margin: 0 0 10px; }
#wrapwrap .ww-admin .pl-sech b { font-size: 18px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-rel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#wrapwrap .ww-admin .pl-rel__c { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 16px; align-items: center; padding: 20px 22px; }
#wrapwrap .ww-admin .pl-rel__n { grid-row: span 2; font-family: var(--font-mono) !important; font-size: 36px !important; font-weight: 600 !important; line-height: 1 !important; letter-spacing: -.02em; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-rel__t { font-size: 15px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-rel__s { font-size: 13px !important; line-height: 1.4; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-rel__a { grid-column: 1 / -1; margin-top: 12px; }
#wrapwrap .ww-admin a.pl-btn { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 8px; background: #fff; font-size: 13px !important; font-weight: 700 !important; color: var(--ink-900) !important; text-decoration: none !important; transition: background .15s ease-out; }
#wrapwrap .ww-admin a.pl-btn:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-admin a.pl-btn .ac-i { width: 16px; height: 16px; }
#wrapwrap .ww-admin a.pl-btn--pro { border-color: var(--yellow-500, #ECF22E); background: var(--yellow-500, #ECF22E); }
#wrapwrap .ww-admin a.pl-btn--pro:hover { background: var(--yellow-600, #DCE21C); }
#wrapwrap .ww-admin .pl-bot { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 16px; align-items: start; }
#wrapwrap .ww-admin .pl-side { display: grid; gap: 16px; min-width: 0; }
#wrapwrap .ww-admin .pl-leg { display: flex; gap: 16px; font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-leg span { display: inline-flex; align-items: center; gap: 6px; }
#wrapwrap .ww-admin .pl-leg i { width: 10px; height: 10px; border-radius: 2px; background: var(--ink-200, #E4E4E1); }
#wrapwrap .ww-admin .pl-leg i.on { background: var(--green-500); }
#wrapwrap .ww-admin .pl-chart { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; align-items: end; height: 200px; border-bottom: 1px solid var(--border-1); }
#wrapwrap .ww-admin .pl-col { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 6px; height: 100%; }
#wrapwrap .ww-admin .pl-col > small { font-family: var(--font-mono) !important; font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-col > span { display: flex; align-items: flex-end; width: 100%; max-width: 44px; min-height: 2px; border-radius: 6px 6px 0 0; background: var(--ink-200, #E4E4E1); overflow: hidden; }
#wrapwrap .ww-admin .pl-col > span > i { display: block; width: 100%; background: var(--green-500); }
#wrapwrap .ww-admin .pl-lbl { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-top: 10px; text-align: center; line-height: 1.2; }
#wrapwrap .ww-admin .pl-lbl b { display: block; font-size: 13px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-lbl small { font-family: var(--font-mono) !important; font-size: 11px !important; color: var(--green-700, #00875F) !important; white-space: nowrap; }
#wrapwrap .ww-admin .pl-det { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .pl-det summary { min-height: 28px; font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900) !important; cursor: pointer; }
#wrapwrap .ww-admin .pl-tw { margin-top: 12px; overflow-x: auto; }
#wrapwrap .ww-admin table.pl-table { width: 100%; min-width: 480px; margin: 0; border-collapse: collapse; font-size: 13px !important; }
#wrapwrap .ww-admin table.pl-table--s { min-width: 0; }
#wrapwrap .ww-admin .pl-table th { padding: 8px 0; font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; text-align: right; color: var(--text-3) !important; border: 0; background: none; }
#wrapwrap .ww-admin .pl-table td { padding: 10px 0; border: 0; border-top: 1px solid var(--border-1); font-family: var(--font-mono) !important; text-align: right; color: var(--ink-900) !important; background: none; }
#wrapwrap .ww-admin .pl-table th:first-child, #wrapwrap .ww-admin .pl-table td:first-child { text-align: left; }
#wrapwrap .ww-admin .pl-table td:first-child { font-family: var(--font-sans) !important; font-weight: 700; }
#wrapwrap .ww-admin .pl-meth { margin: 12px 0 0; font-size: 12px !important; line-height: 1.55 !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-who { display: flex; align-items: center; gap: 14px; }
#wrapwrap .ww-admin .pl-av { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 22px; background: var(--ink-100, #EDEDEA); font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-who__n { font-size: 15px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-who__c { font-size: 13px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
#wrapwrap .ww-admin .pl-tag { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: var(--ink-100, #EDEDEA); font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-900) !important; }
#wrapwrap .ww-admin a.pl-go { font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-admin a.pl-go:hover { color: var(--green-700, #00875F) !important; }
#wrapwrap .ww-admin .pl-none { margin: 0; font-size: 14px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-note { padding: 20px 22px; border: 1px solid var(--border-1); border-radius: 12px; background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-admin .pl-note b { font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-note p { margin: 8px 0 0; font-size: 13px !important; line-height: 1.5 !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .pl-tbs { display: grid; gap: 10px; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--border-1); list-style: none; }
#wrapwrap .ww-admin .pl-tb { display: grid; gap: 2px; }
#wrapwrap .ww-admin .pl-tb b { font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .pl-tb small { font-size: 12px !important; color: var(--text-2) !important; }
@media (max-width: 1180px) { #wrapwrap .ww-admin .pl-top, #wrapwrap .ww-admin .pl-bot { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  #wrapwrap .ww-admin .pl-seg { width: 100%; }
  #wrapwrap .ww-admin .pl-seg a { flex: 1; justify-content: center; min-height: 44px; }
  #wrapwrap .ww-admin .pl-kpi { padding: 22px 20px; }
  #wrapwrap .ww-admin .pl-kpi__g { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  #wrapwrap .ww-admin .pl-kpi__g > div { padding: 0 !important; border: 0 !important; }
  #wrapwrap .ww-admin .pl-kpi__g > div:first-child { padding-bottom: 20px !important; border-bottom: 1px solid rgba(255,255,255,.16) !important; }
  #wrapwrap .ww-admin .pl-card { padding: 20px 18px; }
  #wrapwrap .ww-admin .pl-rel { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-admin .pl-chart, #wrapwrap .ww-admin .pl-lbl { gap: 6px; }
  #wrapwrap .ww-admin a.pl-btn { height: 44px; }
}

/* ===== Sociétés v1.0 (handoff Claude Design admin-societes-v1.0, 05/10) : préfixe so- ; JAMAIS de balise header/footer dans les volets :
   le thème les fixe en haut de page (en-tête du volet en position fixe, 100 % de hauteur, pied masqué : relevé en ligne le 05/10) ===== */
html.so-lock, html.so-lock body { overflow: hidden !important; }
#wrapwrap .ww-admin .so { display: grid; gap: 16px; }
#wrapwrap .ww-admin .so-mono { font-family: var(--font-mono) !important; }
#wrapwrap .ww-admin .so-ey { margin: 0; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .so-ey--row { display: flex; justify-content: space-between; gap: 12px; font-size: 10px !important; }
#wrapwrap .ww-admin .so-filters { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-admin a.so-chip { flex: none; display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 16px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 999px; background: #fff; font-size: 14px !important; font-weight: 700 !important; white-space: nowrap; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-admin a.so-chip b { padding: 2px 8px; border-radius: 999px; background: var(--ink-100, #EDEDEA); font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 500 !important; }
#wrapwrap .ww-admin a.so-chip--type b { background: #F5F8A6; }
#wrapwrap .ww-admin a.so-chip[aria-pressed="true"] { border-color: var(--ink-900); background: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-admin a.so-chip[aria-pressed="true"] b { background: rgba(255,255,255,.16); color: #fff !important; }
#wrapwrap .ww-admin .so-list { padding: 8px 26px 16px; }
#wrapwrap .ww-admin .so-r { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.1fr) 80px minmax(0, 1.2fr) 120px 20px; gap: 16px; align-items: center; padding: 16px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin a.so-r { color: var(--ink-900) !important; text-decoration: none !important; cursor: pointer; }
#wrapwrap .ww-admin a.so-r:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-admin a.so-r:focus-visible { outline: 2px solid var(--green-500); outline-offset: -2px; }
#wrapwrap .ww-admin a.so-r[hidden] { display: none !important; }
#wrapwrap .ww-admin .so-r--h { border: 0; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .so-r__n { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-admin .so-r__n > b { font-size: 15px !important; color: var(--ink-900) !important; overflow: hidden; text-overflow: ellipsis; }
#wrapwrap .ww-admin .so-r__n > .so-mono { font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-test { margin-left: 8px; padding: 1px 6px; border: 1px dashed var(--ink-300, #C4C4C1); border-radius: 6px; font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .so-type { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 999px; font-size: 13px !important; font-weight: 700 !important; white-space: nowrap; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .so-type--none { border-color: transparent; background: #F5F8A6; }
#wrapwrap .ww-admin .so-remc { font-size: 14px !important; text-align: right; }   /* colonne Remise de la liste (≠ .so-rem : champ du volet) */
#wrapwrap .ww-admin .so-users { display: grid; gap: 4px; min-width: 0; }
#wrapwrap .ww-admin .so-av { display: inline-flex; }
#wrapwrap .ww-admin .so-av span { display: grid; place-items: center; width: 28px; height: 28px; margin-left: -8px; border: 2px solid #fff; border-radius: 14px; background: var(--ink-100, #EDEDEA); font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 600 !important; }
#wrapwrap .ww-admin .so-av span:first-child { margin-left: 0; }
#wrapwrap .ww-admin .so-alert { display: flex; align-items: center; gap: 6px; font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-alert i { flex: none; width: 7px; height: 7px; border-radius: 4px; background: #E8890C; }
#wrapwrap .ww-admin .so-last { font-size: 13px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-go { color: var(--text-3); }
#wrapwrap .ww-admin .so-go .ac-i { width: 16px; height: 16px; }
#wrapwrap .ww-admin .so-rm { display: none; }
#wrapwrap .ww-admin .so-none { margin: 0; padding: 20px 0 4px; font-size: 14px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-none[hidden], #wrapwrap .ww-admin .so-more[hidden], #wrapwrap .ww-admin .so-dr[hidden], #wrapwrap .ww-admin .so-scrim[hidden] { display: none !important; }
#wrapwrap .ww-admin .so-more { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px solid var(--border-1); font-family: var(--font-mono) !important; font-size: 12px !important; color: var(--text-3) !important; }
/* boutons */
#wrapwrap .ww-admin .so-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; margin: 0; padding: 0 16px; border: 1px solid transparent; border-radius: 8px; background: transparent; box-shadow: none; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1; white-space: nowrap; color: var(--ink-900) !important; text-decoration: none !important; cursor: pointer; }
#wrapwrap .ww-admin .so-btn .ac-i { width: 16px; height: 16px; }
#wrapwrap .ww-admin .so-btn--sm { height: 32px; padding: 0 12px; font-size: 13px !important; }
#wrapwrap .ww-admin .so-btn--sec { border-color: var(--ink-200, #E4E4E1); background: #fff; }
#wrapwrap .ww-admin .so-btn--sec:hover, #wrapwrap .ww-admin .so-btn--ghost:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-admin .so-btn--pri { background: var(--green-500); }
#wrapwrap .ww-admin .so-btn--acc { background: var(--yellow-500, #ECF22E); }
#wrapwrap .ww-admin .so-btn[disabled] { opacity: .45; cursor: not-allowed; }
/* volets */
#wrapwrap .ww-admin .so-scrim { position: fixed; inset: 0; z-index: 1060; background: rgba(20,20,20,.32); }
#wrapwrap .ww-admin .so-dr { position: fixed; top: 0; right: 0; bottom: 0; z-index: 1061; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: 520px; max-width: 100%; background: var(--ink-50, #F6F6F5); box-shadow: -12px 0 40px rgba(0,0,0,.12); }
#wrapwrap .ww-admin .so-dr2 { right: 520px; z-index: 1062; width: 440px; max-width: calc(100vw - 520px); border-right: 1px solid var(--border-1); background: #fff; }
#wrapwrap .ww-admin .so-dr__h { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 24px 28px 20px; border-bottom: 1px solid var(--border-1); background: #fff; }
#wrapwrap .ww-admin .so-dr__h h2 { margin: 6px 0 0; font-size: 24px !important; font-weight: 900 !important; line-height: 1.15 !important; letter-spacing: -.01em; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .so-dr__h h2.so-dr2__t { font-size: 22px !important; }
#wrapwrap .ww-admin .so-dr__h p.so-mono { margin: 8px 0 0; font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-x { flex: none; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 8px; background: #fff; cursor: pointer; color: var(--ink-900); }
#wrapwrap .ww-admin .so-x .ac-i { width: 18px; height: 18px; }
#wrapwrap .ww-admin .so-dr__b { display: grid; gap: 28px; align-content: start; margin: 0; padding: 24px 28px; overflow-y: auto; }
#wrapwrap .ww-admin .so-dr__f { display: flex; justify-content: space-between; gap: 8px; padding: 16px 28px; border-top: 1px solid var(--border-1); background: #fff; }
#wrapwrap .ww-admin .so-dr__f--end { justify-content: flex-end; }
#wrapwrap .ww-admin .so-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#wrapwrap .ww-admin .so-stats a { display: grid; gap: 6px; padding: 16px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 12px; background: #fff; color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-admin .so-stats b { font-family: var(--font-mono) !important; font-size: 22px !important; font-weight: 600 !important; }
#wrapwrap .ww-admin .so-stats span { display: inline-flex; align-items: center; gap: 6px; font-size: 14px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-stats span .ac-i { width: 14px; height: 14px; }
#wrapwrap .ww-admin .so-blk h3 { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 12px; font-size: 16px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .so-blk h3 small { font-size: 12px !important; font-weight: 400 !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-cond { display: grid; gap: 28px; }
#wrapwrap .ww-admin .so-dl { display: grid; grid-template-columns: 140px minmax(0, 1fr); margin: 0; }
#wrapwrap .ww-admin .so-dl dt, #wrapwrap .ww-admin .so-dl dd { margin: 0; padding: 12px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .so-dl dt { font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; line-height: 1.8 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .so-dl dd { font-size: 14px !important; color: var(--ink-900) !important; overflow-wrap: anywhere; }
#wrapwrap .ww-admin .so-acc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
#wrapwrap .ww-admin .so-acc__o { position: relative; display: grid; gap: 4px; min-height: 70px; margin: 0; padding: 12px 14px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 10px; background: #fff; cursor: pointer; }
#wrapwrap .ww-admin .so-acc__o input { position: absolute; opacity: 0; pointer-events: none; }
#wrapwrap .ww-admin .so-acc__o b { font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .so-acc__n { display: flex; align-items: center; gap: 6px; font-family: var(--font-mono) !important; font-size: 11px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-acc__n .so-dot { display: none; }
#wrapwrap .ww-admin .so-acc__o:has(input:checked) { border-color: var(--ink-900); }
#wrapwrap .ww-admin .so-acc__o:has(input:checked) .so-dot { display: inline-block; }
#wrapwrap .ww-admin .so-acc__o:has(:focus-visible) { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap .ww-admin .so-rem { display: flex; align-items: center; width: 180px; height: 48px; margin: 0; padding: 0 14px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 8px; background: #fff; }
#wrapwrap .ww-admin .so-rem input { width: 100%; border: 0; outline: 0; background: none; box-shadow: none; font-family: var(--font-mono) !important; font-size: 16px !important; font-weight: 500; color: var(--ink-900); -moz-appearance: textfield; }
#wrapwrap .ww-admin .so-rem span { color: var(--text-2); }
#wrapwrap .ww-admin .so-dot { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); }
#wrapwrap .ww-admin .so-dot--o { background: #E8890C; }
#wrapwrap .ww-admin .so-dot--g { background: var(--ink-300, #C4C4C1); }
#wrapwrap .ww-admin .so-u { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 12px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .so-ini { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 18px; background: #fff; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 600 !important; }
#wrapwrap .ww-admin .so-u__w { min-width: 0; }
#wrapwrap .ww-admin .so-u__w b { display: block; font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .so-u__w small { display: block; font-size: 12px !important; color: var(--text-2) !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#wrapwrap .ww-admin .so-st { display: flex; align-items: center; gap: 6px; font-size: 12px !important; white-space: nowrap; color: var(--text-2) !important; }
#wrapwrap .ww-admin .so-write { justify-self: start; margin-top: 12px; }
#wrapwrap .ww-admin .so-dr .ad-add { margin-top: 12px; }
/* volet 2 : écrire */
#wrapwrap .ww-admin .so-msg { gap: 18px; }
#wrapwrap .ww-admin .so-field { display: grid; gap: 6px; margin: 0; }
#wrapwrap .ww-admin .so-pills { display: flex; flex-wrap: wrap; gap: 8px; }
#wrapwrap .ww-admin .so-pill { display: inline-flex; align-items: center; gap: 10px; height: 44px; margin: 0; padding: 0 14px 0 6px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 999px; background: #fff; font-size: 14px !important; font-weight: 700 !important; white-space: nowrap; color: var(--ink-900) !important; cursor: pointer; }
#wrapwrap .ww-admin .so-pill input { position: absolute; opacity: 0; pointer-events: none; }
#wrapwrap .ww-admin .so-pill i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 16px; background: var(--ink-100, #EDEDEA); font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 600 !important; font-style: normal; }
#wrapwrap .ww-admin .so-pill:has(input:checked) { border-color: var(--ink-900); background: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-admin .so-pill:has(input:checked) i { background: rgba(255,255,255,.14); color: #fff; }
#wrapwrap .ww-admin .so-pill:has(:focus-visible) { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap .ww-admin .so-in, #wrapwrap .ww-admin .so-ta { width: 100%; margin: 0; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 8px; background: #fff; box-shadow: none; font-family: var(--font-sans) !important; font-size: 15px !important; color: var(--ink-900); }
#wrapwrap .ww-admin .so-in { height: 44px; padding: 0 14px; }
#wrapwrap .ww-admin .so-ta { padding: 12px 14px; resize: vertical; }
#wrapwrap .ww-admin .so-small { margin: 0; font-size: 13px !important; line-height: 1.45 !important; color: var(--text-2) !important; }
@media (max-width: 1100px) { #wrapwrap .ww-admin .so-dr2 { right: 0; width: 100%; max-width: 520px; } }
@media (max-width: 760px) {
  #wrapwrap .ww-admin .so-r--h { display: none; }
  #wrapwrap .ww-admin .so-r { grid-template-columns: minmax(0, 1fr) 20px; padding: 18px 0; }
  #wrapwrap .ww-admin .so-r > .so-c { display: none; }
  #wrapwrap .ww-admin .so-rm { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 10px; font-size: 13px !important; }
  #wrapwrap .ww-admin .so-rm .so-alert { width: 100%; }
  #wrapwrap .ww-admin .so-list { padding: 4px 20px 12px; }
  #wrapwrap .ww-admin .so-dr, #wrapwrap .ww-admin .so-dr2 { width: 100%; max-width: none; }
  #wrapwrap .ww-admin .so-dr__h, #wrapwrap .ww-admin .so-dr__b, #wrapwrap .ww-admin .so-dr__f { padding-left: 20px; padding-right: 20px; }
  #wrapwrap .ww-admin .so-dl { grid-template-columns: 120px minmax(0, 1fr); }
  #wrapwrap .ww-admin .so-acc { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-admin .so-u { grid-template-columns: 36px minmax(0, 1fr) auto; }
  #wrapwrap .ww-admin .so-st { grid-column: 2; }
  #wrapwrap .ww-admin .so-dr__f .so-btn { flex: 1; height: 44px; }
}
/* ===== Communication v1.0 (handoff Claude Design admin-communication-v1.0, 05/10) : préfixe cm- ; une classe = un composant ===== */
#wrapwrap .ww-admin .cm { display: grid; gap: 24px; }
#wrapwrap .ww-admin .cm-in { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px; align-items: start; }
#wrapwrap .ww-admin .cm-card { min-width: 0; margin: 0; padding: 24px 26px; }
#wrapwrap .ww-admin .cm-card__t { font-size: 16px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-card__h { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
#wrapwrap .ww-admin .cm-mono { font-family: var(--font-mono) !important; }
#wrapwrap .ww-admin .cm-muted { color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-small { margin: 6px 0 0; font-size: 13px !important; line-height: 1.45 !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-ey { margin: 0; font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .cm-step { display: grid; gap: 12px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .cm-step__t { display: flex; align-items: baseline; gap: 10px; font-size: 15px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-step__t span { font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 500 !important; color: var(--green-700, #00875F) !important; }
#wrapwrap .ww-admin .cm-chips { display: flex; flex-wrap: wrap; gap: 8px; }
#wrapwrap .ww-admin .cm-chip { position: relative; display: inline-flex; align-items: center; gap: 10px; height: 40px; margin: 0; padding: 0 16px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 999px; background: #fff; font-size: 14px !important; font-weight: 700 !important; white-space: nowrap; color: var(--ink-900) !important; cursor: pointer; }
#wrapwrap .ww-admin .cm-chip input, #wrapwrap .ww-admin .cm-seg input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
#wrapwrap .ww-admin .cm-chip b { padding: 2px 8px; border-radius: 999px; background: var(--ink-100, #EDEDEA); font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 500 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-chip:has(input:checked) { border-color: var(--ink-900); background: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-admin .cm-chip:has(input:checked) b { background: rgba(255,255,255,.16); color: #fff !important; }
#wrapwrap .ww-admin .cm-chip:has(:focus-visible), #wrapwrap .ww-admin .cm-seg label:has(:focus-visible) { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap .ww-admin .cm-seg { display: grid; grid-template-columns: repeat(4, auto); gap: 4px; padding: 4px; border-radius: 10px; background: var(--ink-100, #EDEDEA); }
#wrapwrap .ww-admin .cm-seg label { position: relative; display: grid; place-items: center; min-width: 0; min-height: 36px; margin: 0; padding: 4px 6px; border-radius: 7px; font-size: 13px !important; font-weight: 700 !important; line-height: 1.2 !important; text-align: center; white-space: nowrap; color: var(--ink-900) !important; cursor: pointer; }
#wrapwrap .ww-admin .cm-seg label:has(input:checked) { background: #fff; box-shadow: var(--shadow-card); }
#wrapwrap .ww-admin .cm-field { display: grid; gap: 6px; margin: 0; }
#wrapwrap .ww-admin .cm-field > span { font-size: 13px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-input, #wrapwrap .ww-admin .cm-ta { width: 100%; margin: 0; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 8px; background: #fff; box-shadow: none; font-family: var(--font-sans) !important; font-size: 15px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-input { height: 44px; padding: 0 14px; }
#wrapwrap .ww-admin .cm-ta { padding: 12px 14px; resize: vertical; }
#wrapwrap .ww-admin .cm-input:focus, #wrapwrap .ww-admin .cm-ta:focus { border-color: var(--ink-900); outline: 0; }
#wrapwrap .ww-admin .cm-send { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .cm-send p { display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0; font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-dot { flex: none; display: inline-block; width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); }
#wrapwrap .ww-admin .cm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; margin: 0; padding: 0 16px; border: 1px solid transparent; border-radius: 8px; background: transparent; box-shadow: none; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1; white-space: nowrap; color: var(--ink-900) !important; text-decoration: none !important; cursor: pointer; }
#wrapwrap .ww-admin .cm-btn .ac-i { width: 16px; height: 16px; }
#wrapwrap .ww-admin .cm-btn--sm { height: 32px; padding: 0 12px; font-size: 13px !important; }
#wrapwrap .ww-admin .cm-btn--sec { border-color: var(--ink-200, #E4E4E1); background: #fff; }
#wrapwrap .ww-admin .cm-btn--sec:hover { background: var(--ink-50, #F6F6F5); }
#wrapwrap .ww-admin .cm-btn--acc { background: var(--yellow-500, #ECF22E); }
#wrapwrap .ww-admin .cm-btn[disabled] { opacity: .45; cursor: not-allowed; }
#wrapwrap .ww-admin .cm-pvw { display: grid; gap: 10px; min-width: 0; }
#wrapwrap .ww-admin .cm-pv { overflow: hidden; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); }
#wrapwrap .ww-admin .cm-pv__m { display: grid; gap: 4px; padding: 14px 22px; border-bottom: 1px solid var(--border-1); font-size: 13px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-pv__m b { overflow-wrap: anywhere; }
#wrapwrap .ww-admin .cm-pv__b { display: grid; gap: 16px; padding: 20px 22px; font-size: 14px !important; line-height: 1.6 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-pv__t { white-space: pre-line; overflow-wrap: anywhere; }
#wrapwrap .ww-admin .cm-pv__sig { display: grid; }
#wrapwrap .ww-admin .cm-pv__f { padding: 12px 22px; background: var(--ink-50, #F6F6F5); font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-pvw > .cm-small { margin: 0; }
#wrapwrap .ww-admin .cm-search { display: flex; flex: 0 1 320px; align-items: center; gap: 8px; height: 44px; margin: 0; padding: 0 14px; border: 1px solid var(--ink-200, #E4E4E1); border-radius: 8px; background: #fff; color: var(--text-3); }
#wrapwrap .ww-admin .cm-search .ac-i { flex: none; width: 16px; height: 16px; }
#wrapwrap .ww-admin .cm-search input { flex: 1; min-width: 0; height: auto; margin: 0; padding: 0; border: 0; outline: 0; background: transparent; box-shadow: none; font-family: var(--font-sans) !important; font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-search--mm { max-width: 320px; margin-bottom: 8px; }
#wrapwrap .ww-admin .cm-cnt { margin-left: 4px; font-size: 13px !important; font-weight: 400 !important; }
#wrapwrap .ww-admin .cm-lst .cm-it { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding: 14px 0; border-top: 1px solid var(--border-1); }
#wrapwrap .ww-admin .cm-lst .cm-it > b { overflow: hidden; font-size: 15px !important; font-weight: 700 !important; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-lst .cm-it > small { min-width: 0; font-size: 13px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-lst .cm-it > .cm-mono { font-size: 12px !important; text-align: right; white-space: nowrap; color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-it[hidden], #wrapwrap .ww-admin .cm-none[hidden], #wrapwrap .ww-admin .cm-more[hidden] { display: none !important; }
#wrapwrap .ww-admin .cm-none { margin: 0; padding: 16px 0 4px; font-size: 14px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-more { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px solid var(--border-1); font-family: var(--font-mono) !important; font-size: 12px !important; color: var(--text-3) !important; }
#wrapwrap .ww-admin .cm-mm__p { margin: -6px 0 16px; }
#wrapwrap .ww-admin .cm-kp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 16px; border: 1px solid var(--border-1); border-radius: 12px; }
#wrapwrap .ww-admin .cm-kp > div { display: grid; gap: 4px; padding: 14px 18px; }
#wrapwrap .ww-admin .cm-kp > div + div { border-left: 1px solid var(--border-1); }
#wrapwrap .ww-admin .cm-kp b { font-family: var(--font-mono) !important; font-size: 22px !important; font-weight: 600 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-kp small { font-size: 12px !important; color: var(--text-2) !important; }
#wrapwrap .ww-admin .cm-ml { display: grid; grid-template-columns: minmax(0, 2.4fr) 80px minmax(0, 1fr) minmax(0, 1fr) 100px; gap: 16px; align-items: center; padding: 12px 0; border-top: 1px solid var(--border-1); font-size: 14px !important; color: var(--ink-900) !important; }
#wrapwrap .ww-admin .cm-ml--h { font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3) !important; }
#wrapwrap .ww-admin .cm-ml__t { min-width: 0; overflow-wrap: anywhere; }
#wrapwrap .ww-admin .cm-ml > .cm-mono { font-size: 13px !important; }
#wrapwrap .ww-admin .cm-rt { display: grid; gap: 4px; font-family: var(--font-mono) !important; font-size: 12px !important; }
#wrapwrap .ww-admin .cm-rt i { display: block; height: 4px; overflow: hidden; border-radius: 2px; background: var(--ink-100, #EDEDEA); }
#wrapwrap .ww-admin .cm-rt i b { display: block; height: 100%; background: var(--green-500); }
#wrapwrap .ww-admin .cm-rt--c i b { background: var(--ink-900); }
#wrapwrap .ww-admin .cm-lb { display: none; }
@media (max-width: 1180px) { #wrapwrap .ww-admin .cm-in { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  #wrapwrap .ww-admin .cm-card { padding: 20px; }
  #wrapwrap .ww-admin .cm-chip { height: 44px; }
  #wrapwrap .ww-admin .cm-seg { grid-template-columns: 1fr 1fr; }
  #wrapwrap .ww-admin .cm-seg label { min-height: 44px; }
  #wrapwrap .ww-admin .cm-btn { height: 44px; }
  #wrapwrap .ww-admin .cm-send .cm-btn { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 10; height: 48px; box-shadow: 0 6px 20px rgba(20,20,20,.18); }
  #wrapwrap .ww-admin .cm-send .cm-btn[disabled] { opacity: 1; background: var(--ink-100, #EDEDEA); color: var(--text-3) !important; }   /* bouton fixe : opaque, sinon la page se lit au travers */
  #wrapwrap .ww-admin .cm { padding-bottom: 72px; }
  #wrapwrap .ww-admin .cm-search { flex-basis: 100%; }
  #wrapwrap .ww-admin .cm-search--mm { max-width: none; }
  #wrapwrap .ww-admin .cm-kp { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-admin .cm-kp > div + div { border-top: 1px solid var(--border-1); border-left: 0; }
  #wrapwrap .ww-admin .cm-ml--h { display: none; }
  #wrapwrap .ww-admin .cm-ml { grid-template-columns: 1fr 1fr; gap: 10px 16px; padding: 16px 0; }
  #wrapwrap .ww-admin .cm-ml > :first-child { grid-column: 1 / -1; font-weight: 700 !important; }
  #wrapwrap .ww-admin .cm-lb { display: block; font-family: var(--font-mono) !important; font-size: 10px !important; font-weight: 500 !important; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3) !important; }
}


/* ===== atelier.css ===== */

/* ===== Votre projet à l'atelier — v2.0 (handoff Claude Design « atelier-v2.0 », 06/10) : racine .ww-atelier, préfixe at- ;
   variantes en .x.x--mod (2 classes : sinon la règle de base, plus loin, l'emporte) ; jamais de balise header/footer, jamais d'aria-hidden ===== */
#wrapwrap .ww-atelier { --at-line: var(--ink-200, #E4E4E1); --at-soft: var(--ink-100, #F0F0EE); --at-ring: #C9C9C6; padding-bottom: 8px; }
#wrapwrap .ww-atelier .at-i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#wrapwrap .ww-atelier .at-mono { font-family: var(--font-mono) !important; }
#wrapwrap .ww-atelier .at-kk { font-family: var(--font-mono) !important; font-size: 11px !important; font-weight: 400 !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--ink-500) !important; }
/* en-tête : le nom du projet ; à droite la carte Mise à disposition | Avancement */
#wrapwrap .ww-atelier .at-hd { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 40px; align-items: end; margin: 8px 0 0; }
#wrapwrap .ww-atelier .at-hd__t { display: grid; gap: 10px; min-width: 0; }
#wrapwrap .ww-atelier .at-eb { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-family: var(--font-mono) !important; font-size: 12px !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--ink-500) !important; }
#wrapwrap .ww-atelier .at-eb__a { color: var(--green-700) !important; }
#wrapwrap .ww-atelier .at-eb__s { color: var(--ink-300) !important; }
#wrapwrap .ww-dash h1.dash-h1.at-h1 { font-size: 52px !important; letter-spacing: -.035em !important; line-height: .98 !important; text-wrap: balance; overflow-wrap: anywhere; }
#wrapwrap .ww-atelier .at-lede { max-width: 60ch; margin: 0; font-size: 16px !important; line-height: 1.5 !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-kpi { display: flex; align-items: stretch; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); }
#wrapwrap .ww-atelier .at-kpi__i { display: grid; align-content: center; gap: 4px; padding: 18px 24px; }
#wrapwrap .ww-atelier .at-kpi__i.at-kpi__i--av { gap: 8px; min-width: 200px; border-left: 1px solid var(--at-line); }
#wrapwrap .ww-atelier .at-kpi__d { font-family: var(--font-mono) !important; font-size: 30px !important; font-weight: 600 !important; letter-spacing: -.02em !important; line-height: 1.1 !important; white-space: nowrap; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-kpi__s { font-size: 13px !important; white-space: nowrap; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-kpi__h { display: flex; justify-content: space-between; gap: 12px; }
#wrapwrap .ww-atelier .at-kpi__h b { font-weight: 400 !important; white-space: nowrap; color: var(--ink-900) !important; }
/* segments : un par tâche / ouvrage / étape — fait = vert, en cours = encre, commencé = gris foncé, à venir = gris clair */
#wrapwrap .ww-atelier .at-seg { display: flex; gap: 3px; }
#wrapwrap .ww-atelier .at-seg > span { flex: 1; height: 6px; border-radius: 1px; background: var(--at-line); }
#wrapwrap .ww-atelier .at-seg.at-seg--s > span { height: 4px; }
#wrapwrap .ww-atelier .at-seg > span.is-on, #wrapwrap .ww-atelier .at-seg > span.is-done { background: var(--green-500); }
#wrapwrap .ww-atelier .at-seg > span.is-run { background: var(--ink-900); }
#wrapwrap .ww-atelier .at-seg > span.is-here { background: var(--ink-500); }
/* bandeau « En ce moment » : une ligne, encre */
#wrapwrap .ww-atelier .at-now { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px 28px; margin: 28px 0 0; padding: 18px 24px; border-radius: 12px; background: var(--ink-900); color: #fff; }
#wrapwrap .ww-atelier .at-now__k { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono) !important; font-size: 11px !important; letter-spacing: .12em !important; text-transform: uppercase; white-space: nowrap; color: var(--ink-300) !important; }
#wrapwrap .ww-atelier .at-now.at-now--live .at-now__k { color: var(--green-500) !important; }
#wrapwrap .ww-atelier .at-now__dot { flex: none; width: 10px; height: 10px; border-radius: 5px; background: var(--green-500); box-shadow: 0 0 0 4px var(--point-halo, rgba(0,230,176,.28)); }
#wrapwrap .ww-atelier .at-now__b { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-atelier .at-now__b b { font-size: 17px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.3 !important; color: #fff !important; }
#wrapwrap .ww-atelier .at-now__b span { font-size: 14px !important; line-height: 1.45 !important; color: var(--ink-300) !important; text-wrap: pretty; }
#wrapwrap .ww-atelier .at-now__u { font-size: 12px !important; white-space: nowrap; color: var(--ink-500) !important; }
/* sections numérotées, 72 px d'air */
#wrapwrap .ww-atelier .at-sec { margin-top: 72px; }
#wrapwrap .ww-atelier .at-sh { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
#wrapwrap .ww-atelier .at-sh__t { display: flex; align-items: baseline; gap: 12px; }
#wrapwrap .ww-atelier .at-sn { font-family: var(--font-mono) !important; font-size: 12px !important; letter-spacing: .12em !important; color: var(--ink-500) !important; }
#wrapwrap .ww-atelier h2.at-h2 { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: -.03em !important; line-height: 1.1 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-sh__n { font-size: 14px !important; color: var(--ink-600) !important; }
/* 01 les postes : cartes égales ; le poste du dernier pointage en encre */
#wrapwrap .ww-atelier .at-postes { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; margin-top: 20px; }
#wrapwrap .ww-atelier .at-po { display: grid; align-content: start; gap: 12px; min-width: 0; padding: 18px 18px 16px; border: 1px solid var(--at-line); border-radius: 12px; background: #fff; }
#wrapwrap .ww-atelier .at-po__h { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 14px; }
#wrapwrap .ww-atelier .at-po__n { font-size: 11px !important; letter-spacing: .12em !important; color: var(--ink-500) !important; }
#wrapwrap .ww-atelier .at-po__t { font-size: 17px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.15 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-po__c { display: flex; align-items: center; gap: 6px; font-size: 12px !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-po__c .at-i { flex: none; width: 13px; height: 13px; stroke-width: 3; }
#wrapwrap .ww-atelier .at-po.at-po--done .at-po__c { font-weight: 600 !important; color: var(--green-700) !important; }
#wrapwrap .ww-atelier .at-po.at-po--live { border-color: var(--ink-900); background: var(--ink-900); }
#wrapwrap .ww-atelier .at-po.at-po--live .at-po__n { color: var(--green-500) !important; }
#wrapwrap .ww-atelier .at-po.at-po--live .at-po__t { color: #fff !important; }
#wrapwrap .ww-atelier .at-po.at-po--live .at-po__c { color: var(--ink-300) !important; }
#wrapwrap .ww-atelier .at-po.at-po--live .at-seg > span { background: rgba(255,255,255,.18); }
#wrapwrap .ww-atelier .at-po.at-po--live .at-seg > span.is-done { background: var(--green-500); }
#wrapwrap .ww-atelier .at-po.at-po--live .at-seg > span.is-run, #wrapwrap .ww-atelier .at-po.at-po--live .at-seg > span.is-here { background: #fff; }
#wrapwrap .ww-atelier .at-po__dot { width: 8px; height: 8px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 3px var(--point-halo, rgba(0,230,176,.28)); }
/* 02 les ouvrages : lignes repliables, une seule ouverte */
#wrapwrap .ww-atelier .at-ous { display: grid; gap: 10px; margin-top: 20px; }
#wrapwrap .ww-atelier details.at-ou { overflow: hidden; border: 1px solid transparent; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); }
#wrapwrap .ww-atelier details.at-ou[open] { border-color: var(--ink-900); }
#wrapwrap .ww-atelier summary.at-ou__r { display: grid; grid-template-columns: 48px minmax(0, 1fr) 150px 180px 28px; align-items: center; gap: 16px; padding: 16px 20px; list-style: none; cursor: pointer; }
#wrapwrap .ww-atelier summary.at-ou__r::-webkit-details-marker { display: none; }
#wrapwrap .ww-atelier summary.at-ou__r:hover { background: #FAFAF9; }
#wrapwrap .ww-atelier summary.at-ou__r:focus-visible { outline: 2px solid var(--ink-900); outline-offset: -2px; }
#wrapwrap .ww-atelier .at-ou__th { display: grid; place-items: center; width: 48px; height: 48px; overflow: hidden; border-radius: 8px; background: var(--at-soft); font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 600 !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ou__th img { width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww-atelier .at-ou__th img.at-ou__cat { padding: 4px; object-fit: contain; background: #fff; }
#wrapwrap .ww-atelier .at-ou__m { display: grid; gap: 3px; min-width: 0; }
#wrapwrap .ww-atelier .at-ou__nm { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
#wrapwrap .ww-atelier .at-ou__nm b { min-width: 0; font-size: 17px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.2 !important; color: var(--ink-900) !important; text-wrap: balance; }
#wrapwrap .ww-atelier .at-ou__dot { flex: none; width: 8px; height: 8px; margin-top: 6px; border-radius: 4px; background: var(--green-500); box-shadow: 0 0 0 3px var(--point-halo, rgba(0,230,176,.28)); }
#wrapwrap .ww-atelier .at-ou__meta { font-size: 13px !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ou__mm { display: none; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; margin-top: 8px; font-size: 12px !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ou__mm .at-seg { flex: none; width: 70px; }
#wrapwrap .ww-atelier .at-ou__mm b { min-width: 0; font-family: var(--font-sans) !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-ou__sep { color: var(--ink-300) !important; }
#wrapwrap .ww-atelier .at-ou__pr { display: grid; gap: 6px; font-size: 12px !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ou__nx { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-atelier .at-ou__nx .at-kk { font-size: 10px !important; }
#wrapwrap .ww-atelier .at-ou__nx b { overflow: hidden; font-size: 14px !important; font-weight: 700 !important; white-space: nowrap; text-overflow: ellipsis; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier details.at-ou.at-ou--run .at-ou__nx b { color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-ou__ch { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 14px; background: var(--at-soft); color: var(--ink-900); transition: transform .15s ease-out; }
#wrapwrap .ww-atelier .at-ou__ch .at-i { width: 16px; height: 16px; }
#wrapwrap .ww-atelier details.at-ou[open] .at-ou__ch { transform: rotate(180deg); background: var(--ink-900); color: #fff; }
#wrapwrap .ww-atelier .at-ou__d { display: grid; gap: 16px; padding: 4px 20px 20px 84px; border-top: 1px solid var(--at-soft); }
#wrapwrap .ww-atelier .at-ou__l { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; margin: 0; padding: 12px 0 0; list-style: none; }
#wrapwrap .ww-atelier .at-ou__s { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--at-soft); }
#wrapwrap .ww-atelier .at-ou__sd { justify-self: center; width: 12px; height: 12px; margin-top: 4px; border-radius: 6px; background: #fff; box-shadow: inset 0 0 0 1px var(--at-ring); }
#wrapwrap .ww-atelier .at-ou__s.is-done .at-ou__sd { background: var(--green-500); box-shadow: none; }
#wrapwrap .ww-atelier .at-ou__s.is-run .at-ou__sd { background: var(--ink-900); box-shadow: 0 0 0 3px var(--point-halo, rgba(0,230,176,.28)); }
#wrapwrap .ww-atelier .at-ou__s.is-here .at-ou__sd { box-shadow: inset 0 0 0 2px var(--ink-900); }
#wrapwrap .ww-atelier .at-ou__sb { display: grid; gap: 2px; min-width: 0; }
#wrapwrap .ww-atelier .at-ou__sh { display: flex; justify-content: space-between; gap: 12px; }
#wrapwrap .ww-atelier .at-ou__sh b { font-size: 15px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-ou__s.is-next .at-ou__sh b { font-weight: 400 !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ou__sh .at-mono { font-size: 12px !important; white-space: nowrap; color: var(--ink-500) !important; }
#wrapwrap .ww-atelier .at-ou__so { font-size: 13px !important; color: var(--ink-600) !important; text-wrap: pretty; }
#wrapwrap .ww-atelier .at-ou__f { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; font-size: 13px !important; color: var(--ink-500) !important; }
#wrapwrap .ww-atelier a.at-ou__a { font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900) !important; text-decoration: none !important; }
/* 03 photos : cadre pointillé tant qu'il n'y en a pas ; filtres à partir de 6 */
#wrapwrap .ww-atelier .at-phx { display: grid; justify-items: center; gap: 8px; margin-top: 20px; padding: 40px 24px; border: 1px dashed var(--at-ring); border-radius: 12px; background: #fff; text-align: center; }
#wrapwrap .ww-atelier .at-phx b { font-size: 17px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-phx p { max-width: 44ch; margin: 0; font-size: 14px !important; line-height: 1.5 !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-pills { display: flex; gap: 8px; margin: 20px 0 0; overflow-x: auto; scrollbar-width: none; }
#wrapwrap .ww-atelier button.at-pill { flex: none; display: flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; padding: 0 16px; border: 1px solid var(--at-line); border-radius: 22px; background: #fff; box-shadow: none; font-family: var(--font-sans) !important; font-size: 14px !important; font-weight: 700 !important; white-space: nowrap; color: var(--ink-900) !important; cursor: pointer; }
#wrapwrap .ww-atelier button.at-pill span { font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 400 !important; opacity: .75; }
#wrapwrap .ww-atelier button.at-pill[aria-pressed="true"] { border-color: var(--ink-900); background: var(--ink-900); color: #fff !important; }
#wrapwrap .ww-atelier .at-phs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
#wrapwrap .ww-atelier a.at-ph { display: grid; align-content: start; overflow: hidden; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); color: var(--ink-900) !important; text-decoration: none !important; }
#wrapwrap .ww-atelier a.at-ph[hidden] { display: none !important; }
#wrapwrap .ww-atelier .at-ph__img { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--ink-800, #232323); }
#wrapwrap .ww-atelier .at-ph__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww-atelier .at-ph__c { display: grid; gap: 4px; padding: 14px 16px; }
#wrapwrap .ww-atelier .at-ph__c b { font-size: 14px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-ph__c .at-mono { font-size: 12px !important; color: var(--ink-500) !important; }
#wrapwrap .ww-atelier .at-ph__none { margin: 20px 0 0; padding: 24px; border: 1px dashed var(--at-ring); border-radius: 12px; font-size: 14px !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ph__none[hidden], #wrapwrap .ww-atelier .at-ph__more[hidden] { display: none !important; }
#wrapwrap .ww-atelier .at-ph__more { display: flex; justify-content: center; margin: 16px 0 0; }
/* pied : la question au chargé d'affaires ; sur téléphone, barre collante (mise à dispo + Écrire) */
#wrapwrap .ww-atelier .at-ask { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; margin-top: 72px; padding: 22px 26px; border-radius: 12px; background: #fff; box-shadow: var(--shadow-card); }
#wrapwrap .ww-atelier .at-ask__t { display: grid; gap: 4px; }
#wrapwrap .ww-atelier .at-ask__t b { font-size: 17px !important; font-weight: 700 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-ask__t span { font-size: 14px !important; color: var(--ink-600) !important; }
#wrapwrap .ww-atelier .at-ask .dash-btn, #wrapwrap .ww-atelier .at-sticky .dash-btn { gap: 8px; }
#wrapwrap .ww-atelier .at-sticky { display: none; }
#wrapwrap .ww-atelier .at-sticky__d { display: grid; gap: 1px; }
#wrapwrap .ww-atelier .at-sticky__d .at-kk { font-size: 10px !important; }
#wrapwrap .ww-atelier .at-sticky__d b { font-family: var(--font-mono) !important; font-size: 16px !important; font-weight: 600 !important; color: var(--ink-900) !important; }
#wrapwrap .ww-atelier .at-empty { padding: 24px; }
@media (max-width: 900px) {
  #wrapwrap .ww-atelier .at-hd { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-atelier .at-kpi { flex-direction: column; }
  #wrapwrap .ww-atelier .at-kpi__i.at-kpi__i--av { border-left: 0; border-top: 1px solid var(--at-line); }
  #wrapwrap .ww-atelier .at-now { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  #wrapwrap .ww-atelier .at-postes { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; }
  #wrapwrap .ww-atelier .at-postes > .at-po { flex: 0 0 72%; scroll-snap-align: start; }
  #wrapwrap .ww-atelier summary.at-ou__r { grid-template-columns: 40px minmax(0, 1fr) 28px; }
  #wrapwrap .ww-atelier .at-ou__th { width: 40px; height: 40px; }
  #wrapwrap .ww-atelier .at-ou__pr, #wrapwrap .ww-atelier .at-ou__nx { display: none; }
  #wrapwrap .ww-atelier .at-ou__mm { display: flex; }
  #wrapwrap .ww-atelier .at-ou__d { padding-left: 20px; }
  #wrapwrap .ww-atelier .at-ou__l { grid-template-columns: minmax(0, 1fr); }
  #wrapwrap .ww-atelier .at-phs { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  #wrapwrap .ww-atelier { padding-bottom: 112px; }
  #wrapwrap .ww-dash h1.dash-h1.at-h1 { font-size: 40px !important; }
  #wrapwrap .ww-atelier .at-sec { margin-top: 48px; }
  #wrapwrap .ww-atelier .at-ask { display: none; }
  #wrapwrap .ww-atelier .at-sticky { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--at-line); background: #fff; }
  #wrapwrap .ww-atelier .at-sticky .dash-btn { min-height: 48px; }
}


/* ===== vitrine-gl.css ===== */
/* vitrine-gl.css — landing /workwith : glyphes idréva, photos des métiers et bloc « Nos équipements » (handoff landing-v1.2) (Charles 08/10 : « on a pas mis de glyphe sur la landing page »).
   Mêmes glyphes que les pages gamme (glyphes.py) : §02 les 5 verbes (24 px, couleur de l'onglet), §05 les 3 preuves chiffrées (32 px, blanc sur encre).
   §04 : cartes « Pour qui » du handoff landing-v1.3. */
#wrapwrap .ww .ww-gl { display: block; flex: none; width: 24px; height: 24px; }
#wrapwrap .ww .ww-gl--32 { width: 32px; height: 32px; }
#wrapwrap .ww .ww-tab__head { align-items: center; }
#wrapwrap .ww .ww-proof--gl { grid-template-columns: 32px auto minmax(0, 1fr); }
#wrapwrap .ww .ww-proof--gl > .ww-gl { color: #fff; }
#wrapwrap .ww .ww-dot { color: var(--green-500); }
/* §04 « Pour qui » — handoff landing-v1.3 (09/10) : cartes fond ink-50, photo 4:3 sans texte, ligne de scène, pastille jaune du métier, tags en bas */
/* §04 « Pour qui » : 5 métiers (09/11) -> rangée qui défile comme le §06 : 3 cartes visibles à l'ordinateur, 2 à la tablette, une et l'amorce
   de la suivante au téléphone (règle ≤ 760 plus bas) ; flèches et points au-dessus (workwith.js, wwCarrousel) ; sans JS la rangée défile quand même */
#wrapwrap .ww .ww-qui { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 32px) / 3); gap: 16px; margin-top: 64px;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
#wrapwrap .ww .ww-qui::-webkit-scrollbar { display: none; }
#wrapwrap .ww .ww-qui > .ww-qui__card { scroll-snap-align: start; }
#wrapwrap .ww .ww-qui:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }
#wrapwrap .ww .ww-qui__card { display: flex; flex-direction: column; min-width: 0; background: var(--ink-50); border-radius: 12px; overflow: hidden; }
#wrapwrap .ww .ww-qui__photo { position: relative; aspect-ratio: 4 / 3; background: var(--ink-200); overflow: hidden; }
#wrapwrap .ww .ww-qui__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww .ww-qui__scene { display: flex; align-items: center; gap: 10px; padding: 14px 26px; border-bottom: 1px solid var(--border-1); font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-2); }
#wrapwrap .ww .ww-qui__scene > span { flex: none; width: 14px; border-top: 1px solid var(--ink-900); }
#wrapwrap .ww .ww-qui__body { flex: 1; display: grid; grid-template-rows: auto auto 1fr auto; gap: 10px; padding: 24px 26px 26px; }
#wrapwrap .ww .ww-qui__who { display: flex; align-items: center; gap: 10px; }
#wrapwrap .ww .ww-qui__n { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; color: var(--green-700); }
#wrapwrap .ww .ww-qui__pill { padding: 4px 8px; border-radius: 999px; background: var(--yellow-500); color: var(--ink-900); font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
#wrapwrap .ww h3.ww-qui__t { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: -.03em !important; line-height: 1.05 !important; color: var(--ink-900) !important; }
#wrapwrap .ww p.ww-qui__p { margin: 0 !important; font-size: 15px !important; line-height: 1.55 !important; color: var(--text-2) !important; text-wrap: pretty; }
#wrapwrap .ww ul.ww-qui__tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0 !important; padding: 0 !important; list-style: none; }
#wrapwrap .ww ul.ww-qui__tags li { margin: 0; padding: 4px 12px; border: 1px solid var(--ink-200); border-radius: 999px; background: #fff; font-size: 13px; font-weight: 700; color: var(--ink-900); white-space: nowrap; }
/* 10/11 : deux cartes et la moitié de la troisième, retrait de 40 px à gauche (voir components.css, même règle au §06) ; tablette : une carte et demie */
@media (min-width: 761px) { #wrapwrap .ww .ww-qui { margin-left: calc(-1 * var(--ww-bleed, 0px)); padding-left: calc(var(--ww-bleed, 0px) + 40px); padding-top: 8px; padding-bottom: 56px; margin-bottom: -36px; scroll-padding-left: 40px;   /* valeur exacte posée par le script (un % de scroll-padding se rapporte à la rangée elle-même) */ grid-auto-columns: calc((100% - 32px) / 2.5); } }
/* §04 : cartes cliquables en entier (10/11, comme le §06) : main au survol, la carte se soulève ; la marge haute et basse de la rangée laisse la
   place au soulèvement et à l'ombre (sinon coupés par le défilement horizontal) */
#wrapwrap .ww .ww-qui__card { cursor: pointer; transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }   /* pas d'ombre au repos (ajoutée puis retirée par Charles le 10/11) ; ombre au survol seulement */
@media (hover: hover) { #wrapwrap .ww .ww-qui__card:hover { transform: translateY(-4px); box-shadow: var(--shadow-l); } }
#wrapwrap .ww .ww-qui__card:focus-within { box-shadow: var(--shadow-l); }
@media (min-width: 761px) and (max-width: 1100px) { #wrapwrap .ww .ww-qui { grid-auto-columns: calc((100% - 16px) / 1.5); } }
/* §01 : bloc « Nos équipements » — handoff landing-v1.2 (09/10) */
#wrapwrap .ww .ww-fam { width: 100%; max-width: 1120px; margin-top: 112px; display: grid; gap: 24px; }
#wrapwrap .ww .ww-fam__head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 12px 24px; padding-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, .14); }
#wrapwrap .ww .ww-fam__k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-300); }
#wrapwrap .ww a.ww-fam__all { display: inline-flex; align-items: center; min-height: 44px; white-space: nowrap; font-family: var(--font-sans) !important; font-size: 15px !important; font-weight: 700 !important; color: #fff !important; text-decoration: none !important; }
#wrapwrap .ww a.ww-fam__all:hover { color: var(--ink-200, #E4E4E1) !important; }
#wrapwrap .ww .ww-fam__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
#wrapwrap .ww a.ww-fam__item { display: flex; flex-direction: column; min-width: 0; border: 1px solid rgba(255, 255, 255, .14); border-radius: 12px; overflow: hidden; background: var(--ink-800); color: #fff !important; text-decoration: none !important; transition: border-color .16s ease-out; }
#wrapwrap .ww a.ww-fam__item:hover { border-color: rgba(255, 255, 255, .55); }
#wrapwrap .ww a.ww-fam__item:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--ink-900), 0 0 0 4px var(--green-500); }
#wrapwrap .ww .ww-fam__photo { position: relative; aspect-ratio: 4 / 3; background: var(--ink-700); overflow: hidden; }
#wrapwrap .ww .ww-fam__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
#wrapwrap .ww .ww-fam__num { position: absolute; left: 12px; top: 12px; padding: 4px 8px; border-radius: 999px; background: #fff; color: var(--ink-900); font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .12em; line-height: 1.2; }
#wrapwrap .ww .ww-fam__photo .ww-tech.ww-fam__tech { position: absolute; top: 12px; right: 12px; z-index: 1; pointer-events: none; }   /* SolidFit™ / OneBloc™ : pleine sur photo (règle du TechTag), en face du numéro */
#wrapwrap .ww .ww-fam__body { flex: 1; display: grid; grid-template-rows: auto 1fr auto; gap: 8px; padding: 20px 22px 22px; }
#wrapwrap .ww h3.ww-fam__t { margin: 0 !important; font-family: var(--font-sans) !important; font-size: 20px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.15 !important; color: #fff !important; }
#wrapwrap .ww p.ww-fam__u { margin: 0 !important; font-size: 15px !important; line-height: 1.45 !important; color: var(--ink-300) !important; text-wrap: pretty; }
#wrapwrap .ww .ww-fam__go { margin-top: 12px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .1); display: flex; justify-content: space-between; align-items: center; font-family: var(--font-sans); font-size: 14px; font-weight: 700; color: #fff; }
@media (max-width: 1100px) { #wrapwrap .ww .ww-fam__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  #wrapwrap .ww-vitrine > section#sec-metier { padding-left: 16px !important; padding-right: 16px !important; }   /* maquette v1.2 : §01 à 16 px comme les autres sections (était 64 px) */
  #wrapwrap .ww-vitrine > section#sec-metier h2 { font-size: 36px !important; }   /* maquette v1.2 : titre 36 px sur mobile (était 56 px, 4 lignes) */
  #wrapwrap .ww-vitrine > section#sec-metier > div > span:first-child { height: 64px; }   /* trait vertical 64 px (maquette v1.2) */
  #wrapwrap .ww .ww-fam { margin-top: 72px; }
  #wrapwrap .ww .ww-fam__list { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 0 -16px; padding: 0 16px 4px; scroll-padding-inline: 16px; scrollbar-width: none; }   /* carrousel, débord jusqu'aux bords */
  #wrapwrap .ww .ww-fam__list::-webkit-scrollbar { display: none; }
  #wrapwrap .ww a.ww-fam__item { flex: 0 0 78%; scroll-snap-align: start; }
  #wrapwrap .ww-vitrine > section#sec-qui h2 { font-size: 36px !important; }   /* v1.3 mobile : 32 px -> 36 px, même niveau que les autres titres (11/10) ; trait 64 px */
  #wrapwrap .ww-vitrine > section#sec-qui > div > div:first-child > span { height: 64px; }
  #wrapwrap .ww .ww-qui { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 40px -16px 0; padding: 0 16px 4px; scroll-padding-inline: 16px; scrollbar-width: none; }   /* §04 : carrousel (v1.3) */
  #wrapwrap .ww .ww-qui::-webkit-scrollbar { display: none; }
  #wrapwrap .ww .ww-qui__card { flex: 0 0 82%; scroll-snap-align: start; }
  #wrapwrap .ww .ww-proof--gl { grid-template-columns: 28px auto minmax(0, 1fr); gap: 14px; }
  #wrapwrap .ww .ww-proof--gl > .ww-gl { width: 28px; height: 28px; }
}


/* ===== seg.css ===== */
/* ===== seg.css — FILTRES = SELECTEUR SEGMENTE, partout (Charles 10/10 : « sur beaucoup de vues tu mets des tags, le design est celui en PJ ») :
   fond gris, onglet actif blanc a ombre legere, libelle gras, compteur mono discret ; plus de pastilles noires. Charge en dernier : il prime.
   Concerne : Documents (types, onglets de la Bibliotheque), Mes factures, Actualites, Atelier (photos), Administration (societes),
   Catalogue (pastilles, sous-familles), Chiffrage (sous-familles des articles standard). Deja segmentes : listes chiffrages / commandes /
   projets, « Par projet / Par date », documents reserves. ===== */
html body #wrapwrap .ww-ddocs .dd-pills:not([hidden]), html body #wrapwrap .ww-inv .iv-pills, html body #wrapwrap .ww-dash .nw-pills,
html body #wrapwrap .ww-atelier .at-pills, html body #wrapwrap .ww-admin .so-filters, html body #wrapwrap .ww-cat .cg-pills,
html body #wrapwrap .ww-cat .cg-subs, html body #wrapwrap .ww-cat .cg-chips, html body #wrapwrap .ww-quote .qt-std__subs:not([hidden]) {
  display: inline-flex; flex-wrap: nowrap; gap: 4px; width: fit-content; max-width: 100%; margin-left: 0; margin-right: 0; padding: 4px;
  border-radius: 12px; background: var(--ink-100); overflow-x: auto; scrollbar-width: none; list-style: none; vertical-align: top; }
html body #wrapwrap .ww-ddocs button.dd-pill, html body #wrapwrap .ww-inv button.iv-pill, html body #wrapwrap .ww-dash .nw-pill,
html body #wrapwrap .ww-atelier button.at-pill, html body #wrapwrap .ww-admin a.so-chip, html body #wrapwrap .ww-cat .cg-pill,
html body #wrapwrap .ww-cat .cg-sub, html body #wrapwrap .ww-cat .cg-chip, html body #wrapwrap .ww-quote button.qt-ssub {
  flex: none; display: inline-flex; align-items: center; gap: 8px; height: auto; min-height: 36px; margin: 0; padding: 0 14px;
  border: 0 !important; border-radius: 9px; background: transparent; box-shadow: none; color: var(--text-2) !important;
  font-family: var(--font-sans); font-size: 14px; font-weight: 700; line-height: 1.2; white-space: nowrap; text-decoration: none !important; cursor: pointer; }
html body #wrapwrap .ww-ddocs button.dd-pill:hover, html body #wrapwrap .ww-inv button.iv-pill:hover, html body #wrapwrap .ww-dash .nw-pill:hover,
html body #wrapwrap .ww-atelier button.at-pill:hover, html body #wrapwrap .ww-admin a.so-chip:hover, html body #wrapwrap .ww-cat .cg-pill:hover,
html body #wrapwrap .ww-cat .cg-sub:hover, html body #wrapwrap .ww-cat .cg-chip:hover, html body #wrapwrap .ww-quote button.qt-ssub:hover { color: var(--ink-900) !important; }
html body #wrapwrap .ww-ddocs button.dd-pill[aria-pressed="true"], html body #wrapwrap .ww-inv button.iv-pill[aria-pressed="true"],
html body #wrapwrap .ww-dash .nw-pill[aria-pressed="true"], html body #wrapwrap .ww-atelier button.at-pill[aria-pressed="true"],
html body #wrapwrap .ww-admin a.so-chip[aria-pressed="true"], html body #wrapwrap .ww-cat .cg-pill.is-on, html body #wrapwrap .ww-cat .cg-sub.is-on,
html body #wrapwrap .ww-cat .cg-chip.is-on, html body #wrapwrap .ww-quote button.qt-ssub.is-on {
  background: #fff; color: var(--ink-900) !important; box-shadow: 0 1px 2px rgba(20, 20, 20, .08); }
/* compteurs : mono, gris, sans pastille de fond */
html body #wrapwrap .ww-ddocs .dd-pill b, html body #wrapwrap .ww-inv .iv-pill__n, html body #wrapwrap .ww-dash .nw-pill small,
html body #wrapwrap .ww-atelier button.at-pill span, html body #wrapwrap .ww-admin a.so-chip b, html body #wrapwrap .ww-cat .cg-pill small,
html body #wrapwrap .ww-cat .cg-sub small, html body #wrapwrap .ww-cat .cg-chip small, html body #wrapwrap .ww-quote .qt-ssub small {
  padding: 0; border-radius: 0; background: none; opacity: 1; font-family: var(--font-mono) !important; font-size: 12px !important; font-weight: 500 !important; color: var(--text-3) !important; }
/* onglet actif : meme compteur gris (les anciennes regles le peignaient en blanc pour le fond noir) */
html body #wrapwrap .ww-ddocs .dd-pill[aria-pressed="true"] b, html body #wrapwrap .ww-inv .iv-pill[aria-pressed="true"] .iv-pill__n,
html body #wrapwrap .ww-dash .nw-pill[aria-pressed="true"] small, html body #wrapwrap .ww-atelier button.at-pill[aria-pressed="true"] span,
html body #wrapwrap .ww-admin a.so-chip[aria-pressed="true"] b, html body #wrapwrap .ww-cat .cg-pill.is-on small, html body #wrapwrap .ww-cat .cg-sub.is-on small,
html body #wrapwrap .ww-cat .cg-chip.is-on small, html body #wrapwrap .ww-quote .qt-ssub.is-on small { color: var(--text-3) !important; background: none; }
html body #wrapwrap .ww-quote .qt-ssub .qt-sdot, html body #wrapwrap .ww-quote .qt-ssub.is-on .qt-sdot { display: none; }
/* clavier : anneau vert a l'interieur (le conteneur gris coupe un anneau exterieur) */
html body #wrapwrap .ww-ddocs button.dd-pill:focus-visible, html body #wrapwrap .ww-inv button.iv-pill:focus-visible, html body #wrapwrap .ww-dash .nw-pill:focus-visible,
html body #wrapwrap .ww-atelier button.at-pill:focus-visible, html body #wrapwrap .ww-admin a.so-chip:focus-visible, html body #wrapwrap .ww-cat .cg-pill:focus-visible,
html body #wrapwrap .ww-cat .cg-sub:focus-visible, html body #wrapwrap .ww-cat .cg-chip:focus-visible, html body #wrapwrap .ww-quote button.qt-ssub:focus-visible {
  outline: none; box-shadow: inset 0 0 0 2px var(--green-500); }
html body #wrapwrap .ww-ddocs .dd-pills::-webkit-scrollbar, html body #wrapwrap .ww-inv .iv-pills::-webkit-scrollbar, html body #wrapwrap .ww-dash .nw-pills::-webkit-scrollbar,
html body #wrapwrap .ww-atelier .at-pills::-webkit-scrollbar, html body #wrapwrap .ww-admin .so-filters::-webkit-scrollbar, html body #wrapwrap .ww-cat .cg-pills::-webkit-scrollbar,
html body #wrapwrap .ww-cat .cg-subs::-webkit-scrollbar, html body #wrapwrap .ww-cat .cg-chips::-webkit-scrollbar, html body #wrapwrap .ww-quote .qt-std__subs::-webkit-scrollbar { display: none; }
@media (max-width: 760px) {
  html body #wrapwrap .ww-ddocs .dd-pills:not([hidden]), html body #wrapwrap .ww-inv .iv-pills, html body #wrapwrap .ww-dash .nw-pills,
  html body #wrapwrap .ww-atelier .at-pills, html body #wrapwrap .ww-admin .so-filters, html body #wrapwrap .ww-cat .cg-pills,
  html body #wrapwrap .ww-cat .cg-subs, html body #wrapwrap .ww-cat .cg-chips, html body #wrapwrap .ww-quote .qt-std__subs:not([hidden]) {
    margin-left: 0; margin-right: 0; padding: 4px; scroll-padding-inline: 4px; }
  html body #wrapwrap .ww-ddocs button.dd-pill, html body #wrapwrap .ww-inv button.iv-pill, html body #wrapwrap .ww-dash .nw-pill,
  html body #wrapwrap .ww-atelier button.at-pill, html body #wrapwrap .ww-admin a.so-chip, html body #wrapwrap .ww-cat .cg-pill,
  html body #wrapwrap .ww-cat .cg-sub, html body #wrapwrap .ww-cat .cg-chip, html body #wrapwrap .ww-quote button.qt-ssub { min-height: 40px; padding: 0 12px; }
}


/* ===== apropos.css ===== */
/* apropos.css (généré par apropos_build.py) : page « Qui sommes-nous » ; ab-t-* = typo (!important contre le thème), ab-s-* = styles de la maquette */
#wrapwrap .ww-ab .ab-t-824ac{font-weight:inherit !important}
#wrapwrap .ww-ab .ab-t-fe39c{color:var(--ink-200) !important;font-size:19px !important;line-height:1.5 !important}
#wrapwrap .ww-ab .ab-t-edd9d{color:rgb(255, 255, 255) !important;font-size:clamp(34px, 4.6cqi, 64px) !important;font-weight:900 !important;letter-spacing:-0.04em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-42ed4{color:var(--text-2) !important;font-size:17px !important;line-height:1.55 !important}
#wrapwrap .ww-ab .ab-t-d9007{color:var(--ink-400) !important;font-size:clamp(28px, 4cqi, 56px) !important;font-weight:900 !important;letter-spacing:-0.04em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-23315{color:rgb(255, 255, 255) !important;font-size:clamp(40px, 4.6cqi, 64px) !important;font-weight:900 !important;letter-spacing:-0.05em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-29485{font-size:clamp(34px, 4.6cqi, 64px) !important;font-weight:900 !important;letter-spacing:-0.04em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-8dc7d{font-size:22px !important;font-weight:900 !important;letter-spacing:-0.025em !important;line-height:1.1 !important}
#wrapwrap .ww-ab .ab-t-64e48{font-size:44px !important;font-weight:900 !important;letter-spacing:-0.035em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-a6338{font-family:var(--font-mono) !important;font-size:22px !important;font-weight:700 !important;letter-spacing:-0.02em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-e71b4{font-size:30px !important;font-weight:900 !important;letter-spacing:-0.03em !important;line-height:1.05 !important}
#wrapwrap .ww-ab .ab-t-42aca{color:var(--text-2) !important;font-size:16px !important;line-height:1.55 !important}
#wrapwrap .ww-ab .ab-t-3bb5a{color:var(--ink-900) !important;font-family:var(--font-sans) !important;font-size:13px !important;font-weight:700 !important;line-height:1 !important;text-decoration:none !important}
#wrapwrap .ww-ab .ab-t-3c016{font-size:clamp(36px, 4.6cqi, 64px) !important;font-weight:900 !important;letter-spacing:-0.045em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-12f7a{color:inherit !important;font-size:clamp(32px, 4.2cqi, 56px) !important;font-weight:900 !important;letter-spacing:-0.04em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-5a10a{color:rgb(255, 255, 255) !important;font-size:clamp(36px, 4.6cqi, 64px) !important;font-weight:900 !important;letter-spacing:-0.045em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-8ec96{color:var(--ink-300) !important;font-size:17px !important;line-height:1.55 !important}
#wrapwrap .ww-ab .ab-t-261f6{color:var(--text-3) !important;font-family:var(--font-mono) !important;font-size:11px !important;font-weight:400 !important;letter-spacing:0.14em !important;line-height:inherit !important}
#wrapwrap .ww-ab .ab-t-93636{font-size:17px !important;font-weight:700 !important}
#wrapwrap .ww-ab .ab-t-7cac0{color:var(--ink-900) !important;font-size:15px !important;font-weight:700 !important;text-decoration:none !important}
#wrapwrap .ww-ab .ab-t-5fac2{color:var(--ink-900) !important;font-family:var(--font-sans) !important;font-size:14px !important;font-weight:700 !important;line-height:1 !important;text-decoration:none !important}
#wrapwrap .ww-ab .ab-t-afbfe{font-size:60px !important;font-weight:900 !important;letter-spacing:-0.04em !important;line-height:1 !important}
#wrapwrap .ww-ab .ab-t-6d98d{color:var(--text-2) !important;font-size:18px !important;line-height:1.5 !important}
#wrapwrap .ww-ab .ab-t-9f81c{color:var(--text-2) !important;font-size:15px !important;line-height:1.5 !important}
#wrapwrap .ww-ab .ab-t-6867a{color:var(--ink-300) !important;font-size:15px !important;line-height:1.5 !important}
#wrapwrap .ww-ab .ab-t-89fa0{color:var(--text-2) !important;font-size:16px !important;line-height:1.6 !important}
#wrapwrap .ww-ab .ab-s-c4212{background:var(--ink-900);color:rgb(255, 255, 255);padding:0px 64px}
#wrapwrap .ww-ab .ab-s-48f07{max-width:1200px;margin:0px auto;box-sizing:border-box;display:grid;gap:40px;padding-top:56px}
#wrapwrap .ww-ab .ab-s-d2c2b{margin:0px;display:grid;gap:40px}
#wrapwrap .ww-ab .ab-s-8c04e{display:flex;align-items:center;gap:10px 12px;flex-wrap:wrap;font-size:16px;line-height:1.55}
#wrapwrap .ww-ab .ab-s-d220f{white-space:nowrap;font-family:var(--font-mono);font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:rgb(255, 255, 255)}
#wrapwrap .ww-ab .ab-s-d9ebe{width:1px;height:14px;background:rgba(255, 255, 255, 0.4)}
#wrapwrap .ww-ab .ab-s-27070{display:flex;gap:6px;flex-wrap:wrap}
#wrapwrap .ww-ab .ab-s-68b67{white-space:nowrap;font-family:var(--font-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-900);background:var(--yellow-500);padding:4px 8px;border-radius:999px;font-weight:600}
#wrapwrap .ww-ab .ab-s-f5090{margin:0px;font-size:clamp(46px, 9.4cqi, 148px);font-weight:900;letter-spacing:-0.055em;line-height:1;color:rgb(255, 255, 255);text-wrap:balance;display:block}
#wrapwrap .ww-ab .ab-s-dcc6c{color:var(--ink-400)}
#wrapwrap .ww-ab .ab-s-43bac{color:var(--green-500)}
#wrapwrap .ww-ab .ab-s-d6cc2{display:grid;grid-template-columns:minmax(0px, 1fr) auto;gap:24px 48px;align-items:end}
#wrapwrap .ww-ab .ab-s-7dee6{margin:0px;max-width:600px;text-wrap:pretty}
#wrapwrap .ww-ab .ab-s-24a71{display:block;height:34px;width:auto}
#wrapwrap .ww-ab .ab-s-65620{position:relative;box-sizing:border-box;border:1px solid rgba(255, 255, 255, 0.5);border-radius:20px;padding:14px}
#wrapwrap .ww-ab .ab-s-a2305{position:absolute;left:50%;bottom:-6px;width:12px;height:12px;margin-left:-6px;border-radius:6px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 6px}
#wrapwrap .ww-ab .ab-s-cc242{display:block;width:100%;aspect-ratio:21 / 8;object-fit:cover;object-position:center center;border-radius:12px}
#wrapwrap .ww-ab .ab-s-8fe64{display:block;justify-self:center;width:0px;height:96px;border-left:1px solid rgba(255, 255, 255, 0.4);margin-top:-34px}
#wrapwrap .ww-ab .ab-s-51cbe{background:var(--ink-900);color:transparent;-webkit-text-stroke:1px rgba(255, 255, 255, 0.45);overflow:hidden;padding:0px 0px 64px}
#wrapwrap .ww-ab .ab-s-25724{display:flex;gap:40px;width:max-content;font-size:clamp(40px, 6cqi, 88px);font-weight:900;letter-spacing:-0.04em;line-height:1;animation:38s linear 0s infinite normal none running ww-ab-marq}
#wrapwrap .ww-ab .ab-s-7ec23{display:inline-flex;align-items:center;gap:40px;white-space:nowrap}
#wrapwrap .ww-ab .ab-s-35a24{width:14px;height:14px;border-radius:7px;background:var(--green-500);flex:0 0 auto}
#wrapwrap .ww-ab .ab-s-067e8{background:var(--ink-900);color:rgb(255, 255, 255);padding:0px 64px 128px}
#wrapwrap .ww-ab .ab-s-85bc8{max-width:1200px;margin:0px auto;box-sizing:border-box;display:grid;grid-template-columns:minmax(0px, 1fr)}
#wrapwrap .ww-ab .ab-s-2f836{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:24px 48px;align-items:end;margin-top:0px}
#wrapwrap .ww-ab .ab-s-080a8{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-400)}
#wrapwrap .ww-ab .ab-s-623f9{display:inline-flex;align-items:center;gap:12px;white-space:nowrap}
#wrapwrap .ww-ab .ab-s-9f245{width:8px;height:8px;border-radius:4px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 4px;flex:0 0 auto}
#wrapwrap .ww-ab .ab-s-07db5{display:flex;align-items:center;gap:16px;justify-self:end}
#wrapwrap .ww-ab .ab-s-6495b{display:block;height:24px;width:auto}
#wrapwrap .ww-ab .ab-s-716ec{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-400);white-space:nowrap}
#wrapwrap .ww-ab .ab-s-9be02{margin-top:24px;font-family:var(--font-mono);font-size:clamp(72px, 19.5cqi, 286px);letter-spacing:-0.07em;line-height:0.85;color:rgb(255, 255, 255);white-space:nowrap;animation-duration:auto;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:both;animation-play-state:running;animation-name:ww-ab-rise;animation-timeline:view();animation-range:entry cover 28%}
#wrapwrap .ww-ab .ab-s-d81fe{margin:40px 0px 0px;max-width:900px;text-wrap:balance}
#wrapwrap .ww-ab .ab-s-19229{display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));gap:32px;margin-top:72px}
#wrapwrap .ww-ab .ab-s-dc2ee{display:grid;gap:14px;align-content:start;padding-top:24px;border-top:1px solid rgba(255, 255, 255, 0.18);animation-duration:auto;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:both;animation-play-state:running;animation-name:ww-ab-rise;animation-timeline:view();animation-range:entry cover 28%}
#wrapwrap .ww-ab .ab-s-142fc{font-size:24px;font-weight:900;letter-spacing:-0.03em;line-height:1.08;text-wrap:balance;color:rgb(255, 255, 255)}
#wrapwrap .ww-ab .ab-s-e6899{font-size:clamp(32px, 3.6cqi, 48px);font-weight:900;letter-spacing:-0.03em;line-height:1.08;text-wrap:balance;color:var(--green-500)}
#wrapwrap .ww-ab .ab-s-d9f0d{background:rgb(255, 255, 255);padding:128px 64px}
#wrapwrap .ww-ab .ab-s-ccf2b{max-width:1200px;margin:0px auto;box-sizing:border-box;display:grid;gap:56px}
#wrapwrap .ww-ab .ab-s-2c8c9{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:24px 48px;align-items:end}
#wrapwrap .ww-ab .ab-s-684e7{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-3)}
#wrapwrap .ww-ab .ab-s-d819a{margin:0px;max-width:480px;justify-self:end}
#wrapwrap .ww-ab .ab-s-e2457{display:grid;gap:clamp(10px, 1.4cqi, 20px)}
#wrapwrap .ww-ab .ab-s-7a348{margin:0px;font-size:clamp(34px, 6.4cqi, 92px);font-weight:900;letter-spacing:-0.045em;line-height:0.98;text-wrap:balance;color:var(--ink-900);animation-duration:auto;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:both;animation-play-state:running;animation-name:ww-ab-ink;animation-timeline:view();animation-range:entry cover 30%}
#wrapwrap .ww-ab .ab-s-2b97b{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:16px}
#wrapwrap .ww-ab .ab-s-ee056{margin:0px;display:grid;grid-template-columns:minmax(0px, 1fr);gap:10px;min-width:0px}
#wrapwrap .ww-ab .ab-s-1df7f{box-sizing:border-box;border:1px solid var(--ink-900);border-radius:16px;padding:10px}
#wrapwrap .ww-ab .ab-s-d61ac{display:block;width:100%;aspect-ratio:16 / 10}
#wrapwrap .ww-ab .ab-s-26ed1{font-family:var(--font-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-3)}
#wrapwrap .ww-ab .ab-s-bd701{background:var(--ink-900);color:rgb(255, 255, 255);padding:128px 64px}
#wrapwrap .ww-ab .ab-s-9e710{max-width:1200px;margin:0px auto;box-sizing:border-box;display:grid;gap:64px}
#wrapwrap .ww-ab .ab-s-2be39{display:grid;gap:18px}
#wrapwrap .ww-ab .ab-s-2b529{margin:0px}
#wrapwrap .ww-ab .ab-s-95ea8{text-decoration-thickness:4px;text-decoration-color:var(--green-500)}
#wrapwrap .ww-ab .ab-s-c7833{margin:0px;text-wrap:balance;animation-duration:auto;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:both;animation-play-state:running;animation-name:ww-ab-rise;animation-timeline:view();animation-range:entry cover 28%}
#wrapwrap .ww-ab .ab-s-18865{display:flex;align-items:center;justify-content:space-between;gap:12px}
#wrapwrap .ww-ab .ab-s-a7118{display:block;height:26px;width:auto}
#wrapwrap .ww-ab .ab-s-dcb0f{box-sizing:border-box;border:1px solid rgba(255, 255, 255, 0.5);border-radius:16px;padding:10px}
#wrapwrap .ww-ab .ab-s-eadb1{display:block;width:100%;aspect-ratio:16 / 8;object-fit:cover;object-position:center top;border-radius:12px}
#wrapwrap .ww-ab .ab-s-81aaf{display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));gap:32px}
#wrapwrap .ww-ab .ab-s-401a1{display:grid;gap:8px;padding:28px 0px 0px;border-top:1px solid rgba(255, 255, 255, 0.18);min-width:0px;animation-duration:auto;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:both;animation-play-state:running;animation-name:ww-ab-rise;animation-timeline:view();animation-range:entry cover 28%}
#wrapwrap .ww-ab .ab-s-448b1{font-size:clamp(40px, 5cqi, 68px);font-weight:900;letter-spacing:-0.05em;line-height:0.9;white-space:nowrap}
#wrapwrap .ww-ab .ab-s-0824a{font-size:0.45em;letter-spacing:-0.02em;margin-left:2px}
#wrapwrap .ww-ab .ab-s-9178c{font-size:15px;line-height:1.4;color:var(--ink-300);max-width:220px}
#wrapwrap .ww-ab .ab-s-66c1a{background:var(--surface-sunken);padding:128px 64px}
#wrapwrap .ww-ab .ab-s-bcb55{display:grid;gap:14px}
#wrapwrap .ww-ab .ab-s-6430b{margin:0px;text-wrap:balance}
#wrapwrap .ww-ab .ab-s-c9d45{position:relative;min-width:0px;max-width:100%}
#wrapwrap .ww-ab .ab-s-af769{position:absolute;left:0px;right:0px;top:12px;border-top:1px solid var(--ink-900)}
#wrapwrap .ww-ab .ab-s-b910e{position:relative;display:grid;grid-template-columns:repeat(5, minmax(0px, 1fr));gap:28px}
#wrapwrap .ww-ab .ab-s-403bb{position:relative;display:grid;gap:14px;align-content:start;min-width:0px;scroll-snap-align:start;padding-top:44px}
#wrapwrap .ww-ab .ab-s-a23bd{position:absolute;left:0px;top:7px;width:10px;height:10px;margin-top:0px;border-radius:8px;background:var(--ink-900)}
#wrapwrap .ww-ab .ab-s-c3675{display:flex;align-items:center;gap:10px}
#wrapwrap .ww-ab .ab-s-f34a3{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1)}
#wrapwrap .ww-ab .ab-s-691ef{flex:0 0 auto;display:inline-block}
#wrapwrap .ww-ab .ab-s-8b8bd{font-size:15px;line-height:1.5;color:var(--text-2);max-width:220px}
#wrapwrap .ww-ab .ab-s-b4e3d{position:absolute;left:0px;top:7px;width:14px;height:14px;margin-top:-2px;border-radius:8px;background:var(--green-500);animation:2s ease-out 0s infinite normal none running ww-ab-pulse}
#wrapwrap .ww-ab .ab-s-9164f{font-family:var(--font-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;font-weight:700;color:var(--ink-900);background:var(--green-500);padding:3px 7px;border-radius:999px;white-space:nowrap}
#wrapwrap .ww-ab .ab-s-4a3c3{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--ink-900);color:rgb(255, 255, 255);border:1px solid var(--ink-900)}
#wrapwrap .ww-ab .ab-s-1514f{display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));gap:16px}
#wrapwrap .ww-ab .ab-s-d948b{display:block;width:100%;aspect-ratio:4 / 5}
#wrapwrap .ww-ab .ab-s-4eb3d{display:block;width:100%;aspect-ratio:4 / 5;object-fit:cover;object-position:center top;border-radius:12px}
#wrapwrap .ww-ab .ab-s-d568b{background:var(--surface-sunken);padding:128px 24px}
#wrapwrap .ww-ab .ab-s-61185{max-width:1200px;margin:0px auto}
#wrapwrap .ww-ab .ab-s-7dd56{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:48px;align-items:end}
#wrapwrap .ww-ab .ab-s-09284{min-width:0px}
#wrapwrap .ww-ab .ab-s-d193c{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-accent);line-height:1.4}
#wrapwrap .ww-ab .ab-s-93bd7{margin-top:12px;text-wrap:balance}
#wrapwrap .ww-ab .ab-s-be22a{max-width:520px;text-wrap:pretty}
#wrapwrap .ww-ab .ab-s-70e54{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 36px;margin-top:40px;padding-top:20px;border-top:1px solid var(--ink-900)}
#wrapwrap .ww-ab .ab-s-86c98{display:inline-flex;align-items:baseline;gap:10px}
#wrapwrap .ww-ab .ab-s-afbda{font-size:14px;color:var(--text-2);white-space:nowrap}
#wrapwrap .ww-ab .ab-s-4e73d{display:grid;grid-template-columns:minmax(0px, 7fr) minmax(0px, 5fr);gap:48px;margin-top:64px;align-items:center}
#wrapwrap .ww-ab .ab-s-36965{position:relative;display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));grid-template-rows:repeat(3, minmax(124px, auto));grid-template-areas:"a b c" "h z d" "g f e";gap:12px}
#wrapwrap .ww-ab .ab-s-b2b0b{position:absolute;left:50%;top:0px;bottom:0px;border-left:1px solid var(--ink-300)}
#wrapwrap .ww-ab .ab-s-d80eb{position:absolute;top:50%;left:0px;right:0px;border-top:1px solid var(--ink-300)}
#wrapwrap .ww-ab .ab-s-b86b6{grid-area:z;position:relative;z-index:1;place-self:center;display:grid;justify-items:center;gap:10px;padding:18px 20px;border-radius:14px;background:var(--ink-900);color:rgb(255, 255, 255);box-shadow:0 0 0 8px var(--surface-sunken)}
#wrapwrap .ww-ab .ab-s-f978a{display:block;height:22px;width:auto}
#wrapwrap .ww-ab .ab-s-17267{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-300);white-space:nowrap}
#wrapwrap .ww-ab .ab-s-d9ce5{cursor:pointer;grid-area:a;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-c41d9{display:flex;align-items:center;justify-content:space-between;gap:8px}
#wrapwrap .ww-ab .ab-s-a5008{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;opacity:0.65}
#wrapwrap .ww-ab .ab-s-a103c{width:8px;height:8px;border-radius:4px;background:var(--ink-200);box-shadow:none}
#wrapwrap .ww-ab .ab-s-76ac9{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:var(--ink-50);color:var(--ink-900)}
#wrapwrap .ww-ab .ab-s-d8a70{display:grid;gap:4px}
#wrapwrap .ww-ab .ab-s-65a73{font-size:15px;font-weight:700;line-height:1.15;letter-spacing:-0.01em;text-wrap:balance}
#wrapwrap .ww-ab .ab-s-fb092{font-size:12px;line-height:1.35;color:var(--text-3)}
#wrapwrap .ww-ab .ab-s-5b3cf{cursor:pointer;grid-area:b;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-a029d{cursor:pointer;grid-area:c;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-56c88{cursor:pointer;grid-area:d;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-8bd90{cursor:pointer;grid-area:e;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-0307f{cursor:pointer;grid-area:f;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-8216c{cursor:pointer;grid-area:g;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-328ba{cursor:pointer;grid-area:h;position:relative;z-index:1;box-sizing:border-box;width:100%;min-height:124px;display:grid;grid-template-rows:auto 1fr auto;gap:12px;padding:14px 14px 12px;border-radius:12px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1);box-shadow:none;text-align:left;transition:background 0.2s ease-out, border-color 0.2s ease-out, box-shadow 0.2s ease-out, transform 0.2s ease-out;transform:none}
#wrapwrap .ww-ab .ab-s-83d04{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(200px, 38%);align-items:stretch;min-width:0px;border-radius:14px;background:rgb(255, 255, 255);border:1px solid var(--border-1);overflow:hidden}
#wrapwrap .ww-ab .ab-s-10d78{display:grid;gap:18px;padding:28px 32px 32px}
#wrapwrap .ww-ab .ab-s-1d59e{display:grid;gap:12px;min-width:0px}
#wrapwrap .ww-ab .ab-s-9f0e4{display:flex;align-items:center;gap:12px}
#wrapwrap .ww-ab .ab-s-b62b2{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:var(--ink-900);color:rgb(255, 255, 255)}
#wrapwrap .ww-ab .ab-s-8bc74{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-3);white-space:nowrap}
#wrapwrap .ww-ab .ab-s-a0fab{display:inline-flex;align-items:center;gap:8px;justify-self:start;padding:6px 10px;border-radius:999px;background:var(--ink-900);color:rgb(255, 255, 255);font-family:var(--font-mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;white-space:nowrap}
#wrapwrap .ww-ab .ab-s-8d52c{width:6px;height:6px;border-radius:3px;background:var(--green-500)}
#wrapwrap .ww-ab .ab-s-a0a7f{margin:0px;text-wrap:pretty}
#wrapwrap .ww-ab .ab-s-a2a57{margin:0px;padding:0px;list-style:none;display:grid;gap:10px;width:100%}
#wrapwrap .ww-ab .ab-s-aead2{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--ink-900);min-width:0px}
#wrapwrap .ww-ab .ab-s-16f76{margin-top:7px;width:6px;height:6px;flex:0 0 auto;border-radius:3px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 3px}
#wrapwrap .ww-ab .ab-s-80c6b{flex:1 1 auto;min-width:0px;text-wrap:pretty}
#wrapwrap .ww-ab .ab-s-d94dd{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:18px;border-top:1px solid var(--border-1)}
#wrapwrap .ww-ab .ab-s-a736b{display:grid;gap:2px;min-width:0px}
#wrapwrap .ww-ab .ab-s-0ddd3{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-3)}
#wrapwrap .ww-ab .ab-s-c39c6{font-size:14px;font-weight:700;line-height:1.4}
#wrapwrap .ww-ab .ab-s-1fe6c{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:32px;padding:0px 12px;border-radius:var(--radius-m);border:1px solid var(--ink-300);background:rgb(255, 255, 255);cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww-ab .ab-s-51887{position:relative;min-height:260px;background:var(--ink-100);border-left:1px solid var(--border-1)}
#wrapwrap .ww-ab .ab-s-6ed96{position:absolute;inset:0px;display:block;width:100%;height:100%}
#wrapwrap .ww-ab .ab-s-9aa83{display:grid;gap:14px;justify-items:center;text-align:center}
#wrapwrap .ww-ab .ab-s-cefa9{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-3);white-space:nowrap}
#wrapwrap .ww-ab .ab-s-47f7a{margin:0px;max-width:960px;text-wrap:balance}
#wrapwrap .ww-ab .ab-s-b16b7{display:grid;grid-template-columns:minmax(0px, 1fr) minmax(0px, 1fr);gap:16px;align-items:stretch}
#wrapwrap .ww-ab .ab-s-57694{display:grid;gap:32px;align-content:start;min-width:0px;padding:clamp(28px, 4cqi, 56px);border-radius:16px;background:var(--ink-900);color:rgb(255, 255, 255);border:1px solid var(--ink-900)}
#wrapwrap .ww-ab .ab-s-daa69{display:grid;grid-template-columns:repeat(2, minmax(0px, 1fr));gap:24px 20px}
#wrapwrap .ww-ab .ab-s-ca7c9{display:grid;gap:6px;padding-top:16px;border-top:1px solid rgba(255, 255, 255, 0.16)}
#wrapwrap .ww-ab .ab-s-748a1{font-family:var(--font-mono);font-size:clamp(24px, 2.6cqi, 34px);letter-spacing:-0.04em;line-height:1}
#wrapwrap .ww-ab .ab-s-d20e3{font-size:14px;line-height:1.4;color:var(--ink-300)}
#wrapwrap .ww-ab .ab-s-d6eab{display:grid;gap:32px;align-content:start;min-width:0px;padding:clamp(28px, 4cqi, 56px);border-radius:16px;background:rgb(255, 255, 255);color:var(--ink-900);border:1px solid var(--border-1)}
#wrapwrap .ww-ab .ab-s-a193c{display:block;width:100%;aspect-ratio:16 / 10;object-fit:cover;object-position:center top;border-radius:10px}
#wrapwrap .ww-ab .ab-s-f4743{display:grid;gap:6px;padding-top:16px;border-top:1px solid var(--border-1)}
#wrapwrap .ww-ab .ab-s-a997b{font-size:14px;line-height:1.4;color:var(--text-2)}
#wrapwrap .ww-ab .ab-s-2dfc3{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--green-500)}
#wrapwrap .ww-ab .ab-s-cbfc5{display:block;width:100%;aspect-ratio:3 / 4}
#wrapwrap .ww-ab .ab-s-a21a4{font-family:var(--font-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-400)}
#wrapwrap .ww-ab .ab-s-c1e98{max-width:1200px;margin:0px auto;box-sizing:border-box;display:grid;grid-template-columns:minmax(0px, 1fr);gap:48px}
#wrapwrap .ww-ab .ab-s-aad59{text-transform:uppercase;margin:0px}
#wrapwrap .ww-ab .ab-s-32e92{margin:0px;font-size:clamp(36px, 4.6cqi, 64px);font-weight:900;letter-spacing:-0.05em;line-height:1;text-wrap:balance}
#wrapwrap .ww-ab .ab-s-6db27{display:flex;flex-wrap:wrap;align-items:center;gap:20px 32px;padding-top:28px;border-top:1px solid var(--ink-900)}
#wrapwrap .ww-ab .ab-s-942ed{flex:0 0 auto;width:min(100%, 220px)}
#wrapwrap .ww-ab .ab-s-056c4{box-sizing:border-box;border:1px solid var(--ink-900);border-radius:12px;padding:10px}
#wrapwrap .ww-ab .ab-s-6ed99{flex:1 1 240px;display:grid;gap:6px;min-width:0px}
#wrapwrap .ww-ab .ab-s-01c36{display:block;height:22px;width:auto;justify-self:start;margin-bottom:4px}
#wrapwrap .ww-ab .ab-s-92863{display:flex;align-items:center;gap:20px;margin-left:auto;flex-wrap:wrap}
#wrapwrap .ww-ab .ab-s-b6e61{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;min-height:44px}
#wrapwrap .ww-ab .ab-s-32385{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0px 16px;border-radius:var(--radius-m);border:1px solid var(--green-500);background:var(--green-500);cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww-ab .ab-s-c0590{padding:128px 24px;background:var(--surface-sunken)}
#wrapwrap .ww-ab .ab-s-b4e6b{display:grid;grid-template-columns:minmax(0px, 1.15fr) minmax(0px, 1fr);gap:64px;align-items:end}
#wrapwrap .ww-ab .ab-s-b560a{flex:1 1 520px;min-width:0px}
#wrapwrap .ww-ab .ab-s-553a6{margin-top:14px}
#wrapwrap .ww-ab .ab-s-a8009{max-width:480px}
#wrapwrap .ww-ab .ab-s-93259{display:none;margin-top:32px}
#wrapwrap .ww-ab .ab-s-662da{display:flex;gap:4px;border-bottom-width:medium;border-bottom-style:none;border-bottom-color:currentcolor;padding:4px;background:var(--ink-100);border-radius:10px;width:fit-content}
#wrapwrap .ww-ab .ab-s-c2b32{cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-weight:700;font-size:14px;color:var(--ink-900);padding:6px 14px;border-radius:7px;background:rgb(255, 255, 255);box-shadow:var(--shadow-s);border-bottom-width:medium;border-bottom-style:none;border-bottom-color:currentcolor;margin-bottom:0px;transition:color var(--dur-fast)}
#wrapwrap .ww-ab .ab-s-e9735{cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-weight:500;font-size:14px;color:var(--text-2);padding:6px 14px;border-radius:7px;background:transparent;box-shadow:none;border-bottom-width:medium;border-bottom-style:none;border-bottom-color:currentcolor;margin-bottom:0px;transition:color var(--dur-fast)}
#wrapwrap .ww-ab .ab-s-186ae{display:grid;grid-template-columns:repeat(3, minmax(0px, 1fr));gap:24px;margin-top:64px;align-items:stretch}
#wrapwrap .ww-ab .ab-s-dbbfb{position:relative;background:rgb(255, 255, 255);color:var(--ink-900);border-radius:12px;box-shadow:var(--shadow-card);padding:28px 26px 30px;display:grid;gap:16px;align-content:start;border:1px solid transparent}
#wrapwrap .ww-ab .ab-s-ac399{display:flex;justify-content:space-between;align-items:center;gap:10px}
#wrapwrap .ww-ab .ab-s-98011{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--green-700)}
#wrapwrap .ww-ab .ab-s-d907e{font-family:var(--font-mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;padding:4px 8px;border-radius:999px;background:var(--ink-100);color:var(--ink-900)}
#wrapwrap .ww-ab .ab-s-e63bf{font-size:26px;font-weight:900;letter-spacing:-0.03em;line-height:1.02}
#wrapwrap .ww-ab .ab-s-0bdd7{display:grid;gap:8px;margin-top:6px;padding-top:14px;border-top:1px solid var(--ink-200)}
#wrapwrap .ww-ab .ab-s-2b0da{display:grid;grid-template-columns:14px minmax(0px, 1fr);gap:10px;align-items:start;font-size:14px;line-height:1.45}
#wrapwrap .ww-ab .ab-s-f1347{width:6px;height:6px;border-radius:3px;background:currentcolor;opacity:0.5;margin-top:7px;margin-left:2px}
#wrapwrap .ww-ab .ab-s-210f8{margin-top:auto;padding-top:10px}
#wrapwrap .ww-ab .ab-s-c9ca4{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;height:40px;padding:0px 16px;border-radius:var(--radius-m);border:1px solid var(--ink-300);background:rgb(255, 255, 255);cursor:pointer;opacity:1;transform:none;transition:background var(--dur-fast) var(--ease-out), transform var(--dur-fast);white-space:nowrap;box-sizing:border-box}
#wrapwrap .ww-ab .ab-s-a0929{position:relative;background:var(--ink-900);color:rgb(255, 255, 255);border-radius:12px;box-shadow:var(--shadow-card);padding:28px 26px 30px;display:grid;gap:16px;align-content:start;border:1px solid var(--ink-900)}
#wrapwrap .ww-ab .ab-s-a9291{font-family:var(--font-mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--green-500)}
#wrapwrap .ww-ab .ab-s-da020{font-family:var(--font-mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;padding:4px 8px;border-radius:999px;background:var(--yellow-500);color:var(--ink-900)}
#wrapwrap .ww-ab .ab-s-b7823{display:grid;gap:8px;margin-top:6px;padding-top:14px;border-top:1px solid var(--ink-700)}
#wrapwrap .ww-ab .ab-s-d7208{position:relative;background:rgb(255, 255, 255);color:var(--ink-900);border-radius:12px;box-shadow:var(--shadow-card);padding:28px 26px 30px;display:grid;gap:16px;align-content:start;border:1px solid var(--yellow-500)}
#wrapwrap .ww-ab .ab-s-a3d34{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;margin-top:40px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-3)}
#wrapwrap .ww-ab .ab-s-ec421{padding:128px 24px;background:rgb(255, 255, 255)}
#wrapwrap .ww-ab .ab-s-e5bdc{max-width:520px}
#wrapwrap .ww-ab .ab-s-35a7c{margin-top:64px;display:grid}
#wrapwrap .ww-ab .ab-s-5cd58{display:grid;grid-template-columns:24px minmax(0px, 1fr);gap:20px}
#wrapwrap .ww-ab .ab-s-6ca4a{position:relative;display:block}
#wrapwrap .ww-ab .ab-s-8ced5{position:absolute;left:11px;top:34px;bottom:0px;width:1px;background:var(--ink-300)}
#wrapwrap .ww-ab .ab-s-b38f8{position:absolute;left:7.75px;top:34px;width:8px;height:8px;border-radius:4px;background:var(--green-500);box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 5px;transition:0.18s ease-out}
#wrapwrap .ww-ab .ab-s-b47ee{border-bottom:1px solid var(--border-1)}
#wrapwrap .ww-ab .ab-s-e3204{appearance:none;background:none;border:0px;margin:0px;font:inherit;text-align:left;cursor:pointer;box-sizing:border-box;width:100%;display:grid;grid-template-columns:minmax(0px, 1fr) 24px;gap:16px;align-items:start;min-height:76px;padding:24px 0px;color:var(--ink-900)}
#wrapwrap .ww-ab .ab-s-79886{display:grid;grid-template-columns:112px minmax(0px, 1fr);gap:16px;align-items:baseline}
#wrapwrap .ww-ab .ab-s-b5874{font-size:24px;font-weight:900;letter-spacing:-0.025em;line-height:1.15}
#wrapwrap .ww-ab .ab-s-18fcb{display:flex;height:28px;align-items:center}
#wrapwrap .ww-ab .ab-s-e040a{padding:0px 40px 28px 128px;margin-top:-8px}
#wrapwrap .ww-ab .ab-s-84c1d{max-width:680px;text-wrap:pretty}
#wrapwrap .ww-ab .ab-s-deb1c{position:absolute;left:11px;top:0px;bottom:0px;width:1px;background:var(--ink-300)}
#wrapwrap .ww-ab .ab-s-82ccc{position:absolute;left:7.75px;top:34px;width:8px;height:8px;border-radius:4px;background:var(--ink-300);box-shadow:none;transition:0.18s ease-out}
#wrapwrap .ww-ab .ab-s-25bb3{appearance:none;background:none;border:0px;margin:0px;font:inherit;text-align:left;cursor:pointer;box-sizing:border-box;width:100%;display:grid;grid-template-columns:minmax(0px, 1fr) 24px;gap:16px;align-items:start;min-height:76px;padding:24px 0px;color:var(--ink-700)}
#wrapwrap .ww-ab .ab-s-2ef6f{position:absolute;left:11px;top:0px;bottom:calc(100% - 38px);width:1px;background:var(--ink-300)}
#wrapwrap .ww-ab .ab-eco-btn.is-active.ab-eb-0, #wrapwrap .ww-ab .ab-eco-btn.is-active .ab-eb-0{background:var(--ink-900) !important;color:rgb(255, 255, 255) !important;border:1px solid var(--ink-900) !important;box-shadow:var(--shadow-card) !important;transform:translateY(-2px) !important}
#wrapwrap .ww-ab .ab-eco-btn.is-active .ab-eb-3{background:var(--green-500) !important;box-shadow:rgba(0, 230, 176, 0.28) 0px 0px 0px 4px !important}
#wrapwrap .ww-ab .ab-eco-btn.is-active .ab-eb-4{background:rgba(255, 255, 255, 0.12) !important;color:rgb(255, 255, 255) !important}
#wrapwrap .ww-ab .ab-eco-btn.is-active .ab-eb-8{color:var(--ink-300) !important}

#wrapwrap .ww-ab .ab-cq { container-type: inline-size; overflow-x: clip; }   /* la grande date 01.04.15 déborde de 13 px, rognée comme dans la maquette */
/* emplacements photo (Charles 11/10 : « photo placeholder pour le moment ») */
#wrapwrap .ww-ab .ab-slot { position: relative; display: block; box-sizing: border-box; background: repeating-linear-gradient(135deg, #E9E9E6 0 12px, #E2E2DF 12px 24px); border-radius: 12px; overflow: hidden; }
#wrapwrap .ww-ab .ab-slot__cap { position: absolute; left: 12px; right: 12px; bottom: 12px; font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; line-height: 1.4; text-transform: uppercase; color: #5C5C59; }
/* écosystème : cartes cliquables, focus au clavier seulement (Charles 10/10) */
#wrapwrap .ww-ab .ab-eco-btn { cursor: pointer; text-align: left; font: inherit; }
#wrapwrap .ww-ab .ab-eco-btn:focus { outline: none; }
#wrapwrap .ww-ab .ab-eco-btn:focus-visible { box-shadow: 0 0 0 2px var(--ink-900), 0 0 0 4px var(--green-500); }
/* revue responsive du 11/10 */
#wrapwrap .ww-ab .ab-eco-cards { display: grid; }   /* les 8 fiches dans la même case : hauteur fixe, la page ne saute plus de 58 à 65 px à chaque rotation */
#wrapwrap .ww-ab .ab-eco-cards > .ab-eco-card { grid-area: 1 / 1; }
#wrapwrap .ww-ab .ab-eco-card[hidden] { display: grid !important; visibility: hidden; }
#wrapwrap .ww-ab #ab-eco .ww-grid2 ~ .ww-grid2 { grid-template-columns: minmax(0, 1fr) !important; }   /* fiche sous la grille (capture D6) : à droite elle n'avait que 214 px de texte */
#wrapwrap .ww-ab #ab-03 .ww-ab-3 > div, #wrapwrap .ww-ab #ab-06 .ww-ab-2 > div > div:last-child > div { align-content: start; }   /* libellés des chiffres alignés */
@media (min-width: 761px) and (max-width: 959px) {   /* fil 01 -> 05 : 5 colonnes de 119 px en tablette -> carrousel */
  #wrapwrap .ww-ab .ww-ab-fil { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 24px; margin: 0 -24px; padding: 0 24px 8px; width: calc(100% + 48px); box-sizing: border-box; scrollbar-width: none; }
  #wrapwrap .ww-ab .ww-ab-fil > * { flex: 0 0 36%; min-width: 0; scroll-snap-align: start; }
}
#wrapwrap .ww-ab .ab-eco-k { white-space: normal !important; max-width: 100%; overflow-wrap: anywhere; }   /* passent à la ligne au lieu d'être coupés (Charles 11/10) */
#wrapwrap .ww-ab .ww-faq-a[hidden] { display: none !important; }
#wrapwrap .ww-ab .ww-faq-a a { text-decoration-line: underline !important; text-decoration-thickness: 1px !important; text-underline-offset: 3px; text-decoration-color: var(--ink-300) !important; }
#wrapwrap .ww-ab .ww-faq-a a:hover { text-decoration-color: var(--green-600) !important; }
#wrapwrap .ww-ab .ab-faq-item .ww-faq-btn { color: var(--ink-700) !important; }
#wrapwrap .ww-ab .ab-faq-item.is-open .ww-faq-btn { color: var(--ink-900) !important; }
#wrapwrap .ww-ab .ab-faq-item .ab-faq-dot { background: var(--ink-300) !important; box-shadow: none !important; }
#wrapwrap .ww-ab .ab-faq-item.is-open .ab-faq-dot { background: var(--green-500) !important; box-shadow: 0 0 0 5px rgba(0,230,176,.28) !important; }
#wrapwrap .ww-ab .ab-faq-item .ab-faq-k { color: var(--text-3) !important; }
#wrapwrap .ww-ab .ab-faq-item.is-open .ab-faq-k { color: var(--green-700) !important; }
#wrapwrap .ww-ab .ww-faq-btn { cursor: pointer; }
#wrapwrap .ww-ab .ww-faq-btn:focus { outline: none; }
#wrapwrap .ww-ab .ww-faq-btn:focus-visible { box-shadow: 0 0 0 2px var(--green-500); border-radius: 8px; }
#wrapwrap .ww-ab a { text-decoration-line: none !important; }
/* rail : 9 sections (la landing en a 7) */
.ww-ab .ww-rail-nav__btn:nth-of-type(1) { top: 36px; } .ww-ab .ww-rail-nav__btn:nth-of-type(2) { top: 57px; } .ww-ab .ww-rail-nav__btn:nth-of-type(3) { top: 78px; }
.ww-ab .ww-rail-nav__btn:nth-of-type(4) { top: 99px; } .ww-ab .ww-rail-nav__btn:nth-of-type(5) { top: 120px; } .ww-ab .ww-rail-nav__btn:nth-of-type(6) { top: 141px; }
.ww-ab .ww-rail-nav__btn:nth-of-type(7) { top: 162px; } .ww-ab .ww-rail-nav__btn:nth-of-type(8) { top: 183px; } .ww-ab .ww-rail-nav__btn:nth-of-type(9) { top: 204px; }
/* bandeau de mots en contour : Heebo dessine ses lettres en contours qui se chevauchent, un contour de 1 px montrait ces traits intérieurs
   (Charles 11/10 : « problème sur la police ») -> contour de 2 px peint SOUS un remplissage couleur du fond : seule la moitié extérieure reste */
#wrapwrap .ww-ab .ab-marq { color: var(--ink-900) !important; -webkit-text-stroke: 2px rgba(255,255,255,.45) !important; paint-order: stroke fill; }
@keyframes ww-ab-marq { to { transform: translateX(-50%); } }
#wrapwrap .ww-ab .ab-marq:hover > div { animation-play-state: paused; }
/* audit UX du 11/10 */
#wrapwrap .ww-ab .ab-cq > section { padding-left: 24px; padding-right: 24px; }   /* bords = barre et landing entre 761 et 1327 px (64 px dans la maquette) ; rien ne bouge au-dessus */
#wrapwrap .ww-ab .ab-hero > div { padding-top: 24px; }   /* vide sous la barre = landing v1.4 (Charles 11/10 : « diminue le vide noir ») */
#wrapwrap .ww-ab .ab-hero img[srcset] { object-position: center 67%; }   /* même photo, même cadrage que la landing */
#wrapwrap .ww-ab #ab-04 img { object-fit: contain; object-position: center; background: #fff; }   /* capture de l'atelier en entier (cover n'en montrait que la moitié) */
#wrapwrap .ww-ab #ab-07 blockquote > span:first-of-type { color: var(--ink-500); }   /* gris de la citation : 2,82:1 -> 4,54:1 */
#wrapwrap .ww-ab .ab-eco-card { scroll-margin-top: 84px; }   /* sous la barre fixe quand le clic amène la fiche */
body:not(.editor_enable):has(.ww-ab) #wrapwrap > footer .back-to-top-btn { display: none !important; }   /* bouton du thème : masqué comme sur la landing */
@keyframes ww-ab-pulse { 0% { box-shadow: 0 0 0 0 rgba(0,230,176,.55); } 100% { box-shadow: 0 0 0 14px rgba(0,230,176,0); } }
@media (prefers-reduced-motion: reduce) { #wrapwrap .ww-ab * { animation: none !important; } }
@media (max-width: 1180px) { #wrapwrap .ww-ab .ab-cat { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; } }
/* mobile (règles de la maquette, ≤ 760 px) */
@media (max-width: 760px) {
  #wrapwrap .ww-ab .ww-ab-eco { grid-template-areas: none !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-template-rows: none !important; }
  #wrapwrap .ww-ab .ww-ab-eco > * { grid-area: auto !important; }
  #wrapwrap .ww-ab .ww-ab-eco > .ww-ab-eco-z { grid-column: 1 / -1 !important; justify-self: stretch !important; order: -1; }   /* !important : bat grid-area:auto !important */
  #wrapwrap .ww-ab .ww-ab-eco > button { min-height: 0 !important; }
  #wrapwrap .ww-ab .ww-ab-eco > button span { overflow-wrap: anywhere; }
  #wrapwrap .ww-ab .ww-ab-eco .ww-ab-eco-x { display: none; }
  #wrapwrap .ww-ab .ww-ab-2, #wrapwrap .ww-ab .ww-ab-3 { grid-template-columns: minmax(0, 1fr) !important; }
  #wrapwrap .ww-ab .ww-ab-2 > * { justify-self: start !important; }
  #wrapwrap .ww-ab .ww-ab-pad, #wrapwrap .ww-ab #ab-eco, #wrapwrap .ww-ab #ab-start, #wrapwrap .ww-ab #ab-faq { padding: 72px 16px !important; }   /* gouttière 16 px = barre ; air 72 px partout (audit UX 11/10) */
  #wrapwrap .ww-ab .ab-hero { padding-left: 16px !important; padding-right: 16px !important; }   /* règle DS de .ww-hero (renommée) */
  #wrapwrap .ww-ab .ww-ab-fil { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 0 16px 8px; scrollbar-width: none; width: calc(100% + 32px); box-sizing: border-box; }
  /* héros = landing v1.4 en mobile : titre 36 px, photo 4/3 */
  #wrapwrap .ww-ab .ab-hero h1 > span:last-child { font-size: 36px !important; }
  #wrapwrap .ww-ab .ab-cq h2:not(.ab-eyebrow) { font-size: 36px !important; }   /* un seul niveau de titre de section en mobile, comme la landing (34 à 60 px avant) */
  #wrapwrap .ww-ab .ab-hero img[srcset] { aspect-ratio: 4 / 3 !important; }
  /* FAQ : la colonne de 112 px du numéro et le retrait de 128 px laissaient 115 px de texte -> une colonne, réponse pleine largeur, question 19 px (= landing) */
  #wrapwrap .ww-ab .ab-faq-item .ww-faq-head { grid-template-columns: minmax(0, 1fr) !important; gap: 6px !important; }
  #wrapwrap .ww-ab .ab-faq-item .ww-faq-a { padding: 0 0 24px !important; }
  #wrapwrap .ww-ab .ab-faq-item .ww-faq-q { font-size: 19px !important; }
  /* cibles tactiles 44 px */
  #wrapwrap .ww-ab .ab-eco-card a, #wrapwrap .ww-ab #ab-start a, #wrapwrap .ww-ab #ab-start button, #wrapwrap .ww-ab #ab-07 a.ww-btn--accent { min-height: 44px !important; }
  #wrapwrap .ww-ab .ww-ab-fil > * { flex: 0 0 72%; min-width: 0; scroll-snap-align: start; }
  #wrapwrap .ww-ab #ab-01 { padding-top: 0 !important; }   /* le bandeau de mots a déjà 64 px dessous */
  #wrapwrap .ww-ab #ab-02 .ww-ab-2 > figure { justify-self: stretch !important; }   /* figures « Avant » réduites à la largeur de leur légende */
  #wrapwrap .ww-ab #ab-04 .ww-ab-3 figure > div > * { aspect-ratio: 16 / 10 !important; }   /* cadres 4/5 : bandes blanches autour de la capture */
  #wrapwrap .ww-ab #ab-terrain .ww-ab-3 { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 16px; margin: 0 -16px; padding: 0 16px 8px; width: calc(100% + 32px); box-sizing: border-box; scrollbar-width: none; }
  #wrapwrap .ww-ab #ab-terrain .ww-ab-3 > * { flex: 0 0 72%; min-width: 0; scroll-snap-align: start; }   /* 3 photos de 448 px empilées -> carrousel */
  #wrapwrap .ww-ab #ab-07 blockquote + div > :first-child, #wrapwrap .ww-ab #ab-07 blockquote + div figure { flex: 1 1 100% !important; width: 100% !important; }
  #wrapwrap .ww-ab #ab-07 blockquote + div > :last-child { margin-left: 0 !important; }
  /* Commencer : les onglets choisissent la carte affichée (handoff M4), comme la landing */
  #wrapwrap .ww-ab #ab-start .ab-cat { margin-top: 24px !important; }
  #wrapwrap .ww-ab #ab-start [role="tab"] { font-weight: 500 !important; color: var(--text-2) !important; background: transparent !important; box-shadow: none !important; }
  #wrapwrap .ww-ab #ab-start [role="tab"][aria-selected="true"] { font-weight: 700 !important; color: var(--ink-900) !important; background: #fff !important; box-shadow: var(--shadow-s) !important; }
  #wrapwrap .ww-ab #ab-start .ab-cat.is-seg > :not(.is-on) { display: none !important; }
  #wrapwrap .ww-ab .ww-ab-fil { scroll-padding-inline: 16px; }   /* l'accrochage alignait « 01 Votre chiffrage » sur le bord de l'écran (Charles 11/10) */
  #wrapwrap .ww-ab .ww-eco-card { grid-template-columns: minmax(0, 1fr) !important; }
  #wrapwrap .ww-ab .ww-eco-card > .ww-eco-photo { order: -1; min-height: 200px; }
}

/* ===== Harmonie avec la landing (Charles 07/11 : « à harmoniser avec la landing » ; mesures de l'agent UX) ===== */
@media (min-width: 761px) {
  #wrapwrap .ww-ab .ab-cq h2:not(.ab-eyebrow) { font-size: clamp(44px, 4.6cqi, 64px) !important; }
  #wrapwrap .ww-ab .ab-hero h1 > span:last-child { font-size: clamp(46px, 6.9cqi, 132px) !important; max-width: 8.4em; }
}
@media (min-width: 761px) and (max-height: 1000px) { #wrapwrap .ww-ab .ab-hero h1 > span:last-child { font-size: clamp(46px, min(6.9cqi, 10.8vh), 132px) !important; } }
#wrapwrap .ww-ab #ab-06 h3, #wrapwrap .ww-ab #ab-03 p:has(+ h2) { font-size: clamp(28px, 3.1cqi, 44px) !important; }
#wrapwrap .ww-ab #ab-eco h3 { font-size: 26px !important; }
#wrapwrap .ww-ab #ab-02 h2.ab-declic { margin: 0 !important; font-weight: 900 !important; line-height: 1 !important; }
#wrapwrap .ww-ab #ab-02 h2.ab-declic > .ab-declic__l { display: block; font-size: inherit !important; }
#wrapwrap .ww-ab #ab-03 .ab-chiffre { font-family: var(--font-mono) !important; font-size: 36px !important; font-weight: 600 !important; letter-spacing: -.02em !important; line-height: 1.55 !important; }
@media (max-width: 760px) {
  #wrapwrap .ww-ab #ab-07 blockquote { font-size: 28px !important; }
  #wrapwrap .ww-ab #ab-02 h2.ab-declic { font-size: 36px !important; }
}


/* ===== titles.css ===== */
/* ===== Échelle des titres de l'espace pro (07/11/2026, Charles : « je te laisse faire ») =====
   Remplace le « +10 % » du 28/09. Un seul titre d'écran pour tout l'espace pro, une échelle d'application,
   un cran sous la vitrine (landing 97, pages gamme 64 / 48) qui NE BOUGE PAS.
                      ordinateur  tablette (761-1199)  téléphone (<= 760)
     H1 titre d'écran     48            40                 32      900, interligne 1,05
     H2 section           28            28                 24      900, interligne 1,1
     H3 carte, panneau    20            20                 18      700, interligne 1,2
     H4 article, ligne    17            17                 16      700, interligne 1,3
   Exclus : catalogue public (.cg-head--pub) et page publique /engagements (.ww-engage--pub).
   Fichier placé EN DERNIER dans PARTS (build.py) : les « html body #wrapwrap » l'emportent sur toutes les règles d'écran. */

/* H1 — titre d'écran */
html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1,
html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1.at-h1,
html body #wrapwrap .ww-dash h1.nw-news-h1,
html body #wrapwrap .ww-dash h1.nw-art__h1,
html body #wrapwrap .ww-cat .cg-head:not(.cg-head--pub) h1.cg-h1,
html body #wrapwrap #ww-product h1.pv-h1,
html body #wrapwrap .ww-quote h1.qt-h1,
html body #wrapwrap .ww-quote.qc h1.qc-h1,
html body #wrapwrap .ww-proj h1.pj-h1,
html body #wrapwrap .ww-inv h1.iv-h1,
html body #wrapwrap .ww-ddocs h1.dd-rhero__t { font-size: 48px !important; font-weight: 900 !important; line-height: 1.05 !important; letter-spacing: -.035em !important; }

/* H2 — titre de section */
html body #wrapwrap .ww-dash h2.dash-h2,
html body #wrapwrap .ww-dash .dash-engage__txt strong,
html body #wrapwrap .ww-dash .nw-featured__body h2,
html body #wrapwrap .ww-engage:not(.ww-engage--pub) .en-sec-h__t,
html body #wrapwrap .ww-engage:not(.ww-engage--pub) .en-h2,
html body #wrapwrap .ww-atelier h2.at-h2,
html body #wrapwrap .ww-cat h2.cg-h2,
html body #wrapwrap .ww-quote h2.qt-eh,
html body #wrapwrap .ww-order h2.qo-sec__t,
html body #wrapwrap .ww-ddocs h2.dd-dv__h2 { font-size: 28px !important; font-weight: 900 !important; line-height: 1.1 !important; }

/* H3 — titre de carte ou de panneau (après H2 : « Votre chiffrage » porte aussi dash-h2) */
html body #wrapwrap .ww-dash .dash-photo__body h3,
html body #wrapwrap .ww-dash .dash-draft__name,
html body #wrapwrap .ww-dash .dash-empty h3,
html body #wrapwrap .ww-dash .nw-ncard__body h3,
html body #wrapwrap .ww-dash .nw-empty-news h3,
html body #wrapwrap .ww-quote h2.dash-h2.qt-h2,
html body #wrapwrap .ww-account .ac-h2,
html body #wrapwrap .ww-msgs .ms-thread__t,
html body #wrapwrap .ww-inv .iv-h2,
html body #wrapwrap .ww-ddocs .dd-new__h h2,
html body #wrapwrap .ww-proj h2.pj-todo__t,
html body #wrapwrap .ww-proj.ww-proj--card h2.pj-todo__t,
html body #wrapwrap #ww-product h2.pv-sec__t,
html body #wrapwrap .ww-cat h3.cg-fam__name,
html body #wrapwrap .ww-cat h3.cg-card__name,
html body #wrapwrap .ww-cat h3.cg-grp { font-size: 20px !important; font-weight: 700 !important; line-height: 1.2 !important; letter-spacing: -.01em !important; }

/* H4 — nom d'article ou de ligne */
html body #wrapwrap .ww-quote .qt-row__title,
html body #wrapwrap .ww-quote .qt-line__name,
html body #wrapwrap .ww-order h3.qo-card__name,
html body #wrapwrap .ww-cat h3.cg-ref__name,
html body #wrapwrap .ww-account .ac-h3,
html body #wrapwrap .ww-admin .ad-tab__t { font-size: 17px !important; font-weight: 700 !important; line-height: 1.3 !important; }

/* Titres sur plusieurs lignes : lignes équilibrées, comme dash-h1, at-h1, nw-art__h1 et dd-rhero__t le faisaient déjà
   (ui-ux-pro-max « Heading Line Balance », 07/11). Même nombre de lignes, seulement mieux réparties : aucune hauteur ne bouge.
   Un navigateur qui ne connaît pas text-wrap l'ignore. Vitrine exclue (catalogue public dans une règle à part, avec :has). */
html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1,
html body #wrapwrap .ww-quote.qc h1.qc-h1,
html body #wrapwrap .ww-dash h1.nw-news-h1,
html body #wrapwrap .ww-cat .cg-head:not(.cg-head--pub) h1.cg-h1,
html body #wrapwrap #ww-product h1.pv-h1,
html body #wrapwrap .ww-quote h1.qt-h1,
html body #wrapwrap .ww-proj h1.pj-h1,
html body #wrapwrap .ww-inv h1.iv-h1,
html body #wrapwrap .ww-dash:not(.ww-engage--pub) h2.dash-h2,
html body #wrapwrap .ww-dash .nw-featured__body h2,
html body #wrapwrap .ww-engage:not(.ww-engage--pub) .en-sec-h__t,
html body #wrapwrap .ww-engage:not(.ww-engage--pub) .en-h2,
html body #wrapwrap .ww-atelier h2.at-h2,
html body #wrapwrap .ww-order h2.qo-sec__t,
html body #wrapwrap .ww-ddocs h2.dd-dv__h2 { text-wrap: balance; }
html body #wrapwrap .ww-cat:not(:has(.cg-head--pub)) h2.cg-h2 { text-wrap: balance; }

/* Page PUBLIQUE /engagements : vitrine, elle garde sa taille d'avant (57, téléphone 42), qu'elle tenait du « +10 % » du 28/09 —
   à aligner plus tard sur l'échelle des pages vitrine (décision à part) */
html body #wrapwrap .ww-dash.ww-engage--pub h1.dash-h1 { font-size: 57px !important; }
@media (max-width: 760px) { html body #wrapwrap .ww-dash.ww-engage--pub h1.dash-h1 { font-size: 42px !important; } }

/* Catalogue PUBLIC (visiteur, /shop) : vitrine, il garde ses tailles d'avant. Règles à part (:has) : un navigateur qui
   ne connaît pas :has() ignore seulement ce retour, jamais l'échelle de l'espace pro. */
html body #wrapwrap .ww-cat:has(.cg-head--pub) h2.cg-h2 { font-size: 26px !important; line-height: 1.15 !important; letter-spacing: -.01em !important; }
html body #wrapwrap .ww-cat:has(.cg-head--pub) h3.cg-fam__name { font-size: 24px !important; letter-spacing: inherit !important; }
html body #wrapwrap .ww-cat:has(.cg-head--pub) h3.cg-card__name { font-size: 20px !important; letter-spacing: -.02em !important; }
html body #wrapwrap .ww-cat:has(.cg-head--pub) h3.cg-grp { font-size: 16px !important; line-height: 1.3 !important; letter-spacing: inherit !important; }
html body #wrapwrap .ww-cat:has(.cg-head--pub) h3.cg-ref__name { font-size: 17px !important; line-height: 1.2 !important; }
@media (max-width: 760px) { html body #wrapwrap .ww-cat:has(.cg-head--pub) h3.cg-fam__name { font-size: 20px !important; } }

/* Étiquettes « 01 — Avancement » de la fiche projet : le thème imposait Heebo aux h2, la maquette les veut en JetBrains Mono */
html body #wrapwrap .ww-proj h2.pj-kicker { font-family: var(--font-mono) !important; }

@media (min-width: 761px) and (max-width: 1199px) {
  html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1,
  html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1.at-h1,
  html body #wrapwrap .ww-dash h1.nw-news-h1,
  html body #wrapwrap .ww-dash h1.nw-art__h1,
  html body #wrapwrap .ww-cat .cg-head:not(.cg-head--pub) h1.cg-h1,
  html body #wrapwrap #ww-product h1.pv-h1,
  html body #wrapwrap .ww-quote h1.qt-h1,
  html body #wrapwrap .ww-quote.qc h1.qc-h1,
  html body #wrapwrap .ww-proj h1.pj-h1,
  html body #wrapwrap .ww-inv h1.iv-h1,
  html body #wrapwrap .ww-ddocs h1.dd-rhero__t { font-size: 40px !important; }
}
@media (max-width: 760px) {
  html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1,
  html body #wrapwrap .ww-dash:not(.ww-engage--pub) h1.dash-h1.at-h1,
  html body #wrapwrap .ww-dash h1.nw-news-h1,
  html body #wrapwrap .ww-dash h1.nw-art__h1,
  html body #wrapwrap .ww-cat .cg-head:not(.cg-head--pub) h1.cg-h1,
  html body #wrapwrap #ww-product h1.pv-h1,
  html body #wrapwrap .ww-quote h1.qt-h1,
  html body #wrapwrap .ww-quote.qc h1.qc-h1,
  html body #wrapwrap .ww-proj h1.pj-h1,
  html body #wrapwrap .ww-inv h1.iv-h1,
  html body #wrapwrap .ww-ddocs h1.dd-rhero__t { font-size: 32px !important; }
  html body #wrapwrap .ww-dash h2.dash-h2,
  html body #wrapwrap .ww-dash .dash-engage__txt strong,
  html body #wrapwrap .ww-dash .nw-featured__body h2,
  html body #wrapwrap .ww-engage:not(.ww-engage--pub) .en-sec-h__t,
  html body #wrapwrap .ww-engage:not(.ww-engage--pub) .en-h2,
  html body #wrapwrap .ww-atelier h2.at-h2,
  html body #wrapwrap .ww-cat h2.cg-h2,
  html body #wrapwrap .ww-quote h2.qt-eh,
  html body #wrapwrap .ww-order h2.qo-sec__t,
  html body #wrapwrap .ww-ddocs h2.dd-dv__h2 { font-size: 24px !important; }
  html body #wrapwrap .ww-dash .dash-photo__body h3,
  html body #wrapwrap .ww-dash .dash-draft__name,
  html body #wrapwrap .ww-dash .dash-empty h3,
  html body #wrapwrap .ww-dash .nw-ncard__body h3,
  html body #wrapwrap .ww-dash .nw-empty-news h3,
  html body #wrapwrap .ww-quote h2.dash-h2.qt-h2,
  html body #wrapwrap .ww-account .ac-h2,
  html body #wrapwrap .ww-msgs .ms-thread__t,
  html body #wrapwrap .ww-inv .iv-h2,
  html body #wrapwrap .ww-ddocs .dd-new__h h2,
  html body #wrapwrap .ww-proj h2.pj-todo__t,
  html body #wrapwrap .ww-proj.ww-proj--card h2.pj-todo__t,
  html body #wrapwrap #ww-product h2.pv-sec__t,
  html body #wrapwrap .ww-cat h3.cg-fam__name,
  html body #wrapwrap .ww-cat h3.cg-card__name,
  html body #wrapwrap .ww-cat h3.cg-grp { font-size: 18px !important; }
  html body #wrapwrap .ww-quote .qt-row__title,
  html body #wrapwrap .ww-quote .qt-line__name,
  html body #wrapwrap .ww-order h3.qo-card__name,
  html body #wrapwrap .ww-cat h3.cg-ref__name,
  html body #wrapwrap .ww-account .ac-h3,
  html body #wrapwrap .ww-admin .ad-tab__t { font-size: 16px !important; }
}


/* ===== a11y.css ===== */
/* ===== Accessibilité de l'espace pro (08/11/2026, Charles : « applique les corrections de my home sur toutes les pages du portail ») =====
   Contrôle ui-ux-pro-max sur les 26 aperçus de l'espace pro (1440 et 390, touche Tab) : causes communes, corrigées ici une fois.
   Portée : pages connectées (#wrapwrap:has(.ww-nav)) ET conteneurs de l'espace pro seulement -> la vitrine (landing, gammes, check, Signal,
   catalogue visiteur) ne bouge pas. Un navigateur sans :has() garde l'ancien rendu. Fichier chargé EN DERNIER (après titles.css). */

/* 1. Contraste : jetons de couleur trop clairs sur le fond gris (#F6F6F5) des pages
      --text-3 / --ink-500 #767676 : 4,2:1 -> #6B6B6B (4,9:1 sur gris, 5,3:1 sur blanc)
      --green-700 #00875F (liens, sur-titres, badges) : 4,2:1 -> #006B4C (= green-800, 5,9:1 sur gris)
      --orange-600 #C26A00 (note « Obligatoire » de la fiche) : 3,9:1 -> #A35500 (5,0:1 sur gris) */
#wrapwrap:has(.ww-nav) :is(.ww-dash, .ww-quote, .ww-order, .ww-proj, .ww-inv, .ww-ddocs, .ww-cat, #ww-product, .ww-atelier, .ww-account, .ww-msgs, .ww-admin) {
  --ink-500: #6B6B6B; --text-3: #6B6B6B; --green-700: #006B4C; --text-accent: #006B4C; --orange-600: #A35500;
}

/* 2. Mention de confidentialité en bas des pages (« Plans, documents et prix confidentiels · Conditions d'utilisation ») : #9A9A98 = 2,6:1 */
html body #wrapwrap:has(.ww-nav) p.ww-mention { color: #6B6B6B !important; }

/* 3. Cibles trop petites (moins de 24 px de haut, seuil web WCAG 2.5.8) : zone cliquable agrandie par un pseudo-élément, sans rien déplacer.
      Onglets du compte, filtres des actualités et de l'atelier, onglets du projet, actions du chiffrage, « Retirer », points de la galerie,
      lien « Conditions d'utilisation ». Aucun de ces éléments n'utilisait ::after ni position (vérifié le 08/11). */
#wrapwrap:has(.ww-nav) :is(.ac-tab, .nw-pill, .pj-tab, .at-pill, .qt-act, .js_delete_product, .cg-dot, p.ww-mention a) { position: relative; }
#wrapwrap:has(.ww-nav) :is(.ac-tab, .nw-pill, .pj-tab, .at-pill, .qt-act, .js_delete_product, .cg-dot, p.ww-mention a)::after {
  content: ""; position: absolute; left: -2px; right: -2px; top: 50%; height: 28px; transform: translateY(-50%);
}

/* 4. Focus clavier manquant (test à la touche Tab sur les 26 aperçus : 20 éléments sur 1 771 sans repère)
      - champ de recherche des listes (Mes projets, commandes, chiffrages) : l'input a outline: 0 et son cadre .qt-search n'avait pas de :focus-within
        -> même repère que la recherche du catalogue (.cg-q__f) ;
      - boutons .dash-btn hors de la vue d'ensemble (la règle de focus d'origine ne visait que .ww-dash) ; le bouton jaune « Reprendre » garde son anneau. */
#wrapwrap:has(.ww-nav) .qt-search:focus-within { border-color: var(--ink-900); box-shadow: 0 0 0 3px rgba(0, 230, 176, .35); }
#wrapwrap:has(.ww-nav) .dash-btn:not(.dash-btn--resume):focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-700); }

/* 5. Cas particuliers relevés au 2e passage
      - liens du chiffrage : « .ww-quote .oe_cart a { box-shadow: none !important } » effaçait tout anneau de focus (« Ajouter une solution »…) ;
      - badge vert « Commandé / Livré / Clôturé » : couleur écrite en dur (#00875F sur #E3F8F1 = 4,1:1) ;
      - petits compteurs gris des filtres (« En cours 3 », « Toutes 34 ») sur fond #F0F0EE : 4,4:1 -> text-2 ;
      - « Mis à jour … » de l'atelier, gris sur fond noir (3,5:1) -> gris clair ;
      - vignettes claires des engagements (« Miniature · page 1 ») : #9A9A98 = 2,6:1 -> text-3 ; compteurs du catalogue (.cg-tab, .cg-rail__f). */
html body #wrapwrap:has(.ww-nav) .ww-quote .oe_cart a:focus-visible { outline: none !important; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--green-700) !important; }
#wrapwrap:has(.ww-nav) .ww-dash .dash-badge--active { color: #006B4C; }
#wrapwrap:has(.ww-nav) :is(.qt-filters a, .at-pill, .nw-pill, .pj-tab, .cg-chip, .cg-tab, .cg-rail__f, .cg-seg__i) small { color: var(--text-2); }   /* sans conteneur : au téléphone les onglets du catalogue sortent de .ww-cat ; à égalité avec « #wrapwrap .ww-quote .qt-filters a small », a11y.css passe en dernier */
#wrapwrap:has(.ww-nav) .ww-atelier .at-now__u { color: #9A9A98 !important; }   /* .at-mono le repassait en text-3 */
#wrapwrap:has(.ww-nav) .en-thumb .en-ph { color: var(--text-3) !important; }   /* vignettes claires seulement : sur les photos sombres, #9A9A98 passe (5,7:1) */