/* Maxecaster – Grundlagen. Schriften liegen lokal (keine Google-Fonts-Abrufe). */
@font-face { font-family: 'Bricolage'; src: url(/vendor/bricolage-latin.woff2) format('woff2'); font-weight: 200 800; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2190-2199, U+2212; }
@font-face { font-family: 'Bricolage'; src: url(/vendor/bricolage-latin-ext.woff2) format('woff2'); font-weight: 200 800; font-display: swap; unicode-range: U+0100-024F, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF; }
@font-face { font-family: 'Atkinson'; src: url(/vendor/atkinson-400.woff2) format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Atkinson'; src: url(/vendor/atkinson-700.woff2) format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Atkinson'; src: url(/vendor/atkinson-ext-400.woff2) format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0100-024F, U+1E00-1EFF; }
@font-face { font-family: 'Atkinson'; src: url(/vendor/atkinson-ext-700.woff2) format('woff2'); font-weight: 700; font-display: swap; unicode-range: U+0100-024F, U+1E00-1EFF; }

:root {
  /* Regieraum: tiefes Petrol, Pegel-Bernstein, Rotlicht nur für „Aufnahme/Live“ */
  --regie: #000000;
  --regie-2: #141414;
  --regie-3: #262626;
  --regie-line: #383838;
  --nebel: #FFFFFF;
  --papier: #F4F4F4;
  --tinte: #000000;
  --tinte-2: #5E5E5E;
  --pegel: #FFB800;
  --pegel-dunkel: #B88400;
  --rot: #FF3B30;
  --funk: #00D1B2;
  --text-hell: #FFFFFF;
  --text-hell-2: #9E9E9E;

  --display: 'Bricolage', 'Avenir Next', 'Segoe UI', system-ui, sans-serif;
  --body: 'Atkinson', 'Segoe UI', system-ui, -apple-system, sans-serif;

  --r-s: 6px; --r-m: 12px; --r-l: 22px;
  --step--1: clamp(0.84rem, 0.82rem + 0.1vw, 0.9rem);
  --step-0: clamp(1rem, 0.97rem + 0.15vw, 1.08rem);
  --step-1: clamp(1.2rem, 1.12rem + 0.4vw, 1.4rem);
  --step-2: clamp(1.5rem, 1.32rem + 0.9vw, 2rem);
  --step-3: clamp(2rem, 1.6rem + 2vw, 3.1rem);
  --step-4: clamp(2.6rem, 1.8rem + 4vw, 5.2rem);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--body); font-size: var(--step-0); line-height: 1.55; color: var(--tinte); background: var(--nebel); }
h1, h2, h3, h4 { font-family: var(--display); line-height: 1.08; margin: 0 0 .5em; font-weight: 700; letter-spacing: -0.015em; }
h1 { font-size: var(--step-4); font-weight: 760; letter-spacing: -0.035em; }
h2 { font-size: var(--step-3); letter-spacing: -0.03em; }
h3 { font-size: var(--step-1); }
p { margin: 0 0 1em; }
a { color: inherit; text-underline-offset: 3px; }
img { max-width: 100%; }
.wrap { width: min(1180px, 100% - 32px); margin-inline: auto; }
.small { font-size: var(--step--1); }
.muted { color: var(--tinte-2); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

:focus-visible { outline: 3px solid var(--pegel); outline-offset: 2px; border-radius: 4px; }

/* Schaltflächen */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  font: 700 var(--step-0)/1 var(--body); padding: .8em 1.25em; border-radius: 999px;
  border: 2px solid var(--tinte); background: var(--tinte); color: var(--papier);
  text-decoration: none; cursor: pointer; transition: transform .12s ease, background .15s ease;
}
.btn:hover { background: var(--regie-3); border-color: var(--regie-3); }
.btn:active { transform: translateY(1px); }
.btn.pegel { background: var(--pegel); border-color: var(--pegel); color: var(--tinte); }
.btn.pegel:hover { background: #FFC933; border-color: #FFC933; }
.btn.ghost { background: transparent; color: inherit; border-color: currentColor; }
.btn.ghost:hover { background: rgba(0, 0, 0, .07); }
.btn.danger { background: var(--rot); border-color: var(--rot); color: #fff; }
.btn.sm { padding: .55em .95em; font-size: var(--step--1); }
.btn[disabled] { opacity: .5; cursor: not-allowed; }

/* Formulare */
label { display: block; font-weight: 700; font-size: var(--step--1); margin: 0 0 .35em; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=datetime-local], input[type=url], select, textarea {
  width: 100%; font: inherit; padding: .7em .85em; border-radius: var(--r-s);
  border: 1.5px solid #C4C4C4; background: #fff; color: var(--tinte);
}
textarea { min-height: 7em; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--tinte); box-shadow: 0 0 0 3px rgba(255, 184, 0, .45); }
.field { margin-bottom: 1rem; }
.check { display: flex; gap: .65em; align-items: flex-start; font-weight: 400; font-size: var(--step--1); }
.check input { margin-top: .25em; width: 1.1em; height: 1.1em; accent-color: var(--tinte); flex: none; }
.hint { font-size: var(--step--1); color: var(--tinte-2); margin-top: .3em; }
.error-msg { background: #FCE4E0; color: #8A1E10; border-radius: var(--r-s); padding: .7em .9em; font-size: var(--step--1); }
.ok-msg { background: #D2F7F0; color: #00574A; border-radius: var(--r-s); padding: .7em .9em; font-size: var(--step--1); }

/* Wortmarke */
.mark { display: inline-flex; align-items: center; gap: .55rem; font-family: var(--display); font-weight: 760; font-size: 1.3rem; letter-spacing: -0.03em; text-decoration: none; }
.mark svg { width: 30px; height: 30px; flex: none; }
.mark small { font-family: var(--body); font-weight: 400; font-size: .72rem; letter-spacing: 0; opacity: .7; margin-left: .15rem; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* Sprachumschalter DE | EN */
.lang-switch { display: inline-flex; border: 1.5px solid currentColor; border-radius: 999px; overflow: hidden; vertical-align: middle; font-size: .78rem; font-weight: 700; opacity: .85; }
.lang-switch button { all: unset; cursor: pointer; padding: .22rem .6rem; line-height: 1.2; }
.lang-switch button[aria-pressed="true"] { background: currentColor; }
.lang-switch button[aria-pressed="true"] { color: var(--bg, #fff); background: var(--text, #000); }
.lang-switch.dark button[aria-pressed="true"] { color: #000; background: #fff; }
.lang-switch button:focus-visible { outline: 2px solid var(--pegel, #FFB800); outline-offset: -2px; }
.gr-lang { margin-left: auto; }
/* Inhalte nur für eine Sprache (z. B. Rechtstexte) */
html[lang="de"] [data-lang-only="en"], html:not([lang="de"]) [data-lang-only="de"] { display: none !important; }
.legal-note { padding: .8rem 1rem; border-left: 3px solid var(--pegel, #FFB800); background: rgba(0,0,0,.04); }