@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Regular.woff2') format('woff2'),
        url('../fonts/OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
	}

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

    body{
      font-family:'Open Sans';
      background:#1a1a1a;
      color:#f5f5f5;
      overflow-x:hidden;
      line-height:1.8;
      position:relative;
	  background-image: url('../images/bg_ultima.jpg');  
	  background-attachment: fixed;
	  background-size: 100vw;
	  }

    /* Hintergrund */
    body::before{
      content:"";
      position:fixed;
      inset:0;
      background:
      radial-gradient(circle at top left, rgba(212,175,55,0.15), transparent 40%),
      radial-gradient(circle at bottom right, rgba(212,175,55,0.08), transparent 40%);
      z-index:-2;
      animation:bgMove 12s infinite alternate ease-in-out;
    }
	
	.top-nav{
	  width:100%;
	  display:flex;
	  justify-content:center;
	  gap:30px;
	  padding:20px 0;
	  position:absolute;
	  top:0;
	  left:0;
	  z-index:10;
	}

	.top-nav a{
	  color:#d4af37;
	  text-decoration:none;
	  font-size:1rem;
	  letter-spacing:2px;
	  transition:0.3s;
	}

	.top-nav a:hover{
	  color:#fff;
	  text-shadow:0 0 10px rgba(212,175,55,0.6);
	}

    @keyframes bgMove{
      from{
        transform:scale(1) rotate(0deg);
      }
      to{
        transform:scale(1.08) rotate(2deg);
      }
    }

    /* GOLD PARTICLES */
    .particles{
      position:fixed;
      inset:0;
      overflow:hidden;
      z-index:-1;
      pointer-events:none;
    }

    .particle{
      position:absolute;
      width:4px;
      height:4px;
      background:#d4af37;
      border-radius:50%;
      opacity:0.3;
      animation:floatParticle linear infinite;
    }

    @keyframes floatParticle{
      from{
        transform:translateY(100vh);
      }
      to{
        transform:translateY(-10vh);
      }
    }

    header{
      min-height:100vh;
      display:flex;
      justify-content:center;
      align-items:center;
      text-align:center;
      padding:60px 10%;
      position:relative;
    }

    .hero{
      max-width:1200px;
      animation:fadeIn 1.8s ease;
    }

    .hero h1{
      font-size:5rem;
      color:#d4af37;
      margin-bottom:25px;
      text-shadow:0 0 25px rgba(212,175,55,0.4);
      letter-spacing:4px;
    }

    .hero p{
      font-size:1.4rem;
      color:#ddd;
      max-width:900px;
      margin:auto;
    }

    .scroll-btn{
      margin-top:45px;
      display:inline-block;
      padding:15px 40px;
      border:2px solid #d4af37;
      border-radius:10px;
      color:#d4af37;
      text-decoration:none;
      transition:0.4s;
      font-size:1.1rem;
    }

    .scroll-btn:hover{
      background:#d4af37;
      color:#111;
      transform:translateY(-5px);
      box-shadow:0 0 30px rgba(212,175,55,0.4);
    }

    /* HERO IMAGE */
    .hero-image{
      margin-top:60px;
      display:flex;
      justify-content:center;
    }

    .hero-image img{
      width:100%;
      max-width:1000px;
      border-radius:10px;
      border:2px solid rgba(212,175,55,0.25);
      box-shadow:0 0 45px rgba(212,175,55,0.15);
      transition:0.5s;
    }

    .hero-image img:hover{
      transform:scale(1.02);
      box-shadow:0 0 60px rgba(212,175,55,0.35);
    }

    section{
      padding:120px 10%;
    }

    .section-title{
      font-size:3rem;
      color:#d4af37;
      margin-bottom:50px;
      position:relative;
    }

    .section-title::after{
      content:"";
      width:120px;
      height:3px;
      background:#d4af37;
      position:absolute;
      left:0;
      bottom:-15px;
    }

    .glass-card{
      background:rgba(255,255,255,0.05);
      border:1px solid rgba(212,175,55,0.2);
      backdrop-filter:blur(10px);
      border-radius:10px;
      padding:45px;
      margin-bottom:50px;
      transition:0.4s;
      box-shadow:0 10px 40px rgba(0,0,0,0.35);
      position:relative;
      overflow:hidden;
    }

    .glass-card:hover{
      transform:translateY(-8px);
      border-color:#d4af37;
      box-shadow:0 0 35px rgba(212,175,55,0.2);
    }

    .glass-card h2{
      color:#d4af37;
      margin-bottom:25px;
      font-size:2rem;
    }

    .glass-card p{
      color:#f0f0f0;
      font-size:1.15rem;
    }

    ul{
      margin-top:25px;
      padding-left:20px;
    }

    li{
      margin-bottom:18px;
      color:#f2f2f2;
      font-size:1.08rem;
    }

    .highlight{
      color:#d4af37;
      font-weight:bold;
    }

    /* IMAGE GRID */
    .image-grid{
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
      gap:30px;
      margin-top:40px;
    }

    .image-box{
      overflow:hidden;
      border-radius:10px;
      position:relative;
      border:1px solid rgba(212,175,55,0.2);
      background:#111;
      transition:0.5s;
      min-height:280px;
    }

    .image-box img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
      transition:0.7s;
    }

    .image-box:hover{
      transform:translateY(-8px);
      box-shadow:0 0 35px rgba(212,175,55,0.25);
      border-color:#d4af37;
    }

    .image-box:hover img{
      transform:scale(1.08);
    }

    .image-box.large{
      min-height:500px;
    }

    .image-box::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(
        to top,
        rgba(0,0,0,0.45),
        transparent
      );
    }

    /* PARALLAX */
    .parallax{
      height:450px;
      //background:url('../images/parallax-placeholder.jpg') center/cover fixed;
      position:relative;
      display:flex;
      justify-content:center;
      align-items:center;
      margin:50px 0;
    }

    .parallax::before{
      content:"";
      position:absolute;
      inset:0;
      background:rgba(0,0,0,0.55);
    }

    .parallax h2{
      position:relative;
      z-index:1;
      color:#d4af37;
      font-size:4rem;
      text-shadow:0 0 20px rgba(212,175,55,0.4);
    }

    /* REVEAL */
    .reveal{
      opacity:0;
      transform:translateY(80px);
      transition:all 1s ease;
    }

    .reveal.active{
      opacity:1;
      transform:translateY(0);
    }

    footer{
      text-align:center;
      padding:60px;
      border-top:1px solid rgba(212,175,55,0.2);
      color:#999;
      margin-top:80px;
    }

    @keyframes fadeIn{
      from{
        opacity:0;
        transform:translateY(30px);
      }
      to{
        opacity:1;
        transform:translateY(0);
      }
    }

    /* RESPONSIVE */
    @media(max-width:768px){
	
		header{
    min-height:50vh; /* vorher 100vh */
    padding:40px 6%;
  }

  .hero h1{
    font-size:2.6rem; /* kleiner für Mobile */
    letter-spacing:2px;
    margin-bottom:15px;
  }

  .hero p{
    font-size:1rem;
    max-width:100%;
    line-height:1.6;
  }

  .hero-image{
    margin-top:30px;
  }

  .hero-image img{
    max-width:100%;
    border-radius:8px;
  }

      .hero h1{
        font-size:3rem;
      }

      .hero p{
        font-size:1.1rem;
      }

      .section-title{
        font-size:2.2rem;
      }

      .parallax h2{
        font-size:2.5rem;
      }

      section{
        padding:90px 8%;
      }

      .glass-card{
        padding:30px;
      }

    }