/* Startseite vor der Party (auch in der Testseite verwendet) */
  .pre { position: relative; min-height: 100%; height: 100%; overflow-y: auto; container-type: size; }
  .pre .inner { position: relative; z-index: 1; min-height: 100%; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; padding: max(20px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom)); max-width: 1200px; margin: 0 auto; }
  .pre .top { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 900; letter-spacing: 0.12em; font-size: 14px; text-transform: uppercase; }
  .pre .top .when { background: #E6FF2E; color: #111111; padding: 5px 10px; letter-spacing: 0.06em; }
  .pre .mid { display: flex; flex-direction: column; gap: 6px; }
  .pre .kicker { font-size: clamp(16px, 2.4cqw, 26px); font-weight: 900; letter-spacing: 0.3em; color: #E6FF2E; }
  .pre .days { font-size: clamp(56px, 18cqw, 190px); font-weight: 900; line-height: 0.95; letter-spacing: -0.05em; }
  .pre .clock { font-size: clamp(44px, 16cqw, 170px); font-weight: 900; line-height: 1; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
  .pre .bottom { display: flex; flex-direction: column; gap: 14px; }
  .pre .bottom p { font-size: 17px; color: #C9C9C2; max-width: 34em; }
  .pre .cta { align-self: flex-start; background: #E6FF2E; color: #111111; border: 0; font-size: 18px; min-height: 56px; padding: 0 24px; }
  .pre .cta:hover { background: #F2FF8A; color: #111111; }
  @container (min-width: 760px) {
    .pre .inner { padding: 40px 56px; }
    .pre .bottom { flex-direction: row; align-items: flex-end; justify-content: space-between; }
  }

  .pre .bg26 { position: absolute; }
  .pre .bg26 span { font-size: min(150cqw, 130cqh); }