/* Sauge du soir (dark, default) + Sauge (light): tokens only */
:root{
  --bg:#0E1110;--surface:#212624;--surface-2:#2A302D;--surface-3:#3A423E;
  --line:#363E3A;--line-strong:#58615C;
  --text:#DCE2DE;--text-2:#A1AAA4;--text-3:#8F9993;
  --accent:#5DB880;--accent-hover:#6CCB8E;--accent-ink:#0F1F15;
  --accent-soft:#26382D;--accent-soft-ink:#9BE0B3;
  --brand:#13B26F;--nav-on:#2A302D;--nav-on-ink:#E8EEEA;
  --warn:#453B24;--warn-ink:#E3C98A;
  --r-sm:14px;--r-md:20px;--r-lg:28px;--r-pill:999px;
  --f-title:'Fredoka',system-ui,sans-serif;--f-text:'Nunito Sans',system-ui,sans-serif;
  /* public site showcase: scenes, glass, illustration (same in both themes) */
  --sc-strong:#EEF3EF;--sc-soft:#C2CBC5;--sc-mint:#C7F0D5;--sc-heart:#E4ECE5;--sc-pressed:#2F5A40;--sc-deep:#0F1F15;
  --sc-peche:#E8C3A6;--sc-sable:#D2B98C;--sc-peche-fort:#F3DCC8;--sc-peche-doux:#C9B8A8;--sc-brun:#3A322B;
  --sc-ink:#FFFFFF;--sc-shadow:#000000;--sc-jauge-mi:#E3A350;--sc-jauge-fin:#E07A63;
  --glass-hi:rgba(255,255,255,.13);--glass-lo:rgba(255,255,255,.04);--glass-line:rgba(255,255,255,.16);--glass-shine:rgba(255,255,255,.18);--glass-shadow:rgba(0,0,0,.42);
  --veil:rgba(10,14,12,.55);--sheet:rgba(33,38,36,.92);
  --ill-tan:#D2B98C;--ill-tan-2:#8A6F4A;--ill-denim:#4F79A8;--ill-before:#4A4540;--ill-before-2:#24221F;--ill-after:#F4F2EC;--ill-after-2:#D3D7CD;
  --ill-white:rgba(255,255,255,.78);--ill-seam:rgba(0,0,0,.18);--ill-ink:#141A18;--ill-knob:#EEF3EF;--ill-knob-ink:#2A302C;
  --ill-tag:rgba(0,0,0,.5);--ill-tag-ink:#DCE2DE;--ill-tag-ok:#26382D;--ill-tag-ok-ink:#C7F0D5;
  --ill-avatar:#E8C3A6;--ill-avatar-2:#B98E6E;--ill-avatar-ink:#3A322B;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#DCDDD5;--surface:#F1F0EA;--surface-2:#E4E5DD;--surface-3:#D3D5CC;
  --line:#D6D7CF;--line-strong:#A9ADA3;
  --text:#2A302C;--text-2:#59615B;--text-3:#555D57;
  --accent:#2E6B45;--accent-hover:#275C3B;--accent-ink:#F1F0EA;
  --accent-soft:#D5E3D3;--accent-soft-ink:#1F4A30;
  --nav-on:#D5E3D3;--nav-on-ink:#1F4A30;
  --warn:#EDE0BE;--warn-ink:#6A4E0E;
  --sc-strong:#1E2420;--sc-soft:#3F4842;--sc-mint:#1F4A30;--sc-heart:#2A302C;--sc-pressed:#BFD6C3;--sc-deep:#E4EDE2;
  --sc-peche:#8F4F22;--sc-sable:#7E5F22;--sc-peche-fort:#6E3B18;--sc-peche-doux:#7A5C44;--sc-brun:#F3E6D8;
  --sc-ink:#1E2420;--sc-shadow:#2A302C;--sc-jauge-mi:#B5651D;--sc-jauge-fin:#B8432F;
  --glass-hi:rgba(255,255,255,.72);--glass-lo:rgba(255,255,255,.42);--glass-line:rgba(30,36,32,.12);--glass-shine:rgba(255,255,255,.9);--glass-shadow:rgba(40,48,42,.16);
  --veil:rgba(40,48,42,.35);--sheet:rgba(241,240,234,.96);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 var(--f-text)}
a{color:var(--accent);font-weight:700}
a:hover{color:var(--accent-hover)}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
/* top bar */
.top{position:sticky;top:0;z-index:10;background:var(--bg);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:8px 16px;min-height:68px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.logo{display:inline-flex;align-items:center;gap:8px;color:var(--text);text-decoration:none;font:700 24px var(--f-title)}
.top .grow{flex:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r-pill);border:0;font:700 15px var(--f-text);cursor:pointer;text-decoration:none;white-space:nowrap}
.btn.primary{background:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{background:var(--accent-hover);color:var(--accent-ink)}
.btn.ghost{background:transparent;color:var(--text-2)}
.btn.ghost:hover{background:var(--surface-2);color:var(--text)}
.btn.icon{width:44px;padding:0}
/* page title + tabs */
.hero{padding:32px 0 8px}
.hero h1{margin:0;font:600 34px/1.2 var(--f-title)}
.hero p{margin:6px 0 0;color:var(--text-2)}
.hero .row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;margin:20px 0 24px}
@media (min-width:901px){.tabs{flex-wrap:wrap}}
.tabs a{min-height:44px;padding:0 11px;display:inline-flex;align-items:center;color:var(--text-2);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs a:hover{color:var(--text)}
.tabs a.on{color:var(--text);border-bottom-color:var(--accent)}
.todo-note{display:none;margin:0 0 20px;padding:14px 16px;border-radius:var(--r-md);background:var(--warn);color:var(--warn-ink);font-size:14px}
.todo-note.show{display:block}
/* one document: table of contents + paper */
.doc{display:grid;grid-template-columns:250px minmax(0,1fr);gap:20px;align-items:start;margin-bottom:40px}
.toc{position:sticky;top:88px;max-height:calc(100vh - 108px);overflow-y:auto;display:flex;flex-direction:column;gap:2px;background:var(--surface);border-radius:var(--r-lg);padding:16px 10px}
.toc b{padding:0 10px 6px;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3)}
.toc a{padding:8px 10px;border-radius:var(--r-sm);color:var(--text-2);text-decoration:none;font-size:14px;font-weight:600;line-height:1.3}
.toc a:hover{background:var(--surface-2);color:var(--text)}
.toc a.on{background:var(--nav-on);color:var(--nav-on-ink)}
.paper{background:var(--surface);border-radius:var(--r-lg);padding:28px 32px;max-width:860px;min-width:0}
.doc-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;margin-bottom:14px}
.doc-head h2{margin:0;font:600 26px/1.25 var(--f-title)}
.meta{font-size:13px;color:var(--text-3)}
.brief{background:var(--accent-soft);color:var(--accent-soft-ink);border-radius:var(--r-md);padding:14px 18px;margin-bottom:8px}
.brief>b{font:600 17px var(--f-title)}
.brief ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.brief li{position:relative;padding-left:26px}
.brief li::before{content:"✓";position:absolute;left:2px;font-weight:800}
.brief a,.brief b{color:inherit}
section{scroll-margin-top:96px;padding-top:16px;margin-top:14px;border-top:1px solid var(--line)}
section h3{margin:0 0 6px;font:600 18px/1.3 var(--f-title)}
section p{margin:0 0 10px;color:var(--text-2)}
section ul,section ol{margin:0 0 10px;padding-left:20px;color:var(--text-2);display:flex;flex-direction:column;gap:4px}
section b{color:var(--text)}
.todo{background:var(--warn);color:var(--warn-ink);border-radius:6px;padding:1px 6px;font-weight:700}
.tbl-wrap{overflow-x:auto;margin:4px 0 12px;border:1px solid var(--line);border-radius:var(--r-sm)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;padding:10px 12px;background:var(--surface-2);color:var(--text-3);font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.tbl td{padding:10px 12px;border-top:1px solid var(--line);vertical-align:top;color:var(--text-2)}
.tbl td:first-child{color:var(--text);font-weight:600}
.lg-form{border:1px dashed var(--line-strong);border-radius:var(--r-md);padding:14px 18px;margin-bottom:10px}
.lg-form p{margin:0 0 6px}
/* scrollbars: same as the dashboard (thin, rounded, accent on hover) */
::-webkit-scrollbar{width:12px;height:0}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:99px;border:3px solid transparent;background-clip:padding-box;min-height:40px}
::-webkit-scrollbar-thumb:hover{background:var(--accent);border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:active{background:var(--accent)}
::-webkit-scrollbar-corner{background:transparent}
.tbl-wrap::-webkit-scrollbar{height:12px}
/* the table of contents is a rounded card: keep its scrollbar inside the straight part of the edge */
.toc::-webkit-scrollbar-track{margin:var(--r-lg) 0}
@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}}
.tabs{scrollbar-width:none}
.foot{border-top:1px solid var(--line);padding:24px 0 40px;color:var(--text-3);font-size:14px}
.foot .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
@media (max-width:900px){
  .wrap{padding:0 16px}
  .doc{grid-template-columns:1fr}
  .toc{display:none}
  .paper{padding:20px 18px}
  .hero h1{font-size:28px}
  .doc-head h2{font-size:22px}
  .top .back span{display:none}
  .tbl{font-size:13px}
  .tbl th,.tbl td{padding:8px}
}
/* PDF: only the open document, black on white */
@media print{
  .top,.tabs,.toc,.hero .btn,.todo-note,.foot,.lg-print-hide{display:none!important}
  body,.paper{background:#fff;color:#000}
  .paper{padding:0;max-width:none}
  .doc{display:block}
  .paper *,.brief{color:#000!important;background:#fff!important}
  .brief,.todo{border:1px solid #000}
}

/* shared by every public page */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--accent);color:var(--accent-ink);padding:10px 16px;border-radius:var(--r-pill)}
.skip:focus{left:8px}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:var(--r-sm)}
.mainnav{display:flex;flex-wrap:wrap;gap:4px}
.mainnav a{min-height:44px;padding:0 12px;display:inline-flex;align-items:center;color:var(--text-2);text-decoration:none;border-radius:var(--r-pill)}
.mainnav a:hover{color:var(--text);background:var(--surface-2)}
.mainnav a[aria-current="page"]{color:var(--text);background:var(--nav-on)}
.lead{padding:56px 0 24px;max-width:760px}
.lead h1{margin:0 0 14px;font:600 44px/1.15 var(--f-title)}
.lead p{margin:0 0 20px;font-size:20px;color:var(--text-2)}
.lead .actions,.actions{display:flex;flex-wrap:wrap;gap:12px}
.btn.big{min-height:52px;padding:0 26px;font-size:17px}
h2.big{margin:48px 0 6px;font:600 30px/1.2 var(--f-title)}
p.sub{margin:0 0 20px;color:var(--text-2);font-size:17px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:8px}
.card{background:var(--surface);border-radius:var(--r-lg);padding:24px;display:flex;flex-direction:column;gap:8px}
.card h3{margin:0;font:600 22px/1.25 var(--f-title)}
.card p{margin:0;color:var(--text-2)}
.card .num{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent-soft-ink);font:600 22px var(--f-title)}
.price{font:600 44px/1.1 var(--f-title);color:var(--text)}
.price small{font:600 17px var(--f-text);color:var(--text-2)}
.card ul{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;color:var(--text-2)}
.card li{position:relative;padding-left:26px}
.card li::before{content:"✓";position:absolute;left:2px;font-weight:800;color:var(--accent)}
/* price not public before the opening: a blurred block, no figure in the page */
.price.bientot{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:4px 0 2px}
.price.bientot::before{content:"";width:132px;height:42px;border-radius:12px;background:linear-gradient(90deg,var(--surface-3),var(--surface-2),var(--surface-3));background-size:200% 100%;filter:blur(5px);opacity:.7;animation:prix-voile 2.6s ease-in-out infinite}
.price.bientot span{font:700 13px var(--f-text);color:var(--text-2);padding:5px 12px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line)}
@keyframes prix-voile{50%{background-position:100% 0}}
@media (prefers-reduced-motion:reduce){.price.bientot::before{animation:none}}
.card .year{color:var(--text-3);font-size:14px}
.soft{background:var(--accent-soft);color:var(--accent-soft-ink);border-radius:var(--r-lg);padding:20px 24px;margin:24px 0}
.soft b{font-family:var(--f-title);font-weight:600}
.plain{margin:0 0 14px}
details{background:var(--surface);border-radius:var(--r-md);padding:4px 18px;margin-bottom:8px}
details summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:700;color:var(--text)}
details p{margin:0 0 12px;color:var(--text-2)}
.fine{color:var(--text-3);font-size:14px}
.linkrow{display:flex;flex-wrap:wrap;gap:4px 18px}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--accent);cursor:pointer;text-decoration:underline}
.linkbtn:hover{color:var(--accent-hover)}
/* cookie information (CNIL: nothing non essential before a choice; refusing is as easy as accepting) */
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--surface-2);border-top:1px solid var(--line-strong);padding:14px 0}
.cookie-bar[hidden]{display:none}
.cookie-bar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.cookie-bar p{margin:0;flex:1 1 320px;color:var(--text)}
.cookie-bar .actions{gap:10px}
.cookie-bar .btn.alt{background:var(--surface-3);color:var(--text)}
.cookie-bar .btn.alt:hover{background:var(--line-strong)}
@media (max-width:900px){
  .grid3{grid-template-columns:1fr}
  .lead{padding-top:32px}
  .lead h1{font-size:32px}
  .lead p{font-size:18px}
  h2.big{font-size:26px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.cookie-bar,.mainnav,.skip{display:none!important}}

/* ---------- legal space: the documents menu on the left, the outline of the open one on the right ---------- */
.lg{padding-bottom:56px}
.lg-hero{position:relative;padding:40px 0 26px}
.lg-hero::before{content:"";position:absolute;z-index:-1;left:-120px;top:-60px;width:min(520px,80vw);height:300px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 16%,transparent),transparent);pointer-events:none}
.lg-kick{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0 12px;border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent-soft-ink);font:700 13px var(--f-text)}
.lg-hero h1{margin-top:12px;font-size:38px}
.lg-pdf{background:transparent;color:var(--text);border:1px solid var(--line-strong)}
.lg-pdf:hover{background:var(--surface);color:var(--text)}
.lg-corps{display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;align-items:start}
.lg-menu{position:sticky;top:96px;display:flex;flex-direction:column;gap:2px}
.lg-menu b{padding:0 12px 8px;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-3)}
.lg-menu a{display:flex;align-items:center;min-height:40px;padding:0 12px;border-radius:var(--r-sm);color:var(--text-2);text-decoration:none;font-size:15px;font-weight:600}
.lg-menu a:hover{background:var(--surface);color:var(--text)}
.lg-menu a.on{background:var(--nav-on);color:var(--nav-on-ink)}
.lg .doc{grid-template-columns:minmax(0,1fr) 210px;gap:28px;margin-bottom:0}
/* informations-legales holds several documents: only the open one shows (page.js) */
.lg-docs:has(.doc.on) .doc:not(.on){display:none}
.lg .toc{order:2;background:none;border-radius:0;padding:2px 0 2px 14px;border-left:1px solid var(--line)}
.lg .toc a{padding:6px 10px;font-size:13px}
.lg .paper{max-width:none;padding:32px 40px;border:1px solid var(--line)}
.lg .doc-head h2{font-size:30px}
@media (max-width:1180px){
  .lg .doc,.js .lg .doc.on{grid-template-columns:minmax(0,1fr)}
  .lg .toc{display:none}
}
@media (max-width:900px){
  .lg-hero{padding:28px 0 18px}
  .lg-hero h1{font-size:30px}
  .lg-corps{grid-template-columns:minmax(0,1fr);gap:16px}
  .lg-menu{position:static;flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:6px;margin:0 -16px;padding:0 16px}
  .lg-menu b{display:none}
  .lg-menu a{flex:none;min-height:40px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:14px}
  .lg .paper{padding:22px 18px}
  .lg .doc-head h2{font-size:24px}
}
/* footer: one button to the legal space */
.foot .wrap{justify-content:center}
.foot-legal{display:inline-flex;align-items:center;gap:4px;min-height:38px;padding:0 14px 0 18px;border-radius:var(--r-pill);background:var(--accent);color:var(--accent-ink);font:700 14px var(--f-text);text-decoration:none;box-shadow:0 6px 18px -8px var(--accent);transition:background .2s ease,transform .2s ease}
.foot-legal:hover{background:var(--accent-hover);color:var(--accent-ink)}
.foot-legal:active{transform:scale(.97)}
.foot-legal:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media print{.lg-menu,.lg-kick,.lg-hero::before{display:none!important}.lg-corps{display:block}}
