/*! The Golden Club · Compiaz Design · © 2026 */

/* Hero */
.gc-hero {
  position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; isolation: isolate;
  box-sizing: border-box; min-height: clamp(640px, 100svh, 1000px); padding: 148px 24px 120px; background: #111; text-align: center;
}
.gc-hero .gc-hero-bg, .gc-hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.gc-hero-bg { z-index: -2; object-fit: cover; object-position: center 70%; animation: gc-hero-zoom 24s ease-in-out infinite alternate; }
.gc-hero-shade {
  z-index: -1;
  background:
    radial-gradient(ellipse 60% 55% at 50% 45%, rgba(0, 0, 0, .15), rgba(0, 0, 0, .55) 70%),
    linear-gradient(180deg, rgba(0, 0, 0, .35), rgba(0, 0, 0, .25) 40%, rgba(17, 20, 46, .85));
}
.gc-hero-inhalt { display: flex; flex-direction: column; align-items: center; }

/* Logo mit Schimmer */
.gc-hero-logo-wrap {
  position: relative; width: clamp(160px, 17vw, 250px); aspect-ratio: 677 / 680;
  animation: gc-hero-logo-in 1.4s cubic-bezier(.2, .8, .2, 1) .1s both;
}
.gc-hero-logo-schweben { position: absolute; inset: 0; animation: gc-hero-schweben 7s ease-in-out 1.6s infinite; }
.gc-hero-glow {
  position: absolute; inset: -18%; z-index: -1; border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 185, 55, .55), rgba(201, 185, 55, 0) 62%);
  animation: gc-hero-glow 5s ease-in-out infinite;
}
.gc-hero-logo { display: block; width: 100%; height: auto; filter: drop-shadow(0 18px 40px rgba(0, 0, 0, .45)); }
.gc-hero-logo-schweben::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .75) 50%, transparent 65%) no-repeat;
  background-size: 250% 100%; background-position: 150% 0;
  -webkit-mask: url("../img/logo-rund.webp?v=bb8947cc37") center / contain no-repeat;
  mask: url("../img/logo-rund.webp?v=bb8947cc37") center / contain no-repeat;
  animation: gc-hero-schimmer 7s ease-in-out 2.2s infinite;
}

/* Schrift */
.gc-hero-titel {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0 .28em; margin: 34px 0 0;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(40px, 7vw, 104px);
  line-height: 1; letter-spacing: -.02em; color: #fff; text-transform: uppercase;
}
.gc-hero-titel span { display: inline-block; animation: gc-hero-wort 1s cubic-bezier(.2, .8, .2, 1) both; }
.gc-hero-the { font-size: .42em; letter-spacing: .2em; color: rgba(255, 255, 255, .85); animation-delay: .55s !important; }
.gc-hero-golden { color: #c9b937; animation-delay: .7s !important; }
.gc-hero-club { animation-delay: .85s !important; }
.gc-hero-sub {
  display: flex; align-items: center; gap: 14px; margin: 22px 0 0; color: rgba(255, 255, 255, .8);
  font-size: clamp(12px, 1.1vw, 15px); font-weight: 600; letter-spacing: .32em; text-transform: uppercase;
  animation: gc-hero-wort 1s cubic-bezier(.2, .8, .2, 1) 1.05s both;
}
.gc-hero-sub::before, .gc-hero-sub::after { content: ""; width: 40px; height: 1px; background: #c9b937; }

/* Scroll-Hinweis */
.gc-hero-scroll {
  position: absolute; bottom: 32px; left: 50%; display: flex; justify-content: center; width: 28px; height: 46px;
  margin-left: -14px; border: 2px solid rgba(255, 255, 255, .55); border-radius: 14px; transition: border-color .2s;
  animation: gc-fade 1s ease-out 1.6s both;
}
.gc-hero-scroll span { width: 4px; height: 9px; margin-top: 8px; border-radius: 2px; background: #c9b937; animation: gc-hero-maus 2s ease-in-out infinite; }
.gc-hero-scroll:hover, .gc-hero-scroll:focus-visible { border-color: #c9b937; }

@keyframes gc-hero-zoom { from { transform: scale(1); } to { transform: scale(1.12); } }
@keyframes gc-hero-logo-in { from { opacity: 0; transform: scale(.8) translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes gc-hero-schweben { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes gc-hero-glow { 0%, 100% { opacity: .55; transform: scale(.95); } 50% { opacity: 1; transform: scale(1.05); } }
@keyframes gc-hero-schimmer { 0%, 70% { background-position: 150% 0; } 100% { background-position: -50% 0; } }
@keyframes gc-hero-wort { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes gc-hero-maus { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(14px); } }
@keyframes gc-fade { from { opacity: 0; } to { opacity: 1; } }

/* Handy: alles im sichtbaren Bereich, passt sich jeder Grösse an */
@media (max-width: 767px) {
  .gc-hero { box-sizing: border-box; height: 100svh; min-height: 480px; max-height: 964px; padding: 88px 20px 72px; }
  .gc-hero-logo-wrap { width: min(52vw, 30svh, 240px); }
  .gc-hero-titel { flex-wrap: nowrap; margin-top: min(26px, 3.5svh); font-size: min(9.4vw, 7svh, 64px); }
  .gc-hero-sub { margin-top: min(18px, 2.5svh); font-size: min(3.2vw, 13px); letter-spacing: .24em; }
  .gc-hero-sub::before, .gc-hero-sub::after { width: 24px; }
  .gc-hero-scroll { bottom: 22px; width: 24px; height: 40px; margin-left: -12px; }
}
/* Tablet hochkant */
@media (min-width: 768px) and (max-width: 1099px) and (orientation: portrait) {
  .gc-hero { box-sizing: border-box; height: 100svh; min-height: 640px; max-height: 1084px; padding-top: 148px; }
  .gc-hero-logo-wrap { width: min(34vw, 28svh, 300px); }
}
/* Querformat und niedrige Bildschirme */
@media (max-height: 560px) and (orientation: landscape) {
  .gc-hero { box-sizing: border-box; height: 100svh; min-height: 340px; max-height: none; padding: 76px 24px 24px; }
  .gc-hero-inhalt { display: grid; grid-template-columns: auto auto; column-gap: 4vw; align-items: center; text-align: left; }
  .gc-hero-logo-wrap { grid-row: 1 / 3; width: min(52svh, 30vw); }
  .gc-hero-titel { align-self: end; }
  .gc-hero-sub { align-self: start; }
  .gc-hero-titel { flex-direction: column; align-items: flex-start; margin: 0; font-size: min(14svh, 8vw); line-height: 1.02; }
  .gc-hero-the { font-size: .4em; }
  .gc-hero-sub { margin-top: 3svh; }
  .gc-hero-sub::after { display: none; }
  .gc-hero-scroll { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .gc-hero *, .gc-hero-bg { animation: none !important; }
}

/* 404 */
.gc-404{padding:180px 20px 120px;text-align:center}
.gc-404-in{max-width:640px;margin:0 auto}
.gc-404-code{margin:0;font:800 120px/1 'Plus Jakarta Sans',sans-serif;color:#b3a210}
.gc-404-titel{margin:10px 0 20px}
.gc-404-links .button{margin:6px}