/* site-nav.css — Styles du menu/footer injectés par site-nav.js
   Extrait pour permettre CSP hash-based (finding R3 audit HPI) */

:root{--sn-bg:var(--bg-paper, #FFFFF8);--sn-text:var(--text-main, #111);--sn-muted:var(--text-muted, #555);--sn-border:var(--text-muted, rgba(17,17,17,.04));--sn-font-display:var(--font-heading, 'Inter', sans-serif);--sn-font-body:var(--font-body, Georgia, serif)}

/* Skip link */
.sn-skip{position:absolute;top:-50px;left:8px;background:var(--sn-text);color:var(--sn-bg);padding:10px 16px;font-family:var(--sn-font-display);font-size:14px;font-weight:600;text-decoration:none;z-index:1100;border-bottom:none;border-radius:6px;transition:top .2s}
.sn-skip:focus{top:8px;outline:2px solid var(--sn-text);outline-offset:2px}

/* Nav bar */
[data-site-nav]{display:block;padding:20px 0;position:sticky;top:0;background-color:var(--sn-bg);z-index:300;font-family:var(--sn-font-display);transition:transform .25s ease}
[data-site-nav].sn-bar-hidden{transform:translateY(-100%)}
.sn-bar{max-width:1400px;margin:0 auto;padding:0 48px;display:flex;justify-content:space-between;align-items:center;position:relative;gap:14px}
.sn-left{display:flex;align-items:center;gap:14px}

.sn-back{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:none;background:transparent;color:var(--sn-text);cursor:pointer;font-family:inherit;font-size:20px;line-height:1;padding:0;opacity:.6;transition:opacity .15s}
.sn-back:hover{opacity:1}
.sn-back[hidden]{display:none}

.sn-logo{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Inter','Helvetica Neue',Arial,sans-serif;font-size:18px;font-weight:500;display:flex;align-items:center;gap:12px;color:var(--sn-text);border-bottom:none;text-decoration:none}
.sn-logo:hover{opacity:.85}
.sn-logo img{height:56px;width:auto}

.sn-center{position:absolute;left:50%;transform:translateX(-50%);pointer-events:auto;width:clamp(200px, 40vw, 480px)}

/* Search in navbar */
.sn-search-wrap{display:flex;align-items:center;gap:0;background:var(--sn-bg);border:1.5px solid var(--sn-border);border-radius:10px;box-shadow:inset 1px 1px 3px rgba(17,17,17,0.04);padding:0 4px;transition:border-color .2s,box-shadow .2s}
.sn-search-wrap:focus-within{border-color:var(--sn-text);box-shadow:0 0 0 2px rgba(17,17,17,0.06)}
.sn-search-logo{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:transparent;cursor:pointer;padding:0;flex-shrink:0;border-radius:8px}
.sn-search-logo img{width:32px;height:32px;border-radius:50%}
.sn-search-logo:hover img{opacity:.8}
.sn-search-input{flex:1;border:none;background:transparent;font-family:var(--sn-font-display);font-size:14px;color:var(--sn-text);padding:8px 10px;outline:none;min-width:0}
.sn-search-input::placeholder{color:var(--sn-muted);opacity:.6}

/* Mobile: hide input, show only logo */
@media (max-width:768px){
  .sn-center{position:relative;left:auto;transform:none;width:auto}
  .sn-search-wrap{border:none;box-shadow:none;padding:0;background:transparent}
  .sn-search-wrap:focus-within{box-shadow:none}
  .sn-search-input{display:none}
  .sn-search-logo img{width:40px;height:40px}
  .sn-center.sn-search-active{position:fixed;top:0;left:0;right:0;z-index:350;padding:12px 16px;background:var(--sn-bg)}
  .sn-center.sn-search-active .sn-search-wrap{border:1.5px solid var(--sn-border);box-shadow:0 2px 8px rgba(0,0,0,.1);padding:0 4px;background:var(--sn-bg);border-radius:10px}
  .sn-center.sn-search-active .sn-search-input{display:block}
}

.sn-right{display:flex;align-items:center;gap:16px}

/* Theme switch */
.sn-switch-container{display:flex;align-items:center}
.sn-switch-container input[type="checkbox"]{position:absolute;opacity:0;width:0;height:0}
.sn-switch{display:inline-block;width:36px;height:20px;position:relative;background-color:#ccc;border-radius:10px;cursor:pointer;transition:background-color .3s}
.sn-switch:before,.sn-switch:after{content:"";position:absolute;top:2px;width:16px;height:16px;border-radius:50%;transition:transform .3s}
.sn-switch:before{left:2px;background-color:#fff}
.sn-switch:after{right:2px;background-color:#000}
.sn-switch-container input[type="checkbox"]:checked + .sn-switch{background-color:#6e6e6e}
.sn-switch-container input[type="checkbox"]:checked + .sn-switch:before{transform:translateX(16px)}
.sn-switch-container input[type="checkbox"]:checked + .sn-switch:after{transform:translateX(-16px)}

/* Animated hamburglar */
.sn-hamburglar{transform:scale(.55);position:relative;display:flex;align-items:center;justify-content:center;width:68px;height:68px;margin:-18px -12px;background:transparent;cursor:pointer;-webkit-touch-callout:none;user-select:none;border:none;padding:0}
.sn-hamburglar .sn-path-burger{position:absolute;top:0;left:0;height:68px;width:68px;mask:url(#sn-mask);-webkit-mask:url(#sn-mask)}
.sn-hamburglar .sn-animate-path{position:absolute;top:0;left:0;width:68px;height:68px}
.sn-hamburglar .sn-path-rotation{height:34px;width:34px;margin:34px 34px 0 0;transform:rotate(0deg);transform-origin:100% 0}
.sn-hamburglar .sn-path-rotation:before{content:'';display:block;width:30px;height:34px;margin:0 4px 0 0;background:var(--sn-text)}
.sn-hamburglar .sn-burger-icon{position:absolute;padding:20px 16px;height:68px;width:68px}
.sn-hamburglar .sn-burger-container{position:relative;height:28px;width:36px}
.sn-hamburglar .sn-burger-bun-top,.sn-hamburglar .sn-burger-bun-bot,.sn-hamburglar .sn-burger-filling{position:absolute;display:block;height:4px;width:36px;border-radius:2px;background:var(--sn-text)}
.sn-hamburglar .sn-burger-bun-top{top:0;transform-origin:34px 2px}
.sn-hamburglar .sn-burger-bun-bot{bottom:0;transform-origin:34px 2px}
.sn-hamburglar .sn-burger-filling{top:12px}
.sn-hamburglar .sn-burger-ring{position:absolute;top:0;left:0;width:68px;height:68px}
.sn-hamburglar .sn-svg-ring{width:68px;height:68px}
.sn-hamburglar .sn-path{stroke-dasharray:240;stroke-dashoffset:240;stroke-linejoin:round;stroke:var(--sn-text)}

.sn-hamburglar.is-open .sn-path{animation:sn-dash-in .6s linear normal forwards}
.sn-hamburglar.is-open .sn-animate-path{animation:sn-rotate-in .6s linear normal forwards}
.sn-hamburglar.is-open .sn-burger-bun-top{animation:sn-bun-top-out .6s linear normal forwards}
.sn-hamburglar.is-open .sn-burger-bun-bot{animation:sn-bun-bot-out .6s linear normal forwards}
.sn-hamburglar.is-open .sn-burger-filling{animation:sn-burger-fill-out .6s linear normal forwards}
.sn-hamburglar.is-closed .sn-path{animation:sn-dash-out .6s linear normal forwards}
.sn-hamburglar.is-closed .sn-animate-path{animation:sn-rotate-out .6s linear normal forwards}
.sn-hamburglar.is-closed .sn-burger-bun-top{animation:sn-bun-top-in .6s linear normal forwards}
.sn-hamburglar.is-closed .sn-burger-bun-bot{animation:sn-bun-bot-in .6s linear normal forwards}
.sn-hamburglar.is-closed .sn-burger-filling{animation:sn-burger-fill-in .6s linear normal forwards}
@keyframes sn-rotate-out{0%{transform:rotate(0deg)}40%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}
@keyframes sn-rotate-in{0%{transform:rotate(360deg)}40%{transform:rotate(180deg)}100%{transform:rotate(0deg)}}
@keyframes sn-dash-in{0%{stroke-dashoffset:240}40%{stroke-dashoffset:240}100%{stroke-dashoffset:0}}
@keyframes sn-dash-out{0%{stroke-dashoffset:0}40%{stroke-dashoffset:240}100%{stroke-dashoffset:240}}
@keyframes sn-bun-top-out{0%{left:0;top:0;transform:rotate(0deg)}20%{left:0;top:0;transform:rotate(15deg)}80%{left:-5px;top:0;transform:rotate(-60deg)}100%{left:-5px;top:1px;transform:rotate(-45deg)}}
@keyframes sn-bun-bot-out{0%{left:0;transform:rotate(0deg)}20%{left:0;transform:rotate(-15deg)}80%{left:-5px;transform:rotate(60deg)}100%{left:-5px;transform:rotate(45deg)}}
@keyframes sn-bun-top-in{0%{left:-5px;top:0;transform:rotate(-45deg)}20%{left:-5px;top:0;transform:rotate(-60deg)}80%{left:0;top:0;transform:rotate(15deg)}100%{left:0;top:1px;transform:rotate(0deg)}}
@keyframes sn-bun-bot-in{0%{left:-5px;transform:rotate(45deg)}20%{left:-5px;transform:rotate(60deg)}80%{left:0;transform:rotate(-15deg)}100%{left:0;transform:rotate(0deg)}}
@keyframes sn-burger-fill-in{0%{width:0;left:36px}40%{width:0;left:40px}80%{width:36px;left:-6px}100%{width:36px;left:0}}
@keyframes sn-burger-fill-out{0%{width:36px;left:0}20%{width:42px;left:-6px}40%{width:0;left:40px}100%{width:0;left:36px}}

/* Menu overlay */
.sn-overlay{position:fixed;inset:0;background-color:var(--sn-bg);z-index:200;display:none;flex-direction:column;padding:80px 48px 32px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.sn-overlay.open{display:flex}
.sn-overlay-inner{max-width:900px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:0}

/* Top links */
.sn-top-links{display:flex;flex-direction:column;gap:0;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--sn-border)}
.sn-top-link{font-family:var(--sn-font-display);font-size:clamp(22px,4.5vw,40px);font-weight:500;letter-spacing:-.02em;padding:10px 0;display:block;color:var(--sn-text);text-decoration:none;border-bottom:none}
.sn-top-link:hover{opacity:.7;border-bottom:none}

/* Sections dépliables */
.sn-section{border-bottom:1px solid var(--sn-border)}
.sn-section-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;padding:14px 0;font-family:var(--sn-font-display);font-size:clamp(20px,3.5vw,32px);font-weight:500;letter-spacing:-.02em;color:var(--sn-text);background:none;border:none;cursor:pointer;text-align:left}
.sn-section-toggle:hover{opacity:.7}
.sn-section-toggle .sn-section-label{flex:1}
.sn-section-chevron{width:14px;height:14px;border-right:2px solid var(--sn-text);border-bottom:2px solid var(--sn-text);transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s ease;flex-shrink:0;margin-left:14px}
.sn-section.is-open .sn-section-chevron{transform:rotate(225deg) translate(-2px,-2px)}

.sn-section-items{max-height:0;overflow:hidden;transition:max-height .35s ease,opacity .25s ease;opacity:0}
.sn-section.is-open .sn-section-items{max-height:1500px;opacity:1}
.sn-section-items-inner{padding:2px 0 16px 0;display:flex;flex-direction:column;gap:0}
.sn-section-intro{font-family:var(--sn-font-body);font-size:14px;line-height:1.5;color:var(--sn-muted);margin:0 0 8px;opacity:.9}
.sn-section-items a{font-family:var(--sn-font-display);font-size:16px;font-weight:400;color:var(--sn-text);padding:8px 0;text-decoration:none;border-bottom:none;display:block;line-height:1.5;opacity:.85}
.sn-section-items a:hover{opacity:1;border-bottom:none}
.sn-section-items a.is-active{font-weight:600;opacity:1}
.sn-section-items a.is-active::before{content:"›  ";color:var(--sn-muted)}

/* Mobile */
@media (max-width:768px){
  [data-site-nav]{padding:14px 0}
  .sn-bar{padding:0 24px}
  .sn-center{display:none}
  .sn-overlay{padding:80px 24px 32px}
  .sn-top-link{font-size:clamp(20px,5.5vw,28px)}
  .sn-section-toggle{font-size:clamp(18px,4.5vw,24px)}
}
@media (max-width:480px){
  .sn-overlay{padding:70px 16px 24px}
}

body.sn-locked{overflow:hidden}

/* ── FOOTER unifié ── */
[data-site-footer]{display:block;padding:80px 0;font-family:var(--sn-font-display)}
.sn-footer-inner{max-width:1400px;margin:0 auto;padding:0 48px}
.sn-footer-grid{display:grid;grid-template-columns:1.6fr repeat(5, 1fr);gap:36px;margin-bottom:48px}
.sn-footer-section h3{font-family:var(--sn-font-display);font-size:13px;font-weight:600;margin-bottom:18px;text-transform:uppercase;letter-spacing:.1em;color:var(--sn-muted)}
.sn-footer-section p{font-family:var(--sn-font-body);font-size:14px;line-height:1.6;color:var(--sn-muted);margin:0}
.sn-footer-links{display:flex;flex-direction:column;gap:8px}
.sn-footer-links a{font-size:14px;color:var(--sn-muted);border-bottom:none;text-decoration:none;line-height:1.6}
.sn-footer-links a:hover{color:var(--sn-text);border-bottom:none}
.sn-footer-bottom{padding-top:32px;border-top:1px solid var(--sn-border);font-size:13px;color:var(--sn-muted);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
@media (max-width:1100px){
  .sn-footer-grid{grid-template-columns:repeat(3,1fr);gap:32px}
}
@media (max-width:900px){
  .sn-footer-grid{grid-template-columns:repeat(2,1fr);gap:36px}
  [data-site-footer]{padding:56px 0}
  .sn-footer-inner{padding:0 24px}
}
@media (max-width:520px){
  .sn-footer-grid{grid-template-columns:1fr;gap:32px;margin-bottom:32px}
}

/* Loupe à droite de la barre de recherche (le logo reste à gauche) */
.sn-search-icon{flex-shrink:0;margin-right:6px;color:var(--sn-muted);pointer-events:none}

/* Les vrais boutons accessibilité/notes restent en place dans le DOM (le
   composant Notes est un island Svelte hydraté côté client) mais sont masqués
   sur place : un bouton-proxy dans la nav (.sn-embedded-fab) relaie le clic.
   Glissent hors/dans la marge (au lieu d'un display:none instantané) quand ils
   remplacent la barre supérieure au scroll. */
#toolkit-trigger, .drawer-toggle { transition: transform 280ms ease, opacity 280ms ease; }
#toolkit-trigger.sn-fab-hidden, .drawer-toggle.sn-fab-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateX(120%);
}
.sn-embedded-fab{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:var(--sn-text);color:var(--sn-bg);border:none;cursor:pointer;flex-shrink:0;padding:0}
.sn-embedded-fab svg{width:18px;height:18px}