:root{
  
  --lnk-text-xxl: clamp(1.728rem, calc(1.2542824681vw + 1.4457864447rem), 2.5166301018rem);
  --lnk-space-m:  clamp(1.5rem, calc(0.5964214712vw + 1.365805169rem), 1.875rem);
  --lnk-space-xl: clamp(2.6653335rem, calc(2.4706425447vw + 2.1094389274rem), 4.21875rem);
}

/* ---- Hero-Sub (Foto + Verlauf + "LINKTREE"-Ueberschrift) ---- */
.hero-sub--linktree{
  position:relative;
  overflow:hidden;
  height:50vh; /* 1:1 Original (_height:"50vh" auf #brxe-nvpqvx) */
  display:flex;
  align-items:center;
  justify-content:center;
  
  margin-top:-70px;
}
.hero-sub--linktree__media{
  position:absolute;
  inset:0;
  z-index:-1;
}
.hero-sub--linktree__media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover; /* Kritischer Fix: war ungestylt -> Bild rendert nur in
    Intrinsic-Breite (1271px), rechts bleibt bei breiten Viewports Weissraum.
    1:1 Original-Regel ".hero-sub__image img{object-fit:cover}". */
  object-position:center center;
}
@media (max-width:478px){
  /* 1:1 Original-Mobile-Override (".hero-sub__image img{object-position:68.49% 48.99%}"
     unter @media max-width:478px) — anderer Bildausschnitt auf sehr schmalen Viewports. */
  .hero-sub--linktree__media img{object-position:68.49% 48.99%;}
}
.hero-sub--linktree__overlay{
  position:absolute;
  inset:0;
  z-index:1;
  /* Kritischer Fix: fehlte komplett (Div kollabierte auf height:0 ohne eigene CSS).
     1:1 Original-Regel ".hero-sub__overlay{background-image:linear-gradient(45deg,
     var(--black-trans-70), transparent)}", --black-trans-70 = rgba(0,0,0,.7). */
  background-image:linear-gradient(45deg, rgba(0,0,0,.7), transparent);
}
.hero-sub--linktree__container{
  position:relative;
  z-index:2;
  margin-top:70px; /* kompensiert das margin-top:-70px auf .hero-sub--linktree oben,
    haelt die (bereits vorher korrekt verifizierte) vertikale Textposition der
    "LINKTREE"-Ueberschrift unveraendert — 1:1 Original-Regel
    ".hero-sub__container{margin-top:70px}". */
}
.hero-sub--linktree__heading{
  margin:0;
  color:#fff; /* war schwarz */
  text-align:center;
  text-transform:uppercase; /* war none -> zeigte "Linktree" statt "LINKTREE" */
  font-family:var(--font-heading); /* Cormorant — war Poppins/Body-Default */
  font-weight:700; /* war Default-400 */
  line-height:1.4;
  /* 60.4px bei >=1440px, 41.75px bei 375px — 1:1 Original-Formel
     "calc(var(--text-xxl) * 1.5)", war statisch 34px (44% zu klein). */
  font-size:calc(var(--lnk-text-xxl) * 1.5);
}

/* Sitewide-Muster-Fix B (2026-08-12), Korrektur von Fix-Runde 5 Befund 2/3 (2026-08-11):
   die dortige Messung hatte nur das AEUSSERE <header>-Tag geprueft (dort tatsaechlich
   transparent) und daraus "Original startet transparent, wird erst ab Scroll-Tiefe solide"
   geschlossen. Frischer Deep-Dive (getComputedStyle je Kind-Element, Original) zeigt: die
   TATSAECHLICH sichtbare Flaeche ist ein inneres <section class="header-grace">-Element mit
   EIGENEM, konstantem background-color:rgba(0,0,0,.7) — identisch bei scrollY 0/50/100/200/
   400/700/900px, auf 375px UND 1440px, per Screenshot gegengeprueft (kein "nahtloser
   Uebergang", echter dunkler Balken von Anfang an sichtbar). Derselbe Messfehler-Typ wie bei
   den Event-Einzelseiten (RECHECK 2026-08-11, s. single-event.php-Historie) — dort bereits
   einmal aufgedeckt, hier zum zweiten Mal bestaetigt. Der 2026-08-11 dokumentierte "Deep-
   Scroll-Lesbarkeits-Tradeoff" existiert damit nicht: es gibt nie eine transparente Phase,
   also auch keinen Lesbarkeitsbug zu vermeiden. .is-scrolled-Script (page-links.php) +
   Override hier entfernt, .site-header faellt zurueck auf den sitewide main.css-Default
   (konstant rgba(0,0,0,.7), identisch zu allen anderen geprueften Seiten). Fix-Runde 5 hatte
   selbst dokumentiert: "falls eine strikte 1:1-Bug-Replikation gewuenscht ist, reicht das
   Entfernen des kleinen Scripts + der .is-scrolled-Regel" — exakt das hier umgesetzt, nur
   dass es kein Bug zum Replizieren war, sondern der main.css-Default bereits korrekt war.
   Hero-Pullup (margin-top:-70px oben) bleibt unangetastet, eigenstaendig verifiziert. */

/* ---- Linktree-Sektion (Buttons + Kontakt-CTA) ---- */
.linktree{
  position:relative;
  
  padding:
    clamp(48.6262px, calc(32.9701px + 4.17495vw), 75.7217px)
    clamp(20.5964px, calc(5.6859px + 3.97614vw), 46.4016px);
}
@media (min-width:1024px){
  .linktree{
    padding:
      clamp(75.7217px, calc(40.5751px + 3.43228vw), 90px)
      clamp(46.4016px, calc(12.9286px + 3.26885vw), 60px);
  }
}
.linktree__bg{
  position:absolute;
  inset:0;
  background-size:cover;
  
  background-position:0% 0%;
  z-index:0;
}
.linktree__bg::before{
  
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(rgba(255,255,255,.8), rgba(255,255,255,.8));
}
.linktree__container{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  row-gap:var(--lnk-space-xl); /* 1:1 Original ".linktree__container{row-gap:var(--space-xl)}" */
}
.linktree__list{
  display:flex;
  flex-direction:column;
  row-gap:var(--lnk-space-m); /* Kritischer Fix: war 0px, Buttons verschmolzen optisch */
  margin:0;
  padding:0;
  list-style:none;
  width:100%;
}
.linktree__list-item{
  display:flex;
  flex-direction:column;
  align-items:center; /* ⚠ Nachiterations-Fund (eigene Verifikation nach Erstdeploy): ohne
    align-items:center stretchen Flex-Kinder per Default (align-items:stretch) auf die volle
    Container-Breite — die Buttons wurden dadurch alle exakt 1100px breit (identisch mit dem
    Container) statt ihrer eigenen Textbreite, obwohl text-align:center bereits gesetzt war
    (text-align wirkt nur auf INLINE-Kinder, aber im Flex-Layout ist align-items fuer die
    Kind-Breite verantwortlich). 1:1 Original-Regel ".linktree__list-item{text-align:center;
    align-items:center}" — align-items war im ersten Deploy versehentlich nicht mit
    uebernommen worden. */
  row-gap:var(--lnk-space-m); /* fuer den Fall mit 2 gestapelten Buttons in einem <li>
    (Ibiza+Austria) — im Original hat derselbe Abstand exakt denselben Wert wie
    zwischen den <li>-Elementen selbst, 1:1 gemessen. */
  text-align:center;
}
.linktree__link{
  /* Feinheiten-Audit-Fund: Original transitioniert "border" komplett (Breite+Stil+Farbe),
     die geteilte .btn-Regel in main.css transitioniert nur "border-color" — hier
     seitenspezifisch auf border korrigiert statt main.css (Hot-File) anzufassen. */
  transition:background .3s ease-in-out,color .3s ease-in-out,border .3s ease-in-out,translate .3s ease-in-out;
}
.linktree__kontakt{
  text-align:center;
  /* Fix 2026-08-12 (kleinere Punkte): Original-Element (#brxe-xchnlz, `.brxe-block`) bezieht
     seinen Zitat-zu-Button-Abstand NICHT aus einer Margin, sondern aus Automatic.css'
     sitewide Default `:where(.brxe-block){gap:var(--content-gap)}` (--content-gap ist 1:1
     --space-m, live per getComputedStyle bestaetigt: 24,09px@375 bis 30px@1440+, identisch
     zu --lnk-space-m oben in dieser Datei). War hier ein reiner Block ohne Flex/Gap --
     Abstand kam stattdessen (zu knapp) aus der festen 16px-Margin unten an .linktree__quote. */
  display:flex;
  flex-direction:column;
  align-items:center;
  row-gap:var(--lnk-space-m);
}
.linktree__quote{
  /* Kritischer Fix (pingeliger UX-Experte, 2026-08-12): main.css/links.css hatte nie eine
     eigene Typografie-Regel fuer diese Klasse, Element fiel auf den Poppins-Body-Fallback
     (17px/24.65px) zurueck statt der Zitat-Display-Schrift. Original-Regel roh aus
     post-870.min.css gezogen: "#brxe-iofjqi{text-align:center;font-size:var(--text-xxl);
     font-family:"Cormorant"}" — dieselbe --text-xxl-Variable wie beim Hero-Heading (dort
     *1.5), hier UNSKALIERT. --lnk-text-xxl ist bereits oben in :root definiert, hier
     wiederverwendet statt dupliziert. */
  /* Fix 2026-08-12 (kleinere Punkte): hartes margin-bottom:16px entfernt (war zu knapp UND
     falscher Mechanismus, s. Kommentar bei .linktree__kontakt oben) -- der Abstand zum
     "Kontakt"-Button kommt jetzt korrekt aus dem row-gap des Eltern-Flexcontainers. */
  margin:0;
  font-family:var(--font-heading); /* "Cormorant",serif — 1:1 wie .hero-sub--linktree__heading */
  font-size:var(--lnk-text-xxl);
  font-weight:400; /* Original setzt keinen eigenen Wert, erbt Normal/400 — explizit gesetzt
    statt sich auf die Kaskade zu verlassen, da diese Klasse jetzt eine eigene Font-Family hat */
  /* line-height ist NICHT proportional zu font-size (Verhaeltnis reicht von 0.989@320px bis
     0.921@1366px+, per 13-Breakpoint-Sweep 320-1920px gegen die echte Originalseite
     empirisch bestaetigt) — eigene, unabhaengige Fluid-Formel aus den echten Randmesswerten
     abgeleitet (Elbow-Punkte 360px/1366px decken sich exakt mit denen von --text-xxl selbst,
     <0.002px Abweichung an allen 13 gemessenen Punkten). */
  line-height:clamp(27.3381px, calc(23.8516px + 0.9685vw), 37.0807px);
}