/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.relative{position:relative}.start{inset-inline-start:var(--spacing)}.table{display:table}}:root{--ink:#08040f;--paper:#f1eee8;--muted:#a9a3af;--line:#ffffff24;--acid:#064375;--violet:#064375;--cyan:#08c7ed}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--ink)}body{background:var(--ink);color:#fff;font-family:var(--font-sans), Arial, sans-serif;margin:0}a{color:inherit;text-decoration:none}img,video{max-width:100%;display:block}::selection{background:var(--acid);color:var(--ink)}.site-header{z-index:20;border-bottom:1px solid var(--line);grid-template-columns:1fr auto auto;align-items:center;gap:54px;height:84px;padding:0 4vw;display:grid;position:absolute;top:0;left:0;right:0}.wordmark{letter-spacing:.04em;font-size:1.55rem;font-weight:800}.wordmark span{color:var(--acid)}.header-contact,.desktop-nav{letter-spacing:.03em;align-items:center;gap:30px;font-size:.76rem;display:flex}.header-contact{color:#ffffffb8}.desktop-nav a,.header-contact a{transition:color .18s}.desktop-nav a:hover,.header-contact a:hover{color:var(--acid)}.mobile-menu{display:none}.hero{isolation:isolate;background:radial-gradient(circle at 75% 35%,#08c7ed2e,#0000 28%),radial-gradient(circle at 30% 60%,#7f20ff4d,#0000 35%),#08040f;min-height:100svh;position:relative;overflow:hidden}.hero-image,.hero-shade{position:absolute;inset:0}.hero-image{z-index:-2;filter:saturate(1.08)contrast(1.05);background:url(media/fayrion-portrait.png) 50% 23%/cover no-repeat;left:38%}.hero-shade{z-index:-1;background:linear-gradient(90deg,#140016 0%,#140016f5 27%,#14001652 63%,#04020947 100%),linear-gradient(#0000 55%,#05030a7a)}.hero-content{flex-direction:column;justify-content:center;align-items:flex-start;min-height:100svh;padding:20vh 7vw 12vh;display:flex}.eyebrow,.kicker{color:var(--acid);letter-spacing:.2em;text-transform:uppercase;margin:0 0 24px;font-size:.72rem;font-weight:700}.hero h1{letter-spacing:-.075em;max-width:850px;margin:0;font-size:clamp(4.6rem,8.4vw,9rem);font-weight:700;line-height:.83}.hero h1 span{color:var(--acid);font-family:var(--font-serif), Georgia, serif;font-style:italic;font-weight:500}.text-link{border-bottom:1px solid var(--acid);letter-spacing:.12em;text-transform:uppercase;align-items:center;gap:18px;margin-top:48px;padding-bottom:10px;font-size:.78rem;font-weight:700;display:inline-flex}.text-link span{color:var(--acid);font-size:1.2rem}.hero-side{writing-mode:vertical-rl;letter-spacing:.25em;color:#6B049594;margin:0;font-size:.65rem;position:absolute;top:50%;right:3vw;transform:translateY(-50%)}.scroll-hint{color:#2D01548c;letter-spacing:.22em;text-transform:uppercase;align-items:center;gap:14px;font-size:.62rem;display:flex;position:absolute;bottom:4vh;right:7vw}.scroll-hint span{background:var(--acid);width:68px;height:1px}.section{padding:140px 7vw}.section-label{color:#837c8b;letter-spacing:.2em;text-transform:uppercase;font-size:.67rem;font-weight:700}.intro{background:var(--paper);color:#151118;grid-template-columns:minmax(140px,.55fr) 2.6fr;display:grid}.intro-copy{max-width:1160px}.intro h2,.section-heading h2,.media h2,.news h2,.contact h2{letter-spacing:-.06em;margin:0;font-size:clamp(3rem,6.3vw,7.5rem);line-height:.98}.intro h2{max-width:1050px}.intro h2 em,.contact h2 em{color:var(--violet);font-family:var(--font-serif), Georgia, serif;font-weight:500}.intro-grid{color:#5f5963;grid-template-columns:1fr 1fr;gap:7vw;max-width:850px;margin:70px 0 0 auto;font-size:.98rem;line-height:1.9;display:grid}.projects{background:#0b0710}.section-heading{justify-content:space-between;align-items:flex-end;gap:60px;margin-bottom:70px;display:flex}.section-heading h2{margin-top:20px;font-size:clamp(3rem,5.2vw,6.2rem)}.section-heading>p{max-width:390px;color:var(--muted);line-height:1.8}.project-grid{grid-template-columns:repeat(4,1fr);gap:18px;display:grid}.project-image{aspect-ratio:1;background:#17111c;position:relative;overflow:hidden}.project-image img{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s}.project-image span{background:var(--acid);color:#111;padding:7px 9px;font-size:.62rem;font-weight:800;position:absolute;top:14px;left:14px}.project-card:hover img{filter:saturate(1.2);transform:scale(1.035)}.project-card>p{color:var(--acid);letter-spacing:.16em;text-transform:uppercase;margin:20px 0 6px;font-size:.65rem;font-weight:700}.project-card h3{margin:0;font-size:1.18rem;font-weight:600}.project-note{border-top:1px solid var(--line);color:#77717d;margin:50px 0 0;padding-top:24px;font-size:.78rem}.media{background:radial-gradient(circle at 10%,#7f20ff52,#0000 32%),#120519;grid-template-columns:.8fr 1.4fr;align-items:center;gap:7vw;display:grid}.media h2{margin-bottom:34px;font-size:clamp(3rem,5.2vw,6rem)}.media-copy>p:last-child{max-width:480px;color:var(--muted);line-height:1.8}.media .section-label{margin-bottom:80px}.video-frame{background:#ffffff12;border:1px solid #ffffff21;padding:16px;position:relative;box-shadow:0 30px 80px #00000059}.video-frame video{aspect-ratio:16/10;object-fit:cover;background:#000;width:100%}.video-tag{background:var(--acid);color:#111;letter-spacing:.14em;text-transform:uppercase;padding:12px 16px;font-size:.61rem;font-weight:800;position:absolute;top:0;right:0}.news{color:#111;background:linear-gradient(120deg, #fffffff2, #e4e0e8f2), var(--paper);grid-template-columns:minmax(140px,.55fr) 2.6fr;display:grid}.news-inner{max-width:1000px}.news h2{max-width:960px}.news-inner>p:not(.kicker){color:#625c66;max-width:630px;margin:40px 0;line-height:1.8}.outline-button{letter-spacing:.13em;text-transform:uppercase;border:1px solid #171219;align-items:center;gap:30px;padding:17px 20px;font-size:.68rem;font-weight:800;transition:all .2s;display:inline-flex}.outline-button:hover{color:#2D0154;background:#171219}.contact{background:#08040f}.contact-grid{grid-template-columns:1.5fr .6fr;align-items:end;gap:7vw;margin-top:68px;display:grid}.contact h2 em{color:var(--acid)}.contact-details{border-left:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:22px;padding-left:32px;display:flex}.contact-details a:first-child{color:var(--acid);font-size:1.1rem}.contact-details address{color:var(--muted);font-style:normal;line-height:1.7}footer{border-top:1px solid var(--line);background:#040207;padding:55px 7vw 30px}.footer-top{grid-template-columns:90px 1fr auto;align-items:center;gap:25px;display:grid}.footer-top img{border-radius:50%;width:78px;height:78px}.footer-top p{color:#6f6874;letter-spacing:.16em;text-transform:uppercase;margin:0 0 5px;font-size:.68rem}.footer-top strong{letter-spacing:.08em;font-size:1.3rem}.footer-top>a{color:var(--acid);letter-spacing:.13em;text-transform:uppercase;font-size:.68rem;font-weight:700}.legal{border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:#8d8692;margin-top:50px;padding:22px 0}.legal summary{cursor:pointer;letter-spacing:.13em;text-transform:uppercase;font-size:.68rem;font-weight:700}.legal-grid{grid-template-columns:repeat(4,1fr);gap:40px;padding:36px 0 16px;display:grid}.legal-grid h3{color:#fff;font-size:.8rem}.legal-grid p{font-size:.74rem;line-height:1.7}.copyright{color:#5b5560;margin:24px 0 0;font-size:.66rem}@media (width<=1050px){.header-contact,.desktop-nav{display:none}.site-header{grid-template-columns:1fr auto}.mobile-menu{display:block;position:relative}.mobile-menu summary{cursor:pointer;flex-direction:column;justify-content:center;gap:6px;width:36px;height:32px;list-style:none;display:flex}.mobile-menu summary::-webkit-details-marker{display:none}.mobile-menu summary i{background:#fff;width:30px;height:1px}.mobile-menu nav{border:1px solid var(--line);background:#100914;flex-direction:column;width:210px;display:flex;position:absolute;top:48px;right:0}.mobile-menu nav a{border-bottom:1px solid var(--line);padding:16px 18px;font-size:.78rem}.project-grid{grid-template-columns:repeat(2,1fr);gap:50px 18px}.media{grid-template-columns:1fr}.media .section-label{margin-bottom:50px}.legal-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=700px){.site-header{height:68px;padding:0 22px}.hero-image{background-position:54% 30%;left:0}.hero-shade{background:linear-gradient(90deg,#0f0012eb,#0f001233),linear-gradient(#0000 30%,#08040dcc)}.hero-content{justify-content:flex-end;padding:120px 22px 15vh}.hero h1{font-size:clamp(3.4rem,15vw,5rem);line-height:.88}.hero-side{display:none}.scroll-hint{bottom:22px;right:22px}.section{padding:90px 22px}.intro,.news{grid-template-columns:1fr;gap:55px}.intro-grid{grid-template-columns:1fr;gap:18px;margin-top:45px}.section-heading{display:block}.section-heading>p{margin-top:28px}.project-grid{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr;margin-top:45px}.contact-details{border-left:0;border-top:1px solid var(--line);padding:30px 0 0}.footer-top{grid-template-columns:64px 1fr}.footer-top img{width:58px;height:58px}.footer-top>a{grid-column:1/-1;margin-top:20px}.legal-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important}}
/* Hauptcontainer für die horizontale Anordnung */
.media-row {
  display: flex;
  flex-direction: row; /* Horizontal (Standard bei flex) */
  flex-wrap: nowrap;   /* In einer Zeile, horizontal scrollbar bei Platzmangel */
  gap: 16px;           /* Abstand zwischen den einzelnen Elementen */
  overflow-x: auto;   /* Ermöglicht horizontales Scrollen */
  -webkit-overflow-scrolling: touch;
  padding-bottom: 8px;
  scrollbar-width: none; /* Firefox: scrollbar verbergen */
  -ms-overflow-style: none; /* IE 10+: scrollbar verbergen */
}

/* Einzelnes Element (Bild + Player kombiniert) */
.media-item {
  display: flex;
  align-items: center; /* Vertikale Zentrierung von Bild und Player */
  gap: 10px;           /* Abstand zwischen Bild und Audioplayer */
  background: #f9f9f9;
  padding: 10px;
  border-radius: 8px;
  flex: 0 0 auto;
  min-width: 200px;
}

/* Audio-Player soll den verfügbaren Platz nutzen */
.media-item audio {
  display: block;
  width: 100%;
  max-width: 100%;
  flex: 1 1 auto;
}

/* Fallback für WebKit-Steuerungen (kann je nach Browser limitiert sein) */
.media-item audio::-webkit-media-controls-panel {
  width: 100% !important;
}

/* WebKit-Browser: Scrollleiste ausblenden */
.media-row::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* Responsive: Bei kleineren Bildschirmen umbrechen statt horizontal scrollen */
@media (max-width: 900px) {
  .media-row {
    flex-wrap: wrap;       /* Zeilenumbruch erlauben */
    overflow-x: visible;   /* kein horizontales Scrollen mehr */
    padding-bottom: 0;
  }
  .media-item {
    flex: 1 1 calc(50% - 8px); /* Zwei Spalten-Layout */
    min-width: 0;
  }
}

@media (max-width: 420px) {
  .media-item {
    flex: 1 1 100%; /* Einzelspalte auf sehr kleinen Displays */
    flex-direction: column !important; /* Bild über Player stapeln */
    align-items: stretch;
    gap: 8px;
  }
}

/* Responsive Bildgröße für Media-Items */
.media-item img {
  width: clamp(80px, 12vw, 140px); /* skaliert zwischen 80px und 140px */
  height: auto;
  aspect-ratio: 1 / 1;             /* quadratisches Format beibehalten */
  object-fit: cover;               /* Verhindert Verzerrungen */
  border-radius: 4px;
  flex: 0 0 auto;
}

@media (max-width: 900px) {
  .media-item img {
    width: clamp(70px, 18vw, 120px);
  }
}

@media (max-width: 420px) {
  .media-item img {
    width: 100%; /* Bild nimmt nun den verfügbaren Platz in der Kartenleiste ein */
    height: auto;
    aspect-ratio: 16 / 9; /* optional breiteres Format auf sehr kleinen Bildschirmen */
  }
  .media-item audio,
  .media-item > audio {
    width: 100%;
  }
  /* Erzwinge Reihenfolge Bild vor Player */
  .media-item img { order: 0; }
  .media-item audio { order: 1; }
  /* Abstand und dezenter Trenner zwischen Einträgen auf Mobile */
  .media-item:not(:last-child) {
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(0,0,0,0.06);
  }
}

/* Desktop: größere Player/Items auf weiten Bildschirmen */
@media (min-width: 1200px) {
  .media-item {
    min-width: 420px;
    flex: 0 0 420px;
    gap: 14px;
  }
  .media-item img {
    width: clamp(120px, 10vw, 160px);
    height: auto;
  }
  .media-item audio {
    width: calc(100% - 160px);
    max-width: 100%;
  }
}

/* Responsive styling für die Datenschutz-Seite */
#datenschutz {
  /* Force full viewport width regardless of parent .section constraints */
  width: 100vw;
  max-width: none; /* nimmt volle Breite */
  box-sizing: border-box; /* Padding zählt zur Breite */
  /* Offset to align full-bleed element inside centered container */
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: clamp(16px, 4vw, 48px);
  font-size: clamp(15px, 1.6vw, 18px);
  line-height: 1.6;
  color: #0b0b0b;
}

#datenschutz .section-label {
  font-size: clamp(12px, 1.2vw, 14px);
  margin-bottom: 8px;
  opacity: 0.9;
}

#datenschutz h2 {
  font-size: clamp(20px, 3vw, 28px);
  margin: 0 0 10px 0;
  font-weight: 600;
  letter-spacing: -0.01em;
}

#datenschutz h3 {
  font-size: clamp(16px, 2.2vw, 20px);
  margin: 18px 0 8px 0;
  font-weight: 600;
  color: #0d0d0d;
}

#datenschutz p {
  margin: 0 0 12px 0;
  max-width: 100%; /* immer volle Breite nutzen */
}

#datenschutz a {
  color: #0b58a8;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 700px) {
  #datenschutz {
    padding: 14px;
    font-size: 15px;
  }
  #datenschutz p {
    max-width: 100%;
  }
}

@media (max-width: 420px) {
  #datenschutz {
    padding: 14px;
    font-size: 15px;
  }
}

/* Desktop: make Datenschutz truly full-bleed and ensure inner text fills width */
@media (min-width: 900px) {
  #datenschutz {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box;
  }
  /* Ensure headings and paragraphs take full available width */
  #datenschutz h2, #datenschutz h3, #datenschutz p {
    max-width: none !important;
    width: 100% !important;
  }
}

/* Tabellen in der Datenschutz-Seite: volle Breite und responsiv */
#datenschutz .table-wrapper {
  width: 100%;
  overflow-x: auto;
}
#datenschutz table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  table-layout: auto;
}
#datenschutz th,
#datenschutz td {
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
  word-break: break-word;
}

@media (max-width: 700px) {
  #datenschutz table,
  #datenschutz thead,
  #datenschutz tbody,
  #datenschutz th,
  #datenschutz td,
  #datenschutz tr {
    display: table; /* keep table semantics but allow wrapping */
  }
}