:root {
      --black: #111111;
      --white: #f8f6f1;
      --gray: #777777;
      --light-gray: #e6e1d8;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html {
      background: #111111;
    }

    body { 
      min-height: 100vh; 
      min-height: 100dvh; 
      font-family: Georgia, "Times New Roman", serif; 
      background: linear-gradient(rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0.55)), 
      /*url("https://images.unsplash.com/photo-1519741497674-611481863552?auto=format&fit=crop&w=1800&q=80"); */ 
      url("./img/LocationBild2.jpg"); 
      background-size: cover; 
      background-position: center; 
      color: var(--white); 
      display: flex; 
      align-items: center; 
      justify-content: center; 
      padding: 24px; 
    }

    .card {
      width: 100%;
      max-width: 720px;
      padding: 56px 32px;
      border: 1px solid rgba(255, 255, 255, 0.55);
      background: rgba(10, 10, 10, 0.68);
      backdrop-filter: blur(3px);
      text-align: center;
      box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
    }

    .label {
      font-family: Arial, sans-serif;
      font-size: 13px;
      letter-spacing: 5px;
      text-transform: uppercase;
      color: var(--light-gray);
      margin-bottom: 28px;
    }

    h1 {
      font-size: clamp(44px, 8vw, 64px);
      font-weight: 400;
      line-height: 1;
      margin-bottom: 24px;
    }

    .ampersand {
      display: block;
      font-size: clamp(34px, 6vw, 56px);
      font-style: italic;
      margin: 8px 0;
      color: var(--light-gray);
    }

    .divider {
      width: 120px;
      height: 1px;
      background: var(--white);
      margin: 34px auto;
      position: relative;
    }

    .divider::before,
    .divider::after {
      content: "";
      position: absolute;
      top: -4px;
      width: 9px;
      height: 9px;
      border: 1px solid var(--white);
      transform: rotate(45deg);
      background: transparent;
    }

    .divider::before {
      left: -18px;
    }

    .divider::after {
      right: -18px;
    }

    .date {
      font-family: Arial, sans-serif;
      font-size: clamp(22px, 4vw, 36px);
      letter-spacing: 6px;
      margin-bottom: 24px;
    }

    .text {
      max-width: 520px;
      margin: 0 auto;
      font-size: 18px;
      line-height: 1.7;
      color: #eeeae2;
    }

    .location {
      margin-top: 32px;
      font-family: Arial, sans-serif;
      font-size: 13px;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--light-gray);
    }

    .note {
      margin-top: 42px;
      font-size: 14px;
      color: #cfc8bc;
      font-style: italic;
    }

    @media (max-width: 520px) {
      .card {
        padding: 42px 22px;
      }

      .date {
        letter-spacing: 3px;
      }

      .text {
        font-size: 16px;
      }
    }

    .termin {
      color: var(--white);
    }

    .menu {
      background-color: red;
    }