:root{
  --board-dark:#14181A;
  --board-dark-2:#191F20;
  --board-light:#F2EDE2;
  --brass:#B8925A;
  --brass-bright:#D9B776;
  --alpine:#33473A;
  --ink:#E8E3D6;
  --ink-dim:#9BA39A;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--board-dark);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
}

/* Hintergrund: geschichtete Alpin-Konturen, nach unten wärmer (Alpenglühen) */
.contours{
  position:fixed;
  left:0; right:0; bottom:0;
  width:100%; height:62vh;
  z-index:0;
  pointer-events:none;
}

/* schwebende Glas-"Event"-Karten — dezente Anspielung auf Turniere/Events, kein Schachbrett */
.ticket{
  position:fixed;
  border-radius:12px;
  background:linear-gradient(160deg, rgba(217,183,118,0.14), rgba(217,183,118,0.03));
  border:1px solid rgba(255,255,255,0.14);
  backdrop-filter:blur(10px) saturate(150%);
  -webkit-backdrop-filter:blur(10px) saturate(150%);
  box-shadow:0 6px 24px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.18);
  z-index:1;
  pointer-events:none;
}
.ticket-1{ width:150px; height:96px; top:12vh; left:6vw;  transform:rotate(-7deg); }
.ticket-2{ width:110px; height:74px; top:20vh; right:9vw; transform:rotate(5deg); }
.ticket-3{ width:130px; height:82px; bottom:16vh; left:11vw; transform:rotate(4deg); opacity:0.85; }
.ticket-4{ width:96px;  height:64px; bottom:22vh; right:14vw; transform:rotate(-5deg); opacity:0.7; }

@media (max-width:760px){
  .ticket-2, .ticket-4{ display:none; }
  .ticket-1{ width:110px; height:70px; top:8vh; left:-14px; }
  .ticket-3{ width:100px; height:64px; bottom:10vh; right:-10px; left:auto; }
}

.vignette{
  position:fixed;
  inset:0;
  background:radial-gradient(ellipse at 50% 34%, transparent 0%, var(--board-dark) 82%);
  z-index:2;
  pointer-events:none;
}

.wrap{
  position:relative;
  z-index:3;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:8vh 6vw 4vh;
  text-align:center;
}

/* Glas-Panel für den gesamten Hero-Inhalt */
.hero-glass, .section-glass{
  position:relative;
  max-width:600px;
  width:100%;
  padding:clamp(2.2rem, 5vw, 3.6rem) clamp(1.6rem, 6vw, 3.4rem);
  border-radius:24px;
  background:linear-gradient(160deg, rgba(242,237,226,0.14), rgba(242,237,226,0.04));
  backdrop-filter:blur(26px) saturate(160%);
  -webkit-backdrop-filter:blur(26px) saturate(160%);
  border:1px solid rgba(255,255,255,0.16);
  box-shadow:
    0 20px 60px rgba(0,0,0,0.45),
    inset 0 1px 0 rgba(255,255,255,0.3),
    inset 0 0 50px rgba(217,183,118,0.05);
  transition:transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.hero-glass:hover{
  transform:translateY(-4px);
  border-color:rgba(217,183,118,0.4);
  box-shadow:
    0 24px 70px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,255,255,0.35),
    inset 0 0 60px rgba(217,183,118,0.08);
}
.hero-glass::before, .section-glass::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:24px;
  padding:1px;
  background:linear-gradient(135deg, rgba(217,183,118,0.55), rgba(255,255,255,0.05) 40%, rgba(217,183,118,0.18));
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}

.hero-image{
  display:block;
  width:100%;
  height:auto;
  border-radius:16px;
  margin-bottom:1.8rem;
}

.sr-only{
  position:absolute;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

h1{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(1.35rem, 4.6vw, 2.1rem);
  line-height:1.2;
  margin:0 auto 1.3rem;
  max-width:30ch;
  text-align:center;
  color:var(--board-light);
}
h1 em{
  font-style:italic;
  font-weight:400;
  color:var(--brass-bright);
}

.sub{
  max-width:46ch;
  font-size:1.05rem;
  line-height:1.6;
  color:var(--ink-dim);
  margin:0 auto 2.4rem;
}

.links{
  display:flex;
  gap:0.9rem;
  flex-wrap:wrap;
  justify-content:center;
}
.chip{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.8rem;
  letter-spacing:0.02em;
  color:var(--ink);
  text-decoration:none;
  border:1px solid rgba(184,146,90,0.4);
  background:rgba(242,237,226,0.04);
  padding:0.85rem 1.2rem;
  display:inline-block;
  border-radius:999px;
  transition:border-color 0.25s ease, color 0.25s ease, background 0.25s ease;
}
.chip:hover{
  border-color:var(--brass-bright);
  color:var(--board-light);
  background:rgba(184,146,90,0.12);
}
.chip:focus-visible,
address a:focus-visible{
  outline:2px solid var(--brass-bright);
  outline-offset:3px;
  border-radius:4px;
}

/* Neue Sektionen unter dem Hero: Referenzen & Projekte, Abschluss-Zitat */
.content-section{
  position:relative;
  z-index:3;
  display:flex;
  justify-content:center;
  padding:0 6vw 4vh;
}
.section-glass h2{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(1.5rem, 3.4vw, 2.1rem);
  color:var(--board-light);
  margin:0 0 1.6rem;
  text-align:center;
}

.section-plain{
  max-width:600px;
  width:100%;
}

@media (min-width:1025px){
  .hero-glass, .section-glass, .section-plain{
    max-width:1000px;
  }
}
.divider-heading{
  display:flex;
  align-items:center;
  gap:1rem;
  margin:0 0 2rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.82rem;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--brass-bright);
}
.divider-heading::before,
.divider-heading::after{
  content:"";
  flex:1;
  height:1px;
  background:rgba(184,146,90,0.4);
}

.reference-grid{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.1rem 2rem;
  text-align:left;
}
.reference-grid li{
  display:flex;
  align-items:flex-start;
  gap:0.7rem;
  color:var(--ink-dim);
  font-size:0.98rem;
  line-height:1.4;
}
.ref-icon{
  width:22px;
  height:22px;
  flex-shrink:0;
  margin-top:0.05em;
  fill:none;
  stroke:var(--brass-bright);
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
@media (max-width:640px){
  .reference-grid{ grid-template-columns:1fr; }
}

.closing-block{
  text-align:center;
}
.piece-divider{
  display:flex;
  align-items:center;
  gap:1rem;
  margin:0 0 1.6rem;
}
.piece-divider::before,
.piece-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:rgba(184,146,90,0.4);
}
.piece-divider svg{
  width:26px;
  height:26px;
  flex-shrink:0;
  fill:var(--brass-bright);
}
.closing-line{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(1.3rem, 3vw, 1.7rem);
  color:var(--brass-bright);
  margin:0 0 0.5rem;
}
.motto-img{
  display:inline-block;
  width:clamp(180px, 34vw, 260px);
  height:auto;
  transform:rotate(-3deg);
  margin:0.4rem 0 1.8rem;
}
.closing-block blockquote{
  margin:0;
  padding-top:1.4rem;
  border-top:1px solid rgba(184,146,90,0.18);
}
.closing-block blockquote p{
  font-size:0.95rem;
  color:var(--ink-dim);
  margin:0 0 0.4rem;
  font-style:italic;
}
.closing-block cite{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0.5rem;
  font-style:normal;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.78rem;
  letter-spacing:0.05em;
  color:var(--ink-dim);
}
.pawn-icon{
  width:16px;
  height:16px;
  fill:var(--brass-bright);
}

footer{
  position:relative;
  z-index:3;
  width:100%;
  background:rgba(20,24,26,0.6);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border-top:1px solid rgba(184,146,90,0.18);
  padding:2.2rem 6vw 0.6rem;
  display:flex;
  flex-direction:column;
}
.footer-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1.2rem;
  padding-bottom:1.8rem;
}

.brand{
  display:flex;
  align-items:center;
  gap:1rem;
}
/* Logo-Leiste: aktuell nur Giorgio Events, später docken hier Sponsoren-Logos
   als weitere .logo-badge Elemente an (gleiche Höhe, Trenner automatisch) */
.logo-strip{
  display:flex;
  align-items:stretch;
  flex-shrink:0;
}
.logo-badge{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  height:56px;
  padding:0;
  background:var(--board-light);
  border-top:2px solid var(--brass);
  border-radius:8px;
  box-shadow:0 8px 24px rgba(184,146,90,0.22), 0 3px 10px rgba(0,0,0,0.3);
  transition:transform 0.25s ease, box-shadow 0.25s ease;
}
.logo-badge:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 32px rgba(184,146,90,0.32), 0 4px 14px rgba(0,0,0,0.35);
}
.logo-badge + .logo-badge{ margin-left:16px; }
.logo-badge + .logo-badge::before{
  content:"";
  position:absolute;
  left:-16px; top:10%;
  width:1px; height:80%;
  background:rgba(184,146,90,0.3);
}
.logo-badge img{
  max-width:calc(100% - 5px);
  max-height:calc(100% - 5px);
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
}
.brand-name{
  font-family:'Inter',sans-serif;
  font-size:0.92rem;
  color:var(--ink-dim);
  line-height:1.3;
}
.brand-name strong{
  display:block;
  color:var(--ink);
  font-weight:600;
}
.footer-counter{
  font-family:'Inter',sans-serif;
  font-size:0.92rem;
  color:var(--ink-dim);
}

/* Impressum & Datenschutzerklärung Dropdown */
.legal-details{
  border-top:1px solid rgba(184,146,90,0.14);
}
.legal-details summary{
  list-style:none;
  cursor:pointer;
  display:block;
  padding:1rem 0;
  text-align:center;
  font-family:'Inter',sans-serif;
  font-size:0.78rem;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-dim);
  transition:color .2s ease;
  user-select:none;
}
.legal-details summary::-webkit-details-marker{ display:none; }
.legal-details summary::marker{ display:none; }
.legal-details summary::after{
  content:' \25BE';
  font-size:0.75em;
  vertical-align:middle;
}
.legal-details[open] summary::after{ content:' \25B4'; }
.legal-details summary:hover{ color:var(--brass-bright); }

.legal-content{
  padding-bottom:2rem;
}
.legal-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.8rem 2.4rem;
  padding-top:1.4rem;
  border-top:1px solid rgba(184,146,90,0.1);
}
.legal-section h3{
  font-family:'Fraunces',serif;
  font-size:0.95rem;
  font-weight:600;
  color:var(--brass-bright);
  margin:0 0 0.7rem;
  letter-spacing:0.03em;
}
.legal-section p{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.78rem;
  color:var(--ink-dim);
  line-height:1.65;
  margin:0 0 0.6rem;
}
.legal-section strong{ color:var(--ink); }
.legal-section a{
  color:var(--ink-dim);
  text-decoration:underline;
  text-underline-offset:3px;
}
.legal-section a:hover{ color:var(--brass-bright); }

@media (max-width:640px){
  footer{ align-items:stretch; }
}
@media (max-width:760px){
  .legal-grid{ grid-template-columns:1fr; gap:1.4rem; }
}