/* The Elephant — Community & Friends Festival. Gestaltung der Seite www.theelephantfestival.de, erzeugt von Nova (Carls Zukunft GmbH). */
@font-face{font-family:"Sora";src:url("schriften/sora.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("schriften/inter.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
  --paper:#FFFFFF;
  --mist:#F5F2EC;
  --blush:#FCE7F0;
  --peach:#FFEBE4;
  --ink:#191519;
  --ink-soft:#5C555C;
  --magenta:#E6006E;
  --coral:#FF5A3C;
  --line:rgba(25,21,25,.12);
  --line-soft:rgba(25,21,25,.07);
  --display:"Sora",system-ui,sans-serif;
  --body:"Inter",system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.04;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{width:min(1240px,92vw);margin-inline:auto}
.eyebrow{font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--magenta)}

/* NAV */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;padding:20px 0;transition:background .35s,box-shadow .35s,padding .35s}
.nav.solid{background:rgba(255,255,255,.82);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line-soft);padding:12px 0}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:600;font-size:1.16rem;letter-spacing:-.02em;color:#fff;transition:color .35s}
.nav.solid .brand{color:var(--ink)}
.brand-ele{width:34px;height:34px;flex:none;filter:brightness(0) invert(1);transition:filter .35s}
.nav.solid .brand-ele{filter:none}
.nav-links{display:flex;align-items:center;gap:28px;font-family:var(--display);font-weight:500;font-size:.9rem}
.nav-links a.text{color:#fff;transition:color .2s}
.nav.solid .nav-links a.text{color:var(--ink)}
.nav-links a.text:hover{color:var(--magenta)}
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--display);font-weight:600;font-size:.9rem;
  background:var(--magenta);color:#fff;padding:.68em 1.25em;border-radius:100px;transition:transform .2s,background .2s;border:none;cursor:pointer}
.btn:hover{transform:translateY(-2px);background:#cc0062}
.btn.big{font-size:1rem;padding:.85em 1.6em}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghost:hover{background:var(--ink);color:#fff;box-shadow:inset 0 0 0 1.5px var(--ink)}

/* HERO (Vollbild mit Overlay) */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,13,16,.5) 0%,rgba(18,13,16,.12) 32%,rgba(18,13,16,.32) 60%,rgba(18,13,16,.86) 100%)}
.hero-inner{position:relative;z-index:2;padding-top:140px;padding-bottom:52px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:12px;margin-bottom:24px;color:#fff}
.hero-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--magenta);box-shadow:0 0 0 4px rgba(230,0,110,.32)}
.hero h1{font-size:clamp(3.6rem,13vw,10.5rem);font-weight:600;letter-spacing:-.04em;line-height:.9;color:#fff}
.hero-sub{font-family:var(--display);font-weight:500;text-transform:uppercase;letter-spacing:.16em;font-size:clamp(.82rem,1.6vw,1rem);color:rgba(255,255,255,.86);margin-top:22px}
.hero-meta{display:flex;align-items:center;gap:14px;margin-top:14px;font-family:var(--display);font-weight:600;font-size:clamp(1.15rem,2.6vw,1.7rem);color:#fff}
.hero-meta .d{width:6px;height:6px;border-radius:50%;background:var(--coral)}
.hero-lead{max-width:46ch;margin-top:24px;font-size:1.12rem;color:rgba(255,255,255,.9)}
.hero-cta{margin-top:32px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.hero-cta .note{font-family:var(--display);font-size:.8rem;color:rgba(255,255,255,.78);letter-spacing:.02em}
.hero-cta .btn.ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
.hero-cta .btn.ghost:hover{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px #fff}

/* TICKER */
.ticker{background:var(--magenta);color:#fff;overflow:hidden;padding:14px 0;position:relative}
.ticker.light{background:var(--blush);color:var(--magenta)}
.ticker-track{display:flex;width:max-content;animation:scroll 36s linear infinite;font-family:var(--display);font-weight:600;
  font-size:clamp(1rem,2.4vw,1.4rem);letter-spacing:.01em;text-transform:uppercase}
.ticker-track span{padding:0 .5em;white-space:nowrap}
.ticker-track .wv{opacity:.6;font-weight:400}
@keyframes scroll{to{transform:translateX(-50%)}}
.ticker:hover .ticker-track{animation-play-state:paused}

/* SECTION */
.pad{padding-block:clamp(78px,10vw,140px)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:52px}
.sec-head .eyebrow{margin-bottom:18px}
.sec-title{font-size:clamp(2.3rem,5.5vw,4.2rem);letter-spacing:-.025em;max-width:18ch;font-weight:600}
.sec-title .m{color:var(--magenta)}
.js .rise{opacity:0;transform:translateY(24px);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1)}
.js .rise.in{opacity:1;transform:none}

/* MANIFESTO (light) */
.manifesto{background:var(--mist)}
.manifesto .lead{font-size:clamp(1.7rem,4.2vw,3rem);max-width:22ch;line-height:1.05;font-weight:600;letter-spacing:-.02em;margin-bottom:6px}
.nein{border-top:1px solid var(--line);margin-top:54px}
.nein-row{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:20px 48px;padding:34px 0;border-bottom:1px solid var(--line);align-items:center}
.nein-word{font-family:var(--display);font-size:clamp(2.3rem,6.5vw,4.6rem);font-weight:600;line-height:.92;letter-spacing:-.03em;position:relative;display:inline-block}
.nein-word::after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:5px;background:var(--coral);transform:scaleX(1);transform-origin:left;transition:transform .7s cubic-bezier(.6,0,.2,1)}
.js .nein-word::after{transform:scaleX(0)}
.js .nein-row.in .nein-word::after{transform:scaleX(1)}
.nein-word .pre{display:block;font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--magenta);margin-bottom:12px}
.nein-desc{font-size:1.05rem;color:var(--ink-soft);max-width:46ch}

/* SPEAKERS */
.spk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.spk{border-radius:22px;position:relative;overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line-soft)}
.spk-photo{aspect-ratio:1;overflow:hidden;background:var(--mist)}
.spk-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform 1s ease}
.spk-photo--empty{display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:600;font-size:3.6rem;color:rgba(25,21,25,.20)}
.spk:hover .spk-photo img{transform:scale(1.05)}
.spk-body{padding:24px 26px 28px;flex:1;display:flex;flex-direction:column}
.spk:nth-child(3n+1) .spk-body{background:var(--blush)}
.spk:nth-child(3n+2) .spk-body{background:var(--peach)}
.spk:nth-child(3n) .spk-body{background:var(--mist)}
.spk .tag{font-family:var(--display);font-weight:600;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;align-self:flex-start;padding:.5em .95em;border-radius:100px;background:rgba(255,255,255,.75);color:var(--ink);margin-bottom:16px}
.spk h3{font-size:1.5rem;font-weight:600;line-height:1.05;margin-bottom:8px}
.spk .role{font-family:var(--display);font-size:.9rem;font-weight:400;color:var(--ink-soft);margin-top:auto}
.spk-note{margin-top:24px;font-family:var(--display);font-size:.9rem;color:var(--ink-soft);display:flex;align-items:center;gap:12px}
.spk-note .ln{height:1px;background:var(--line);flex:1}

/* VOLLER ZUKUNFT */
.vz{display:grid;grid-template-columns:repeat(12,1fr);gap:26px}
.vz-block{grid-column:span 4;display:flex;flex-direction:column}
.vz-img{border-radius:20px;overflow:hidden;aspect-ratio:4/5;margin-bottom:22px;background:var(--mist)}
.vz-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s ease}
.vz-block:hover .vz-img img{transform:scale(1.05)}
.vz-block h3{font-size:1.55rem;font-weight:600;margin-bottom:12px}
.vz-block h3 .m{color:var(--magenta)}
.vz-block p{color:var(--ink-soft);font-size:1rem}
.stat{grid-column:span 12;margin-top:14px;background:var(--magenta);color:#fff;border-radius:24px;padding:clamp(34px,5vw,58px);display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:space-between}
.stat .fig{font-family:var(--display);font-size:clamp(4.4rem,13vw,9.5rem);line-height:.82;font-weight:600;letter-spacing:-.04em}
.stat .fig sup{font-size:.4em;vertical-align:top;top:.35em;position:relative}
.stat .txt{font-family:var(--display);font-weight:500;font-size:clamp(1.4rem,3.2vw,2.3rem);max-width:15ch;line-height:1.1;letter-spacing:-.01em}

/* VENUE (light) */
.venue{background:var(--peach)}
.venue-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,64px);align-items:center}
.venue h2{font-size:clamp(2.1rem,4.8vw,3.6rem);margin-bottom:24px;font-weight:600;letter-spacing:-.025em}
.venue h2 .m{color:var(--coral)}
.venue p{color:var(--ink-soft);font-size:1.08rem;max-width:52ch;margin-bottom:18px}
.venue .where{font-family:var(--display);font-weight:600;font-size:.95rem;display:inline-flex;align-items:center;gap:10px;margin-top:8px}
.venue .where .dot{width:8px;height:8px;background:var(--coral);border-radius:50%}
.venue-photo{border-radius:22px;overflow:hidden;aspect-ratio:3/4;box-shadow:0 24px 50px rgba(25,21,25,.12)}
.venue-photo img{width:100%;height:100%;object-fit:cover}
.strip{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:60px}
.strip figure{border-radius:14px;overflow:hidden;aspect-ratio:1;background:rgba(0,0,0,.06)}
.strip img{width:100%;height:100%;object-fit:cover;transition:transform .9s ease}
.strip figure:hover img{transform:scale(1.08)}
.strip figure:nth-child(1),.strip figure:nth-child(4){grid-row:span 2;aspect-ratio:auto}

/* HALL OF FAME */
.hof .sec-title .m{color:var(--coral)}
.hof-list{border-top:1px solid var(--line)}
.hof-item{display:grid;grid-template-columns:44px 1fr auto;gap:22px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--line);transition:padding-left .3s}
.hof-item:hover{padding-left:14px}
.hof-item .no{font-family:var(--display);font-size:.78rem;font-weight:600;color:var(--magenta);letter-spacing:.04em}
.hof-item .nm{font-family:var(--display);font-size:clamp(1.3rem,2.8vw,1.85rem);font-weight:600;line-height:1.05;letter-spacing:-.02em}
.hof-item .rl{font-family:var(--display);font-size:.92rem;font-weight:400;color:var(--ink-soft);text-align:right;max-width:34ch}

/* TICKETS (light) */
.tickets{background:var(--mist)}
.tickets .sec-title .m{color:var(--magenta)}
.day{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:54px}
.day-item{border-top:2px solid var(--magenta);padding-top:16px}
.day-item .t{font-family:var(--display);font-size:2.3rem;font-weight:600;line-height:1;letter-spacing:-.02em}
.day-item .l{font-family:var(--display);font-size:.95rem;font-weight:400;color:var(--ink-soft);margin-top:8px}
.tk-main{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;margin-bottom:22px}
.price-card{background:var(--magenta);color:#fff;border-radius:24px;padding:clamp(30px,4vw,48px);display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.price-card .badge{position:absolute;top:24px;right:24px;font-family:var(--display);font-weight:600;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(255,255,255,.22);padding:.5em 1em;border-radius:100px}
.price-card .lbl{font-family:var(--display);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;opacity:.9}
.price-card .amt{font-family:var(--display);font-size:clamp(3.4rem,8vw,5.4rem);line-height:.9;font-weight:600;margin:12px 0 4px;letter-spacing:-.03em}
.price-card .mwst{font-family:var(--display);font-size:.86rem;font-weight:400;opacity:.85;margin-bottom:6px}
.price-card .was{font-family:var(--display);font-size:1rem;font-weight:400;opacity:.9}
.price-card .was s{opacity:.7;margin-right:8px}
.price-card .btn{background:#fff;color:var(--magenta);margin-top:26px;align-self:flex-start}
.price-card .btn:hover{background:var(--ink);color:#fff}
.price-card .ele-wm{position:absolute;right:-26px;bottom:-34px;width:210px;height:auto;opacity:.16;filter:brightness(0) invert(1)}
.intro-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:24px;padding:clamp(26px,3vw,38px);display:flex;flex-direction:column;justify-content:center}
.intro-card h3{font-size:1.5rem;font-weight:600;margin-bottom:12px}
.intro-card p{color:var(--ink-soft);font-size:1rem}
.b2b{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:22px}
.b2b-card{background:var(--paper);border:1px solid var(--line-soft);border-radius:20px;padding:30px 26px;display:flex;flex-direction:column;transition:border-color .3s,transform .3s,box-shadow .3s}
.b2b-card:hover{border-color:var(--coral);transform:translateY(-3px);box-shadow:0 16px 34px rgba(25,21,25,.07)}
.b2b-card .kick{font-family:var(--display);font-weight:600;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--coral);margin-bottom:14px}
.b2b-card h3{font-size:1.4rem;font-weight:600;line-height:1.08;margin-bottom:12px}
.b2b-card p{color:var(--ink-soft);font-size:.96rem;margin-bottom:18px;flex:1}
.b2b-card .lk{font-family:var(--display);font-weight:600;font-size:.9rem;display:inline-flex;align-items:center;gap:8px;border-bottom:1.5px solid var(--coral);padding-bottom:3px;align-self:flex-start;transition:gap .2s}
.b2b-card .lk:hover{gap:12px}
.b2b-card .lk.sec{margin-top:8px;color:var(--ink-soft);font-size:.82rem;border-color:var(--line)}
.vat{font-family:var(--display);font-size:.82rem;color:var(--ink-soft);margin-top:26px;letter-spacing:.02em}

/* FOOTER */
.foot{background:var(--paper);padding-block:clamp(70px,9vw,116px) 40px}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:54px;border-bottom:1px solid var(--line)}
.foot-brand{font-family:var(--display);font-size:clamp(2.4rem,5.5vw,3.8rem);font-weight:600;line-height:.95;letter-spacing:-.03em}
.foot-brand .amp{color:var(--magenta)}
.foot-brand .by{font-family:var(--display);font-size:.92rem;font-weight:400;color:var(--ink-soft);margin-top:20px;display:block;letter-spacing:.02em}
.foot-brand .by a{color:var(--magenta);border-bottom:1px solid var(--magenta)}
.foot-col h4{font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--magenta);margin-bottom:18px}
.foot-col a,.foot-col p{display:block;font-size:1rem;color:var(--ink-soft);margin-bottom:8px;transition:color .2s}
.foot-col a:hover{color:var(--ink)}
.foot-logo{margin-top:6px}
.foot-logo img{width:180px;height:auto}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-top:28px;font-family:var(--display);font-size:.82rem;color:var(--ink-soft)}
.foot-bottom .themes{display:flex;gap:18px;flex-wrap:wrap}

@media(max-width:900px){
  .nav-links{display:none}
  .nein-row{grid-template-columns:1fr;gap:12px;padding:28px 0}
  .vz-block{grid-column:span 12}
  .venue-grid{grid-template-columns:1fr}
  .venue-photo{aspect-ratio:16/11;max-height:420px}
  .strip{grid-template-columns:repeat(3,1fr)}
  .strip figure:nth-child(1),.strip figure:nth-child(4){grid-row:auto;aspect-ratio:1}
  .spk-grid{grid-template-columns:1fr}
  .spk{min-height:auto}
  .tk-main{grid-template-columns:1fr}
  .b2b{grid-template-columns:1fr}
  .day{grid-template-columns:1fr}
  .hof-item{grid-template-columns:32px 1fr;gap:8px 16px}
  .hof-item .rl{grid-column:2;text-align:left;margin-top:2px}
  .foot-top{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .js .rise{opacity:1;transform:none}
  .js .nein-word::after{transform:scaleX(1)}
}

/* Ohne JavaScript: alles sichtbar (nur .js .rise startet unsichtbar), die Striche der Format-Zeilen stehen da; die
   Navigation scrollt mit dem Kopf weg, statt weiss auf weissem Grund stehen zu bleiben */
html:not(.js) .nav{position:absolute}

/* Bis 2026 style-Attribute in der Seite, jetzt Klassen (die CSP der Seite erlaubt keine); das Wasserzeichen mit
   height:auto, weil die Seite jetzt width und height an jedes Bild schreibt */
.format-kopf{margin-bottom:12px}
.eyebrow.mit-abstand{margin-bottom:22px}
.pad.ohne-oben{padding-top:0}
.hof-einleitung{max-width:30ch;color:var(--ink-soft);font-family:var(--display);font-size:.98rem;font-weight:400}
.ticker-track.schneller{animation-duration:30s}

/* Beim Drucken alles sichtbar, auch was noch nicht ins Bild gescrollt war */
@media print{.js .rise{opacity:1;transform:none}.js .nein-word::after{transform:scaleX(1)}}

/* Bildausschnitt der Sprecherfotos: oben ist der bisherige (center 22%) */
.spk-photo img.aus-mitte{object-position:center 50%}
.spk-photo img.aus-unten{object-position:center 78%}
