@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg:#02070b;
  --panel:#071116;
  --panel-2:#0b171d;
  --text:#f5f7f8;
  --muted:#9eabb1;
  --line:rgba(255,255,255,.11);
  --cyan:#58d3de;
  --pink:#f00062;
  --radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input{font:inherit}
.ambient{position:fixed;z-index:-1;border-radius:50%;filter:blur(120px);opacity:.16;pointer-events:none}
.ambient-a{width:520px;height:520px;top:-180px;right:-120px;background:var(--cyan)}
.ambient-b{width:580px;height:580px;left:-250px;top:520px;background:var(--pink)}
.eyebrow{display:block;color:var(--cyan);font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
.v7-header{width:min(1440px,calc(100% - 48px));height:104px;margin:22px auto 0;padding:0 30px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:28px;background:rgba(4,12,16,.82);backdrop-filter:blur(18px);position:relative;z-index:20}
.v7-brand img{width:112px;height:72px;object-fit:contain}
.v7-header nav{display:flex;align-items:center;gap:32px;color:#bdc6ca;font-size:.8rem;font-weight:600;letter-spacing:.04em}
.v7-header nav a:hover{color:#fff}
.nav-lock{padding:12px 16px;border:1px solid var(--line);border-radius:999px}
.v7-hero{width:min(1440px,calc(100% - 48px));min-height:720px;margin:24px auto 0;padding:70px 4vw;display:grid;grid-template-columns:1.05fr .95fr;gap:6vw;align-items:center;border:1px solid var(--line);border-radius:36px;background:radial-gradient(circle at 20% 40%,rgba(88,211,222,.09),transparent 38%),linear-gradient(145deg,#061116,#02070b 62%)}
.v7-hero h1,.login-card h1,.media-welcome h1{font-family:"Barlow Condensed",sans-serif;font-size:clamp(5rem,9vw,9.5rem);line-height:.78;letter-spacing:-.045em;text-transform:uppercase;margin:25px 0 32px}
.v7-hero h1 em,.login-card h1 em,.media-welcome h1 em{font-style:normal;color:var(--cyan)}
.v7-hero-copy>p{max-width:610px;color:#b7c0c4;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.7}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:35px}
.primary-button,.ghost-button{min-height:54px;padding:0 22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:18px;font-weight:700;font-size:.8rem;letter-spacing:.04em}
.primary-button{border:0;background:var(--pink);color:white;box-shadow:0 12px 45px rgba(240,0,98,.22)}
.primary-button:hover{transform:translateY(-2px)}
.ghost-button{border:1px solid var(--line);background:rgba(255,255,255,.035);color:#d4dadd}
.hero-card{height:590px;position:relative;overflow:hidden;border-radius:28px;border:1px solid var(--line);transform:rotate(1.5deg);box-shadow:0 35px 80px rgba(0,0,0,.45)}
.hero-card img{width:100%;height:100%;object-fit:cover}
.hero-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(1,5,8,.9))}
.hero-card-overlay{position:absolute;z-index:2;left:30px;right:30px;bottom:28px;display:flex;align-items:end;justify-content:space-between;gap:24px}
.hero-card-overlay span{font-family:"Barlow Condensed";font-size:4rem;color:var(--cyan)}
.hero-card-overlay strong{max-width:240px;text-align:right;font-size:1.1rem;line-height:1.35}
.public-intro,.archive-preview,.privacy-band{width:min(1320px,calc(100% - 48px));margin:120px auto}
.public-intro{display:grid;grid-template-columns:100px 1fr .8fr;gap:45px;align-items:start}
.section-number{font-family:"Barlow Condensed";font-size:4rem;color:rgba(255,255,255,.14)}
.public-intro h2,.section-heading h2,.privacy-band h2{font-family:"Barlow Condensed";font-size:clamp(3.2rem,6vw,6rem);line-height:.88;text-transform:uppercase;margin:18px 0 0}
.public-intro p,.section-heading p,.privacy-band p{color:var(--muted);line-height:1.8}
.section-heading{max-width:900px;margin-bottom:45px}
.year-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.year-card{min-height:300px;padding:30px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.015));display:flex;flex-direction:column}
.year-card-top{display:flex;justify-content:space-between;align-items:flex-start}
.year-card-top span{font-family:"Barlow Condensed";font-size:5rem;color:var(--cyan);line-height:1}
.year-card-top small{color:var(--muted)}
.event-pills{display:flex;flex-wrap:wrap;gap:8px;margin:30px 0}
.event-pills span{padding:9px 12px;border:1px solid var(--line);border-radius:999px;color:#c7d0d4;font-size:.74rem}
.year-card>a{margin-top:auto;display:flex;justify-content:space-between;padding-top:22px;border-top:1px solid var(--line);font-weight:700;font-size:.8rem}
.privacy-band{padding:50px;display:grid;grid-template-columns:auto 1fr auto;gap:35px;align-items:center;border:1px solid rgba(88,211,222,.2);border-radius:28px;background:linear-gradient(135deg,rgba(88,211,222,.08),rgba(240,0,98,.06))}
.privacy-icon{width:90px;height:90px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);font-size:2rem}
.privacy-band h2{font-size:clamp(2.8rem,5vw,5rem)}
.v7-footer{width:min(1320px,calc(100% - 48px));margin:0 auto 32px;padding:32px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.v7-footer img{width:90px}
.v7-footer div{display:flex;gap:24px;color:var(--muted);font-size:.75rem}
.v7-footer small{text-align:right;color:#6f7b80}

/* Login */
.login-body{min-height:100svh;display:grid;place-items:center;background:radial-gradient(circle at 68% 20%,rgba(88,211,222,.13),transparent 30%),radial-gradient(circle at 25% 85%,rgba(240,0,98,.1),transparent 34%),var(--bg);padding:24px}
.login-shell{width:min(1150px,100%);display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;gap:7vw}
.login-logo img{width:min(280px,70%);margin:auto}
.login-card{position:relative;padding:clamp(32px,6vw,72px);border:1px solid var(--line);border-radius:34px;background:rgba(5,14,18,.88);box-shadow:0 30px 90px rgba(0,0,0,.42)}
.login-card h1{font-size:clamp(4.2rem,8vw,7.5rem)}
.login-card>p{color:var(--muted);line-height:1.75;max-width:650px}
.lock-orbit{position:absolute;right:32px;top:30px;width:62px;height:62px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%}
.login-card form{margin-top:35px}
.login-card label{display:block;margin-bottom:10px;color:#d8dfe2;font-size:.78rem;font-weight:700}
.password-field{display:flex;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#02080b}
.password-field:focus-within{border-color:rgba(88,211,222,.55)}
.password-field input{width:100%;height:58px;padding:0 17px;background:transparent;border:0;outline:0;color:#fff;font-size:1rem}
.password-field button{width:58px;border:0;background:transparent;color:var(--cyan);cursor:pointer}
.login-submit{width:100%;margin-top:13px;cursor:pointer}
.login-card>small{display:block;margin-top:22px;color:#7f8c91}
.login-info,.login-error{padding:12px 14px;border-radius:12px;margin-top:18px;font-size:.82rem}
.login-info{background:rgba(88,211,222,.08);border:1px solid rgba(88,211,222,.2)}
.login-error{background:rgba(240,0,98,.09);border:1px solid rgba(240,0,98,.25)}

/* Media */
.media-body{background:var(--bg)}
.media-header{position:sticky;top:0;z-index:40;height:88px;padding:0 max(24px,calc((100vw - 1380px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(2,7,11,.88);backdrop-filter:blur(18px)}
.media-header img{width:100px}
.media-header>div{display:flex;align-items:center;gap:18px}
.media-header span{color:var(--cyan);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.media-header a:last-child{padding:9px 12px;border:1px solid var(--line);border-radius:999px;font-size:.7rem}
.media-main{width:min(1380px,calc(100% - 48px));margin:0 auto;padding:70px 0 120px}
.media-welcome{max-width:1000px;margin-bottom:80px}
.media-welcome h1{font-size:clamp(5rem,10vw,9rem)}
.media-welcome p{max-width:650px;color:var(--muted);line-height:1.8}
.media-year{margin:80px 0}
.media-year-heading{display:flex;align-items:end;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:22px}
.media-year-heading span{font-family:"Barlow Condensed";font-size:5rem;color:var(--cyan);line-height:1}
.media-year-heading small{color:var(--muted)}
.media-event-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.media-event-card{display:block;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:var(--panel);transition:.3s}
.media-event-card:hover{transform:translateY(-5px);border-color:rgba(88,211,222,.35)}
.media-event-cover{height:360px;position:relative;overflow:hidden;background:#071116}
.media-event-cover img,.event-placeholder{width:100%;height:100%;object-fit:cover}
.event-placeholder{background:radial-gradient(circle at 65% 30%,rgba(88,211,222,.18),transparent 33%),radial-gradient(circle at 20% 80%,rgba(240,0,98,.17),transparent 30%),#071116}
.media-event-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.75))}
.media-event-cover span{position:absolute;z-index:2;right:20px;bottom:18px;padding:10px 14px;border-radius:999px;background:rgba(2,7,11,.82);border:1px solid var(--line);font-size:.72rem}
.media-event-meta{padding:22px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.media-event-meta strong{font-family:"Barlow Condensed";font-size:1.8rem;text-transform:uppercase}
.media-event-meta small{color:var(--muted);text-align:right}
.back-link{display:inline-block;margin-bottom:25px;color:var(--muted);font-size:.78rem}
.event-hero{height:min(72vh,720px);position:relative;overflow:hidden;border:1px solid var(--line);border-radius:28px}
.event-hero>img,.event-hero>.event-placeholder{width:100%;height:100%;object-fit:cover}
.event-hero-shade{position:absolute;inset:0;background:linear-gradient(transparent 20%,rgba(0,0,0,.86))}
.event-hero-copy{position:absolute;left:clamp(24px,5vw,68px);right:30px;bottom:45px}
.event-hero-copy span{color:var(--cyan);font-family:"Barlow Condensed";font-size:3rem}
.event-hero-copy h1{font-family:"Barlow Condensed";font-size:clamp(4rem,9vw,8rem);line-height:.86;text-transform:uppercase;margin:4px 0 12px}
.event-hero-copy p{color:#c4cdd0}
.media-section{margin-top:100px}
.media-section-heading h2{font-family:"Barlow Condensed";font-size:clamp(3.7rem,7vw,7rem);line-height:.9;text-transform:uppercase;margin:15px 0 35px}
.video-stack{display:grid;gap:20px}
.video-card{overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--panel)}
.video-card video{width:100%;max-height:78vh;background:#000}
.video-card>div{padding:20px 24px;display:grid;grid-template-columns:1fr auto auto;gap:24px;align-items:center}
.video-card strong{font-family:"Barlow Condensed";font-size:1.5rem;text-transform:uppercase}
.video-card span{color:var(--muted);font-size:.75rem}
.video-card a{padding:10px 13px;border:1px solid var(--line);border-radius:999px;font-size:.72rem}
.protected-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.protected-gallery button{aspect-ratio:1/1;border:0;padding:0;background:#071116;overflow:hidden;cursor:pointer}
.protected-gallery img{width:100%;height:100%;object-fit:cover;transition:.35s}
.protected-gallery button:hover img{transform:scale(1.035)}
.lightbox{position:fixed;z-index:100;inset:0;background:rgba(0,4,7,.97);opacity:0;transition:.22s;display:grid;place-items:center;padding:90px 80px 45px}
.lightbox.open{opacity:1}
.lightbox[hidden]{display:none}
.lightbox>img{max-width:100%;max-height:calc(100svh - 140px);object-fit:contain}
.lightbox-top{position:absolute;top:max(18px,env(safe-area-inset-top));left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;color:#aab5b9}
.lightbox-top>div{display:flex;align-items:center;gap:10px}
.lightbox-top a,.lightbox-top button{min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:rgba(5,13,17,.9);color:#fff}
.lightbox-top button{width:48px;font-size:1.8rem;cursor:pointer}
.lightbox-arrow{position:absolute;top:50%;width:58px;height:58px;border:1px solid var(--line);border-radius:50%;background:rgba(5,13,17,.75);color:#fff;font-size:2.4rem;cursor:pointer}
.lightbox-prev{left:18px}.lightbox-next{right:18px}
.empty-state{padding:70px;border:1px dashed var(--line);border-radius:24px;text-align:center}
.empty-state span{color:var(--cyan);text-transform:uppercase;letter-spacing:.2em;font-size:.7rem}
.empty-state h2{font-family:"Barlow Condensed";font-size:3rem;text-transform:uppercase}
.empty-state p{color:var(--muted)}

@media(max-width:850px){
  .v7-header{width:calc(100% - 24px);height:90px;margin-top:12px;padding:0 18px;border-radius:22px}
  .v7-brand img{width:88px}
  .v7-header nav a:not(.nav-lock){display:none}
  .v7-hero{width:calc(100% - 24px);min-height:auto;padding:45px 22px;grid-template-columns:1fr;border-radius:26px}
  .v7-hero h1{font-size:clamp(4.6rem,20vw,7rem)}
  .hero-card{height:440px;transform:none}
  .public-intro{grid-template-columns:1fr;gap:15px}
  .section-number{display:none}
  .year-grid,.media-event-grid{grid-template-columns:1fr}
  .privacy-band{grid-template-columns:1fr;padding:32px}
  .privacy-icon{width:64px;height:64px}
  .v7-footer{grid-template-columns:1fr;justify-items:center}
  .v7-footer small{text-align:center}
  .login-shell{grid-template-columns:1fr}
  .login-logo img{width:150px;margin-bottom:20px}
  .login-card h1{font-size:clamp(4rem,18vw,6.2rem)}
  .media-main{width:calc(100% - 24px);padding-top:40px}
  .media-welcome h1{font-size:clamp(4.5rem,20vw,7rem)}
  .media-event-cover{height:300px}
  .protected-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  .video-card>div{grid-template-columns:1fr}
  .lightbox{padding:80px 12px 28px}
  .lightbox-arrow{width:48px;height:48px;font-size:2rem;top:auto;bottom:max(18px,env(safe-area-inset-bottom))}
  .lightbox-prev{left:20px}.lightbox-next{right:20px}
  .lightbox-top{left:12px;right:12px}
}
@media(max-width:480px){
  .v7-hero h1{font-size:4.65rem}
  .hero-card{height:370px}
  .hero-card-overlay span{font-size:3rem}
  .hero-card-overlay strong{font-size:.9rem}
  .public-intro,.archive-preview,.privacy-band{width:calc(100% - 24px);margin:75px auto}
  .year-card-top span,.media-year-heading span{font-size:4rem}
  .media-header{padding:0 14px}
  .media-header span{display:none}
  .event-hero{height:66vh}
  .event-hero-copy{left:20px;bottom:28px}
  .event-hero-copy h1{font-size:4rem}
}


/* =========================================================
   VERSION 7 · PHASE 2 — STREAMING MEDIATHEK
   ========================================================= */

.media-brand img{transition:transform .3s}
.media-brand:hover img{transform:scale(1.04)}
.media-nav{display:flex;align-items:center;gap:8px}
.media-nav a{padding:10px 13px;border-radius:999px;color:#94a2a8;font-size:.72rem;font-weight:700}
.media-nav a:hover,.media-nav a.active{color:#fff;background:rgba(255,255,255,.06)}
.media-nav .logout-link{border:1px solid var(--line);margin-left:6px}

.streaming-hero,.event-cinema-hero{
  min-height:min(76vh,760px);
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:30px;
  background:#071116;
  isolation:isolate;
}
.streaming-hero>img,.event-cinema-hero>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.streaming-hero-shade,.event-cinema-vignette{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(90deg,rgba(2,7,11,.98) 0%,rgba(2,7,11,.78) 34%,rgba(2,7,11,.12) 72%),
    linear-gradient(0deg,rgba(2,7,11,.92),transparent 55%);
}
.streaming-hero:after,.event-cinema-hero:after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  z-index:2;
  height:4px;
  background:linear-gradient(90deg,var(--cyan),var(--pink),transparent 72%);
}
.streaming-hero.accent-pink:after,.event-cinema-hero.accent-pink:after{
  background:linear-gradient(90deg,var(--pink),var(--cyan),transparent 72%);
}
.streaming-hero-copy,.event-cinema-copy{
  position:relative;
  z-index:3;
  max-width:720px;
  min-height:min(76vh,760px);
  padding:clamp(50px,8vw,110px);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.streaming-label{
  width:max-content;
  margin-bottom:22px;
  padding:8px 12px;
  border:1px solid rgba(88,211,222,.35);
  border-radius:999px;
  background:rgba(3,14,18,.58);
  color:var(--cyan);
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  backdrop-filter:blur(12px);
}
.event-kicker{display:flex;align-items:center;gap:10px;color:#d1d9dc;font-size:.72rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.event-kicker i{width:4px;height:4px;border-radius:50%;background:var(--cyan)}
.accent-pink .event-kicker i{background:var(--pink)}
.streaming-hero-copy h1,.event-cinema-copy h1{
  margin:18px 0 22px;
  font-family:"Barlow Condensed";
  font-size:clamp(5rem,10vw,9.3rem);
  line-height:.8;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
.streaming-hero-copy p,.event-cinema-copy>p{max-width:650px;color:#c0c9cd;line-height:1.75;font-size:1rem}
.event-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

.compact-welcome{margin:110px 0 65px}
.compact-welcome h2{
  margin:18px 0 24px;
  font-family:"Barlow Condensed";
  font-size:clamp(4.4rem,8vw,8rem);
  line-height:.82;
  text-transform:uppercase;
}
.compact-welcome h2 em{font-style:normal;color:var(--cyan)}
.compact-welcome p{max-width:650px;color:var(--muted);line-height:1.8}

.streaming-row{margin:70px 0}
.streaming-row-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:18px}
.streaming-row-heading>div{display:flex;align-items:end;gap:16px}
.streaming-row-heading span{font-family:"Barlow Condensed";font-size:4.8rem;line-height:.8;color:#fff}
.streaming-row-heading small{padding-bottom:4px;color:var(--muted)}
.streaming-row-heading>a{color:var(--cyan);font-size:.72rem;font-weight:700}

.streaming-cards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.stream-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:23px;
  background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  transition:transform .35s,border-color .35s,box-shadow .35s;
}
.stream-card:hover{
  transform:translateY(-7px);
  border-color:rgba(88,211,222,.35);
  box-shadow:0 30px 70px rgba(0,0,0,.36);
}
.stream-card.accent-pink:hover{border-color:rgba(240,0,98,.4)}
.stream-card-cover{height:390px;position:relative;overflow:hidden;background:#071116}
.stream-card-cover>img,.stream-card-cover>.event-placeholder{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.stream-card:hover .stream-card-cover>img{transform:scale(1.035)}
.stream-card-shade{position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(0,0,0,.82))}
.stream-play{
  position:absolute;
  left:24px;
  bottom:22px;
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  padding-left:3px;
  border-radius:50%;
  background:var(--pink);
  color:#fff;
  box-shadow:0 10px 35px rgba(240,0,98,.3);
}
.stream-card.accent-cyan .stream-play{background:var(--cyan);color:#021014;box-shadow:0 10px 35px rgba(88,211,222,.22)}
.stream-status{
  position:absolute;
  right:18px;
  top:17px;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  background:rgba(2,7,11,.7);
  color:#fff;
  font-size:.65rem;
  backdrop-filter:blur(12px);
}
.stream-card-copy{padding:22px 24px 25px;display:grid;gap:6px}
.stream-card-copy>span{color:var(--cyan);font-size:.64rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.stream-card.accent-pink .stream-card-copy>span{color:#ff6a9d}
.stream-card-copy strong{font-family:"Barlow Condensed";font-size:2rem;text-transform:uppercase}
.stream-card-copy small{color:var(--muted)}

.event-stats{display:flex;gap:25px;margin-top:20px;color:#aeb9bd;font-size:.75rem}
.event-stats strong{color:#fff;font-size:1.05rem}
.event-subnav{
  position:sticky;
  top:88px;
  z-index:30;
  width:max-content;
  max-width:100%;
  margin:18px auto 0;
  padding:7px;
  display:flex;
  gap:3px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(2,7,11,.86);
  backdrop-filter:blur(16px);
}
.event-subnav a{padding:9px 14px;border-radius:999px;color:#9daab0;font-size:.7rem;font-weight:700}
.event-subnav a:hover{background:rgba(255,255,255,.07);color:#fff}

.memory-intro{
  margin:110px 0;
  display:grid;
  grid-template-columns:90px 1fr .8fr;
  gap:38px;
  align-items:start;
}
.memory-intro h2{
  margin:16px 0 0;
  font-family:"Barlow Condensed";
  font-size:clamp(4rem,7vw,7rem);
  line-height:.84;
  text-transform:uppercase;
}
.memory-intro>p{color:var(--muted);line-height:1.85}
.split-heading{display:grid;grid-template-columns:1fr .65fr;gap:50px;align-items:end}
.split-heading>p{color:var(--muted);line-height:1.75;margin-bottom:40px}

.video-frame{position:relative}
.resume-badge{
  position:absolute;
  left:18px;
  bottom:18px;
  z-index:3;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(2,7,11,.82);
  color:#fff;
  font-size:.72rem;
  cursor:pointer;
  backdrop-filter:blur(14px);
}
.resume-badge strong{color:var(--cyan)}

.gallery-feature-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:190px;
  gap:9px;
}
.gallery-feature-grid button{
  position:relative;
  min-width:0;
  border:0;
  padding:0;
  overflow:hidden;
  background:#071116;
  cursor:pointer;
}
.gallery-feature-grid img{width:100%;height:100%;object-fit:cover;transition:transform .45s,filter .45s}
.gallery-feature-grid button:hover img{transform:scale(1.035);filter:brightness(1.05)}
.gallery-feature-grid button>span{
  position:absolute;
  left:18px;
  bottom:16px;
  padding:9px 12px;
  border-radius:999px;
  background:rgba(2,7,11,.78);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  font-size:.7rem;
}
.gallery-feature-1{grid-column:span 2;grid-row:span 2}
.gallery-feature-4{grid-row:span 2}
.gallery-feature-7{grid-column:span 2}

.media-footer{
  width:min(1380px,calc(100% - 48px));
  margin:0 auto 30px;
  padding:28px 0;
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  color:#78868c;
  font-size:.72rem;
}
.media-footer span{color:#9fabb0}

@media(max-width:900px){
  .media-nav a:not(.logout-link){display:none}
  .streaming-hero,.event-cinema-hero{min-height:680px}
  .streaming-hero-shade,.event-cinema-vignette{
    background:linear-gradient(0deg,rgba(2,7,11,.97) 0%,rgba(2,7,11,.6) 58%,rgba(2,7,11,.12));
  }
  .streaming-hero-copy,.event-cinema-copy{
    min-height:680px;
    padding:34px 25px;
    justify-content:flex-end;
  }
  .streaming-hero-copy h1,.event-cinema-copy h1{font-size:clamp(4.6rem,19vw,7rem)}
  .streaming-cards{grid-template-columns:1fr}
  .stream-card-cover{height:330px}
  .memory-intro{grid-template-columns:1fr;gap:15px}
  .memory-intro .section-number{display:none}
  .split-heading{grid-template-columns:1fr;gap:0}
  .split-heading>p{margin-top:-15px}
  .gallery-feature-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:175px}
  .gallery-feature-1,.gallery-feature-4,.gallery-feature-7{grid-column:auto;grid-row:auto}
  .gallery-feature-grid button:first-child{grid-column:span 2;grid-row:span 2}
  .media-footer{flex-direction:column}
}

@media(max-width:520px){
  .media-main{padding-bottom:75px}
  .media-header{height:76px}
  .media-header img{width:82px}
  .media-nav .logout-link{padding:8px 10px}
  .streaming-hero,.event-cinema-hero{min-height:620px;border-radius:22px}
  .streaming-hero-copy,.event-cinema-copy{min-height:620px;padding:28px 20px}
  .streaming-hero-copy h1,.event-cinema-copy h1{font-size:4.45rem}
  .streaming-hero-copy p,.event-cinema-copy>p{font-size:.9rem}
  .event-actions .primary-button,.event-actions .ghost-button{width:100%}
  .compact-welcome{margin:75px 0 48px}
  .compact-welcome h2{font-size:4.45rem}
  .streaming-row{margin:58px 0}
  .streaming-row-heading span{font-size:3.8rem}
  .streaming-row-heading small{display:none}
  .stream-card-cover{height:285px}
  .event-subnav{top:76px}
  .event-cinema-copy h1{font-size:4rem}
  .event-stats{gap:16px}
  .memory-intro{margin:75px 0}
  .memory-intro h2{font-size:4.2rem}
  .gallery-feature-grid{grid-auto-rows:145px;gap:5px}
  .gallery-feature-grid button:first-child{grid-row:span 2}
  .lightbox{padding-top:78px;padding-bottom:75px}
}


/* Version 7.2.1 – Content Detection Fix */
.streaming-row:first-of-type {
  scroll-margin-top: 110px;
}


/* Version 7.2.2 – Medien-Ladefix */
.gallery-feature-grid button,
.stream-card-cover,
.event-cinema-hero,
.streaming-hero {
  background:
    linear-gradient(110deg, #071116 8%, #0b1920 18%, #071116 33%);
  background-size: 200% 100%;
  animation: mediaSkeleton 1.8s linear infinite;
}

.gallery-feature-grid img,
.stream-card-cover img,
.event-cinema-hero > img,
.streaming-hero > img {
  animation: mediaFadeIn .45s ease both;
}

@keyframes mediaSkeleton {
  to { background-position-x: -200%; }
}

@keyframes mediaFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


/* Version 7.2.3 – Emergency Performance Fix */
.gallery-load-more {
  display: flex;
  justify-content: center;
  padding: 34px 0 4px;
}

.gallery-load-more button {
  min-height: 50px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

.gallery-load-more button:hover {
  border-color: rgba(88,211,222,.45);
  background: rgba(88,211,222,.08);
}

.gallery-load-more span {
  min-width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(88,211,222,.12);
  color: var(--cyan);
  font-size: .72rem;
}


/* Version 7.2.4 – dauerhafter Thumbnail-Cache */
.thumbnail-notice {
  margin: 0 0 24px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid rgba(88,211,222,.24);
  border-radius: 16px;
  background: rgba(88,211,222,.07);
}

.thumbnail-notice div {
  display: grid;
  gap: 5px;
}

.thumbnail-notice strong {
  color: #fff;
}

.thumbnail-notice span {
  color: var(--muted);
  font-size: .78rem;
}

.thumbnail-notice a {
  flex: 0 0 auto;
  padding: 11px 14px;
  border-radius: 999px;
  background: var(--cyan);
  color: #021014;
  font-size: .72rem;
  font-weight: 800;
}

.gallery-feature-grid button.thumbnail-pending {
  display: none;
}

.thumbgen-body {
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(circle at 70% 20%,rgba(88,211,222,.13),transparent 30%),
    radial-gradient(circle at 20% 85%,rgba(240,0,98,.10),transparent 34%),
    var(--bg);
}

.thumbgen-card {
  width: min(620px,100%);
  padding: clamp(30px,6vw,60px);
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: rgba(5,14,18,.92);
}

.thumbgen-card > img {
  width: 130px;
  margin: 0 auto 28px;
}

.thumbgen-card h1 {
  margin: 18px 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3rem,8vw,5.5rem);
  line-height: .88;
  text-transform: uppercase;
}

.thumbgen-card p {
  color: var(--muted);
  line-height: 1.7;
}

.thumbgen-progress {
  height: 10px;
  margin: 28px 0 12px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.thumbgen-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,var(--cyan),var(--pink));
}

.thumbgen-card > strong {
  display: block;
  margin-bottom: 22px;
}

.thumbgen-card > small {
  display: block;
  margin: 14px 0;
  color: var(--muted);
}

@media(max-width:600px) {
  .thumbnail-notice {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* Version 7.2.5 – automatische Lazy-Galerie */
.gallery-feature-grid button {
  position: relative;
}

.gallery-feature-grid button:not(.thumbnail-loaded):not(.thumbnail-pending)::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(110deg, #071116 8%, #0d2028 18%, #071116 33%);
  background-size: 200% 100%;
  animation: mediaSkeleton 1.6s linear infinite;
  pointer-events: none;
}

.gallery-feature-grid button.thumbnail-loaded::after {
  display: none;
}

.gallery-feature-grid button.thumbnail-error::after {
  content: "Bild konnte nicht geladen werden";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: #071116;
  color: #839197;
  font-size: .7rem;
  text-align: center;
}

.gallery-load-more {
  display: none !important;
}


/* =========================================================
   VERSION 7.3 — DIREKTE MEDIATHEK NACH DEM LOGIN
   ========================================================= */

.library-intro {
  margin: 18px 0 42px;
  padding: 48px 52px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 50px;
  border: 1px solid var(--line);
  border-radius: 27px;
  background:
    radial-gradient(circle at 80% 20%, rgba(88,211,222,.09), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
}

.library-intro h1 {
  margin: 18px 0 22px;
  font-family: "Barlow Condensed";
  font-size: clamp(4.2rem, 8vw, 8rem);
  line-height: .82;
  letter-spacing: -.035em;
  text-transform: uppercase;
}

.library-intro h1 em {
  color: var(--cyan);
  font-style: normal;
}

.library-intro p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}

.library-status {
  min-width: 220px;
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(88,211,222,.22);
  border-radius: 17px;
  background: rgba(88,211,222,.06);
}

.library-status > span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(88,211,222,.1);
}

.library-status div {
  display: grid;
  gap: 4px;
}

.library-status strong {
  font-size: .86rem;
}

.library-status small {
  color: var(--muted);
  font-size: .7rem;
}

.featured-library-card {
  min-height: 440px;
  margin-bottom: 88px;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: var(--panel);
}

.featured-library-cover {
  position: relative;
  min-height: 440px;
  overflow: hidden;
}

.featured-library-cover img,
.featured-library-cover .event-placeholder {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.featured-library-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 35%, rgba(4,12,16,.94) 100%),
    linear-gradient(0deg, rgba(2,7,11,.55), transparent 60%);
}

.featured-library-copy {
  padding: 42px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.featured-label {
  width: max-content;
  margin-bottom: 22px;
  padding: 8px 11px;
  border: 1px solid rgba(88,211,222,.3);
  border-radius: 999px;
  color: var(--cyan);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.featured-library-copy h2 {
  margin: 15px 0 18px;
  font-family: "Barlow Condensed";
  font-size: clamp(3.5rem, 6vw, 6.5rem);
  line-height: .85;
  text-transform: uppercase;
}

.featured-library-copy > p {
  color: var(--muted);
  line-height: 1.72;
}

.featured-library-meta {
  display: flex;
  gap: 25px;
  margin: 18px 0 26px;
  color: var(--muted);
  font-size: .75rem;
}

.featured-library-meta strong {
  color: #fff;
  font-size: 1rem;
}

.featured-library-copy .primary-button {
  width: max-content;
}

.library-archive {
  scroll-margin-top: 105px;
}

.library-archive-heading {
  margin-bottom: 50px;
  display: grid;
  grid-template-columns: 1fr .72fr;
  align-items: end;
  gap: 50px;
}

.library-archive-heading h2 {
  margin: 15px 0 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3.5rem, 6vw, 6rem);
  line-height: .88;
  text-transform: uppercase;
}

.library-archive-heading p {
  color: var(--muted);
  line-height: 1.75;
}

.library-year {
  margin: 0 0 78px;
}

.library-year-heading {
  margin-bottom: 20px;
  padding-bottom: 15px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}

.library-year-heading > div {
  display: flex;
  align-items: end;
  gap: 15px;
}

.library-year-heading span {
  font-family: "Barlow Condensed";
  font-size: 5rem;
  line-height: .8;
  color: #fff;
}

.library-year-heading small {
  padding-bottom: 4px;
  color: var(--muted);
}

.library-year-heading a {
  color: var(--cyan);
  font-size: .72rem;
  font-weight: 700;
}

.library-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.library-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 23px;
  background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012));
  transition: transform .32s, border-color .32s, box-shadow .32s;
}

.library-card:hover {
  transform: translateY(-6px);
  border-color: rgba(88,211,222,.4);
  box-shadow: 0 28px 70px rgba(0,0,0,.34);
}

.library-card.accent-pink:hover {
  border-color: rgba(240,0,98,.45);
}

.library-card-cover {
  position: relative;
  height: 340px;
  overflow: hidden;
  background: #071116;
}

.library-card-cover img,
.library-card-cover .event-placeholder {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .55s;
}

.library-card:hover .library-card-cover img {
  transform: scale(1.035);
}

.library-card-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 36%, rgba(0,0,0,.82));
}

.library-card-play {
  position: absolute;
  left: 22px;
  bottom: 20px;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  padding-left: 3px;
  border-radius: 50%;
  background: var(--cyan);
  color: #031014;
  box-shadow: 0 12px 34px rgba(88,211,222,.2);
}

.library-card.accent-pink .library-card-play {
  background: var(--pink);
  color: #fff;
  box-shadow: 0 12px 34px rgba(240,0,98,.28);
}

.library-card-badge {
  position: absolute;
  right: 16px;
  top: 16px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 999px;
  background: rgba(2,7,11,.72);
  color: #fff;
  font-size: .64rem;
  backdrop-filter: blur(12px);
}

.library-card-copy {
  padding: 22px 23px 24px;
  display: grid;
  gap: 7px;
}

.library-card-copy > span {
  color: var(--cyan);
  font-size: .63rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.library-card.accent-pink .library-card-copy > span {
  color: #ff6b9f;
}

.library-card-copy strong {
  font-family: "Barlow Condensed";
  font-size: 2rem;
  text-transform: uppercase;
}

.library-card-copy > div {
  display: flex;
  gap: 13px;
  color: var(--muted);
}

.library-card-copy em {
  margin-top: 8px;
  color: #fff;
  font-style: normal;
  font-size: .75rem;
  font-weight: 700;
}

@media (max-width: 900px) {
  .library-intro {
    grid-template-columns: 1fr;
    padding: 35px 28px;
  }

  .library-status {
    min-width: 0;
    width: 100%;
  }

  .featured-library-card {
    grid-template-columns: 1fr;
  }

  .featured-library-cover {
    min-height: 360px;
  }

  .featured-library-shade {
    background: linear-gradient(0deg, rgba(4,12,16,.94), transparent 60%);
  }

  .library-archive-heading {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .library-card-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .library-intro {
    margin-top: 0;
    padding: 28px 20px;
  }

  .library-intro h1 {
    font-size: 4.25rem;
  }

  .featured-library-card {
    margin-bottom: 68px;
  }

  .featured-library-cover {
    min-height: 285px;
  }

  .featured-library-copy {
    padding: 26px 21px 30px;
  }

  .featured-library-copy h2 {
    font-size: 4rem;
  }

  .featured-library-copy .primary-button {
    width: 100%;
  }

  .library-archive-heading h2 {
    font-size: 3.8rem;
  }

  .library-year-heading span {
    font-size: 4rem;
  }

  .library-year-heading small {
    display: none;
  }

  .library-card-cover {
    height: 285px;
  }
}


/* =========================================================
   VERSION 7.4 — ÖFFENTLICHE TEAMSEITE
   ========================================================= */

.active-link {
  color: #fff !important;
}

.team-main {
  width: min(1440px, calc(100% - 48px));
  margin: 24px auto 0;
}

.team-hero {
  min-height: 610px;
  padding: clamp(42px, 7vw, 88px);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 70px;
  border: 1px solid var(--line);
  border-radius: 36px;
  background:
    radial-gradient(circle at 78% 28%, rgba(88,211,222,.13), transparent 26%),
    radial-gradient(circle at 86% 72%, rgba(240,0,98,.10), transparent 28%),
    linear-gradient(145deg,#061116,#02070b 68%);
  overflow: hidden;
}

.team-hero h1 {
  margin: 24px 0 30px;
  font-family: "Barlow Condensed";
  font-size: clamp(5rem, 10vw, 10rem);
  line-height: .78;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.team-hero h1 em {
  color: var(--cyan);
  font-style: normal;
}

.team-hero p {
  max-width: 700px;
  color: #b5c0c4;
  font-size: clamp(1rem, 1.6vw, 1.25rem);
  line-height: 1.75;
}

.team-hero-orbit {
  width: 260px;
  height: 260px;
  position: relative;
  display: grid;
  place-items: center;
  align-content: center;
  border: 1px solid rgba(88,211,222,.28);
  border-radius: 50%;
  background: rgba(3,12,16,.62);
  box-shadow:
    0 0 0 30px rgba(88,211,222,.025),
    0 0 0 62px rgba(240,0,98,.02);
}

.team-hero-orbit::before,
.team-hero-orbit::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.07);
}

.team-hero-orbit::before { inset: -30px; }
.team-hero-orbit::after { inset: -62px; }

.team-hero-orbit span {
  font-family: "Barlow Condensed";
  font-size: 7rem;
  line-height: .8;
  color: var(--cyan);
}

.team-hero-orbit small {
  margin-top: 12px;
  color: #b7c1c5;
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.team-intro {
  width: min(1320px, 100%);
  margin: 115px auto 55px;
  display: grid;
  grid-template-columns: 100px 1fr .8fr;
  gap: 45px;
  align-items: start;
}

.team-intro h2 {
  margin: 16px 0 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3.6rem, 6vw, 6.5rem);
  line-height: .86;
  text-transform: uppercase;
}

.team-intro p {
  color: var(--muted);
  line-height: 1.85;
}

.team-grid {
  width: min(1320px, 100%);
  margin: 0 auto 120px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
}

.team-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 25px;
  background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012));
  transition: transform .35s, border-color .35s, box-shadow .35s;
}

.team-card:hover {
  transform: translateY(-7px);
  border-color: rgba(88,211,222,.38);
  box-shadow: 0 30px 70px rgba(0,0,0,.34);
}

.team-portrait {
  aspect-ratio: 4 / 5;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
}

.team-portrait-1 {
  background:
    radial-gradient(circle at 72% 20%, rgba(88,211,222,.24), transparent 28%),
    linear-gradient(145deg,#0b1b22,#061014);
}

.team-portrait-2 {
  background:
    radial-gradient(circle at 28% 24%, rgba(240,0,98,.22), transparent 30%),
    linear-gradient(145deg,#160a12,#071014);
}

.team-portrait-3 {
  background:
    radial-gradient(circle at 70% 68%, rgba(88,211,222,.18), transparent 28%),
    radial-gradient(circle at 25% 22%, rgba(240,0,98,.16), transparent 28%),
    linear-gradient(145deg,#10131a,#061014);
}

.team-portrait::before {
  content: "";
  width: 54%;
  height: 54%;
  position: absolute;
  top: 17%;
  border-radius: 50% 50% 44% 44%;
  background: rgba(255,255,255,.06);
  filter: blur(.2px);
}

.team-portrait::after {
  content: "";
  width: 78%;
  height: 48%;
  position: absolute;
  bottom: -7%;
  border-radius: 48% 48% 12% 12%;
  background: rgba(255,255,255,.055);
}

.team-placeholder {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  gap: 12px;
}

.team-placeholder span {
  width: 92px;
  height: 92px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  background: rgba(2,7,11,.54);
  color: #fff;
  font-family: "Barlow Condensed";
  font-size: 2.2rem;
  letter-spacing: .04em;
  backdrop-filter: blur(12px);
}

.team-placeholder small {
  color: rgba(255,255,255,.65);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.team-card-copy {
  min-height: 190px;
  padding: 24px 24px 28px;
}

.team-card-copy > span {
  color: var(--cyan);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.team-card-copy h2 {
  margin: 9px 0 14px;
  font-family: "Barlow Condensed";
  font-size: 2.25rem;
  line-height: .95;
  text-transform: uppercase;
}

.team-card-copy p {
  margin: 0;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.7;
}

.team-finale {
  width: min(1320px,100%);
  margin: 0 auto 110px;
  padding: 48px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: center;
  border: 1px solid rgba(240,0,98,.2);
  border-radius: 28px;
  background: linear-gradient(135deg,rgba(240,0,98,.07),rgba(88,211,222,.06));
}

.team-finale h2 {
  margin: 15px 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3rem,5vw,5rem);
  line-height: .88;
  text-transform: uppercase;
}

.team-finale p {
  max-width: 720px;
  color: var(--muted);
  line-height: 1.8;
}

@media(max-width:1000px){
  .team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:850px){
  .team-main{width:calc(100% - 24px);margin-top:12px}
  .team-hero{min-height:auto;grid-template-columns:1fr;padding:45px 23px}
  .team-hero h1{font-size:clamp(4.7rem,20vw,7rem)}
  .team-hero-orbit{width:190px;height:190px;margin:10px auto 20px}
  .team-hero-orbit span{font-size:5rem}
  .team-intro{grid-template-columns:1fr;gap:15px;margin-top:75px}
  .team-intro .section-number{display:none}
  .team-finale{grid-template-columns:1fr;padding:32px}
}

@media(max-width:580px){
  .team-grid{grid-template-columns:1fr}
  .team-card-copy{min-height:0}
  .team-finale .ghost-button{width:100%}
}


/* =========================================================
   VERSION 7.5 — ÖFFENTLICHE UNTERSEITEN & FEINSCHLIFF
   ========================================================= */

.public-hub {
  width: min(1320px, calc(100% - 48px));
  margin: 0 auto 120px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 14px;
}

.public-hub-card {
  min-height: 280px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
  transition: transform .3s,border-color .3s;
}

.public-hub-card:hover {
  transform: translateY(-6px);
  border-color: rgba(88,211,222,.38);
}

.public-hub-card > span {
  color: rgba(255,255,255,.2);
  font-family: "Barlow Condensed";
  font-size: 2.5rem;
}

.public-hub-card strong {
  margin-top: 28px;
  font-family: "Barlow Condensed";
  font-size: 2rem;
  text-transform: uppercase;
}

.public-hub-card p {
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.65;
}

.public-hub-card em {
  margin-top: auto;
  color: var(--cyan);
  font-size: .72rem;
  font-style: normal;
  font-weight: 700;
}

/* Leadership */
.leadership-section,
.trainer-section {
  width: min(1320px,100%);
  margin: 0 auto 110px;
}

.leadership-heading,
.trainer-section-heading {
  max-width: 900px;
  margin-bottom: 35px;
}

.leadership-heading h2,
.trainer-section-heading h2 {
  margin: 15px 0 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3.6rem,6vw,6.5rem);
  line-height: .86;
  text-transform: uppercase;
}

.leadership-card {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  overflow: hidden;
  border: 1px solid rgba(88,211,222,.25);
  border-radius: 28px;
  background:
    radial-gradient(circle at 20% 20%,rgba(88,211,222,.12),transparent 30%),
    linear-gradient(145deg,#08151b,#040b0f);
}

.leadership-portrait {
  min-height: 520px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 30%,rgba(88,211,222,.2),transparent 28%),
    radial-gradient(circle at 40% 72%,rgba(240,0,98,.15),transparent 32%);
}

.leadership-portrait .team-placeholder span {
  width: 130px;
  height: 130px;
  font-size: 3rem;
}

.leadership-copy {
  padding: clamp(35px,6vw,72px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.leadership-copy > span {
  color: var(--cyan);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.leadership-copy h2 {
  margin: 14px 0 22px;
  font-family: "Barlow Condensed";
  font-size: clamp(4rem,7vw,7rem);
  line-height: .85;
  text-transform: uppercase;
}

.leadership-copy p {
  color: var(--muted);
  line-height: 1.8;
}

.leadership-copy blockquote {
  margin: 28px 0 0;
  padding-left: 20px;
  border-left: 2px solid var(--pink);
  color: #fff;
  font-size: 1.05rem;
  line-height: 1.6;
}

/* Shared content pages */
.content-main {
  width: min(1440px,calc(100% - 48px));
  margin: 24px auto 0;
}

.content-hero {
  min-height: 610px;
  padding: clamp(42px,7vw,88px);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 60px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 36px;
  background:
    radial-gradient(circle at 78% 26%,rgba(88,211,222,.12),transparent 28%),
    radial-gradient(circle at 82% 75%,rgba(240,0,98,.09),transparent 28%),
    linear-gradient(145deg,#061116,#02070b 68%);
}

.content-hero h1 {
  margin: 24px 0 30px;
  font-family: "Barlow Condensed";
  font-size: clamp(5rem,10vw,10rem);
  line-height: .78;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.content-hero h1 em {
  color: var(--cyan);
  font-style: normal;
}

.content-hero p {
  max-width: 720px;
  color: #b5c0c4;
  font-size: clamp(1rem,1.6vw,1.25rem);
  line-height: 1.75;
}

.content-hero-mark {
  width: 230px;
  height: 230px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(88,211,222,.25);
  border-radius: 50%;
  color: var(--cyan);
  font-family: "Barlow Condensed";
  font-size: 6rem;
  background: rgba(3,12,16,.62);
  box-shadow: 0 0 0 32px rgba(88,211,222,.025),0 0 0 64px rgba(240,0,98,.018);
}

.story-grid,
.course-grid,
.dates-board,
.contact-grid {
  width: min(1320px,100%);
  margin: 110px auto;
  display: grid;
  gap: 18px;
}

.story-grid {
  grid-template-columns: 1.2fr .8fr .8fr;
}

.story-card,
.course-card,
.date-card,
.contact-card {
  min-height: 320px;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
}

.story-card > span,
.course-card > span,
.date-card > span,
.contact-card > span {
  color: var(--cyan);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.story-card h2,
.course-card h2,
.date-card h2,
.contact-card h2 {
  margin: 20px 0;
  font-family: "Barlow Condensed";
  font-size: clamp(2.5rem,4vw,4rem);
  line-height: .9;
  text-transform: uppercase;
}

.story-card p,
.course-card p,
.date-card p,
.contact-card p {
  color: var(--muted);
  line-height: 1.75;
}

.timeline-section,
.info-band,
.contact-note {
  width: min(1320px,100%);
  margin: 0 auto 110px;
}

.history-line {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
}

.history-line article {
  padding: 24px;
  border-top: 1px solid var(--line);
}

.history-line span {
  color: var(--pink);
  font-family: "Barlow Condensed";
  font-size: 2.5rem;
}

.history-line strong {
  display: block;
  margin: 18px 0 10px;
  font-family: "Barlow Condensed";
  font-size: 1.8rem;
  text-transform: uppercase;
}

.history-line p {
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.7;
}

.course-grid {
  grid-template-columns: repeat(2,minmax(0,1fr));
}

.course-card {
  display: grid;
  align-content: start;
}

.course-card > small {
  color: var(--muted);
}

.course-card em {
  margin-top: auto;
  color: var(--pink);
  font-style: normal;
  font-size: .72rem;
  font-weight: 700;
}

.info-band {
  padding: 45px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 35px;
  align-items: center;
  border: 1px solid rgba(88,211,222,.22);
  border-radius: 28px;
  background: linear-gradient(135deg,rgba(88,211,222,.07),rgba(240,0,98,.05));
}

.info-band h2 {
  margin: 14px 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3rem,5vw,5rem);
  line-height: .88;
  text-transform: uppercase;
}

.info-band p {
  color: var(--muted);
}

.dates-board {
  grid-template-columns: repeat(3,minmax(0,1fr));
}

.date-card-highlight {
  border-color: rgba(240,0,98,.3);
  background: linear-gradient(145deg,rgba(240,0,98,.08),rgba(255,255,255,.012));
}

.date-card strong {
  display: block;
  margin-top: 32px;
  color: #fff;
}

.contact-grid {
  grid-template-columns: 1.15fr .85fr .85fr;
}

.contact-card-primary {
  border-color: rgba(88,211,222,.28);
}

.contact-card a {
  display: inline-block;
  margin-top: 22px;
  color: var(--cyan);
  font-weight: 700;
}

.contact-note {
  padding: 22px 25px;
  display: flex;
  gap: 18px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 18px;
}

.contact-note span {
  color: var(--pink);
  font-weight: 800;
}

.contact-note p {
  margin: 0;
  color: var(--muted);
}

/* Mediathek: years visible immediately */
.year-jump-nav {
  margin: 0 0 20px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.025);
}

.year-jump-nav > span {
  padding: 0 6px;
  color: var(--muted);
  font-size: .68rem;
}

.year-jump-nav a {
  min-width: 62px;
  padding: 9px 13px;
  text-align: center;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
}

.year-jump-nav a:hover {
  background: rgba(88,211,222,.12);
  color: var(--cyan);
}

.library-year {
  scroll-margin-top: 110px;
}

@media(max-width:1100px) {
  .public-hub {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}

@media(max-width:900px) {
  .public-hub {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .leadership-card,
  .content-hero {
    grid-template-columns: 1fr;
  }

  .leadership-portrait {
    min-height: 380px;
  }

  .content-hero-mark {
    width: 170px;
    height: 170px;
    margin: 0 auto 20px;
    font-size: 4.5rem;
  }

  .story-grid,
  .course-grid,
  .dates-board,
  .contact-grid,
  .history-line {
    grid-template-columns: 1fr;
  }

  .info-band {
    grid-template-columns: 1fr;
  }
}

@media(max-width:580px) {
  .public-hub {
    width: calc(100% - 24px);
    grid-template-columns: 1fr;
    margin-bottom: 75px;
  }

  .public-hub-card {
    min-height: 220px;
  }

  .content-main {
    width: calc(100% - 24px);
    margin-top: 12px;
  }

  .content-hero {
    min-height: auto;
    padding: 44px 22px;
  }

  .content-hero h1 {
    font-size: 4.6rem;
  }

  .leadership-copy h2 {
    font-size: 4rem;
  }

  .leadership-section,
  .trainer-section {
    margin-bottom: 75px;
  }

  .info-band {
    padding: 30px 24px;
  }

  .info-band .primary-button {
    width: 100%;
  }

  .year-jump-nav {
    border-radius: 18px;
  }
}


/* =========================================================
   VERSION 7.6 — STUNDENPLAN HERBST 2026
   ========================================================= */

.schedule-intro {
  width: min(1320px,100%);
  margin: 100px auto 40px;
  display: grid;
  grid-template-columns: 1fr .7fr;
  align-items: end;
  gap: 50px;
}

.schedule-intro h2 {
  margin: 14px 0 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3.8rem,6vw,6.5rem);
  line-height: .86;
  text-transform: uppercase;
}

.schedule-intro p {
  color: var(--muted);
  line-height: 1.8;
}

.weekly-schedule {
  width: min(1320px,100%);
  margin: 0 auto 100px;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 18px;
}

.schedule-day {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
}

.schedule-day-head {
  padding: 22px 24px;
  display: flex;
  align-items: end;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  background: rgba(88,211,222,.045);
}

.schedule-day-head span {
  font-family: "Barlow Condensed";
  font-size: 2.8rem;
  line-height: .9;
  text-transform: uppercase;
}

.schedule-day-head small {
  color: var(--cyan);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.schedule-list {
  display: grid;
}

.schedule-item {
  min-height: 95px;
  padding: 19px 24px;
  display: grid;
  grid-template-columns: 125px 1fr;
  grid-template-areas:
    "time title"
    "time meta";
  column-gap: 20px;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.schedule-item:last-child {
  border-bottom: 0;
}

.schedule-item > span {
  grid-area: time;
  color: var(--pink);
  font-size: .78rem;
  font-weight: 800;
}

.schedule-item > strong {
  grid-area: title;
  font-family: "Barlow Condensed";
  font-size: 1.65rem;
  line-height: 1;
  text-transform: uppercase;
}

.schedule-item > small {
  grid-area: meta;
  margin-top: 5px;
  color: var(--muted);
}

.course-contact-band {
  width: min(1320px,100%);
  margin: 0 auto 110px;
  padding: 46px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 45px;
  align-items: center;
  border: 1px solid rgba(240,0,98,.22);
  border-radius: 28px;
  background: linear-gradient(135deg,rgba(240,0,98,.07),rgba(88,211,222,.06));
}

.course-contact-band h2 {
  margin: 14px 0;
  font-family: "Barlow Condensed";
  font-size: clamp(3.2rem,5vw,5.2rem);
  line-height: .86;
  text-transform: uppercase;
}

.course-contact-band p {
  max-width: 700px;
  color: var(--muted);
  line-height: 1.75;
}

.course-contact-actions {
  display: grid;
  gap: 10px;
}

.course-contact-actions a {
  min-width: 245px;
  padding: 15px 18px;
  display: grid;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(2,7,11,.45);
}

.course-contact-actions a:hover {
  border-color: rgba(88,211,222,.4);
}

.course-contact-actions small {
  color: var(--cyan);
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.course-contact-actions strong {
  font-size: 1rem;
}

.date-card a {
  color: var(--cyan);
}

@media(max-width:850px) {
  .schedule-intro,
  .course-contact-band {
    grid-template-columns: 1fr;
  }

  .weekly-schedule {
    grid-template-columns: 1fr;
  }

  .course-contact-actions a {
    min-width: 0;
  }
}

@media(max-width:520px) {
  .schedule-intro {
    margin-top: 75px;
  }

  .schedule-item {
    min-height: 105px;
    grid-template-columns: 1fr;
    grid-template-areas:
      "time"
      "title"
      "meta";
    gap: 5px;
  }

  .course-contact-band {
    padding: 30px 23px;
  }
}


/* Version 7.6.3 – Mediathek komplett neu aufgebaut */
.library-archive-immediate {
  margin-top: 28px;
}

.library-archive-immediate .library-year:first-child {
  margin-top: 0;
}

.library-archive-immediate .library-card-grid {
  min-height: 1px;
}

@media (min-width: 901px) {
  .library-archive-immediate .library-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* =========================================================
   VERSION 7.7 — VORSCHAUKARTEN & KONTAKT
   ========================================================= */

.event-poster-fallback {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background:
    radial-gradient(circle at 74% 22%,rgba(88,211,222,.24),transparent 28%),
    radial-gradient(circle at 22% 78%,rgba(240,0,98,.21),transparent 30%),
    linear-gradient(145deg,#0b1a21,#040b0f 70%);
}

.event-poster-fallback.accent-pink {
  background:
    radial-gradient(circle at 72% 25%,rgba(240,0,98,.24),transparent 30%),
    radial-gradient(circle at 20% 78%,rgba(88,211,222,.17),transparent 30%),
    linear-gradient(145deg,#190a12,#040b0f 70%);
}

.event-poster-fallback::before {
  content: "";
  position: absolute;
  inset: -30%;
  z-index: -1;
  background:
    repeating-linear-gradient(
      115deg,
      transparent 0 72px,
      rgba(255,255,255,.025) 73px 74px
    );
  transform: rotate(-8deg);
}

.event-poster-fallback > img {
  position: absolute;
  right: 20px;
  top: 18px;
  width: 100px !important;
  height: 80px !important;
  object-fit: contain !important;
  opacity: .9;
}

.event-poster-fallback > span {
  color: var(--cyan);
  font-family: "Barlow Condensed";
  font-size: 3.5rem;
  line-height: .8;
}

.event-poster-fallback.accent-pink > span {
  color: #ff6a9e;
}

.event-poster-fallback > strong {
  max-width: 90%;
  margin-top: 9px;
  color: #fff;
  font-family: "Barlow Condensed";
  font-size: 2.2rem;
  line-height: .9;
  text-transform: uppercase;
}

.event-poster-fallback > small {
  margin-top: 12px;
  color: rgba(255,255,255,.62);
  font-size: .65rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.location-section {
  width: min(1320px,100%);
  margin: 0 auto 110px;
}

.location-map-card {
  min-height: 440px;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  overflow: hidden;
  border: 1px solid rgba(88,211,222,.22);
  border-radius: 28px;
  background: linear-gradient(145deg,#071319,#040a0d);
}

.location-map-visual {
  position: relative;
  min-height: 440px;
  overflow: hidden;
  background:
    linear-gradient(135deg,rgba(88,211,222,.08),rgba(240,0,98,.04)),
    #e9eff0;
}

.location-map-visual::before,
.location-map-visual::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(106,186,133,.23);
}

.location-map-visual::before {
  width: 220px;
  height: 220px;
  right: -55px;
  top: -60px;
}

.location-map-visual::after {
  width: 170px;
  height: 170px;
  left: -40px;
  bottom: -45px;
}

.map-road {
  position: absolute;
  height: 18px;
  border: 5px solid white;
  border-radius: 999px;
  background: #c9d2d5;
  box-shadow: 0 0 0 1px rgba(0,0,0,.08);
}

.map-road-a {
  width: 125%;
  left: -12%;
  top: 43%;
  transform: rotate(-9deg);
}

.map-road-b {
  width: 95%;
  left: 24%;
  top: 18%;
  transform: rotate(68deg);
}

.map-road-c {
  width: 85%;
  left: -18%;
  bottom: 14%;
  transform: rotate(29deg);
}

.map-pin {
  position: absolute;
  z-index: 4;
  left: 52%;
  top: 43%;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 6px solid white;
  border-radius: 50% 50% 50% 0;
  background: #e43a36;
  color: white;
  font-size: 1.35rem;
  transform: translate(-50%,-50%) rotate(-45deg);
  box-shadow: 0 10px 25px rgba(0,0,0,.23);
}

.map-pin::first-letter {
  transform: rotate(45deg);
}

.location-map-visual > small {
  position: absolute;
  z-index: 5;
  left: calc(52% + 36px);
  top: calc(43% - 8px);
  padding: 7px 10px;
  border-radius: 8px;
  background: white;
  color: #192226;
  font-size: .78rem;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
}

.location-map-copy {
  padding: clamp(34px,6vw,68px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.location-map-copy h2 {
  margin: 15px 0 20px;
  font-family: "Barlow Condensed";
  font-size: clamp(3.8rem,6vw,6rem);
  line-height: .86;
  text-transform: uppercase;
}

.location-map-copy p {
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.8;
}

.location-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 25px;
}

.contact-note a {
  color: var(--cyan);
}

@media(max-width:850px) {
  .location-map-card {
    grid-template-columns: 1fr;
  }

  .location-map-visual {
    min-height: 330px;
  }
}

@media(max-width:520px) {
  .event-poster-fallback > img {
    width: 78px !important;
    height: 62px !important;
  }

  .event-poster-fallback > strong {
    font-size: 1.8rem;
  }

  .location-actions .primary-button,
  .location-actions .ghost-button {
    width: 100%;
  }

  .location-map-copy {
    padding: 30px 22px;
  }
}


/* =========================================================
   VERSION 7.7.1 — MOBILE FIX
   ========================================================= */

/* Öffentliche Archivkarten dürfen auf kleinen Displays nicht als riesige
   leere Fläche erscheinen. */
@media (max-width: 580px) {
  .archive-preview {
    overflow: visible;
  }

  .year-grid {
    gap: 12px;
  }

  .year-card {
    min-height: 0;
    padding: 22px 20px;
  }

  .year-card-top {
    align-items: center;
  }

  .year-card-top span {
    font-size: 3.7rem;
  }

  .event-pills {
    margin: 18px 0;
  }

  .event-pills span {
    font-size: .7rem;
  }

  .year-card > a {
    padding-top: 16px;
  }

  /* Falls eine alte oder leere Hero-/Coverfläche im öffentlichen Archiv
     noch im Markup vorhanden ist, wird sie mobil kompakt gehalten. */
  .archive-preview .media-event-cover,
  .archive-preview .library-card-cover,
  .archive-preview .event-placeholder,
  .archive-preview .event-poster-fallback {
    min-height: 0 !important;
    height: 230px !important;
  }
}

/* Login-Seite auf iPhones deutlich kompakter und ohne abgeschnittene Überschrift. */
@media (max-width: 700px) {
  .login-body {
    display: block;
    min-height: 100svh;
    padding:
      max(16px, env(safe-area-inset-top))
      12px
      max(24px, env(safe-area-inset-bottom));
  }

  .login-shell {
    width: 100%;
    display: block;
  }

  .login-logo {
    display: block;
    width: max-content;
    margin: 0 auto 14px;
  }

  .login-logo img {
    width: 110px;
    max-width: 32vw;
    margin: 0 auto;
  }

  .login-card {
    width: 100%;
    padding: 28px 20px 26px;
    border-radius: 24px;
    overflow: hidden;
  }

  .login-card .eyebrow {
    max-width: calc(100% - 52px);
    font-size: .62rem;
    line-height: 1.45;
    letter-spacing: .17em;
  }

  .login-card h1 {
    max-width: 100%;
    margin: 20px 0 22px;
    font-size: clamp(3.15rem, 15vw, 4.6rem);
    line-height: .82;
    letter-spacing: -.04em;
    overflow-wrap: anywhere;
  }

  .login-card > p {
    font-size: .92rem;
    line-height: 1.65;
  }

  .lock-orbit {
    top: 22px;
    right: 18px;
    width: 46px;
    height: 46px;
    font-size: 1rem;
  }

  .login-card form {
    margin-top: 28px;
  }

  .password-field input {
    min-width: 0;
    height: 56px;
    padding: 0 14px;
    font-size: 1rem;
  }

  .password-field button {
    flex: 0 0 52px;
    width: 52px;
  }

  .login-submit {
    min-height: 58px;
    padding: 0 18px;
    font-size: .86rem;
  }

  .login-card > small {
    margin-top: 18px;
    font-size: .78rem;
  }
}

/* Extra-kleine Geräte */
@media (max-width: 390px) {
  .login-card h1 {
    font-size: 3rem;
  }

  .login-card {
    padding-left: 17px;
    padding-right: 17px;
  }
}


/* =========================================================
   VERSION 7.7.2 — MOBILE REBUILD
   ========================================================= */

html, body {
  max-width: 100%;
}

body {
  overflow-x: hidden;
}

.mobile-archive-list,
.login-title-mobile {
  display: none;
}

@media (max-width: 700px) {
  .archive-preview .year-grid {
    display: none !important;
  }

  .mobile-archive-list {
    display: grid;
    gap: 10px;
  }

  .mobile-archive-list > a {
    min-width: 0;
    padding: 18px;
    display: grid;
    gap: 10px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  }

  .mobile-archive-list > a > div {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
  }

  .mobile-archive-list strong {
    color: var(--cyan);
    font-family: "Barlow Condensed";
    font-size: 3.5rem;
    line-height: .8;
  }

  .mobile-archive-list span,
  .mobile-archive-list small {
    color: var(--muted);
  }

  .mobile-archive-list span {
    font-size: .68rem;
  }

  .mobile-archive-list small {
    line-height: 1.55;
    font-size: .75rem;
  }

  .mobile-archive-list em {
    padding-top: 12px;
    border-top: 1px solid var(--line);
    color: #fff;
    font-size: .74rem;
    font-style: normal;
    font-weight: 700;
  }

  .login-body {
    min-height: 100svh;
    padding: 12px;
    display: block;
  }

  .login-shell {
    width: 100%;
    max-width: 100%;
    display: block;
    margin: 0;
  }

  .login-logo {
    display: block;
    width: 96px;
    margin: 0 auto 12px;
  }

  .login-logo img {
    width: 96px;
    max-width: 96px;
    margin: 0 auto;
  }

  .login-card {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 26px 18px 24px;
    border-radius: 22px;
    overflow: visible;
  }

  .login-title-desktop {
    display: none !important;
  }

  .login-title-mobile {
    display: grid;
    gap: 0;
    width: 100%;
    max-width: 100%;
    margin: 22px 0 24px;
    font-family: "Barlow Condensed", sans-serif;
    font-size: clamp(2.75rem, 12.5vw, 4rem);
    line-height: .83;
    letter-spacing: -.035em;
    text-transform: uppercase;
  }

  .login-title-mobile span,
  .login-title-mobile em {
    display: block;
    max-width: 100%;
    white-space: normal;
  }

  .login-title-mobile em {
    color: var(--cyan);
    font-style: normal;
  }

  .login-card .eyebrow {
    width: calc(100% - 58px);
    max-width: calc(100% - 58px);
    font-size: .58rem;
    line-height: 1.4;
    letter-spacing: .14em;
  }

  .lock-orbit {
    top: 18px;
    right: 16px;
    width: 44px;
    height: 44px;
  }

  .login-card > p {
    margin: 0;
    font-size: .9rem;
    line-height: 1.65;
  }

  .login-card form {
    margin-top: 26px;
  }

  .password-field {
    width: 100%;
  }

  .password-field input {
    width: 100%;
    min-width: 0;
    height: 54px;
    padding: 0 13px;
    font-size: .96rem;
  }

  .password-field button {
    flex: 0 0 48px;
    width: 48px;
  }

  .login-submit {
    width: 100%;
    min-height: 56px;
    padding: 0 14px;
    gap: 10px;
    font-size: .82rem;
  }

  .login-card > small {
    display: block;
    margin-top: 17px;
    font-size: .74rem;
  }
}

@media (max-width: 380px) {
  .login-title-mobile {
    font-size: 2.65rem;
  }

  .login-card {
    padding-left: 15px;
    padding-right: 15px;
  }
}