/* =========================================================
   ALL IN PILATES — Clean · Bold · Urban
   ========================================================= */

/* Fraunces bleibt lokal verfügbar (wird für Zubuchbarkeit noch geladen, aber im Standard-Design nicht mehr gebraucht) */
@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/fraunces-normal-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Fraunces";
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/fraunces-italic-latin.woff2") format("woff2");
}

/* Inter — variabel, lokal */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-normal-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-italic-latin.woff2") format("woff2");
}

/* Space Grotesk 700 — logo font, lokal (rebuild von logo_scribble) */
@font-face {
  font-family: "SpaceGrotesk";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/space-grotesk-700.woff2") format("woff2");
}

:root {
  /* CT:START */
  --bg:            #ffffff;
  --bg-nav:        rgba(255, 255, 255, 0.9);
  --surface:       #f4f4f2;
  --card:          #ffffff;
  --text:          #0a0a0a;
  --text-2:        #262626;
  --muted:         #737373;
  --border:        #e8e8e5;
  --primary:       #0a0a0a;
  /* Peach bleibt Signature — Alternativen: Hot Coral #ff3d2e (Red-Room-Nod), Sage #9db38f */
  --accent:        #f89466;
  --accent-hover:  #ff7a45;
  /* --accent:      #ff3d2e; --accent-hover: #e52a1c; */
  /* --accent:      #9db38f; --accent-hover: #86a077; */
  --pop:           #0a0a0a;
  /* CT:END */

  /* Dark Module Basis */
  --ink:           #777369;
  --ink-soft:      #928d80;
  --line:          #ececea;

  --dark-bg:       var(--ink);
  --dark-surface:  #141414;
  --dark-line:     rgba(255,255,255,.12);
  --dark-muted:    rgba(255,255,255,.65);
 
  --bodyfont: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --headfont: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;

  --r-sm:       8px;
  --r-md:       14px;
  --r-lg:       20px;
  --r-xl:       28px;

  --wrap:       1280px;
  --pad:        clamp(1.1rem, 4vw, 2rem);
  --pad-y:      clamp(4rem, 9vw, 7rem);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
::selection { background: var(--accent); color: #fff; }

body {
  font-family: var(--bodyfont);
  background: var(--bg);
  color: var(--text);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  font-synthesis-weight: none;
  cursor: default;
}
body.--lock { overflow: hidden; }

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }

/* Bild-Tint wird beim neuen Look nicht mehr gebraucht — hart transparent */
.img--tinted { position: relative; display: block; overflow: hidden; }
.img--tinted img { display: block; width: 100%; }

/* ---------- Typography ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: .55rem;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--muted);
}
.eyebrow::before {
  content: ""; width: 20px; height: 1px; background: currentColor;
}
.eyebrow--light { color: rgba(255,255,255,.75); }
.eyebrow--accent { color: var(--accent); }
.eyebrow--accent::before { background: var(--accent); }

.h2 {
  font-family: var(--headfont);
  font-size: clamp(2.2rem, 6vw, 4.6rem);
  font-weight: 800;
  line-height: .95;
  letter-spacing: -0.035em;
  color: var(--ink);
  text-transform: uppercase;
}
.h2--light { color: #fff; }
.h2 em { font-style: normal; color: var(--accent); }

.h2__sub {
  margin-top: 1.4rem;
  font-size: 1.02rem;
  color: var(--muted);
  max-width: 52ch;
  line-height: 1.55;
}

.accent { color: var(--accent); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  padding: .85rem 1.4rem;
  border-radius: 999px;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  border: 1.5px solid transparent;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
  white-space: nowrap;
}
.btn--primary { background: var(--ink); color: #fff; }
.btn--primary:hover { background: var(--accent); }
.btn--accent { background: var(--accent); color: #fff; }
.btn--accent:hover { background: var(--accent-hover); }
.btn--ghost { color: var(--ink); border-color: var(--ink); background: transparent; }
.btn--ghost:hover { background: var(--ink); color: #fff; }
.btn--ghost--light { color: #fff; border-color: rgba(255,255,255,.65); }
.btn--ghost--light:hover { background: #fff; color: var(--ink); border-color: #fff; }
.btn--light { background: #fff; color: var(--ink); }
.btn--light:hover { background: var(--accent); color: #fff; }
.btn--lg { padding: 1rem 1.6rem; font-size: .92rem; }
.btn--block { width: 100%; }

/* ---------- Konzeptbereich ---------- */
.konzept { background: var(--surface); }
.konzept__page { width: 100%; }
.konzept--viewer,
.konzept--viewer .konzept__page { width: 100%; min-height: 100svh; }
.konzept--viewer .konzept__page { height: 100dvh; }
.konzept__lang-switch { position: fixed; z-index: 100; top: max(1rem, env(safe-area-inset-top)); left: max(1rem, env(safe-area-inset-left)); display: inline-flex; border: 1px solid var(--border); border-radius: 999px; background: color-mix(in srgb, var(--surface) 78%, transparent); backdrop-filter: blur(8px); }
.konzept__lang-switch a { display: inline-block; padding: .42rem .9rem; color: var(--muted); font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.konzept__lang-switch a.is-active { border-radius: 999px; background: var(--ink); color: #fff; }
.konzept__viewer-wrap { position: relative; width: 100%; max-width: 1440px; height: 100dvh; min-height: 100svh; margin: 0 auto; background: var(--surface); }
.konzept__viewer { display: block; width: 100%; height: 100%; min-height: 100svh; border: 0; background: var(--dark-bg); }
.konzept__pdf-pages { display: flex; width: 100%; height: 100%; flex-direction: column; align-items: center; gap: 1rem; overflow: auto; padding: 1rem; background: var(--surface); }
.konzept__pdf-pages canvas { display: block; max-width: 100%; height: auto !important; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.konzept__viewer-wrap.has-error .konzept__pdf-pages { align-items: center; justify-content: center; color: var(--muted); font-size: .9rem; }

.konzept--admin .konzept__page { max-width: var(--wrap); margin: 0 auto; padding: clamp(2rem, 6vw, 5.5rem) var(--pad); }
.konzept__eyebrow { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.2rem; color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.konzept__logout { color: var(--ink); text-decoration: underline; text-underline-offset: .2em; }
.konzept__title { max-width: 11ch; color: var(--ink); font-size: clamp(3.3rem, 9vw, 7.5rem); font-weight: 800; letter-spacing: -.07em; line-height: .85; text-transform: uppercase; }
.konzept__intro { max-width: 47ch; margin-top: 1.5rem; color: var(--muted); }
.konzept__grid { display: grid; grid-template-columns: minmax(250px, .8fr) minmax(320px, 1.2fr); gap: clamp(1rem, 3vw, 2rem); margin-top: clamp(2.5rem, 6vw, 5rem); align-items: start; }
.konzept__card { padding: clamp(1.4rem, 3vw, 2.5rem); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--card); box-shadow: 0 12px 30px rgba(0,0,0,.035); }
.konzept__card h2 { margin-bottom: .55rem; color: var(--ink); font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 800; letter-spacing: -.05em; line-height: 1; text-transform: uppercase; }
.konzept__hint { margin: 0 0 1.75rem; color: var(--muted); font-size: .92rem; line-height: 1.5; }
.konzept__thumb { display: flex; aspect-ratio: 1 / 1.414; max-width: 360px; padding: clamp(1.3rem, 3vw, 2rem); flex-direction: column; justify-content: space-between; overflow: hidden; border-radius: var(--r-md); background: var(--ink); color: #fff; transition: transform .2s ease, box-shadow .2s ease; }
.konzept__thumb:hover { transform: translateY(-5px); box-shadow: 0 18px 32px rgba(0,0,0,.2); }
.konzept__thumb-stack { display: grid; gap: 1rem; }
.konzept__thumb-label { color: var(--accent); font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.konzept__thumb-title { font-size: clamp(2.25rem, 5vw, 3.65rem); font-weight: 800; letter-spacing: -.08em; line-height: .84; }
.konzept__thumb-meta { color: var(--dark-muted); font-size: .78rem; line-height: 1.5; }
.konzept__file-list { margin-top: .25rem; }
.konzept__file-item { display: flex; align-items: center; justify-content: space-between; gap: .8rem; border-bottom: 1px solid var(--border); }
.konzept__file-name { display: block; color: var(--ink); font-size: .92rem; font-weight: 700; }
.konzept__file-meta { display: block; margin-top: .25rem; color: var(--muted); font-size: .82rem; }
.konzept__file-link { display: block; flex: 1; min-width: 0; padding: .8rem 0 .9rem; text-decoration: none; }
.konzept__file-delete { margin: 0; padding: 0; }
.konzept__delete-btn { width: 2rem; height: 2rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--muted); font: inherit; line-height: 1; cursor: pointer; }
.konzept__delete-btn:hover { color: #852311; border-color: #e5b7ad; background: #fff8f6; }
.konzept__label { display: block; margin-bottom: .55rem; color: var(--ink); font-size: .82rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.konzept__file { width: 100%; padding: .8rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font: inherit; }
.konzept__input { width: 100%; margin: 0 0 1rem; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font: inherit; }
.konzept__file::file-selector-button { margin-right: .8rem; padding: .55rem .75rem; border: 0; border-radius: 999px; background: var(--ink); color: #fff; font: inherit; font-size: .74rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.konzept__card .btn { margin-top: 1.2rem; }
.konzept__notice { margin-top: 1.5rem; padding: .9rem 1rem; border-radius: var(--r-sm); background: #e7f4dc; color: #244016; font-size: .9rem; font-weight: 600; }
.konzept__notice--error { background: #fde5df; color: #852311; }
.konzept__empty { display: grid; min-height: 100svh; padding: var(--pad); align-content: center; justify-items: center; text-align: center; }
.konzept__empty .konzept__title { max-width: 13ch; }

/* ---------- File aliases ---------- */
.file { background: var(--surface); }
.file__page { width: 100%; }
.file--viewer,
.file--viewer .file__page { width: 100%; min-height: 100svh; }
.file--viewer .file__page { height: 100dvh; }
.file__viewer-wrap { position: relative; width: 100%; max-width: 1440px; height: 100dvh; min-height: 100svh; margin: 0 auto; background: var(--surface); }
.file__viewer-pages { display: flex; width: 100%; height: 100%; flex-direction: column; align-items: center; gap: 1rem; overflow: auto; padding: 1rem; background: var(--surface); }
.file__viewer-pages canvas { display: block; max-width: 100%; height: auto !important; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.file__viewer-wrap.has-error .file__viewer-pages { align-items: center; justify-content: center; color: var(--muted); font-size: .9rem; }
.file__title { max-width: 11ch; color: var(--ink); font-size: clamp(3.3rem, 9vw, 7.5rem); font-weight: 800; letter-spacing: -.07em; line-height: .85; text-transform: uppercase; }
.file__intro { max-width: 47ch; margin-top: 1.5rem; color: var(--muted); }
.file__grid { display: grid; grid-template-columns: minmax(250px, .8fr) minmax(320px, 1.2fr); gap: clamp(1rem, 3vw, 2rem); margin-top: clamp(2.5rem, 6vw, 5rem); align-items: start; }
.file__card { padding: clamp(1.4rem, 3vw, 2.5rem); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--card); box-shadow: 0 12px 30px rgba(0,0,0,.035); }
.file__card h2 { margin-bottom: .55rem; color: var(--ink); font-size: clamp(1.6rem, 3vw, 2.4rem); font-weight: 800; letter-spacing: -.05em; line-height: 1; text-transform: uppercase; }
.file__hint { margin: 0 0 1.75rem; color: var(--muted); font-size: .92rem; line-height: 1.5; }
.file__label { display: block; margin-bottom: .55rem; color: var(--ink); font-size: .82rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.file__input-file { width: 100%; padding: .8rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font: inherit; }
.file__input { width: 100%; margin: 0 0 1rem; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font: inherit; }
.file__input-file::file-selector-button { margin-right: .8rem; padding: .55rem .75rem; border: 0; border-radius: 999px; background: var(--ink); color: #fff; font: inherit; font-size: .74rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.file__card .btn { margin-top: 1.2rem; }
.file__list { margin-top: .25rem; }
.file__item { display: flex; align-items: center; justify-content: space-between; gap: .8rem; border-bottom: 1px solid var(--border); }
.file__name { display: block; color: var(--ink); font-size: .92rem; font-weight: 700; }
.file__meta { display: block; margin-top: .25rem; color: var(--muted); font-size: .82rem; }
.file__link { display: block; flex: 1; min-width: 0; padding: .8rem 0 .9rem; text-decoration: none; }
.file__actions { display: flex; align-items: center; gap: .4rem; }
.file__open-link { display: inline-flex; width: 2rem; height: 2rem; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: #000; font: inherit; line-height: 1; text-decoration: none; }
.file__open-link:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, #fff); }
.file__copy-btn { width: 2rem; height: 2rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: #000; font: inherit; line-height: 1; cursor: pointer; }
.file__copy-btn:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, #fff); }
.file__copy-btn.is-copied { color: #000; border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, #fff); }
.file__rename-btn { width: 2rem; height: 2rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: #000; font: inherit; line-height: 1; cursor: pointer; }
.file__rename-btn:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, #fff); }
.file__reupload { margin: 0; padding: 0; }
.file__reupload-input { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.file__reupload-btn { display: inline-flex; width: 2rem; height: 2rem; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: #000; cursor: pointer; }
.file__reupload-btn:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, #fff); }
.file__reupload.is-loading .file__reupload-btn,
.file__reupload-btn.is-loading { cursor: progress; opacity: .75; pointer-events: none; }
.file__delete { margin: 0; padding: 0; }
.file__delete-btn { width: 2rem; height: 2rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: #000; font: inherit; line-height: 1; cursor: pointer; }
.file__delete-btn:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); background: color-mix(in srgb, var(--accent) 10%, #fff); }
.file__upload.is-loading .btn { cursor: progress; opacity: .75; }
.rename-modal[hidden] { display: none; }
.rename-modal { position: fixed; inset: 0; z-index: 10010; display: grid; place-items: center; padding: 1rem; }
.rename-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.36); }
.rename-modal__panel { position: relative; z-index: 1; width: min(100%, 520px); padding: 1.2rem; border: 1px solid var(--border); border-radius: var(--r-md); background: #fff; box-shadow: 0 20px 48px rgba(0,0,0,.16); }
.rename-modal__title { margin-bottom: .9rem; color: var(--ink); font-size: 1.15rem; font-weight: 800; letter-spacing: -.02em; }
.rename-modal__form .file__input { margin-bottom: 0; }
.rename-modal__name-row { display: grid; grid-template-columns: 1fr auto; gap: .6rem; align-items: center; }
.rename-modal__ext { display: inline-flex; min-height: 44px; padding: 0 .8rem; align-items: center; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--muted); font-size: .9rem; }
.rename-modal__checkbox { display: inline-flex; gap: .6rem; margin-top: .9rem; align-items: center; color: var(--text); font-size: .9rem; }
.rename-modal__checkbox input { width: 1rem; height: 1rem; accent-color: var(--accent); }
.rename-modal__actions { display: flex; gap: .6rem; justify-content: flex-end; margin-top: 1rem; }
.file__loading-overlay {
  position: fixed;
  z-index: 9999;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .9rem;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}
.file__loading-overlay.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: all;
}
.file__loading-overlay p {
  color: var(--ink);
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.file__loading-spinner {
  width: 3rem;
  height: 3rem;
  border: 3px solid rgba(0,0,0,.15);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: file-loader-spin .85s linear infinite;
}
@keyframes file-loader-spin {
  to { transform: rotate(360deg); }
}
.file__notice { margin-top: 1.5rem; padding: .9rem 1rem; border-radius: var(--r-sm); background: #e7f4dc; color: #244016; font-size: .9rem; font-weight: 600; }
.file__notice--error { background: #fde5df; color: #852311; }
.file__empty { display: grid; min-height: 100svh; padding: var(--pad); align-content: center; justify-items: center; text-align: center; }
.file__empty .file__title { max-width: 13ch; }

/* ---------- Login & Dashboard ---------- */
.login { display: grid; min-height: 100svh; background: var(--surface); place-items: center; padding: var(--pad); }
.login__page { width: min(100%, 460px); }
.login__card { padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--card); box-shadow: 0 18px 48px rgba(0,0,0,.08); }
.login__card h1 { margin: .35rem 0 .7rem; color: var(--ink); font-size: clamp(2.3rem, 7vw, 4rem); font-weight: 800; letter-spacing: -.07em; line-height: .9; text-transform: uppercase; }
.login__eyebrow { color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.login__hint { margin-bottom: 1.8rem; color: var(--muted); font-size: .95rem; }
.login__input, .dashboard__field input { width: 100%; margin: 0 0 1.15rem; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font: inherit; }
.login__input:focus, .dashboard__field input:focus, .konzept__file:focus, .konzept__input:focus, .file__input:focus, .file__input-file:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
.login__trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.dashboard { min-height: 100svh; background: var(--surface); }
.dashboard__page { width: min(var(--wrap), 100%); margin: 0 auto; padding: clamp(2rem, 6vw, 5.5rem) var(--pad); }
.dashboard__head { display: flex; align-items: start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.dashboard__title { max-width: none; color: var(--ink); font-size: clamp(2.1rem, 8vw, 4.2rem); font-weight: 800; letter-spacing: -.06em; line-height: .9; text-transform: uppercase; }
.dashboard__actions { display: flex; gap: 1rem; }
.dashboard__logout { padding: .6rem 0; color: var(--muted); font-size: .85rem; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.dashboard__tabs { display: flex; gap: .5rem; margin: 2.5rem 0 2rem; border-bottom: 1px solid var(--border); }
.dashboard__tabs a { padding: .8rem 1rem; color: var(--muted); font-size: .85rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.dashboard__tabs a.is-active { border-bottom: 2px solid var(--accent); color: var(--ink); }
.dashboard__form { max-width: 760px; padding: clamp(1.4rem, 3vw, 2.5rem); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--card); }
.dashboard__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; margin-top: 2rem; }
.dashboard__field span { display: block; margin-bottom: .45rem; color: var(--ink); font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.admin-nav { position: fixed; z-index: 100; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); }
.admin-nav .btn { box-shadow: 0 10px 26px rgba(0,0,0,.2); }
.waitlist__actions { margin-bottom: 1.25rem; }
.waitlist__table-wrap { overflow-x: auto; }
.waitlist__table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.waitlist__table th,
.waitlist__table td { padding: .6rem .75rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; }
.waitlist__table th { background: var(--surface); color: var(--ink); font-size: .78rem; letter-spacing: .05em; text-transform: uppercase; }
.waitlist__col-actions { width: 1%; white-space: nowrap; text-align: right; }

@media (max-width: 680px) {
  .konzept__viewer-wrap { max-width: none; height: 100dvh; min-height: 100dvh; }
  .konzept__viewer { min-height: 100dvh; }
  .konzept__pdf-pages { gap: .5rem; padding: 0; }
  .konzept__pdf-pages canvas { width: 100% !important; }
  .file__viewer-wrap { max-width: none; height: 100dvh; min-height: 100dvh; }
  .file__viewer-pages { gap: .5rem; padding: 0; }
  .file__viewer-pages canvas { width: 100% !important; }
  .file__grid { grid-template-columns: 1fr; }
  .konzept__lang-switch { top: max(.55rem, env(safe-area-inset-top)); left: max(.55rem, env(safe-area-inset-left)); }
  .konzept__grid { grid-template-columns: 1fr; }
  .konzept__thumb { max-width: none; }
  .konzept__eyebrow { justify-content: space-between; gap: .5rem; }
  .dashboard__fields { grid-template-columns: 1fr; }
  .dashboard__actions { width: 100%; justify-content: flex-start; }
}

/* ---------- NAV ---------- */
.nav {
  position: sticky; top: 0; z-index: 60;
  background: var(--bg-nav);
  backdrop-filter: blur(18px) saturate(1.1);
  -webkit-backdrop-filter: blur(18px) saturate(1.1);
  border-bottom: 1px solid var(--line);
}
.nav__row {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 1rem; padding-bottom: 1rem;
  gap: 1rem;
}
.brand {
  display: inline-flex; align-items: center;
  color: var(--ink);
  transition: color .18s ease;
}
.brand:hover { color: var(--accent); }
.brand__text {
  font-family: "SpaceGrotesk", "Inter", sans-serif;
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: .16em;
  line-height: .95;
  text-transform: uppercase;
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
}
.brand__l1, .brand__l2 { display: block; white-space: nowrap; }
.brand__l1 { color: var(--accent); }
.brand__l2 { letter-spacing: .19em; }
.brand--foot .brand__text { font-size: 1.15rem; letter-spacing: .18em; gap: 3px; }
.brand--foot .brand__l2 { letter-spacing: .21em; }

.nav__links {
  display: flex; gap: 2.2rem;
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ink);
}
.nav__links a { padding: .5rem 0; position: relative; }
.nav__links a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: 2px;
  height: 2px; background: var(--accent);
  transition: right .2s ease;
}
.nav__links a:hover::after { right: 0; }
.nav__links .nav__link--dash { color: var(--accent); }

.nav__end { display: flex; align-items: center; gap: 18px; }
.nav__cta { padding: .65rem 1.15rem; font-size: .78rem; }

.nav__burger {
  display: none;
  width: 44px; height: 44px;
  position: relative;
  border-radius: var(--r-sm);
}
.nav__burger span {
  position: absolute; left: 11px; right: 11px; height: 2px;
  background: var(--ink);
  border-radius: 2px;
  transition: transform .25s ease, opacity .2s ease, top .25s ease;
}
.nav__burger span:nth-child(1) { top: 15px; }
.nav__burger span:nth-child(2) { top: 21px; }
.nav__burger span:nth-child(3) { top: 27px; }
.nav__burger[aria-expanded="true"] span:nth-child(1) { top: 21px; transform: rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav__burger[aria-expanded="true"] span:nth-child(3) { top: 21px; transform: rotate(-45deg); }

.mnav {
  position: fixed; inset: 0;
  background: var(--bg);
  z-index: 55;
  transform: translateY(-100%);
  transition: transform .3s cubic-bezier(.5,.05,.35,1);
  padding: 5rem var(--pad) 2rem;
  overflow-y: auto;
}
.mnav[aria-hidden="false"] { transform: translateY(0); }
.mnav__inner {
  display: flex; flex-direction: column;
  max-width: 520px;
  margin: 0 auto;
}
.mnav__inner > a:not(.btn) {
  font-family: var(--headfont);
  font-size: 2rem;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.02em;
  text-transform: uppercase;
  padding: .9rem 0;
  border-bottom: 1px solid var(--line);
}
.mnav__inner > a.mnav__link--dash { color: var(--accent); }

@media (max-width: 900px) {
  .nav__links { display: none; }
  .nav__burger { display: block; }
  .nav__cta { display: none; }
  .nav__row { gap: .5rem; }
}

/* ---------- Section head ---------- */
.section__head { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.section__head--between {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  align-items: end;
}
.section__note { color: var(--muted); font-size: .95rem; max-width: 34ch; text-align: right; }
@media (max-width: 780px) {
  .section__head--between { grid-template-columns: 1fr; }
  .section__note { text-align: left; }
}

/* ---------- HERO ---------- */
.hero { padding-top: clamp(1.5rem, 3vw, 2.5rem); padding-bottom: clamp(2rem, 3vw, 3rem); position: relative; }
.hero__inner {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: stretch;
}
.hero__text {
  display: flex; flex-direction: column; justify-content: center;
  padding: clamp(2rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem);
}
.hero__title {
  font-family: var(--headfont);
  font-size: clamp(2.8rem, 8vw, 6.2rem);
  font-weight: 800;
  line-height: .92;
  letter-spacing: -0.045em;
  color: var(--ink);
  text-transform: uppercase;
}
.hero__title .accent { color: var(--accent); }
.hero__title .strike {
  position: relative;
  display: inline-block;
}
.hero__title .strike::after {
  content: ""; position: absolute; left: -3%; right: -3%; top: 52%;
  height: .09em; background: var(--accent);
  transform: rotate(-3deg);
}

.hero__lead {
  margin-top: 1.6rem;
  font-size: 1.05rem;
  color: var(--text-2);
  max-width: 42ch;
  line-height: 1.55;
}
.hero__cta {
  display: flex; flex-wrap: wrap; gap: .7rem;
  margin-top: 2rem;
}
.hero__points {
  list-style: none;
  display: flex; flex-wrap: wrap; gap: 2rem;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--line);
  color: var(--ink);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero__points li { display: flex; align-items: center; gap: .55rem; }
.hero__points li::before {
  content: ""; width: 6px; height: 6px; border-radius: 999px; background: var(--accent);
}

.hero__media {
  border-radius: var(--r-xl);
  overflow: hidden;
  background: var(--surface);
  aspect-ratio: 4/5;
  position: relative;
}
.hero__media img { width: 100%; height: 100%; object-fit: cover; }
.hero__badge {
  position: absolute; left: 1rem; bottom: 1rem;
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--accent);
  color: #fff;
  padding: .55rem 1rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.hero__badge__dot {
  width: 7px; height: 7px; border-radius: 999px; background: #fff;
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50% { opacity: .4; transform: scale(.7); }
}

@media (max-width: 900px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__media { aspect-ratio: 4/5; }
}

/* ---------- MARQUEE ---------- */
.marquee {
  background: var(--ink);
  color: #fff;
  padding: 1rem 0;
  overflow: hidden;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.marquee__track {
  display: inline-flex; gap: 3rem;
  animation: mq 32s linear infinite;
  width: max-content;
  white-space: nowrap;
  will-change: transform;
}
.marquee__item {
  font-family: var(--headfont);
  font-weight: 800;
  font-size: 1.3rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  display: flex; align-items: center; gap: 3rem;
}
.marquee__dot {
  width: 10px; height: 10px; border-radius: 999px; background: var(--accent);
  display: inline-block;
}
@keyframes mq {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

/* ---------- BENEFITS ---------- */
.benefits { padding: var(--pad-y) 0; }
.benefits__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
.bcard {
  background: var(--card);
  border-radius: var(--r-lg);
  padding: 1.6rem 1.4rem;
  border: 1px solid var(--line);
  transition: border-color .2s ease, background .2s ease;
  position: relative;
  overflow: hidden;
}
.bcard:hover { border-color: var(--ink); }
.bcard__num {
  font-family: var(--headfont);
  font-weight: 800;
  font-size: 2.4rem;
  line-height: 1;
  color: var(--accent);
  letter-spacing: -0.04em;
  margin-bottom: 1rem;
}
.bcard h3 {
  font-family: var(--headfont);
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin-bottom: .5rem;
  line-height: 1.15;
  text-transform: uppercase;
}
.bcard p {
  font-size: .93rem;
  color: var(--muted);
  line-height: 1.5;
}

@media (max-width: 1000px) { .benefits__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px)  { .benefits__grid { grid-template-columns: 1fr; } }

/* ---------- REFORMER SPLIT ---------- */
.reformer { padding: var(--pad-y) 0; }
.reformer__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: center;
}
.reformer__media {
  border-radius: var(--r-xl);
  overflow: hidden;
  aspect-ratio: 1/1;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
}
.reformer__media img { width: 100%; height: 100%; object-fit: cover; }
.reformer__text p {
  color: var(--text-2);
  font-size: 1.02rem;
  margin-top: 1.4rem;
  max-width: 44ch;
}

.factlist {
  list-style: none;
  margin-top: 2rem;
  display: grid;
  gap: 0;
  border-top: 1px solid var(--line);
}
.factlist li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.2rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--line);
  font-size: .98rem;
  color: var(--ink);
  align-items: baseline;
}
.factlist li b {
  font-family: var(--headfont);
  font-weight: 800;
  font-size: 1.3rem;
  color: var(--accent);
  letter-spacing: -0.02em;
  min-width: 3ch;
}

@media (max-width: 900px) {
  .reformer__grid { grid-template-columns: 1fr; }
}

/* ---------- COURSES ---------- */
.courses { padding: var(--pad-y) 0; }
.courses__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.course {
  background: var(--card);
  border-radius: var(--r-lg);
  padding: 1.8rem;
  border: 1px solid var(--line);
  display: flex; flex-direction: column;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.course:hover {
  border-color: var(--ink);
  background: var(--ink);
  color: #fff;
}
.course:hover .course__desc { color: rgba(255,255,255,.75); }
.course:hover .course__for { border-color: rgba(255,255,255,.15); color: rgba(255,255,255,.75); }
.course:hover .pill { background: var(--accent); color: #fff; }
.course:hover .course__time { color: rgba(255,255,255,.55); }
.course:hover .course__arrow { color: var(--accent); transform: translateX(4px); }

.course__head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 1.6rem;
}
.pill {
  padding: .35rem .75rem;
  background: var(--surface);
  color: var(--ink);
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background .2s ease, color .2s ease;
}
.course__time {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.course__title {
  font-family: var(--headfont);
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1;
  color: inherit;
  text-transform: uppercase;
}
.course__desc {
  margin-top: 1rem;
  color: var(--muted);
  font-size: .95rem;
  flex: 1;
  transition: color .2s ease;
}
.course__for {
  margin-top: 1.4rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--line);
  font-size: .82rem;
  color: var(--muted);
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  display: flex; justify-content: space-between; align-items: center;
  transition: border-color .2s ease, color .2s ease;
}
.course__arrow {
  color: var(--ink);
  transition: color .2s ease, transform .2s ease;
}

@media (max-width: 900px) { .courses__grid { grid-template-columns: 1fr; } }

/* ---------- COMMUNITY STRIP ---------- */
.strip {
  position: relative;
  overflow: hidden;
  min-height: clamp(340px, 55vw, 520px);
  color: #fff;
  display: flex; align-items: center;
}
.strip__bg {
  position: absolute; inset: 0;
  z-index: 0;
}
.strip__bg img { width: 100%; height: 100%; object-fit: cover; }
.strip__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(10,10,10,.88) 0%, rgba(10,10,10,.6) 55%, rgba(10,10,10,.25) 100%),
    linear-gradient(0deg, rgba(10,10,10,.35), rgba(10,10,10,.35));
}
.strip__bg img { filter: grayscale(35%) contrast(1.05); }
.strip__inner {
  position: relative; z-index: 1;
  padding: clamp(3rem, 8vw, 6rem) 0;
  max-width: 640px;
}
.strip__title {
  font-family: var(--headfont);
  font-size: clamp(2.2rem, 5.5vw, 4rem);
  font-weight: 800;
  line-height: .95;
  letter-spacing: -0.035em;
  text-transform: uppercase;
}
.strip__title em { font-style: normal; color: var(--accent); }
.strip__lead {
  margin-top: 1.2rem;
  font-size: 1.05rem;
  color: rgba(255,255,255,.8);
  max-width: 40ch;
}
.strip__cta { margin-top: 1.8rem; }

/* ---------- WARTELISTE ---------- */
.wait { padding: var(--pad-y) 0; background: var(--ink); color: #fff; }
.wait__grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}
.wait__title { color: #fff; }
.wait__title em { color: var(--accent); font-style: normal; }
.wait__lead {
  margin-top: 1.4rem;
  font-size: 1.02rem;
  color: rgba(255,255,255,.7);
  max-width: 42ch;
}
.wait__perks {
  list-style: none;
  margin-top: 2rem;
  display: grid; gap: .7rem;
}
.wait__perks li {
  display: flex; gap: .8rem; align-items: center;
  font-size: .95rem;
  color: rgba(255,255,255,.9);
}
.wait__perks li span {
  width: 20px; height: 20px;
  background: var(--accent);
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .75rem;
  color: #fff;
  flex-shrink: 0;
}

.wform {
  background: #fff;
  color: var(--text);
  border-radius: var(--r-xl);
  padding: clamp(1.6rem, 3vw, 2.4rem);
  box-shadow: 0 30px 60px -20px rgba(0,0,0,.4);
}
.wform__title {
  font-family: var(--headfont);
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  margin-bottom: 1.4rem;
}
.wform__body { display: grid; gap: 1rem; }
.field { display: grid; gap: .4rem; }
.field span {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.field input {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm);
  padding: .9rem 1rem;
  font-family: var(--bodyfont);
  font-size: 1rem;
  font-weight: 500;
  color: var(--text);
  outline: none;
  transition: border-color .18s ease;
}
.field input:focus { border-color: var(--ink); }
.wform__hint {
  font-size: .78rem;
  color: var(--muted);
  text-align: center;
  margin-top: .2rem;
}
.wform__done { text-align: center; padding: 1.5rem 0; }
.wform__check {
  width: 56px; height: 56px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  margin-bottom: 1.2rem;
}
.wform__done h3 {
  font-family: var(--headfont);
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  margin-bottom: .5rem;
}
.wform__done p { color: var(--muted); font-size: .95rem; }

@media (max-width: 900px) { .wait__grid { grid-template-columns: 1fr; } }

/* ---------- FAQ ---------- */
.faq { padding: var(--pad-y) 0; }
.faq__grid {
  display: grid;
  grid-template-columns: 0.85fr 1.5fr;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.faq__contact {
  margin-top: 1.4rem;
  color: var(--muted);
  font-size: .95rem;
  max-width: 32ch;
}
.faq__contact a { color: var(--ink); border-bottom: 1.5px solid var(--accent); }

.faq__list { border-top: 1px solid var(--line); }
.q { border-bottom: 1px solid var(--line); }
.q summary {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem;
  padding: 1.4rem 0;
  cursor: pointer;
  list-style: none;
  font-family: var(--headfont);
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.015em;
  transition: color .2s ease;
}
.q summary:hover { color: var(--accent); }
.q summary::-webkit-details-marker { display: none; }
.q__icon {
  width: 22px; height: 22px;
  position: relative;
  flex-shrink: 0;
  transition: transform .25s ease;
}
.q__icon::before, .q__icon::after {
  content: ""; position: absolute; background: currentColor;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  border-radius: 2px;
}
.q__icon::before { width: 14px; height: 2px; }
.q__icon::after  { width: 2px; height: 14px; transition: transform .25s ease; }
.q[open] .q__icon::after { transform: translate(-50%, -50%) scaleY(0); }
.q[open] summary { color: var(--accent); }

.q__body {
  padding-bottom: 1.4rem;
  color: var(--text-2);
  font-size: .98rem;
  max-width: 62ch;
  line-height: 1.6;
}

@media (max-width: 860px) { .faq__grid { grid-template-columns: 1fr; } }

/* ---------- FOOTER ---------- */
.foot {
  background: var(--ink);
  color: rgba(255,255,255,.7);
  padding: clamp(3rem, 6vw, 5rem) 0 calc(1.5rem + env(safe-area-inset-bottom));
}
.foot__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 2.5rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.brand--foot { color: #fff; margin-bottom: 1rem; }
.foot__tag {
  color: rgba(255,255,255,.55);
  margin-bottom: 1.6rem;
  font-size: .92rem;
  max-width: 34ch;
}
.foot__brand .btn--primary { background: var(--accent); color: #fff; border-color: var(--accent); }
.foot__brand .btn--primary:hover { background: #fff; color: var(--ink); border-color: #fff; }

.foot__col h4 {
  color: #fff;
  font-size: .72rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 1rem;
}
.foot__col p {
  font-size: .93rem;
  line-height: 1.9;
  color: rgba(255,255,255,.7);
}
.foot__col a { transition: color .18s ease; }
.foot__col a:hover { color: var(--accent); }
.foot__col .foot__link--menu {
  color: inherit;
  font: inherit;
  padding: 0;
  transition: color .18s ease;
}
.foot__col .foot__link--menu:hover { color: var(--accent); }

.foot__bar {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 1.5rem;
  font-size: .8rem;
  color: rgba(255,255,255,.5);
}
.foot__links { display: flex; gap: 1.4rem; }
.foot__link { color: rgba(255,255,255,.5); font: inherit; padding: 0; transition: color .18s ease; }
.foot__links a:hover, .foot__link:hover { color: #fff; }

/* ---------- Dialog / Modal ---------- */
.dlg {
  border: 0; padding: 0;
  background: transparent;
  color: var(--text);
  max-width: 640px;
  width: calc(100% - 2rem);
  max-height: calc(100dvh - 3rem);
  border-radius: var(--r-lg);
  overflow: hidden;
  position: fixed;
  inset: 0;
  margin: auto;
}
.dlg::backdrop {
  background: rgba(10, 10, 10, 0.6);
  backdrop-filter: blur(4px);
}
.dlg__inner {
  position: relative;
  background: var(--card);
  border-radius: var(--r-lg);
  padding: 2.2rem clamp(1.4rem, 3vw, 2.4rem) calc(2rem + env(safe-area-inset-bottom));
  max-height: calc(100dvh - 3rem);
  overflow-y: auto;
}
.dlg__title {
  font-family: var(--headfont);
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  margin-bottom: 1.4rem;
  padding-right: 2.5rem;
  color: var(--ink);
}
.dlg__body {
  font-size: .95rem;
  line-height: 1.65;
  color: var(--text-2);
  display: grid;
  gap: 1rem;
}
.dlg__body strong { color: var(--ink); font-weight: 700; }
.dlg__body a { color: var(--ink); border-bottom: 1.5px solid var(--accent); }
.dlg__close {
  position: sticky;
  top: 0;
  float: right;
  margin: -1rem -.4rem .4rem 1rem;
  width: 36px; height: 36px;
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--surface);
  color: var(--ink);
  z-index: 2;
  transition: background .18s ease, color .18s ease;
}
.dlg__close:hover { background: var(--ink); color: #fff; }
@media (max-width: 520px) {
  .dlg__title { font-size: 1.2rem; }
  .dlg__inner { padding: 1.8rem 1.2rem 1.4rem; }
}

@media (max-width: 780px) {
  .foot__grid { grid-template-columns: 1fr 1fr; }
  .foot__brand { grid-column: 1 / -1; }
  .foot__bar { flex-direction: column; gap: 1rem; text-align: center; }
}
@media (max-width: 480px) {
  .foot__grid { grid-template-columns: 1fr; }
}

/* ---------- ACCENT GLOW (Radial-Aura, hell + dunkel einsetzbar) ---------- */
.has-glow { position: relative; overflow: hidden; isolation: isolate; }
.has-glow > * { position: relative; z-index: 1; }
.has-glow::before,
.has-glow::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(70px);
  will-change: transform;
}
/* Standard (LIGHT): warmer, satter Peach-Blob oben-links — auf Weiß braucht es deutlich mehr Alpha */
.has-glow::before {
  top: -20%;
  left: -15%;
  width: 70vw;
  height: 70vw;
  max-width: 900px;
  max-height: 900px;
  background:
    radial-gradient(circle, rgba(248,148,102,.85) 0%, rgba(248,148,102,.35) 30%, rgba(248,148,102,0) 65%);
}
/* Zweite Aura unten-rechts */
.has-glow::after {
  bottom: -25%;
  right: -15%;
  width: 60vw;
  height: 60vw;
  max-width: 780px;
  max-height: 780px;
  background:
    radial-gradient(circle, rgba(248,148,102,.6) 0%, rgba(248,148,102,.15) 35%, rgba(248,148,102,0) 70%);
}
/* Dunkler Kontext: weniger Alpha nötig (leuchtet auf Schwarz stärker) */
.has-glow--dark::before {
  background:
    radial-gradient(circle, rgba(248,148,102,.55) 0%, rgba(248,148,102,.18) 32%, rgba(248,148,102,0) 65%);
}
.has-glow--dark::after {
  background:
    radial-gradient(circle, rgba(248,148,102,.38) 0%, rgba(248,148,102,0) 70%);
}
/* Modifier: Glow nur unten, breit gestreckt */
.has-glow--bottom::before { display: none; }
.has-glow--bottom::after {
  bottom: -35%;
  right: 50%;
  transform: translateX(50%);
  width: 110vw;
  max-width: 1400px;
  height: 65vw;
  max-height: 780px;
  background:
    radial-gradient(ellipse at center, rgba(248,148,102,.75) 0%, rgba(248,148,102,.25) 35%, rgba(248,148,102,0) 70%);
}
/* Modifier: nur ein einzelner, sehr weicher Blob (subtil) */
.has-glow--soft::before { opacity: .75; }
.has-glow--soft::after  { display: none; }

/* Mobile: Blobs müssen viel größer werden, damit der Effekt sichtbar bleibt */
@media (max-width: 720px) {
  .has-glow::before,
  .has-glow::after { filter: blur(55px); }
  .has-glow::before {
    top: -25%;
    left: -35%;
    width: 130vw;
    height: 130vw;
    max-width: none;
    max-height: none;
  }
  .has-glow::after {
    bottom: -30%;
    right: -35%;
    width: 130vw;
    height: 130vw;
    max-width: none;
    max-height: none;
  }
  .has-glow--bottom::after {
    bottom: -40%;
    width: 160vw;
    height: 110vw;
    max-width: none;
    max-height: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .has-glow::before, .has-glow::after { transition: none; }
}

/* ---------- HERO DARK VARIANT ---------- */
.hero--dark {
  background: var(--dark-bg);
  color: #fff;
  padding-top: clamp(2rem, 4vw, 3.5rem);
  padding-bottom: clamp(3rem, 5vw, 5rem);
}
.hero--dark .hero__title { color: #fff; }
.hero--dark .hero__lead { color: rgba(255,255,255,.75); }
.hero--dark .hero__media { background: var(--dark-surface); }

/* Hero-Title Rotation (fade + minimaler y-shift) */
.hero__title {  }
.hero__title__inner {
  display: block;
  transition: opacity .42s ease, transform .42s ease;
  will-change: opacity, transform;
}
.hero__title__line { display: block; }
.hero__title__line.accent { color: var(--accent); }
.hero__title.is-swapping .hero__title__inner {
  opacity: 0;
  transform: translateY(-8px);
}

/* ---------- MEDIA BADGE (Video-Marker) ---------- */
.media-badge {
  position: absolute;
  left: 1rem;
  top: 1rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(10,10,10,.75);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  padding: .45rem .8rem .45rem .7rem;
  border-radius: 999px;
  font-family: var(--headfont);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  z-index: 2;
  border: 1px solid rgba(255,255,255,.15);
}
.media-badge--dark { background: rgba(10,10,10,.85); }
.media-badge__dot {
  width: 7px; height: 7px;
  border-radius: 999px;
  background: var(--accent);
  animation: pulse 2s ease-in-out infinite;
  flex-shrink: 0;
}

/* ---------- MANIFEST ---------- */
.manifest {
  background: var(--dark-bg);
  color: #fff;
  padding: clamp(3.5rem, 7vw, 5.5rem) 0;
}
.manifest__title {
  font-family: var(--headfont);
  font-size: clamp(1.9rem, 4.5vw, 3.4rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -0.035em;
  text-transform: uppercase;
  color: #fff;
  max-width: 20ch;
}
.manifest__title em { font-style: normal; color: var(--accent); }
.manifest__body {
  margin-top: 1.4rem;
  font-size: 1.02rem;
  line-height: 1.55;
  color: var(--dark-muted);
  max-width: 46ch;
}
.manifest__body b { color: #fff; font-weight: 600; }

/* ---------- EDITORIAL GRID (Studio & Feed) ---------- */
.editorial { padding: var(--pad-y) 0; background: var(--surface); }
.editorial__handle {
  color: var(--ink);
  border-bottom: 1.5px solid var(--accent);
  font-weight: 600;
}
.editorial__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.editorial__tile {
  position: relative;
  overflow: hidden;
  border-radius: var(--r-md);
  background: var(--dark-bg);
  display: block;
  aspect-ratio: 4 / 5;
}
.editorial__tile img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s ease, filter .3s ease;
  filter: grayscale(15%) contrast(1.02);
}
.editorial__tile:hover img {
  transform: scale(1.05);
  filter: grayscale(0) contrast(1.05);
}
.editorial__tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,0) 45%, rgba(10,10,10,.55) 100%);
  pointer-events: none;
}
.editorial__tag {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  z-index: 2;
  color: #fff;
  font-family: var(--headfont);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: .4rem .7rem;
  background: rgba(10,10,10,.55);
  backdrop-filter: blur(6px);
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
}
@media (max-width: 900px) {
  .editorial__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .editorial__tile { aspect-ratio: 1 / 1; }
}

/* ---------- REFORMER — Media hat jetzt Badge ---------- */
.reformer__media { position: relative; }

/* ---------- FAQ CTA (kompakt) ---------- */
.faq-cta {
  padding: clamp(3.5rem, 7vw, 5.5rem) 0;
  border-top: 1px solid var(--line);
}
.faq-cta__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  align-items: center;
}
.faq-cta__title {
  font-family: var(--headfont);
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  color: var(--ink);
}
.faq-cta__title em { font-style: normal; color: var(--accent); }
.faq-cta__actions { display: flex; gap: .7rem; flex-wrap: wrap; }
@media (max-width: 720px) {
  .faq-cta__inner { grid-template-columns: 1fr; }
}

/* ---------- Dialog — Wide-Variante (für FAQ) ---------- */
.dlg--wide { max-width: 780px; }
.dlg--wide .faq__list { border-top: 0; margin-top: -.5rem; }
.dlg--wide .q summary { padding: 1.1rem 0; font-size: 1.02rem; }

/* ---------- Reveal (soft fade-up) ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-in { opacity: 1; transform: none; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  html { scroll-behavior: auto; }
  /* Marquee bleibt dekorativ animiert (aria-hidden, langsam) */
  .marquee__track { animation-duration: 32s !important; animation-iteration-count: infinite !important; }
}
