/* ------------------------------------------------------------------ *
 * Tosh Dash — Textseite (Privacy)
 *
 * Auszug aus den Grundwerten von index.html. Die Produktseite trägt ihr
 * CSS inline; die schlichten Textseiten teilen sich diese Datei.
 * ------------------------------------------------------------------ */

:root {
  --ink-000: #07080a;
  --ink-300: #2c333e;
  --amber:   #ffb200;
  --text:     #eef1f5;
  --text-mid: #a4adba;
  --text-low: #6d7683;
  --rule:     #232932;

  /* Signalfarben wie in config.h der Firmware. Fehlten hier bisher, dadurch
     blieben .warn-Rahmen und der Haken auf der Danke-Seite farblos.
     theme.css dunkelt sie für den hellen Modus ab. */
  --green:  #00e363;
  --cyan:   #00c6ff;
  --violet: #ac79ff;
  --red:    #ff6121;
  --gut: clamp(20px, 5vw, 64px);
  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --body: "Public Sans", "Helvetica Neue", Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  color-scheme: dark;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--ink-000);
  color: var(--text);
  font-family: var(--body);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }
a:hover { color: var(--amber-ink); }

.shell { max-width: 820px; margin-inline: auto; padding-inline: var(--gut); }

.topbar { border-bottom: 1px solid var(--rule); }
.topbar .shell { display: flex; align-items: center; justify-content: space-between; height: 58px; }

.wordmark {
  font-family: var(--display);
  font-weight: 900;
  font-stretch: 112%;
  font-size: 17px;
  letter-spacing: 0.02em;
  text-decoration: none;
}
.wordmark span { color: var(--amber); }

.back { font-size: 14px; color: var(--text-mid); text-decoration: none; }

main { padding-block: clamp(56px, 8vw, 110px); }

.eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--text-low);
  margin: 0 0 18px;
}

h1, h2 {
  font-family: var(--display);
  font-weight: 900;
  font-stretch: 112%;
  letter-spacing: -0.03em;
  line-height: 1;
  margin: 0;
}
h1 { font-size: clamp(36px, 5vw, 60px); }
h2 { font-size: 21px; letter-spacing: -0.01em; margin-top: 48px; }

p, ul, address { margin: 14px 0 0; color: var(--text-mid); }
address { font-style: normal; }
strong { color: var(--text); font-weight: 500; }
ul { padding-left: 1.2em; }

footer {
  border-top: 1px solid var(--rule);
  padding-block: 40px 56px;
  color: var(--text-low);
  font-size: 14px;
}
footer .shell { display: flex; flex-wrap: wrap; gap: 12px 28px; }