/* ==========================================================================
   IMPACT SOCIAL — DESIGN SYSTEM V10.0 (feuille unique)
   --------------------------------------------------------------------------
   Référence : visuel « Un soutien humain au quotidien » — fonds très clairs
   et bleutés, bleu profond, turquoise, bleu clair, touches violettes,
   feuillages discrets, grandes cartes blanches, coches pleines, maquettes
   d'interface façon SaaS.

   Remplace design-system-v9*.css, harmonisation-v9.css et
   espace-employeur-v9.css, ainsi que les styles internes du tableau de bord
   et de la connexion employeur. espace-salarie.css (application salariée)
   s'appuie sur les mêmes variables.

   Principes
   - Composants préfixés « ds- » ; balisage historique (.navbar, .footer,
     .card, .btn, .hero…) restylé en section 20 sans modifier les pages.
   - Contraste texte ≥ 4,5:1, bordures de champs ≥ 3:1, cibles ≥ 44 px,
     focus toujours visible, animations coupées si l'utilisateur le demande.
   - Fichier versionné (?v=10.0.0) : /assets/* est en cache « immutable ».
   Documentation visuelle : documents/technique/design-system-v10.html

   Sommaire
    1. Tokens            8. Cartes                 15. Composants produit
    2. Base              9. Alertes                16. Accueil
    3. Mise en page     10. Confidentialité        17. Espace employeur
    4. Typographie      11. Formulaires            18. Pages employeur
    5. Icônes, décor    12. Tableaux               19. Utilitaires, a11y
    6. Boutons          13. Navigation             20. Compatibilité pages
    7. Badges           14. Pied de page               historiques
   ========================================================================== */

/* 0. POLICES DE REPLI AJUSTÉES (V10.4) -------------------------------------
   Tant qu'Inter et Plus Jakarta Sans (Google Fonts, display=swap) ne sont
   pas chargées, le texte s'affiche en Arial redimensionnée pour occuper la
   même largeur : les lignes ne se recomposent plus au changement de police
   (CLS). Valeurs mesurées dans le navigateur (largeur moyenne d'un texte
   type et métriques verticales), graisse par graisse. */
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('ArialMT'),local('Helvetica Neue'),local('Helvetica');font-weight:100 550;size-adjust:107%;ascent-override:90.5%;descent-override:22.5%;line-gap-override:0%}
@font-face{font-family:'Inter Fallback';src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Neue Bold'),local('Helvetica Bold');font-weight:551 900;size-adjust:102%;ascent-override:95%;descent-override:23.5%;line-gap-override:0%}
@font-face{font-family:'Plus Jakarta Sans Fallback';src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Neue Bold'),local('Helvetica Bold');font-weight:500 750;size-adjust:102%;ascent-override:102%;descent-override:21.6%;line-gap-override:0%}
@font-face{font-family:'Plus Jakarta Sans Fallback';src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Neue Bold'),local('Helvetica Bold');font-weight:751 900;size-adjust:101%;ascent-override:103%;descent-override:21.8%;line-gap-override:0%}
/* Police des titres (lien Google Fonts dédié) : font-display:swap sur grand
   écran (> 1100 px), où le repli ajusté ne provoque pas de décalage mesurable ;
   font-display:optional sur mobile et tablette, où un titre sur plusieurs
   lignes pouvait gagner une ligne au changement de police. Dans ce cas, le
   repli ajusté est conservé pour la page, puis la vraie police, mise en cache,
   est utilisée dès la navigation suivante. */

/* 1. TOKENS ---------------------------------------------------------------- */
:root{
  /* Bleu profond */
  --ds-navy-950:#071A36;
  --ds-navy-900:#0B2147;
  --ds-navy-800:#132B5E;      /* titres — 13,7:1 */
  --ds-navy-700:#1E3D7A;
  /* Turquoise — 700 = action (6,2:1 sur blanc) */
  --ds-teal-800:#08525C;
  --ds-teal-700:#0B6B78;
  --ds-teal-600:#0E8290;
  --ds-teal-500:#17A3B1;
  --ds-teal-300:#7FD4DB;
  --ds-teal-200:#BFE6EA;
  --ds-teal-100:#DDF2F3;
  --ds-teal-50:#EFF9F9;
  /* Bleu clair */
  --ds-sky-600:#2F6FD6;
  --ds-sky-500:#5AA7DE;
  --ds-sky-300:#9FCBEE;
  --ds-sky-200:#D3E6F5;
  --ds-sky-100:#E6F1FA;
  --ds-sky-50:#F2F8FC;
  /* Violet du logo */
  --ds-violet-700:#5B34C8;
  --ds-violet-600:#6D45E0;
  --ds-violet-500:#8A6CF2;
  --ds-violet-200:#D9CEFB;
  --ds-violet-100:#EEE9FE;
  --ds-violet-50:#F7F4FF;
  /* Feuillages (décor uniquement) */
  --ds-leaf-700:#2E8C7E;
  --ds-leaf-500:#4FAE95;
  --ds-leaf-300:#8FCDB8;
  --ds-leaf-100:#DDF1E9;
  --ds-mint-400:#76D3B0;
  --ds-mint-100:#E2F6EE;
  --ds-green-700:#0F7A5A;
  /* Dégradés */
  --ds-gradient-brand:linear-gradient(135deg,#1AB4C5 0%,#3D8BEA 55%,#7A5CF0 100%);
  --ds-gradient-ink:linear-gradient(90deg,#0B6B78 0%,#5B34C8 100%);
  --ds-gradient-soft:linear-gradient(135deg,#F7FBFE 0%,#EAF3FA 100%);
  --ds-gradient-page:linear-gradient(180deg,#F1F7FC 0%,#F7FBFD 45%,#FFFFFF 100%);
  /* Couleurs de thèmes */
  --ds-rose-600:#C8364A;  --ds-rose-100:#FDECEE;
  --ds-amber-600:#B26B00; --ds-amber-100:#FDF2DE;
  --ds-blue-600:#2F6FD6;  --ds-blue-100:#E7F0FD;
  --ds-peach-600:#C95F22; --ds-peach-100:#FDEEE3;
  /* Neutres */
  --ds-ink:#132B5E;
  --ds-text:#3D4B63;          /* 8,6:1 */
  --ds-muted:#5A6880;         /* 5,6:1 */
  --ds-border:#DDE8F0;
  --ds-border-strong:#C3D3E0;
  --ds-border-input:#8595A8;  /* 3:1 */
  --ds-bg:#F3F8FB;
  --ds-bg-alt:#EAF2F7;
  --ds-surface:#FFFFFF;
  /* États (variantes AA) */
  --ds-success:#067647; --ds-success-bg:#ECFDF3; --ds-success-line:#A6F4C5; --ds-success-ink:#054F31;
  --ds-warning:#93370D; --ds-warning-bg:#FFFAEB; --ds-warning-line:#FEDF89; --ds-warning-ink:#7A2E0E;
  --ds-danger:#B42318;  --ds-danger-bg:#FEF3F2;  --ds-danger-line:#FECDCA;  --ds-danger-ink:#7A271A;
  --ds-info:#175CD3;    --ds-info-bg:#EFF8FF;    --ds-info-line:#B2DDFF;    --ds-info-ink:#123A7A;
  /* Typographie */
  /* V10.4 : polices de repli aux métriques ajustées (voir @font-face ci-dessous),
     pour limiter le décalage de mise en page pendant le chargement des polices. */
  --ds-font:'Inter','Inter Fallback',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --ds-font-head:'Plus Jakarta Sans','Plus Jakarta Sans Fallback','Inter','Inter Fallback',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --ds-font-script:'Caveat','Segoe Script','Bradley Hand',cursive;
  --ds-fs-display:clamp(2.2rem,1.3rem + 3.1vw,3.6rem);
  --ds-fs-h1:clamp(2rem,1.4rem + 2.2vw,2.9rem);
  --ds-fs-h2:clamp(1.65rem,1.2rem + 1.6vw,2.4rem);
  --ds-fs-h3:clamp(1.12rem,1.04rem + .35vw,1.32rem);
  --ds-fs-lead:clamp(1.04rem,.98rem + .3vw,1.2rem);
  --ds-fs-body:1rem;
  --ds-fs-sm:.9rem;
  --ds-fs-xs:.8rem;
  /* Espacements (base 4 px) */
  --ds-space-1:4px;  --ds-space-2:8px;  --ds-space-3:12px; --ds-space-4:16px;
  --ds-space-5:20px; --ds-space-6:24px; --ds-space-8:32px; --ds-space-10:40px;
  --ds-space-12:48px; --ds-space-16:64px; --ds-space-20:80px;
  --ds-section:clamp(56px,2.5rem + 4vw,104px);
  /* Rayons */
  --ds-r-sm:8px; --ds-r-md:12px; --ds-r-lg:16px; --ds-r-xl:20px; --ds-r-2xl:28px; --ds-r-pill:999px;
  /* Ombres (très légères) */
  --ds-shadow-xs:0 1px 2px rgba(19,43,94,.05);
  --ds-shadow-sm:0 1px 2px rgba(19,43,94,.04),0 6px 18px rgba(19,43,94,.05);
  --ds-shadow-md:0 2px 6px rgba(19,43,94,.05),0 16px 40px rgba(19,43,94,.08);
  --ds-shadow-lg:0 4px 12px rgba(19,43,94,.06),0 30px 70px rgba(19,43,94,.13);
  /* Gabarit */
  --ds-container:1200px;
  --ds-gutter:24px;
  --ds-header-h:76px;
  /* Feuillage (décor CSS) */
  --ds-sprig:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 220'%3E%3Cdefs%3E%3Cpath id='l' d='M0 0Q20-11 46 0Q20 11 0 0Z'/%3E%3C/defs%3E%3Cpath d='M62 218C60 160 64 96 76 14' fill='none' stroke='%232E8C7E' stroke-width='2.4' stroke-linecap='round'/%3E%3Cuse href='%23l' fill='%238FCDB8' transform='translate(62 188) rotate(-155) scale(1.05)'/%3E%3Cuse href='%23l' fill='%234FAE95' transform='translate(62 172) rotate(-28) scale(1.05)'/%3E%3Cuse href='%23l' fill='%235DB59C' transform='translate(63 148) rotate(-160) scale(.95)'/%3E%3Cuse href='%23l' fill='%238FCDB8' transform='translate(64 128) rotate(-24) scale(.95)'/%3E%3Cuse href='%23l' fill='%233E9E89' transform='translate(66 104) rotate(-150) scale(.85)'/%3E%3Cuse href='%23l' fill='%235DB59C' transform='translate(67 86) rotate(-30) scale(.85)'/%3E%3Cuse href='%23l' fill='%238FCDB8' transform='translate(70 62) rotate(-145) scale(.72)'/%3E%3Cuse href='%23l' fill='%234FAE95' transform='translate(72 46) rotate(-38) scale(.7)'/%3E%3Cuse href='%23l' fill='%235DB59C' transform='translate(76 16) rotate(-80) scale(.55)'/%3E%3C/svg%3E");
}
@media (max-width:480px){:root{--ds-gutter:16px;--ds-header-h:68px}}

/* 2. BASE ------------------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box}
.ds-page{margin:0;background:var(--ds-surface);color:var(--ds-text);font-family:var(--ds-font);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
:where(.ds-page) :where(h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote){margin:0}
:where(.ds-page) :where(h1,h2,h3,h4){color:var(--ds-ink);font-family:var(--ds-font-head);font-weight:800;line-height:1.2}
:where(.ds-page) :where(ul,ol){padding:0}
:where(.ds-page) :where(ul[class],ol[class]){list-style:none}
:where(.ds-page) :where(img,svg){max-width:100%}
:where(.ds-page) img{height:auto;display:block}
:where(.ds-page) a{color:var(--ds-teal-700)}
:where(.ds-page) strong{color:inherit;font-weight:700}
.ds-page :focus-visible{outline:3px solid var(--ds-teal-700);outline-offset:3px;border-radius:6px}
.ds-on-dark :focus-visible{outline-color:var(--ds-teal-300)}
.ds-on-dark .ds-h1,.ds-on-dark .ds-h2,.ds-on-dark .ds-h3,.ds-on-dark .ds-h4{color:#fff}
.ds-on-dark .ds-lead,.ds-on-dark .ds-text{color:#C9D5E4}
.ds-page [id]{scroll-margin-top:calc(var(--ds-header-h) + 16px)}
html:has(.ds-page){scroll-behavior:smooth}
.skip-link{position:absolute;left:12px;top:-80px;z-index:1000;padding:12px 18px;border-radius:var(--ds-r-sm);background:var(--ds-navy-900);color:#fff;font:700 14px/1.2 var(--ds-font);text-decoration:none;transition:top .2s}
.skip-link:focus{top:12px}

/* 3. MISE EN PAGE ---------------------------------------------------------- */
.ds-container{width:100%;max-width:calc(var(--ds-container) + 2 * var(--ds-gutter));margin-inline:auto;padding-inline:var(--ds-gutter)}
.ds-container--narrow{max-width:calc(880px + 2 * var(--ds-gutter))}
.ds-container--wide{max-width:calc(1280px + 2 * var(--ds-gutter))}
.ds-section{position:relative;padding-block:var(--ds-section);overflow-x:clip}
.ds-section--tight{padding-block:clamp(36px,2rem + 2vw,64px)}
.ds-section--alt{background:var(--ds-bg)}
.ds-section--fade{background:linear-gradient(180deg,var(--ds-bg) 0%,#fff 100%)}
.ds-section--sky{background:var(--ds-gradient-soft)}
.ds-section--dark{background:var(--ds-navy-900);color:#C9D5E4}
.ds-section--dark h2,.ds-section--dark h3,.ds-section--dark h4{color:#fff}
.ds-section-head{max-width:780px;margin:0 0 clamp(28px,3vw,48px)}
.ds-section-head--center{margin-inline:auto;text-align:center}
.ds-section-head .ds-lead{margin-top:14px}
.ds-grid{display:grid;gap:24px}
.ds-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ds-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ds-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ds-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.ds-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);align-items:center}
@media (max-width:1024px){.ds-grid--4,.ds-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-split{grid-template-columns:minmax(0,1fr)}}
@media (max-width:680px){.ds-grid--2,.ds-grid--3,.ds-grid--4{grid-template-columns:minmax(0,1fr)}.ds-grid{gap:16px}}

/* 4. TYPOGRAPHIE ----------------------------------------------------------- */
.ds-eyebrow{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;color:var(--ds-teal-700);font-size:12.5px;font-weight:700;letter-spacing:.12em;line-height:1.3;text-transform:uppercase}
.ds-eyebrow--light{color:var(--ds-teal-300)}
.ds-eyebrow--violet{color:var(--ds-violet-700)}
.ds-display,.ds-h1,.ds-h2,.ds-h3,.ds-h4{font-family:var(--ds-font-head);color:var(--ds-ink)}
.ds-display{font-size:var(--ds-fs-display);font-weight:800;line-height:1.06;letter-spacing:-.028em}
.ds-h1{font-size:var(--ds-fs-h1);font-weight:800;line-height:1.1;letter-spacing:-.025em}
.ds-h2{font-size:var(--ds-fs-h2);font-weight:800;line-height:1.14;letter-spacing:-.022em}
.ds-h3{font-size:var(--ds-fs-h3);font-weight:700;line-height:1.28;letter-spacing:-.015em}
.ds-h4{font-size:1rem;font-weight:700;line-height:1.35}
.ds-lead{font-size:var(--ds-fs-lead);line-height:1.65;color:var(--ds-text)}
.ds-text{font-size:var(--ds-fs-body);color:var(--ds-text)}
.ds-small{font-size:var(--ds-fs-sm)}
.ds-muted{color:var(--ds-muted)}
.ds-gradient-text{background:var(--ds-gradient-ink);-webkit-background-clip:text;background-clip:text;color:transparent}
.ds-script{font-family:var(--ds-font-script);font-weight:600;line-height:1;color:var(--ds-navy-800)}
.ds-prose{max-width:72ch}
.ds-prose>*+*{margin-top:1em}
.ds-prose ul,.ds-prose ol{padding-left:1.3em}

/* 5. ICÔNES ET DÉCOR ------------------------------------------------------- */
.ds-i{width:1.25em;height:1.25em;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.ds-ico{display:inline-grid;place-items:center;flex:0 0 auto;width:48px;height:48px;border-radius:14px;background:var(--ds-teal-100);color:var(--ds-teal-700)}
.ds-ico .ds-i{width:24px;height:24px}
.ds-ico--sm{width:38px;height:38px;border-radius:11px}
.ds-ico--sm .ds-i{width:19px;height:19px}
.ds-ico--lg{width:60px;height:60px;border-radius:18px}
.ds-ico--lg .ds-i{width:28px;height:28px}
.ds-ico--xl{width:76px;height:76px;border-radius:50%}
.ds-ico--xl .ds-i{width:34px;height:34px}
.ds-ico--round{border-radius:50%}
.ds-ico--sky{background:var(--ds-sky-100);color:var(--ds-sky-600)}
.ds-ico--violet{background:var(--ds-violet-100);color:var(--ds-violet-700)}
.ds-ico--rose{background:var(--ds-rose-100);color:var(--ds-rose-600)}
.ds-ico--amber{background:var(--ds-amber-100);color:var(--ds-amber-600)}
.ds-ico--blue{background:var(--ds-blue-100);color:var(--ds-blue-600)}
.ds-ico--peach{background:var(--ds-peach-100);color:var(--ds-peach-600)}
.ds-ico--mint{background:var(--ds-mint-100);color:var(--ds-green-700)}
.ds-ico--solid{background:var(--ds-teal-700);color:#fff}
.ds-ico--navy{background:var(--ds-navy-800);color:#fff}
.ds-ico--white{background:#fff;color:var(--ds-teal-700);box-shadow:var(--ds-shadow-sm)}
.ds-ico--brand{background:var(--ds-gradient-brand);color:#fff}
.ds-ico--glass{background:rgba(127,212,219,.14);color:var(--ds-teal-300)}
.ds-logomark{display:inline-block;flex:0 0 auto;width:40px;height:40px;border-radius:11px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%231AB4C5'/%3E%3Cstop offset='.55' stop-color='%233D8BEA'/%3E%3Cstop offset='1' stop-color='%237A5CF0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='40' height='40' rx='10' fill='url(%23g)'/%3E%3Crect x='13.2' y='13.2' width='13.6' height='13.6' rx='2.6' fill='%23fff' transform='rotate(45 20 20)'/%3E%3C/svg%3E") center/cover no-repeat}
.ds-logomark--sm{width:28px;height:28px;border-radius:8px}
/* Feuillages : SVG inline (.ds-leaf) ou décor CSS (.ds-foliage::before/::after) */
.ds-leaf{position:absolute;z-index:0;width:120px;height:auto;pointer-events:none}
.ds-leaf--flip{transform:scaleX(-1)}
.ds-foliage{position:relative;isolation:isolate}
.ds-foliage::after{content:"";position:absolute;z-index:-1;width:120px;height:204px;background:var(--ds-sprig) center/contain no-repeat;opacity:.55;pointer-events:none}

.ds-foliage::after{right:-22px;bottom:-46px;transform:scaleX(-1) rotate(-14deg)}
.ds-foliage--soft::after{opacity:.35}

/* 6. BOUTONS ET LIENS ------------------------------------------------------ */
.ds-btn{--_bg:var(--ds-teal-700);--_fg:#fff;--_bd:transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border:1.5px solid var(--_bd);border-radius:var(--ds-r-md);background:var(--_bg);color:var(--_fg);font:600 15.5px/1.2 var(--ds-font);text-align:center;text-decoration:none;cursor:pointer;transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}
.ds-btn:hover{--_bg:var(--ds-teal-800);box-shadow:0 10px 24px rgba(11,107,120,.22);transform:translateY(-1px)}
.ds-btn:active{transform:none;box-shadow:none}
.ds-btn .ds-i{width:18px;height:18px}
.ds-btn--secondary{--_bg:#fff;--_fg:var(--ds-navy-800);--_bd:var(--ds-sky-300)}
.ds-btn--secondary:hover{--_bg:var(--ds-sky-50);--_fg:var(--ds-teal-700);--_bd:var(--ds-teal-700);box-shadow:var(--ds-shadow-sm)}
.ds-btn--soft{--_bg:var(--ds-teal-100);--_fg:var(--ds-teal-800)}
.ds-btn--soft:hover{--_bg:var(--ds-teal-200);box-shadow:none}
.ds-btn--light{--_bg:#fff;--_fg:var(--ds-navy-900)}
.ds-btn--light:hover{--_bg:var(--ds-teal-50);--_fg:var(--ds-navy-900);box-shadow:0 12px 28px rgba(0,0,0,.2)}
.ds-btn--outline-light{--_bg:transparent;--_fg:#fff;--_bd:rgba(255,255,255,.55)}
.ds-btn--outline-light:hover{--_bg:rgba(255,255,255,.1);--_bd:#fff;box-shadow:none}
.ds-btn--lg{min-height:56px;padding:15px 26px;border-radius:13px;font-size:16.5px}
.ds-btn--sm{min-height:44px;padding:10px 16px;border-radius:11px;font-size:14.5px}
.ds-btn--block{width:100%}
.ds-btn[disabled],.ds-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.ds-link{display:inline-flex;align-items:center;gap:6px;color:var(--ds-teal-700);font-weight:600;text-decoration:none;text-underline-offset:3px}
.ds-link:hover{text-decoration:underline}
.ds-link .ds-i{width:17px;height:17px;transition:transform .18s}
.ds-link:hover .ds-i{transform:translateX(3px)}
.ds-link--light{color:var(--ds-teal-300)}
.ds-link--underline{text-decoration:underline;text-decoration-color:var(--ds-teal-200);text-decoration-thickness:2px}

/* 7. BADGES ---------------------------------------------------------------- */
.ds-badge{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:5px 12px;border-radius:var(--ds-r-pill);background:var(--ds-sky-100);color:var(--ds-navy-800);font-size:12.5px;font-weight:700;line-height:1.25;white-space:normal}
.ds-badge .ds-i{width:14px;height:14px}
.ds-badge--teal{background:var(--ds-teal-100);color:var(--ds-teal-800)}
.ds-badge--violet{background:var(--ds-violet-100);color:var(--ds-violet-700)}
.ds-badge--neutral{background:var(--ds-bg-alt);color:var(--ds-text)}
.ds-badge--success{background:var(--ds-success-bg);color:var(--ds-success)}
.ds-badge--warning{background:var(--ds-warning-bg);color:var(--ds-warning)}
.ds-badge--danger{background:var(--ds-danger-bg);color:var(--ds-danger)}
.ds-badge--info{background:var(--ds-info-bg);color:var(--ds-info)}
.ds-badge--outline{background:#fff;border:1px solid var(--ds-border-strong);color:var(--ds-ink)}
.ds-badge--on-dark{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff}
.ds-badge--lg{padding:8px 16px;font-size:14px}
.ds-prio{display:inline-flex;align-items:center;padding:3px 9px;border-radius:var(--ds-r-pill);font-size:11.5px;font-weight:800;line-height:1.3;white-space:nowrap}
.ds-prio--urgent{background:var(--ds-danger-bg);color:var(--ds-danger)}
.ds-prio--important{background:var(--ds-success-bg);color:var(--ds-success)}
.ds-prio--secondaire{background:var(--ds-info-bg);color:var(--ds-info)}
.ds-tag{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--ds-border);border-radius:var(--ds-r-pill);background:#fff;color:var(--ds-ink);font-size:13px;font-weight:600;line-height:1.3}
.ds-tag .ds-i{width:16px;height:16px;color:var(--ds-teal-700)}

/* 8. CARTES ---------------------------------------------------------------- */
.ds-card{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0;padding:28px;border:1px solid var(--ds-border);border-radius:var(--ds-r-xl);background:var(--ds-surface);box-shadow:var(--ds-shadow-sm);overflow-wrap:break-word}
.ds-card--flat{box-shadow:none}
.ds-card--sky{background:var(--ds-gradient-soft);border-color:var(--ds-sky-200);box-shadow:none}
.ds-card--tint{background:var(--ds-teal-50);border-color:var(--ds-teal-200);box-shadow:none}
.ds-card--violet{background:var(--ds-violet-50);border-color:var(--ds-violet-200);box-shadow:none}
.ds-card--featured{border:2px solid var(--ds-teal-700);box-shadow:0 24px 60px rgba(11,107,120,.14)}
.ds-card--dark{background:var(--ds-navy-900);border-color:rgba(255,255,255,.08);color:#C9D5E4}
.ds-card--dark .ds-card__title{color:#fff}
.ds-card__title{margin:0;color:var(--ds-ink);font-family:var(--ds-font-head);font-size:1.15rem;font-weight:700;line-height:1.3;letter-spacing:-.012em}
.ds-card__text{margin:0;color:inherit;font-size:15.5px;line-height:1.6}
.ds-card__foot{margin-top:auto;padding-top:6px}
.ds-card>.ds-badge{align-self:flex-start}
.ds-card__num{color:var(--ds-teal-700);font-size:13px;font-weight:800;letter-spacing:.1em}
a.ds-card,.ds-card--link{color:inherit;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s}
a.ds-card:hover,.ds-card--link:hover{transform:translateY(-3px);border-color:var(--ds-teal-200);box-shadow:var(--ds-shadow-md)}

/* 9. ALERTES --------------------------------------------------------------- */
.ds-alert{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border:1px solid var(--ds-info-line);border-radius:var(--ds-r-lg);background:var(--ds-info-bg);color:var(--ds-info-ink);font-size:15px;line-height:1.55}
.ds-alert>.ds-i{width:22px;height:22px;margin-top:1px;color:var(--ds-info)}
.ds-alert__title{display:block;margin-bottom:2px;font-weight:700}
.ds-alert--success{border-color:var(--ds-success-line);background:var(--ds-success-bg);color:var(--ds-success-ink)}
.ds-alert--success>.ds-i{color:var(--ds-success)}
.ds-alert--warning{border-color:var(--ds-warning-line);background:var(--ds-warning-bg);color:var(--ds-warning-ink)}
.ds-alert--warning>.ds-i{color:var(--ds-warning)}
.ds-alert--danger{border-color:var(--ds-danger-line);background:var(--ds-danger-bg);color:var(--ds-danger-ink)}
.ds-alert--danger>.ds-i{color:var(--ds-danger)}
.ds-alert--neutral{border-color:var(--ds-border);background:var(--ds-bg);color:var(--ds-text)}
.ds-alert--neutral>.ds-i{color:var(--ds-muted)}

/* 10. CONFIDENTIALITÉ ------------------------------------------------------ */
.ds-privacy{display:flex;align-items:center;gap:18px;padding:18px 22px;border:1px solid var(--ds-sky-200);border-radius:var(--ds-r-xl);background:var(--ds-gradient-soft);color:var(--ds-text)}
.ds-privacy__icon{display:grid;place-items:center;flex:0 0 auto;width:54px;height:54px;border-radius:50%;background:var(--ds-teal-700);color:#fff;box-shadow:0 8px 20px rgba(11,107,120,.22)}
.ds-privacy__icon .ds-i{width:25px;height:25px}
.ds-privacy__body{min-width:0}
.ds-privacy__title{margin:0 0 3px;color:var(--ds-ink);font-family:var(--ds-font-head);font-size:1.06rem;font-weight:700;line-height:1.35}
.ds-privacy__text{margin:0;font-size:15px;line-height:1.55}
.ds-privacy__link{margin-left:auto;flex:0 0 auto}
.ds-privacy--stack{flex-direction:column;align-items:flex-start;gap:14px}
.ds-privacy--stack .ds-privacy__link{margin-left:0}
.ds-privacy--dark{border-color:rgba(127,212,219,.28);background:rgba(255,255,255,.05);color:#C9D5E4}
.ds-privacy--dark .ds-privacy__title{color:#fff}
@media (max-width:640px){.ds-privacy{flex-direction:column;align-items:flex-start;padding:18px}.ds-privacy__link{margin-left:0}}
/* Grand bandeau « Un service confidentiel » */
.ds-trustband{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:22px 28px;overflow:hidden;padding:26px 32px;border:1px solid var(--ds-sky-200);border-radius:24px;background:linear-gradient(120deg,#F4FAFD 0%,#E7F2FA 60%,#E3F1F3 100%)}
.ds-trustband__lock{display:grid;place-items:center;width:78px;height:78px;border-radius:50%;background:var(--ds-teal-700);color:#fff;box-shadow:0 12px 30px rgba(11,107,120,.28)}
.ds-trustband__lock .ds-i{width:34px;height:34px}
.ds-trustband h2{font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);letter-spacing:-.02em}
.ds-trustband p{margin-top:6px;color:var(--ds-text);font-size:15.5px;line-height:1.6}
.ds-trustband__side{position:relative;display:flex;align-items:center;gap:20px;padding-right:90px}
.ds-trustband__shield{position:absolute;right:0;top:50%;width:92px;height:auto;transform:translateY(-50%)}
@media (max-width:980px){.ds-trustband{grid-template-columns:auto minmax(0,1fr)}.ds-trustband__side{grid-column:1/-1;padding-right:0}.ds-trustband__shield{display:none}}
@media (max-width:560px){.ds-trustband{grid-template-columns:minmax(0,1fr);padding:22px 20px}.ds-trustband__lock{width:60px;height:60px}}

/* 11. FORMULAIRES ---------------------------------------------------------- */
.ds-field{display:grid;gap:6px;margin-bottom:18px}
.ds-label{color:var(--ds-ink);font-size:14.5px;font-weight:600;line-height:1.4}
.ds-optional{color:var(--ds-muted);font-weight:400}
.ds-input,.ds-select,.ds-textarea{width:100%;min-height:48px;padding:12px 14px;border:1.5px solid var(--ds-border-input);border-radius:var(--ds-r-md);background:#fff;color:var(--ds-ink);font:16px/1.4 var(--ds-font);transition:border-color .15s,box-shadow .15s}
.ds-input:hover,.ds-select:hover,.ds-textarea:hover{border-color:#6B7D92}
.ds-input:focus,.ds-select:focus,.ds-textarea:focus{outline:none;border-color:var(--ds-teal-700);box-shadow:0 0 0 4px rgba(11,107,120,.16)}
.ds-select{appearance:none;-webkit-appearance:none;padding-right:44px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23132B5E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 14px center/18px no-repeat}
.ds-textarea{min-height:120px;resize:vertical}
.ds-input[aria-invalid="true"],.ds-textarea[aria-invalid="true"]{border-color:var(--ds-danger)}
.ds-hint{color:var(--ds-muted);font-size:13.5px;line-height:1.5}
.ds-error-text{color:var(--ds-danger);font-size:13.5px;font-weight:600}
.ds-check{display:flex;align-items:flex-start;gap:12px;min-height:44px;color:var(--ds-text);font-size:14.5px;line-height:1.5;cursor:pointer}
.ds-check input{width:22px;height:22px;margin:1px 0 0;flex:0 0 auto;accent-color:var(--ds-teal-700)}
.ds-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:640px){.ds-form-row{grid-template-columns:minmax(0,1fr);gap:0}}

/* 12. TABLEAUX ------------------------------------------------------------- */
.ds-table-wrap{overflow-x:auto;border:1px solid var(--ds-border);border-radius:var(--ds-r-lg);background:#fff;-webkit-overflow-scrolling:touch}
.ds-table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
.ds-table caption{padding:14px 18px;color:var(--ds-muted);font-size:13.5px;text-align:left;caption-side:bottom}
.ds-table th{padding:14px 18px;border-bottom:1px solid var(--ds-border);background:var(--ds-sky-50);color:var(--ds-ink);font-size:12.5px;font-weight:700;letter-spacing:.06em;text-align:left;text-transform:uppercase}
.ds-table td{padding:14px 18px;border-bottom:1px solid var(--ds-border);color:var(--ds-text);vertical-align:top}
.ds-table tbody tr:last-child td{border-bottom:0}
.ds-table tbody tr:hover{background:#FAFCFE}
.ds-table .ds-num{text-align:right;font-variant-numeric:tabular-nums}

/* 13. NAVIGATION PRINCIPALE ------------------------------------------------
   nav.navbar > .nav-container > a.brand, button.menu-toggle, div.nav-menu
   (site.js bascule .nav-menu.active). « Se connecter » = <details>.
   Menu compact sous 1280 px ; au-delà le logo peut rétrécir plutôt que de
   provoquer un débordement. */
.navbar{position:sticky;top:0;z-index:100;padding:0;border-bottom:1px solid var(--ds-border);background:rgba(255,255,255,.95);-webkit-backdrop-filter:saturate(1.6) blur(12px);backdrop-filter:saturate(1.6) blur(12px);box-shadow:none;font-family:var(--ds-font)}
.navbar .nav-container{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:calc(1280px + 2 * var(--ds-gutter));min-height:var(--ds-header-h);margin:0 auto;padding:0 var(--ds-gutter)}
.navbar .brand{display:inline-flex;align-items:center;flex:0 1 auto;min-width:0;text-decoration:none}
.navbar .brand-logo{display:block;width:auto;max-width:100%;height:46px;object-fit:contain;object-position:left center}
.navbar .nav-menu{position:static;display:flex;flex-direction:row;align-items:center;gap:2px;max-height:none;padding:0;overflow:visible;background:none;box-shadow:none;white-space:nowrap}
.navbar .nav-link{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 10px;border-radius:10px;background:none;color:var(--ds-text);font:500 14.5px/1.2 var(--ds-font);text-decoration:none;transition:color .15s,background-color .15s}
.navbar .nav-link:hover{background:var(--ds-sky-50);color:var(--ds-ink)}
.navbar .nav-link.active{background:none;color:var(--ds-teal-700);font-weight:600}
.navbar .nav-link.active::after{content:"";position:absolute;left:10px;right:10px;bottom:3px;height:2px;border-radius:2px;background:var(--ds-teal-700)}
.navbar .nav-menu .btn,.navbar .nav-menu .ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-left:6px;padding:10px 16px;border:0;border-radius:11px;background:var(--ds-teal-700);color:#fff;font:600 14.5px/1.2 var(--ds-font);text-decoration:none;white-space:nowrap;box-shadow:none;transform:none}
.navbar .nav-menu .btn:hover,.navbar .nav-menu .ds-btn:hover{background:var(--ds-teal-800);color:#fff;transform:none;box-shadow:0 8px 20px rgba(11,107,120,.2)}
.navbar .nav-menu .ds-btn .ds-i{width:17px;height:17px}
.navbar .menu-toggle{display:none;align-items:center;justify-content:center;flex:0 0 auto;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border:1px solid var(--ds-border-strong);border-radius:12px;background:#fff;color:var(--ds-ink);font-size:22px;line-height:1;cursor:pointer}
.navbar .menu-toggle .ds-i{width:22px;height:22px}
.navbar .menu-toggle[aria-expanded="true"]{border-color:var(--ds-teal-700);color:var(--ds-teal-700)}
/* « Se connecter » : bouton contour + menu déroulant natif */
.nav-account{position:relative;margin-left:8px}
.nav-account>summary{list-style:none;cursor:pointer;user-select:none}
.nav-account>summary::-webkit-details-marker{display:none}
.navbar .nav-account>summary.nav-link{gap:8px;padding:9px 14px;border:1.5px solid var(--ds-sky-300);border-radius:11px;background:#fff;color:var(--ds-navy-800);font-weight:600}
.navbar .nav-account>summary.nav-link:hover{border-color:var(--ds-teal-700);color:var(--ds-teal-700)}
.navbar .nav-account>summary.nav-link::after{display:none}
.nav-account>summary .ds-i{width:17px;height:17px;transition:transform .18s}
.nav-account[open]>summary .ds-i--chev{transform:rotate(180deg)}
.nav-account__panel{position:absolute;right:0;top:calc(100% + 10px);z-index:5;display:grid;gap:4px;width:320px;padding:8px;border:1px solid var(--ds-border);border-radius:16px;background:#fff;box-shadow:var(--ds-shadow-lg);white-space:normal}
.nav-account__panel a{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:12px;border-radius:12px;color:var(--ds-ink);text-decoration:none}
.nav-account__panel a:hover{background:var(--ds-sky-50)}
.nav-account__panel strong{display:block;font-size:14.5px;line-height:1.3}
.nav-account__panel small{display:block;margin-top:2px;color:var(--ds-muted);font-size:13px;line-height:1.4}
@media (max-width:1279.98px){
  .navbar .menu-toggle{display:inline-flex}
  .navbar .nav-menu{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:2px;max-height:calc(100vh - var(--ds-header-h));max-height:calc(100dvh - var(--ds-header-h));overflow-y:auto;padding:12px var(--ds-gutter) 22px;border-bottom:1px solid var(--ds-border);background:#fff;box-shadow:0 18px 40px rgba(19,43,94,.12);white-space:normal}
  .navbar .nav-menu.active{display:flex}
  .navbar .nav-link{min-height:48px;padding:12px 14px;font-size:16px}
  .navbar .nav-link.active{background:var(--ds-teal-50)}
  .navbar .nav-link.active::after{top:12px;bottom:12px;left:0;right:auto;width:3px;height:auto}
  .navbar .nav-menu .btn,.navbar .nav-menu .ds-btn{width:100%;min-height:48px;margin:10px 0 0;font-size:16px}
  .nav-account{margin:8px 0 0}
  .navbar .nav-account>summary.nav-link{justify-content:center;width:100%}
  .nav-account__panel{position:static;width:auto;margin:6px 0;padding:4px;border:0;border-left:3px solid var(--ds-teal-200);border-radius:0;box-shadow:none}
}
@media (max-width:480px){.navbar .brand-logo{height:36px}.navbar .nav-container{gap:12px}}

/* 14. PIED DE PAGE --------------------------------------------------------- */
.footer{position:relative;overflow:hidden;padding:72px 0 32px;background:var(--ds-navy-950);color:#C9D5E4;font-family:var(--ds-font);font-size:15px;line-height:1.6}
.footer::before{content:"";position:absolute;right:-40px;top:-30px;width:180px;height:300px;background:var(--ds-sprig) center/contain no-repeat;opacity:.12;transform:rotate(12deg);pointer-events:none}
.footer .container{position:relative;width:100%;max-width:calc(1280px + 2 * var(--ds-gutter));margin:0 auto;padding:0 var(--ds-gutter)}
.footer a{color:#D8E2EF;opacity:1;text-decoration:none;transition:color .15s}
.footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px;margin-bottom:48px}
.footer-grid:has(>.footer-col:nth-child(3):last-child){grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,1fr))}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:14px;color:#fff;font-family:var(--ds-font-head);font-size:19px;font-weight:800;letter-spacing:-.01em;opacity:1}
.footer-brand::before{content:"";width:40px;height:40px;flex:0 0 auto;border-radius:11px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%231AB4C5'/%3E%3Cstop offset='.55' stop-color='%233D8BEA'/%3E%3Cstop offset='1' stop-color='%237A5CF0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='40' height='40' rx='10' fill='url(%23g)'/%3E%3Crect x='13.2' y='13.2' width='13.6' height='13.6' rx='2.6' fill='%23fff' transform='rotate(45 20 20)'/%3E%3C/svg%3E") center/cover no-repeat}
.footer-brand small{display:block;margin-top:2px;color:#A3B4C8;font-family:var(--ds-font);font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.footer-tagline{margin:0 0 10px;color:#BCCAD9;font-size:14px;line-height:1.65;opacity:1}
.footer-siret{margin:0;color:#A3B4C8;font-family:var(--ds-font);font-size:12.5px;letter-spacing:.02em;opacity:1}
.footer-badge{display:inline-flex;align-items:center;gap:6px;margin:14px 6px 0 0;padding:5px 12px;border:1px solid rgba(255,255,255,.14);border-radius:var(--ds-r-pill);background:rgba(255,255,255,.06);color:#D8E2EF;font-size:12px;font-weight:600}
.footer-col-title{margin-bottom:16px;color:#A3B4C8;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.footer-col-links{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.footer-col-links li a{font-size:14.5px;font-weight:500}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;padding-top:24px;border-top:1px solid rgba(255,255,255,.1)}
.footer-bottom p{margin:0;color:#A3B4C8;font-size:13px;opacity:1}
.footer-bottom a,.footer-bottom a[style]{font-size:13px!important}
.footer-linkedin{display:inline-flex;align-items:center;gap:6px;opacity:1}
.footer-linkedin img{width:18px;height:18px}
.footer-legal{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
@media (max-width:980px){.footer-grid,.footer-grid:has(>.footer-col:nth-child(3):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.footer-grid>.footer-col:first-child{grid-column:1/-1}}
@media (max-width:560px){.footer{padding:56px 0 28px}.footer-grid,.footer-grid:has(>.footer-col:nth-child(3):last-child){grid-template-columns:minmax(0,1fr);gap:32px}.footer-bottom{flex-direction:column;align-items:flex-start}}

/* 15. COMPOSANTS PRODUIT (maquettes et espaces) ---------------------------- */
.ds-browser{position:relative;overflow:hidden;isolation:isolate;border:1px solid var(--ds-border);border-radius:20px;background:#fff;box-shadow:var(--ds-shadow-lg)}
.ds-browser__bar{display:flex;align-items:center;gap:14px;height:44px;padding:0 16px;border-bottom:1px solid var(--ds-border);background:#F4F8FB}
.ds-browser__dots{display:flex;flex:0 0 auto;gap:7px}
.ds-browser__dots i{width:10px;height:10px;border-radius:50%;background:#FF5F57}
.ds-browser__dots i:nth-child(2){background:#FEBC2E}
.ds-browser__dots i:nth-child(3){background:#28C840}
.ds-browser__url{display:flex;flex:1 1 auto;align-items:center;justify-content:center;gap:8px;min-width:0;max-width:440px;height:28px;margin:0 auto;padding:0 14px;overflow:hidden;border:1px solid var(--ds-border);border-radius:9px;background:#fff;color:var(--ds-muted);font-size:12.5px;white-space:nowrap;text-overflow:ellipsis}
.ds-browser__url .ds-i{width:13px;height:13px}
.ds-browser__spacer{width:44px;flex:0 0 auto}
.ds-browser__body{background:var(--ds-bg)}
.ds-demo-note{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;color:var(--ds-muted);font-size:13.5px;text-align:center}
.ds-demo-note .ds-i{width:16px;height:16px}
@media (max-width:560px){.ds-browser{border-radius:16px}.ds-browser__dots,.ds-browser__spacer{display:none}.ds-browser__bar{padding:0 10px}}
.ds-app{color:var(--ds-text);font-size:15px}
.ds-app__bar{display:flex;align-items:center;gap:22px;min-height:64px;padding:12px 24px;border-bottom:1px solid var(--ds-border);background:#fff}
.ds-app__logo{flex:0 0 auto;width:auto;height:30px}
.ds-app__nav{display:flex;flex:1 1 auto;align-items:center;gap:2px;min-width:0;overflow:hidden}
.ds-app__nav>span{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:10px;color:var(--ds-text);font-size:13.5px;font-weight:500;white-space:nowrap}
.ds-app__nav .ds-i{width:17px;height:17px}
.ds-app__nav .is-active{background:var(--ds-sky-100);color:var(--ds-navy-800);font-weight:600}
.ds-app__nav--tabs .is-active{border-radius:0;background:none;color:var(--ds-teal-700);box-shadow:inset 0 -2px 0 var(--ds-teal-700)}
.ds-app__user{display:flex;align-items:center;gap:10px;margin-left:auto;color:var(--ds-ink);font-size:14px;font-weight:600;white-space:nowrap}
.ds-app__user .ds-i{width:16px;height:16px;color:var(--ds-muted)}
.ds-app__main{display:grid;gap:20px;padding:26px 24px 28px}
.ds-app__hello{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center}
.ds-app__hello h3{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);line-height:1.12;letter-spacing:-.025em}
.ds-app__hello>div>p:not(.ds-eyebrow){margin-top:8px;max-width:620px;font-size:15.5px}
.ds-app__hello--employer{grid-template-columns:minmax(0,1.35fr) minmax(260px,.9fr);align-items:stretch}
.ds-app__hello--employer .ds-eyebrow{margin-bottom:8px}
.ds-app__cols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:start}
.ds-app__cols--employer{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:stretch}
.ds-app__stack{display:grid;gap:20px}
.ds-app__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:14px 24px;border-top:1px solid var(--ds-border);background:#fff;color:var(--ds-muted);font-size:13px}
.ds-app__deco{display:block;width:220px;height:auto}
.ds-callback{background:linear-gradient(135deg,#fff 55%,var(--ds-sky-50) 100%)}
.ds-avatar{display:grid;place-items:center;flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--ds-sky-100);color:var(--ds-navy-800);font-size:13px;font-weight:700}
@media (max-width:1100px){.ds-app__nav>span:nth-child(n+4){display:none}}
@media (max-width:860px){.ds-app__nav{display:none}.ds-app__cols,.ds-app__hello--employer{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.ds-app__bar{gap:12px;min-height:56px;padding:10px 14px}.ds-app__logo{height:24px}.ds-app__user-name{display:none}.ds-app__main{padding:18px 14px 20px;gap:16px}.ds-app__hello{grid-template-columns:minmax(0,1fr)}.ds-app__hello>.ds-app__deco{display:none}.ds-app__foot{padding:12px 14px}}
.ds-panel{min-width:0;padding:22px;border:1px solid var(--ds-border);border-radius:18px;background:#fff;box-shadow:var(--ds-shadow-xs);overflow-wrap:break-word}
.ds-panel__head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin-bottom:16px}
.ds-panel__title{margin:0;color:var(--ds-ink);font-family:var(--ds-font-head);font-size:17px;font-weight:700;line-height:1.3}
.ds-panel__meta{margin-left:auto;color:var(--ds-muted);font-size:13px}
@media (max-width:560px){.ds-panel{padding:16px;border-radius:14px}}
.ds-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ds-kpi{display:flex;align-items:flex-start;gap:14px;min-width:0;padding:20px;border:1px solid var(--ds-border);border-radius:18px;background:#fff}
.ds-kpi__label{display:block;color:var(--ds-text);font-size:13.5px;font-weight:600;line-height:1.35}
.ds-kpi__value{display:block;margin:6px 0 4px;color:var(--ds-ink);font-family:var(--ds-font-head);font-size:30px;font-weight:800;line-height:1.05;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ds-kpi__sub{display:block;color:var(--ds-muted);font-size:12.5px;line-height:1.4}
@media (max-width:1100px){.ds-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.ds-kpis{grid-template-columns:minmax(0,1fr)}.ds-kpi{padding:16px}}
.ds-progress{display:block;height:8px;overflow:hidden;border-radius:var(--ds-r-pill);background:var(--ds-bg-alt)}
.ds-progress>i{display:block;width:var(--v,50%);height:100%;border-radius:inherit;background:var(--ds-teal-700)}
.ds-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:14px;color:var(--ds-text);font-size:13px}
.ds-legend span{display:inline-flex;align-items:center;gap:7px}
.ds-legend i{width:10px;height:10px;border-radius:50%;background:var(--c,var(--ds-teal-700))}
.ds-chart{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;row-gap:8px}
.ds-chart__y{display:flex;flex-direction:column;justify-content:space-between;height:180px;margin:-7px 0;color:var(--ds-muted);font-size:11.5px;line-height:14px;text-align:right}
.ds-chart__plot{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:end;height:180px;border-bottom:1px solid var(--ds-border-strong);background:repeating-linear-gradient(to top,var(--ds-border) 0 1px,transparent 1px 45px)}
.ds-chart__group{display:flex;align-items:flex-end;justify-content:center;gap:4px;height:100%}
.ds-chart__bar{width:clamp(7px,26%,22px);height:var(--h);border-radius:6px 6px 0 0;background:var(--ds-teal-700)}
.ds-chart__bar--alt{background:var(--ds-sky-500)}
.ds-chart__x{grid-column:2;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));color:var(--ds-muted);font-size:11.5px;text-align:center}
.ds-meters{display:grid;gap:14px;margin:0;padding:0;list-style:none}
.ds-meter{display:grid;grid-template-columns:38px minmax(0,1fr) 48px minmax(70px,1.1fr);align-items:center;gap:12px}
.ds-meter__label{color:var(--ds-ink);font-size:14px;font-weight:600;line-height:1.3}
.ds-meter__value{color:var(--ds-ink);font-size:13.5px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.ds-meter__track{height:10px;overflow:hidden;border-radius:var(--ds-r-pill);background:var(--ds-bg-alt)}
.ds-meter__fill{display:block;width:var(--v);height:100%;border-radius:inherit;background:var(--c,var(--ds-teal-700))}
@media (max-width:480px){.ds-meter{grid-template-columns:34px minmax(0,1fr) 44px}.ds-meter__track{grid-column:2/-1}}
.ds-chat{display:grid;gap:14px}
.ds-msg{display:flex;align-items:flex-start;gap:12px}
.ds-msg__bubble{flex:1 1 auto;min-width:0;padding:14px 16px;border:1px solid var(--ds-border);border-radius:16px;background:var(--ds-bg);color:var(--ds-ink);font-size:14.5px;line-height:1.6}
.ds-msg--bot .ds-msg__bubble{border-color:var(--ds-sky-200);background:var(--ds-sky-50)}
.ds-msg__title{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 8px;color:var(--ds-ink);font-weight:700}
.ds-msg__meta{margin-top:12px;padding-top:10px;border-top:1px solid var(--ds-sky-200);color:var(--ds-muted);font-size:12.5px}
@media (max-width:420px){.ds-msg>.ds-avatar,.ds-msg>.ds-logomark{display:none}}
/* Listes */
.ds-checklist{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.ds-checklist li{position:relative;padding-left:34px;color:var(--ds-text);line-height:1.5}
.ds-checklist li::before{content:"";position:absolute;left:0;top:0;width:23px;height:23px;border-radius:50%;background:var(--ds-teal-700) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.ds-checklist--soft li::before,.ds-checklist--neutral li::before{background-color:var(--ds-teal-100);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B6B78' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.ds-checklist--on-dark li{color:#D8E3EE}
.ds-checklist--on-dark li::before{background-color:var(--ds-teal-500)}
.ds-checklist--compact{gap:8px}
.ds-checklist--compact li{padding-left:30px;font-size:14.5px}
.ds-checklist--compact li::before{width:20px;height:20px;background-size:11px}
.ds-steps{display:grid;gap:12px;margin:0;padding:0;list-style:none;counter-reset:ds-step}
.ds-steps li{position:relative;padding-left:40px;color:var(--ds-ink);line-height:1.55;counter-increment:ds-step}
.ds-steps li::before{content:counter(ds-step);position:absolute;left:0;top:-1px;display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:var(--ds-teal-700);color:#fff;font-size:13px;font-weight:700}
.ds-steps small{display:block;margin-top:2px;color:var(--ds-muted);font-size:12.5px}
.ds-todo{display:grid;margin:0;padding:0;list-style:none}
.ds-todo li{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px dashed var(--ds-border);color:var(--ds-ink);font-size:14.5px;line-height:1.45}
.ds-todo li:last-child{border-bottom:0}
.ds-todo__box{display:grid;place-items:center;flex:0 0 auto;width:22px;height:22px;margin-top:1px;border:2px solid #97A8B9;border-radius:50%;color:#fff}
.ds-todo__box .ds-i{width:13px;height:13px;stroke-width:3}
.ds-todo__text{flex:1 1 auto;min-width:0}
.ds-todo .is-done .ds-todo__box{border-color:var(--ds-teal-700);background:var(--ds-teal-700)}
.ds-todo .is-done .ds-todo__text{color:var(--ds-muted);text-decoration:line-through}
.ds-todo .ds-prio{flex:0 0 auto;margin-top:1px}
.ds-doclist{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.ds-doclist li{display:flex;align-items:flex-start;gap:12px;color:var(--ds-ink);font-size:14.5px;line-height:1.45}
.ds-doclist .ds-i{width:20px;height:20px;margin-top:1px;color:var(--ds-teal-700)}
.ds-doclist small{display:block;color:var(--ds-muted);font-size:12.5px}
.ds-minis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ds-minis--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.ds-mini{display:flex;align-items:center;gap:12px;min-width:0;padding:14px;border:1px solid var(--ds-border);border-radius:14px;background:#fff;color:inherit;text-decoration:none}
.ds-mini strong{display:block;color:var(--ds-ink);font-size:14px;line-height:1.35}
.ds-mini small{display:block;margin-top:3px;color:var(--ds-muted);font-size:12.5px}
.ds-mini>.ds-i{margin-left:auto;width:18px;height:18px;color:var(--ds-muted)}
a.ds-mini:hover{border-color:var(--ds-teal-200);box-shadow:var(--ds-shadow-sm)}
@media (max-width:1100px){.ds-minis{grid-template-columns:minmax(0,1fr)}.ds-minis--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ds-minis--4{grid-template-columns:minmax(0,1fr)}}
.ds-fake-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 18px;border-radius:11px;background:var(--ds-teal-700);color:#fff;font-size:14.5px;font-weight:600;line-height:1.2}
.ds-fake-btn .ds-i{width:17px;height:17px}
.ds-fake-btn--secondary{border:1.5px solid var(--ds-sky-300);background:#fff;color:var(--ds-ink)}
/* Tarifs */
.ds-pricing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.ds-price{position:relative;display:flex;flex-direction:column;gap:20px;min-width:0;padding:30px;border:1px solid var(--ds-border);border-radius:24px;background:#fff;box-shadow:var(--ds-shadow-sm)}
.ds-price__top{display:flex;align-items:center;gap:14px}
.ds-price__name{color:var(--ds-teal-700);font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.ds-price__title{margin:6px 0 0;color:var(--ds-ink);font-family:var(--ds-font-head);font-size:23px;font-weight:800;line-height:1.2;letter-spacing:-.02em}
.ds-price__desc{margin:10px 0 0;color:var(--ds-text);font-size:15px;line-height:1.55}
.ds-price__amount{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;padding:18px 20px;border-radius:16px;background:var(--ds-sky-50)}
.ds-price__from{width:100%;color:var(--ds-muted);font-size:13.5px;font-weight:600}
.ds-price__amount strong{color:var(--ds-ink);font-family:var(--ds-font-head);font-size:clamp(36px,1.9rem + 1.2vw,46px);font-weight:800;line-height:1;letter-spacing:-.035em}
.ds-price__unit{color:var(--ds-muted);font-size:15px;font-weight:500}
.ds-price .ds-checklist{gap:10px;font-size:15px}
.ds-price .ds-btn{margin-top:auto}
.ds-price__ribbon{position:absolute;top:-15px;left:30px;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--ds-r-pill);background:var(--ds-gradient-ink);color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.02em;box-shadow:0 8px 20px rgba(91,52,200,.25)}
.ds-price--featured{border:2px solid var(--ds-teal-700);background:linear-gradient(180deg,#F1FAFB 0%,#fff 40%);box-shadow:0 28px 64px rgba(11,107,120,.16)}
.ds-price--featured .ds-price__amount{background:var(--ds-navy-800)}
.ds-price--featured .ds-price__amount strong{color:#fff}
.ds-price--featured .ds-price__unit,.ds-price--featured .ds-price__from{color:#C9D5E4}
@media (min-width:981px){.ds-price--featured{transform:translateY(-12px)}}
@media (max-width:980px){.ds-pricing{grid-template-columns:minmax(0,1fr);max-width:580px;margin-inline:auto;gap:32px}}
@media (max-width:480px){.ds-price{padding:26px 20px}.ds-price__ribbon{left:20px}}
.ds-price-included{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 16px;margin-top:44px}
.ds-price-included .ds-cluster{justify-content:center}
.ds-price-note{max-width:860px;margin:24px auto 0;color:var(--ds-muted);font-size:13.5px;line-height:1.6;text-align:center}
/* FAQ */
.ds-faq{display:grid;gap:12px;max-width:880px;margin:0 auto}
.ds-faq details{border:1px solid var(--ds-border);border-radius:16px;background:#fff;box-shadow:var(--ds-shadow-xs);transition:border-color .15s}
.ds-faq details[open]{border-color:var(--ds-sky-300)}
.ds-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:18px 22px;color:var(--ds-ink);font-size:16.5px;font-weight:650;line-height:1.4;list-style:none;cursor:pointer}
.ds-faq summary::-webkit-details-marker{display:none}
.ds-faq summary::after{content:"";flex:0 0 auto;width:26px;height:26px;border-radius:50%;background:var(--ds-teal-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B6B78' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/13px no-repeat;transition:transform .2s}
.ds-faq details[open] summary::after{transform:rotate(45deg)}
.ds-faq details>p{padding:0 22px 20px;color:var(--ds-text)}

/* 16. ACCUEIL -------------------------------------------------------------- */
/* Héros : titre à gauche, deux maquettes superposées à droite */
.ds-hero{position:relative;overflow:hidden;padding:clamp(36px,1.5rem + 3vw,72px) 0 clamp(48px,2rem + 3vw,88px);background:radial-gradient(900px 520px at 100% 0%,rgba(122,92,240,.08),transparent 62%),radial-gradient(760px 480px at 70% 110%,rgba(26,180,197,.10),transparent 60%),var(--ds-gradient-page)}
.ds-hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,3.5vw,56px);align-items:center}
.ds-hero__title{font-size:clamp(2.1rem,1.3rem + 2.3vw,3.1rem)}
.ds-hero__ctas .ds-btn--lg{padding:14px 20px;font-size:16px}
.ds-hero__lead{max-width:600px;margin:22px 0 32px}
.ds-hero__ctas{display:flex;flex-wrap:wrap;gap:14px}
.ds-hero__trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;padding:0;list-style:none;color:var(--ds-ink);font-size:14px;font-weight:600}
.ds-hero__trust li{display:inline-flex;align-items:center;gap:8px}
.ds-hero__trust li::before{content:"";flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--ds-teal-700) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat}
@media (max-width:1100px){.ds-hero__grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.ds-hero__ctas .ds-btn{width:100%}}
.ds-stage{position:relative;min-height:520px}
.ds-stage__leaf{position:absolute;z-index:0;width:130px;height:auto;pointer-events:none}
.ds-stage__leaf--a{left:-38px;bottom:-10px;transform:rotate(-12deg)}
.ds-stage__leaf--b{left:34%;top:-42px;width:110px;transform:rotate(18deg)}
.ds-stage__leaf--c{right:-26px;bottom:40px;width:120px;transform:scaleX(-1) rotate(-10deg)}
.ds-stage__script{position:absolute;z-index:3;right:6px;top:-6px;transform:rotate(-6deg);font-size:clamp(26px,1.4rem + .8vw,34px);text-align:right}
.ds-stage__script::after{content:"";display:block;width:62%;height:10px;margin:2px 0 0 auto;border-bottom:2.5px solid var(--ds-navy-800);border-radius:0 0 50% 50%}
.ds-shot{position:absolute;z-index:1;font-size:11px}
.ds-shot .ds-browser__bar{height:30px;padding:0 10px}
.ds-shot .ds-browser__dots i{width:8px;height:8px}
.ds-shot .ds-browser__url{height:20px;font-size:10px}
.ds-shot__appbar{white-space:nowrap}
.ds-shot__tag{position:absolute;z-index:4;top:-26px;left:24px;display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid var(--ds-sky-200);border-radius:var(--ds-r-pill);background:var(--ds-sky-100);color:var(--ds-navy-800);font:700 14px/1 var(--ds-font-head);box-shadow:var(--ds-shadow-sm)}
.ds-shot--salarie{left:0;top:40px;z-index:2;width:58%}
.ds-shot--employeur{right:0;top:96px;width:40%}
.ds-shot__caption{color:var(--ds-ink);font-size:11px}
.ds-shot--employeur .ds-shot__tag{left:auto;right:18px}
.ds-shot__body{display:grid;gap:9px;padding:12px}
.ds-shot__appbar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--ds-border);background:#fff;color:var(--ds-ink);font-weight:700}
.ds-shot__appbar .ds-logomark{width:18px;height:18px;border-radius:5px}
.ds-shot__nav{display:flex;gap:4px;margin-left:auto;overflow:hidden}
.ds-shot__nav span{padding:3px 7px;border-radius:6px;color:var(--ds-muted);font-size:9.5px;font-weight:500;white-space:nowrap}
.ds-shot__nav .is-active{background:var(--ds-sky-100);color:var(--ds-navy-800);font-weight:700}
.ds-shot__hello{position:relative;overflow:hidden;min-height:78px;padding:10px 12px;border-radius:10px;background:linear-gradient(90deg,#fff 42%,rgba(255,255,255,0)),var(--ds-sky-50)}
.ds-shot__hello strong{display:block;color:var(--ds-ink);font:800 17px/1.2 var(--ds-font-head);letter-spacing:-.02em}
.ds-shot__hello span{display:block;max-width:58%;margin-top:4px;color:var(--ds-muted);font-size:9.5px;line-height:1.4}
.ds-shot__hello svg{position:absolute;right:0;bottom:0;width:58%;height:auto}
.ds-shot__row{display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid var(--ds-border);border-radius:10px;background:#fff}
.ds-shot__row--sky{border-color:var(--ds-sky-200);background:var(--ds-sky-50)}
.ds-shot__row .ds-ico{width:26px;height:26px;border-radius:8px}
.ds-shot__row .ds-ico .ds-i{width:14px;height:14px}
.ds-shot__row b{display:block;color:var(--ds-ink);font-size:10.5px}
.ds-shot__row small{display:block;color:var(--ds-muted);font-size:9px;line-height:1.35}
.ds-shot__row>.ds-i{margin-left:auto;width:13px;height:13px;color:var(--ds-muted)}
.ds-shot__list{display:grid;gap:5px;margin:0;padding:0 0 0 2px;list-style:none}
.ds-shot__list li{position:relative;padding-left:17px;color:var(--ds-text);font-size:9.5px;line-height:1.4}
.ds-shot__list li::before{content:"";position:absolute;left:0;top:1px;width:11px;height:11px;border-radius:50%;background:var(--ds-teal-700) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/7px no-repeat}
.ds-shot__kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.ds-shot__kpi{display:flex;align-items:center;gap:7px;padding:8px;border:1px solid var(--ds-border);border-radius:9px;background:#fff}
.ds-shot__kpi .ds-ico{width:24px;height:24px;border-radius:50%}
.ds-shot__kpi .ds-ico .ds-i{width:13px;height:13px}
.ds-shot__kpi b{display:block;color:var(--ds-ink);font:800 15px/1 var(--ds-font-head)}
.ds-shot__kpi small{display:block;color:var(--ds-muted);font-size:8.5px;line-height:1.3}
.ds-shot__bars{display:grid;gap:6px;padding:9px 10px;border:1px solid var(--ds-border);border-radius:10px;background:#fff}
.ds-shot__bars>b{color:var(--ds-ink);font-size:10.5px}
.ds-shot__bar{display:grid;grid-template-columns:minmax(0,1fr) 26px 40%;align-items:center;gap:6px;color:var(--ds-text);font-size:9px}
.ds-shot__bar em{color:var(--ds-ink);font-style:normal;font-weight:700;text-align:right}
.ds-shot__bar i{display:block;height:6px;border-radius:9px;background:linear-gradient(90deg,var(--c) var(--v),var(--ds-bg-alt) var(--v))}
@media (max-width:1100px){.ds-stage{min-height:0;max-width:720px;display:grid;gap:44px;padding-top:24px}.ds-shot{position:relative;left:auto;right:auto;top:auto;width:100%}.ds-shot--employeur{width:86%;margin-left:auto}.ds-stage__leaf--b{display:none}.ds-stage__leaf--a{left:0}.ds-stage__leaf--c{right:0}.ds-stage__script{position:static;order:-2;margin:0 0 -18px;transform:none;text-align:left}.ds-stage__script::after{margin:2px auto 0 0;width:40%}.ds-shot--salarie{order:-1}}
@media (max-width:560px){.ds-shot--employeur{width:100%}.ds-stage__leaf--a,.ds-stage__leaf--c{width:84px}.ds-shot__nav{display:none}}
/* Bandeau des publics */
.ds-audience{padding:22px 0;border-block:1px solid var(--ds-border);background:#fff}
.ds-audience__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px}
.ds-audience p{color:var(--ds-muted);font-size:14px;font-weight:600}
.ds-audience ul{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
/* Accès public / salarié couvert : deux grandes cartes illustrées */
.ds-access{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:24px;align-items:stretch}
.ds-access__card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:10px 18px;overflow:hidden;padding:30px;border:1px solid var(--ds-sky-200);border-radius:24px;background:var(--ds-gradient-soft)}
.ds-access__card--plus{border:2px solid var(--ds-teal-700);background:linear-gradient(135deg,#F2FAFB 0%,#E4F2F6 100%);box-shadow:0 24px 60px rgba(11,107,120,.14)}
.ds-access__head{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.ds-access__head h3{font-size:clamp(1.4rem,1.2rem + .8vw,1.75rem);letter-spacing:-.025em}
.ds-access__sub{grid-column:1/-1;margin-top:-4px;color:var(--ds-text);font-size:16px}
.ds-access__body{display:flex;flex-direction:column;gap:18px;min-width:0}
.ds-access__art{align-self:end;justify-self:end;width:190px;height:auto}
.ds-access__foot{grid-column:1/-1;margin-top:4px}
@media (max-width:1100px){.ds-access{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.ds-access__card{grid-template-columns:minmax(0,1fr);padding:24px 20px}.ds-access__art{grid-row:3;justify-self:center;width:170px}}
.ds-statement{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:24px;padding:20px 26px;border-radius:20px;background:var(--ds-navy-800);color:#fff;font:700 clamp(1.05rem,.95rem + .5vw,1.3rem)/1.4 var(--ds-font-head);text-align:center}
.ds-statement .ds-i{width:26px;height:26px;color:var(--ds-teal-300)}
@media (max-width:560px){.ds-statement{flex-direction:column;padding:20px}}
/* Accompagnement humain */
.ds-human{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr) minmax(0,.8fr);gap:28px;align-items:center}
.ds-human__text .ds-h2{margin-bottom:18px}
.ds-human__text p+p{margin-top:12px}
.ds-signoff{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin-top:22px}
.ds-signoff .ds-script{font-size:30px;color:var(--ds-navy-800)}
.ds-signoff small{display:block;color:var(--ds-muted);font-size:13px;line-height:1.4}
.ds-signoff strong{display:block;color:var(--ds-ink);font-size:14.5px}
.ds-portrait{position:relative;isolation:isolate;padding:10px}
.ds-portrait__frame{position:relative;z-index:1;overflow:hidden;aspect-ratio:4/4.6;border-radius:24px;background:linear-gradient(145deg,#0d324f,#235d79 58%,#6349a8);box-shadow:var(--ds-shadow-lg)}
.ds-portrait__frame img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.ds-portrait .ds-leaf{z-index:0}
.ds-portrait__leaf-a{left:-18px;bottom:96px;width:110px;transform:rotate(-16deg)}
.ds-portrait__leaf-b{right:-18px;top:-18px;width:100px;transform:scaleX(-1) rotate(-14deg)}
/* V10.1 — photo entière (visage et buste dégagés) ; la citation passe sous la
   photo, décalée à droite, et ne recouvre plus que le bas de la veste. */
.ds-portrait__frame{aspect-ratio:900/990}
.ds-portrait__frame img{object-position:center top}
.ds-quote-card{position:relative;z-index:2;max-width:236px;margin:-40px -12px 0 auto;padding:14px 16px;border:1px solid var(--ds-border);border-radius:18px;background:#fff;box-shadow:var(--ds-shadow-md);color:var(--ds-ink);font-size:13.5px;line-height:1.55}
.ds-quote-card .ds-i{width:26px;height:26px;margin-bottom:4px;color:var(--ds-teal-700)}
.ds-quote-card footer{margin-top:10px;padding-top:10px;border-top:1px solid var(--ds-border);color:var(--ds-muted);font-size:12px}
.ds-quote-card footer b{display:block;color:var(--ds-ink);font-size:13px}
.ds-benefits{display:grid;gap:6px;padding:18px;border:1px solid var(--ds-sky-200);border-radius:22px;background:var(--ds-gradient-soft)}
.ds-benefit{display:flex;align-items:flex-start;gap:14px;padding:12px}
.ds-benefit h3{font-size:16px;letter-spacing:-.01em}
.ds-benefit p{margin-top:3px;color:var(--ds-text);font-size:14px;line-height:1.5}
@media (max-width:1100px){.ds-human{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ds-human__text{grid-column:1/-1}}
@media (max-width:700px){.ds-human{grid-template-columns:minmax(0,1fr)}.ds-portrait{max-width:420px;margin-inline:auto}.ds-portrait__leaf-a{left:0;width:74px}.ds-portrait__leaf-b{right:0;width:70px}.ds-quote-card{position:relative;right:auto;bottom:auto;max-width:none;margin:-28px 16px 0}}
.ds-relay{display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr);align-items:stretch;margin-top:36px}
.ds-relay__arrow{display:grid;place-items:center;color:var(--ds-violet-700)}
.ds-relay__arrow .ds-i{width:26px;height:26px}
.ds-relay .ds-card{gap:10px}
@media (max-width:760px){.ds-relay{grid-template-columns:minmax(0,1fr)}.ds-relay__arrow{padding:6px 0}.ds-relay__arrow .ds-i{transform:rotate(90deg)}}
/* Rangée trois colonnes : employeurs / offres / thématiques */
.ds-trio{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1.1fr);gap:22px;align-items:stretch}
.ds-trio__card{position:relative;display:flex;flex-direction:column;gap:14px;overflow:hidden;min-width:0;padding:26px;border:1px solid var(--ds-border);border-radius:22px;background:#fff;box-shadow:var(--ds-shadow-sm)}
.ds-trio__card--sky{border-color:var(--ds-sky-200);background:var(--ds-gradient-soft);box-shadow:none}
.ds-trio__card .ds-h3{font-size:clamp(1.2rem,1.05rem + .5vw,1.45rem);font-weight:800;letter-spacing:-.025em}
.ds-trio__card .ds-eyebrow{margin-bottom:0}
.ds-trio__foot{margin-top:auto}
.ds-chips{display:grid;gap:8px}
.ds-chip{display:inline-flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border:1px solid var(--ds-border);border-radius:var(--ds-r-pill);background:#fff;color:var(--ds-ink);font-size:13.5px;font-weight:600;box-shadow:var(--ds-shadow-xs);justify-self:start}
.ds-chip .ds-ico{width:28px;height:28px}
.ds-chip .ds-ico .ds-i{width:15px;height:15px}
.ds-themes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ds-theme{display:flex;align-items:center;gap:10px;min-height:44px;padding:8px 10px;border:1px solid var(--ds-border);border-radius:12px;background:#fff;color:var(--ds-ink);font-size:13.5px;font-weight:600;text-decoration:none;line-height:1.3}
.ds-theme:hover{border-color:var(--ds-teal-200);background:var(--ds-sky-50)}
.ds-theme .ds-ico{width:30px;height:30px;border-radius:9px}
.ds-theme .ds-ico .ds-i{width:16px;height:16px}
@media (max-width:1100px){.ds-trio{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-trio__card:last-child{grid-column:1/-1}}
@media (max-width:700px){.ds-trio{grid-template-columns:minmax(0,1fr)}}
@media (max-width:380px){.ds-themes{grid-template-columns:minmax(0,1fr)}}
/* Parcours en étapes */
.ds-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0;padding:0;list-style:none;counter-reset:ds-flow}
.ds-flow li{position:relative;padding:0 24px 0 0;counter-increment:ds-flow}
.ds-flow li::before{content:counter(ds-flow);display:grid;place-items:center;width:36px;height:36px;margin-bottom:14px;border-radius:50%;background:var(--ds-navy-800);color:#fff;font-size:14px;font-weight:700}
.ds-flow li::after{content:"";position:absolute;top:18px;left:48px;right:12px;height:2px;background:linear-gradient(90deg,var(--ds-teal-200),var(--ds-violet-200))}
.ds-flow li:last-child::after{display:none}
.ds-flow strong{display:block;margin-bottom:4px;color:var(--ds-ink);font-size:15.5px}
.ds-flow span{display:block;color:var(--ds-text);font-size:14.5px;line-height:1.55}
@media (max-width:900px){.ds-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.ds-flow li::after{display:none}}
@media (max-width:520px){.ds-flow{grid-template-columns:minmax(0,1fr);gap:20px}}
/* Démonstration concrète */
.ds-quote{display:flex;align-items:flex-start;gap:18px;max-width:880px;margin:0 auto 40px;padding:24px 28px;border:1px solid var(--ds-sky-200);border-radius:22px;background:var(--ds-gradient-soft)}
.ds-quote blockquote{margin:0;color:var(--ds-ink);font:600 clamp(1.1rem,1rem + .5vw,1.3rem)/1.5 var(--ds-font-head);letter-spacing:-.01em}
.ds-quote figcaption{margin-top:8px;color:var(--ds-muted);font-size:13.5px}
.ds-demo{display:grid;grid-template-columns:minmax(0,.85fr) 56px minmax(0,1.15fr);align-items:stretch}
.ds-demo__arrow{display:grid;place-items:center;color:var(--ds-teal-700)}
.ds-demo__arrow span{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--ds-border);border-radius:50%;background:#fff;box-shadow:var(--ds-shadow-sm)}
.ds-demo__card{display:flex;flex-direction:column;gap:18px;min-width:0;padding:28px;border:1px solid var(--ds-border);border-radius:24px;background:#fff}
.ds-demo__card--plus{border:2px solid var(--ds-teal-700);box-shadow:0 24px 60px rgba(11,107,120,.13)}
.ds-demo__block>h4{margin:0 0 10px;color:var(--ds-muted);font-family:var(--ds-font);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.ds-demo__links{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.ds-demo__links a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:10px 14px;border:1px solid var(--ds-border);border-radius:12px;background:var(--ds-sky-50);color:var(--ds-ink);font-size:14.5px;font-weight:600;text-decoration:none}
.ds-demo__links a:hover{border-color:var(--ds-teal-200);background:#fff}
.ds-demo__links .ds-i{width:17px;height:17px;color:var(--ds-teal-700)}
.ds-demo__prio{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.ds-demo__prio li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;color:var(--ds-ink);font-size:14.5px;font-weight:600;line-height:1.4}
.ds-demo__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:4px}
@media (max-width:980px){.ds-demo{grid-template-columns:minmax(0,1fr);gap:12px}.ds-demo__arrow span{transform:rotate(90deg)}}
@media (max-width:560px){.ds-demo__card{padding:22px 18px}.ds-quote{flex-direction:column;gap:12px;padding:22px 20px}}
/* Vitrines des espaces */
.ds-showcase__features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:32px;padding:0;list-style:none}
.ds-showcase__features li{display:flex;align-items:flex-start;gap:14px;min-width:0}
.ds-showcase__features strong{display:block;color:var(--ds-ink);font-size:15px;line-height:1.35}
.ds-showcase__features li>div>span{display:block;margin-top:2px;color:var(--ds-text);font-size:14px;line-height:1.5}
@media (max-width:1024px){.ds-showcase__features{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.ds-showcase__features{grid-template-columns:minmax(0,1fr)}}
.ds-callout{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border:1px solid var(--ds-sky-200);border-radius:var(--ds-r-pill);background:var(--ds-sky-50);color:var(--ds-navy-800);font-size:14px;font-weight:700}
.ds-callout .ds-i{width:18px;height:18px}
.ds-callout--strong{border-color:transparent;background:var(--ds-navy-800);color:#fff}
.ds-callout--strong .ds-i{color:var(--ds-teal-300)}
/* Pourquoi externaliser */
.ds-why{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:24px;align-items:start}
.ds-why__benefits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ds-why__for{display:grid;gap:12px}
.ds-why__for a{display:flex;align-items:center;gap:14px;min-height:44px;padding:16px 18px;border:1px solid var(--ds-border);border-radius:16px;background:#fff;color:var(--ds-ink);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.ds-why__for a:hover{border-color:var(--ds-teal-200);box-shadow:var(--ds-shadow-sm)}
.ds-why__for strong{display:block;font-size:15.5px}
.ds-why__for small{display:block;color:var(--ds-muted);font-size:13.5px;line-height:1.45}
.ds-why__for a>.ds-i{margin-left:auto;width:18px;height:18px;color:var(--ds-teal-700)}
@media (max-width:1024px){.ds-why{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.ds-why__benefits{grid-template-columns:minmax(0,1fr)}}
/* Bandeau d'appel final (référence : carte claire + trois atouts) */
.ds-ctabar{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px 40px;align-items:center;overflow:hidden;padding:clamp(28px,2rem + 2vw,48px);border:1px solid var(--ds-sky-200);border-radius:28px;background:linear-gradient(120deg,#F3F9FD 0%,#E6F1F9 55%,#E4F2F3 100%)}
.ds-ctabar .ds-h2{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem)}
.ds-ctabar p{margin-top:10px;color:var(--ds-text)}
.ds-ctabar .ds-hero__ctas{margin-top:22px}
.ds-ctabar__perks{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.ds-ctabar__perks li{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--ds-border);border-radius:16px;background:#fff;color:var(--ds-ink);font-size:14.5px;font-weight:600}
.ds-ctabar__perks li small{display:block;color:var(--ds-muted);font-size:13px;font-weight:500}
.ds-ctabar__meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:18px;font-size:14px}
.ds-ctabar__meta a{color:var(--ds-teal-700);font-weight:600}
@media (max-width:900px){.ds-ctabar{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.ds-ctabar{border-radius:22px}.ds-ctabar .ds-btn{width:100%}}

/* 17. ESPACE EMPLOYEUR (tableau de bord et connexion) ---------------------- */
.emp-page{background:var(--ds-bg);color:var(--ds-ink);font-family:var(--ds-font)}
.emp-page .top{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px;padding:10px 24px;border-bottom:1px solid var(--ds-border);background:#fff;color:var(--ds-ink)}
.top-brand{display:flex;align-items:center;gap:18px;min-width:0}
.top-brand img{display:block;width:auto;height:38px}
.top-company{display:inline-flex;align-items:center;gap:10px;min-width:0;color:var(--ds-ink);font-size:14.5px;font-weight:600}
.top-company span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.emp-page .top button{flex:0 0 auto;min-height:44px;padding:9px 16px;border:1.5px solid var(--ds-sky-300);border-radius:11px;background:#fff;color:var(--ds-ink);font:600 14.5px var(--ds-font);cursor:pointer}
.emp-page .top button:hover{border-color:var(--ds-teal-700);color:var(--ds-teal-700)}
.emp-page .wrap{max-width:1240px;margin:auto;padding:28px 24px 56px}
.emp-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.9fr);gap:24px;align-items:stretch;margin-bottom:24px}
.emp-hero-main{position:relative;overflow:hidden;padding:22px 24px;border:1px solid var(--ds-sky-200);border-radius:20px;background:var(--ds-gradient-soft)}
.emp-hero-main::after{content:"";position:absolute;right:-18px;bottom:-40px;width:110px;height:190px;background:var(--ds-sprig) center/contain no-repeat;opacity:.55;transform:scaleX(-1) rotate(-10deg);pointer-events:none}
.emp-eyebrow{color:var(--ds-teal-700);font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.emp-hero h1{position:relative;z-index:1;margin:8px 0;color:var(--ds-ink);font:800 clamp(26px,1.2rem + 1.6vw,36px)/1.12 var(--ds-font-head);letter-spacing:-.03em}
.emp-hero p{position:relative;z-index:1;color:var(--ds-text)}
.emp-privacy{display:flex;align-items:flex-start;gap:14px;padding:22px;border:1px solid var(--ds-teal-200);border-radius:20px;background:linear-gradient(135deg,var(--ds-teal-50),#F4FBFA)}
.emp-privacy .lock{display:grid;place-items:center;flex:0 0 auto;width:50px;height:50px;border-radius:50%;background:var(--ds-teal-700);color:#fff;box-shadow:0 8px 20px rgba(11,107,120,.22)}
.emp-privacy .lock .ds-i{width:22px;height:22px}
.emp-privacy strong{display:block;margin-bottom:4px;color:var(--ds-ink);font-size:16px}
.emp-privacy p{margin:0;font-size:14.5px;line-height:1.55}
.emp-page .tabs{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:22px;border-bottom:1px solid var(--ds-border)}
.emp-page .tab-btn{min-height:46px;margin-bottom:-1px;padding:12px 14px;border:0;border-bottom:2px solid transparent;background:none;color:var(--ds-text);font:600 14.5px var(--ds-font);cursor:pointer}
.emp-page .tab-btn:hover{color:var(--ds-ink)}
.emp-page .tab-btn[aria-selected="true"]{border-bottom-color:var(--ds-teal-700);color:var(--ds-teal-700)}
.emp-page .tabpanel{display:none}
.emp-page .tabpanel.active{display:block}
.emp-page .period{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.emp-page .period button{min-height:40px;padding:8px 14px;border:1px solid var(--ds-border-strong);border-radius:999px;background:#fff;color:var(--ds-ink);font:600 14px var(--ds-font);cursor:pointer}
.emp-page .period button.active{border-color:var(--ds-teal-700);background:var(--ds-teal-700);color:#fff}
.emp-page .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.emp-page .kpi,.emp-page .card{min-width:0;padding:20px;border:1px solid var(--ds-border);border-radius:18px;background:#fff;box-shadow:var(--ds-shadow-xs)}
.emp-page .kpi{display:flex;align-items:flex-start;gap:14px}
.kpi-label{display:block;color:var(--ds-text);font-size:13.5px;font-weight:600;line-height:1.35}
.emp-page .kpi strong{display:block;margin-top:6px;color:var(--ds-ink);font:800 30px/1.05 var(--ds-font-head);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.emp-page .cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:16px}
.emp-page .card h2{margin-bottom:14px;color:var(--ds-ink);font:700 17px/1.3 var(--ds-font-head)}
.emp-page .bars{display:grid;gap:12px}
.emp-page .barrow{display:grid;grid-template-columns:minmax(120px,1fr) 2fr 42px;align-items:center;gap:10px;color:var(--ds-ink);font-size:13.5px;font-weight:600}
.emp-page .barrow b{text-align:right}
.emp-page .bar{height:10px;overflow:hidden;border-radius:99px;background:var(--ds-bg-alt)}
.emp-page .bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--ds-teal-700),var(--ds-sky-500))}
.emp-page .privacy{margin-top:16px;padding:12px 14px;border:1px solid var(--ds-teal-200);border-radius:12px;background:var(--ds-teal-50);color:var(--ds-text);font-size:13px}
.emp-page .reco{margin:10px 0;padding:12px 14px;border-left:4px solid var(--ds-teal-500);border-radius:12px;background:var(--ds-bg)}
.emp-page .error{display:none;margin-bottom:16px;padding:14px 16px;border:1px solid var(--ds-danger-line);border-radius:14px;background:var(--ds-danger-bg);color:var(--ds-danger-ink)}
.emp-page .synthesis{margin-bottom:18px;padding:20px 22px;border:1px solid var(--ds-sky-200);border-radius:16px;background:linear-gradient(135deg,var(--ds-sky-50),var(--ds-violet-50));color:var(--ds-ink);font-size:15px;line-height:1.65}
.emp-page .synthesis strong{color:var(--ds-teal-700)}
.emp-page .rule-note{margin-top:10px;color:var(--ds-muted);font-size:12.5px}
.emp-page .doc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.emp-page .doc-card{display:flex;flex-direction:column;gap:8px;min-width:0;padding:18px;border:1px solid var(--ds-border);border-radius:16px;background:#fff}
.emp-page .doc-card .ico{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--ds-sky-100);color:var(--ds-teal-700);font-size:22px}
.emp-page .doc-card .ico .ds-i{width:22px;height:22px}
.emp-page .doc-card h3{margin:0;color:var(--ds-ink);font-size:15.5px}
.emp-page .doc-card p{flex:1;margin:0;color:var(--ds-muted);font-size:13.5px}
.emp-page .doc-card-link{color:inherit;text-decoration:none;transition:transform .15s,box-shadow .15s,border-color .15s}
.emp-page .doc-card-link:hover{border-color:var(--ds-teal-200);box-shadow:var(--ds-shadow-md);transform:translateY(-2px)}
.emp-page .doc-status{align-self:flex-start;padding:4px 10px;border-radius:999px;background:var(--ds-bg-alt);color:var(--ds-muted);font-size:12px;font-weight:700}
.emp-page .doc-status.ready{background:var(--ds-success-bg);color:var(--ds-success)}
.emp-page .rdv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.emp-page .rdv-card{padding:20px;border:1px solid var(--ds-border);border-radius:16px;background:#fff}
.emp-page .rdv-card h3{margin-bottom:6px;color:var(--ds-ink);font-size:16px}
.emp-page .rdv-card p{margin-bottom:14px;color:var(--ds-muted);font-size:14px}
.emp-page .rdv-empty{margin-top:14px;padding:20px;border:1px dashed var(--ds-border-strong);border-radius:16px;background:#fff;color:var(--ds-muted);font-size:14px}
.emp-page .offer-empty{padding:24px;border:1px dashed var(--ds-border-strong);border-radius:16px;background:var(--ds-bg);color:var(--ds-muted);font-size:14px;text-align:center}
.emp-page .progress{height:10px;margin:10px 0;overflow:hidden;border-radius:99px;background:var(--ds-bg-alt)}
.emp-page .progress i{display:block;height:100%;background:var(--ds-teal-700)}
.emp-page .card .btn-outline{min-height:44px}
.emp-muted{color:var(--ds-muted);font-size:14px}
.emp-muted--mb{margin-bottom:16px}
.emp-card-gap{margin-bottom:18px}
.emp-card-gap-sm{margin-bottom:14px}
.emp-mt{margin-top:16px}
.emp-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.emp-row h2{margin:0!important}
/* V10.1 — fonctionnalités non encore actives : même traitement partout
   (cartes de communication, export PDF) ; offre sans données. */
.emp-page .doc-status--soon{display:inline-flex;align-items:center;gap:6px;border:1px dashed var(--ds-border-strong);background:var(--ds-bg);color:var(--ds-muted);white-space:nowrap}
.emp-page .doc-status--soon .ds-i{width:14px;height:14px}
.emp-page .doc-card--soon{border-style:dashed;background:var(--ds-bg)}
.emp-page .doc-card--soon .ico{background:#fff;color:var(--ds-muted)}
.emp-page .btn[disabled],.emp-page .btn[disabled]:hover{border:1.5px dashed var(--ds-border-strong);background:var(--ds-bg);color:var(--ds-muted);box-shadow:none;cursor:not-allowed;transform:none}
.emp-soon{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.emp-page .offer-empty{display:grid;justify-items:center;gap:12px}
.emp-page .offer-empty p{max-width:560px;margin:0;line-height:1.6}
.emp-page .offer-empty .ds-ico{background:#fff}
/* V10.4 — installation de l'application : l'attribut hidden l'emporte toujours
   (style.css donne display:inline-block aux .btn). */
[data-pwa-install][hidden],[data-pwa-when][hidden],[data-pwa-install-button][hidden]{display:none!important}
/* V10.4 — installation de l'application, note « données partielles » de l'offre */
.emp-page .emp-install{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 18px}
.emp-page .emp-install[hidden]{display:none}
.emp-page .emp-install h2{margin-bottom:4px}
.emp-page .offer-note{margin-top:14px}
.emp-contact-line{margin-bottom:8px}
.emp-contact-line--last{margin-bottom:16px}
@media(max-width:980px){.emp-hero{grid-template-columns:minmax(0,1fr)}.emp-page .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.emp-page .cols{grid-template-columns:minmax(0,1fr)}.emp-page .doc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.emp-page .rdv-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.emp-page .top{padding:10px 16px}.top-brand img{display:none}.emp-page .wrap{padding:20px 16px 48px}.emp-page .tabs{flex-wrap:nowrap;overflow-x:auto}.emp-page .tab-btn{white-space:nowrap}.emp-page .barrow{grid-template-columns:minmax(0,1fr) 42px}.emp-page .barrow .bar{grid-column:1/-1;grid-row:2}.emp-page .grid{gap:12px}.emp-page .kpi{flex-direction:column;gap:10px;padding:16px}.emp-page .kpi strong{font-size:26px}}
@media(max-width:480px){.emp-page .doc-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:340px){.emp-page .grid{grid-template-columns:minmax(0,1fr)}}
/* Connexion (salarié et employeur) : page centrée, feuillage discret */
.auth-page{position:relative;display:grid;min-height:100vh;place-items:center;overflow-x:hidden;padding:24px;background:radial-gradient(900px 480px at 100% 0%,rgba(122,92,240,.09),transparent 62%),radial-gradient(800px 480px at 0% 100%,rgba(26,180,197,.12),transparent 60%),var(--ds-bg);color:var(--ds-ink);font-family:var(--ds-font)}
.auth-page::before,.auth-page::after{content:"";position:fixed;z-index:0;width:170px;height:290px;background:var(--ds-sprig) center/contain no-repeat;opacity:.55;pointer-events:none}
.auth-page::before{left:-30px;bottom:-30px;transform:rotate(-12deg)}
.auth-page::after{right:-30px;top:40px;transform:scaleX(-1) rotate(-14deg)}
.auth-page>*{position:relative;z-index:1}
.auth-page .login-card{width:min(560px,100%);padding:40px;border:1px solid var(--ds-border);border-radius:26px;background:#fff;box-shadow:var(--ds-shadow-lg)}
.auth-page .brand{display:block;text-align:center}
.auth-page .brand img{display:inline-block;width:auto;max-width:100%;height:48px;margin-bottom:18px;object-fit:contain}
.auth-page .brand .secure-lock{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 14px;border-radius:50%;background:var(--ds-teal-700);color:#fff;box-shadow:0 8px 20px rgba(11,107,120,.22)}
.auth-page .brand .secure-lock .ds-i{width:26px;height:26px}
.auth-page .secure{display:inline-flex;align-items:center;gap:7px;margin-bottom:14px;color:var(--ds-teal-700);font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.auth-page .login-card h1{margin:0 0 12px;color:var(--ds-ink);font:800 30px/1.15 var(--ds-font-head);letter-spacing:-.025em;text-align:center}
.auth-page .intro{color:var(--ds-muted);line-height:1.65;text-align:center}
.auth-page .privacy-note{display:flex;align-items:flex-start;gap:12px;margin-top:18px;padding:14px 16px;border:1px solid var(--ds-sky-200);border-radius:16px;background:var(--ds-gradient-soft);color:var(--ds-ink);font-size:14px;line-height:1.55;text-align:left}
.auth-page .privacy-note .ds-i{width:20px;height:20px;margin-top:1px;color:var(--ds-teal-700)}
.auth-page .auth-panel{margin-top:24px}
.auth-page .auth-panel[hidden]{display:none}
.auth-page .field{display:grid;gap:6px;margin:14px 0}
.auth-page .field label{color:var(--ds-ink);font-size:14.5px;font-weight:600}
.auth-page .field input{box-sizing:border-box;width:100%;min-height:48px;padding:12px 14px;border:1.5px solid var(--ds-border-input);border-radius:12px;font:16px var(--ds-font)}
.auth-page .field input:focus{border-color:var(--ds-teal-700);outline:none;box-shadow:0 0 0 4px rgba(11,107,120,.16)}
.auth-page .btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin-top:10px;padding:13px 18px;border:1.5px solid transparent;border-radius:12px;background:var(--ds-teal-700);color:#fff;font:600 15.5px var(--ds-font);cursor:pointer}
.auth-page .btn:hover{background:var(--ds-teal-800);transform:none;box-shadow:none}
.auth-page .btn.secondary{border-color:var(--ds-border-strong);background:#fff;color:var(--ds-ink)}
.auth-page .btn.secondary:hover{border-color:var(--ds-teal-700);color:var(--ds-teal-700)}
.auth-page .btn:disabled{opacity:.55;cursor:not-allowed}
.auth-page .linkbtn{min-height:44px;padding:8px;border:0;background:transparent;color:var(--ds-teal-700);font:600 14.5px var(--ds-font);text-decoration:underline;cursor:pointer}
.auth-page .actions{margin-top:12px;text-align:center}
.auth-page .status{margin:18px 0 0;padding:12px 14px;border-radius:12px;font-size:14px;line-height:1.5}
.auth-page .status[hidden]{display:none}
.auth-page .status.info{border:1px solid var(--ds-info-line);background:var(--ds-info-bg);color:var(--ds-info-ink)}
.auth-page .status.success{border:1px solid var(--ds-success-line);background:var(--ds-success-bg);color:var(--ds-success-ink)}
.auth-page .status.error{border:1px solid var(--ds-danger-line);background:var(--ds-danger-bg);color:var(--ds-danger-ink)}
.auth-page .note{margin-top:22px;padding-top:20px;border-top:1px solid var(--ds-border);color:var(--ds-muted);font-size:13px;text-align:center}
.auth-page .note a,.auth-page .intro a{color:var(--ds-teal-700)}
.auth-page .back{display:block;margin-top:14px;color:var(--ds-teal-700);font-size:14px;font-weight:600;text-align:center;text-decoration:none}
.auth-page .back:hover{text-decoration:underline}
.auth-page .password-hint{margin-top:4px;color:var(--ds-muted);font-size:13px}
.auth-block-link{display:block;text-align:center;text-decoration:none}
@media (max-width:480px){.auth-page{padding:16px}.auth-page .login-card{padding:28px 20px}.auth-page .login-card h1{font-size:26px}.auth-page::before,.auth-page::after{opacity:.3}}

/* 18. PAGES RESSOURCES EMPLOYEUR (documents, FAQ, guide, présentation) ----- */
.emp-doc{background:var(--ds-bg)!important;color:var(--ds-ink)!important;font-family:var(--ds-font)}
.emp-doc .top{min-height:64px;padding:10px 24px;border-bottom:1px solid var(--ds-border);background:#fff;color:var(--ds-ink)}
.emp-doc .top a{display:inline-flex;align-items:center;min-height:44px;color:var(--ds-ink);font-weight:600}
.emp-doc .top a:last-child{padding:0 14px;border:1.5px solid var(--ds-sky-300);border-radius:11px}
.emp-doc .top a:last-child:hover{border-color:var(--ds-teal-700);color:var(--ds-teal-700)}
.emp-doc .wrap{max-width:1040px}
.emp-doc .breadcrumb{color:var(--ds-muted);font-size:13.5px}
.emp-doc .breadcrumb a{color:var(--ds-teal-700);font-weight:600}
.emp-doc .hero{position:relative;overflow:hidden;padding:30px;border:1px solid var(--ds-sky-200);border-radius:24px;background:var(--ds-gradient-soft);color:var(--ds-ink)}
.emp-doc .hero::after{content:"";position:absolute;right:-16px;bottom:-40px;width:120px;height:200px;background:var(--ds-sprig) center/contain no-repeat;opacity:.55;transform:scaleX(-1) rotate(-10deg);pointer-events:none}
.emp-doc .hero .eyebrow{color:var(--ds-teal-700);font-size:12.5px;font-weight:700;letter-spacing:.12em}
.emp-doc .hero h1{color:var(--ds-ink);font:800 clamp(26px,1.2rem + 1.6vw,36px)/1.15 var(--ds-font-head);letter-spacing:-.03em}
.emp-doc .hero p{position:relative;z-index:1;color:var(--ds-text)}
.emp-doc .card{border-color:var(--ds-border);border-radius:20px;box-shadow:var(--ds-shadow-xs)}
.emp-doc .card h2{color:var(--ds-ink);font-family:var(--ds-font-head);letter-spacing:-.015em}
.emp-doc .card p,.emp-doc .card li{color:var(--ds-text)}
.emp-doc .mini{border-color:var(--ds-border);border-radius:16px;background:var(--ds-sky-50)}
.emp-doc .step{border-color:var(--ds-border);border-radius:16px}
.emp-doc .step:before{background:var(--ds-teal-700)}
.emp-doc .notice{border-color:var(--ds-teal-200);border-radius:16px;background:var(--ds-teal-50);color:var(--ds-ink)}
.emp-doc .faq summary{display:flex;align-items:center;min-height:44px;color:var(--ds-ink);font-weight:650}
.emp-doc .btnx{min-height:48px;padding:12px 18px;border-color:var(--ds-border-strong);font-weight:600}
.emp-doc .btnx.primary{background:var(--ds-teal-700);color:#fff}
.emp-doc .btnx.primary:hover{background:var(--ds-teal-800)}
.emp-doc .btnx.secondary:hover{border-color:var(--ds-teal-700);color:var(--ds-teal-700)}
.emp-doc .small{color:var(--ds-muted)}
@media(max-width:680px){.emp-doc .top{padding:8px 16px}.emp-doc .hero{padding:22px}}

/* 19. UTILITAIRES, ACCESSIBILITÉ, IMPRESSION ------------------------------- */
.ds-sr-only{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.ds-center{text-align:center}
.ds-mt-2{margin-top:8px}.ds-mt-4{margin-top:16px}.ds-mt-6{margin-top:24px}.ds-mt-8{margin-top:32px}.ds-mt-12{margin-top:48px}
.ds-mb-0{margin-bottom:0}
.ds-nowrap{white-space:nowrap}
@media (max-width:640px){.ds-hide-sm{display:none!important}}
@media (prefers-reduced-motion:reduce){
  html:has(.ds-page){scroll-behavior:auto}
  .ds-btn,.ds-card,.ds-link .ds-i,.ds-faq summary::after,.v72-resource-card{transition:none!important}
  .ds-btn:hover,a.ds-card:hover{transform:none}
}
@media print{
  .navbar,.skip-link,.ds-stage,.ds-leaf,.ds-hero__ctas{display:none!important}
  .ds-section,.ds-hero{padding-block:24px}
  .ds-section--dark,.footer{background:#fff!important;color:#000!important}
  .footer *{color:#000!important}
  .ds-card,.ds-panel,.ds-price{box-shadow:none;break-inside:avoid}
  .ds-foliage::after,.footer::before{display:none}
}

/* 20. COMPATIBILITÉ DES PAGES HISTORIQUES ----------------------------------
   Pages publiques et ressources : style.css (V7 → V8.5) reste chargé ; ce
   bloc réaligne ses variables et restyle ses classes dans le langage V10.
   Les nombreux styles inline des pages ressources utilisent ces variables :
   ils suivent donc automatiquement. */
:root{
  --turquoise:#17A3B1;
  --turquoise-dark:#0E8290;
  --turquoise-text:#0B6B78;
  --violet:#8A6CF2;
  --violet-text:#5B34C8;
  --dark-blue:#132B5E;
  --gray-700:#3D4B63;
  --gray-600:#3D4B63;
  --gray-400:#5A6880;
  --gray-200:#DDE8F0;
  --gray-100:#F3F8FB;
  --warning:#B26B00;
  --success:#067647;
  --info:#175CD3;
  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:20px;
  --radius-xl:28px;
  --shadow-sm:0 1px 2px rgba(19,43,94,.04),0 6px 18px rgba(19,43,94,.05);
  --shadow-md:0 2px 6px rgba(19,43,94,.05),0 16px 40px rgba(19,43,94,.08);
  --shadow-lg:0 4px 12px rgba(19,43,94,.06),0 30px 70px rgba(19,43,94,.13);
  --border:#DDE8F0;
  --cyan-soft:#EFF9F9;
  --navy:#0B2147;
  --ink:#132B5E;
}
body{font-family:var(--ds-font);color:var(--ds-ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3{font-family:var(--ds-font-head);color:var(--ds-ink);letter-spacing:-.022em}
h1,h2{font-weight:800}
h4{font-family:var(--ds-font-head)}
a:where(:not([class])){color:var(--ds-teal-700);text-underline-offset:2px}
a:where(:not([class])):hover{color:var(--ds-teal-800)}
.container{max-width:1152px}
@media (min-width:769px){.section{padding:72px 0}}
.section-gray{background:var(--ds-bg)}
.lead,.subtitle{color:var(--ds-text)}
.text-turquoise{color:var(--ds-teal-700)}
/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border:1.5px solid transparent;border-radius:12px;font-family:var(--ds-font);font-size:15.5px;font-weight:600;line-height:1.2;text-align:center;transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}
.btn-primary{background:var(--ds-teal-700);color:#fff}
.btn-primary:hover{background:var(--ds-teal-800);color:#fff;transform:translateY(-1px);box-shadow:0 10px 24px rgba(11,107,120,.22)}
.btn-outline{border:1.5px solid var(--ds-sky-300);background:#fff;color:var(--ds-navy-800)}
.btn-outline:hover{border-color:var(--ds-teal-700);background:var(--ds-sky-50);color:var(--ds-teal-700);box-shadow:var(--ds-shadow-sm)}
.btn-lg{min-height:56px;padding:15px 26px;border-radius:13px;font-size:16.5px}
.btn-sm{min-height:44px;padding:10px 16px;border-radius:11px;font-size:14.5px}
.btn[disabled]{transform:none;box-shadow:none}
.btn-outline.v749-dark-btn,.v7-dark .btn-outline,.v82-assistant-highlight .btn-outline{border-color:rgba(255,255,255,.55);background:transparent;color:#fff}
.btn-outline.v749-dark-btn:hover,.v7-dark .btn-outline:hover,.v82-assistant-highlight .btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.1);color:#fff;box-shadow:none}
@media (max-width:480px){.btn{padding:12px 18px;font-size:15px}}
/* Cartes, badges, listes */
.card{border:1px solid var(--ds-border);border-radius:20px;background:#fff;box-shadow:var(--ds-shadow-sm)}
.card-accent{border-left:4px solid var(--ds-teal-500)}
.card h3,.card h4{color:var(--ds-ink)}
.section-gray .card{background:#fff}
.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:var(--ds-sky-100);color:var(--ds-navy-800);font-size:13px;font-weight:700}
ul.check-list li{padding-left:32px;color:var(--ds-text)}
ul.check-list li::before{content:"";top:2px;width:21px;height:21px;border-radius:50%;background:var(--ds-teal-700) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat}
.v7-dark ul.check-list li,.v749-conf-grid ul.check-list li{color:#D8E3EE}
.v749-boundary-card ul.check-list li{color:var(--ds-text)}
/* Alertes */
.alert{border:1px solid var(--ds-border);border-radius:16px}
.alert-info{border-color:var(--ds-info-line);border-left:4px solid var(--ds-info);background:var(--ds-info-bg);color:var(--ds-info-ink)}
.alert-warning{border-color:var(--ds-warning-line);border-left:4px solid #B26B00;background:var(--ds-warning-bg);color:var(--ds-warning-ink)}
/* Formulaires */
.form-group label{color:var(--ds-ink)}
.form-group input,.form-group select,.form-group textarea{min-height:48px;border:1.5px solid var(--ds-border-input);border-radius:12px;background:#fff;color:var(--ds-ink);font-size:16px}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--ds-teal-700);box-shadow:0 0 0 4px rgba(11,107,120,.16)}
.v7-consent input{width:20px;height:20px;accent-color:var(--ds-teal-700)}
/* Tableaux */
table th{background:var(--ds-sky-50);color:var(--ds-ink);border-bottom:1px solid var(--ds-border-strong);font-weight:700}
table td{border-bottom:1px solid var(--ds-border);color:var(--ds-text)}
table tr:nth-child(even){background:#FAFCFE}
/* En-têtes de page : dégradé bleuté + feuillage discret (décor CSS) */
.hero,.v7-page-hero,.v7-hero,.v749-about-hero{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(900px 460px at 100% -10%,rgba(122,92,240,.08),transparent 62%),radial-gradient(760px 420px at 80% 120%,rgba(26,180,197,.10),transparent 60%),var(--ds-gradient-page)}
.hero::after,.v7-page-hero::after{content:"";position:absolute;z-index:-1;right:max(-10px,calc(50% - 700px));bottom:-44px;width:150px;height:254px;background:var(--ds-sprig) center/contain no-repeat;opacity:.75;transform:scaleX(-1) rotate(-12deg);pointer-events:none}
.hero::before,.v7-page-hero::before{content:"";position:absolute;z-index:-1;right:max(90px,calc(50% - 590px));top:-60px;width:110px;height:186px;background:var(--ds-sprig) center/contain no-repeat;opacity:.45;transform:rotate(160deg);pointer-events:none}
@media (max-width:900px){.hero::before,.v7-page-hero::before{display:none}.hero::after,.v7-page-hero::after{width:100px;height:170px;opacity:.45}}
.hero h1{font-size:var(--ds-fs-h1);line-height:1.08;letter-spacing:-.032em}
.v7-page-hero h1,.v7-hero h1,.v749-about-grid h1{font-size:var(--ds-fs-display);line-height:1.05;letter-spacing:-.035em}
.hero .lead,.v7-lead{color:var(--ds-text);font-size:var(--ds-fs-lead);line-height:1.65}
.v7-kicker,.seo-bridge-kicker{margin-bottom:14px;color:var(--ds-teal-700);font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.v7-kicker-light{color:var(--ds-teal-300)}
.v7-section-head h2,.v72-resources-head h2{font-size:var(--ds-fs-h2);line-height:1.12;letter-spacing:-.03em}
.v7-section-head p,.v72-resources-head p{color:var(--ds-text)}
.breadcrumbs-hero,.breadcrumbs-hero a{color:var(--ds-muted)}
.breadcrumbs-hero a:hover{color:var(--ds-teal-700)}
/* Composants V7 */
.v7-pill{background:var(--ds-sky-100);color:var(--ds-navy-800)}
.v7-hero-card{border-color:var(--ds-border);border-radius:24px;box-shadow:var(--ds-shadow-lg)}
.v7-logo-strip span,.v7-chips span{border-color:var(--ds-border);color:var(--ds-ink)}
.v7-problem>span{background:var(--ds-violet-100);color:var(--ds-violet-700)}
.v7-steps article{border-color:var(--ds-border);border-radius:20px;background:#fff;box-shadow:var(--ds-shadow-sm)}
.v7-steps article>div{background:var(--ds-teal-700)}
.v7-dark{background:radial-gradient(800px 420px at 100% 0%,rgba(122,92,240,.22),transparent 65%),radial-gradient(700px 420px at 0% 100%,rgba(26,180,197,.16),transparent 60%),var(--ds-navy-900)}
.v7-dark p{color:#C9D5E4}
.v7-cta-card,.v749-boundary-card{border-radius:24px}
.v7-price-card{border-color:var(--ds-border);border-radius:24px;box-shadow:var(--ds-shadow-sm)}
.v7-price-card.featured{border:2px solid var(--ds-teal-700);background:linear-gradient(180deg,#F1FAFB 0%,#fff 40%);box-shadow:0 24px 60px rgba(11,107,120,.16)}
.v7-price-head>span{color:var(--ds-teal-700)}
.v7-ribbon{background:var(--ds-gradient-ink)}
.v7-price{flex-wrap:wrap;padding:16px 18px;border-radius:16px;background:var(--ds-sky-50)}
.v7-price-card.featured .v7-price{background:var(--ds-navy-800)}
.v7-price-card.featured .v7-price strong{color:#fff}
.v7-price-card.featured .v7-price span{color:#C9D5E4}
.v7-price strong{color:var(--ds-ink);font-family:var(--ds-font-head);font-size:clamp(34px,1.8rem + 1vw,44px);letter-spacing:-.035em}
.v7-price-from{width:100%;color:var(--ds-muted);font-size:13.5px;font-weight:600}
.v7-price-head h2,.v7-price-head h3{font-size:23px;line-height:1.2;letter-spacing:-.02em}
.v7-faq details{border-color:var(--ds-border);border-radius:16px;box-shadow:var(--ds-shadow-xs)}
.v7-faq details[open]{border-color:var(--ds-sky-300)}
.v7-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--ds-ink);font-weight:650;list-style:none}
.v7-faq summary::-webkit-details-marker{display:none}
.v7-faq summary::after{content:"";flex:0 0 auto;width:24px;height:24px;border-radius:50%;background:var(--ds-teal-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B6B78' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .2s}
.v7-faq details[open] summary::after{transform:rotate(45deg)}
.v7-final{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(120deg,#F3F9FD 0%,#E6F1F9 55%,#E4F2F3 100%)}
.v7-final::after{content:"";position:absolute;z-index:-1;right:4%;bottom:-40px;width:130px;height:220px;background:var(--ds-sprig) center/contain no-repeat;opacity:.6;transform:scaleX(-1) rotate(-10deg)}
.v7-final h2{font-size:var(--ds-fs-h2);line-height:1.12;letter-spacing:-.03em}
.v7-form-card{border-radius:24px}
.v7-thanks-icon{background:var(--ds-success-bg);color:var(--ds-success)}
.v7-thanks .container{width:100%}
.v7-thanks h1{font-size:var(--ds-fs-h1);letter-spacing:-.03em}
@media (max-width:480px){.v7-thanks .card{padding:32px 20px}}
.v7-avatar{background:var(--ds-gradient-ink)}
/* Ressources, ponts SEO, assistant */
.v72-resources{background:var(--ds-gradient-page);border-bottom-color:var(--ds-border)}
.v72-resource-card{border-color:var(--ds-border);border-radius:20px;box-shadow:var(--ds-shadow-sm)}
.v72-resource-card:hover{border-color:var(--ds-teal-200);box-shadow:var(--ds-shadow-md)}
.v72-resource-card>span{border-radius:14px;background:var(--ds-sky-100);color:var(--ds-teal-700)}
.seo-resource-bridge{background:var(--ds-bg);border-top-color:var(--ds-border)}
.seo-bridge-card{border-color:var(--ds-sky-200);border-radius:22px;background:var(--ds-gradient-soft);box-shadow:none}
.seo-bridge-links a{border-color:var(--ds-border);border-radius:12px;background:#fff;color:var(--ds-ink)}
.seo-bridge-links a:hover{border-color:var(--ds-teal-200);color:var(--ds-teal-700)}
.v82-assistant-highlight{background:radial-gradient(800px 420px at 100% 0%,rgba(122,92,240,.28),transparent 65%),radial-gradient(700px 420px at 0% 100%,rgba(26,180,197,.18),transparent 60%),var(--ds-navy-900)}
.v82-assistant-highlight .v7-kicker{color:var(--ds-teal-300)}
.v82-assistant-preview{border-radius:24px}
.v82-chat-question{background:var(--ds-teal-700)}
.v82-chat-answer{border-color:var(--ds-sky-200);background:var(--ds-sky-50)}
.v82-resource-assistant-card{border-color:var(--ds-sky-200);border-radius:22px;background:var(--ds-gradient-soft)}
.v82-resource-assistant-icon{background:var(--ds-gradient-ink)}
/* Page « Qui suis-je ? » */
.v749-identity-card{border-color:var(--ds-border);border-radius:26px;box-shadow:var(--ds-shadow-lg)}
.v749-portrait-placeholder{border-radius:20px}
.v749-principles article{border-color:var(--ds-sky-200);border-radius:18px;background:var(--ds-gradient-soft);box-shadow:none}
.v749-founder{border-radius:24px}

/* 21. PROFONDEUR, 3D LÉGÈRE ET PHOTOGRAPHIES (V10.2) ------------------------
   Niveau 1 (CSS 3D) : plans superposés, perspective, élévation et inclinaison
   discrète au survol. Les effets liés à la souris n'existent qu'avec la classe
   .ds-depth-on, posée par depth.js (ordinateur, pointeur fin, aucune
   préférence « mouvement réduit »). Rien ne bouge en permanence et les textes
   principaux restent fixes. Sans JavaScript, sur mobile ou en mouvement
   réduit, la page statique est complète. */
:root{--ds-depth-shadow:0 1px 2px rgba(12,34,64,.05),0 22px 44px -18px rgba(12,34,64,.22);--ds-depth-shadow-hi:0 2px 6px rgba(12,34,64,.06),0 34px 70px -24px rgba(12,34,64,.30);--ds-ease-out:cubic-bezier(.22,.61,.36,1)}

/* 21.1 Élévation et inclinaison au survol ([data-tilt] = inclinaison max en degrés) */
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  [data-tilt]{transition:transform .45s var(--ds-ease-out),box-shadow .45s var(--ds-ease-out),border-color .2s}
  [data-tilt]:hover{--lift:-4px;transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(var(--lift));box-shadow:var(--ds-depth-shadow-hi)}
  .ds-depth-on [data-tilt]{transform-style:preserve-3d}
  [data-tilt] .ds-ico,[data-tilt] .ds-price__amount,[data-tilt] .v749-portrait-placeholder{transition:transform .45s var(--ds-ease-out)}
  .ds-depth-on [data-tilt]:hover .ds-ico{transform:translateZ(22px)}
  .ds-depth-on [data-tilt]:hover .ds-price__amount{transform:translateZ(16px)}
  .ds-depth-on [data-tilt]:hover .v749-portrait-placeholder{transform:translateZ(18px)}
  .ds-theme{transition:transform .25s var(--ds-ease-out),box-shadow .25s,border-color .2s,background .2s}
  .ds-theme:hover{transform:translateY(-2px);box-shadow:var(--ds-shadow-sm)}
  .ds-access__card{transition:transform .45s var(--ds-ease-out),box-shadow .45s var(--ds-ease-out)}
  .ds-access__card:hover{transform:translateY(-5px);box-shadow:var(--ds-depth-shadow-hi)}
  .ds-access__art{transition:transform .6s var(--ds-ease-out)}
  .ds-access__card:hover .ds-access__art{transform:translate3d(4px,-6px,0)}
  .ds-trio__photo img{transition:transform .8s var(--ds-ease-out)}
  .ds-trio__card:hover .ds-trio__photo img{transform:scale(1.03)}
}
/* Cartes mises en avant : légèrement avancées (salarié couvert, offre pilote) */
@media (min-width:1101px){
  .ds-access__card--plus{transform:translateY(-8px);box-shadow:0 30px 70px -22px rgba(11,107,120,.34),0 0 0 6px rgba(26,180,197,.07)}
}
@media (min-width:1101px) and (hover:hover) and (prefers-reduced-motion:no-preference){
  .ds-access__card--plus:hover{transform:translateY(-12px);box-shadow:0 38px 80px -24px rgba(11,107,120,.38),0 0 0 7px rgba(26,180,197,.09)}
}
@media (min-width:981px){
  .ds-price--featured{transform:translateY(-10px)}
  .ds-price--featured[data-tilt]:hover{--lift:-14px}
}

/* 21.2 Héros de l'accueil : scène en plans superposés (maquettes, badges,
   formes, objet signature). Sous 1101 px, la scène redevient la pile
   statique d'origine (display:contents). */
.ds-stage__scene{display:contents}
.ds-float,.ds-stage__blob,.ds-signature{display:none}
@media (min-width:1101px){
  .ds-stage{perspective:1700px;perspective-origin:45% 40%}
  .ds-stage__scene{--px:0;--py:0;position:absolute;inset:0;display:block;transform-style:preserve-3d;transform:rotateX(calc(3deg - var(--py) * 2.5deg)) rotateY(calc(-8deg + var(--px) * 4deg))}
  /* V10.4 : meilleur équilibre salarié / employeur ; le salarié reste au premier plan. */
  .ds-stage__scene>.ds-shot--employeur{width:43%;transform:translateZ(-60px)}
  .ds-stage__scene>.ds-shot--salarie{transform:translateZ(30px)}
  .ds-stage__scene .ds-browser{box-shadow:calc(var(--px) * -14px) calc(24px - var(--py) * 8px) 56px -18px rgba(12,34,64,.30),0 2px 6px rgba(12,34,64,.06)}
  .ds-stage__blob{position:absolute;display:block;border-radius:50%;pointer-events:none}
  .ds-stage__blob--a{left:4%;top:4%;width:360px;height:360px;background:radial-gradient(circle at 40% 40%,rgba(26,180,197,.20),rgba(26,180,197,0) 68%);transform:translateZ(-200px)}
  .ds-stage__blob--b{right:-6%;bottom:-8%;width:320px;height:320px;background:radial-gradient(circle at 55% 45%,rgba(122,92,240,.16),rgba(122,92,240,0) 68%);transform:translateZ(-160px)}
  .ds-stage__blob--c{left:52%;top:0;width:38px;height:38px;border-radius:12px;background:var(--ds-gradient-ink);opacity:.85;box-shadow:0 14px 26px -8px rgba(91,52,200,.45);transform:translateZ(120px) rotate(12deg)}
  .ds-float{position:absolute;z-index:6;display:inline-flex;align-items:center;gap:9px;padding:8px 14px 8px 8px;border:1px solid var(--ds-border);border-radius:var(--ds-r-pill);background:#fff;box-shadow:var(--ds-depth-shadow);color:var(--ds-ink);font:700 12.5px/1.2 var(--ds-font-head);white-space:nowrap}
  .ds-float .ds-ico{width:28px;height:28px}
  .ds-float .ds-ico .ds-i{width:15px;height:15px}
  .ds-float--plan{left:-30px;bottom:26px;transform:translateZ(110px)}
  .ds-float--data{right:24%;bottom:-8px;transform:translateZ(80px)}
  /* V10.4 : objet signature ~20 % plus discret (150×172 → 120×138). */
  .ds-signature{position:absolute;z-index:7;display:block;right:7%;bottom:-26px;width:120px;height:138px;pointer-events:none;transform:translateZ(130px)}
}
.ds-signature::after{content:"";position:absolute;left:24%;right:24%;bottom:8px;height:14px;border-radius:50%;background:radial-gradient(closest-side,rgba(12,34,64,.26),rgba(12,34,64,0));filter:blur(2px)}
/* Halo lumineux discret derrière le bouclier (palette de marque). */
.ds-signature::before{content:"";position:absolute;inset:-18% -22%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(26,180,197,.22),rgba(122,92,240,.10) 55%,rgba(122,92,240,0));pointer-events:none}
.ds-signature__svg{position:absolute;inset:8px 14px 14px;width:auto;height:auto;transition:opacity .6s}
.ds-signature canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .8s}
.ds-signature.is-webgl canvas{opacity:1}
.ds-signature.is-webgl .ds-signature__svg{opacity:0}
/* Parallaxe décorative (feuillages, formes) : décalage posé par depth.js */
.ds-depth-on [data-parallax]{translate:0 var(--par,0px)}

/* 21.3 Photographies (assets/img/unsplash ; crédits :
   documents/technique/credits-images.md). Cartes photo arrondies, fond
   dégradé décalé ; la marge interne évite tout débordement horizontal. */
.ds-photo{position:relative;isolation:isolate;min-width:0;margin:0;padding:0 16px 16px 0}
.ds-photo::before{content:"";position:absolute;z-index:0;inset:22px 0 0 22px;border-radius:26px;background:linear-gradient(135deg,var(--ds-teal-200) 0%,var(--ds-sky-200) 50%,var(--ds-violet-200) 100%);opacity:.8;transition:transform .6s var(--ds-ease-out)}
.ds-photo__frame{position:relative;z-index:1;overflow:hidden;aspect-ratio:var(--ds-photo-ratio,4/3);border-radius:24px;background:var(--ds-sky-100);box-shadow:var(--ds-depth-shadow)}
.ds-photo__frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--ds-photo-pos,center)}
.ds-photo__leaf{position:absolute;z-index:2;left:-34px;bottom:-18px;width:78px;height:132px;background:var(--ds-sprig) center/contain no-repeat;opacity:.9;transform:rotate(-16deg);pointer-events:none}
.ds-photo__note{position:absolute;z-index:3;left:16px;bottom:32px;display:inline-flex;align-items:center;gap:10px;max-width:calc(100% - 48px);padding:10px 14px 10px 10px;border:1px solid var(--ds-border);border-radius:16px;background:#fff;box-shadow:var(--ds-shadow-md);color:var(--ds-ink);font:700 13.5px/1.35 var(--ds-font-head)}
.ds-photo__note svg{flex:0 0 auto;width:30px;height:30px;padding:7px;border-radius:50%;background:var(--ds-teal-50);color:var(--ds-teal-700);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ds-photo__caption{position:relative;z-index:1;margin-top:10px;color:var(--ds-muted);font-size:13px;line-height:1.5}
/* Photo légendée : le fond décalé n'est placé que derrière l'image */
.ds-photo--captioned{padding:0}
.ds-photo--captioned::before{display:none}
.ds-photo__media{position:relative;isolation:isolate;padding:0 16px 16px 0}
.ds-photo__media::before{content:"";position:absolute;z-index:0;inset:22px 0 0 22px;border-radius:26px;background:linear-gradient(135deg,var(--ds-teal-200) 0%,var(--ds-sky-200) 50%,var(--ds-violet-200) 100%);opacity:.8;transition:transform .6s var(--ds-ease-out)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.ds-photo:hover::before,.ds-photo:hover .ds-photo__media::before{transform:translate3d(6px,6px,0)}}
/* En-tête de page avec photo latérale */
.ds-hero-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,4vw,64px);align-items:center}
.ds-hero-split>.ds-photo{justify-self:end;width:100%;max-width:520px}
@media (max-width:960px){.ds-hero-split{grid-template-columns:minmax(0,1fr)}.ds-hero-split>.ds-photo{justify-self:start;max-width:560px;--ds-photo-ratio:16/10}}
@media (max-width:560px){.ds-photo,.ds-photo__media{padding:0 10px 10px 0}.ds-photo--captioned{padding:0}.ds-photo::before,.ds-photo__media::before{inset:14px 0 0 14px}.ds-photo__leaf{display:none}.ds-photo__note{left:10px;bottom:20px;font-size:12.5px}}
/* Bandeau photo en tête de carte (accueil, carte employeurs) */
.ds-trio__photo{position:relative;margin:-26px -26px 2px;overflow:hidden;aspect-ratio:16/9;background:var(--ds-sky-100)}
.ds-trio__photo img{display:block;width:100%;height:100%;object-fit:cover}
/* Photo accompagnant une liste de cartes (tarifs, qui suis-je) */
.ds-included-split{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(28px,4vw,56px);align-items:center}
.ds-included-split .grid-3{grid-template-columns:minmax(0,1fr);gap:14px}
.ds-included-split .grid-3 .card{padding:20px 22px}
.ds-photo--inline{max-width:520px;margin-top:28px}
@media (max-width:900px){.ds-included-split{grid-template-columns:minmax(0,1fr)}.ds-included-split>.ds-photo{max-width:560px}}

/* 21.4 Mouvement réduit : tout est statique et à plat */
@media (prefers-reduced-motion:reduce){
  .ds-stage__scene,.ds-stage__scene>*,.ds-access__card--plus,.ds-price--featured,[data-tilt]{transform:none!important;transition:none!important}
  .ds-photo::before,.ds-photo__media::before,.ds-trio__photo img{transition:none!important}
  .ds-signature{bottom:-52px;right:2%}
}
@media print{.ds-float,.ds-stage__blob,.ds-signature,.ds-photo::before,.ds-photo__media::before,.ds-photo__leaf{display:none!important}}

/* V10.3 — fonctions employeur finalisées */
.emp-page .offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:8px}
.emp-page .offer-stat{padding:18px;border:1px solid var(--ds-border);border-radius:16px;background:var(--ds-bg)}
.emp-page .offer-stat span{display:block;color:var(--ds-muted);font-size:12.5px;font-weight:600}
.emp-page .offer-stat strong{display:block;margin-top:6px;color:var(--ds-ink);font:700 17px/1.3 var(--ds-font-head)}
.emp-page .offer-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.emp-dialog{width:min(680px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:0;border:0;border-radius:22px;background:#fff;box-shadow:0 26px 80px rgba(13,42,74,.22)}
.emp-dialog::backdrop{background:rgba(12,31,55,.48);backdrop-filter:blur(3px)}
.emp-dialog form{margin:0}
.emp-dialog__head,.emp-dialog__foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;border-bottom:1px solid var(--ds-border)}
.emp-dialog__foot{justify-content:flex-end;border-top:1px solid var(--ds-border);border-bottom:0}
.emp-dialog__head h2{margin:5px 0 0;color:var(--ds-ink);font:700 22px/1.2 var(--ds-font-head)}
.emp-dialog__close{width:42px;height:42px;border:0;border-radius:50%;background:var(--ds-bg);color:var(--ds-ink);font-size:28px;cursor:pointer}
.emp-dialog__body{display:grid;gap:16px;padding:22px;overflow:auto}
.emp-dialog label{display:grid;gap:7px;color:var(--ds-ink);font-size:13.5px;font-weight:650}
.emp-dialog input,.emp-dialog select,.emp-dialog textarea{width:100%;padding:12px 13px;border:1.5px solid var(--ds-border-strong);border-radius:11px;background:#fff;color:var(--ds-ink);font:400 15px var(--ds-font)}
.emp-dialog textarea{resize:vertical}
.emp-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.emp-check{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:10px!important;font-weight:500!important;line-height:1.45}
.emp-check input{width:auto;margin-top:3px}
.emp-form-status{min-height:0;padding:0;border-radius:10px;font-size:13.5px}
.emp-form-status.success,.emp-form-status.error{padding:11px 13px}
.emp-form-status.success{background:var(--ds-success-bg);color:var(--ds-success)}
.emp-form-status.error{background:var(--ds-danger-bg);color:var(--ds-danger-ink)}
.emp-kit{margin-top:18px}
.kit-preview{margin-top:18px;border:1px solid var(--ds-border);border-radius:18px;background:#fff;box-shadow:var(--ds-shadow-xs)}
.kit-affiche{max-width:760px;padding:42px;text-align:center;background:linear-gradient(145deg,#f7fcff,#effbf9)}
.kit-affiche>img{width:220px;height:auto;margin:auto}.kit-affiche .kicker{margin:26px 0 10px;color:var(--ds-teal-700);font-weight:800;letter-spacing:.08em}.kit-affiche h3{font:800 34px/1.08 var(--ds-font-head);color:var(--ds-ink)}
.kit-affiche ul{display:grid;gap:8px;margin:20px auto;max-width:420px;text-align:left}.kit-qr{display:grid;justify-items:center;gap:6px;margin-top:24px}.kit-qr img{width:150px;height:150px}.kit-qr small{color:var(--ds-muted)}
.kit-flyer{max-width:760px;padding:32px}.kit-flyer h3{font:800 28px/1.12 var(--ds-font-head);color:var(--ds-ink)}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.mini-grid div{padding:14px;border-radius:14px;background:var(--ds-bg)}.mini-grid b,.mini-grid span{display:block}.mini-grid span{margin-top:4px;color:var(--ds-muted);font-size:13px}
.copy-source{width:100%;margin:10px 0 12px;padding:16px;border:1px solid var(--ds-border);border-radius:14px;background:var(--ds-bg);color:var(--ds-ink);font:14px/1.6 var(--ds-font)}
.qr-download{display:flex;flex-wrap:wrap;align-items:center;gap:22px}.qr-download img{width:190px;height:190px;padding:10px;border:1px solid var(--ds-border);border-radius:16px;background:#fff}
@media(max-width:760px){.emp-page .offer-grid{grid-template-columns:1fr 1fr}.emp-form-grid{grid-template-columns:1fr}.kit-affiche{padding:28px 20px}.kit-affiche h3{font-size:28px}.mini-grid{grid-template-columns:1fr}}
@media(max-width:520px){.emp-page .offer-grid{grid-template-columns:1fr}.emp-dialog__head,.emp-dialog__body,.emp-dialog__foot{padding:16px}}
@media print{body[data-print="affiche"] .emp-doc .top,body[data-print="affiche"] .emp-doc .hero,body[data-print="affiche"] .emp-kit:not(#affiche),body[data-print="affiche"] #affiche>.emp-row{display:none!important}body[data-print="affiche"] #affiche{border:0;box-shadow:none;margin:0;padding:0}body[data-print="affiche"] .kit-affiche{max-width:none;min-height:260mm;border:0;box-shadow:none;display:flex;flex-direction:column;justify-content:center}body[data-print="flyer"] .emp-doc .top,body[data-print="flyer"] .emp-doc .hero,body[data-print="flyer"] .emp-kit:not(#flyer),body[data-print="flyer"] #flyer>.emp-row{display:none!important}body[data-print="flyer"] #flyer{border:0;box-shadow:none;margin:0;padding:0}body[data-print="flyer"] .kit-flyer{max-width:none;border:0;box-shadow:none}}

/* 22. FINITION GLOSSY / GLASS PREMIUM (V10.4) -------------------------------
   Lumière, profondeur et raffinement, sans nouvelle identité : le design V10
   reste dominant (environ 80 % de surfaces mates, 20 % glossy).
   Composants centralisés :
   - .gloss-light  : majorité des cartes premium (reflet supérieur, bordure
                     lumineuse fine, ombre douce) ;
   - .gloss-medium : cartes importantes (ajoute une ombre colorée de marque) ;
   - .gloss-strong : héros et éléments signature uniquement (halo) ;
   - .gloss-sheen  : reflet lent au survol, sur quelques cartes majeures ;
   - .gloss-glass  : verre dépoli (translucidité + flou modéré), réservé aux
                     petits badges posés sur des fonds colorés.
   Le reflet est peint SOUS le texte (z-index:-1 dans un contexte isolé) :
   aucun voile sur le contenu, contrastes inchangés. Pas d'animation en boucle ;
   backdrop-filter limité aux badges et coupé sur mobile. */
:root{
  --gloss-line:rgba(255,255,255,.92);
  --gloss-top:linear-gradient(180deg,rgba(255,255,255,.62) 0%,rgba(255,255,255,.18) 22%,rgba(255,255,255,0) 46%);
  --gloss-shadow:0 1px 2px rgba(12,34,64,.05),0 18px 40px -24px rgba(12,34,64,.28);
  --gloss-shadow-brand:0 1px 2px rgba(12,34,64,.05),0 22px 48px -24px rgba(11,107,120,.34),0 10px 28px -20px rgba(91,52,200,.22);
}
.gloss-light,.gloss-medium,.gloss-strong{position:relative;isolation:isolate}
.gloss-light::before,.gloss-medium::before,.gloss-strong::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--gloss-top);pointer-events:none}
.gloss-light{box-shadow:inset 0 1px 0 var(--gloss-line),var(--gloss-shadow)}
.gloss-medium{border-color:rgba(26,180,197,.28);box-shadow:inset 0 1px 0 var(--gloss-line),inset 0 0 0 1px rgba(255,255,255,.35),var(--gloss-shadow-brand)}
.gloss-strong{box-shadow:inset 0 1px 0 var(--gloss-line),0 0 0 6px rgba(26,180,197,.06),0 30px 70px -30px rgba(11,107,120,.38),0 16px 40px -26px rgba(91,52,200,.3)}
/* Cartes déjà mises en avant : l'accent de marque est conservé */
.ds-price--featured.gloss-medium{border-color:var(--ds-teal-700)}
.ds-access__card--plus.gloss-medium{border-color:var(--ds-teal-700)}
/* Reflet lent au survol (une seule fois par survol, jamais en boucle) */
.gloss-sheen::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.42) 48%,rgba(255,255,255,0) 61%) no-repeat;background-size:260% 100%;background-position:130% 0;pointer-events:none}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .gloss-sheen::after{transition:background-position 1.2s var(--ds-ease-out)}
  .gloss-sheen:hover::after{background-position:-30% 0}
}
/* Verre dépoli léger (petits badges sur fond coloré) */
.gloss-glass{border:1px solid rgba(255,255,255,.75);background:rgba(255,255,255,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 24px -14px rgba(12,34,64,.3);-webkit-backdrop-filter:blur(8px) saturate(140%);backdrop-filter:blur(8px) saturate(140%)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.gloss-glass{background:rgba(255,255,255,.95)}}

/* 22.1 Boutons : dégradé très discret, reflet supérieur, survol plus lumineux */
.ds-btn:not(.ds-btn--secondary):not(.ds-btn--soft):not(.ds-btn--light):not(.ds-btn--outline-light){background-image:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,0) 50%),linear-gradient(135deg,rgba(26,180,197,.09),rgba(122,92,240,.06));box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 6px 16px -10px rgba(11,107,120,.5)}
.ds-btn:not(.ds-btn--secondary):not(.ds-btn--soft):not(.ds-btn--light):not(.ds-btn--outline-light):hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 12px 26px -12px rgba(11,107,120,.55),0 0 0 3px rgba(26,180,197,.12)}
.ds-btn--secondary{box-shadow:inset 0 1px 0 #fff,0 4px 12px -8px rgba(12,34,64,.25)}
.ds-btn:active{box-shadow:inset 0 2px 4px rgba(11,34,57,.18)!important}

/* 22.2 Badges sélectionnés : translucidité, bordure fine, petit reflet */
.ds-shot__tag,.ds-float{border-color:rgba(255,255,255,.8);background:rgba(255,255,255,.78);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 12px 26px -16px rgba(12,34,64,.35);-webkit-backdrop-filter:blur(8px) saturate(140%);backdrop-filter:blur(8px) saturate(140%)}
.ds-access__card--plus .ds-badge--teal,.ds-panel__head .ds-badge--violet{box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 0 0 1px rgba(255,255,255,.5),0 4px 12px -8px rgba(12,34,64,.25);background-image:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0))}

/* 22.3 Héros : reflet sur les fenêtres (suit légèrement la souris), contour
   lumineux discret, halo derrière les maquettes. Le texte du héros n'est pas modifié. */
@media (min-width:1101px){
  .ds-stage__scene .ds-browser{border-color:rgba(255,255,255,.85)}
  .ds-stage__scene .ds-browser::after{content:"";position:absolute;inset:0;z-index:5;border-radius:inherit;background:linear-gradient(128deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 22%,rgba(255,255,255,0) 38%);background-position:calc(var(--px,0) * -24px) 0;pointer-events:none}
  .ds-stage__blob--a{background:radial-gradient(circle at 40% 40%,rgba(26,180,197,.26),rgba(26,180,197,0) 68%)}
  .ds-stage__blob--b{background:radial-gradient(circle at 55% 45%,rgba(122,92,240,.20),rgba(122,92,240,0) 68%)}
}

/* 22.4 Espace employeur : lisibilité d'abord (bordure lumineuse, ombre douce, sans transparence) */
.emp-page .kpi,.emp-page .card{box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(12,34,64,.04),0 14px 30px -24px rgba(12,34,64,.3)}

/* 22.5 Mobile : effets réduits (pas de verre dépoli, pas de reflet animé) */
@media (max-width:700px){
  .gloss-glass,.ds-shot__tag,.ds-float{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff}
  .gloss-sheen::after{display:none}
  .gloss-strong{box-shadow:inset 0 1px 0 var(--gloss-line),var(--gloss-shadow-brand)}
}
@media (prefers-reduced-motion:reduce){.gloss-sheen::after{transition:none}}
@media print{.gloss-light::before,.gloss-medium::before,.gloss-strong::before,.gloss-sheen::after{display:none}.gloss-light,.gloss-medium,.gloss-strong{box-shadow:none}}

/* V10.4 resources upgrade: printable employer PDFs */
.emp-row-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.pdf-preview{margin-top:20px;border:1px solid var(--ds-line);border-radius:18px;overflow:hidden;background:#eef5f8;box-shadow:0 16px 40px rgba(11,34,57,.08)}
.pdf-preview iframe{display:block;width:100%;height:760px;border:0;background:#fff}
.pdf-preview--landscape iframe{height:620px}
@media(max-width:760px){.emp-row-actions{width:100%;justify-content:flex-start}.pdf-preview iframe,.pdf-preview--landscape iframe{height:520px}}

/* 23. V10.5 ------------------------------------------------------------------
   23.1 Logo de l'en-tete : environ +15 % (46 -> 53 px ; mobile 36 -> 40 px),
        proportions d'origine (largeur automatique, attributs width/height
        450x80 conserves : place reservee, aucun decalage de mise en page).
   23.2 Effet premium, CSS uniquement : halo bleu-turquoise tres discret et
        ombre douce au repos ; au survol (souris uniquement) halo un peu plus
        marque, scale(1.02) et translateY(-1px) au plus, 300 ms, et un reflet
        unique tres leger. Aucune rotation, aucun clignotement, aucune
        animation continue. Mouvement reduit : aucun deplacement.
   23.3 Champ anti-robot des formulaires Netlify : present dans le formulaire,
        jamais visible, jamais focalisable, ignore par les lecteurs d'ecran. */
.navbar .brand-logo{height:53px}
@media (max-width:480px){.navbar .brand-logo{height:40px}}
@media (max-width:360px){.navbar .brand-logo{height:37px}}
/* A partir de 1280 px, le menu complet est affiche : espacements legerement reduits (memes liens, cibles de 44 px conservees) pour que le logo ne soit plus comprime. */
@media (min-width:1280px){.navbar .nav-container{gap:12px}.navbar .nav-link{padding:8px 7px;font-size:14px}.navbar .nav-account{margin-left:6px}.navbar .nav-account>summary.nav-link{padding:9px 11px}.navbar .nav-menu .btn,.navbar .nav-menu .ds-btn{margin-left:4px;padding:10px 13px;font-size:14px}}
.top-brand img{height:43px}
.navbar .brand,.top-brand{position:relative;isolation:isolate;border-radius:14px}
.navbar .brand-logo,.top-brand img{filter:drop-shadow(0 1px 1px rgba(12,34,64,.10)) drop-shadow(0 0 5px rgba(26,180,197,.13));transition:filter .3s ease,transform .3s ease;transform-origin:left center}
.navbar .brand::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.7) 50%,transparent 62%) no-repeat;background-size:260% 100%;background-position:130% 0;mix-blend-mode:overlay;opacity:0;pointer-events:none;transition:opacity .3s ease,background-position .4s ease}
@media (hover:hover) and (pointer:fine){
  .navbar .brand:hover .brand-logo,.top-brand:hover img{filter:drop-shadow(0 1px 2px rgba(12,34,64,.12)) drop-shadow(0 0 8px rgba(26,180,197,.22));transform:translateY(-1px) scale(1.02)}
  .navbar .brand:hover::after{opacity:1;background-position:-30% 0}
}
@media (prefers-reduced-motion:reduce){
  .navbar .brand-logo,.top-brand img{transition:none}
  .navbar .brand:hover .brand-logo,.top-brand:hover img{transform:none}
  .navbar .brand::after{display:none}
}
@media print{.navbar .brand-logo,.top-brand img{filter:none}.navbar .brand::after{display:none}}
.is-hp,[data-netlify] .is-hp{display:none!important}

/* 23.4 Espace employeur : usage du service (donnees agregees et anonymisees) */
.emp-usage-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.emp-usage-head h2{margin:0}
.emp-usage-period{display:inline-flex;flex-wrap:wrap;gap:6px}
.emp-usage-period button{min-height:40px;padding:8px 14px;border:1.5px solid var(--ds-sky-300);border-radius:10px;background:#fff;color:var(--ds-ink);font:600 14px var(--ds-font);cursor:pointer}
.emp-usage-period button[aria-pressed="true"]{border-color:var(--ds-teal-700);background:var(--ds-teal-50);color:var(--ds-teal-800)}
.emp-usage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0}
.emp-usage-stat{padding:14px 16px;border:1px solid var(--ds-border);border-radius:14px;background:#fff}
.emp-usage-stat span{display:block;color:var(--ds-muted);font-size:13px;font-weight:600;line-height:1.35}
.emp-usage-stat strong{display:block;margin-top:4px;color:var(--ds-ink);font:800 24px/1.2 var(--ds-font-head)}
.emp-usage-stat small{display:block;margin-top:4px;color:var(--ds-muted);font-size:12.5px}
.emp-usage-stat strong.is-na{font:600 14px/1.4 var(--ds-font);color:var(--ds-muted)}
.emp-usage-note{margin:10px 0 0;padding:12px 14px;border:1px solid var(--ds-sky-200);border-radius:12px;background:var(--ds-sky-50);color:var(--ds-ink);font-size:14px}
.emp-usage-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:6px}
.emp-usage-evo{width:100%;border-collapse:collapse;font-size:14px}
.emp-usage-evo th,.emp-usage-evo td{padding:8px 6px;border-bottom:1px solid var(--ds-border);text-align:left}
.emp-usage-evo td:not(:first-child),.emp-usage-evo th:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:760px){.emp-usage-cols{grid-template-columns:1fr}}.offer-services{margin-top:16px;padding:14px 16px;border:1px solid var(--ds-border);border-radius:14px;background:#fff}
.offer-services h3{margin:0 0 6px;font-size:15px}
.offer-services ul{margin:0;padding-left:20px}.emp-usage-cols h3{margin:0 0 10px;font-size:16px}
.emp-usage-cols ol{margin:0;padding-left:24px}
.emp-usage-cols ol li{margin:4px 0}