:root {
      --primary: #181818;
      --secondary: #eee;
      --accent: #fff;
      --navbar-height: 74px;
      --logo-size-w: 120px;
      --logo-size-h: 60px;
      --btn-main: #fff;
      --btn-txt: #111;
      --btn-main-hover: #232323;
      --mobile-padding: 16px;
      --border-radius: 16px;
      --daten-value: #fff;
      --daten-label: #fff;
    }
    *, *::before, *::after { box-sizing: border-box; }
    body {
      margin: 0;
      font-family: 'Montserrat', Arial, sans-serif;
      background: var(--primary);
      color: var(--secondary);
      min-height: 100vh;
      scroll-behavior: smooth;
      overflow-x: hidden; 
    }
    nav {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: var(--navbar-height);
      background: rgba(10,10,10, 0.97);
      display: flex;
      align-items: center;
      justify-content: space-between;
      z-index: 998;
      box-shadow: 0 2px 8px rgba(0,0,0,0.11);
      padding: 0 4vw;
    }
    main {
      margin-top: var(--navbar-height);
      padding: 2rem 1.5rem 4rem 1.5rem;
      display: flex;
      flex-direction: column;
      align-items: center;
      min-height: calc(100vh - var(--navbar-height));
    }
    .nav-logo-wrap {
      display: flex;
      align-items: center;
    }
    .nav-logo {
      height: var(--logo-size-h);
      width: var(--logo-size-w);
      object-fit: contain;
      border-radius: 6px;
    }
    .navbar-links {
      display: flex;
      align-items: center;
    }
    .navbar-links ul {
      list-style: none;
      display: flex;
      gap: 2.2rem;
      align-items: center;
      margin: 0;
    }
    nav a {
      color: var(--secondary);
      text-decoration: none;
      padding: 0 4px;
      font-weight: 500;
      letter-spacing: 1px;
      transition: color .2s;
      font-size: 1.05rem;
      cursor: pointer;
      white-space: nowrap;
    }
    nav a:hover {
      color: rgb(90, 90, 90);
    }
    .hamburger {
      display: none;
      flex-direction: column;
      justify-content: center;
      cursor: pointer;
      width: 36px;
      height: 36px;
      z-index: 1001;
      margin-right: 2vw;
    }
    .hamburger span {
      height: 4px;
      width: 31px;
      background: var(--accent);
      margin: 5px 0;
      border-radius: 3px;
      display: block;
      transition: all 0.32s;
    }
    @media (max-width: 750px) {
      .navbar-links ul {
        position: fixed;
        top: 0;
        right: -100vw;
        width: 100vw;
        height: 100vh;
        background: #191919;
        flex-direction: column;
        gap: 3rem;
        align-items: center;
        justify-content: center;
        padding: var(--navbar-height) 0 0 0;
        box-shadow: 0 2px 23px #000;
        transition: right 0.33s ease;
        z-index: 1000;
        font-size: 1.9rem;
      }
      .navbar-links ul.active {
        right: 0;
      }
      .hamburger {
        display: flex;
      }
      .navbar-links ul li a {
        padding: 0 12px;
      }
      nav {
        padding: 0 2vw;
      }
      .nav-logo { 
        height: 65px; 
        width: 95px; 
      }
    }
    .hamburger.active span:nth-child(1) {
      transform: rotate(45deg) translate(8px, 7px);
    }
    .hamburger.active span:nth-child(2) {
      opacity: 0;
    }
    .hamburger.active span:nth-child(3) {
      transform: rotate(-45deg) translate(7px, -7px);
    }
    section { width: 100vw; min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; scroll-margin-top: var(--navbar-height); padding-left: var(--mobile-padding); padding-right: var(--mobile-padding); position: relative; }
    /* HERO SECTION & TECHNISCHE DATEN ZEILE */
    .hero {
      width: 100vw; min-height: calc(100vh - var(--navbar-height));
      display: flex; flex-direction: column; align-items: center; justify-content: center;
      background: none; box-sizing: border-box;
    }
    .hero-img-wrap {
      width: 100%; max-width: 900px;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 3.6rem;
    }
    .hero-img {
      width: 100%;
      max-width: 860px;
      min-width: 240px;
      aspect-ratio: 32 / 7 !important;
      object-fit: contain;
      border-radius: 28px;
      background: transparent;
      box-shadow: none;
      min-height: 240px;
      max-height: 540px;
      margin: 0 auto;
      transition: max-height 0.2s, aspect-ratio 0.2s;
    }
    .daten-name {
      color: #7a7a7a;
      font-size: 2.1rem;
      font-weight: 900;
      letter-spacing: 0.02em;
      margin: 32px 0 36px 0;
      text-align: center;
      line-height: 1.14;
      text-shadow: 0 2px 0.5px rgb(255, 255, 255);
      font-family: Georgia, 'Times New Roman', Times, serif;
    }
    .datenzeile {
      width: 100%; max-width: 1180px;
      display: grid; 
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(2, auto);
      gap: 2.3vw 1.7rem;
      justify-items: center;
      margin-top: 0;
      row-gap: 2.1rem;
      z-index: 2;
    }
    .daten-info {
      display: flex;
      flex-direction: column;
      align-items: center;
      min-width: 120px;
      max-width: 230px;
      padding: 12px 0.7vw;
      box-sizing: border-box;
      background: none;
    }
    .daten-label {
      color: var(--daten-label);
      font-size: 1.14em;
      font-weight: 600;
      margin-bottom: 0.24em;
      letter-spacing: 0.03em;
      line-height: 1.11;
      text-align: center;
      white-space: nowrap;
    }
    .daten-value {
      color: var(--daten-value);
      font-size: 1.63em;
      font-weight: 700;
      letter-spacing: 0.01em;
      line-height: 1.05;
      word-break: break-word;
      white-space: nowrap;
      text-shadow: 0 1px 10px rgba(0,0,0,0.16);
    }
    .daten-info:nth-child(n+9) { grid-row: 2; }
    .daten-info:nth-child(5){grid-column:1;}
    .daten-info:nth-child(6){grid-column:2;}
    .daten-info:nth-child(7){grid-column:3;}
    .daten-info:nth-child(8){grid-column:4;}
    @media (max-width:1100px){
      .datenzeile {max-width:99vw;}
      .daten-info{min-width:100px;max-width:180px;}
    }
    @media (max-width:900px) {
      .datenzeile {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, auto);
        gap: 1.23rem 0.8rem;
        row-gap: 1.6rem;
      }
      .daten-info:nth-child(n) { grid-row: unset; grid-column: unset; }
    }
    @media (max-width:600px){
      .hero-img{aspect-ratio: 18/7 !important;max-height:150px;}
      .datenzeile{display:flex;flex-direction:column;align-items:center;gap:1.13rem;margin-top:0;}
      .daten-info{font-size:1.09rem;max-width:96vw;min-width:99px;}
      .daten-name{font-size:1.75rem;margin:20px 0 22px;}
    }
    .gallery-section { width: 100vw; min-height: 100vh; padding: 4vh var(--mobile-padding); display: flex; justify-content: center; align-items: center; background: var(--primary);}
    .gallery-wrap { width: 100%; max-width: 1250px; display: grid; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); grid-auto-rows: 230px; gap: 2.5rem;}
    .gallery-img { width: 100%; height: 100%; object-fit: cover; border-radius: 20px; background: #232323; border: 4px solid #404040; box-shadow: 0 0 15px 2px rgba(0,0,0,0.4);}
    @media(max-width:600px){
      .gallery-section {min-height:70vh;padding:3vh 3vw;}
      .gallery-wrap {display:flex;flex-direction:column;align-items:center;gap:1.8rem;width:100%;max-width:350px;}
      .gallery-img {width:100%;height:auto;max-height:210px;border-radius:12px;}
    }
    .cta-section { background:  var(--primary); width: 100vw; min-height: 75vh; padding: 5vh var(--mobile-padding); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2rem; box-sizing: border-box;}
    .cta-question { color: var(--accent); font-size: clamp(2.6rem, 7vw, 3.4rem); font-weight: 700; max-width: 720px; line-height: 1.13; text-align: center; user-select: text; letter-spacing: 0.01em; text-shadow: 0 0 8px rgba(255 255 255 / 0.3);}
    .cta-button { background: var(--btn-main); color: var(--btn-txt); font-size: 1.75rem; font-weight: 700; padding: 1.4em 3.2em; border-radius: 30px; box-shadow: 0 1px 14px rgba(0,0,0,0.24); border: 1px solid #d0d0d0; text-decoration: none; cursor: pointer; user-select: none; min-width: 230px; text-align: center; white-space: nowrap; transition: background 0.18s, color 0.18s; }
    .cta-button:hover, .cta-button:focus { background: var(--btn-main-hover); color: var(--accent); outline: none; }
    @media(max-width:600px){
      .cta-section {min-height:60vh;padding:4vh var(--mobile-padding);}
      .cta-question {font-size:2.3rem;max-width:95vw;}
      .cta-button {font-size:1.4rem;padding:1.1em 2.5em;min-width:180px;white-space:normal;}
      .daten-label {font-size: 1.03em;}
      .daten-value {font-size: 1.03em;}
    }

    footer {
      background: var(--footer-bg); color: #dadada;
      padding: 40px 6vw 18px 6vw;
      width: 100vw; border-top: 1.7px solid var(--footer-border);
      display: flex; gap: 16px; flex-wrap: wrap; justify-content: center;
      align-items: flex-start; font-weight: 400;
    }
    .footer-grid {
      display: flex; width: 100%; justify-content: center;
      gap: 52px; flex-wrap: wrap;
      max-width: 1250px; margin: 0 auto 33px auto;
    }
    .footer-col {
      flex: 1 1 170px;
      min-width: 160px; max-width: 230px;
      padding-bottom: 11px;
      display: flex; flex-direction: column; align-items: flex-start;
    }
    .footer-col h3 {
      margin-bottom: 8px; margin-top: 0;
      font-size: 1.05rem; color: #fff; letter-spacing: 1.1px;
      font-weight: bold;
    }
    .footer-col address, .footer-col a, .footer-col div, .footer-col p {
      font-size: 0.99rem; color: #bbb; font-style: normal; text-decoration: none; margin-bottom: 3px;
      line-height: 1.6;
      background: none;
      border: none;
      padding: 0;
      display: block;
      word-break: break-all;
    }
    .footer-col a {
      color: #bbb;
      text-decoration: none;
      transition: color 0.16s;
      cursor: pointer;
    }
    .footer-col a:hover {
      color: #fff;
      text-decoration: underline;
    }
    .footer-bar {
      width: 100%; display: flex; margin: 0 auto 0 auto; justify-content: center; align-items: center;
    }
    .footer-bar hr {
      width: 66vw; max-width: 400px; border: none;
      border-top: 1.3px solid #353535; margin: 0 auto;
    }
    .footer-copyright {
      width: 100%;
      padding-top: 17px; padding-bottom: 3px;
      text-align: center;
      color: #bdbdbd;
      font-size: 0.96rem;
      font-weight: 500;
      letter-spacing: 0.6px;
      user-select: none;
    }
    @media (max-width: 900px) {
      .footer-grid { gap: 19px; }
      .footer-col { flex-basis: 41%; min-width: 130px; }
    }
    @media (max-width: 600px) {
      footer { padding: 23px 6vw 13px 6vw;}
      .footer-grid { flex-direction: column; gap: 0; }
      .footer-col {max-width: unset; min-width: unset; padding-bottom: 21px;}
    }