@font-face { font-family:"Ruda"; src:url("../fonts/Ruda-Regular.ttf"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Ruda"; src:url("../fonts/Ruda-Bold.ttf"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"Exo2"; src:url("../fonts/Exo2-Regular.ttf"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"MontserratAlternates"; src:url("../fonts/MontserratAlternates-Regular.ttf"); font-weight:500; font-style:normal; font-display:swap; }

:root{
  --dark:#151515;
  --magenta:#C41E7A;
  --cream:#F3EDE4;
  --pink:#c20a75;
  --ease:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;}
html{ scroll-behavior:smooth; cursor:none; }
body{
  margin:0; background:var(--dark); color:var(--cream);
  font-family:"Exo2",sans-serif; font-size:16px; line-height:1.6;
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
}
#bw-page{ background:var(--dark); }
h1,h2,h3{ font-family:"Ruda",sans-serif; font-weight:700; margin:0; line-height:.92; letter-spacing:-0.03em; }
body h1, body h2, body h3{ color:inherit; }
p{ margin:0; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; cursor:pointer; }
::selection{ background:var(--magenta); color:var(--cream); }

/* grain overlay */
#bwnv-grain{ position:fixed; inset:0; z-index:500; pointer-events:none; opacity:.05; mix-blend-mode:overlay; }

/* custom cursor */
#bwnv-cursor{ position:fixed; top:0; left:0; width:10px; height:10px; background:var(--magenta); border-radius:50%; pointer-events:none; z-index:3500; transform:translate(-50%,-50%); transition:width .25s var(--ease), height .25s var(--ease), background .25s; mix-blend-mode:difference; }
#bwnv-cursor.big{ width:64px; height:64px; background:var(--magenta); }

#bwnv-progress{ height:5px; width:0%; background:var(--magenta); }

.reveal{ opacity:0; transform:translateY(40px) rotate(.3deg); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0) rotate(0); }

.wrap{ max-width:1400px; margin:0 auto; padding:0 6vw; }
.btn{ display:inline-flex; align-items:center; gap:10px; background:var(--magenta); color:var(--cream); font-weight:700; padding:18px 36px; border-radius:2px; font-family:"MontserratAlternates",sans-serif; font-size:14px; text-transform:uppercase; letter-spacing:.08em; border:none; cursor:pointer; transition:transform .3s var(--ease), background .3s; }
.btn:hover{ transform:skew(-6deg) scale(1.05); background:var(--dark); color:var(--cream); }
#gallery-cta-btn:hover{ background:var(--cream); color:var(--dark); }
#podcast-cta-btn:hover{ background:var(--cream); color:var(--dark); }

/* ---------- marquee ---------- */
.marquee{ overflow:hidden; white-space:nowrap; border-top:3px solid var(--magenta); border-bottom:3px solid var(--magenta); background:#fff; padding:14px 0; }
.marquee .track{ display:inline-block; animation:scrollLeft 18s linear infinite; }
.marquee span{ font-family:"Ruda",sans-serif; font-weight:700; font-size:clamp(20px,3vw,34px); text-transform:uppercase; margin:0 28px; color:#000; letter-spacing:-.01em; }
.marquee span::after{ content:"✦"; margin-left:28px; color:var(--magenta); }
@keyframes scrollLeft{ from{ transform:translateX(0);} to{ transform:translateX(-16.6667%);} }


/* ---------- hero ---------- */
.hero{ position:relative; height:100vh; height:100svh; min-height:680px; padding-top:89px; background:var(--dark); display:flex; flex-direction:column; justify-content:flex-end; align-items:stretch; overflow:hidden; box-sizing:border-box; }
.hero img.bg{ position:absolute; top:89px; left:0; right:0; bottom:0; width:100%; height:calc(100% - 89px); object-fit:cover; object-position:right top; filter:grayscale(1) contrast(1.15); }
.hero::after{ content:""; position:absolute; top:89px; left:0; right:0; bottom:0; background:linear-gradient(0deg, rgba(10,10,10,.95), rgba(10,10,10,.35) 60%); }
.hero-title{ position:relative; z-index:2; order:1; text-align:left; padding:0 6vw 170px; }
.hero-title h1{ font-size:clamp(40px,8.5vw,140px); color:var(--cream); text-transform:uppercase; }
.hero-kicker{ position:relative; z-index:2; order:2; text-align:left; padding:0 6vw 26px; font-family:"MontserratAlternates",sans-serif; color:var(--cream); font-size:13px; letter-spacing:.3em; text-transform:uppercase; }
.hero-kicker .bwh-kicker-break{ display:block; }
@media (max-width:600px){
  .hero{ min-height:520px; }
}

/* ---------- diagonal section divider ---------- */
.cut-top{ clip-path:polygon(0 4vw, 100% 0, 100% 100%, 0 100%); margin-top:-4vw; position:relative; z-index:2; }

.section{ padding:150px 0; position:relative; }
.section.pink{ background:var(--magenta); color:var(--dark); }
.section.cream{ background:var(--cream); color:var(--dark); }

.eyebrow{ font-family:"MontserratAlternates",sans-serif; font-weight:500; font-size:12px; letter-spacing:.25em; text-transform:uppercase; }

/* ---------- intro giant statement ---------- */
.statement{ font-size:clamp(30px,5.4vw,74px); max-width:16ch; color:var(--cream); }
.section.cream .statement{ color:var(--dark); }
.statement .hl{ color:var(--magenta); font-style:italic; }
.section.cream .statement .hl{ color:var(--pink); }
.intro-copy{ display:grid; grid-template-columns:1fr 1fr; gap:60px; margin-top:70px; }
.intro-copy p{ font-size:17px; color:var(--dark); }

/* ---------- info-meta (Datum/Uhrzeit-Zeile) ---------- */
.info-meta{ display:flex; gap:28px; flex-wrap:wrap; margin-top:22px; }
.info-meta-item{ display:flex; align-items:center; gap:10px; color:var(--cream); opacity:.9; font-size:15px; }
.info-meta-item svg{ color:var(--magenta); flex-shrink:0; }
.intro-final{ font-family:"Ruda",serif; font-style:italic; font-size:28px !important; color:var(--magenta) !important; margin-top:20px; }

/* ---------- testimonial horizontal panels ---------- */
.t-rail{ display:flex; overflow-x:auto; }
.t-panel-inner{ width:100%; max-width:1400px; margin:0 auto; padding:0 6vw; }
.t-rail::-webkit-scrollbar{ display:none; }
.t-panel{ flex:0 0 100%; height:720px; display:flex; flex-direction:column; justify-content:center; padding:110px 0; position:relative; }
.t-panel.t-c1{ background:var(--dark); color:var(--cream); }
.t-panel.t-c2{ background:var(--magenta); color:var(--cream); }
.t-panel.t-c3{ background:var(--cream); color:var(--dark); }
.t-panel.t-c4{ background:var(--pink); color:var(--cream); }
.t-index{ position:absolute; top:40px; right:8vw; font-family:"Ruda",sans-serif; font-size:120px; font-weight:700; opacity:.15; }
.t-panel img.badge{ width:50px; margin-bottom:24px; }
.t-panel p{ font-size:clamp(17px,2.4vw,28px); max-width:22ch; font-family:"Ruda",sans-serif; font-weight:400; line-height:1.25; }
.t-panel .name{ margin-top:28px; font-family:"MontserratAlternates",sans-serif; font-size:14px; text-transform:uppercase; letter-spacing:.1em; }
.t-panel.long p{ max-width:64ch; column-count:2; column-gap:36px; }
.t-panel.long3 p{ max-width:92ch; column-count:3; column-gap:32px; }
.rail-bar{ position:relative; z-index:3; background:var(--dark); padding:26px 6vw 70px; display:flex; align-items:center; justify-content:center; gap:24px; }
.rail-arrow{ width:52px; height:52px; border-radius:50%; border:1.5px solid rgba(255,255,255,.35); background:transparent; color:var(--cream); font-size:20px; cursor:pointer; transition:background .3s, border-color .3s, transform .3s; }
.rail-arrow:hover{ background:var(--magenta); border-color:var(--magenta); color:var(--cream); transform:scale(1.08); }
.rail-hint{ font-family:"MontserratAlternates",sans-serif; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--cream); opacity:.55; }
.rail-hint-mobile{ display:none; }
.rail-hint-swipe{ display:none; }
@media (max-width:900px){
  .rail-arrow{ display:none; }
  .rail-hint{ display:none; }
  .rail-hint-mobile{ display:flex; align-items:center; gap:10px; font-family:"MontserratAlternates",sans-serif; font-size:12px; letter-spacing:.15em; text-transform:uppercase; color:var(--cream); opacity:.55; }
  .swipe-icon{ display:inline-block; animation:swipeMove 1.6s ease-in-out infinite; }
  @keyframes swipeMove{ 0%,100%{ transform:translateX(0); opacity:.5;} 50%{ transform:translateX(10px); opacity:1;} }
  .t-panel{ height:auto; min-height:600px; padding:90px 7vw; }
  .t-panel.long p, .t-panel.long3 p{ column-count:1; max-width:none; }
}

/* ---------- scattered offers ---------- */
.scatter{ display:flex; flex-wrap:nowrap; gap:50px; justify-content:center; padding-top:40px; }
.s-card{ position:relative; width:260px; background:var(--cream); padding:14px 14px 50px; box-shadow:0 20px 50px rgba(0,0,0,.35); transition:transform .5s var(--ease); }
.s-card:nth-child(1){ transform:rotate(-6deg); }
.s-card:nth-child(2){ transform:rotate(4deg); margin-top:40px; }
.s-card:nth-child(3){ transform:rotate(-3deg); }
.s-card:nth-child(4){ transform:rotate(7deg); margin-top:20px; }
.s-card:hover{ transform:rotate(0deg) scale(1.06); z-index:5; }
.s-card img{ width:100%; height:280px; object-fit:cover; filter:grayscale(.4); }
.s-card:hover img{ filter:grayscale(0); }
.s-card .cap{ position:absolute; bottom:14px; left:14px; right:14px; font-family:"Ruda",sans-serif; font-weight:700; font-size:20px; color:var(--dark); text-transform:uppercase; }

/* ---------- stats scramble ---------- */
.stat-wall{ display:grid; grid-template-columns:1fr 1fr; gap:40px; text-align:center; }
.stat-wall .num{ font-family:"Ruda",sans-serif; font-weight:700; font-size:clamp(70px,11vw,160px); line-height:1; }
.stat-wall .cap{ font-family:"MontserratAlternates",sans-serif; font-size:13px; letter-spacing:.15em; text-transform:uppercase; margin-top:10px; }

/* ---------- founder photo ---------- */
.founder-wild{ display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:0; max-width:1400px; margin:0 auto; background:var(--dark); }
.founder-photo-wild{ position:relative; height:640px; overflow:hidden; }
.founder-photo-wild img{ width:100%; height:100%; object-fit:cover; object-position:center top; filter:grayscale(1) contrast(1.2); }
.founder-copy{ padding:0 60px; }
.founder-copy h2{ font-size:clamp(34px,4.6vw,64px); margin-bottom:26px; color:var(--cream); }
.founder-copy p{ color:var(--cream); opacity:.85; font-size:17px; max-width:48ch; margin-bottom:16px; }
.founder-sig{ font-family:"Ruda",serif; font-style:italic; font-size:26px; color:var(--cream); margin-top:24px; }
.founder-social{ display:flex; gap:14px; margin-top:18px; }
.founder-social svg{ width:20px; height:20px; fill:var(--cream); opacity:.7; transition:opacity .3s, fill .3s, transform .3s var(--ease); }
.founder-social a:hover svg{ opacity:1; fill:var(--magenta); transform:translateY(-3px); }

/* ---------- gallery smash ---------- */
.smash{ position:relative; min-height:70vh; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.smash img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.smash .content{ position:relative; z-index:2; text-align:center; mix-blend-mode:difference; }
.smash h2{ font-size:clamp(40px,9vw,140px); color:var(--cream); text-transform:uppercase; }
.smash p{ color:var(--cream); font-size:18px; margin:20px 0 30px; }


@media (max-width:900px){
  .intro-copy, .founder-wild, .stat-wall{ grid-template-columns:1fr; }
  .founder-photo-wild{ height:420px; }
  .scatter{ flex-wrap:wrap; }
  html{ cursor:auto; }
  #bwnv-cursor{ display:none; }
}
@media (max-width:600px){
  .intro-copy{ gap:20px; }
  .t-rail{ scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
  .t-panel{ scroll-snap-align:center; scroll-snap-stop:always; }
  .rail-arrow{ display:inline-flex; align-items:center; justify-content:center; }
  .rail-hint-mobile{ display:none; }
  .rail-hint-swipe{ display:inline-block; font-family:"MontserratAlternates",sans-serif; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--cream); opacity:.55; }
  .founder-social{ gap:20px; }
  .founder-social a{ display:inline-flex; align-items:center; justify-content:center; padding:12px; margin:-12px; } /* 28px Icon + 12px Padding = 52px Tippfläche, WCAG-konform */
  .founder-social svg{ width:28px; height:28px; }
}
/* ---------- Tablet ---------- */
/* ---------- sehr schmale Screens: clamp()-Untergrenzen greifen sonst nicht mehr, Text läuft über den Rand ---------- */
/* gleiche vw-Rate wie die Basis-Regel, nur die feste Untergrenze wird abgesenkt, damit die Schrift proportional weiterschrumpft */
@media (max-width:600px){
  .hero-title h1{ font-size:clamp(20px,8.5vw,140px); }
  .statement{ font-size:clamp(16px,5.4vw,74px); }
  .stat-wall .num{ font-size:clamp(30px,11vw,160px); }
  .founder-copy h2{ font-size:clamp(18px,4.6vw,64px); }
  .founder-sig{ font-size:clamp(14px,4.6vw,26px); }
  #t-title{ padding:60px 0 30px; }
  .t-panel{ padding:60px 7vw; min-height:500px; }
  .t-panel-inner{ padding:0; }
  .rail-bar{ padding:20px 6vw 40px; }
}

@media (min-width:601px) and (max-width:1024px){
  .hero img.bg{ object-position:right top; }
  .intro-copy{ gap:20px; }
  .t-rail{ scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
  .t-panel{ scroll-snap-align:center; scroll-snap-stop:always; height:auto; min-height:640px; padding:100px 7vw; }
  .t-panel.long p, .t-panel.long3 p{ column-count:1; max-width:none; }
  .rail-arrow{ display:inline-flex; align-items:center; justify-content:center; }
  .rail-hint-mobile{ display:none; }
  .rail-hint-swipe{ display:inline-block; font-family:"MontserratAlternates",sans-serif; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--cream); opacity:.55; }
  .founder-photo-wild{ height:840px; } /* doppelt so hoch wie die bisherigen 420px */
  .founder-social{ gap:24px; }
  .founder-social a{ display:inline-flex; align-items:center; justify-content:center; padding:13px; margin:-13px; } /* 30px Icon + 13px Padding = 56px Tippfläche */
  .founder-social svg{ width:30px; height:30px; }
}