:root {
      --ocean: #00828F;          
      --ocean-texte: #00717D;    
      --ocean-clair: #5CC8D1;    
      --ocean-pale: #E2F0F1;     
      --balise: #FFE600;         
      --balise-pale: #FFF7BF;    
      --granit: #A39A93;         
      --granit-pale: #ECE8E4;    
      --rade: #0E2A30;           
      --rade-2: #143A42;         
      --ecume: #F7F6F3;          
      --blanc: #FFFFFF;
      --encre: #0E2A30;          
      --texte: #36464A;          
      --muted: #5A6466;          
      --line: #DAD4CE;
      --line-strong: #7E8A8C;    
      --on-rade: #E9F1F2;
      --on-rade-soft: #AFC4C7;
      --error: #B3261E;
      --f-titre: "Asap Condensed", "Arial Narrow", system-ui, sans-serif;
      --f-texte: "Libre Franklin", system-ui, -apple-system, "Segoe UI", sans-serif;
      --container: 1200px;
      --gutter: 16px;
      --radius: 6px;
      --radius-lg: 10px;
      --header-h: 64px;
      --ombre: 0 18px 40px -18px rgba(14, 42, 48, .45);

      --cardinale: linear-gradient(180deg, var(--balise) 0 36%, var(--rade) 36% 64%, var(--balise) 64% 100%);
      --cardinale-v: linear-gradient(90deg, var(--balise) 0 36%, var(--rade) 36% 64%, var(--balise) 64% 100%);

      --balise-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 32'%3E%3Cpath d='M2 0h12L8 7z' fill='%230E2A30'/%3E%3Cpath d='M8 8l6 7H2z' fill='%230E2A30'/%3E%3Crect x='4' y='17' width='8' height='15' fill='%23FFE600'/%3E%3Crect x='4' y='22' width='8' height='5' fill='%230E2A30'/%3E%3C/svg%3E");
      --balise-ico-clair: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 32'%3E%3Cpath d='M2 0h12L8 7z' fill='%23FFE600'/%3E%3Cpath d='M8 8l6 7H2z' fill='%23FFE600'/%3E%3Crect x='4' y='17' width='8' height='15' fill='%23FFE600'/%3E%3Crect x='4' y='22' width='8' height='5' fill='%230E2A30'/%3E%3C/svg%3E");

      --granit-motif: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='140' viewBox='0 0 280 140'%3E%3Cg fill='none' stroke='%23A39A93' stroke-width='1.2' stroke-opacity='.32' stroke-linejoin='round'%3E%3Cpath d='M0 1h280M0 28l60 2 54-2 70 3 52-2 44 1M0 66l40-1 66 2 48-2 58 2 68-1M0 101l70 2 50-2 64 1 46-2 50 1M0 139h280'/%3E%3Cpath d='M60 1v29M114 1v29M184 1v30M236 1v29M40 29v36M106 30v37M154 29v36M212 31v36M70 66v37M120 67v35M184 66v36M230 65v36M26 102v37M98 102v37M164 103v36M222 101v38'/%3E%3C/g%3E%3C/svg%3E");
      --iso-motif: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 260' preserveAspectRatio='xMaxYMid slice'%3E%3Cg fill='none' stroke='%235CC8D1' stroke-opacity='.28' stroke-width='1.4'%3E%3Cellipse cx='470' cy='130' rx='40' ry='22' transform='rotate(-14 470 130)'/%3E%3Cellipse cx='466' cy='132' rx='92' ry='52' transform='rotate(-12 466 132)'/%3E%3Cellipse cx='460' cy='136' rx='150' ry='86' transform='rotate(-10 460 136)'/%3E%3Cellipse cx='452' cy='140' rx='214' ry='124' transform='rotate(-8 452 140)'/%3E%3Cellipse cx='444' cy='146' rx='284' ry='166' transform='rotate(-6 444 146)'/%3E%3C/g%3E%3C/svg%3E");
    }

    @media (min-width: 640px) { :root { --gutter: 28px; } }

    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 20px); -webkit-text-size-adjust: 100%; }
    body { margin: 0; font-family: var(--f-texte); font-size: 1.0625rem; line-height: 1.7; color: var(--texte); background: var(--ecume); overflow-x: hidden; }
    img { max-width: 100%; height: auto; display: block; }
    a { color: var(--ocean-texte); text-decoration-thickness: 1px; text-underline-offset: 3px; }
    a:hover { color: var(--encre); text-decoration-thickness: 2px; }
    :focus-visible { outline: 3px solid var(--ocean-texte); outline-offset: 2px; }
    strong, b { color: var(--encre); font-weight: 650; }
    h1, h2, h3, h4 { font-family: var(--f-titre); color: var(--encre); line-height: 1.12; margin: 0 0 .55em; letter-spacing: -.005em; text-wrap: balance; }
    h2 { font-weight: 700; font-size: clamp(1.65rem, 1.35rem + 1.2vw, 2.25rem); }
    h3 { font-weight: 600; font-size: clamp(1.22rem, 1.12rem + .4vw, 1.42rem); margin-top: 1.7em; }
    h4 { font-weight: 600; font-size: 1.08rem; margin-top: 1.4em; }
    p { margin: 0 0 1.05em; }
    .contenant { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
    .soude { white-space: nowrap; }
    .raccourci-acces { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--balise); color: var(--encre); padding: 10px 16px; font-family: var(--f-titre); font-weight: 700; border-radius: var(--radius); text-decoration: none; }
    .raccourci-acces:focus { top: 12px; }

    .touche { display: inline-flex; align-items: center; justify-content: center; gap: .55em; min-height: 48px; padding: 12px 22px; font-family: var(--f-titre); font-weight: 700; font-size: 1.06rem; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; color: var(--encre); background: var(--balise); border: 2px solid var(--encre); border-radius: var(--radius); box-shadow: 4px 4px 0 var(--encre); transition: transform .12s, box-shadow .12s; cursor: pointer; }
    .touche:hover { color: var(--encre); transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--encre); }
    .touche:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--encre); }
    .touche-menu { min-height: 44px; padding: 8px 16px; font-size: .95rem; box-shadow: none; }
    .touche-menu:hover { box-shadow: none; transform: none; background: #FFF06B; }
    .touche-ocean { background: var(--ocean-texte); color: var(--blanc); }
    .touche-ocean:hover { color: var(--blanc); }
    .touche-discret { background: transparent; }
    .on-rade .touche, .insistance .touche, .maison-chapiteau .touche { border-color: var(--balise); box-shadow: none; }

    .maison-chapiteau { position: sticky; top: 0; z-index: 50; background: var(--rade); color: var(--on-rade); border-bottom: 1px solid rgba(92, 200, 209, .25); }
    .chapiteau-tringle { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: var(--header-h); }
    .embleme { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--on-rade); min-width: 0; }
    .embleme:hover { color: var(--blanc); }
    .embleme svg { width: 34px; height: 34px; flex: none; }
    .embleme-mots { font-family: var(--f-titre); font-weight: 600; font-size: 1.12rem; line-height: 1; white-space: nowrap; }
    .embleme-mots span { display: inline-block; margin-left: .35em; font-weight: 700; color: var(--balise); text-transform: uppercase; letter-spacing: .12em; }
    .aiguillage-principal { display: none; }
    .aiguillage-principal a, .aiguillage-battant a { font-family: var(--f-titre); font-weight: 600; font-size: 1.02rem; letter-spacing: .03em; color: var(--on-rade); text-decoration: none; }
    .chapiteau-boutons { display: flex; align-items: center; gap: 10px; flex: none; }
    .chapiteau-relanceur { display: none; }
    .aiguillage-levier { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
    .aiguillage-sommairenav-touche { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border: 1.5px solid var(--on-rade-soft); border-radius: var(--radius); font-family: var(--f-titre); font-weight: 600; font-size: 1rem; color: var(--on-rade); cursor: pointer; user-select: none; }
    .picto, .picto::before, .picto::after { display: block; width: 18px; height: 2px; background: var(--balise); position: relative; transition: transform .2s, background .2s; }
    .picto::before, .picto::after { content: ""; position: absolute; left: 0; }
    .picto::before { top: -6px; } .picto::after { top: 6px; }
    .aiguillage-levier:checked + .aiguillage-sommairenav-touche .picto { background: transparent; }
    .aiguillage-levier:checked + .aiguillage-sommairenav-touche .picto::before { transform: translateY(6px) rotate(45deg); }
    .aiguillage-levier:checked + .aiguillage-sommairenav-touche .picto::after { transform: translateY(-6px) rotate(-45deg); }
    .aiguillage-levier:focus-visible + .aiguillage-sommairenav-touche { outline: 3px solid var(--balise); outline-offset: 2px; }
    .aiguillage-battant { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--rade); border-top: 1px solid rgba(92, 200, 209, .25); padding: 8px var(--gutter) 20px; box-shadow: var(--ombre); }
    .aiguillage-levier:checked ~ .aiguillage-battant { display: block; }
    .aiguillage-battant a:not(.touche) { display: flex; align-items: center; gap: 12px; min-height: 52px; border-bottom: 1px solid rgba(175, 196, 199, .2); }
    .aiguillage-battant a:not(.touche)::before { content: ""; width: 8px; height: 8px; background: var(--balise); transform: rotate(45deg); flex: none; }
    .aiguillage-battant .touche { display: flex; width: 100%; margin-top: 16px; color: var(--encre); letter-spacing: .04em; }
    .chapiteau-relanceur { gap: 0; }
    .chapiteau-relanceur .relanceur-developpe { display: none; }
    @media (min-width: 420px) { .chapiteau-relanceur { display: inline-flex; } .embleme-mots { font-size: 1.2rem; } }
    @media (max-width: 359px) { .embleme-mots { font-size: 1rem; } .embleme svg { width: 28px; height: 28px; } .aiguillage-sommairenav-touche { padding: 8px 10px; } }
    @media (min-width: 960px) {
      .aiguillage-principal { display: flex; gap: 28px; margin-left: auto; margin-right: 20px; }
      .aiguillage-principal a { position: relative; padding: 10px 0; }
      .aiguillage-principal a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 4px; height: 3px; background: var(--balise); transition: right .2s; }
      .aiguillage-principal a:hover { color: var(--blanc); }
      .aiguillage-principal a:hover::after { right: 0; }
      .aiguillage-sommairenav { display: none; }
      .chapiteau-relanceur .relanceur-developpe { display: inline; }
    }

    .fronton { position: relative; overflow: hidden; background: var(--rade); color: var(--on-rade); padding: 36px 0 44px; isolation: isolate; }
    .fronton-iso { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
    .fronton-iso svg { position: absolute; right: -30%; top: -10%; width: 160%; height: 120%; }
    .fronton-quadrillage { display: grid; gap: 30px; align-items: start; }
    .fronton-texte { min-width: 0; padding-top: 4px; }
    .surtitre { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-family: var(--f-titre); font-weight: 600; font-size: .9rem; letter-spacing: .14em; text-transform: uppercase; color: var(--balise); }
    .surtitre::before { content: ""; width: 12px; height: 24px; background: var(--balise-ico-clair) center / contain no-repeat; flex: none; }
    .fronton h1 { color: var(--blanc); font-weight: 700; font-size: clamp(2.15rem, 1.45rem + 3.1vw, 3.6rem); line-height: 1.06; letter-spacing: 0; max-width: 18ch; margin-bottom: .4em; }
    .abrege { font-size: clamp(1.04rem, 1rem + .3vw, 1.18rem); line-height: 1.65; color: var(--on-rade); max-width: 60ch; margin-bottom: 22px; }
    .abrege strong { color: var(--balise); font-weight: 600; }
    .jetons { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
    .jetons li { display: inline-flex; align-items: center; gap: 9px; padding: 7px 13px 7px 11px; border: 1px solid rgba(92, 200, 209, .55); border-radius: 3px; background: rgba(20, 58, 66, .75); font-family: var(--f-titre); font-weight: 600; font-size: .98rem; letter-spacing: .02em; color: var(--on-rade); line-height: 1.25; }
    .jetons li::before { content: ""; width: 9px; height: 9px; background: var(--balise); transform: rotate(45deg); flex: none; }
    .fronton-aile { min-width: 0; }
    @media (max-width: 379px) { .surtitre { font-size: .8rem; letter-spacing: .1em; } }

    .dossier-carte { position: relative; background: var(--blanc); color: var(--encre); border-radius: var(--radius-lg); padding: 30px 20px 22px; box-shadow: var(--ombre); overflow: hidden; }
    .dossier-carte::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; background: var(--cardinale); }
    .dossier-manchette { font-family: var(--f-titre); font-weight: 700; font-size: clamp(1.45rem, 1.3rem + .6vw, 1.75rem); margin: 0 0 .3em; color: var(--encre); }
    .dossier-abrege { font-size: .95rem; line-height: 1.55; color: var(--muted); margin: 0 0 18px; }
    .dossier-carte [data-lead-form] {
      --lf-accent: #0E2A30;
      --lf-accent-ink: #FFE600;
      --lf-ink: #0E2A30;
      --lf-muted: #5A6466;
      --lf-line: #7E8A8C;
      --lf-bg: #FFFFFF;
      --lf-error: #B3261E;
      --lf-radius: 4px;
      --lf-font: "Libre Franklin", system-ui, sans-serif;
      font-family: var(--f-texte);
      min-height: 300px;
    }
    .dossier-carte [data-lead-form] .lf-step-title { font-family: var(--f-titre); font-weight: 700; font-size: 1.18rem; letter-spacing: .02em; color: var(--encre); }
    .dossier-carte [data-lead-form] .lf-btn { font-family: var(--f-titre); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }

    @media (min-width: 480px) { .dossier-carte { padding: 34px 28px 26px; } }
    @media (min-width: 960px) {
      .fronton { padding: 56px 0 64px; }
      .fronton-quadrillage { grid-template-columns: minmax(0, 1.05fr) minmax(380px, .95fr); gap: 48px; }
      .fronton-texte { padding-top: 26px; }
      .fronton-iso svg { right: -8%; top: -14%; width: 110%; height: 130%; }
    }
    @media (min-width: 1200px) { .fronton-quadrillage { grid-template-columns: minmax(0, 1fr) 470px; gap: 64px; } }

    .cardinale { height: 14px; background: var(--cardinale); }

    .confiance-frise { background: var(--granit-pale) var(--granit-motif); padding: 44px 0 48px; border-bottom: 1px solid var(--line); }
    .balisage-debut { max-width: 760px; margin: 0 0 24px; }
    .balisage-surtitre { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-family: var(--f-titre); font-weight: 600; font-size: .86rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ocean-texte); }
    .balisage-surtitre::before { content: ""; width: 11px; height: 22px; background: var(--balise-ico) center / contain no-repeat; }
    .balisage-manchette { margin: 0; font-family: var(--f-titre); font-weight: 700; font-size: clamp(1.35rem, 1.2rem + .7vw, 1.75rem); line-height: 1.18; color: var(--encre); }
    .balisage-quadrillage { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: repere; }
    .jalonnet { position: relative; display: flex; flex-direction: column; gap: 8px; background: var(--blanc); border: 1px solid var(--line); border-top: 5px solid var(--ocean); border-radius: 0 0 var(--radius) var(--radius); padding: 18px 18px 16px; counter-increment: repere; }
    .jalonnet::after { content: counter(repere, decimal-leading-zero); position: absolute; top: 12px; right: 14px; font-family: var(--f-titre); font-weight: 700; font-size: .85rem; letter-spacing: .08em; color: var(--muted); }
    .jalonnet-niveau { font-family: var(--f-titre); font-weight: 700; font-size: 2.1rem; line-height: 1.02; color: var(--encre); padding-right: 30px; }
    .jalonnet-niveau small { display: block; margin-top: 6px; font-size: .98rem; font-weight: 600; letter-spacing: .02em; color: var(--ocean-texte); }
    .jalonnet-niveau::after { content: ""; display: block; width: 44px; height: 6px; margin-top: 10px; background: var(--cardinale-v); }
    .jalonnet-libelle { font-size: .97rem; line-height: 1.6; color: var(--texte); }
    .jalonnet-fondement { margin-top: auto; padding-top: 10px; border-top: 1px dashed var(--granit); font-size: .84rem; line-height: 1.5; font-style: italic; color: var(--muted); }
    .jalonnet-fondement a { color: var(--ocean-texte); }
    .balisage-observation { margin: 18px 0 0; max-width: 860px; font-size: .9rem; line-height: 1.55; color: var(--texte); padding-left: 14px; border-left: 4px solid var(--balise); }
    @media (min-width: 640px) { .balisage-quadrillage { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (min-width: 1000px) {
      .balisage-quadrillage { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .balisage-quadrillage:has(> .jalonnet:nth-child(4)) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .balisage-quadrillage:has(> .jalonnet:nth-child(4)) .jalonnet-niveau { font-size: 1.85rem; }
    }

    main#contenu { padding: 52px 0 24px; }
    .expose { max-width: 780px; margin: 0 auto; }
    .expose-prologue { margin-bottom: 34px; }
    .fraicheur { font-family: var(--f-titre); font-weight: 600; font-size: .9rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
    .entree { font-size: clamp(1.15rem, 1.08rem + .35vw, 1.32rem); line-height: 1.6; color: var(--encre); }
    .volet { position: relative; padding: 42px 0 8px; }
    .volet + .volet, .insistance + .volet, .volet + .insistance { margin-top: 26px; }
    .volet + .volet::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, var(--granit) 0 60px, var(--line) 60px); }
    .volet > h2 { position: relative; padding-left: 28px; }
    .volet > h2::before { content: ""; position: absolute; left: 0; top: .1em; width: 14px; height: 28px; background: var(--balise-ico) center / contain no-repeat; }
    .volet > ul:not([class]), .serie { list-style: none; padding: 0; margin: 0 0 1.2em; }
    .volet > ul:not([class]) > li, .serie > li { position: relative; padding-left: 24px; margin-bottom: .5em; }
    .volet > ul:not([class]) > li::before, .serie > li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 9px solid var(--ocean); }
    .serie-2col { columns: 1; }
    @media (min-width: 640px) { .serie-2col { columns: 2; column-gap: 32px; } .serie-2col > li { break-inside: avoid; } }
    .volet > ol:not([class]) { padding-left: 1.6em; margin: 0 0 1.2em; }
    .volet > ol:not([class]) > li { margin-bottom: .5em; padding-left: 4px; }
    .volet > ol:not([class]) > li::marker { font-family: var(--f-titre); font-weight: 700; color: var(--ocean-texte); }
    blockquote { margin: 1.4em 0; padding: 16px 20px; background: var(--blanc); border-left: 5px solid var(--ocean); border-radius: 0 var(--radius) var(--radius) 0; font-style: italic; color: var(--encre); }
    blockquote p:last-child { margin-bottom: 0; }
    .origine { font-size: .88rem; font-style: italic; color: var(--muted); }

    .matrice { margin: 1.5em 0 1.8em; background: var(--blanc); border: 1px solid var(--line); border-radius: var(--radius); overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .matrice:focus-visible { outline: 3px solid var(--ocean-texte); }
    .matrice table { width: 100%; min-width: 540px; border-collapse: collapse; font-size: .95rem; line-height: 1.5; }
    .matrice caption { caption-side: bottom; text-align: left; padding: 10px 14px 12px; font-size: .84rem; font-style: italic; color: var(--muted); border-top: 1px solid var(--line); }
    .matrice thead th { background: var(--rade); color: var(--blanc); font-family: var(--f-titre); font-weight: 600; font-size: .95rem; letter-spacing: .05em; text-transform: uppercase; text-align: left; padding: 12px 14px; border-bottom: 4px solid var(--balise); }
    .matrice td, .matrice tbody th { padding: 11px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
    .matrice tbody th { font-weight: 600; color: var(--encre); }
    .matrice tbody tr:nth-child(even) { background: #F3F1EE; }
    .matrice tbody tr:last-child > * { border-bottom: 0; }

    .releve { position: relative; overflow: hidden; display: grid; gap: 10px; margin: 1.8em 0; padding: 22px 22px 18px; background: var(--rade) var(--iso-motif) right center / cover no-repeat; color: var(--on-rade); border-radius: var(--radius-lg); }
    .releve::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 8px; background: var(--cardinale-v); background: linear-gradient(180deg, var(--balise) 0 36%, var(--rade) 36% 64%, var(--balise) 64%); }
    .releve-niveau { margin: 0; font-family: var(--f-titre); font-weight: 700; font-size: clamp(2.4rem, 2rem + 2vw, 3.3rem); line-height: 1; color: var(--balise); }
    .releve-niveau small { display: block; margin-top: 6px; font-size: 1rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--on-rade); }
    .releve p { margin: 0 0 .6em; }
    .releve strong { color: var(--blanc); }
    .releve a { color: var(--ocean-clair); }
    .releve-fondement { font-size: .84rem; font-style: italic; color: var(--on-rade-soft); margin: 0; }
    @media (min-width: 640px) { .releve { grid-template-columns: 200px minmax(0, 1fr); gap: 26px; padding: 26px 28px 22px 34px; align-items: center; } .releve-niveau { padding-right: 22px; border-right: 1px dashed rgba(92, 200, 209, .5); } }

    .observation { margin: 1.6em 0; padding: 16px 18px 6px; background: var(--ocean-pale); border-left: 5px solid var(--ocean); border-radius: 0 var(--radius) var(--radius) 0; }
    .observation-etiquette { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-family: var(--f-titre); font-weight: 700; font-size: .92rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ocean-texte); }
    .observation-etiquette::before { content: ""; width: 8px; height: 8px; background: var(--ocean); transform: rotate(45deg); }
    .observation p, .observation .serie { font-size: 1rem; }
    .observation--avis { background: var(--blanc); border: 1px solid var(--line); border-left: 5px solid var(--ocean); }
    .observation--prudence { position: relative; background: var(--balise-pale); border-left: 0; padding-left: 30px; }
    .observation--prudence::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 12px; background: repeating-linear-gradient(135deg, var(--balise) 0 8px, var(--rade) 8px 16px); }
    .observation--prudence .observation-etiquette { color: var(--encre); }
    .observation--prudence .observation-etiquette::before { background: var(--error); }

    .chenal { list-style: none; margin: 1.6em 0 1.8em; padding: 0; counter-reset: etape; position: relative; }
    .chenal > li { position: relative; padding: 0 0 22px 66px; counter-increment: etape; min-height: 52px; }
    .chenal > li::before { content: counter(etape, decimal-leading-zero); position: absolute; left: 0; top: 0; width: 46px; height: 46px; display: grid; place-items: center; background: var(--rade); color: var(--balise); font-family: var(--f-titre); font-weight: 700; font-size: 1.2rem; border-radius: 4px; box-shadow: inset 0 -6px 0 var(--ocean); z-index: 1; }
    .chenal > li::after { content: ""; position: absolute; left: 22px; top: 46px; bottom: 0; border-left: 2px dashed var(--ocean); }
    .chenal > li:last-child { padding-bottom: 0; }
    .chenal > li:last-child::after { display: none; }
    .palier-rubriquage { display: block; padding-top: 9px; margin-bottom: 4px; font-family: var(--f-titre); font-weight: 700; font-size: 1.2rem; line-height: 1.25; color: var(--encre); }
    .chenal p { margin: 0 0 .4em; }

    .jumelage { display: grid; gap: 22px; margin: 1.6em 0 1.8em; align-items: center; }
    .jumelage-lignes { min-width: 0; }
    .jumelage-lignes > h3:first-child { margin-top: 0; }
    .jumelage figure { position: relative; margin: 0; min-width: 0; }
    .jumelage figure::before { content: ""; position: absolute; left: -8px; top: 14px; bottom: 14px; width: 8px; background: linear-gradient(180deg, var(--balise) 0 36%, var(--rade) 36% 64%, var(--balise) 64%); border-radius: 2px 0 0 2px; }
    .jumelage figure:has(figcaption)::before { bottom: 48px; }
    .jumelage img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--line); }
    .jumelage figcaption { margin-top: 8px; font-size: .86rem; font-style: italic; color: var(--muted); }
    @media (max-width: 799px) { .jumelage figure { margin-left: 8px; } }
    @media (min-width: 800px) {
      .expose .jumelage { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; }
      .jumelage--symetrique figure { order: -1; }
      .jumelage--symetrique figure::before { left: auto; right: -8px; border-radius: 0 2px 2px 0; }
    }
    @media (min-width: 1100px) { .expose .jumelage { margin-right: -100px; } .expose .jumelage--symetrique { margin-right: 0; margin-left: -100px; } }
    @media (min-width: 1280px) { .expose .jumelage { margin-right: -170px; } .expose .jumelage--symetrique { margin-right: 0; margin-left: -170px; } }

    .aires { display: grid; gap: 16px; margin: 1.4em 0 1.6em; }
    .aires-lot { background: var(--blanc); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 18px 10px; }
    .aires-rubriquage { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 3px solid var(--ocean); font-family: var(--f-titre); font-weight: 700; font-size: 1.05rem; letter-spacing: .1em; text-transform: uppercase; color: var(--encre); }
    .aires-rubriquage::before { content: ""; width: 10px; height: 20px; background: var(--balise-ico) center / contain no-repeat; }
    .aires-enfilade { list-style: none; margin: 0; padding: 0; columns: 150px; column-gap: 20px; }
    .aires-enfilade li { break-inside: avoid; position: relative; padding: 4px 0 4px 18px; font-size: .97rem; line-height: 1.4; color: var(--encre); }
    .aires-enfilade li::before { content: ""; position: absolute; left: 2px; top: .75em; width: 7px; height: 7px; background: var(--ocean); transform: rotate(45deg); }
    @media (min-width: 720px) { .aires { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

    .insistance { position: relative; overflow: hidden; display: grid; gap: 16px; align-items: center; margin: 2em 0; padding: 26px 22px 24px 34px; background: var(--rade) var(--iso-motif) right center / cover no-repeat; color: var(--on-rade); border-radius: var(--radius-lg); }
    .insistance::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 12px; background: linear-gradient(180deg, var(--balise) 0 36%, #071A1E 36% 64%, var(--balise) 64%); }
    .insistance-rubriquage { display: block; margin-bottom: 6px; font-family: var(--f-titre); font-weight: 700; font-size: clamp(1.35rem, 1.2rem + .6vw, 1.65rem); line-height: 1.15; color: var(--blanc); }
    .insistance p { margin: 0; color: var(--on-rade); font-size: 1rem; }
    .insistance .touche { justify-self: start; }
    @media (min-width: 720px) { .insistance { grid-template-columns: minmax(0, 1fr) auto; gap: 28px; padding: 30px 30px 30px 42px; } }

    .references { margin: 2em 0 0; padding: 18px 20px 8px; background: var(--blanc); border: 1px solid var(--line); border-radius: var(--radius); font-size: .9rem; }
    .references-rubriquage { margin: 0 0 8px; font-family: var(--f-titre); font-weight: 700; font-size: .92rem; letter-spacing: .12em; text-transform: uppercase; color: var(--encre); }
    .references ol { margin: 0 0 10px; padding-left: 1.4em; }
    .references li { margin-bottom: .35em; overflow-wrap: anywhere; }

    #a-propos { padding: 30px 0 50px; }
    .portrait-carte { position: relative; overflow: hidden; max-width: 780px; margin: 0 auto; padding: 26px 22px 12px 26px; background: var(--blanc); border: 1px solid var(--line); border-left: 6px solid var(--granit); border-radius: var(--radius); }
    .portrait-carte::after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 34%; background: var(--granit-motif); -webkit-mask-image: linear-gradient(90deg, transparent, #000 70%); mask-image: linear-gradient(90deg, transparent, #000 70%); pointer-events: none; }
    .portrait-carte > * { position: relative; z-index: 1; }
    .portrait-carte h2 { font-size: clamp(1.4rem, 1.25rem + .6vw, 1.7rem); }
    .portrait-carte p { font-size: 1rem; max-width: 62ch; }

    #faq { background: var(--blanc); padding: 56px 0 64px; border-top: 1px solid var(--line); }
    .eclairages-debut { max-width: 860px; margin: 0 auto 26px; }
    .eclairages-surtitre { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-family: var(--f-titre); font-weight: 600; font-size: .86rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ocean-texte); }
    .eclairages-surtitre::before { content: ""; width: 11px; height: 22px; background: var(--balise-ico) center / contain no-repeat; }
    .eclairages-debut p:last-child { color: var(--texte); margin: 0; }
    .eclairages-enfilade { max-width: 860px; margin: 0 auto; border-top: 2px solid var(--encre); counter-reset: faq; }
    .eclairages-element { border-bottom: 1px solid var(--line); counter-increment: faq; }
    .eclairages-element summary { position: relative; display: block; list-style: none; cursor: pointer; padding: 18px 56px 18px 46px; min-height: 64px; font-family: var(--f-titre); font-weight: 600; font-size: clamp(1.08rem, 1.03rem + .25vw, 1.22rem); line-height: 1.3; color: var(--encre); }
    .eclairages-element summary::-webkit-details-marker { display: none; }
    .eclairages-element summary::before { content: counter(faq, decimal-leading-zero); position: absolute; left: 0; top: 19px; font-family: var(--f-titre); font-weight: 700; font-size: .95rem; color: var(--ocean-texte); letter-spacing: .04em; }
    .eclairages-element summary::after { content: "+"; position: absolute; right: 4px; top: 14px; width: 34px; height: 34px; display: grid; place-items: center; border: 2px solid var(--encre); border-radius: 4px; font-family: var(--f-titre); font-weight: 700; font-size: 1.35rem; line-height: 1; color: var(--encre); transition: background .15s; }
    .eclairages-element summary:hover { color: var(--ocean-texte); }
    .eclairages-element[open] summary::after { content: "\2212"; background: var(--balise); }
    .eclairages-element[open] { background: linear-gradient(90deg, var(--ocean-pale), transparent 60%); box-shadow: inset 4px 0 0 var(--ocean); }
    .eclairages-developpement { padding: 0 20px 14px 46px; }
    .eclairages-developpement p { font-size: 1rem; }

    .maison-pied { background: var(--rade); color: var(--on-rade-soft); padding: 0 0 26px; font-size: .95rem; }
    .maison-pied::before { content: ""; display: block; height: 14px; background: var(--cardinale); margin-bottom: 44px; }
    .pied-quadrillage { display: grid; gap: 28px; }
    .maison-pied .embleme { margin-bottom: 14px; }
    .pied-description { max-width: 46ch; color: var(--on-rade-soft); }
    .pied-pilier-rubriquage { margin: 0 0 10px; font-family: var(--f-titre); font-weight: 700; font-size: .9rem; letter-spacing: .14em; text-transform: uppercase; color: var(--balise); }
    .pied-passerelles { list-style: none; margin: 0; padding: 0; }
    .pied-passerelles a { display: inline-flex; align-items: center; min-height: 42px; color: var(--on-rade); text-decoration: none; }
    .pied-passerelles a:hover { color: var(--balise); text-decoration: underline; }
    .maison-pied :focus-visible { outline-color: var(--balise); }
    .pied-fond { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 20px; margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(175, 196, 199, .22); font-size: .86rem; }
    .pied-fond p { margin: 0; }
    @media (min-width: 760px) { .pied-quadrillage { grid-template-columns: 1.6fr 1fr 1fr; gap: 40px; } }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition: none !important; animation: none !important; }
    }

    [data-lead-form] .lf-native-step + .lf-native-step { display: none; }

    [data-lead-form] .lf-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
    [data-lead-form] .lf-native-step { margin: 0 0 18px; padding: 0; border: 0; min-width: 0; }
    [data-lead-form] .lf-native .lf-step-title { display: block; margin: 0 0 12px; padding: 0; font-weight: 600; }
    [data-lead-form] .lf-native .lf-grid { display: grid; gap: 12px; }
    [data-lead-form] .lf-native .lf-field { margin: 0; padding: 0; border: 0; min-width: 0; }
    [data-lead-form] .lf-native .lf-label, [data-lead-form] .lf-native .lf-field legend { display: block; margin: 0 0 5px; font-size: .875rem; font-weight: 600; }
    [data-lead-form] .lf-native .lf-input { display: block; width: 100%; box-sizing: border-box; padding: 11px 12px; font: inherit; font-size: 1rem; border: 1px solid var(--lf-line, #d5dae3); border-radius: var(--lf-radius, 6px); background: var(--lf-bg, #fff); color: inherit; }
    [data-lead-form] .lf-native textarea.lf-input { min-height: 96px; }
    [data-lead-form] .lf-native .lf-check { display: flex; gap: 10px; align-items: flex-start; font-size: .8rem; line-height: 1.45; }
    [data-lead-form] .lf-native .lf-check input { margin: 2px 0 0; width: 18px; height: 18px; flex: none; }
    [data-lead-form] .lf-native .lf-btn { display: block; width: 100%; padding: 14px 18px; font: inherit; font-size: 1rem; font-weight: 700; border: 0; border-radius: var(--lf-radius, 6px); cursor: pointer; background: var(--lf-accent, #ff9e24); color: var(--lf-accent-ink, #14213d); }