/* Netora World — barre de navigation, pied de page et bouton lune/soleil, communs à toutes les pages.
   Toutes les règles sont limitées à .nav, .foot et .skip : rien ne déborde sur le contenu des pages
   (la page Suite EduPrivacy garde ainsi exactement son propre style).
   Thème : <html data-theme="dark|light">. Le mode clair n'existe pour l'instant que sur la page Suite EduPrivacy. */
:root {
  --nw-bg: #050706;
  --nw-panel: rgba(5, 7, 6, .78);
  --nw-panel-solid: rgba(5, 7, 6, .97);
  --nw-line: rgba(255, 255, 255, .07);
  --nw-line-g: rgba(74, 222, 128, .18);
  --nw-ink: #f5fbf7;
  --nw-ink-2: rgba(245, 251, 247, .74);
  --nw-ink-3: rgba(245, 251, 247, .6);
  --nw-g: #4ade80;
  --nw-g-bright: #6dffa3;
  --nw-g-text: #4ade80;
  --nw-sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --nw-mono: 'Geist Mono', ui-monospace, 'SF Mono', monospace;
}
html[data-theme="light"] {
  --nw-bg: #ffffff;
  --nw-panel: rgba(255, 255, 255, .94);
  --nw-panel-solid: rgba(255, 255, 255, .99);
  --nw-line: #e2e7ee;
  --nw-line-g: rgba(22, 163, 74, .28);
  --nw-ink: #0f2a4a;
  --nw-ink-2: #34465c;
  --nw-ink-3: #5b6778;
  --nw-g-text: #15803d;
}
html { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }
body { margin: 0; background: var(--nw-bg); }

.nav, .nav *, .foot, .foot *, .skip { box-sizing: border-box; margin: 0; padding: 0; }
.nav, .foot { font: 16px/1.55 var(--nw-sans); letter-spacing: -.011em; color: var(--nw-ink); -webkit-font-smoothing: antialiased; }
.nav a, .foot a { color: inherit; text-decoration: none; }
.nav img, .foot img { max-width: 100%; display: block; }
.nav :focus-visible, .foot :focus-visible, .skip:focus-visible { outline: 2px solid var(--nw-g); outline-offset: 3px; border-radius: 4px; }
.nav .wrap, .foot .wrap { width: min(1160px, 100% - 32px); margin-inline: auto; }

.skip { position: absolute; inset-inline-start: 12px; top: -60px; z-index: 100; background: var(--nw-g); color: #062012; padding: 10px 14px; border-radius: 10px; font: 700 14px var(--nw-sans); text-decoration: none; }
.skip:focus { top: 12px; }

/* Barre de navigation */
.nav { position: sticky; top: 0; z-index: 60; background: var(--nw-panel); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--nw-line); }
.nav .nav-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 68px; }
.nav .brand, .foot .brand { display: inline-flex; align-items: center; gap: 8px; flex: none; }
.nav .brand img { width: 108px; height: auto; }
.foot .brand img { width: 96px; height: auto; }
.nav .brand span, .foot .brand span { font: 500 10px var(--nw-mono); letter-spacing: .22em; color: var(--nw-g-text); border: 1px solid var(--nw-line-g); border-radius: 6px; padding: 3px 6px 2px; }
.nav .nav-links { display: flex; align-items: center; gap: 22px; font-size: 14px; color: var(--nw-ink-2); }
.nav .nav-links > a:not(.nav-cta) { position: relative; white-space: nowrap; padding-block: 6px; }
.nav .nav-links > a:not(.nav-cta):hover, .nav .nav-links > a[aria-current] { color: var(--nw-ink); }
.nav .nav-links > a[aria-current]::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 2px; border-radius: 2px; background: var(--nw-g); }
.nav .soon { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--nw-ink-3); cursor: default; }
.nav .soon small { font: 500 9px var(--nw-mono); letter-spacing: .12em; text-transform: uppercase; border: 1px solid var(--nw-line); border-radius: 999px; padding: 2px 6px; }
.nav .langs { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--nw-line); border-radius: 999px; }
.nav .langs a { font: 500 11px var(--nw-mono); padding: 4px 8px; border-radius: 999px; color: var(--nw-ink-3); }
.nav .langs a[aria-current] { background: rgba(74, 222, 128, .12); color: var(--nw-g-text); }
.nav .nav-cta { display: inline-flex; align-items: center; justify-content: center; padding: 9px 16px; border-radius: 10px; background: var(--nw-g); color: #052e1a; font-weight: 700; font-size: 13px; white-space: nowrap; box-shadow: 0 0 0 1px rgba(109, 255, 163, .4), 0 10px 30px -10px rgba(74, 222, 128, .6); transition: background .15s; }
.nav .nav-cta:hover { background: var(--nw-g-bright); }
.nav .nav-toggle { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nav .nav-burger { display: none; width: 42px; height: 42px; border: 1px solid var(--nw-line); border-radius: 10px; cursor: pointer; flex-direction: column; justify-content: center; align-items: center; gap: 4px; }
.nav .nav-burger i { display: block; width: 18px; height: 2px; background: var(--nw-ink); border-radius: 2px; transition: .2s; }
.nav .nav-toggle:focus-visible ~ .nav-right .nav-burger { outline: 2px solid var(--nw-g); outline-offset: 2px; }
.nav .nav-right { display: flex; align-items: center; gap: 10px; }

/* Bouton lune / soleil */
.theme-btn { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--nw-line); background: transparent; color: var(--nw-ink); cursor: pointer; padding: 0; transition: background .15s, border-color .15s; }
.theme-btn:hover { border-color: var(--nw-line-g); background: rgba(74, 222, 128, .08); }
.theme-btn svg { width: 18px; height: 18px; }
.theme-btn .i-sun { display: none; }
html[data-theme="dark"] .theme-btn .i-sun { display: block; }
html[data-theme="dark"] .theme-btn .i-moon { display: none; }

/* Pied de page */
.foot { position: relative; z-index: 1; border-top: 1px solid var(--nw-line); padding-block: 40px 28px; background: var(--nw-bg); }
.foot .foot-in { display: flex; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.foot .foot-in p { margin-top: 12px; font-size: 14px; color: var(--nw-ink-3); }
.foot .foot-links { display: flex; flex-wrap: wrap; gap: 10px 26px; font-size: 14px; color: var(--nw-ink-2); align-items: center; }
.foot .foot-links a:hover { color: var(--nw-g-text); }
.foot .foot-bottom { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--nw-line); font-size: 13px; color: var(--nw-ink-3); }

@media (max-width: 1080px) {
  .nav .nav-burger { display: flex; }
  .nav .nav-links { position: absolute; inset-inline: 0; top: 68px; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 16px 18px; background: var(--nw-panel-solid); border-bottom: 1px solid var(--nw-line); display: none; max-height: calc(100vh - 68px); overflow-y: auto; }
  .nav .nav-links > a:not(.nav-cta), .nav .nav-links > .soon { padding: 14px 4px; border-bottom: 1px solid var(--nw-line); font-size: 16px; }
  .nav .nav-links > a[aria-current]::after { display: none; }
  .nav .nav-links .langs { align-self: flex-start; margin: 14px 0; }
  .nav .nav-links .nav-cta { margin-top: 12px; padding: 14px; font-size: 15px; }
  .nav .nav-toggle:checked ~ .nav-links { display: flex; }
  .nav .nav-toggle:checked ~ .nav-right .nav-burger i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .nav .nav-toggle:checked ~ .nav-right .nav-burger i:nth-child(2) { opacity: 0; }
  .nav .nav-toggle:checked ~ .nav-right .nav-burger i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}
@media (prefers-reduced-motion: reduce) { .nav *, .foot * { transition: none !important; } }