/* juergendirrigl.de v2: Gestaltungssystem der ganzen Seite */
@font-face{font-family:"Newsreader";src:url("../fonts/newsreader-latin-opsz-normal.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:block}
@font-face{font-family:"Newsreader";src:url("../fonts/newsreader-latin-opsz-italic.woff2") format("woff2");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-grotesk-latin-300-normal.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-grotesk-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Hanken";src:url("../fonts/hanken-grotesk-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
/* Vazirmatn nur für arabische Schrift (Persisch, Arabisch); lädt nur, wenn solche Zeichen vorkommen */
@font-face{font-family:"Vazirmatn";src:url("../fonts/vazirmatn-arabic-300-normal.woff2") format("woff2");font-weight:300;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"Vazirmatn";src:url("../fonts/vazirmatn-arabic-400-normal.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}
@font-face{font-family:"Vazirmatn";src:url("../fonts/vazirmatn-arabic-500-normal.woff2") format("woff2");font-weight:500 800;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}

:root{
  --paper:#F1ECE3;
  --paper-2:#E8E1D5;
  --ink:#15120F;
  --ink-70:rgba(21,18,15,.72);
  --ink-45:rgba(21,18,15,.45);
  --ink-12:rgba(21,18,15,.12);
  --ocker:#CB934A;
  --serif:"Newsreader","Vazirmatn",Georgia,"Times New Roman",serif;
  --mono:"Plex Mono","Vazirmatn",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --sans:"Hanken","Vazirmatn",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --gutter:clamp(20px,6.5vw,120px);
  --ease-out:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}
::selection{background:var(--ocker);color:var(--paper)}

/* ===== Hero: Erdkugel mit Kameraflug (E-0008) ===== */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:radial-gradient(120% 90% at 72% 60%,#1d1813 0%,#0e0c0a 55%,#080706 100%);color:var(--paper)}
.hero #globe{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;opacity:0;transition:opacity 1.6s var(--ease-out);will-change:transform,opacity}
.globe-on .hero #globe{opacity:1}
/* Ländernamen an der Route (2.8.0): fein, zurückhaltend, bleiben nach dem Flug stehen */
.globe-labels{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.globe-label{position:absolute;left:0;top:0;line-height:13px;white-space:pre;font-family:var(--mono);font-size:10px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:rgba(241,236,227,.72);text-shadow:0 0 8px rgba(8,7,6,.9);opacity:0;transition:opacity 1.4s var(--ease-out);will-change:transform}
.globe-label.is-on{opacity:1}
/* Land unter dem Lichtpunkt: größer und in Ocker (2.8.2) */
.globe-label{--hl:0;color:color-mix(in srgb,var(--ocker) calc(var(--hl) * 100%),rgba(241,236,227,.72));text-shadow:0 0 8px rgba(8,7,6,.9),0 0 calc(var(--hl) * 14px) rgba(203,147,74,calc(var(--hl) * .6))}
.globe-label.is-on.is-back{opacity:0}
html[dir="rtl"] .globe-label{letter-spacing:0;font-size:11px}
@media (max-width:899px){.globe-label{font-size:8.5px;letter-spacing:.1em;line-height:13px;color:#fff;text-shadow:0 0 6px rgba(8,7,6,.95),0 0 2px rgba(8,7,6,.9)}html[dir="rtl"] .globe-label{font-size:10px}}
.hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(8,7,6,.7) 0,rgba(8,7,6,0) 110px),linear-gradient(90deg,rgba(8,7,6,.82) 0%,rgba(8,7,6,.45) 34%,rgba(8,7,6,0) 58%),linear-gradient(0deg,rgba(8,7,6,.55) 0%,rgba(8,7,6,0) 22%)}

.hero-bar{position:absolute;z-index:3;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px var(--gutter) 0}
.hero-bar::after{content:"";position:absolute;left:var(--gutter);right:var(--gutter);bottom:-14px;height:1px;background:rgba(241,236,227,.14);transform-origin:left;transform:scaleX(0);animation:rule 1.6s var(--ease-out) .25s forwards}
.topics{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;padding:0;list-style:none;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(241,236,227,.62)}
.topics li{opacity:0;transform:translateY(6px);animation:rise .9s var(--ease-out) forwards}
.topics li:nth-child(1){animation-delay:.30s;color:var(--paper);font-weight:500}
.topics li:nth-child(1)::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ocker);margin-right:10px;vertical-align:1px;box-shadow:0 0 12px rgba(203,147,74,.8)}
.topics li:nth-child(2){animation-delay:.38s}
.topics li:nth-child(3){animation-delay:.46s}
.topics li:nth-child(4){animation-delay:.54s}
.topics li:nth-child(5){animation-delay:.62s}
.topics .t-short{display:none}
.bar-mail{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--paper);padding:9px 16px;border:1px solid rgba(241,236,227,.4);border-radius:999px;white-space:nowrap;opacity:0;animation:rise .9s var(--ease-out) .7s forwards;transition:background .35s var(--ease-out),color .35s var(--ease-out),border-color .35s}
.bar-mail:hover,.bar-mail:focus-visible{background:var(--ocker);color:var(--ink);border-color:var(--ocker);outline:none}

.hero-copy{position:absolute;z-index:2;left:var(--gutter);top:50%;transform:translateY(-46%);max-width:min(46vw,760px);pointer-events:none}
.hero-title{margin:0;font-weight:400}
.hero-name{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(64px,9.4vw,168px);line-height:.88;letter-spacing:-.03em;color:var(--paper)}
.hero-name .nl{display:block;opacity:0;transform:translateY(.25em);animation:rise 1.1s var(--ease-out) forwards}
.hero-name .nl:nth-child(2){animation-delay:.12s;padding-left:.42em}
.subtitle{display:block;margin-top:clamp(18px,2.2vw,32px);font-family:var(--sans);font-weight:300;font-size:clamp(15px,1.3vw,21px);letter-spacing:.01em;color:rgba(241,236,227,.72);opacity:0;transform:translateY(8px);animation:rise 1s var(--ease-out) .45s forwards}

.scroll-cue{position:absolute;z-index:3;left:var(--gutter);bottom:28px;width:1px;height:64px;background:rgba(241,236,227,.16);overflow:hidden}
.scroll-cue i{position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--ocker);animation:drip 2.6s cubic-bezier(.6,0,.2,1) infinite}

@keyframes rise{to{opacity:1;transform:none}}
@keyframes rule{to{transform:scaleX(1)}}
@keyframes drip{0%{top:-40%}70%,100%{top:100%}}

/* Sprachwahl unter E-Mail (2.8.0): DE, EN, FR als Kürzel, Persisch und Arabisch als Wort, keine Flaggen */
.bar-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.lang{display:flex;gap:6px;align-items:center;opacity:0;animation:rise .9s var(--ease-out) .8s forwards}
.lang a{display:inline-flex;align-items:center;justify-content:center;height:24px;min-width:32px;padding:0 7px;border:1px solid rgba(241,236,227,.28);border-radius:999px;color:var(--paper);text-decoration:none;font-family:"Vazirmatn",var(--sans);font-size:12px;line-height:1;letter-spacing:0;transition:border-color .3s,background .3s,color .3s}
.lang .lang-de,.lang .lang-en,.lang .lang-fr{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;padding-top:1px}
.lang a:hover,.lang a:focus-visible{border-color:var(--ocker);outline:none}
.lang a[aria-current="true"]{border-color:var(--ocker);background:rgba(203,147,74,.16)}
.lang-word{padding-bottom:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Rechts nach links (Persisch, Arabisch, 2.8.0): Spiegelung der fest nach links gesetzten Teile */
html[dir="rtl"] body *{letter-spacing:0!important}
html[dir="rtl"] .sec-title .num{direction:ltr;unicode-bidi:isolate;margin-right:0;margin-left:.5em}
html[dir="rtl"] .topics li:nth-child(1)::before{margin-right:0;margin-left:10px}
html[dir="rtl"] .portrait::after{left:auto;right:-14px;border-left:0;border-right:1px solid var(--ocker)}
html[dir="rtl"] .portrait{justify-self:start}
html[dir="rtl"] .st-list::before{left:auto;right:calc(41.66% - 1px)}
html[dir="rtl"] .station::before{left:auto;right:calc(41.66% - 5px)}
html[dir="rtl"] .st-head{padding-right:0;padding-left:clamp(16px,2vw,40px)}
html[dir="rtl"] .st-body ul{padding-left:0;padding-right:1.1em}
html[dir="rtl"] .scroll-cue{left:auto;right:var(--gutter)}
html[dir="rtl"] .dropcap::first-letter{float:right;padding:.06em 0 0 .1em}
html[dir="rtl"] .hero-name{text-align:right}
html[dir="rtl"] .bar-right{align-items:flex-start}
html[dir="rtl"] .pub-title{direction:ltr;text-align:right;unicode-bidi:plaintext}

/* Desktop (2.7.1): Kugel links, Name rechts; das Handy bleibt unverändert */
@media (min-width:900px){
  .hero{background:radial-gradient(120% 90% at 28% 60%,#1d1813 0%,#0e0c0a 55%,#080706 100%)}
  .hero-shade{background:linear-gradient(180deg,rgba(8,7,6,.7) 0,rgba(8,7,6,0) 110px),linear-gradient(270deg,rgba(8,7,6,.82) 0%,rgba(8,7,6,.45) 34%,rgba(8,7,6,0) 58%),linear-gradient(0deg,rgba(8,7,6,.55) 0%,rgba(8,7,6,0) 22%)}
  .hero-copy{left:auto;right:var(--gutter);text-align:right}
  .hero-name .nl:nth-child(2){padding-left:0;padding-right:.42em}
  html[dir="rtl"] .station::before{right:calc(41.66% - 4px)}
}

@media (max-width:899px){
  .hero{background:radial-gradient(140% 80% at 50% 74%,#1d1813 0%,#0e0c0a 55%,#080706 100%)}
  .hero-bar{padding-top:18px;align-items:flex-start}
  .topics{gap:5px 14px;font-size:9px;letter-spacing:.12em;max-width:calc(100% - 96px)}
  .topics .t-long{display:none}
  .topics .t-short{display:inline}
  .bar-mail{font-size:9.5px;padding:7px 12px}
  .hero-shade{background:linear-gradient(180deg,rgba(8,7,6,.85) 0%,rgba(8,7,6,.55) 30%,rgba(8,7,6,0) 48%),linear-gradient(0deg,rgba(8,7,6,.5) 0%,rgba(8,7,6,0) 18%)}
  .hero-copy{top:clamp(150px,calc(17vh + 32px),202px);transform:none;max-width:none;right:var(--gutter)}
  .hero-name{font-size:clamp(56px,19vw,120px)}
  .subtitle{font-size:15px}
}
@media (prefers-reduced-motion:reduce){
  .topics li,.bar-mail,.hero-name .nl,.subtitle{animation:none;opacity:1;transform:none}
  .hero-bar::after{animation:none;transform:none}
  .scroll-cue i{animation:none;top:30%}
}

/* ===================================================================
   Seite unter dem Hero
   =================================================================== */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.wrap{width:100%;max-width:1360px;margin:0 auto;padding:0 var(--gutter)}
main{position:relative;z-index:1}
.sec{position:relative;padding:clamp(96px,13vw,190px) 0}
.sec-title{margin:0 0 clamp(40px,6vw,96px);font-family:var(--serif);font-weight:400;font-size:clamp(40px,6.2vw,104px);line-height:.98;letter-spacing:-.025em;color:var(--ink);max-width:16ch}
.sec-title .num{display:inline-block;font-family:var(--mono);font-size:.2em;letter-spacing:.08em;color:var(--ocker);vertical-align:top;transform:translateY(.55em);margin-right:.5em}
.sec-title.light{color:var(--paper)}
.sec-title .ttl{display:inline}
a{text-decoration-thickness:1px;text-underline-offset:.22em}

/* Fortschrittslinie */
.progress{position:fixed;z-index:50;left:0;top:0;height:2px;width:100%;background:var(--ocker);transform-origin:left;transform:scaleX(0);pointer-events:none}

/* Einblendungen (nur mit JavaScript) */
.js .reveal{opacity:0;transform:translateY(28px)}
.js .reveal-img{clip-path:inset(100% 0 0 0)}

/* ---------- Einleitung ---------- */
.intro{padding:clamp(80px,11vw,170px) 0 clamp(40px,6vw,90px)}
.intro-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,6vw,110px);align-items:start}
.portrait{margin:0;border-radius:16px;position:sticky;top:110px;max-width:300px;justify-self:end;width:100%}
/* Porträt: immer in den Farben der Vorlage, ohne Filter und ohne Effekt (2.6.5) */
.portrait img{border-radius:16px;display:block;width:100%;height:auto;aspect-ratio:600/587;object-fit:cover}
.portrait::after{content:"";position:absolute;left:-14px;top:-14px;width:44px;height:44px;border-left:1px solid var(--ocker);border-top:1px solid var(--ocker)}
.lead-first{margin:0 0 1.1em;font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.55vw,40px);line-height:1.18;letter-spacing:-.012em;color:var(--ink);text-wrap:pretty}
@media (max-width:899px){.lead-first{font-size:clamp(20px,5.6vw,24px)}}
.lead-more{margin:0 0 1.05em;max-width:62ch;font-size:clamp(17px,1.3vw,20px);line-height:1.65;font-weight:300;color:var(--ink-70)}
.lead-more:nth-of-type(2){font-weight:400;color:var(--ink)}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(28px,3vw,44px)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:1px solid var(--ink);transition:background .4s var(--ease-out),color .4s var(--ease-out),transform .4s var(--ease-out)}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover,.btn-ink:focus-visible{background:var(--ocker);border-color:var(--ocker);color:var(--ink)}
.btn-line{background:transparent;color:var(--ink)}
.btn-line:hover,.btn-line:focus-visible{background:var(--ink);color:var(--paper)}

/* ---------- 1) Kurzbeschreibung ---------- */
.kurz{border-top:1px solid var(--ink-12)}
.kurz-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px)}
.kurz-cols p{margin:0;font-size:clamp(16px,1.15vw,18.5px);line-height:1.7;color:var(--ink-70)}
.kurz-cols p.dropcap{color:var(--ink)}
.dropcap::first-letter{float:left;font-family:var(--serif);font-size:5.2em;line-height:.8;padding:.06em .1em 0 0;color:var(--ocker)}

/* ---------- 2) Datenblatt ---------- */
.daten{padding-top:0}
.pass{position:relative;background:var(--ink);color:var(--paper);border-radius:6px;padding:clamp(28px,4vw,64px);overflow:hidden}
.pass::before{content:"";position:absolute;inset:0;background:radial-gradient(900px 400px at 85% -10%,rgba(203,147,74,.20),transparent 60%);pointer-events:none}
.pass::after{content:"";position:absolute;right:clamp(20px,3vw,48px);top:clamp(20px,3vw,48px);width:84px;height:84px;border:1px solid rgba(203,147,74,.55);border-radius:50%;box-shadow:inset 0 0 0 7px rgba(203,147,74,.08)}
.pass-grid{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.field{padding:22px 24px 26px 0;border-top:1px solid rgba(241,236,227,.14)}
.field:nth-child(-n+3){border-top:0}
.field .label{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ocker);margin-bottom:10px}
.field .value{font-family:var(--serif);font-size:clamp(19px,1.6vw,26px);line-height:1.25;letter-spacing:-.005em}

/* ---------- 3) Meilensteine (ohne Kugel, E-0008) ---------- */
.stationen{background:var(--ink);color:var(--paper)}
.stationen .sec-title{margin-bottom:clamp(40px,6vw,96px)}
.st-list{list-style:none;margin:0;padding:0;position:relative}
.st-list::before{content:"";position:absolute;left:calc(41.66% - 1px);top:0;bottom:0;width:1px;background:linear-gradient(180deg,rgba(203,147,74,0),rgba(203,147,74,.45) 8%,rgba(203,147,74,.45) 92%,rgba(203,147,74,0))}
.station{display:grid;grid-template-columns:5fr 7fr;column-gap:clamp(40px,6vw,110px);padding:clamp(40px,6vw,90px) 0;border-top:1px solid rgba(241,236,227,.08);position:relative}
.station:first-child{border-top:0}
.station::before{content:"";position:absolute;left:calc(41.66% - 5px);top:clamp(48px,6.6vw,98px);width:9px;height:9px;border-radius:50%;background:var(--ocker);box-shadow:0 0 0 5px rgba(203,147,74,.14),0 0 18px rgba(203,147,74,.6)}
.st-head{grid-column:1;grid-row:1 / span 2;padding-right:clamp(16px,2vw,40px);align-self:start;position:sticky;top:96px}
.st-fig{grid-column:2}
.st-body{grid-column:2}
.st-year{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ocker);margin-bottom:14px}
.st-title{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.6vw,42px);line-height:1.1;letter-spacing:-.015em}
.st-fig{isolation:isolate;margin:0 0 26px;max-width:420px;overflow:hidden;border-radius:16px;background:#000}
.st-img{display:block;width:100%;height:auto;filter:grayscale(1) contrast(1.05);transform:scale(1.04);transition:filter 1.2s var(--ease-out),transform 1.6s var(--ease-out)}
.station:hover .st-img{filter:grayscale(.1);transform:scale(1)}
/* Vogtlandstreicher-Logo bei „Regionale Phase“ immer farbig, ohne Animation (E-0014) */
.st-img[src$="777.png"]{filter:none;transform:none;transition:none}
.st-body p,.st-body li{font-size:clamp(16px,1.12vw,18px);line-height:1.7;color:rgba(241,236,227,.78);font-weight:300}
.st-body p{margin:0 0 1em}
.st-body strong{color:var(--paper);font-weight:500}
.st-body ul{margin:0 0 1em;padding-left:1.1em}
.st-body li::marker{color:var(--ocker)}
.st-body a,.stationen a{color:var(--paper);text-decoration-color:var(--ocker)}
.st-body a:hover{color:var(--ocker)}
.linkline{font-family:var(--mono);font-size:13px!important;letter-spacing:.04em}

/* ---------- 4) 5) 6) ---------- */
.kontakt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(32px,5vw,80px)}
.kontakt .sec-title{font-size:clamp(28px,2.6vw,40px);margin-bottom:28px;max-width:none}
.kontakt .sec-title .num{font-size:.36em;transform:translateY(.3em)}
.k-body p{margin:0 0 1em;font-size:16.5px;line-height:1.65;color:var(--ink-70)}
.k-body strong{color:var(--ink);font-weight:500}
.k-body a{color:var(--ink);text-decoration-color:var(--ocker);overflow-wrap:anywhere}
.k-body a:hover{color:var(--ocker)}

/* Buchstabenwolke über 4) 5) 6) (E-0014, js/cloud.js) */
.kontakt.cloud{padding-top:0;padding-bottom:0}
.cloud-stage{position:relative;padding-top:calc(var(--cloud-h,30vh) + clamp(24px,4vh,56px));padding-bottom:clamp(64px,10vh,140px)}
.kontakt.cloud.pin .cloud-stage{position:sticky;top:0;height:100vh;height:100lvh;box-sizing:border-box}
.cloud-ready .k-col h2,.cloud-ready .k-col p{opacity:0}
.cloud-ready .k-col .landed{opacity:1}
#cloud-gl{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;display:none}
.kontakt.cloud .cloud-stage{z-index:2}

/* ---------- 7) Publikationen ---------- */
/* 7) eigener Hintergrund im feinen Ocker der Wolke, über die ganze Breite (2.6.2) */
.pubs{background:#E3CBA8}
.pubs .sec-title .num{color:#7A5222}
.pubs .pub-fig{background:#D8BC93}
.pubs .pub-title{background-image:linear-gradient(var(--ink),var(--ink))}
.pub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,64px) clamp(20px,2.4vw,36px)}
.pub{display:block;text-decoration:none;color:var(--ink)}
.pub-fig{isolation:isolate;margin:0 0 18px;aspect-ratio:3/2;overflow:hidden;border-radius:16px;background:var(--paper-2);position:relative}
.pub-fig img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.9) contrast(1.05) sepia(.08);transform:scale(1.04);transition:filter .9s var(--ease-out),transform 1.2s var(--ease-out)}
.pub-fig::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(21,18,15,.35));opacity:.0;transition:opacity .6s}
.pub:hover .pub-fig img,.pub:focus-visible .pub-fig img{filter:none;transform:scale(1)}
/* Handy: Bild wird farbig, sobald der Artikel beim Scrollen in die Bildschirmmitte kommt (E-0013) */
.pub.in-view .pub-fig img{filter:none;transform:scale(1)}
.pub-title{display:block;font-family:var(--serif);font-size:clamp(19px,1.45vw,23px);line-height:1.25;letter-spacing:-.005em;background:linear-gradient(var(--ocker),var(--ocker)) 0 100%/0 1px no-repeat;transition:background-size .6s var(--ease-out)}
.pub:hover .pub-title,.pub:focus-visible .pub-title{background-size:100% 1px}
.pub-grid{grid-auto-flow:dense}
.pub.wide{grid-column:span 2}
.pub.wide .pub-fig{aspect-ratio:16/8}
.pub.wide .pub-title{font-size:clamp(24px,2.2vw,34px);max-width:30ch}

/* ---------- Fuß ---------- */
.foot{background:var(--ink);color:var(--paper);padding:clamp(80px,10vw,150px) 0 48px;overflow:hidden}
.foot-name{font-family:var(--serif);font-size:clamp(56px,12vw,210px);line-height:.9;letter-spacing:-.035em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(241,236,227,.45)}
.foot-links{display:flex;flex-wrap:wrap;gap:16px 40px;margin-top:40px;font-family:var(--mono);font-size:13px;letter-spacing:.08em}
.foot-links a{color:var(--paper);text-decoration-color:var(--ocker)}
.foot-links a:hover{color:var(--ocker)}

/* ---------- Impressum ---------- */
.legal-top{padding:28px 0;border-bottom:1px solid var(--ink-12)}
.legal-top a{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-decoration-color:var(--ocker)}
.legal{padding:clamp(56px,9vw,120px) 0 clamp(72px,10vw,140px)}
.legal .sec-title{font-size:clamp(40px,6vw,88px);margin-bottom:clamp(32px,5vw,64px)}
.legal h2{margin:2.2em 0 .6em;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ocker)}
.legal p{margin:0 0 1em;max-width:60ch;font-size:17px;line-height:1.7;color:var(--ink-70)}
.legal strong{color:var(--ink);font-weight:500}
.legal a{color:var(--ink);text-decoration-color:var(--ocker)}
.legal a:hover{color:var(--ocker)}

/* ---------- Bildschirmgrößen ---------- */
@media (max-width:1100px){
  .kurz-cols{grid-template-columns:1fr 1fr}
  .pass-grid{grid-template-columns:1fr 1fr}
  .field:nth-child(3){border-top:1px solid rgba(241,236,227,.14)}
  .pub-grid{grid-template-columns:1fr 1fr}
  .kontakt-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:899px){
  /* Handy: Sprachwahl als eigene Zeile unter den Themen, rechtsbündig; Themen behalten ihre Breite */
  .hero-bar{flex-wrap:wrap}
  .bar-right{display:contents}
  .lang{order:3;flex-basis:100%;justify-content:flex-end;margin-top:12px}
  .lang a{height:22px;min-width:28px;padding:0 6px;font-size:11px}
  .lang .lang-de,.lang .lang-en,.lang .lang-fr{font-size:9.5px}
  html[dir="rtl"] .st-list::before{right:5px}
  html[dir="rtl"] .station{padding:36px 32px 36px 0}
  html[dir="rtl"] .station::before{right:1px}
  html[dir="rtl"] .portrait{justify-self:center}
  .intro-grid{grid-template-columns:1fr}
  .portrait{position:relative;top:0;justify-self:center;max-width:200px}
  .kurz-cols{grid-template-columns:1fr}
  .pass-grid{grid-template-columns:1fr}
  .field{border-top:1px solid rgba(241,236,227,.14)!important;padding-right:0}
  .field:first-child{border-top:0!important}
  .pass::after{width:56px;height:56px}
  .st-list::before{left:5px}
  .station{grid-template-columns:1fr;padding:36px 0 36px 32px;border-top:0}
  .station::before{left:1px;top:42px}
  .st-head{grid-row:auto;position:static;padding-right:0;margin-bottom:22px}
  .st-fig,.st-body{grid-column:1}
  .kontakt-grid{grid-template-columns:1fr}
  .pub-grid{grid-template-columns:1fr}
  .pub.wide{grid-column:auto}
  .pub.wide .pub-fig{aspect-ratio:3/2}
  .pub.wide .pub-title{font-size:clamp(20px,5.4vw,26px)}
  .foot-name{white-space:normal}
}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none}
  .js .reveal-img{clip-path:none}
  .st-img{transform:none}
}