/* Fotografie overview landing pages — homepage-style hero + six clean topic sections. */
:root{
  --bg:#020306;--bg-2:#07090d;--panel:#0c0f15;
  --paper:#f3f5ef;--paper-2:#e9ebe4;
  --fg:#f3f5ef;--ink:#090b10;--ink-2:#1a1d24;
  --muted:rgba(243,245,239,.66);--muted-l:rgba(9,11,16,.66);
  --quiet:rgba(243,245,239,.42);--quiet-l:rgba(9,11,16,.42);
  --line:rgba(243,245,239,.13);--line-l:rgba(9,11,16,.13);
  --accent:#c8ccc6;--accent-2:#7a8a86;--chrome:#dce2df;--steel:#dce2df;--bronze:#b8784b;
  --font:'Inter Tight','Neue Haas Grotesk Display','Söhne','Avenir Next','Helvetica Neue',Arial,system-ui,sans-serif;
  --serif:'Iowan Old Style','Charter',Georgia,serif;--mono:'JetBrains Mono','IBM Plex Mono','SFMono-Regular',ui-monospace,Menlo,monospace;
  --ease:cubic-bezier(.23,1,.32,1);--maxw:1540px;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth;overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}a{color:inherit;text-decoration:none}p,h1,h2,h3{margin:0}::selection{background:var(--accent);color:var(--ink)}
body:before{content:"";position:fixed;inset:-20%;z-index:80;pointer-events:none;opacity:.05;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");mix-blend-mode:screen;animation:overviewGrain 2s steps(2) infinite}
@keyframes overviewGrain{50%{transform:translate3d(1.4%,-1%,0)}}
main{position:relative;z-index:2}.section-inner{max-width:var(--maxw);margin:0 auto;padding:clamp(78px,10vw,150px) clamp(22px,5vw,76px)}
.kicker{font:10px var(--mono);letter-spacing:.26em;text-transform:uppercase;display:inline-flex;align-items:center;gap:12px;color:var(--accent)}.kicker:before{content:"";width:24px;height:1px;background:currentColor}.kicker.dark{color:var(--accent-2)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 22px;border:1px solid currentColor;background:transparent;font:10px var(--mono);letter-spacing:.2em;text-transform:uppercase;transition:.3s var(--ease)}.btn:hover{transform:translateY(-2px)}.btn.dark{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* Overview hero shared by fotografie.html and the regional Fotografie hubs. */
.ovh{position:relative;height:100svh;min-height:600px;max-height:100svh;display:grid;align-items:end;padding:clamp(120px,14vw,180px) clamp(22px,5vw,76px) clamp(64px,8vw,112px);overflow:hidden;isolation:isolate;background:#05070b;color:#f3f5ef}
.ovh__photo{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;object-fit:cover;background-size:cover;background-position:center;transform:scale(1.06);will-change:transform;animation:ovhKB 28s ease-out forwards}
@keyframes ovhKB{0%{transform:scale(1.12) translate3d(-1.4%,1.2%,0)}100%{transform:scale(1.03) translate3d(.8%,-.4%,0)}}
.ovh::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(2,3,6,.42) 0%,rgba(2,3,6,0) 22%,rgba(2,3,6,0) 52%,rgba(2,3,6,.62) 84%,rgba(2,3,6,.86) 100%)}
.ovh::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(95% 60% at 50% 100%,rgba(2,3,6,.48) 0%,rgba(2,3,6,0) 60%)}
.ovh__aperture{position:absolute;z-index:2;left:-15vw;right:-15vw;top:42%;height:96px;pointer-events:none;opacity:.28;transform:rotate(-4deg) translateX(-18vw);background:linear-gradient(90deg,transparent 0%,rgba(243,245,239,.08) 36%,rgba(220,226,223,.44) 49%,rgba(220,226,223,.16) 55%,rgba(42,78,118,.16) 62%,transparent 82%);filter:blur(.2px);-webkit-mask-image:linear-gradient(180deg,transparent,black 44%,black 56%,transparent);mask-image:linear-gradient(180deg,transparent,black 44%,black 56%,transparent);animation:ovhAperture 11s cubic-bezier(.23,1,.32,1) infinite}
@keyframes ovhAperture{0%,10%{transform:rotate(-4deg) translateX(-30vw);opacity:0}28%{opacity:.42}58%{transform:rotate(-4deg) translateX(22vw);opacity:.24}100%{transform:rotate(-4deg) translateX(30vw);opacity:0}}
.ovh__glow{position:absolute;inset:-30% -18%;z-index:2;pointer-events:none;background:radial-gradient(circle at 22% 28%,rgba(220,226,223,.07),transparent 30%),radial-gradient(circle at 84% 70%,rgba(42,78,118,.16),transparent 36%);filter:blur(38px);opacity:.55;animation:ovhGlow 18s cubic-bezier(.23,1,.32,1) infinite alternate}
@keyframes ovhGlow{0%{transform:translate3d(-1.6%,1.2%,0) scale(1)}100%{transform:translate3d(2.2%,-1.2%,0) scale(1.04)}}
.ovh__grid{position:relative;z-index:3;width:100%;max-width:1540px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(20px,2.4vw,34px)}
.ovh__kicker{font:11px 'JetBrains Mono','IBM Plex Mono','SFMono-Regular',ui-monospace,Menlo,monospace;letter-spacing:.34em;text-transform:uppercase;color:rgba(243,245,239,.62);margin:0;display:flex;align-items:center;gap:14px}
.ovh__kicker::before{content:"";width:38px;height:1px;background:currentColor;opacity:.55}
.ovh__title{position:relative;margin:0;font-family:'Neue Haas Grotesk Display','Söhne','Avenir Next','Helvetica Neue',Arial,system-ui,sans-serif;font-size:clamp(56px,10.6vw,168px);line-height:.86;letter-spacing:-.058em;text-transform:uppercase;font-weight:900;color:#f6f7f2;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 76%,rgba(0,0,0,.55) 100%);mask-image:linear-gradient(180deg,#000 0%,#000 76%,rgba(0,0,0,.55) 100%);text-shadow:0 24px 80px rgba(0,0,0,.55),0 2px 18px rgba(0,0,0,.55)}
.ovh__title .line{display:block;overflow:hidden;padding:.04em 0 .06em}
.ovh__title .word{display:inline-block;transform:translate3d(-110%,0,0);opacity:0;will-change:transform,opacity;transition:transform 1.05s cubic-bezier(.18,.78,.24,1),opacity .82s cubic-bezier(.23,1,.32,1)}
.ovh__title.is-in .word{transform:translate3d(0,0,0);opacity:1}
.ovh__title .line:nth-child(2) .word{transition-delay:.10s;color:rgba(243,245,239,.86)}
.ovh__lead{max-width:62ch;margin:0;font-size:clamp(16px,1.3vw,21px);line-height:1.55;color:rgba(243,245,239,.78);text-wrap:pretty;opacity:0;transform:translateY(14px);transition:opacity .9s cubic-bezier(.23,1,.32,1) .35s,transform .9s cubic-bezier(.23,1,.32,1) .35s}
.ovh.is-in .ovh__lead{opacity:1;transform:translateY(0)}
.ovh__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px;opacity:0;transform:translateY(14px);transition:opacity .9s cubic-bezier(.23,1,.32,1) .55s,transform .9s cubic-bezier(.23,1,.32,1) .55s}
.ovh.is-in .ovh__actions{opacity:1;transform:translateY(0)}
.ovh__btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:14px 22px;border:1px solid rgba(243,245,239,.42);font:11px 'JetBrains Mono','IBM Plex Mono',ui-monospace,Menlo,monospace;letter-spacing:.24em;text-transform:uppercase;color:#f3f5ef;background:transparent;transition:background .25s cubic-bezier(.23,1,.32,1),border-color .25s cubic-bezier(.23,1,.32,1),color .25s cubic-bezier(.23,1,.32,1)}
.ovh__btn:hover{background:rgba(243,245,239,.96);color:#0a0c11;border-color:rgba(243,245,239,.96)}
.ovh__btn--ghost{border-color:rgba(243,245,239,.22);color:rgba(243,245,239,.78)}
.ovh__btn--ghost:hover{background:transparent;color:#fff;border-color:rgba(243,245,239,.62)}

/* ===== Homepage hero adopted for the Fotografie overview ===== */
.hero{position:relative;height:100svh;min-height:600px;max-height:100svh;display:grid;align-items:end;padding:clamp(120px,14vw,180px) clamp(22px,5vw,76px) clamp(48px,7vw,96px);overflow:hidden;isolation:isolate;background:#05070b;cursor:none;color:#f3f5ef}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.hero:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(2,3,6,.32) 0%,rgba(2,3,6,0) 22%,rgba(2,3,6,0) 52%,rgba(2,3,6,.55) 86%,rgba(2,3,6,.78) 100%)}
.hero:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(95% 60% at 50% 100%,rgba(2,3,6,.42) 0%,rgba(2,3,6,0) 60%)}
.hero-aperture{position:absolute;z-index:2;left:-15vw;right:-15vw;top:42%;height:96px;pointer-events:none;opacity:.28;transform:rotate(-4deg) translateX(-18vw);background:linear-gradient(90deg,transparent 0%,rgba(243,245,239,.08) 36%,rgba(220,226,223,.44) 49%,rgba(220,226,223,.16) 55%,rgba(42,78,118,.16) 62%,transparent 82%);filter:blur(.2px);mask-image:linear-gradient(180deg,transparent,black 44%,black 56%,transparent);animation:heroAperture 11s var(--ease) infinite}
@keyframes heroAperture{0%,10%{transform:rotate(-4deg) translateX(-30vw);opacity:0}28%{opacity:.42}58%{transform:rotate(-4deg) translateX(22vw);opacity:.24}100%{transform:rotate(-4deg) translateX(30vw);opacity:0}}
.hero-glow{position:absolute;inset:-30% -18%;z-index:2;pointer-events:none;background:radial-gradient(circle at 22% 28%,rgba(220,226,223,.07),transparent 30%),radial-gradient(circle at 84% 70%,rgba(42,78,118,.16),transparent 36%);filter:blur(38px);opacity:.55;animation:heroGlow 18s var(--ease) infinite alternate}
@keyframes heroGlow{0%{transform:translate3d(-1.6%,1.2%,0) scale(1)}100%{transform:translate3d(2.2%,-1.2%,0) scale(1.04)}}
.hero-grid{position:relative;z-index:3;display:block;width:100%;max-width:var(--maxw);margin:0 auto}.hero-stage{position:relative;display:block}
.hero-title{position:relative;margin:0;font-size:clamp(56px,10.6vw,168px);line-height:.86;letter-spacing:-.058em;text-transform:uppercase;font-weight:900;color:#f6f7f2;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 76%,rgba(0,0,0,.55) 100%);mask-image:linear-gradient(180deg,#000 0%,#000 76%,rgba(0,0,0,.55) 100%);text-shadow:0 24px 80px rgba(0,0,0,.55),0 2px 18px rgba(0,0,0,.55)}
.hero-title .line{display:block;overflow:hidden;padding:.04em 0 .06em}.hero-title .word{display:inline-block;transform:translate3d(-110%,0,0);opacity:0;will-change:transform,opacity;transition:transform 1.05s cubic-bezier(.18,.78,.24,1),opacity .82s var(--ease)}.hero-title.is-in .word{transform:translate3d(0,0,0);opacity:1}.hero-title.is-out .word{transform:translate3d(112%,0,0);opacity:0;transition:transform .7s cubic-bezier(.62,.02,.86,.18),opacity .5s var(--ease)}.hero-title .line:nth-child(2) .word{transition-delay:.10s}.hero-title .line:nth-child(2){color:rgba(243,245,239,.86)}.hero-title.is-out .line:nth-child(1) .word{transition-delay:.06s}.hero-title.is-out .line:nth-child(2) .word{transition-delay:0s}.hero-title.no-anim .word{transition:none!important}
.hero-lead{max-width:46rem;margin-top:22px;color:rgba(243,245,239,.80);font-size:clamp(16px,1.28vw,21px);line-height:1.48;font-weight:520;letter-spacing:-.01em;text-wrap:pretty;text-shadow:0 14px 42px rgba(0,0,0,.50);transition:opacity .42s var(--ease),transform .42s var(--ease)}
.hero-lead.is-hidden{opacity:0;transform:translateY(10px);pointer-events:none}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.hero-actions .btn{min-height:50px;border-color:rgba(243,245,239,.52);color:#f3f5ef;background:rgba(2,3,6,.22);backdrop-filter:blur(14px)}
.hero-actions .btn.dark{background:#f3f5ef;color:#090b10;border-color:#f3f5ef}
.hero-actions .btn:hover{background:#f3f5ef;color:#090b10;border-color:#f3f5ef}
.hero-cursor{position:fixed;top:0;left:0;width:64px;height:64px;border:1px solid rgba(243,245,239,.78);border-radius:50%;pointer-events:none;z-index:60;transform:translate(-50%,-50%) scale(.6);mix-blend-mode:difference;transition:opacity .35s ease,transform .45s var(--ease),border-color .35s ease;opacity:0;will-change:transform}.hero-cursor:before,.hero-cursor:after{content:"";position:absolute;top:50%;left:50%;background:rgba(243,245,239,.85)}.hero-cursor:before{width:1px;height:14px;transform:translate(-50%,-50%)}.hero-cursor:after{width:14px;height:1px;transform:translate(-50%,-50%)}.hero-cursor .ring{position:absolute;inset:-10px;border:1px solid rgba(243,245,239,.20);border-radius:50%;transition:.35s var(--ease)}.hero-cursor.is-active{opacity:1;transform:translate(-50%,-50%) scale(1)}.hero-cursor.is-pressed{transform:translate(-50%,-50%) scale(.68);border-color:#fff}.hero-cursor.is-pressed .ring{inset:-18px;border-color:rgba(243,245,239,.35)}.hero a,.hero button{cursor:pointer}@media(hover:none){.hero{cursor:auto}.hero-cursor{display:none}}

.topic{display:grid;align-items:center;overflow:hidden;position:relative}.topic.dark{background:linear-gradient(118deg,#020306,#080b10 54%,#020306);color:var(--fg)}.topic.light{background:var(--paper);color:var(--ink)}.topic.dark:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 78% 36%,rgba(200,204,198,.08),transparent 32vw),linear-gradient(180deg,transparent,rgba(0,0,0,.38));opacity:.95}.topic.light:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 28%,rgba(122,138,134,.10),transparent 30vw),linear-gradient(90deg,rgba(255,255,255,.32),transparent);opacity:.9}
.topic-grid{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:clamp(72px,9vw,128px) clamp(22px,5vw,76px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,7vw,120px);align-items:center}.topic:nth-of-type(even) .topic-copy{order:2}.topic:nth-of-type(even) .topic-media{order:1}.topic-copy{min-width:0;display:grid;gap:20px}.topic h2{font-size:clamp(44px,6.4vw,108px);line-height:.82;letter-spacing:-.07em;text-transform:uppercase;font-weight:900;text-wrap:balance;hyphens:auto;overflow-wrap:break-word}.topic h2 span{display:block}.topic h2 em{font-family:var(--serif);font-weight:400;font-style:italic;letter-spacing:-.045em;text-transform:none;color:var(--accent)}.topic.light h2 em{color:var(--accent-2)}.topic p{max-width:58ch;font-size:clamp(16px,1.16vw,20px);line-height:1.5;color:var(--muted)}.topic.light p{color:var(--muted-l)}.topic-note{font:11px/1.65 var(--mono)!important;letter-spacing:.12em;text-transform:uppercase;color:rgba(243,245,239,.48)!important}.topic.light .topic-note{color:rgba(9,11,16,.46)!important}.topic-link{width:max-content;margin-top:4px;color:inherit;border-bottom:1px solid currentColor;padding-bottom:8px;font:10px var(--mono);letter-spacing:.2em;text-transform:uppercase}.topic-link:hover{letter-spacing:.24em}
.topic-media{min-width:0;position:relative}.topic-frame{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;border:1px solid currentColor;border-color:rgba(243,245,239,.16);box-shadow:0 54px 150px rgba(0,0,0,.56)}.topic.light .topic-frame{border-color:rgba(9,11,16,.14);box-shadow:0 44px 120px rgba(9,11,16,.16)}.topic-frame img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.98) contrast(1.02);transform:scale(1.04);transition:transform 1.2s var(--ease)}.topic:hover .topic-frame img{transform:scale(1.075)}
.cluster{background:var(--paper);color:var(--ink)}.cluster-grid{display:grid;grid-template-columns:minmax(320px,.82fr) minmax(420px,1.18fr);gap:clamp(32px,6vw,88px);align-items:start}.cluster h2{font-size:clamp(46px,6.4vw,112px);line-height:.82;letter-spacing:-.075em;text-transform:uppercase}.cluster h2 em{font-family:var(--serif);font-weight:400;font-style:italic;text-transform:none;color:var(--accent-2)}.cluster-copy{display:grid;gap:18px}.cluster-copy p{font-size:clamp(16px,1.1vw,20px);line-height:1.5;color:rgba(9,11,16,.66)}.cluster-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}.cluster-links a{min-height:54px;border:1px solid rgba(9,11,16,.12);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;font:10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:rgba(9,11,16,.74);transition:.24s var(--ease)}.cluster-links a:after{content:"→";color:var(--accent-2)}.cluster-links a:hover{background:#090b10;color:var(--fg);border-color:#090b10;padding-left:18px}
.topic-link{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:980px){.hero{padding:120px 20px 88px}.hero-title{font-size:clamp(46px,13vw,82px);letter-spacing:-.05em}.hero-lead{max-width:34rem;margin-top:18px;font-size:16px}.hero-actions{gap:10px;margin-top:22px}.hero-actions .btn{width:auto;min-height:46px;padding:12px 16px;letter-spacing:.14em}.topic-grid{grid-template-columns:1fr;gap:32px;padding-top:82px;padding-bottom:70px}.topic:nth-of-type(even) .topic-copy,.topic:nth-of-type(even) .topic-media{order:initial}.topic-frame{aspect-ratio:5/4}.topic h2{font-size:clamp(44px,11vw,72px)}.cluster-grid{grid-template-columns:1fr}.cluster-links{grid-template-columns:1fr}}
@media(max-width:780px){.ovh{padding:120px 20px 64px;min-height:560px}.ovh__title{font-size:clamp(46px,13vw,82px);letter-spacing:-.05em}}
@media(max-width:620px){.hero{min-height:92svh}.topic-frame{aspect-ratio:4/3}.cluster h2{font-size:clamp(42px,14vw,72px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.ovh__photo{transform:scale(1.03)}.ovh__aperture,.ovh__glow{opacity:.18}.ovh__title .word,.ovh__lead,.ovh__actions{transform:none;opacity:1}.topic-frame img{transform:none!important}}
