/*
  SITESCAN website — shared styles for index.html, thanks.html, privacy.html.
  Monochrome + one accent (orange), light and dark themes. No external fonts
  or files: everything here works offline from a double-click.
*/
:root, :root[data-theme="light"]{
  --bg:#ffffff; --panel:#f6f6f6; --panel-2:#ececec; --line:#d9d9d9;
  --ink:#141414; --dim:#666666;
  --accent:#ff6b1a; --accent-ink:#b34400; --accent-soft:rgba(255,107,26,.12);
  --device:#2b2b2b; --device-edge:#141414; --screen:#0d0d0d;
  --shadow:0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.08);
}
:root[data-theme="dark"]{
  --bg:#0f0f0f; --panel:#1a1a1a; --panel-2:#242424; --line:#2f2f2f;
  --ink:#ececec; --dim:#9a9a9a;
  --accent:#ff6b1a; --accent-ink:#ff8a45; --accent-soft:rgba(255,107,26,.16);
  --device:#3a3a3a; --device-edge:#5a5a5a; --screen:#050505;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35);
}
/* Hold the page back for a moment while a Danish visitor's text swaps in. */
html[data-lang-pending] body{ visibility:hidden; }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html,body{ margin:0; padding:0; }
body{
  background:var(--bg); color:var(--ink);
  font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size:16px; line-height:1.6;
}
h1,h2,h3{ line-height:1.2; margin:0; }
p{ margin:0 0 16px; }
a{ color:var(--accent-ink); text-decoration:underline; text-underline-offset:2px; }
a:hover{ opacity:.8; }
img{ max-width:100%; height:auto; }
svg text{ font-family:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }
[hidden]{ display:none !important; }
.accent-text{ color:var(--accent-ink); }

.wrap{ max-width:1120px; margin:0 auto; padding:0 24px; }

/* ---------- header ---------- */
.site-header{
  position:sticky; top:0; z-index:10;
  background:var(--bg); border-bottom:1px solid var(--line);
}
.site-header .wrap{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; padding-top:12px; padding-bottom:12px;
}
.wordmark{ font-size:20px; font-weight:800; letter-spacing:.08em; color:var(--ink); text-decoration:none; }
.wordmark:hover{ opacity:.8; }
.header-right{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

/* ---------- buttons & toggles ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:48px; padding:12px 22px; border-radius:10px;
  font-size:16px; font-weight:700; font-family:inherit; line-height:1.3;
  border:2px solid var(--line); background:var(--panel); color:var(--ink);
  cursor:pointer; text-decoration:none;
}
.btn:hover{ border-color:var(--accent-ink); opacity:1; }
.btn-primary{ background:var(--accent); border-color:var(--accent); color:#000; }
.btn-primary:hover{ filter:brightness(1.06); border-color:var(--accent); }

.toggle{
  display:inline-flex; align-items:center; gap:8px;
  min-height:48px; padding:10px 16px; border-radius:10px;
  border:1px solid var(--line); background:var(--panel); color:var(--ink);
  font-size:15px; font-weight:600; font-family:inherit; cursor:pointer;
}
.toggle:hover{ border-color:var(--accent-ink); }
.toggle .icon{ font-size:16px; line-height:1; }

.lang-switch{ display:inline-flex; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--panel); }
.lang-switch button{
  min-height:46px; min-width:48px; padding:0 12px; border:0; background:transparent;
  color:var(--dim); font:700 14px/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  letter-spacing:.04em; cursor:pointer;
}
.lang-switch button[aria-pressed="true"]{ background:var(--ink); color:var(--bg); }
.lang-switch button:not([aria-pressed="true"]):hover{ color:var(--ink); }

@media (max-width:560px){
  .site-header .btn{ display:none; }  /* the hero already carries the call to action */
  .site-header .toggle{ padding-inline:10px; }
}

/* ---------- sections ---------- */
.section{ padding:72px 0; }
.section + .section{ border-top:1px solid var(--line); }
.eyebrow{
  display:inline-block; color:var(--accent-ink); font-size:13px; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; margin-bottom:12px;
}
.section-title{ font-size:clamp(26px,4vw,36px); font-weight:800; margin:0 0 12px; letter-spacing:-.01em; }
.section-lead{ color:var(--dim); font-size:18px; max-width:60ch; margin:0 0 36px; }

/* ---------- cards & chips ---------- */
.card{ background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:24px; }
.chip-row{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{
  display:inline-flex; align-items:center; min-height:44px; padding:8px 16px;
  border-radius:999px; border:1px solid var(--line); background:var(--panel);
  color:var(--ink); font-size:15px; font-weight:600;
}
.status{
  display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px;
  font-size:12.5px; font-weight:700; letter-spacing:.02em; white-space:nowrap;
  border:1px solid var(--line); color:var(--dim); background:var(--bg);
}
.status::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.status.live{ color:var(--accent-ink); border-color:var(--accent); background:var(--accent-soft); }

/* ---------- footer ---------- */
footer{ border-top:1px solid var(--line); padding:28px 0; color:var(--dim); font-size:14px; }
footer .wrap{ display:flex; flex-wrap:wrap; gap:8px 24px; justify-content:space-between; align-items:baseline; }
footer a{ color:var(--dim); }
footer a:hover{ color:var(--accent-ink); }

/* ---------- SVG colour helpers (follow the theme) ---------- */
.f-ink{ fill:var(--ink); } .f-dim{ fill:var(--dim); } .f-bg{ fill:var(--bg); }
.f-panel{ fill:var(--panel); } .f-panel2{ fill:var(--panel-2); } .f-line{ fill:var(--line); }
.f-accent{ fill:var(--accent); } .f-accent-ink{ fill:var(--accent-ink); }
.f-device{ fill:var(--device); } .f-screen{ fill:var(--screen); } .f-none{ fill:none; }
.s-ink{ stroke:var(--ink); } .s-dim{ stroke:var(--dim); } .s-line{ stroke:var(--line); }
.s-accent{ stroke:var(--accent); } .s-edge{ stroke:var(--device-edge); }

/* ---------- print ---------- */
@media print{
  .site-header, footer, .no-print{ display:none !important; }
  body{ background:#fff; color:#000; }
}