/* ═══════════════════════════════════════════════════
   DARION – Kinderzauberer & Ballonentertainment
   Design System v9 – Cross-Browser Fix
   ═══════════════════════════════════════════════════ */

/* Bunny Fonts – EU-gehostet, DSGVO-konform, kein Google */@import url('https://fonts.bunny.net/css2?family=nunito:wght@300;400;600;700;800&family=source-sans-3:wght@300;400;600&display=swap');

:root {
  --gold: #C9A84C; --gold-dim: rgba(201,168,76,0.15);
  --navy: #1B3A8C; --navy-dark: #0E1530;
  --cream: #F5F0E8; --text-muted: #c8c0b0;
  --stripe: repeating-linear-gradient(90deg, var(--gold) 0px, var(--gold) 18px, var(--navy) 18px, var(--navy) 36px);
  --fs-body: 1.15rem; --fs-small: 1rem;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Source Sans 3', sans-serif; font-weight: 300; background: var(--navy-dark); color: var(--cream); line-height: 1.75; overflow-x: hidden; font-size: var(--fs-body); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--gold); text-decoration: none; }
a:hover { opacity: 0.8; }

h1,h2,h3,h4 { font-family:'Nunito',sans-serif; font-weight:800; line-height:1.15; color:var(--cream); }
h1 { font-size: clamp(2.2rem,5vw,3.4rem); }
h2 { font-size: clamp(1.8rem,3.5vw,2.6rem); }
h3 { font-size: clamp(1.3rem,2.5vw,1.7rem); }
.section-label { font-family:'Nunito',sans-serif; font-size:clamp(1rem,1.8vw,1.2rem); font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold); opacity:0.9; }
.stripe { height:5px; background:var(--stripe); }
.ornament { display:flex; align-items:center; margin:0.75rem 0; }
.ornament::before,.ornament::after { content:''; flex:1; height:0.5px; background:var(--gold); opacity:0.4; }
.ornament-star { width:14px; height:14px; flex-shrink:0; margin:0 6px; }
.section-header { text-align:center; padding:3rem 1.5rem 2rem; }
.section-header .section-label { display:block; margin-bottom:0.75rem; }

.btn-primary { display:inline-block; background:var(--gold); color:var(--navy); font-family:'Nunito',sans-serif; font-weight:800; font-size:1.1rem; padding:0.9rem 2.2rem; border-radius:6px; border:none; cursor:pointer; text-decoration:none; white-space:nowrap; }
.btn-primary:hover { opacity:0.88; color:var(--navy); }
.btn-ghost { display:inline-block; background:transparent; color:var(--gold); font-family:'Nunito',sans-serif; font-weight:600; font-size:1.1rem; padding:0.9rem 2.2rem; border-radius:6px; border:1.5px solid var(--gold); cursor:pointer; text-decoration:none; white-space:nowrap; }
.btn-ghost:hover { background:var(--gold-dim); color:var(--gold); }

/* ─── Navigation ─────────────────────────────── */
#navbar { position:fixed; top:0; left:0; right:0; z-index:1000; background:rgba(27,58,142,0.97); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:0.5px solid rgba(201,168,76,0.25); padding:0 1.5rem; height:96px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { display:flex; align-items:center; text-decoration:none; }
.nav-logo img { height:88px; width:auto; filter:brightness(0) invert(1); -webkit-filter:brightness(0) invert(1); opacity:0.95; }
.nav-links { display:flex; gap:1.8rem; list-style:none; }
.nav-links a { font-family:'Nunito',sans-serif; font-size:1rem; font-weight:600; color:var(--cream); opacity:0.8; text-decoration:none; }
.nav-links a:hover { opacity:1; color:var(--gold); }
.nav-cta { margin-left:1rem; }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; }
.hamburger span { display:block; width:28px; height:2px; background:var(--cream); border-radius:2px; transition:all 0.3s; }
.hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
.mobile-menu { display:none; position:fixed; top:96px; left:0; right:0; background:rgba(14,21,48,0.98); padding:1.5rem; flex-direction:column; gap:1.2rem; z-index:999; border-bottom:0.5px solid rgba(201,168,76,0.25); }
.mobile-menu.open { display:flex; }
.mobile-menu a { font-family:'Nunito',sans-serif; font-size:1.3rem; font-weight:700; color:var(--cream); text-decoration:none; padding:0.4rem 0; border-bottom:0.5px solid rgba(201,168,76,0.1); }
.mobile-menu a:last-child { border:none; }
.mobile-sticky-cta { display:none; position:fixed; bottom:0; left:0; right:0; z-index:998; padding:0.8rem 1rem; background:rgba(14,21,48,0.95); border-top:1px solid rgba(201,168,76,0.3); }
.mobile-sticky-cta .btn-primary { width:100%; text-align:center; font-size:1.1rem; padding:0.9rem; }

/* ═══════════════════════════════════════════════════
   HERO – wrapper-div Methode für Edge/Safari
   ═══════════════════════════════════════════════════ */
#hero {
  margin-top: 96px;
  width: 100%;
  min-height: calc(100vh - 96px);
  background: var(--navy-dark);
}

/* Mobile/Tablet: Vollbild-Foto mit Text darüber */
.hero-wrapper {
  position: relative;
  width: 100%;
  min-height: calc(100vh - 96px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Desktop text column content – hidden on mobile */
.hero-desktop { display: none; }

/* ── Desktop: Zweispaltig ab 1024px ── */
@media (min-width: 1024px) {
  /* Hide mobile hero */
  #hero { display: none; }
  /* Show desktop hero */
  .hero-desktop {
    display: flex;
    width: 100%;
    min-height: calc(100vh - 80px);
    margin-top: 96px;
  }
  .hero-desktop-text {
    flex: 0 0 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem 3rem 3rem 4rem;
    background: var(--navy-dark);
    position: relative;
    z-index: 1;
  }
  .hero-desktop-photo {
    flex: 0 0 50%;
    position: relative;
    overflow: hidden;
  }
  .hero-desktop-photo img {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
  }
}

/* Hero-Hintergrundfoto via inline-style div im HTML */

/* Overlay */
.hero-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg,
    rgba(14,21,48,0.55) 0%,
    rgba(14,21,48,0.08) 35%,
    rgba(14,21,48,0.08) 55%,
    rgba(14,21,48,0.65) 100%);
  z-index: 1;
}

.stripe-hero { height:5px; background:var(--stripe); position:relative; z-index:3; flex-shrink:0; }

/* Oben: Titel direkt auf dem Foto */
.hero-top {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 1.2rem 1rem 0;
}
.hero-title-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}
.hero-title-text {
  font-family: 'Nunito', sans-serif;
  font-weight: 800;
  font-size: clamp(1.5rem, 3.5vw, 2.8rem);
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-shadow: -2px -2px 0 rgba(0,0,0,0.85), 2px -2px 0 rgba(0,0,0,0.85), -2px 2px 0 rgba(0,0,0,0.85), 2px 2px 0 rgba(0,0,0,0.85), 0 3px 14px rgba(0,0,0,0.95);
}
.hero-title-dot {
  color: var(--gold);
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  opacity: 0.9;
  text-shadow: 0 2px 8px rgba(0,0,0,0.8);
  line-height: 1;
}
.hero-schriftzug-row {
  margin-top: 0.3rem;
  text-align: center;
}
.hero-schriftzug {
  height: clamp(74px, 13vw, 158px);
  width: auto;
  filter: drop-shadow(0 2px 18px rgba(0,0,0,0.95));
  -webkit-filter: drop-shadow(0 2px 18px rgba(0,0,0,0.95));
  display: inline-block;
  margin: 0 auto;
}

/* Unten: Claim auf dem Foto */
.hero-bottom {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 0 1.5rem 2.5rem;
  /* Push block lower so face is not covered */
  margin-top: auto;
}
.hero-tagline { font-size:clamp(2.2rem,5.5vw,3.8rem); line-height:1.08; margin-bottom:0.6rem; color:var(--cream); text-shadow:-2px -2px 0 rgba(0,0,0,0.8),2px -2px 0 rgba(0,0,0,0.8),-2px 2px 0 rgba(0,0,0,0.8),2px 2px 0 rgba(0,0,0,0.8),0 4px 18px rgba(0,0,0,0.95); }
.hero-claim { font-family:'Nunito',sans-serif; font-weight:700; font-size:clamp(1.25rem,2.5vw,1.7rem); color:var(--gold); margin-bottom:0.5rem; text-shadow:-1px -1px 0 rgba(0,0,0,0.9),1px -1px 0 rgba(0,0,0,0.9),-1px 1px 0 rgba(0,0,0,0.9),1px 1px 0 rgba(0,0,0,0.9),0 3px 10px rgba(0,0,0,0.95); }
.hero-subtext { font-size:clamp(1.05rem,1.8vw,1.3rem); color:var(--cream); font-style:italic; line-height:1.65; text-shadow:-1px -1px 0 rgba(0,0,0,0.85),1px -1px 0 rgba(0,0,0,0.85),-1px 1px 0 rgba(0,0,0,0.85),1px 1px 0 rgba(0,0,0,0.85),0 3px 10px rgba(0,0,0,0.9); }

/* ═══════════════════════════════════════════════════
   USP – wrapper-div Methode für Edge/Safari
   ═══════════════════════════════════════════════════ */
#usps { background:var(--navy-dark); border-top:0.5px solid rgba(201,168,76,0.2); }
.usp-header { text-align:center; padding:3rem 2rem 1.5rem; }
.usp-header .section-label { display:block; font-size:clamp(1.1rem,2vw,1.4rem); margin-bottom:0.75rem; }
.usp-intro { max-width:880px; margin:0 auto 2.5rem; padding:0 2rem; text-align:center; font-size:clamp(1.05rem,1.8vw,1.2rem); color:var(--text-muted); line-height:1.85; }

.usp-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; max-width:1200px; margin:0 auto; padding:0 1.5rem 2.5rem; scrollbar-width:none; }
.usp-grid::-webkit-scrollbar { display:none; }

/* Kachel: wrapper-div mit expliziter Höhe */
.usp-card {
  /* background-image gesetzt via inline style im HTML */
  height: 260px;
  border-radius: 12px;
  border: 1.5px solid rgba(201,168,76,0.4);
  overflow: hidden;
  /* Flex: Text nach unten */
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* Text-Content */
.usp-card-content {
  padding: 1.25rem 1.1rem;
}
.usp-title { font-family:'Nunito',sans-serif; font-weight:800; font-size:clamp(1.2rem,1.8vw,1.45rem); color:var(--gold); margin-bottom:0.4rem; text-shadow:-1.5px -1.5px 0 rgba(0,0,0,0.9),1.5px -1.5px 0 rgba(0,0,0,0.9),-1.5px 1.5px 0 rgba(0,0,0,0.9),1.5px 1.5px 0 rgba(0,0,0,0.9),0 2px 6px rgba(0,0,0,0.95); }
.usp-text { font-size:clamp(0.95rem,1.3vw,1.05rem); color:var(--cream); line-height:1.6; text-shadow:-1px -1px 0 rgba(0,0,0,0.7),1px -1px 0 rgba(0,0,0,0.7),-1px 1px 0 rgba(0,0,0,0.7),1px 1px 0 rgba(0,0,0,0.7); }

/* ─── Gallery ─────────────────────────────────── */
#galerie { background:var(--navy); padding-bottom:0; }
.gallery-container { position:relative; padding:0 1.5rem 2rem; }
.gallery-track { display:flex; gap:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:0.5rem; }
.gallery-track::-webkit-scrollbar { display:none; }
.gallery-item { flex-shrink:0; width:340px; height:440px; border-radius:10px; overflow:hidden; scroll-snap-align:start; border:0.5px solid rgba(201,168,76,0.3); cursor:pointer; }
.gallery-item img { width:100%; height:100%; object-fit:cover; object-position:center top; display:block; }
.gallery-arrow { position:absolute; top:50%; transform:translateY(-60%); width:54px; height:54px; border-radius:50%; background:rgba(14,21,48,0.8); border:2px solid var(--gold); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:10; }
.gallery-arrow svg { width:22px; height:22px; stroke:var(--gold); stroke-width:2.5; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.gallery-prev { left:2rem; }
.gallery-next { right:2rem; }
.lightbox { display:none; position:fixed; inset:0; background:rgba(14,21,48,0.95); z-index:2000; align-items:center; justify-content:center; }
.lightbox.open { display:flex; }
.lightbox img { max-width:90vw; max-height:90vh; border-radius:8px; }
.lightbox-close { position:absolute; top:1rem; right:1.5rem; font-size:2.5rem; color:var(--gold); cursor:pointer; background:none; border:none; }

/* ─── Programme ──────────────────────────────── */
#programme { background:var(--navy-dark); }
.prog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:1100px; margin:0 auto; padding:0 1.5rem 2rem; }
.prog-card { background:rgba(27,58,142,0.3); border:1.5px solid rgba(201,168,76,0.4); border-radius:14px; overflow:hidden; display:flex; flex-direction:column; }
.prog-icon-area { height:130px; background:var(--navy); display:flex; align-items:center; justify-content:center; border-bottom:1px solid rgba(201,168,76,0.2); }
.prog-body { padding:1.5rem 1.5rem 0.75rem; flex:1; }
.prog-label { display:block; margin-bottom:0.5rem; }
.prog-title { font-size:1.35rem; margin-bottom:0.75rem; }
.prog-desc { font-size:var(--fs-body); color:var(--text-muted); line-height:1.75; }
.prog-details { padding:0.85rem 1.5rem; border-top:0.5px solid rgba(201,168,76,0.12); }
.prog-detail-item { display:flex; align-items:flex-start; gap:0.5rem; margin-bottom:0.5rem; font-size:var(--fs-small); color:var(--text-muted); }
.prog-detail-dot { width:5px; height:5px; border-radius:50%; background:var(--gold); opacity:0.7; flex-shrink:0; margin-top:0.55em; }
.prog-footer { padding:1rem 1.5rem 1.5rem; border-top:0.5px solid rgba(201,168,76,0.12); }
.prog-price { font-family:'Nunito',sans-serif; font-weight:800; font-size:1.6rem; color:var(--gold); margin-bottom:0.75rem; }
.prog-price-note { display:block; font-size:0.85rem; color:var(--text-muted); font-weight:300; margin-top:0.15rem; }

/* ─── Biografie ──────────────────────────────── */
#ueber-mich { background:var(--navy-dark); }
.bio-inner { display:grid; grid-template-columns:420px 1fr; gap:3rem; align-items:start; max-width:1100px; margin:0 auto; padding:3rem 1.5rem; }
.bio-photo { border-radius:10px; overflow:hidden; border:1.5px solid rgba(201,168,76,0.35); }
.bio-photo img { width:100%; height:520px; object-fit:cover; object-position:center top; display:block; }
.bio-text-col { padding-top:0.5rem; }
.bio-section-label { display:block; margin-bottom:0.5rem; }
.bio-title { font-size:clamp(1.5rem,2.5vw,2.1rem); margin-bottom:0.5rem; }
.bio-quote { border-left:2px solid rgba(201,168,76,0.4); padding-left:1rem; font-style:italic; color:var(--gold); font-size:clamp(1.05rem,1.6vw,1.2rem); line-height:1.65; margin:1rem 0; }
.bio-text { font-size:clamp(1.05rem,1.6vw,1.15rem); color:var(--text-muted); line-height:1.85; margin-bottom:0.9rem; }

/* ─── FAQ ─────────────────────────────────────── */
#faq { background:var(--navy-dark); border-top:0.5px solid rgba(201,168,76,0.15); }
.faq-list { max-width:880px; margin:0 auto; padding:0 1.5rem 2rem; }
.faq-item { border-bottom:0.5px solid rgba(201,168,76,0.12); }
.faq-question { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.5rem 0; cursor:pointer; user-select:none; -webkit-user-select:none; }
.faq-question:hover .faq-q-text { color:var(--gold); }
.faq-num { font-family:'Nunito',sans-serif; font-size:0.95rem; font-weight:600; color:var(--gold); opacity:0.55; min-width:28px; }
.faq-q-text { font-family:'Nunito',sans-serif; font-weight:700; font-size:clamp(1.1rem,1.8vw,1.25rem); color:var(--cream); flex:1; transition:color 0.2s; }
.faq-icon { width:26px; height:26px; border:1px solid rgba(201,168,76,0.4); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:transform 0.25s,background 0.2s; }
.faq-icon svg { width:11px; height:11px; stroke:var(--gold); }
.faq-item.open .faq-icon { transform:rotate(45deg); background:rgba(201,168,76,0.12); }
.faq-answer { display:none; padding:0 0 1.5rem 2rem; font-size:clamp(1rem,1.5vw,1.1rem); color:var(--text-muted); line-height:1.85; }
.faq-item.open .faq-answer { display:block; }
.faq-tag { display:inline-block; font-family:'Nunito',sans-serif; font-size:0.75rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; background:rgba(201,168,76,0.12); color:var(--gold); padding:0.2rem 0.65rem; border-radius:20px; margin-bottom:0.65rem; }

/* ─── Kontakt ─────────────────────────────────── */
#kontakt { background:var(--navy-dark); border-top:0.5px solid rgba(201,168,76,0.2); }
.kontakt-inner { max-width:840px; margin:0 auto; padding:0 1.5rem 2rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.form-full { grid-column:1/-1; }
.field { display:flex; flex-direction:column; gap:0.4rem; }
.field-label { font-family:'Nunito',sans-serif; font-size:0.85rem; font-weight:600; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold); opacity:0.88; }
.field-label .optional { color:var(--text-muted); font-weight:300; text-transform:none; letter-spacing:0; font-size:0.82rem; margin-left:0.3rem; }
.field-input,.field-textarea,.field-select { background:rgba(255,255,255,0.04); border:0.5px solid rgba(201,168,76,0.3); border-radius:6px; padding:0.85rem 1rem; font-family:'Source Sans 3',sans-serif; font-weight:300; font-size:var(--fs-body); color:var(--cream); outline:none; width:100%; -webkit-appearance:none; appearance:none; }
.field-input:focus,.field-textarea:focus,.field-select:focus { border-color:rgba(201,168,76,0.7); background:rgba(255,255,255,0.06); }
.field-input::-webkit-input-placeholder,.field-textarea::-webkit-input-placeholder { color:rgba(200,192,176,0.4); }
.field-input::placeholder,.field-textarea::placeholder { color:rgba(200,192,176,0.4); }
.field-textarea { min-height:120px; resize:vertical; }
.field-select { background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23C9A84C' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem; }
.field-select option { background:#0E1530; color:var(--cream); }
.anlass-group { display:flex; gap:0.5rem; flex-wrap:wrap; }
.anlass-btn { display:flex; align-items:center; gap:0.4rem; padding:0.65rem 1rem; border:0.5px solid rgba(201,168,76,0.3); border-radius:6px; cursor:pointer; background:rgba(255,255,255,0.03); font-family:'Nunito',sans-serif; font-size:1rem; font-weight:600; color:var(--text-muted); }
.anlass-btn.active { border-color:var(--gold); background:rgba(201,168,76,0.1); color:var(--gold); }
.anlass-dot { width:10px; height:10px; border-radius:50%; border:1.5px solid rgba(201,168,76,0.5); flex-shrink:0; }
.anlass-btn.active .anlass-dot { background:var(--gold); border-color:var(--gold); }
.form-footer-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-top:1.2rem; padding-top:1rem; border-top:0.5px solid rgba(201,168,76,0.12); }
.privacy-note { font-size:var(--fs-small); color:var(--text-muted); line-height:1.5; }
.privacy-note a { color:var(--gold); }
.contact-strip { display:flex; gap:1.5rem; flex-wrap:wrap; padding:1.1rem 1.5rem; background:rgba(201,168,76,0.06); border-top:0.5px solid rgba(201,168,76,0.15); max-width:840px; margin:1rem auto 0; }
.contact-item { display:flex; align-items:center; gap:0.5rem; font-size:var(--fs-body); color:var(--text-muted); }
.contact-item svg { width:18px; height:18px; flex-shrink:0; }
.contact-item a { color:var(--gold); }
.form-msg { display:none; padding:0.9rem 1rem; border-radius:6px; font-size:var(--fs-small); margin-top:0.75rem; font-family:'Nunito',sans-serif; font-weight:600; }
.form-msg.success { background:rgba(40,167,69,0.15); border:1px solid rgba(40,167,69,0.4); color:#6fcf97; display:block; }
.form-msg.error { background:rgba(220,53,69,0.15); border:1px solid rgba(220,53,69,0.4); color:#eb5757; display:block; }

/* ─── Footer ──────────────────────────────────── */
#footer { background:var(--navy); border-top:0.5px solid rgba(201,168,76,0.2); padding:2rem 1.5rem 0; }
.footer-inner { max-width:1000px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr 1fr; gap:1.5rem; }
.footer-schriftzug { height:52px; width:auto; margin-bottom:0.7rem; }
.footer-tagline { font-size:var(--fs-small); color:var(--text-muted); line-height:1.5; }
.footer-col h4 { font-family:'Nunito',sans-serif; font-size:0.88rem; font-weight:600; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold); opacity:0.85; margin-bottom:0.65rem; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:0.35rem; }
.footer-col ul a { font-size:var(--fs-small); color:var(--text-muted); text-decoration:none; }
.footer-col ul a:hover { color:var(--gold); }
.footer-bottom { max-width:1000px; margin:0.9rem auto 0; padding:0.8rem 0 1rem; border-top:0.5px solid rgba(201,168,76,0.15); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.5rem; }
.footer-legal { font-size:var(--fs-small); color:var(--cream); opacity:0.75; }
.footer-legal-links { display:flex; gap:0.5rem; align-items:center; }
.footer-legal-links a { font-size:var(--fs-small); color:var(--cream); opacity:0.9; text-decoration:none; }
.footer-legal-links a:hover { color:var(--gold); opacity:1; }
.footer-legal-sep { color:var(--gold); opacity:0.6; }

/* ─── Inner Pages ─────────────────────────────── */
.inner-page { margin-top:96px; min-height:calc(100vh - 96px); }
.inner-hero { background:var(--navy); padding:3.5rem 1.5rem; text-align:center; }
.inner-hero h1 { font-size:clamp(2rem,4vw,2.8rem); }
.page-content { max-width:840px; margin:0 auto; padding:2.5rem 1.5rem 4rem; background:var(--cream); color:#333; }
.page-content h1 { color:var(--navy); margin-bottom:1.5rem; }
.page-content h2 { color:var(--navy); font-size:1.2rem; margin:1.5rem 0 0.5rem; }
.page-content p { margin-bottom:0.9rem; font-size:1.05rem; line-height:1.8; color:#444; }
.page-content a { color:var(--navy); }
.page-content ul { padding-left:1.2rem; margin-bottom:0.9rem; }
.page-content ul li { font-size:1.05rem; line-height:1.75; color:#444; margin-bottom:0.3rem; }
.stadt-content { max-width:980px; margin:0 auto; padding:2.5rem 1.5rem; }
.stadt-grid { display:grid; grid-template-columns:1fr 340px; gap:2.5rem; align-items:start; }
.stadt-text { font-size:clamp(1.05rem,1.6vw,1.15rem); color:var(--text-muted); line-height:1.85; margin-bottom:1.2rem; }
.stadt-photo { width:100%; border-radius:10px; overflow:hidden; border:1px solid rgba(201,168,76,0.3); }
.stadt-photo img { width:100%; height:400px; object-fit:cover; object-position:center top; display:block; }
.stadt-cities { background:var(--navy); padding:1.5rem 0; }
.stadt-cities-inner { max-width:980px; margin:0 auto; padding:0 1.5rem; display:flex; gap:0.75rem; flex-wrap:wrap; justify-content:center; }
.stadt-city-link { font-size:var(--fs-small); color:var(--text-muted); text-decoration:none; padding:0.45rem 0.9rem; border:0.5px solid rgba(201,168,76,0.25); border-radius:5px; font-family:'Nunito',sans-serif; font-weight:600; }
.stadt-city-link:hover { color:var(--gold); border-color:var(--gold); }
.danke-center { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:60vh; text-align:center; padding:3rem 1.5rem; }

/* ─── Responsive ──────────────────────────────── */
@media (max-width:1100px) {
  .usp-grid { grid-template-columns:repeat(3,1fr); }
  .usp-card { height:240px; }
}
@media (max-width:900px) {
  .usp-grid { grid-template-columns:repeat(2,1fr); }
  .usp-card { height:220px; }
  .prog-grid { grid-template-columns:1fr; max-width:500px; }
  .bio-inner { grid-template-columns:1fr; }
  .bio-photo img { height:360px; }
  .footer-inner { grid-template-columns:1fr 1fr; }
  .stadt-grid { grid-template-columns:1fr; }
}
@media (max-width:768px) {
  :root { --fs-body:1.1rem; --fs-small:0.98rem; }
  .nav-links,.nav-cta { display:none; }
  .hamburger { display:flex; }
  .mobile-sticky-cta { display:block; }
  .hero-wrapper { min-height:calc(100vh - 80px); }
  .hero-top { padding:0.3rem 1rem 0; }
  .hero-title-text { font-size:clamp(1.1rem,5vw,1.5rem); }
  .hero-schriftzug { height:clamp(64px,17.3vw,101px); }
  .hero-title-dot { font-size:clamp(1rem,4vw,1.4rem); }
  .hero-bottom { padding:0 1.25rem 2rem; }
  .hero-tagline { font-size:clamp(1.8rem,7vw,2.6rem); }
  .hero-claim { font-size:clamp(1.05rem,4vw,1.3rem); }
  .hero-subtext { font-size:clamp(0.95rem,3.5vw,1.1rem); }
  /* USP mobile: horizontal scroll wie Galerie */
  .usp-grid {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding: 0 1.5rem 1rem;
    /* undo grid max-width/margin */
    max-width: none;
    margin: 0;
  }
  .usp-card {
    flex-shrink: 0;
    width: calc(100vw - 3rem);
    height: 280px;
    scroll-snap-align: start;
  }
  .gallery-item { width:270px; height:350px; }
  .gallery-prev { left:0.5rem; }
  .gallery-next { right:0.5rem; }
  .gallery-arrow { width:44px; height:44px; }
  .form-grid { grid-template-columns:1fr; }
  .form-full { grid-column:1; }
  .footer-inner { grid-template-columns:1fr; gap:1rem; }
  .footer-bottom { flex-direction:column; text-align:center; }
  body { padding-bottom:72px; }
}
@media (max-width:480px) {
  .usp-card { height:260px; width:calc(100vw - 3rem); }
}

/* USP Scroll Arrows – nur Mobile */
.usp-arrow-prev,
.usp-arrow-next {
  display: none;
}

@media (max-width:768px) {
  .usp-scroll-container {
    position: relative;
    padding-bottom: 0.5rem;
  }
  .usp-arrow-prev,
  .usp-arrow-next {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    /* Position below the card, not overlapping content */
    position: relative;
    top: auto;
    -webkit-transform: none;
    transform: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(14,21,48,0.85);
    border: 2px solid var(--gold);
    cursor: pointer;
    z-index: 20;
    padding: 0;
    flex-shrink: 0;
  }
  .usp-arrow-prev svg,
  .usp-arrow-next svg {
    width: 20px;
    height: 20px;
    stroke: var(--gold);
    stroke-width: 2.5;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  /* Arrow container: below grid, centered */
  .usp-scroll-container {
    position: relative;
    padding-bottom: 0.5rem;
  }
  .usp-nav-row {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 0;
    padding: 0 1.5rem;
  }

  /* Bigger text in USP cards on mobile */
  .usp-title { font-size: 1.2rem !important; }
  .usp-text { font-size: 1.05rem !important; line-height: 1.7 !important; }
}

/* ── Desktop Hero Text Styles ── */
.hero-desktop-title-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
.hero-desktop-title {
  font-family: 'Nunito', sans-serif;
  font-weight: 800;
  font-size: clamp(1.2rem, 1.8vw, 1.8rem);
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.hero-desktop-dot { color: var(--gold); font-size: 1.2rem; }
.hero-desktop-schriftzug {
  height: auto;
  max-height: 110px;
  width: auto;
  max-width: 380px;
  display: block;
  margin: 0.3rem 0 1.5rem;
  filter: drop-shadow(0 2px 10px rgba(0,0,0,0.5));
}
.hero-desktop-tagline {
  font-size: clamp(2rem, 3.5vw, 3.2rem);
  line-height: 1.1;
  margin-bottom: 0.75rem;
  color: var(--cream);
}
.hero-desktop-claim {
  font-family: 'Nunito', sans-serif;
  font-weight: 700;
  font-size: clamp(1rem, 1.5vw, 1.3rem);
  color: var(--gold);
  margin-bottom: 0.5rem;
}
.hero-desktop-subtext {
  font-size: clamp(0.95rem, 1.2vw, 1.1rem);
  color: var(--text-muted);
  font-style: italic;
  line-height: 1.65;
  margin-bottom: 2rem;
}
.hero-desktop-stripe {
  height: 5px;
  background: var(--stripe);
  position: absolute;
  bottom: 0; left: 0; right: 0;
}