/* ==========================================================================
   Nexa · socle commun du site dans la direction artistique client (DA 08/10/2026)
   --------------------------------------------------------------------------
   Chargé APRÈS nexa-landing.css (qu'il surcharge pour l'en-tête, le pied et les boutons).
   Se suffit à lui-même pour l'en-tête et le pied : /statut le charge sans nexa-landing.css.
   Sources : src/da/theme/tokens.css (jetons), public/site/accueil-v2.css (accueil).

   Ce que la feuille touche d'office :
     - l'en-tête  <header class="nav" id="nav">  (logo A, liens, « Se connecter », burger, panneau mobile) ;
     - le pied    <footer class="footer">  (encre, coins arrondis, astérisque en filigrane) ;
     - les boutons .btn / .btn-coral / .btn-ink / .btn-ghost / .btn-white / .btn-lg (pilules) ;
     - les apparitions .reveal (fondu + 16 px, état final visible sans JS et en mouvement réduit).
   Tout le reste est OPT-IN, préfixé « da- » (aucun conflit avec les classes de l'accueil) :
     body.da, .da-wrap, .da-section, .da-eyebrow, .da-kicker, .da-h1/2/3, .da-lead, .da-accent,
     .da-underline, .da-hand, .da-card (+ teintes), .da-chip, .da-blobs / .da-blob (+ teintes).
   ========================================================================== */

/* Polices DA auto-hébergées (SIL OFL 1.1) : mêmes déclarations que accueil-v2.css (même fichier, téléchargé une fois) */
@font-face { font-family: 'Fredoka'; font-style: normal; font-weight: 300 700; font-display: swap; src: url('/fonts/da/Fredoka-latin.woff2') format('woff2'); }
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200 1000; font-display: swap; src: url('/fonts/da/Nunito-latin.woff2') format('woff2'); }
@font-face { font-family: 'Patrick Hand'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/da/PatrickHand-latin.woff2') format('woff2'); }

/* ---------- Jetons (thème clair de tokens.css, valeurs AA) ---------- */
:root {
  /* Fonds et surfaces */
  --da-bg: #faf7f2;
  --da-surface: #ffffff;
  --da-surface-2: #f2ece6;
  /* Encre */
  --da-ink: #141423;          /* 17:1 sur crème */
  --da-ink-2: #3d3b52;        /* 10,1:1 */
  --da-ink-muted: #676572;    /* 5,34:1 sur crème */
  --da-line: #ece5dc;         /* filet décoratif */
  --da-line-strong: #8f8a84;  /* bord d'un contrôle : 3,2:1 */
  /* Corail */
  --da-coral: #e8543a;        /* marque, icônes, astérisque (jamais sous un petit texte blanc) */
  --da-coral-strong: #c8432a; /* fond de bouton à libellé blanc : 4,89:1 */
  --da-coral-hover: #b83c24;
  --da-coral-text: #b83c24;   /* texte corail sur crème ou blanc : 5,3:1 */
  --da-coral-bright: #fd644e; /* décor seulement (soulignés) */
  --da-coral-pale: #ffe4db;
  --da-coral-on-ink: #ff8a70; /* corail posé sur l'encre : 6,2:1 */
  /* Pastels (fonds de cartes et blobs ; l'encre dessus fait ≥ 10:1) */
  --da-peach: #ffdcc4;   --da-peach-soft: #ffeee2;
  --da-pink: #fdd2d4;    --da-pink-soft: #fee7e8;
  --da-mint: #cdf4e4;    --da-mint-soft: #e6f9f1;
  --da-lavender: #eacdfc; --da-lavender-soft: #f3e5fd;
  --da-yellow: #fddc7a;  --da-yellow-soft: #feedb8;
  --da-sky: #bed5fc;     --da-sky-soft: #e1ecfe;
  /* Encres vives */
  --da-violet: #6441bd;        /* liens secondaires, annotations : 6,48:1 sur crème */
  --da-violet-bright: #9c87f8; /* flèches dessinées : décor */
  --da-green: #0a7f6e;         /* blanc dessus : 4,91:1 */
  --da-green-ink: #0a6b5c;     /* texte vert sur menthe : 5,4:1 */
  /* Typographie */
  --da-font-display: 'Fredoka', 'Nunito', ui-rounded, system-ui, sans-serif;
  --da-font-text: 'Nunito', 'Inter', ui-rounded, -apple-system, 'Segoe UI', system-ui, sans-serif;
  --da-font-hand: 'Patrick Hand', 'Segoe Print', 'Bradley Hand', cursive;
  /* Rayons */
  --da-radius-sm: 12px;
  --da-radius-md: 20px;
  --da-radius-card: 24px;
  --da-radius-lg: 28px;
  --da-radius-pill: 999px;
  /* Ombres douces, teintées d'encre */
  --da-shadow-sm: 0 1px 2px rgba(20,20,35,.06), 0 1px 3px rgba(20,20,35,.04);
  --da-shadow-card: 0 1px 2px rgba(20,20,35,.04), 0 8px 24px -10px rgba(20,20,35,.14);
  --da-shadow-float: 0 12px 32px -8px rgba(20,20,35,.18), 0 2px 6px rgba(20,20,35,.06);
  --da-shadow-action: 0 8px 18px -6px rgba(200,67,42,.5);
  /* Espacements (grille de 4 px) */
  --da-space-1: 4px; --da-space-2: 8px; --da-space-3: 12px; --da-space-4: 16px; --da-space-5: 20px;
  --da-space-6: 24px; --da-space-8: 32px; --da-space-10: 40px; --da-space-12: 48px; --da-space-16: 64px;
  --da-section-y: clamp(56px, 6vw + 32px, 112px);
  --da-wrap: 1200px;
  /* Mouvement */
  --da-ease-out: cubic-bezier(0.22, 1, .36, 1);
  --da-ease-spring: cubic-bezier(0.34, 1.56, .64, 1);

  /* Valeurs partagées avec nexa-landing.css (identiques : /statut ne charge que cette feuille) */
  --gutter: 32px;
  --nav-h: 68px;
}
@media (max-width: 1024px) { :root { --gutter: 24px; } }
@media (max-width: 768px) { :root { --nav-h: 60px; } }
@media (max-width: 480px) { :root { --gutter: 20px; } }

/* ==========================================================================
   EN-TÊTE  <header class="nav" id="nav">
   ========================================================================== */
.nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(250, 247, 242, .86);
  -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%);
  border-bottom: 1px solid transparent;
  font-family: var(--da-font-text); line-height: 1.5;
  transition: border-color .25s, background-color .25s, box-shadow .25s;
}
.nav.scrolled { background: rgba(250, 247, 242, .94); border-bottom-color: var(--da-line); box-shadow: 0 6px 18px -14px rgba(20,20,35,.35); }
.nav .wrap { max-width: 1280px; margin: 0 auto; padding: 0 var(--gutter); }
.nav .nav-inner { display: flex; align-items: center; gap: 36px; height: var(--nav-h); }

/* Mot-logo Mipozo (15/10 ; src/da/theme/brandMark.ts, scripts/site-logo-nexa.mjs).
   Taille (Ben, 14/10 : « garde la taille de nova ») : le corps des lettres M P O Z O a la hauteur des lettres de l'ancien
   « nova* » (--lettres : 28 px en tête, 24 px sous 768 px, 21 px sous 380 px, 30 px dans le pied) ; le point du i dépasse
   au-dessus. Cadrage collé à l'encre (data-cadrage="serre" → viewBox 39 133 2098 452) : lettres = 351 unités sur 452 de haut. */
.nav .logo, .footer .logo { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 44px; color: #011843; text-decoration: none; border-radius: 8px; } /* bleu nuit du logo ; blanc sur le pied de page */
.logo-a { --lettres: 28px; display: block; height: calc(var(--lettres) * 452 / 351); width: auto; aspect-ratio: 2098 / 452; overflow: visible; }
.logo-a-ast { transform-box: fill-box; transform-origin: 50% 50%; transition: transform .45s var(--da-ease-spring); }
.logo:hover .logo-a-ast { transform: rotate(14deg); }

/* Liens */
.nav .nav-links { display: flex; align-items: center; gap: 28px; flex: 1; }
.nav .nav-links a {
  position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0; margin: 0;
  font-family: var(--da-font-text); font-size: 16px; font-weight: 800; letter-spacing: 0; color: var(--da-ink-2);
  text-decoration: none; transition: color .15s;
}
.nav .nav-links a::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 6px; height: 3px; border-radius: 3px;
  background: var(--da-coral); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--da-ease-out);
}
.nav .nav-links a:hover, .nav .nav-links a.active, .nav .nav-links a[aria-current="page"] { color: var(--da-ink); }
.nav .nav-links a:hover::after, .nav .nav-links a.active::after, .nav .nav-links a[aria-current="page"]::after { transform: scaleX(1); }
.nav .nav-links a.nav-menu-login { display: none; }

/* Actions à droite */
.nav .nav-cta { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.nav .nav-cta .link {
  display: inline-flex; align-items: center; min-height: 44px;
  font-family: var(--da-font-text); font-size: 16px; font-weight: 800; color: var(--da-ink); text-decoration: none;
  text-decoration-line: underline; text-decoration-color: transparent; text-decoration-thickness: 2px; text-underline-offset: 5px;
  transition: text-decoration-color .15s;
}
.nav .nav-cta .link:hover { text-decoration-color: rgba(232,84,58,.7); }
.nav .nav-cta .btn { min-height: 44px; padding: 10px 20px; font-size: 16px; }

/* Burger (≤ 768 px) */
.nav .nav-hamburger {
  display: none; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 44px; height: 44px; padding: 0; border-radius: 50%;
  border: 1.5px solid var(--da-line-strong); background: var(--da-surface); color: var(--da-ink); cursor: pointer;
  transition: border-color .15s, background-color .15s;
}
.nav .nav-hamburger:hover { border-color: var(--da-ink); }

/* Sélecteur de langue (page /installer) : même place que les actions */
.nav .langs { display: flex; gap: 4px; margin-left: auto; }
.nav .langs a {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px;
  border-radius: var(--da-radius-pill); font: 800 15px/1 var(--da-font-text); letter-spacing: .02em; color: var(--da-ink-2); text-decoration: none;
}
.nav .langs a[aria-current="true"] { background: var(--da-ink); color: #fff; box-shadow: none; }
.nav .langs a:not([aria-current="true"]):hover { background: var(--da-surface-2); color: var(--da-ink); }

@media (max-width: 1024px) {
  .nav .nav-inner { gap: 22px; }
  .nav .nav-links { gap: 20px; }
  .nav .nav-cta { gap: 14px; }
}

@media (max-width: 768px) {
  .nav .nav-inner { gap: 10px; }
  .nav .nav-links { display: none; }
  .nav .nav-cta .link { display: none; }
  .nav .nav-cta .btn { padding: 10px 16px; }
  .nav .nav-hamburger { display: inline-flex; }
  .logo-a { --lettres: 24px; }

  /* Panneau déroulant (classe posée par nexa-landing.js) */
  .nav.menu-ouvert { background: var(--da-bg); border-bottom-color: var(--da-line); }
  .nav.menu-ouvert .nav-links {
    display: flex; flex-direction: column; align-items: stretch; gap: 0;
    position: absolute; top: 100%; left: 0; right: 0;
    padding: 6px var(--gutter) 18px;
    background: var(--da-bg); border-bottom: 1px solid var(--da-line);
    border-radius: 0 0 var(--da-radius-lg) var(--da-radius-lg);
    box-shadow: 0 18px 32px -16px rgba(20,20,35,.28);
    max-height: calc(100vh - var(--nav-h)); max-height: calc(100dvh - var(--nav-h));
    overflow-y: auto; overscroll-behavior: contain;
    animation: da-panneau .2s var(--da-ease-out) both;
  }
  .nav.menu-ouvert .nav-links a {
    display: flex; min-height: 54px; padding: 0 4px;
    font-size: 18px; color: var(--da-ink); border-bottom: 1px solid var(--da-line);
  }
  .nav.menu-ouvert .nav-links a:last-child { border-bottom: 0; }
  .nav.menu-ouvert .nav-links a::after { display: none; }
  .nav.menu-ouvert .nav-links a.active, .nav.menu-ouvert .nav-links a[aria-current="page"] { color: var(--da-coral-text); }
  .nav.menu-ouvert .nav-links a.nav-menu-login {
    display: flex; justify-content: center; margin-top: 14px; min-height: 52px; border: 0; border-radius: var(--da-radius-pill);
    background: var(--da-ink); color: #fff; font-size: 16px;
  }

  /* Sans JavaScript : pas de burger, les liens passent sur une seconde ligne */
  html:not(.js) .nav .nav-hamburger { display: none; }
  html:not(.js) .nav .nav-inner { flex-wrap: wrap; height: auto; min-height: var(--nav-h); row-gap: 0; padding-top: 8px; padding-bottom: 4px; }
  html:not(.js) .nav .nav-links { display: flex; order: 3; width: 100%; flex-wrap: wrap; gap: 0 20px; }
  html:not(.js) .nav .nav-links a.nav-menu-login { display: inline-flex; }
}
@media (max-width: 380px) {
  .logo-a { --lettres: 21px; }
  .nav .nav-cta .btn { padding: 10px 14px; }
}
@keyframes da-panneau { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   PIED  <footer class="footer">  (encre, coins hauts arrondis)
   ========================================================================== */
.footer {
  position: relative; overflow: hidden;
  margin-top: 0; padding: 72px 0 28px;
  background: var(--da-ink); color: rgba(255,255,255,.74);
  border-radius: 36px 36px 0 0;
  font-family: var(--da-font-text); line-height: 1.5;
}
/* Symbole du logo en filigrane (décor) : Mi blanc, sur le pied de page foncé */
.footer::after {
  content: ''; position: absolute; right: -96px; bottom: -110px; width: 300px; height: 300px; pointer-events: none; opacity: .1;
  background: url("data:image/svg+xml,%3Csvg viewBox='27.04 5.75 690 690' xmlns='http://www.w3.org/2000/svg' data-nexa='symbole' data-ink='%23fff'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M445 217C449 216.6 452.7 216.5 457 216.8C461.3 217.1 466.3 217.7 471 218.9C475.7 220 480.8 221.9 485 223.7C489.2 225.5 492.6 227.4 496 229.7C499.4 231.9 502.2 233.9 505.6 237C509 240.1 513 244 516.2 248C519.3 252 522.1 256.5 524.2 261C526.4 265.5 528 269.5 529.3 275C530.7 280.5 530.9 280.7 532.2 294C533.6 307.3 535.4 328.3 537.3 355C539.1 381.7 542.2 430.8 543.3 454C544.5 477.2 544.4 484.7 544.3 494C544.1 503.3 543.3 505.2 542.3 510C541.3 514.8 540.2 518.5 538.2 523C536.2 527.5 533.2 533 530.4 537C527.5 541 524.4 544.2 521 547.2C517.6 550.3 514 552.9 510 555.2C506 557.6 501 559.7 497 561.3C493 562.8 490.2 563.6 486 564.4C481.8 565.1 476.7 565.7 472 565.9C467.3 566 462.5 565.9 458 565.3C453.5 564.8 449 563.6 445 562.5C441 561.3 438 560.3 434 558.3C430 556.2 424.3 552.4 421 550.1C417.7 547.7 416.5 546.7 414 544C411.4 541.3 407.9 537 405.7 534C403.6 531 402.7 529.4 401 525.9C399.3 522.4 397.1 517 395.8 513C394.4 509 393.7 506 392.9 502C392.1 498 391.8 498.5 390.8 489C389.8 479.5 387.8 452.7 386.8 445C385.9 437.3 385 442.6 385 442.6C385 442.6 387.7 438.7 382 444.1C376.3 449.5 359.2 467.4 351 475.1C342.8 482.8 337.7 486.5 333 490.1C328.3 493.6 325.8 494.6 323 496.2C320.2 497.7 318.7 498.3 316 499.3C313.3 500.3 310.3 501.4 307 502.3C303.7 503.1 300 503.9 296 504.3C292 504.7 286.5 504.9 283 504.8C279.5 504.8 278.3 504.7 275 504C271.7 503.4 267 502.5 263 501.2C259 499.9 254.2 497.5 251 496C247.8 494.5 247.8 494.7 244 492C240.2 489.3 235.1 485.8 228.5 480C221.8 474.2 208.6 461.3 204 457.2C199.4 453.2 201.8 455.8 201 455.6C200.2 455.5 199.6 455.7 199 456.1C198.4 456.5 197.9 457.2 197.5 458C197.1 458.8 197.8 452.8 196.7 461C195.7 469.2 192.7 497.5 191.3 507C189.9 516.5 189.6 514.3 188.2 518C186.9 521.7 185.6 525 183.3 529C180.9 533 177.2 538.4 174.1 542C171.1 545.6 168.4 547.8 165 550.3C161.6 552.9 158.2 555.3 154 557.4C149.8 559.6 144.7 561.8 140 563.3C135.3 564.8 130.3 565.7 126 566.4C121.7 567.1 118.5 567.4 114 567.4C109.5 567.4 103.2 566.9 99 566.4C94.8 565.9 92.2 565.2 89 564.3C85.8 563.5 83.2 562.5 80 561.2C76.8 559.8 72.8 557.8 70 556.1C67.2 554.5 65.5 553.4 63 551.2C60.5 549 57.3 546.2 54.8 543C52.2 539.8 49.5 535.3 47.7 532C45.8 528.7 45 526.7 43.8 523C42.7 519.3 41.5 514.5 40.8 510C40.1 505.5 39.6 505.2 39.7 496C39.8 486.8 39.3 480.8 41.2 455C43 429.2 48.7 364 50.8 341C52.9 318 53.1 322.3 54 317C54.8 311.7 55 312.1 56 309C57 305.9 58.6 301.5 60 298.2C61.4 294.9 62.9 292 64.7 289C66.5 286 67.4 283.9 70.6 280C73.9 276.1 80.3 269.2 84 265.7C87.7 262.2 89.8 261 93 258.8C96.2 256.6 99.5 254.5 103 252.7C106.5 250.9 110.3 249.3 114.2 248C118.1 246.7 122.2 245.7 126.1 245C130.1 244.3 134 243.9 138 243.9C142 243.8 146.5 244.3 150 244.8C153.5 245.3 156 245.9 159 246.7C162 247.5 163.5 247.7 168 249.8C172.5 252 179.7 255.3 186 259.6C192.3 263.9 199.7 270.3 206 275.7C212.3 281 211.2 279.7 224 291.6C236.8 303.5 272.3 337.6 282.6 347C293 356.4 284.9 348 286 347.9C287.1 347.7 286.6 348.2 289 346C291.3 343.8 288.8 346.4 300 334.6C311.2 322.8 341 290.8 356 275.5C371 260.2 381.7 250.3 390 242.8C398.3 235.4 401.2 234.1 406 230.9C410.8 227.7 414.5 225.8 419 223.8C423.5 221.8 428.7 220 433 218.9C437.3 217.8 441 217.4 445 217ZM621.5 309C625 309 629.1 309.3 632 309.6C634.9 309.9 635.3 309.8 639 310.8C642.7 311.8 649.3 313.4 654 315.6C658.7 317.8 663.7 321.3 667 323.9C670.3 326.5 671.9 328.1 674.1 331C676.3 333.9 678.6 337.3 680.3 341C682 344.7 683.4 349.3 684.3 353C685.1 356.7 685.2 355.7 685.5 363C685.7 370.3 685.8 372.8 685.8 397C685.8 421.2 685.9 487.3 685.7 508C685.4 528.7 684.8 517.7 684.3 521C683.7 524.3 683.2 525.5 682.4 528C681.5 530.5 680.4 533.2 679 535.9C677.6 538.6 676.3 541.2 674.1 544C672 546.8 668.2 550.5 666 552.5C663.8 554.6 663 555 661 556.3C659 557.6 657.2 559 654 560.5C650.8 561.9 645.5 564.1 642 565.2C638.5 566.3 636.3 566.7 633 567.2C629.7 567.7 626 568 622 568C618 568 613.7 568 609 567.2C604.3 566.4 598.3 564.9 594 563.4C589.7 562 586.2 560.2 583 558.2C579.8 556.3 577.7 554.5 575 552C572.3 549.5 569.3 546.5 567 543C564.6 539.5 562.4 534.7 560.8 531C559.3 527.3 558.5 524.8 557.8 521C557.1 517.2 556.7 533 556.6 508C556.4 483 556.6 396 556.8 371C557 346 557.2 362.2 557.8 358C558.5 353.8 559.6 349.5 560.8 346C561.9 342.5 563.3 339.7 564.8 337C566.3 334.3 567.9 332.2 569.8 330C571.6 327.8 573.8 325.7 576 323.8C578.2 321.9 580.8 320.2 583 318.8C585.2 317.5 586.2 316.8 589 315.6C591.8 314.4 596.3 312.6 600 311.6C603.7 310.6 607.4 310 611 309.6C614.6 309.1 618 309 621.5 309Z'/%3E%3Cpath fill='%23FD4647' fill-rule='evenodd' d='M616.3 134C620.3 133.7 625.4 133.3 630 133.6C634.6 133.9 639.5 134.6 644 135.7C648.5 136.7 652.7 137.9 657 139.7C661.3 141.5 666 144 670 146.6C674 149.3 678.2 153.1 681 155.6C683.8 158.2 685.2 159.8 687.1 162C689 164.2 690.2 165.5 692.2 169C694.3 172.5 697.5 178.5 699.4 183C701.2 187.5 702.4 191.3 703.3 196C704.1 200.7 704.4 206.3 704.4 211C704.4 215.7 704.2 219.2 703.1 224C702 228.8 700.2 235 698.1 240C695.9 245 693.1 249.8 690.2 254C687.3 258.2 684.3 261.6 680.8 265C677.2 268.4 673.1 271.6 669 274.3C664.9 277 661.2 279.1 656 281.1C650.8 283.2 643.7 285.4 638 286.5C632.3 287.5 626.9 287.6 622 287.5C617.1 287.4 612.9 286.9 608.4 286C603.9 285.1 599.7 284.2 595 282.3C590.3 280.4 584.3 277.2 580 274.5C575.7 271.8 572.5 269.5 569 266.1C565.5 262.7 561.6 258 558.8 254C555.9 250 554 246.8 552 242C549.9 237.2 547.7 230.3 546.7 225C545.6 219.7 545.5 215 545.5 210C545.5 205 546 199.7 546.8 195C547.7 190.3 548.4 186.8 550.6 182C552.7 177.2 556.6 170.6 559.8 166C563 161.4 566.3 158.1 570 154.7C573.7 151.3 578.5 147.8 582 145.5C585.5 143.2 588.2 142.1 591 140.8C593.8 139.5 596.5 138.7 599 137.8C601.5 137 603.1 136.3 606 135.7C608.9 135 612.3 134.3 616.3 134Z'/%3E%3C/svg%3E") center / contain no-repeat;
  transform: rotate(12deg);
}
.footer > .wrap { position: relative; z-index: 1; max-width: 1280px; margin: 0 auto; padding: 0 var(--gutter); }
.footer .footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 48px; }
.footer .logo { color: #fff; }
.footer .logo-a { --lettres: 30px; }
.footer p.tag { margin: 14px 0 0; max-width: 320px; font-size: 16px; line-height: 1.5; color: rgba(255,255,255,.74); }
.footer h5, .footer .footer-title {
  margin: 0 0 12px; font-family: var(--da-font-display); font-size: 19px; font-weight: 600; line-height: 1.2;
  letter-spacing: 0; text-transform: none; color: var(--da-peach);
}
.footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0; }
.footer ul a {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0; margin: 0;
  font-size: 16px; font-weight: 600; color: rgba(255,255,255,.8); text-decoration: none;
  transition: color .15s;
}
.footer ul a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--da-coral); text-decoration-thickness: 2px; text-underline-offset: 4px; transform: none; }
.footer .footer-bottom {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 18px;
  padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12);
  font-size: 14px; color: rgba(255,255,255,.62);
}
.footer :focus-visible { outline: 3px solid #fff; outline-offset: 3px; border-radius: 6px; }

/* Variante courte (page /installer, traduite FR/NL/EN) : logo + une ligne de liens */
.footer.footer--mini { padding: 36px 0 28px; border-radius: 28px 28px 0 0; }
.footer.footer--mini::after { width: 200px; height: 200px; right: -50px; bottom: -70px; }
.footer--mini .footer-mini-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 22px; font-size: 16px; color: rgba(255,255,255,.62); }
.footer--mini .footer-mini-row .logo { margin-right: 6px; }
.footer--mini .footer-mini-row a:not(.logo) {
  display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; color: rgba(255,255,255,.8);
  text-decoration: underline; text-decoration-color: rgba(255,255,255,.3); text-underline-offset: 4px;
}
.footer--mini .footer-mini-row a:not(.logo):hover { color: #fff; text-decoration-color: var(--da-coral); }

/* Cibles de 44 px sur tactile */
@media (max-width: 1024px), (pointer: coarse) {
  .footer ul a { min-height: 44px; }
}
@media (max-width: 1024px) {
  .footer .footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 28px; }
}
@media (max-width: 768px) {
  .footer { padding: 52px 0 24px; border-radius: 28px 28px 0 0; }
  .footer .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 20px; margin-bottom: 36px; }
  .footer .footer-grid > :first-child { grid-column: 1 / -1; }
  .footer .footer-bottom { font-size: 16px; }
}
@media (max-width: 480px) {
  .footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; }
  .footer .footer-grid > :first-child, .footer .footer-grid > :last-child { grid-column: 1 / -1; }
  .footer::after { width: 220px; height: 220px; right: -60px; bottom: -60px; }
}

/* ==========================================================================
   LIEN D'ÉVITEMENT, FOCUS
   ========================================================================== */
.skip-link {
  position: absolute; left: 12px; top: -100px; z-index: 100;
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: var(--da-radius-pill);
  background: var(--da-ink); color: #fff; font: 800 15px/1 var(--da-font-text); text-decoration: none;
}
.skip-link:focus { top: 12px; }
.nav :focus-visible { outline: 3px solid var(--da-ink); outline-offset: 3px; }

/* ==========================================================================
   BOUTONS (pilules) : .btn + .btn-coral | .btn-ink | .btn-ghost | .btn-white  (+ .btn-lg)
   ========================================================================== */
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 10px 22px; border: 0; border-radius: var(--da-radius-pill);
  font-family: var(--da-font-text); font-size: 16px; font-weight: 800; line-height: 1.2; letter-spacing: 0; text-align: center;
  text-decoration: none; cursor: pointer; overflow: visible;
  transition: background-color .15s, box-shadow .2s, transform .15s var(--da-ease-out);
}
.btn::before { content: none; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn svg { flex: 0 0 auto; }
.btn-coral { background: var(--da-coral-strong); color: #fff; box-shadow: var(--da-shadow-action); }
.btn-coral:hover { background: var(--da-coral-hover); box-shadow: 0 10px 22px -8px rgba(200,67,42,.55); }
.btn-ink { background: var(--da-ink); color: #fff; box-shadow: none; }
.btn-ink:hover { background: #2a2a3c; box-shadow: none; }
.btn-ghost { background: var(--da-surface); color: var(--da-ink); border: 0; box-shadow: inset 0 0 0 1.5px var(--da-line-strong); }
.btn-ghost:hover { background: var(--da-surface); box-shadow: inset 0 0 0 2px var(--da-ink); }
.btn-white { background: #fff; color: var(--da-ink); }
.btn-ghost-dark { background: transparent; color: #fff; border: 0; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.45); }
.btn-ghost-dark:hover { background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 2px #fff; }
.btn-lg { min-height: 52px; padding: 14px 28px; font-size: 16px; border-radius: var(--da-radius-pill); }

/* ==========================================================================
   APPARITIONS AU DÉFILEMENT : .reveal (posée par nexa-landing.js : html.js + .in)
   Sans JS (pas de html.js) ou en mouvement réduit : rien n'est masqué.
   ========================================================================== */
html.js .reveal {
  opacity: 0; transform: translateY(16px);
  transition: opacity .5s var(--da-ease-out), transform .6s var(--da-ease-out);
}
html.js .reveal.in { opacity: 1; transform: none; }

/* ==========================================================================
   COMPOSANTS OPT-IN (préfixe da-)
   ========================================================================== */
/* Page entière dans la DA : <body class="page-x da"> */
body.da { background: var(--da-bg); color: var(--da-ink); font-family: var(--da-font-text); font-size: 17px; line-height: 1.5; }
body.da h1, body.da h2, body.da h3 { font-family: var(--da-font-display); font-weight: 600; letter-spacing: -0.005em; color: var(--da-ink); text-wrap: balance; }
body.da p { text-wrap: pretty; }
body.da ::selection { background: var(--da-peach); color: var(--da-ink); }

/* Mise en page */
.da-wrap { max-width: var(--da-wrap); margin: 0 auto; padding: 0 var(--gutter); }
.da-section { position: relative; padding: var(--da-section-y) 0; }
.da-section--tight { padding: calc(var(--da-section-y) * .6) 0; }
.da-section--peach { background: var(--da-peach-soft); }
.da-section--mint { background: var(--da-mint-soft); }
.da-section--pink { background: var(--da-pink-soft); }
.da-section--lavender { background: var(--da-lavender-soft); }
.da-section--white { background: var(--da-surface); }
.da-section--ink { background: var(--da-ink); color: #fff; }
.da-section--ink :focus-visible { outline-color: #fff; }
.da-section--round { border-radius: 36px; margin: 0 12px; }
.da-section-head { max-width: 720px; margin: 0 auto 40px; text-align: center; }
.da-section-head--left { margin-left: 0; text-align: left; }

/* Titres et textes */
.da-h1 { margin: 0; font-family: var(--da-font-display); font-weight: 700; font-size: clamp(40px, 6vw + 16px, 76px); line-height: 1.02; letter-spacing: -0.01em; color: var(--da-ink); text-wrap: balance; }
.da-h2 { margin: 0 0 12px; font-family: var(--da-font-display); font-weight: 600; font-size: clamp(30px, 3vw + 20px, 50px); line-height: 1.08; letter-spacing: -0.005em; color: var(--da-ink); text-wrap: balance; }
.da-h3 { margin: 0 0 8px; font-family: var(--da-font-display); font-weight: 600; font-size: clamp(21px, .8vw + 18px, 26px); line-height: 1.15; color: var(--da-ink); }
.da-lead { margin: 0; max-width: 36em; font-family: var(--da-font-text); font-size: clamp(17px, .3vw + 16px, 20px); line-height: 1.5; color: var(--da-ink-2); text-wrap: pretty; }
.da-section-head .da-lead { margin: 0 auto; }
.da-section-head--left .da-lead { margin: 0; }
.da-text { font-size: 17px; line-height: 1.55; color: var(--da-ink-2); }
.da-muted { color: var(--da-ink-muted); }
.da-accent { color: var(--da-coral-text); }
.da-section--ink .da-accent { color: var(--da-coral-on-ink); }

/* Étiquette de section, manuscrite (remplace les « [ … ] » en mono) */
.da-eyebrow { display: inline-block; margin: 0 0 8px; font: 400 24px/1.1 var(--da-font-hand); color: var(--da-coral-text); transform: rotate(-2deg); }
.da-section--ink .da-eyebrow { color: var(--da-coral-on-ink); }
/* Variante en petites capitales Nunito (plus sobre : tarifs, FAQ) */
.da-kicker { display: inline-block; margin: 0 0 10px; font: 800 14px/1.2 var(--da-font-text); letter-spacing: .08em; text-transform: uppercase; color: var(--da-coral-text); }
/* Annotation manuscrite violette (décor : aria-hidden si elle répète le texte) */
.da-hand { font: 400 22px/1.1 var(--da-font-hand); color: var(--da-violet); }
/* Souligné dessiné sous un mot : <span class="da-underline">compte</span> */
.da-underline {
  padding-bottom: .12em; white-space: nowrap;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9.5C16 4.5 28 11.5 44 8S72 3.5 90 7.5 110 9.5 117 5.5' fill='none' stroke='%23FD644E' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") 0 100% / 100% .32em no-repeat;
}
/* Lien texte (violet, souligné) */
.da-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 800; color: var(--da-violet); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.da-link:hover { text-decoration-thickness: 2.5px; }

/* Cartes arrondies */
.da-card { position: relative; padding: 24px; border-radius: var(--da-radius-card); background: var(--da-surface); box-shadow: var(--da-shadow-card); color: var(--da-ink); }
.da-card--lg { padding: 32px; border-radius: var(--da-radius-lg); }
.da-card--flat { box-shadow: none; border: 1.5px solid var(--da-line); }
.da-card--peach { background: var(--da-peach-soft); box-shadow: none; }
.da-card--mint { background: var(--da-mint); box-shadow: none; }
.da-card--pink { background: var(--da-pink-soft); box-shadow: none; }
.da-card--lavender { background: var(--da-lavender-soft); box-shadow: none; }
.da-card--yellow { background: var(--da-yellow-soft); box-shadow: none; }
.da-card--sky { background: var(--da-sky-soft); box-shadow: none; }
.da-card--ink { background: var(--da-ink); color: #fff; box-shadow: var(--da-shadow-float); }
.da-card--ink :focus-visible { outline-color: #fff; }
.da-card h3 { margin-top: 0; }
@media (max-width: 480px) { .da-card { padding: 20px; } .da-card--lg { padding: 24px; } }

/* Pastille / chip */
.da-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 14px; border-radius: var(--da-radius-pill);
  background: var(--da-surface-2); color: var(--da-ink); font: 800 14px/1.2 var(--da-font-text); }
.da-chip--coral { background: var(--da-coral-strong); color: #fff; }
.da-chip--yellow { background: var(--da-yellow); }
.da-chip--mint { background: var(--da-mint); color: var(--da-green-ink); }
.da-chip--lavender { background: var(--da-lavender); color: #4a2f94; }

/* Pastille numérotée d'étape */
.da-step-num { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--da-coral-strong); color: #fff; font: 700 20px/1 var(--da-font-display); }

/* Blobs décoratifs : un conteneur .da-blobs (aria-hidden) en position absolue dans une section en position relative,
   et des <svg class="da-blob da-blob--peach" viewBox="0 0 200 200"><path d="…" fill="currentColor"/></svg>.
   Trois formes (tracés de l'accueil) :
     A : M96 22C124 8 160 22 168 52C174 74 196 88 188 120C180 154 148 160 128 176C104 194 66 188 46 164C26 142 6 118 18 86C28 58 70 36 96 22Z
     B : M109 16C150 20 186 52 182 98C178 142 146 180 98 184C52 188 14 156 18 108C22 70 46 50 64 34C78 22 92 15 109 16Z
     C : M100 18C138 14 176 40 184 84C192 130 160 178 108 184C60 190 20 160 16 112C12 66 56 22 100 18Z
   Placement libre (left/right/top/bottom/width) en style ou classe de page. Contenu au-dessus : .da-above. */
.da-blobs { position: absolute; inset: 0; z-index: 0; overflow: hidden; overflow: clip; pointer-events: none; }
.da-blob { position: absolute; display: block; width: 280px; height: auto; color: var(--da-peach); }
.da-blob--peach { color: var(--da-peach); }
.da-blob--mint { color: var(--da-mint); }
.da-blob--pink { color: var(--da-pink); }
.da-blob--lavender { color: var(--da-lavender); }
.da-blob--yellow { color: var(--da-yellow-soft); }
.da-blob--sky { color: var(--da-sky-soft); }
.da-above { position: relative; z-index: 1; }

/* Symbole du logo (Mi + point du i), réutilisable : <svg class="da-ast" data-nexa="symbole" …></svg>, rempli par
   scripts/site-logo-nexa.mjs depuis src/da/theme/brandMark.ts (Mi en currentColor, point corail ; cf. #ast de accueil-v2.html). */
.da-ast { display: inline-block; width: 1em; height: 1em; color: var(--da-coral); vertical-align: -0.1em; }

/* ==========================================================================
   Tactile, mouvement réduit
   ========================================================================== */
@media (hover: none) {
  .btn:hover, .btn:active { transform: none; }
  .logo:hover .logo-a-ast { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .nav, .btn, .logo-a-ast, .nav .nav-links a::after { transition: none !important; }
  .logo:hover .logo-a-ast { transform: none; }
  .nav.menu-ouvert .nav-links { animation: none !important; }
  .reveal, html.js .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}