/* ==========================================================================
   Splashpage (Wireframe „Splashpage-v3“, Rahmen 3a–3d) und das reduzierte
   Gerüst für Impressum/Datenschutz im Splash-Modus. Maße 1:1 aus der Referenz.
   ========================================================================== */

/* Kopf: Logo links, Social-Icons rechts, keine Navigation */
.p2045-header-splash {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) 1.25rem;
}
.p2045-header-splash .p2045-logo { width: 112px; }
@media (min-width: 768px) {
  .p2045-header-splash { gap: var(--space-5); padding: var(--space-5) var(--p2045-gutter-splash); }
  .p2045-header-splash .p2045-logo { width: 150px; }
}

/* Hero */
.p2045-splash-hero {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
  padding: 2.5rem 1.25rem 3.5rem;
}
.p2045-splash-hero > .p2045-bars { max-width: 100%; }
.p2045-splash-hero .p2045-lead { max-width: 36rem; font-size: 1.0625rem; }
@media (min-width: 768px) {
  .p2045-splash-hero { gap: var(--space-6); padding: var(--space-8) var(--p2045-gutter-splash) var(--space-9); }
  .p2045-splash-hero .p2045-lead { font: var(--text-lead); }
}
.p2045-lead { margin: 0; text-wrap: pretty; }

/* Buttons im Hero: mobil volle Breite, Desktop untereinander wie in 3c */
.p2045-actions { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-3); width: 100%; }
@media (min-width: 768px) {
  .p2045-actions { align-items: flex-start; width: auto; }
}

/* Newsletter (rote Fläche, links Headline + Text, rechts weiße Karte) */
.p2045-nl {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: 3.5rem 1.25rem;
  background: var(--red-500);
  color: var(--white);
}
@media (min-width: 900px) {
  .p2045-nl {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-8);
    align-items: start;
    padding: var(--space-9) var(--p2045-gutter-splash);
  }
}
.p2045-nl__copy { display: flex; flex-direction: column; gap: var(--space-5); }
.p2045-nl__copy .p2045-bars { color: var(--black); }
.p2045-nl__copy .p2045-lead { max-width: 30rem; font-size: 1.0625rem; }
@media (min-width: 768px) {
  .p2045-nl__copy .p2045-lead { font: var(--text-lead); }
}
.p2045-nl__card {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: 1.25rem;
  overflow: hidden;
  background: var(--white);
  color: var(--text-primary);
  border: var(--border-solid);
  box-shadow: var(--shadow-hard);
}
@media (min-width: 768px) { .p2045-nl__card { padding: var(--space-6); } }
.p2045-form__fields { display: flex; flex-direction: column; gap: var(--space-4); }
.p2045-form__row { display: grid; grid-template-columns: 1fr; gap: var(--space-4); }
@media (min-width: 560px) { .p2045-form__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* Folge uns */
.p2045-follow {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  padding: 3.5rem 1.25rem;
}
.p2045-follow__head { display: flex; flex-direction: column; gap: var(--space-4); }
.p2045-follow__title { font-size: var(--size-2xl); line-height: var(--leading-tight); letter-spacing: var(--tracking-display); text-transform: none; }
@media (min-width: 768px) {
  .p2045-follow {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-6);
    padding: var(--space-9) var(--p2045-gutter-splash);
  }
}

/* Fuß (weiß, 2-px-Linie oben) */
.p2045-footer-splash {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  padding: var(--space-5) 1.25rem;
  border-top: var(--border-solid);
}
@media (min-width: 768px) { .p2045-footer-splash { padding: var(--space-6) var(--p2045-gutter-splash); } }
.p2045-footer-splash__brand { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); }
.p2045-footer-splash .p2045-logo { width: 120px; }
.p2045-copyright { font: var(--text-small); color: var(--text-secondary); }
.p2045-legal { display: flex; flex-wrap: wrap; gap: var(--space-5); font-weight: var(--weight-bold); }
.p2045-legal a { color: var(--black); }
.p2045-legal a:hover { color: var(--red-500); }

/* Eingangsanimation: Eyebrow, Headline, Text, Buttons blenden gestaffelt ein (Reduced Motion: sofort) */
.p2045-splash-hero > * { animation: p2045-rise 700ms cubic-bezier(.22, 1, .36, 1) both; }
.p2045-splash-hero > :nth-child(2) { animation-delay: 90ms; }
.p2045-splash-hero > :nth-child(3) { animation-delay: 180ms; }
.p2045-splash-hero > :nth-child(4) { animation-delay: 270ms; }

/* Auto-Reload zum Gründungstermin: kurz ausblenden statt hartem Schnitt */
body { transition: opacity 150ms ease-in; }
body.p2045-leaving { opacity: 0; }

/* ---- Unterseiten im Splash-Modus (Impressum, Datenschutz) ----------------- */
.p2045-page { padding: var(--space-6) 1.25rem var(--space-9); }
@media (min-width: 768px) { .p2045-page { padding: var(--space-8) var(--p2045-gutter-splash) var(--space-9); } }
.p2045-page__title {
  max-width: var(--container-text);
  margin: 0 0 var(--space-6);
  font-size: clamp(2.125rem, .9rem + 5.2vw, 4.25rem);
  line-height: var(--leading-display);
}
.p2045-page .wp-block-post-content { max-width: var(--container-narrow); }
.p2045-page .wp-block-post-content > * + * { margin-top: var(--space-4); }
.p2045-page .wp-block-post-content h2 { margin-top: var(--space-7); font: var(--text-h2); font-family: var(--font-display); font-stretch: var(--display-stretch); }
.p2045-page .wp-block-post-content h3 { margin-top: var(--space-6); }
.p2045-page .wp-block-post-content ul,
.p2045-page .wp-block-post-content ol { padding-left: 1.4em; }
.p2045-page .wp-block-post-content li + li { margin-top: var(--space-1); }
.p2045-back { margin: 0 0 var(--space-5); font: var(--text-label); letter-spacing: var(--tracking-label); text-transform: uppercase; }

/* Lange Wörter in Seitentiteln („Datenschutzerklärung“) auf schmalen Bildschirmen trennen statt mittendrin umzubrechen */
.p2045-page__title { hyphens: auto; overflow-wrap: break-word; }
@media (max-width: 480px) { .p2045-page__title { font-size: 1.75rem; } }