/* Excelsior – Platzhalterseite „Website in Bearbeitung“
   Farben, Schriften und Footer-Verlauf wie auf excelsior-glatz.at */

@font-face {
  font-family: "Amatic SC";
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/amatic-sc-700.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-weight: 300 700;
  font-display: swap;
  src: url("assets/fonts/roboto-latin-wght.woff2") format("woff2");
}

:root {
  --navy: #01426a;
  --blue: #009fe3;
  --text: #5f5e5e;
  --paper: #fff;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  background: var(--paper);
  color: var(--text);
  font: 300 1.0625rem/1.65 "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ---------- Inhalt ---------- */

.hold {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(2.5rem, 8vh, 5rem) 1rem clamp(2rem, 5vh, 3rem);
}

.hold__logo {
  display: block;
  width: clamp(170px, 42vw, 226px);
  height: auto;
  filter: drop-shadow(0 10px 18px rgba(1, 66, 106, .18));
}

.hold__kicker {
  margin: clamp(1.75rem, 5vh, 3rem) 0 0;
  color: var(--blue);
  font: 700 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1 "Amatic SC", cursive;
  letter-spacing: .06em;
}

.hold__title {
  max-width: 40rem;
  margin: .3rem 0 0;
  color: var(--navy);
  font: 700 clamp(2.75rem, 1.5rem + 5vw, 5rem)/.95 "Amatic SC", cursive;
  text-wrap: balance;
}

.hold__text {
  max-width: 34rem;
  margin: 1.25rem 0 0;
  text-wrap: pretty;
}

/* Drei Punkte wie beim Slider der Startseite – laufen als „wird geladen“ durch */
.hold__dots {
  display: flex;
  gap: .45rem;
  margin-top: 2rem;
}
.hold__dots span {
  width: .7rem;
  height: .7rem;
  border: 2px solid var(--navy);
  border-radius: 50%;
  animation: dot 1.8s infinite;
}
.hold__dots span:nth-child(2) { animation-delay: .6s; }
.hold__dots span:nth-child(3) { animation-delay: 1.2s; }

@keyframes dot {
  0%, 30% { background: var(--navy); }
  36%, 100% { background: transparent; }
}

/* sanftes Einblenden beim Laden */
.hold > * {
  animation: rise .8s var(--ease-out) both;
}
.hold__kicker { animation-delay: .08s; }
.hold__title { animation-delay: .16s; }
.hold__text { animation-delay: .24s; }
.hold > .hold__dots { animation: rise .8s var(--ease-out) .32s both; }

@keyframes rise {
  from { opacity: 0; transform: translateY(14px); }
}

/* ---------- Impressum ---------- */

.hold--legal { justify-content: flex-start; }
.hold--legal .hold__title { margin-top: clamp(1.5rem, 4vh, 2.5rem); }

.legal {
  display: grid;
  grid-template-columns: minmax(9rem, 15rem) 1fr;
  gap: .9rem 2rem;
  width: 100%;
  max-width: 46rem;
  margin: 2rem 0 0;
  padding-top: 2rem;
  border-top: 1px solid #e5e5e5;
  font-size: .975rem;
  text-align: left;
}
.legal dt { color: var(--navy); font-weight: 700; }
.legal dd { margin: 0; overflow-wrap: anywhere; }
.legal a,
.legal__back a { color: var(--navy); text-underline-offset: 3px; }
.legal__back { margin: 2.5rem 0 0; }

@media (max-width: 36rem) {
  .legal { grid-template-columns: 1fr; gap: .15rem; }
  .legal dt:not(:first-child) { margin-top: .9rem; }
}

/* ---------- Footer mit Welle ---------- */

.foot {
  position: relative;
  padding: clamp(4.5rem, 3rem + 7vw, 8.5rem) 1rem 2.5rem;
  color: #fff;
  text-align: center;
  background: var(--blue);
  background: linear-gradient(-45deg, var(--navy) 0, var(--blue) 60%, var(--blue) 100%);
}

.foot__wave {
  position: absolute;
  top: -1px;
  left: 0;
  display: block;
  width: 100%;
  height: clamp(48px, 2rem + 6vw, 130px);
  fill: var(--paper);
}

.foot__address {
  position: relative;
  display: grid;
  justify-items: center;
  gap: .1rem;
  font-size: .95rem;
  font-style: normal;
  line-height: 1.55;
}
.foot__address strong { font-weight: 700; }

.foot a {
  color: inherit;
  text-decoration: none;
  border-radius: 2px;
}
.foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.foot a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.foot__mail { font-weight: 700; }

.foot__nav {
  position: relative;
  margin-top: 1.25rem;
  font-size: .85rem;
  font-weight: 400;
  letter-spacing: .04em;
  text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
  .hold > *,
  .hold > .hold__dots,
  .hold__dots span { animation: none; }
  .hold__dots span:first-child { background: var(--navy); }
}
