/* Octavisualizer — shared styles for legal / compliance pages.
   Tokens, header and footer mirror index.html. */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ── LIGHT (default) ────────────────────────────── */
:root{
  color-scheme:light;
  --bg:#FBFAF8;
  --surface:#FFFFFF;
  --badge:#F3F1EC;
  --border:#E4E1DA;
  --border-soft:#EAE7E0;
  --line:#D5D1C8;
  --text:#14130F;
  --body:#56544D;
  --dim:#6F6C64;
  --label:#75726A;
  --faint:#7B786F;
}

/* ── DARK ───────────────────────────────────────── */
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0c0c0c;
  --surface:#141414;
  --badge:#1a1a1a;
  --border:#222222;
  --border-soft:#1e1e1e;
  --line:#333333;
  --text:#f0f0f0;
  --body:#aaaaaa;
  --dim:#888888;
  --label:#666666;
  --faint:#555555;
}

html{-webkit-text-size-adjust:100%;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  transition:background-color 0.2s ease,color 0.2s ease;
}

.page{display:flex;flex-direction:column;min-height:100vh;}

.skip-link{position:absolute;left:-9999px;top:0;background:var(--text);color:var(--bg);padding:0.625rem 1rem;font-size:0.8125rem;z-index:20;}
.skip-link:focus{left:0.75rem;top:0.75rem;}

/* ── HEADER ─────────────────────────────────────── */
header{border-bottom:1px solid var(--border-soft);}
header > .wrap{max-width:1100px;margin:0 auto;padding:0 2rem;height:4.5rem;display:flex;align-items:center;justify-content:space-between;}
.logo{display:inline-flex;align-items:center;gap:0.5rem;font-size:1rem;font-weight:600;letter-spacing:-0.01em;color:var(--text);text-decoration:none;}
.logo svg{width:18px;height:18px;flex-shrink:0;}
.header-mail{font-size:0.875rem;color:var(--label);text-decoration:none;transition:color 0.15s;}
.header-mail:hover{color:var(--text);}

/* ── THEME TOGGLE ───────────────────────────────── */
.header-right{display:flex;align-items:center;gap:1.25rem;}
.theme-toggle{
  position:relative;
  display:inline-flex;align-items:center;
  width:52px;height:28px;padding:0;
  background:var(--badge);
  border:1px solid var(--border);
  border-radius:999px;
  cursor:pointer;
  transition:background 0.2s,border-color 0.2s;
}
.theme-toggle:hover{border-color:var(--line);}
.theme-toggle:focus-visible{outline:2px solid var(--line);outline-offset:2px;}
.toggle-thumb{
  position:absolute;top:2px;left:2px;
  width:22px;height:22px;border-radius:50%;
  background:var(--surface);
  border:1px solid var(--border-soft);
  transition:transform 0.2s ease;
}
:root[data-theme="dark"] .toggle-thumb{transform:translateX(24px);}
.toggle-icon{
  position:relative;z-index:1;
  flex:1;display:flex;align-items:center;justify-content:center;
  color:var(--label);
  transition:color 0.2s;
}
.toggle-icon svg{width:13px;height:13px;display:block;}
.theme-toggle .icon-sun{color:var(--text);}
:root[data-theme="dark"] .theme-toggle .icon-sun{color:var(--label);}
:root[data-theme="dark"] .theme-toggle .icon-moon{color:var(--text);}

/* ── DOCUMENT ───────────────────────────────────── */
main{flex:1;}
main > .wrap{max-width:1100px;margin:0 auto;padding:4rem 2rem 6rem;}
.doc{max-width:720px;}

.meta{
  display:inline-block;
  font-size:0.8125rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--label);margin-bottom:1.25rem;
}
h1{
  font-size:clamp(2rem,4vw,3rem);
  font-weight:700;letter-spacing:-0.03em;line-height:1.1;
  color:var(--text);
  padding-bottom:2rem;margin-bottom:2rem;
  border-bottom:1px solid var(--border-soft);
}
h2{
  font-size:1.0625rem;font-weight:600;letter-spacing:-0.01em;
  color:var(--text);
  margin:2.75rem 0 0.75rem;
}
p{font-size:0.9375rem;line-height:1.7;color:var(--body);margin-bottom:0.875rem;}
.lede{font-size:1rem;line-height:1.7;color:var(--body);}
strong{color:var(--text);font-weight:600;}

ul{list-style:none;margin:0 0 0.875rem;padding:0;}
ul li{
  position:relative;
  font-size:0.9375rem;line-height:1.7;color:var(--body);
  padding-left:1.125rem;margin-bottom:0.5rem;
}
ul li::before{content:'';position:absolute;left:0;top:0.7rem;width:5px;height:1px;background:var(--label);}

main a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--line);transition:border-color 0.15s,color 0.15s;}
main a:hover{color:var(--dim);border-bottom-color:var(--dim);}

/* ── TABLE ──────────────────────────────────────── */
table{
  width:100%;border-collapse:collapse;margin:1.75rem 0;
  background:var(--surface);border:1px solid var(--border);border-radius:6px;overflow:hidden;
}
th{
  text-align:left;padding:0.75rem 1.125rem;
  background:var(--badge);
  font-size:0.8125rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--label);
  border-bottom:1px solid var(--border);
}
td{
  padding:0.8125rem 1.125rem;border-bottom:1px solid var(--border-soft);
  font-size:0.9375rem;color:var(--body);
}
td:first-child{color:var(--label);width:42%;}
tbody tr:last-child td{border-bottom:none;}

/* ── CALLOUT ────────────────────────────────────── */
.highlight{
  background:var(--surface);border:1px solid var(--border-soft);border-left:2px solid var(--line);
  border-radius:0 6px 6px 0;padding:1.25rem 1.5rem;margin:1.75rem 0;
}
.highlight p{margin-bottom:0;}

/* ── CONTACT BLOCK ──────────────────────────────── */
.contact-block{
  background:var(--surface);border:1px solid var(--border-soft);border-radius:6px;
  padding:1.5rem;margin-top:1.25rem;
  font-size:0.9375rem;line-height:1.9;color:var(--body);
}

/* ── FOOTER ─────────────────────────────────────── */
footer{border-top:1px solid var(--border-soft);padding:3rem 0;}
footer > .wrap{max-width:1100px;margin:0 auto;padding:0 2rem;}
.footer-links{display:flex;flex-wrap:wrap;gap:1.75rem;}
.footer-links a{font-size:0.8125rem;color:var(--faint);text-decoration:none;transition:color 0.15s;}
.footer-links a:hover{color:var(--text);}
.footer-links a.is-current{color:var(--body);}
.footer-bottom{
  margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border-soft);
  font-size:0.8125rem;line-height:1.7;color:var(--faint);
}

/* ── RESPONSIVE ─────────────────────────────────── */
@media(max-width:768px){
  header > .wrap{padding:0 1.5rem;height:4rem;}
  .header-mail{display:none;}
  main > .wrap{padding:2.5rem 1.5rem 4rem;}
  footer > .wrap{padding:0 1.5rem;}
  footer{padding:2.5rem 0;}
  .footer-links{gap:1.25rem;}

  table,tbody,tr,td{display:block;}
  thead{display:none;}
  td{border-bottom:none;padding:0.25rem 1.125rem;}
  td:first-child{width:auto;padding-top:0.875rem;font-size:0.8125rem;letter-spacing:0.08em;text-transform:uppercase;}
  tr{border-bottom:1px solid var(--border-soft);padding-bottom:0.75rem;}
  tbody tr:last-child{border-bottom:none;}
}

@media(prefers-reduced-motion:reduce){
  body{transition:none;}
}