/* The menu bar of mabido.com's homepage: one stylesheet for the homepage, the React pages and the static pages.
   Markup: <header class="top site-bar"> (see the homepage, public/group/index.html, and HomepageNav). */
header.site-bar{position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;gap:30px;padding:16px max(20px,4vw);transition:background .35s,border-color .35s,transform .3s;border-bottom:1px solid transparent;font-family:Inter,system-ui,sans-serif;color:#edf2ea;box-sizing:border-box;background:#07080a}
header.site-bar.hide{transform:translateY(-110%)}
header.site-bar.solid{background:#07080ad9;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:rgba(237,242,234,.13)}
header.site-bar{padding-left:max(max(20px,4vw),calc((100% - 1280px) / 2 + max(20px,4vw)))!important;padding-right:max(max(20px,4vw),calc((100% - 1280px) / 2 + max(20px,4vw)))!important}
header.site-bar .brand{display:flex;align-items:center;gap:10px;font:400 30px/1 "Instrument Serif",Georgia,serif;letter-spacing:.12em;text-decoration:none;color:#edf2ea}
header.site-bar .brand::before{content:"";width:9px;height:9px;border-radius:50%;background:#a3ff47;box-shadow:0 0 12px #a3ff47;animation:site-bar-blink 3s infinite}
@keyframes site-bar-blink{50%{opacity:.35}}
header.site-bar .nav{display:flex;gap:26px;margin-left:auto;align-items:center}
header.site-bar .nav a,header.site-bar .navm summary{position:relative;font:500 12px "DM Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#d4dbd1;text-decoration:none;padding:6px 0;white-space:nowrap;cursor:pointer;list-style:none}
header.site-bar .nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:#a3ff47;transition:right .35s}
header.site-bar .nav a:hover,header.site-bar .navm summary:hover,header.site-bar .navm[open] summary{color:#a3ff47}
header.site-bar .nav a:hover::after{right:0}
header.site-bar .nav a.ext::before{content:"↗ ";color:#a3ff47}
header.site-bar .navm{position:relative}
header.site-bar .navm summary::-webkit-details-marker{display:none}
header.site-bar .navm-pop{position:absolute;top:100%;left:-12px;margin-top:8px;display:flex;flex-direction:column;gap:2px;min-width:240px;padding:8px;background:#07080ad9;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(237,242,234,.13);z-index:40}
header.site-bar .navm-pop a{display:block;padding:9px 12px;white-space:nowrap;font:500 12px "DM Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#d4dbd1;text-decoration:none}
header.site-bar .navm-pop a::after{display:none}
header.site-bar .navm-pop a:hover{color:#a3ff47}
header.site-bar .login{font:600 14px Inter,sans-serif;color:#edf2ea;text-decoration:none;padding:9px 14px;border-radius:99px;border:1px solid rgba(237,242,234,.2);white-space:nowrap;transition:border-color .25s,color .25s}
header.site-bar .login:hover{border-color:#a3ff47;color:#a3ff47}
header.site-bar .btn-sm{font:600 14px Inter,sans-serif;padding:10px 18px;border-radius:99px;background:#a3ff47;color:#07080a;text-decoration:none;white-space:nowrap}
header.site-bar .lsw{position:relative;flex:none}
header.site-bar .lsw-b{display:inline-flex;align-items:center;gap:6px;font:500 12px "DM Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#d4dbd1;background:transparent;border:1px solid rgba(237,242,234,.2);border-radius:99px;padding:8px 12px;cursor:pointer;transition:border-color .25s,color .25s}
header.site-bar .lsw-b:hover,header.site-bar .lsw.open .lsw-b{border-color:#a3ff47;color:#a3ff47}
header.site-bar .lsw-b span{font-size:10px;letter-spacing:0}
header.site-bar .lsw-l{position:absolute;top:calc(100% + 10px);right:0;z-index:50;margin:0;padding:6px;list-style:none;min-width:200px;max-height:min(70vh,520px);overflow:auto;background:#0e100ff2;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(237,242,234,.13);border-radius:14px;box-shadow:0 24px 60px -20px #000}
header.site-bar .lsw-l a,header.site-bar .lsw-l button{width:100%;background:none;border:0;display:block;display:block;padding:9px 12px;border-radius:9px;font:500 14px/1.3 Inter,system-ui,sans-serif;color:#edf2ea;text-decoration:none;text-align:start;cursor:pointer}
header.site-bar .lsw-l a:hover,header.site-bar .lsw-l button:hover{background:#ffffff10;color:#a3ff47}
header.site-bar .lsw-l a.cur,header.site-bar .lsw-l button.cur{color:#a3ff47}
header.site-bar .lsw-l a.cur::after,header.site-bar .lsw-l button.cur::after{content:" ●";font-size:8px;vertical-align:middle}
@media (max-width:1560px){header.site-bar .nav{gap:18px}header.site-bar .nav a{letter-spacing:.08em}}
@media (max-width:1380px){header.site-bar .nav a[href*="exemples"]{display:none}}
@media (max-width:980px){header.site-bar .nav{display:none}header.site-bar .login{display:none}header.site-bar .lsw{margin-inline-start:auto}header.site-bar .lsw-b{padding:7px 10px}}
@media (max-width:480px){header.site-bar{gap:10px}header.site-bar .lsw-b{padding:6px 8px;letter-spacing:.08em}}

/* One arrow to go back to the top, bottom left, on every page (static pages and React pages) */
.site-to-top,
.site-scroll-top-fab,
.iap__to-top{left:20px!important;right:auto!important;bottom:20px!important}
.site-to-top{position:fixed;z-index:90;width:44px;height:44px;border-radius:50%;background:#a3ff47;color:#07080a;display:grid;place-items:center;text-decoration:none;font:800 22px/1 Inter,system-ui,sans-serif;box-shadow:0 10px 30px rgba(163,255,71,.35)}