/* ═══════════════════════════════════════════════════════════════════════════
   Amberald: shared stylesheet for the legal pages (imprint, privacy, terms).

   The landing page carries its own CSS inline, because it is one page with one
   very specific design. The legal pages are three plain documents that must
   look identical to each other; a shared file is the only way that stays true
   when one of them is edited. The palette is the amber half of the brand; the
   emerald half belongs to the develop module and has nothing to say here.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --bg:#0c0b09;
  --bg-soft:#100f0c;
  --panel:#161411;
  --line:#2a2620;
  --line-soft:#211e19;
  --text:#ede9e2;
  --muted:#a49d90;
  --faint:#6f6a60;
  --amber:#e79721;
  --amber-bright:#ffc770;
  --radius:14px;
  --font-body:ui-sans-serif,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-display:Georgia,"Times New Roman",ui-serif,serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Mono","JetBrains Mono",Menlo,Consolas,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
body{
  background:var(--bg);color:var(--text);
  font-family:var(--font-body);font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
::selection{background:color-mix(in srgb,var(--amber) 35%,transparent)}
a{color:var(--amber-bright);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:99;background:var(--panel);border:1px solid var(--line);padding:10px 16px;border-radius:8px}

/* ---------- header ---------- */
header.top{border-bottom:1px solid var(--line-soft);background:var(--bg-soft)}
header.top .bar{
  max-width:820px;margin:0 auto;padding:16px 28px;
  display:flex;align-items:center;gap:20px;
}
.brand{
  display:inline-flex;align-items:center;gap:11px;color:var(--text);
  font-family:var(--font-display);font-weight:700;font-size:1.14rem;letter-spacing:.02em;
}
.brand:hover{text-decoration:none}
.brand img{width:26px;height:26px;border-radius:7px}
.spacer{flex:1}
.lang{display:flex;border:1px solid var(--line);border-radius:99px;overflow:hidden;font-size:.78rem;font-family:var(--font-mono)}
.lang button{background:none;border:0;color:var(--faint);padding:6px 12px;cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--panel);color:var(--text)}

/* ---------- document ---------- */
main{max-width:820px;margin:0 auto;padding:64px 28px 110px}
h1{font-family:var(--font-display);font-weight:700;font-size:clamp(1.9rem,4vw,2.5rem);letter-spacing:-0.015em;line-height:1.15}
h2{
  font-family:var(--font-display);font-weight:700;font-size:1.35rem;line-height:1.25;
  margin:52px 0 14px;padding-top:26px;border-top:1px solid var(--line-soft);
}
h3{font-family:var(--font-body);font-weight:700;font-size:1.02rem;margin:26px 0 8px}
p{color:var(--muted);margin-bottom:15px}
p strong,li strong{color:var(--text);font-weight:650}
.lead{
  color:var(--muted);font-size:1.05rem;margin:16px 0 8px;
  padding-bottom:8px;
}
ul,ol{color:var(--muted);margin:0 0 15px 22px}
li{margin-bottom:8px}
code{font-family:var(--font-mono);font-size:.88em;color:var(--text);background:var(--panel);padding:2px 6px;border-radius:5px}
address{font-style:normal;color:var(--muted)}
.note{
  background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--amber);
  border-radius:var(--radius);padding:20px 24px;margin:24px 0;
}
.note p:last-child{margin-bottom:0}
.updated{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-top:10px}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);margin:22px 0}
table{width:100%;border-collapse:collapse;background:var(--panel);min-width:460px}
th,td{padding:13px 18px;text-align:left;font-size:.93rem;border-bottom:1px solid var(--line-soft);color:var(--muted);vertical-align:top}
tr:last-child td,tr:last-child th{border-bottom:0}
th{color:var(--text);font-weight:650;white-space:nowrap}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line-soft);padding:36px 0 60px;font-size:.86rem;color:var(--faint)}
footer .bar{max-width:820px;margin:0 auto;padding:0 28px;display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap}
footer nav{display:flex;gap:20px;flex-wrap:wrap}
footer a{color:var(--faint)}
footer a:hover{color:var(--muted)}
