/* Romer Architekten, Designsystem 2026, Entwurf */
/* Designsystem
   Raster: 12 Spalten, Rand clamp(20px,4.5vw,64px), Spaltenabstand clamp(16px,2vw,28px)
   Typografie: Asap fuer Text und Ueberschriften, Asap Condensed fuer Nummern, Bildunterschriften, Projektdaten
   Bewegung: eine Kurve, zwei Dauern (UI 280 ms, Bild 1100 ms) */
:root{
  --paper:#fff; --warm:#f7f7f5; --ink:#151617; --anth:#2f3134; --mute:#65686c; --line:#deded9; --accent:#a5232b;
  --sans:"Asap",Arial,"Helvetica Neue",sans-serif;
  --cond:"Asap Condensed","Arial Narrow",Arial,sans-serif;
  --m:clamp(20px,4.5vw,64px); --gut:clamp(16px,2vw,28px); --max:1440px;
  --h1:clamp(2.75rem,6.4vw,5.75rem); --h2:clamp(1.875rem,3.1vw,2.875rem); --h3:1.25rem;
  --lead:clamp(1.1875rem,1.45vw,1.4375rem); --body:1.0625rem; --cap:.875rem;
  --ease:cubic-bezier(.22,.61,.12,1); --t-ui:280ms; --t-img:1100ms;
  --sec:clamp(96px,12vw,192px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--body)/1.62 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
h1,h2,h3{font-weight:500;letter-spacing:-.02em;text-wrap:balance}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.skip{position:absolute;left:-999px}.skip:focus{left:var(--m);top:12px;z-index:50;background:#fff;padding:8px 12px}
.w{max-width:calc(var(--max) + 2*var(--m));margin:0 auto;padding-inline:var(--m)}
.g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gut)}
.cap{font:400 var(--cap)/1.45 var(--cond);color:var(--mute);letter-spacing:.01em}
.no{font:500 1rem/1 var(--cond);color:var(--accent);font-variant-numeric:tabular-nums}
.tbd{color:var(--accent);font-style:italic}
.ln{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size var(--t-ui) var(--ease)}
.ln:hover,.ln:focus-visible{background-size:100% 1px}

/* Kopf: schlank, verkleinert sich beim Scrollen */
.hd{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.2) blur(8px)}
.hd .w{display:flex;align-items:center;justify-content:space-between;height:84px;transition:height var(--t-ui) var(--ease)}
.hd.small .w{height:60px}
.hd::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);opacity:0;transition:opacity var(--t-ui)}
.hd.small::after{opacity:1}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:1.125rem;letter-spacing:-.01em}
.sig{width:30px;height:30px;background:var(--accent);color:#fff;display:grid;place-items:center;font:600 1rem/1 var(--sans)}
.nav{display:flex;gap:clamp(18px,2.2vw,36px)}
.nav a{text-decoration:none;font-size:.9688rem;color:var(--anth);padding-block:4px}
.nav a[aria-current]{color:var(--ink);box-shadow:inset 0 -1px var(--accent)}
.nav a:hover{color:var(--ink)}
.mb{display:none;background:none;border:0;font:500 .9688rem var(--sans);color:var(--ink);padding:10px 0 10px 16px;min-height:44px;cursor:pointer}

/* Einstieg */
.hero{padding-top:clamp(40px,7vw,112px)}
.hero h1{grid-column:1 / span 10;font-size:var(--h1);line-height:.98;letter-spacing:-.035em}
.hero .page{grid-column:1 / -1;margin-bottom:clamp(24px,3vw,40px)}
.hero-row{margin-top:clamp(40px,6vw,96px);align-items:start}
.hero-txt{grid-column:1 / span 4;display:grid;gap:22px;padding-top:4px}
.hero-txt .lead{font-size:var(--lead);line-height:1.5}
.hero-txt p:not(.lead){color:var(--anth)}
.hero-fig{grid-column:6 / -1;margin-right:calc(-1 * var(--m))}
.hero-fig img{aspect-ratio:4/3;object-fit:cover}
.hero-fig figcaption{margin-top:10px;padding-right:var(--m)}
.toc{grid-column:1 / span 4;margin-top:clamp(40px,5vw,72px);border-top:1px solid var(--ink)}
.toc li a{display:grid;grid-template-columns:2.25rem 1fr;padding:11px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:color var(--t-ui)}
.toc li a:hover{color:var(--accent)}

/* Leistungsbereiche: gemeinsame Teile */
.area{padding-top:var(--sec)}
.ah{align-items:baseline;margin-bottom:clamp(32px,4vw,56px)}
.ah .no{grid-column:1 / span 1;font-size:1.0625rem}
.ah h2{grid-column:2 / span 7;font-size:var(--h2);line-height:1.08}
.ah .claim{grid-column:2 / span 7;margin-top:12px;font-size:var(--lead);color:var(--mute);line-height:1.4}
.txt{display:grid;gap:16px;color:var(--anth);max-width:34em}
.focus{display:grid;gap:10px}
.focus h3,.refs h3.cap{font:500 var(--cap)/1.4 var(--cond);color:var(--ink);letter-spacing:.01em}
.focus ul{font:400 1rem/1.5 var(--cond);color:var(--anth);display:grid;gap:3px}
.bleed{margin-inline:calc(-1 * var(--m))}
figcaption.cap{margin-top:10px}
.refs{margin-top:clamp(48px,6vw,88px);row-gap:28px}
.refs>h3{grid-column:1 / span 3}
.ref{text-decoration:none;display:grid;gap:10px;align-content:start}
.ref .im{overflow:hidden;background:var(--warm)}
.ref img{aspect-ratio:4/3;object-fit:cover;transition:transform 700ms var(--ease)}
.ref:hover img{transform:scale(1.03)}
.ref h4{margin:0;font-size:1rem;font-weight:500;line-height:1.35}
.ref:hover h4{box-shadow:inset 0 -1px currentColor}
.ref h4{justify-self:start}

/* 01: Panorama */
#b01 .bleed img{aspect-ratio:21/9;object-fit:cover;max-height:82vh}
#b01 figcaption{padding-inline:var(--m)}
#b01 .body{margin-top:clamp(40px,5vw,72px)}
#b01 .focus{grid-column:2 / span 3}
#b01 .txt{grid-column:7 / span 5}
#b01 .refs .ref:nth-of-type(1){grid-column:7 / span 3}
#b01 .refs .ref:nth-of-type(2){grid-column:10 / span 3}

/* 02: Doppelseite mit Referenzprojekt */
#b02 .spread{align-items:start}
#b02 .big{grid-column:1 / span 7;margin-left:calc(-1 * var(--m))}
#b02 .big img{aspect-ratio:1/1;object-fit:cover;object-position:50% 72%}
#b02 .big figcaption{padding-left:var(--m)}
#b02 .side{grid-column:9 / span 4;display:grid;gap:28px;padding-top:clamp(0px,6vw,96px)}
#b02 .proj{border-top:1px solid var(--ink);padding-top:14px;display:grid;gap:12px}
#b02 .proj h3{font-size:var(--h3);line-height:1.3}
dl.kv{display:grid;grid-template-columns:7.5rem 1fr;gap:4px 12px;font:400 .9375rem/1.45 var(--cond)}
dl.kv dt{color:var(--mute)}
#b02 .small img{aspect-ratio:4/3;object-fit:cover}
#b02 .body{margin-top:clamp(48px,6vw,96px)}
#b02 .txt{grid-column:2 / span 5}
#b02 .focus{grid-column:9 / span 4}
#b02 .refs .ref:nth-of-type(1){grid-column:4 / span 3}
#b02 .refs .ref:nth-of-type(2){grid-column:7 / span 3}
#b02 .refs .ref:nth-of-type(3){grid-column:10 / span 3}

/* 03: einziger dunkler Abschnitt, Baustelle und Ausführung */
#b03{background:var(--anth);color:#fff;margin-top:var(--sec);padding-block:var(--sec)}
#b03 .no{color:#e3a2a6}
#b03 .claim,#b03 .cap{color:#b7b9bc}
#b03 .txt,#b03 .focus ul{color:#d9dadc}
#b03 .focus h3,#b03 .refs h3.cap{color:#fff}
#b03 .row{align-items:end}
#b03 figure{grid-column:1 / span 8;margin-left:calc(-1 * var(--m))}
#b03 figure img{aspect-ratio:16/10;object-fit:cover}
#b03 figure figcaption{padding-left:var(--m)}
#b03 .col{grid-column:9 / span 4;display:grid;gap:32px}
#b03 .ref .im{background:#3a3c40}
#b03 .refs .ref:nth-of-type(1){grid-column:4 / span 3}
#b03 .refs .ref:nth-of-type(2){grid-column:7 / span 3}
#b03 .refs .ref:nth-of-type(3){grid-column:10 / span 3}
#b03 + .area{padding-top:var(--sec)}

/* 04: textgeführt, Bild im Hochformat */
#b04 .row{align-items:start}
#b04 .col{grid-column:2 / span 5;display:grid;gap:40px}
#b04 figure{grid-column:8 / span 4;margin-top:clamp(0px,4vw,64px)}
#b04 figure img{aspect-ratio:4/5;object-fit:cover}
#b04 .more{font-size:1rem}

/* 05 und 06: Paar ohne Großbild */
.pair{padding-top:var(--sec);align-items:start}
.pair .area{padding-top:0}
.pair>#b05{grid-column:1 / span 6}
.pair>#b06{grid-column:8 / span 5;margin-top:clamp(0px,10vw,160px)}
.pair .ah{display:grid;grid-template-columns:2.5rem 1fr;column-gap:0;margin-bottom:28px}
.pair .ah .no,.pair .ah h2,.pair .ah .claim{grid-column:auto}
.pair .ah .claim{grid-column:2}
.pair .ah h2{font-size:clamp(1.625rem,2.4vw,2.25rem)}
.pair .in{padding-left:2.5rem;display:grid;gap:32px}
#b05 figure img{aspect-ratio:16/9;object-fit:cover}

/* HOAI */
.hoai{background:var(--warm);margin-top:var(--sec);padding-block:clamp(80px,9vw,144px)}
.hh{margin-bottom:clamp(40px,5vw,72px)}
.hh .no{grid-column:1 / span 1}
.hh>div{grid-column:2 / span 7;display:grid;gap:16px}
.hh h2{font-size:var(--h2);line-height:1.08}
.hh p{color:var(--anth);max-width:38em}
.bar{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:3px;align-items:end}
.seg{min-width:0;background:transparent;border:0;padding:0 0 14px;text-align:left;cursor:pointer;font:inherit;color:var(--ink);display:grid;gap:8px;align-content:end;border-bottom:2px solid transparent;transition:border-color var(--t-ui) var(--ease)}
.seg .m{display:block;height:calc(var(--w) * 5px);min-height:8px;background:#d3d3ce;transform-origin:bottom;transition:background var(--t-ui) var(--ease)}
.seg:hover .m{background:#a9aaa6}
.seg[aria-selected="true"]{border-bottom-color:var(--accent)}
.seg[aria-selected="true"] .m{background:var(--accent)}
.seg .n{font:500 1.25rem/1 var(--cond);color:var(--ink)}
.seg[aria-selected="true"] .n{color:var(--accent)}
.seg .t{font-size:.8125rem;line-height:1.3;color:var(--anth);hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;min-height:3.9em}
.seg .p{font:400 .8125rem/1 var(--cond);color:var(--mute)}
.js .seg .m{transform:scaleY(0);transition:transform 900ms var(--ease),background var(--t-ui)}
.js .bar.in .seg .m{transform:none}
.js .bar.in .seg:nth-child(2) .m{transition-delay:40ms}.js .bar.in .seg:nth-child(3) .m{transition-delay:80ms}.js .bar.in .seg:nth-child(4) .m{transition-delay:120ms}.js .bar.in .seg:nth-child(5) .m{transition-delay:160ms}.js .bar.in .seg:nth-child(6) .m{transition-delay:200ms}.js .bar.in .seg:nth-child(7) .m{transition-delay:240ms}.js .bar.in .seg:nth-child(8) .m{transition-delay:280ms}.js .bar.in .seg:nth-child(9) .m{transition-delay:320ms}
.groups{position:relative;height:40px;margin-top:12px;border-top:1px solid var(--ink)}
.groups span{position:absolute;top:0;padding-top:10px;font:400 var(--cap)/1.3 var(--cond);color:var(--mute)}
.detail{margin-top:clamp(32px,4vw,56px);background:#fff;padding:clamp(28px,3.5vw,56px)}
.detail .dn{grid-column:1 / span 2;font:500 clamp(3rem,5vw,4.5rem)/.9 var(--cond);color:var(--accent)}
.detail .dm{grid-column:3 / span 6;display:grid;gap:12px}
.detail .dm h3{font-size:clamp(1.5rem,2vw,1.875rem);line-height:1.15}
.detail .dm ul{display:grid;gap:7px;color:var(--anth)}
.detail .dm li{padding-left:1.1em;position:relative}
.detail .dm li::before{content:"";position:absolute;left:0;top:.8em;width:.5em;height:1px;background:var(--mute)}
.detail .ds{grid-column:10 / span 3;display:grid;gap:4px;align-content:start}
.detail .pct{font:500 2.75rem/1 var(--cond);font-variant-numeric:tabular-nums}
.dfade{animation:dfade 420ms var(--ease)}
@keyframes dfade{from{opacity:0;transform:translateY(6px)}}
.acc{display:none}
.note{margin-top:clamp(32px,4vw,48px)}
.note>div{grid-column:3 / span 8;display:grid;gap:10px;padding-top:20px;border-top:1px solid var(--line)}
.note h3{font:500 var(--cap)/1.4 var(--cond);color:var(--ink)}
.note p{font-size:.9375rem;line-height:1.62;color:var(--anth)}

/* Kontakt */
.contact{padding-block:var(--sec) clamp(72px,8vw,120px)}
.contact h2{grid-column:1 / span 8;font-size:var(--h2);line-height:1.12}
.contact .cs{grid-column:9 / span 4;display:grid;gap:6px;align-content:end;font-size:1.125rem}
.btn{justify-self:start;margin-top:18px;display:inline-block;background:var(--ink);color:#fff;text-decoration:none;padding:15px 24px;font-weight:500;transition:background var(--t-ui) var(--ease)}
.btn:hover{background:var(--accent)}
.ft{border-top:1px solid var(--line)}
.ft .w{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-block:24px}
.ft nav{display:flex;gap:24px}
.ft a{text-decoration:none}

/* Bildfreilegung: nur große Bilder, nur mit JavaScript, nie bei reduzierter Bewegung */
.js .rv{overflow:hidden}
.js .rv img{clip-path:inset(0 0 100% 0);transform:scale(1.06);transition:clip-path var(--t-img) var(--ease),transform 1600ms var(--ease)}
.js .rv.in img{clip-path:inset(0);transform:none}
.js .hero h1 .l{display:block;opacity:0;transform:translateY(.25em);transition:opacity 900ms var(--ease),transform 900ms var(--ease)}
.js .hero.in h1 .l{opacity:1;transform:none}
.js .hero.in h1 .l+.l{transition-delay:120ms}

/* Tablet */
@media (max-width:1024px){
  .hd.open{backdrop-filter:none;background:#fff}
  .nav-wrap{position:fixed;inset:64px 0 0 0;background:#fff;display:none;padding:24px var(--m);overflow:auto}
  .hd.open .nav-wrap{display:block}
  .hd.open .w{height:64px}
  .nav{flex-direction:column;gap:0}
  .nav a{display:block;font-size:clamp(1.75rem,5vw,2.5rem);letter-spacing:-.02em;padding:10px 0;color:var(--ink)}
  .nav a[aria-current]{box-shadow:none;color:var(--accent)}
  .mb{display:block}
  .hero h1{grid-column:1 / -1}
  .hero-txt{grid-column:1 / span 5}.hero-fig{grid-column:7 / -1}
  .toc{grid-column:1 / span 6}
  .ah h2,.ah .claim{grid-column:2 / -1}
  #b01 .focus{grid-column:2 / span 4}#b01 .txt{grid-column:7 / -1}
  #b01 .refs>h3{grid-column:1 / -1}
  #b01 .refs .ref:nth-of-type(1){grid-column:1 / span 6}#b01 .refs .ref:nth-of-type(2){grid-column:7 / span 6}
  #b02 .big{grid-column:1 / span 7}#b02 .side{grid-column:8 / -1;padding-top:0}
  #b02 .txt{grid-column:1 / span 7}#b02 .focus{grid-column:9 / -1}
  #b02 .refs>h3,#b03 .refs>h3{grid-column:1 / -1}
  #b02 .refs .ref:nth-of-type(1),#b03 .refs .ref:nth-of-type(1){grid-column:1 / span 4}
  #b02 .refs .ref:nth-of-type(2),#b03 .refs .ref:nth-of-type(2){grid-column:5 / span 4}
  #b02 .refs .ref:nth-of-type(3),#b03 .refs .ref:nth-of-type(3){grid-column:9 / span 4}
  #b03 figure{grid-column:1 / -1;margin-right:calc(-1 * var(--m))}
  #b03 .col{grid-column:1 / -1;grid-template-columns:1fr 1fr;column-gap:var(--gut);margin-top:40px}
  #b04 .col{grid-column:1 / span 7}#b04 figure{grid-column:9 / -1}
  .pair>#b05{grid-column:1 / span 6}.pair>#b06{grid-column:7 / -1}
  .pair .in{padding-left:0}
  .hh>div{grid-column:2 / -1}
  .seg .t{font-size:.75rem}
  .detail .dm{grid-column:3 / -1}.detail .ds{grid-column:3 / -1;margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
  .note>div{grid-column:1 / span 10}
  .contact h2{grid-column:1 / -1}.contact .cs{grid-column:1 / span 8;margin-top:32px}
}
@media (max-width:900px){.seg .t{display:none}}

/* Smartphone */
@media (max-width:720px){
  .g>*{grid-column:1 / -1 !important}
  .hd .w{height:64px}
  .hero h1{font-size:clamp(2.5rem,11vw,3.25rem)}
  .hero-fig{margin-left:calc(-1 * var(--m));margin-top:40px;order:-1}
  .hero-fig figcaption{padding-left:var(--m)}
  .hero-fig img{aspect-ratio:4/5}
  .toc{margin-top:48px}
  .ah{row-gap:6px}
  #b01 .bleed img{aspect-ratio:4/3}
  #b01 .body,#b02 .body{row-gap:36px}
  #b02 .big{margin-right:calc(-1 * var(--m))}
  #b02 .side{margin-top:32px}
  .refs{grid-template-columns:1fr 1fr !important}
  .refs>h3{grid-column:1 / -1 !important}
  .refs .ref{grid-column:auto !important}
  #b03 .col{grid-template-columns:1fr;row-gap:32px}
  .pair{row-gap:var(--sec)}
  .pair>#b06{margin-top:0}
  .pair .ah{grid-template-columns:2.25rem 1fr}
  .bar,.groups,.detail{display:none}
  .acc{display:block;border-top:1px solid var(--ink)}
  .acc details{border-bottom:1px solid var(--line)}
  .acc summary{list-style:none;display:grid;grid-template-columns:2.5rem 1fr auto;gap:8px;align-items:baseline;padding:16px 0;cursor:pointer;min-height:44px}
  .acc summary::-webkit-details-marker{display:none}
  .acc summary .n{font:500 1.0625rem var(--cond);color:var(--accent)}
  .acc summary .p{font:400 .875rem var(--cond);color:var(--mute)}
  .acc .k{padding:0 0 20px 2.5rem;display:grid;gap:10px}
  .acc ul{display:grid;gap:6px;color:var(--anth);font-size:.9688rem}
  .contact .cs{margin-top:24px}
}
@media (max-width:400px){.refs{grid-template-columns:1fr !important}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  .js .rv img,.js .hero h1 .l,.js .seg .m{clip-path:none!important;transform:none!important;opacity:1!important}
}

/* Weblication-Anpassung: Altstile neutralisieren, Elementrahmen ohne Abstand */
body.r26{font-size:var(--body);line-height:1.62;color:var(--ink);background:var(--paper)}
.r26 a{text-decoration:none}
.r26 p{margin:0}
.r26 button{margin:0;font-weight:inherit;border:0}
.r26 .elementStandard,.r26 .elementSection,.r26 .sectionInner,.r26 .elementScript{margin:0;padding:0;max-width:none;width:auto;float:none;background:none;border:0}

/* ===== R26 Inhaltsbereiche (Layout-Varianten 261 bis 269 des Elements "Inhaltsbereich") =====
   261 Einstieg, 262 Panorama, 263 Doppelseite, 264 Dunkel, 265 Textgefuehrt,
   266 Halbe Breite, 267 Referenzen, 268 Kontakt, 269 Hellgrau
   Reihenfolge im Bereich: Ueberschrift, Text (Unterzeile), weitere Texte, Text mit Liste (Schwerpunkte), Bilder */
.r26 main{counter-reset:area;display:flow-root}
.r26 .elementSection[class*="_var26"]{padding:var(--sec) 0 0 !important;margin:0 !important;background:none;border:0}
.r26 .elementSection[class*="_var26"] > .sectionInner{max-width:calc(var(--max) + 2*var(--m));margin:0 auto;padding:0 var(--m) !important;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gut);grid-auto-flow:row dense;align-items:start}
.r26 .elementSection[class*="_var26"] > .sectionInner > *{grid-column:1 / -1;min-width:0;margin:0;float:none;width:auto}
.r26 .elementSection:not(.elementSection_var266){clear:both}

/* Typografie in den Bereichen */
.r26 [class*="_var26"] .elementHeadline h1,.r26 [class*="_var26"] .elementHeadline h2,.r26 [class*="_var26"] .elementHeadline h3{margin:0;padding:0;border:0;background:none;font-family:var(--sans);font-weight:500;font-size:var(--h2);line-height:1.08;letter-spacing:-.025em;color:inherit;text-transform:none;text-wrap:balance}
.r26 [class*="_var26"] .elementText{color:var(--anth);font-size:var(--body);line-height:1.62}
.r26 [class*="_var26"] .elementText p{margin:0 0 1em}
.r26 [class*="_var26"] .elementText p:last-child{margin-bottom:0}
.r26 [class*="_var26"] .elementText a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}
.r26 [class*="_var26"] .elementHeadline + .elementText{font-size:var(--lead);line-height:1.4;color:var(--mute);margin-top:12px}
.r26 [class*="_var26"] .elementText h3,.r26 [class*="_var26"] .elementText h4{margin:0 0 10px;font:500 var(--cap)/1.4 var(--cond);letter-spacing:.01em;color:var(--ink)}
.r26 [class*="_var26"] .elementText ul{list-style:none;margin:0;padding:0;display:grid;gap:3px;font:400 1rem/1.5 var(--cond)}
.r26 [class*="_var26"] .elementText li{margin:0;padding:0;background:none;list-style:none}
.r26 [class*="_var26"] .elementText .tbd,.r26 [class*="_var26"] .pictureSubtitle em{color:var(--accent);font-style:italic}

/* Bilder */
.r26 [class*="_var26"] .elementPicture > div,.r26 [class*="_var26"] .pictureFrameInner{width:auto !important;float:none !important;margin:0 !important;padding:0 !important;border:0 !important;background:none !important}
.r26 [class*="_var26"] .elementPicture img{display:block;width:100% !important;height:auto !important;max-width:none;object-fit:cover;background:var(--warm)}
.r26 [class*="_var26"] .pictureSubtitle{width:auto !important;max-width:none !important;margin:10px 0 0;padding:0;background:none;text-align:left;font:400 var(--cap)/1.45 var(--cond);color:var(--mute)}
.r26 [class*="_var26"] .elementPicture a{display:block;text-decoration:none;color:inherit}

/* Nummer der Leistungsbereiche, automatisch fortlaufend */
.r26 .elementSection_var262,.r26 .elementSection_var263,.r26 .elementSection_var264,.r26 .elementSection_var265,.r26 .elementSection_var266{counter-increment:area}
.r26 :is(.elementSection_var262,.elementSection_var263,.elementSection_var264,.elementSection_var265) > .sectionInner::before{content:counter(area,decimal-leading-zero);grid-column:1 / span 1;grid-row:1;padding-top:.75em;font:500 1.0625rem/1 var(--cond);color:var(--accent)}
.r26 .elementSection_var269 > .sectionInner::before{content:"§";grid-column:1 / span 1;grid-row:1;padding-top:.75em;font:500 1.0625rem/1 var(--cond);color:var(--accent)}
.r26 :is(.elementSection_var262,.elementSection_var263,.elementSection_var264,.elementSection_var265,.elementSection_var269) > .sectionInner > .elementHeadline{grid-column:2 / -1;grid-row:1}
.r26 :is(.elementSection_var262,.elementSection_var263,.elementSection_var264,.elementSection_var265,.elementSection_var269) > .sectionInner > .elementHeadline + .elementText{grid-column:2 / -1;grid-row:2}
.r26 [class*="_var26"] > .sectionInner > .elementHeadline :is(h1,h2,h3){max-width:20em}
.r26 [class*="_var26"] > .sectionInner > .elementHeadline + .elementText{max-width:36em}

/* 261 Einstieg */
.r26 .elementSection_var261{padding-top:clamp(40px,7vw,112px) !important}
.r26 .elementSection_var261 .elementHeadline h1,.r26 .elementSection_var261 .elementHeadline h2{font-size:var(--h1);line-height:.98;letter-spacing:-.035em}
.r26 .elementSection_var261 > .sectionInner > .elementHeadline{grid-column:1 / span 10;grid-row:1}
.r26 .elementSection_var261 > .sectionInner > .elementHeadline + .elementText{grid-row:2;color:var(--ink)}
.r26 .elementSection_var261 > .sectionInner > .elementText,.r26 .elementSection_var261 > .sectionInner > .toc{grid-column:1 / span 4}
.r26 .elementSection_var261 > .sectionInner > .elementText{margin-top:22px}
.r26 .elementSection_var261 > .sectionInner > .elementHeadline + .elementText{margin-top:clamp(40px,6vw,96px)}
.r26 .elementSection_var261 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:6 / -1;grid-row:2 / span 6;margin:clamp(40px,6vw,96px) calc(-1 * var(--m)) 0 0}
.r26 .elementSection_var261 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:4/3}
.r26 .toc{margin-top:clamp(40px,5vw,72px);border-top:1px solid var(--ink)}
.r26 .toc a{display:grid;grid-template-columns:2.25rem 1fr;padding:11px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);transition:color var(--t-ui)}
.r26 .toc a:hover{color:var(--accent)}
.r26 .toc .no{font:500 1rem/1.6 var(--cond);color:var(--accent)}

/* 262 Panorama */
.r26 .elementSection_var262 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-row:3;margin:clamp(32px,4vw,56px) calc(-1 * var(--m)) 0}
.r26 .elementSection_var262 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:21/9;max-height:82vh}
.r26 .elementSection_var262 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) .pictureSubtitle{padding:0 var(--m)}
.r26 .elementSection_var262 > .sectionInner > .elementText:not(.elementHeadline + .elementText){grid-column:7 / span 5;margin-top:clamp(40px,5vw,72px)}
.r26 .elementSection_var262 > .sectionInner > .elementText:has(ul){grid-column:2 / span 3}
.r26 .elementSection_var262 > .sectionInner > .elementPicture ~ .elementPicture{grid-column:span 3;margin-top:clamp(40px,5vw,72px)}

/* 263 Doppelseite */
.r26 .elementSection_var263 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:1 / span 7;grid-row:3 / span 6;margin:clamp(32px,4vw,56px) 0 0 calc(-1 * var(--m))}
.r26 .elementSection_var263 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:1/1;object-position:50% 70%}
.r26 .elementSection_var263 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) .pictureSubtitle{padding-left:var(--m)}
.r26 .elementSection_var263 > .sectionInner > :is(.elementText:not(.elementHeadline + .elementText),.elementPicture ~ .elementPicture){grid-column:9 / span 4;margin-top:clamp(32px,4vw,56px)}
.r26 .elementSection_var263 > .sectionInner > .elementPicture ~ .elementPicture img{aspect-ratio:4/3}

/* 264 Dunkel */
.r26 .elementSection_var264{background:var(--anth) !important;color:#fff;padding:var(--sec) 0 !important;margin-top:var(--sec) !important}
.r26 .elementSection_var264 > .sectionInner::before{color:#e3a2a6}
.r26 .elementSection_var264 .elementText,.r26 .elementSection_var264 .elementText ul{color:#d9dadc}
.r26 .elementSection_var264 .elementHeadline + .elementText,.r26 .elementSection_var264 .pictureSubtitle{color:#b7b9bc}
.r26 .elementSection_var264 .elementText h3,.r26 .elementSection_var264 .elementText h4{color:#fff}
.r26 .elementSection_var264 .elementPicture img{background:#3a3c40}
.r26 .elementSection_var264 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:1 / span 8;grid-row:3 / span 6;margin:clamp(32px,4vw,56px) 0 0 calc(-1 * var(--m))}
.r26 .elementSection_var264 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:16/10}
.r26 .elementSection_var264 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) .pictureSubtitle{padding-left:var(--m)}
.r26 .elementSection_var264 > .sectionInner > .elementText:not(.elementHeadline + .elementText){grid-column:9 / span 4;margin-top:clamp(32px,4vw,56px)}
.r26 .elementSection_var264 > .sectionInner > .elementPicture ~ .elementPicture{grid-column:span 4;margin-top:clamp(48px,6vw,88px)}
.r26 .elementSection_var264 > .sectionInner > .elementPicture ~ .elementPicture img{aspect-ratio:4/3}

/* 265 Textgefuehrt */
.r26 .elementSection_var265 > .sectionInner > .elementText:not(.elementHeadline + .elementText){grid-column:2 / span 5;margin-top:clamp(32px,4vw,56px)}
.r26 .elementSection_var265 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:8 / span 4;grid-row:3 / span 6;margin-top:clamp(32px,6vw,96px)}
.r26 .elementSection_var265 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:4/5}
.r26 .elementSection_var265 > .sectionInner > .elementPicture ~ .elementPicture{grid-column:2 / span 5;margin-top:32px}

/* 266 Halbe Breite, zwei aufeinanderfolgende Bereiche stehen nebeneinander */
.r26 .elementSection_var266{float:left;width:50%}
.r26 .elementSection_var266 + .elementSection_var266{padding-top:calc(var(--sec) + clamp(0px,8vw,128px)) !important}
.r26 .elementSection.elementSection_var266 > .sectionInner{display:block;max-width:calc(var(--max) / 2 + var(--m));margin:0 0 0 auto}
.r26 .elementSection_var266 + .elementSection_var266 > .sectionInner{margin:0 auto 0 0 !important}
.r26 .elementSection.elementSection_var266 > .sectionInner > * + *{margin-top:28px}
.r26 .elementSection.elementSection_var266 > .sectionInner > .elementHeadline + .elementText{margin-top:12px}
.r26 .elementSection_var266 .elementHeadline h2,.r26 .elementSection_var266 .elementHeadline h3{font-size:clamp(1.625rem,2.4vw,2.25rem)}
.r26 .elementSection_var266 > .sectionInner > .elementHeadline::before{content:counter(area,decimal-leading-zero);display:block;margin-bottom:14px;font:500 1.0625rem/1 var(--cond);color:var(--accent)}
.r26 .elementSection_var266 .elementPicture img{aspect-ratio:16/9}

/* 267 Referenzen */
.r26 .elementSection.elementSection_var267{padding-top:clamp(48px,6vw,88px) !important}
.r26 .elementSection_var267 > .sectionInner{row-gap:28px}
.r26 .elementSection_var267 > .sectionInner > .elementHeadline{grid-column:1 / span 3}
.r26 .elementSection_var267 .elementHeadline h2,.r26 .elementSection_var267 .elementHeadline h3{font:500 var(--cap)/1.4 var(--cond);letter-spacing:.01em}
.r26 .elementSection_var267 > .sectionInner > .elementPicture{grid-column:span 3}
.r26 .elementSection_var267 .elementPicture .pictureFrameInner{overflow:hidden}
.r26 .elementSection_var267 .elementPicture img{aspect-ratio:4/3;transition:transform 700ms var(--ease)}
.r26 .elementSection_var267 .elementPicture:hover img{transform:scale(1.03)}
.r26 .elementSection_var267 .pictureSubtitle{font:500 1rem/1.35 var(--sans);color:var(--ink)}

/* 268 Kontakt */
.r26 .elementSection.elementSection_var268{padding-bottom:clamp(72px,8vw,120px) !important}
.r26 .elementSection_var268 > .sectionInner{align-items:end}
.r26 .elementSection_var268 > .sectionInner > .elementHeadline{grid-column:1 / span 8;grid-row:1 / span 3}
.r26 .elementSection_var268 > .sectionInner > .elementText{grid-column:9 / span 4;font-size:1.125rem;color:var(--ink)}
.r26 .elementSection_var268 .elementHeadline + .elementText{margin-top:0;font-size:1.125rem;color:var(--ink)}
.r26 .elementSection_var268 .elementText p:last-child a:only-child{display:inline-block;margin-top:18px;padding:15px 24px;background:var(--ink);color:#fff;font-weight:500;transition:background var(--t-ui) var(--ease)}
.r26 .elementSection_var268 .elementText p:last-child a:only-child:hover{background:var(--accent)}

/* 269 Hellgrau, z. B. HOAI-Leistungsphasen mit Hinweis */
.r26 .elementSection.elementSection_var269{background:var(--warm) !important;padding:clamp(80px,9vw,144px) 0 !important;margin-top:var(--sec) !important}
.r26 .elementSection_var269 > .sectionInner > .elementHeadline + .elementText{color:var(--anth);font-size:var(--body);line-height:1.62;margin-top:16px}
.r26 .elementSection_var269 > .sectionInner > .elementScript{margin-top:clamp(40px,5vw,72px)}
.r26 .elementSection_var269 > .sectionInner > .elementScript ~ .elementText{grid-column:3 / span 8;margin-top:clamp(32px,4vw,48px);padding-top:20px;border-top:1px solid var(--line);font-size:.9375rem}
.r26 .elementSection_var269 > .sectionInner > .elementScript ~ .elementText + .elementText{margin-top:0;padding-top:10px;border-top:0}

@media (max-width:1024px){
  .r26 :is(.elementSection_var262,.elementSection_var263,.elementSection_var264,.elementSection_var265,.elementSection_var269) > .sectionInner > :is(.elementHeadline,.elementHeadline + .elementText){grid-column:2 / -1}
  .r26 .elementSection_var261 > .sectionInner > .elementHeadline{grid-column:1 / -1}
  .r26 .elementSection_var261 > .sectionInner > :is(.elementText,.toc){grid-column:1 / span 5}
  .r26 .elementSection_var261 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:7 / -1}
  .r26 .elementSection_var262 > .sectionInner > .elementText:not(.elementHeadline + .elementText){grid-column:7 / -1}
  .r26 .elementSection_var262 > .sectionInner > .elementText:has(ul){grid-column:2 / span 4}
  .r26 .elementSection_var262 > .sectionInner > .elementPicture ~ .elementPicture{grid-column:span 6}
  .r26 .elementSection_var263 > .sectionInner > :is(.elementText:not(.elementHeadline + .elementText),.elementPicture ~ .elementPicture){grid-column:8 / -1}
  .r26 .elementSection_var264 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:1 / -1;grid-row:3;margin-right:calc(-1 * var(--m))}
  .r26 .elementSection_var264 > .sectionInner > .elementText:not(.elementHeadline + .elementText){grid-column:span 6}
  .r26 .elementSection_var265 > .sectionInner > .elementText:not(.elementHeadline + .elementText),.r26 .elementSection_var265 > .sectionInner > .elementPicture ~ .elementPicture{grid-column:1 / span 7}
  .r26 .elementSection_var265 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){grid-column:9 / -1}
  .r26 .elementSection_var267 > .sectionInner > .elementHeadline{grid-column:1 / -1}
  .r26 .elementSection_var267 > .sectionInner > .elementPicture{grid-column:span 4}
  .r26 .elementSection_var268 > .sectionInner > .elementHeadline{grid-column:1 / -1;grid-row:auto}
  .r26 .elementSection_var268 > .sectionInner > .elementText{grid-column:1 / span 8;margin-top:32px}
  .r26 .elementSection_var269 > .sectionInner > .elementScript ~ .elementText{grid-column:1 / span 10}
}
@media (max-width:720px){
  .r26 .elementSection[class*="_var26"] > .sectionInner > *{grid-column:1 / -1 !important;grid-row:auto !important}
  .r26 .elementSection[class*="_var26"] > .sectionInner::before{grid-column:1 / -1 !important;padding-top:0;margin-bottom:6px}
  .r26 [class*="_var26"] > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){margin-left:calc(-1 * var(--m)) !important;margin-right:calc(-1 * var(--m)) !important}
  .r26 [class*="_var26"] > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) .pictureSubtitle{padding:0 var(--m)}
  .r26 .elementSection_var261 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){order:-1;margin-top:0 !important}
  .r26 .elementSection_var261 > .sectionInner > .elementHeadline{order:-2}
  .r26 .elementSection_var261 .elementHeadline h1,.r26 .elementSection_var261 .elementHeadline h2{font-size:clamp(2.5rem,11vw,3.25rem);margin-bottom:36px}
  .r26 .elementSection_var261 > .sectionInner > .elementHeadline + .elementText{margin-top:36px}
  .r26 .elementSection_var262 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:4/3}
  .r26 .elementSection_var263 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{aspect-ratio:4/3}
  .r26 .elementSection_var266{float:none;width:auto}
  .r26 .elementSection_var266 + .elementSection_var266{padding-top:var(--sec) !important}
  .r26 .elementSection.elementSection_var266 > .sectionInner{margin:0 !important;max-width:none}
  .r26 .elementSection.elementSection_var267 > .sectionInner{grid-template-columns:1fr 1fr}
  .r26 .elementSection.elementSection_var267 > .sectionInner > .elementPicture:not(.x.y){margin:0 !important}
  .r26 .elementSection.elementSection_var267 > .sectionInner > .elementPicture .pictureSubtitle{padding:0 !important}
  .r26 .elementSection_var267 > .sectionInner > .elementPicture{grid-column:auto !important}
  .r26 .elementSection_var268 > .sectionInner > .elementText{margin-top:24px}
}
@media (max-width:400px){.r26 .elementSection.elementSection_var267 > .sectionInner{grid-template-columns:1fr}}

/* Basisregeln auch fuer Varianten 270 bis 279 */
.r26 .elementSection[class*="_var27"]{padding:var(--sec) 0 0 !important;margin:0 !important;background:none;border:0}
.r26 .elementSection[class*="_var27"] > .sectionInner{max-width:calc(var(--max) + 2*var(--m));margin:0 auto;padding:0 var(--m) !important;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gut);grid-auto-flow:row dense;align-items:start}
.r26 .elementSection[class*="_var27"] > .sectionInner > *{grid-column:1 / -1;min-width:0;margin:0;float:none;width:auto}
.r26 [class*="_var27"] .elementHeadline h1,.r26 [class*="_var27"] .elementHeadline h2,.r26 [class*="_var27"] .elementHeadline h3{margin:0;padding:0;border:0;background:none;font-family:var(--sans);font-weight:500;font-size:var(--h2);line-height:1.08;letter-spacing:-.025em;color:inherit;text-transform:none;text-wrap:balance}
.r26 [class*="_var27"] .elementText{color:var(--anth);font-size:var(--body);line-height:1.62}
.r26 [class*="_var27"] .elementText p{margin:0 0 1em}
.r26 [class*="_var27"] .elementText p:last-child{margin-bottom:0}
.r26 [class*="_var27"] .elementText a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}
.r26 [class*="_var27"] .elementHeadline + .elementText{font-size:var(--lead);line-height:1.4;color:var(--mute);margin-top:12px}
.r26 [class*="_var27"] .elementText h3,.r26 [class*="_var27"] .elementText h4{margin:0 0 10px;font:500 var(--cap)/1.4 var(--cond);letter-spacing:.01em;color:var(--ink)}
.r26 [class*="_var27"] .elementText ul{list-style:none;margin:0;padding:0;display:grid;gap:3px;font:400 1rem/1.5 var(--cond)}
.r26 [class*="_var27"] .elementText li{margin:0;padding:0;background:none;list-style:none}
.r26 [class*="_var27"] .elementText .tbd,.r26 [class*="_var27"] .pictureSubtitle em{color:var(--accent);font-style:italic}
.r26 [class*="_var27"] .elementPicture > div,.r26 [class*="_var27"] .pictureFrameInner{width:auto !important;float:none !important;margin:0 !important;padding:0 !important;border:0 !important;background:none !important}
.r26 [class*="_var27"] .elementPicture img{display:block;width:100% !important;height:auto !important;max-width:none;object-fit:cover;background:var(--warm)}
.r26 [class*="_var27"] .pictureSubtitle{width:auto !important;max-width:none !important;margin:10px 0 0;padding:0;background:none;text-align:left;font:400 var(--cap)/1.45 var(--cond);color:var(--mute)}
.r26 [class*="_var27"] .elementPicture a{display:block;text-decoration:none;color:inherit}
@media (max-width:720px){.r26 .elementSection[class*="_var27"] > .sectionInner > *{grid-column:1 / -1 !important;grid-row:auto !important}.r26 .elementSection[class*="_var27"] > .sectionInner::before{grid-column:1 / -1 !important;padding-top:0;margin-bottom:6px}.r26 [class*="_var27"] > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture){margin-left:calc(-1 * var(--m)) !important;margin-right:calc(-1 * var(--m)) !important}.r26 [class*="_var27"] > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) .pictureSubtitle{padding:0 var(--m)}}

/* ===== R26 Startseite (Layout-Varianten 270 bis 273 des Elements "Inhaltsbereich") =====
   270 Buehne: Vollbild mit Ueberschrift, Text und Links auf dem Bild (nur als erster Bereich der Seite)
   271 Projekt gross: Bild ueber die volle Breite, darunter Projektname und Angaben
   272 Projekt eingerueckt: wie 271, Bild eingerueckt im Querformat
   273 Statement: kurze Ueberschrift als Marke, grosser Text, weitere Texte darunter */

.r26 main{overflow-x:clip}
/* Kopfbereich ueber der Buehne transparent, bis gescrollt wird */
body.r26.has-stage main{margin-top:-84px}
body.r26.has-stage .hd:not(.small):not(.open){background:transparent;backdrop-filter:none}
body.r26.has-stage .hd:not(.small):not(.open) :is(.brand,.nav a,.mb){color:#fff}
body.r26.has-stage .hd:not(.small):not(.open) .nav a[aria-current]{box-shadow:inset 0 -1px #fff}
body.r26.has-stage .hd:not(.small):not(.open)::before{content:"";position:absolute;inset:0 0 -40px;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(10,10,11,.38),rgba(10,10,11,0))}

/* 270 Buehne */
.r26 .elementSection.elementSection_var270{padding:0 !important;background:var(--ink);color:#fff}
.r26 .elementSection.elementSection_var270 > .sectionInner{position:relative;max-width:none;min-height:100vh;min-height:100svh;padding:0 var(--m) clamp(28px,5vw,64px) !important;align-content:end;overflow:hidden}
.r26 .elementSection.elementSection_var270 > .sectionInner > .elementPicture{position:absolute !important;inset:0;z-index:0;grid-column:auto !important;grid-row:auto !important;margin:0 !important;width:auto !important}
.r26 .elementSection_var270 .elementPicture > div,.r26 .elementSection_var270 .pictureFrameInner{height:100%}
.r26 .elementSection_var270 .elementPicture img{height:100% !important;object-fit:cover;background:var(--ink)}
.r26 .elementSection_var270 .elementPicture::after{content:"";position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(to top,rgba(10,10,11,.66),rgba(10,10,11,0));pointer-events:none}
.r26 .elementSection_var270 .pictureSubtitle{position:absolute;z-index:2;right:var(--m);top:calc(84px + 18px);margin:0 !important;color:rgba(255,255,255,.78) !important;text-align:right !important}
.r26 .elementSection_var270 > .sectionInner > :not(.elementPicture){position:relative;z-index:2}
.r26 .elementSection_var270 > .sectionInner > .elementHeadline{grid-column:1 / span 8;grid-row:1 / span 3;align-self:end}
.r26 .elementSection_var270 .elementHeadline :is(h1,h2){font-size:clamp(2.25rem,4.6vw,4.25rem) !important;line-height:1.03 !important;letter-spacing:-.03em;color:#fff !important;max-width:14em}
.r26 .elementSection_var270 > .sectionInner > .elementText{grid-column:10 / span 3;color:rgba(255,255,255,.86);font-size:1rem;margin-top:0}
.r26 .elementSection_var270 .elementHeadline + .elementText{font-size:1rem;color:rgba(255,255,255,.86);margin-top:0;align-self:end}
.r26 .elementSection_var270 .elementText a{color:#fff}
.r26 .elementSection_var270 .elementText p + p{margin-top:.4em}
.js .r26 .elementSection_var270 .elementPicture img{transform:scale(1.045);opacity:0;transition:transform 2400ms var(--ease),opacity 1200ms var(--ease)}
.js .r26 .elementSection_var270.in .elementPicture img{transform:none;opacity:1}

/* 271 und 272 Projekt */
.r26 .elementSection.elementSection_var271,.r26 .elementSection.elementSection_var272{padding-top:clamp(72px,9vw,152px) !important}
.r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementPicture{grid-row:1}
.r26 .elementSection_var271 > .sectionInner > .elementPicture{width:100vw !important;margin-left:calc(50% - 50vw) !important}
.r26 .elementSection_var271 .elementPicture img{aspect-ratio:16 / 9}
.r26 .elementSection_var272 > .sectionInner > .elementPicture{grid-column:3 / -1}
.r26 .elementSection_var272 .elementPicture img{aspect-ratio:3 / 2}
.r26 :is(.elementSection_var271,.elementSection_var272) .pictureSubtitle{position:absolute;width:1px !important;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementHeadline{grid-row:2;margin-top:clamp(20px,2.2vw,32px)}
.r26 .elementSection_var271 > .sectionInner > .elementHeadline{grid-column:1 / span 6}
.r26 .elementSection_var272 > .sectionInner > .elementHeadline{grid-column:3 / span 5}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementHeadline :is(h1,h2,h3){font-size:clamp(1.5rem,2.4vw,2.25rem)}
.r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementText{grid-row:2 / span 4;margin-top:clamp(20px,2.2vw,32px);font:400 1rem/1.55 var(--cond);color:var(--anth)}
.r26 .elementSection_var271 > .sectionInner > .elementText{grid-column:8 / span 5}
.r26 .elementSection_var272 > .sectionInner > .elementText{grid-column:9 / span 4}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementHeadline + .elementText{font:400 1rem/1.55 var(--cond);color:var(--anth)}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementText p{margin:0 0 .35em}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementText p:last-child{margin-top:14px}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementText p:last-child a{color:var(--ink);font-weight:500}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementText p:last-child a:hover{color:var(--accent)}
.r26 :is(.elementSection_var271,.elementSection_var272) .elementPicture img{transition:transform 1200ms var(--ease)}

.r26 :is(.elementSection_var271,.elementSection_var272) .elementText p.kurz{margin:16px 0 0;max-width:34em;font:400 1rem/1.6 var(--sans);color:var(--anth)}
/* 273 Statement */
.r26 .elementSection.elementSection_var273{padding-top:var(--sec) !important}
.r26 .elementSection_var273 > .sectionInner > .elementHeadline{grid-column:1 / span 3;padding-top:.6em}
.r26 .elementSection_var273 .elementHeadline :is(h1,h2,h3){font:500 var(--cap)/1.4 var(--cond) !important;letter-spacing:.02em;color:var(--mute)}
.r26 .elementSection_var273 > .sectionInner > .elementText{grid-column:4 / span 8}
.r26 .elementSection_var273 .elementHeadline + .elementText{grid-row:1;margin-top:0;font-size:clamp(1.5rem,2.6vw,2.5rem);line-height:1.22;letter-spacing:-.02em;color:var(--ink);text-wrap:pretty}
.r26 .elementSection_var273 .elementHeadline + .elementText ~ .elementText{margin-top:clamp(28px,3vw,44px)}
.r26 .elementSection_var273 .elementText ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gut);gap:0 var(--gut);font:400 1.0625rem/1.5 var(--sans)}
.r26 .elementSection_var273 .elementText li a{display:block;padding:12px 0;border-top:1px solid var(--line);background:none;color:var(--ink)}
.r26 .elementSection_var273 .elementText li a:hover{color:var(--accent)}

@media (max-width:1024px){
  body.r26.has-stage main{margin-top:-64px}
  .r26 .elementSection_var270 .pictureSubtitle{top:calc(64px + 14px)}
  .r26 .elementSection_var270 > .sectionInner > .elementHeadline{grid-column:1 / -1;grid-row:auto}
  .r26 .elementSection_var270 > .sectionInner > .elementText{grid-column:1 / span 8;margin-top:20px}
  .r26 .elementSection_var272 > .sectionInner > .elementPicture{grid-column:2 / -1}
  .r26 .elementSection_var272 > .sectionInner > .elementHeadline{grid-column:2 / span 6}
  .r26 .elementSection_var272 > .sectionInner > .elementText{grid-column:8 / span 5}
  .r26 .elementSection_var273 > .sectionInner > .elementHeadline{grid-column:1 / -1;padding-top:0;margin-bottom:16px}
  .r26 .elementSection_var273 > .sectionInner > .elementText{grid-column:1 / span 11}
  .r26 .elementSection_var273 .elementHeadline + .elementText{grid-row:auto}
}
@media (max-width:720px){
  .r26 .elementSection.elementSection_var270 > .sectionInner{min-height:88svh}
  .r26 .elementSection_var270 > .sectionInner > .elementText{grid-column:1 / -1}
  .r26 .elementSection_var270 .pictureSubtitle{left:var(--m);right:auto;text-align:left !important}
  .r26 .elementSection_var271 .elementPicture img{aspect-ratio:4 / 3}
  .r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementPicture{order:-1}
  .r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementHeadline{margin-top:18px}
  .r26 .elementSection_var272 > .sectionInner > .elementPicture{grid-column:1 / -1}
  .r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > :is(.elementHeadline,.elementText){grid-column:1 / -1;grid-row:auto}
  .r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementText{margin-top:12px}
  .r26 .elementSection_var273 > .sectionInner > .elementText{grid-column:1 / -1}
  .r26 .elementSection_var273 .elementText ul{grid-template-columns:1fr}
}
@media (hover:hover){
  .r26 :is(.elementSection_var271,.elementSection_var272) .elementPicture{overflow:hidden}
  .r26 :is(.elementSection_var271,.elementSection_var272):hover .elementPicture img{transform:scale(1.015)}
}
@media (prefers-reduced-motion:reduce){
  .js .r26 .elementSection_var270 .elementPicture img{transform:none !important;opacity:1 !important;transition:none}
  .r26 :is(.elementSection_var271,.elementSection_var272) .elementPicture img{transition:none;transform:none !important}
}

/* ===== Logo Romer Architekten (Fassung 16.10.2026): im Kopf nur die R-Bildmarke (Entscheidung Buero), im Fussbereich die Wort-Bild-Marke =====
   Kachelhoehe mindestens 40 px (Richtlinie), Schutzzone 1/4 Kachelhoehe wird durch die Kopfhoehe eingehalten */
.brand{gap:0}
.brand .logo{display:block;height:52px;width:auto;max-width:none;transition:height var(--t-ui,200ms) var(--ease)}
.hd.small .brand .logo{height:40px}
.brand .logo-neg{display:none}
body.r26.has-stage .hd:not(.small):not(.open) .brand .logo-pos{display:none}
body.r26.has-stage .hd:not(.small):not(.open) .brand .logo-neg{display:block}
.ft .w{align-items:center;padding-block:28px}
.ft-logo{display:block;margin-right:auto;padding:10px 0}
.ft-logo img{display:block;height:40px;width:auto}
.ft-adr{margin-right:24px}
@media (max-width:1024px){.brand .logo{height:40px}}
@media (max-width:720px){.ft .w{flex-direction:column;align-items:flex-start;gap:14px}.ft-adr{margin-right:0}}

/* Bildwechsel in 271/272 (mehrere Bilder im Bereich) */
.r26 :is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementPicture ~ .elementPicture{visibility:hidden;opacity:0}
.r26 .fade > .sectionInner > .elementPicture{transition:opacity 1400ms var(--ease),visibility 0s linear 1400ms}
.r26 .fade > .sectionInner > .elementPicture:not(.on){opacity:0;visibility:hidden}
.r26 .fade > .sectionInner > .elementPicture.on{opacity:1;visibility:visible;transition:opacity 1400ms var(--ease),visibility 0s}
.r26 .fade-ui{grid-row:1;align-self:end;justify-self:end;z-index:3;display:flex;align-items:center;gap:2px;margin:0 0 14px !important;padding:0 14px;font:500 .8125rem/1 var(--cond);color:#fff}
.r26 .elementSection_var271 .fade-ui{grid-column:1 / -1}
.r26 .elementSection_var272 .fade-ui{grid-column:3 / -1}
.r26 .fade-n{padding:9px 10px;background:rgba(21,22,23,.55);letter-spacing:.04em}
.r26 .fade-b{appearance:none;border:0;margin:0;padding:9px 12px;background:rgba(21,22,23,.55);color:#fff;font:inherit;cursor:pointer;transition:background var(--t-ui,200ms) var(--ease)}
.r26 .fade-b:hover{background:var(--accent)}
.r26 .fade-b:focus-visible{outline:2px solid #fff;outline-offset:-4px}
@media (max-width:1024px){.r26 .elementSection_var272 .fade-ui{grid-column:2 / -1}}
@media (max-width:720px){
  .r26 .elementSection:is(.elementSection_var271,.elementSection_var272) > .sectionInner > .elementPicture,.r26 .elementSection:is(.elementSection_var271,.elementSection_var272) > .sectionInner > .fade-ui{grid-row:1 !important}
  .r26 .elementSection:is(.elementSection_var271,.elementSection_var272) > .sectionInner > .fade-ui{grid-column:1 / -1 !important;padding:0}
  .r26 .elementSection.elementSection_var272 > .sectionInner > .elementPicture{margin-left:calc(-1 * var(--m)) !important;margin-right:calc(-1 * var(--m)) !important}
  .r26 .fade-next{display:none}
}
@media (prefers-reduced-motion:reduce){.r26 .fade > .sectionInner > .elementPicture{transition:none !important}}

.r26 .elementSection_var270 .elementPicture div.picture,.r26 .elementSection_var270 .elementPicture .pictureFrameInner,.r26 .elementSection_var270 .elementPicture img{width:100% !important;max-width:none !important}
.r26 .elementSection_var270 .pictureSubtitle{border:0 !important;width:auto !important;background:none !important}

/* Bildelement: von Weblication gesetzte Rahmenbreiten aufheben, Bild fuellt immer die Rasterflaeche */
.r26 :is([class*="_var26"],[class*="_var27"]) .elementPicture div.picture,.r26 :is([class*="_var26"],[class*="_var27"]) .elementPicture .pictureFrameInner{display:block !important;width:auto !important;max-width:none !important;float:none !important}
.r26 :is([class*="_var26"],[class*="_var27"]) .elementPicture img{width:100% !important;max-width:none !important}

/* ===== R26 Folgeseiten (Fassung 16.10.2026), Layout-Varianten 274 bis 283 des Elements "Inhaltsbereich" =====
   274 Projektkopf: Ueberschrift (h1), Text mit Kurzangaben (je Absatz eine Angabe), Titelbild; mehrere Bilder blenden ueber
   275 Projekttext: erster Text = Beschreibung, alle weiteren Texte = Projektdaten (je Absatz: fett Bezeichnung, Umbruch, Wert)
   276 Bildfolge: beliebig viele Bilder im Wechselrhythmus, Bildunterschrift sichtbar
   277 Weitere Projekte: Ueberschrift und Projektliste als Karten
   278 Projektuebersicht: Ueberschrift (h1), Text, Kategorienfilter, Projektliste
   279 Textseite: Ueberschrift (h1), Texte in Lesebreite (Impressum, Datenschutz, Jobs)
   280 Meldung: Bild klein, Ueberschrift, Text (erster Absatz = Datum)
   281 Person: Name, Funktion, Text; optional Portraet
   282 Liste: Ueberschrift als Marke, Text mit Aufzaehlung zweispaltig
   283 Formular: Ueberschrift, Formular */

/* Basisregeln auch fuer Varianten 280 bis 289 */
.r26 .elementSection[class*="_var28"]{padding:var(--sec) 0 0 !important;margin:0 !important;background:none;border:0}
.r26 .elementSection[class*="_var28"] > .sectionInner{max-width:calc(var(--max) + 2*var(--m));margin:0 auto;padding:0 var(--m) !important;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gut);grid-auto-flow:row dense;align-items:start}
.r26 .elementSection[class*="_var28"] > .sectionInner > *{grid-column:1 / -1;min-width:0;margin:0;float:none;width:auto}
.r26 [class*="_var28"] .elementHeadline :is(h1,h2,h3){margin:0;padding:0;border:0;background:none;font-family:var(--sans);font-weight:500;font-size:var(--h2);line-height:1.08;letter-spacing:-.025em;color:inherit;text-transform:none;text-wrap:balance}
.r26 [class*="_var28"] .elementText{color:var(--anth);font-size:var(--body);line-height:1.62}
.r26 [class*="_var28"] .elementText p{margin:0 0 1em}
.r26 [class*="_var28"] .elementText p:last-child{margin-bottom:0}
.r26 [class*="_var28"] .elementText a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}
.r26 [class*="_var28"] .elementPicture > div,.r26 [class*="_var28"] .pictureFrameInner{width:auto !important;float:none !important;margin:0 !important;padding:0 !important;border:0 !important;background:none !important}
.r26 [class*="_var28"] .elementPicture div.picture{display:block !important;max-width:none !important}
.r26 [class*="_var28"] .elementPicture img{display:block;width:100% !important;height:auto !important;max-width:none !important;object-fit:cover;background:var(--warm)}
.r26 [class*="_var28"] .pictureSubtitle{width:auto !important;max-width:none !important;margin:10px 0 0;padding:0;background:none;border:0 !important;text-align:left;font:400 var(--cap)/1.45 var(--cond);color:var(--mute)}
.r26 [class*="_var27"] .pictureSubtitle{border:0 !important}
.r26 :is([class*="_var27"],[class*="_var28"]) .elementText strong{font-weight:500;color:var(--ink)}

/* Ruecksprung ueber dem Projektkopf (per Skript eingefuegt) */
.r26 .back{grid-column:1 / -1;grid-row:1;margin:0 0 clamp(20px,2.6vw,40px) !important;font:500 var(--cap)/1.4 var(--cond);letter-spacing:.02em}
.r26 .back a{color:var(--mute);text-decoration:none;transition:color var(--t-ui) var(--ease)}
.r26 .back a::before{content:"\2190";display:inline-block;margin-right:.5em;transition:transform var(--t-ui) var(--ease)}
.r26 .back a:hover{color:var(--accent)}
.r26 .back a:hover::before{transform:translateX(-3px)}

/* 274 Projektkopf */
.r26 .elementSection.elementSection_var274{padding-top:clamp(28px,4vw,64px) !important}
.r26 .elementSection_var274 > .sectionInner > .elementHeadline{grid-column:1 / span 10;grid-row:2}
.r26 .elementSection_var274 .elementHeadline :is(h1,h2){font-size:clamp(2.25rem,4.9vw,4.5rem);line-height:1.02;letter-spacing:-.033em;max-width:15em}
.r26 .elementSection_var274 > .sectionInner > .elementText,.r26 .elementSection_var274 .elementHeadline + .elementText{grid-column:1 / span 9;grid-row:3;margin-top:clamp(16px,1.8vw,26px);font:400 1.0625rem/1.5 var(--cond);color:var(--mute);letter-spacing:.005em}
.r26 .elementSection_var274 .elementText p{display:inline;margin:0}
.r26 .elementSection_var274 .elementText p + p::before{content:"/";margin:0 .65em;color:#b9bab4}
.r26 .elementSection_var274 > .sectionInner > .elementPicture{grid-column:1 / -1;grid-row:4;margin:clamp(32px,4.5vw,72px) calc(-1 * var(--m)) 0 0 !important;overflow:hidden}
.r26 .elementSection_var274 .elementPicture img{aspect-ratio:3 / 2;max-height:88vh;max-height:88svh}
.r26 .elementSection_var274 .pictureSubtitle,.r26 .elementSection_var276 .pictureSubtitle:empty{position:absolute;width:1px !important;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.r26 .elementSection_var274 > .sectionInner > .elementPicture ~ .elementPicture{visibility:hidden;opacity:0}
.r26 .elementSection_var274 > .sectionInner > .fade-ui{grid-column:1 / -1;grid-row:4;margin-right:calc(-1 * var(--m)) !important}
.js .r26 .elementSection_var274 > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{opacity:0;transform:scale(1.03);transition:opacity 1100ms var(--ease),transform 1800ms var(--ease)}
.js .r26 .elementSection_var274.in > .sectionInner > .elementPicture:not(.elementPicture ~ .elementPicture) img{opacity:1;transform:none}

/* 275 Projekttext */
.r26 .elementSection.elementSection_var275{padding-top:clamp(56px,7vw,120px) !important}
.r26 .elementSection_var275 > .sectionInner > .elementHeadline{grid-column:2 / span 6;grid-row:1;margin-bottom:clamp(20px,2vw,32px)}
.r26 .elementSection_var275 .elementHeadline :is(h1,h2,h3){font-size:clamp(1.5rem,2.3vw,2.125rem);line-height:1.18}
.r26 .elementSection_var275 > .sectionInner > .elementText:not(.elementText ~ .elementText),.r26 .elementSection_var275 > .sectionInner > .elementHeadline + .elementText:not(.elementText ~ .elementText){grid-column:2 / span 6;grid-row:1 / -1;margin-top:0;font:400 1.0938rem/1.68 var(--sans);color:var(--anth);max-width:36em}
.r26 .elementSection_var275 > .sectionInner > .elementText:not(.elementText ~ .elementText) p:first-child:not(:only-child){font-size:var(--lead);line-height:1.5;color:var(--ink);margin-bottom:1.1em}
.r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText{grid-column:9 / span 4;margin-bottom:clamp(32px,3.5vw,52px);font:400 .9688rem/1.45 var(--cond);color:var(--anth);display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gut)}
.r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText :is(h2,h3,h4){grid-column:1 / -1;margin:0;padding:0 0 10px;border-bottom:1px solid var(--ink);font:500 var(--cap)/1.4 var(--cond);letter-spacing:.02em;color:var(--ink)}
.r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText p{margin:0;padding:11px 0 12px;border-bottom:1px solid var(--line)}
.r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText p strong{display:block;margin-bottom:2px;font-weight:400;font-size:.8125rem;letter-spacing:.02em;color:var(--mute)}
.r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText p strong + br{display:none}
.r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText p.voll{grid-column:1 / -1}

.r26 .elementSection_var275 > .sectionInner:has(> .elementHeadline) > .elementText:not(.elementText ~ .elementText){grid-row:2 / -1}
.r26 .elementSection_var275 > .sectionInner{grid-template-rows:repeat(8,min-content) 1fr}
@media (max-width:720px){.r26 .elementSection_var275 > .sectionInner{grid-template-rows:none}}

/* 276 Bildfolge */
.r26 .elementSection.elementSection_var276{padding-top:clamp(56px,7vw,120px) !important}
.r26 .elementSection_var276 > .sectionInner{row-gap:clamp(28px,3.4vw,56px)}
.r26 .elementSection_var276 > .sectionInner > .elementHeadline{grid-column:1 / -1;padding-top:14px;border-top:1px solid var(--ink)}
.r26 .elementSection_var276 .elementHeadline :is(h1,h2,h3){font:500 var(--cap)/1.4 var(--cond) !important;letter-spacing:.02em;color:var(--ink)}
.r26 .elementSection_var276 > .sectionInner > .elementText{grid-column:1 / span 5;font-size:.9688rem}
.r26 .elementSection_var276 > .sectionInner > .elementPicture{grid-column:span 6}
.r26 .elementSection_var276 > .sectionInner > .elementPicture:nth-of-type(3n+1){grid-column:1 / span 7}
.r26 .elementSection_var276 > .sectionInner > .elementPicture:nth-of-type(3n+2){grid-column:9 / span 4;margin-top:clamp(0px,9vw,150px)}
.r26 .elementSection_var276 > .sectionInner > .elementPicture:nth-of-type(3n){grid-column:3 / span 8}
.r26 .elementSection_var276 > .sectionInner > .elementPicture:only-of-type,.r26 .elementSection_var276.wide > .sectionInner > .elementPicture{grid-column:1 / -1;margin-top:0}
.r26 .elementSection_var276 .elementPicture img{object-fit:contain;background:none}
.r26 .elementSection_var276 .elementPicture img[src$=".gif"],.r26 .elementSection_var276 .elementPicture img[src$=".png"]{background:#fff}

/* 277 Weitere Projekte und 278 Projektuebersicht: Projektliste als Karten */
.r26 .elementSection.elementSection_var277{padding-top:var(--sec) !important}
.r26 .elementSection_var277 > .sectionInner > .elementHeadline{grid-column:1 / -1;padding-top:14px;border-top:1px solid var(--ink);margin-bottom:clamp(24px,2.6vw,40px)}
.r26 .elementSection_var277 .elementHeadline :is(h1,h2,h3){font:500 var(--cap)/1.4 var(--cond) !important;letter-spacing:.02em;color:var(--ink)}
.r26 :is(.elementSection_var277,.elementSection_var278) .elementList{grid-column:1 / -1;margin:0 !important;padding:0 !important;width:auto !important;float:none !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .elementList ul{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,64px) var(--gut);margin:0 !important;padding:0 !important;list-style:none;width:auto !important;height:auto !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .elementList ul::before,.r26 :is(.elementSection_var277,.elementSection_var278) .elementList ul::after{display:none !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntry{position:relative;display:block !important;width:auto !important;height:auto !important;min-height:0 !important;margin:0 !important;padding:0 !important;float:none !important;border:0 !important;background:none !important;box-shadow:none !important;cursor:pointer;list-style:none}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryInner{display:flex !important;flex-direction:column;gap:14px;margin:0 !important;padding:0 !important;width:auto !important;height:auto !important;background:none !important;border:0 !important;box-shadow:none !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryThumbnailOuter{order:-1;display:block !important;float:none !important;width:auto !important;height:auto !important;margin:0 !important;padding:0 !important;overflow:hidden;background:var(--warm);border:0 !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryThumbnail{display:block;width:100% !important;height:auto !important;max-width:none !important;aspect-ratio:4 / 3;object-fit:cover;margin:0 !important;padding:0 !important;border:0 !important;transition:transform 900ms var(--ease)}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryTitle{margin:0 !important;padding:0 !important;font:500 1.0625rem/1.35 var(--sans) !important;letter-spacing:-.005em;text-transform:none !important;color:var(--ink);background:none !important;border:0 !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryTitle a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size var(--t-ui) var(--ease)}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryTitle a::after{content:"";position:absolute;inset:0}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntry:hover .listEntryTitle a,.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryTitle a:focus-visible{background-size:100% 1px}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntry:hover .listEntryThumbnail{transform:scale(1.03)}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryDescription,.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryDate,.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryMore{display:none !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .listPages,.r26 :is(.elementSection_var277,.elementSection_var278) .listNoEntries{grid-column:1 / -1;margin-top:28px}

/* 278 Projektuebersicht */
.r26 .elementSection.elementSection_var278{padding-top:clamp(40px,6vw,96px) !important;padding-bottom:clamp(24px,3vw,48px) !important}
.r26 .elementSection_var278 > .sectionInner > .elementHeadline{grid-column:1 / span 10}
.r26 .elementSection_var278 .elementHeadline :is(h1,h2){font-size:var(--h1);line-height:.98;letter-spacing:-.035em}
.r26 .elementSection_var278 > .sectionInner > .elementText{grid-column:1 / span 6;margin-top:clamp(24px,3vw,44px)}
.r26 .elementSection_var278 .elementHeadline + .elementText{font-size:var(--lead);line-height:1.45;color:var(--mute)}
.r26 .elementSection_var278 > .sectionInner > .elementCategoryFilterList{grid-column:1 / -1;margin:clamp(40px,5vw,72px) 0 clamp(32px,3.5vw,56px) !important;padding:0 !important;float:none !important;width:auto !important}
.r26 .elementSection_var278 .elementCategoryFilterList select{font:400 1rem var(--cond);padding:10px 36px 10px 0;border:0;border-bottom:1px solid var(--ink);background:transparent;color:var(--ink);border-radius:0}
.r26 .chips{display:flex;flex-wrap:wrap;gap:8px 22px;padding-top:14px;border-top:1px solid var(--ink)}
.r26 .chips button{appearance:none;background:none;border:0;margin:0;padding:6px 0;font:400 1rem/1.3 var(--cond);letter-spacing:.01em;color:var(--mute);cursor:pointer;min-height:44px;transition:color var(--t-ui) var(--ease)}
.r26 .chips button:hover{color:var(--ink)}
.r26 .chips button[aria-pressed="true"]{color:var(--ink);box-shadow:inset 0 -1px var(--accent)}
.r26 .js-chips select{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);opacity:0}

/* 279 Textseite */
.r26 .elementSection.elementSection_var279{padding-top:clamp(40px,6vw,96px) !important}
.r26 .elementSection_var279 + .elementSection_var279{padding-top:clamp(56px,7vw,112px) !important}
.r26 .elementSection_var279 > .sectionInner > .elementHeadline{grid-column:1 / span 10}
.r26 .elementSection_var279 > .sectionInner > .elementHeadline:not(.elementHeadline ~ .elementHeadline) :is(h1,h2){font-size:clamp(2.25rem,4.9vw,4.5rem);line-height:1.02;letter-spacing:-.033em}
.r26 .elementSection_var279 > .sectionInner > .elementHeadline ~ .elementHeadline{grid-column:3 / span 8;margin-top:clamp(48px,6vw,88px)}
.r26 .elementSection_var279 > .sectionInner > .elementHeadline ~ .elementHeadline :is(h1,h2,h3){font-size:clamp(1.5rem,2.3vw,2.125rem);line-height:1.15}
.r26 .elementSection_var279 > .sectionInner > .elementText,.r26 .elementSection_var279 .elementHeadline + .elementText{grid-column:3 / span 7;margin-top:clamp(28px,3.4vw,48px);font-size:var(--body);line-height:1.66;color:var(--anth);max-width:40em}
.r26 .elementSection_var279 > .sectionInner > .elementHeadline ~ .elementHeadline + .elementText{margin-top:20px}
.r26 .elementSection_var279 > .sectionInner > .elementText.lead,.r26 .elementSection_var279 > .sectionInner > .elementText p.lead{font-size:var(--lead);line-height:1.5;color:var(--ink)}
.r26 .elementSection_var279 .elementText :is(h2,h3){margin:2.2em 0 .6em;font:500 1.1875rem/1.35 var(--sans);letter-spacing:-.01em;color:var(--ink)}
.r26 .elementSection_var279 .elementText h4{margin:1.6em 0 .4em;font:500 var(--cap)/1.4 var(--cond);letter-spacing:.02em;color:var(--ink)}
.r26 .elementSection_var279 .elementText > :is(h2,h3,h4):first-child{margin-top:0}
.r26 .elementSection_var279 .elementText ul{display:block;margin:0 0 1em;padding:0;font:inherit;list-style:none}
.r26 .elementSection_var279 .elementText li{position:relative;padding:0 0 0 1.25em;margin:0 0 .35em}
.r26 .elementSection_var279 .elementText li::before{content:"";position:absolute;left:0;top:.82em;width:.6em;height:1px;background:var(--accent)}
.r26 .elementSection_var279 .elementText a{color:var(--ink);overflow-wrap:anywhere}
.r26 .elementSection_var279 > .sectionInner > .elementPicture{grid-column:3 / span 7;margin-top:clamp(28px,3.4vw,48px)}
.r26 .elementSection_var279 .elementPicture img[src*="powered-by"]{width:auto !important;max-width:150px !important;background:none}

/* 280 Meldung */
.r26 .elementSection.elementSection_var280{padding-top:0 !important}
.r26 .elementSection_var280 > .sectionInner::after{content:"";grid-column:1 / -1;grid-row:1;height:1px;background:var(--line);align-self:start}
.r26 .elementSection_var280 > .sectionInner{padding-bottom:clamp(36px,4vw,56px) !important}
.r26 .elementSection_var280 > .sectionInner > .elementHeadline{grid-column:4 / span 7;grid-row:2;margin-top:clamp(28px,3vw,40px)}
.r26 .elementSection_var280 .elementHeadline :is(h1,h2,h3){font-size:clamp(1.375rem,2vw,1.75rem);line-height:1.2}
.r26 .elementSection_var280 > .sectionInner > .elementText,.r26 .elementSection_var280 .elementHeadline + .elementText{grid-column:4 / span 7;margin-top:14px;font-size:var(--body);color:var(--anth);line-height:1.6}
.r26 .elementSection_var280 .elementText p.datum{font:500 var(--cap)/1.4 var(--cond);letter-spacing:.02em;color:var(--accent);margin-bottom:.6em}
.r26 .elementSection_var280 .elementText p.mehr a{color:var(--ink);font-weight:500}
.r26 .elementSection_var280 > .sectionInner > .elementPicture{grid-column:1 / span 2;grid-row:2 / span 3;margin-top:clamp(28px,3vw,40px)}
.r26 .elementSection_var280 .elementPicture img{aspect-ratio:4 / 3}
.r26 .elementSection_var280 .pictureSubtitle{display:none}

/* 281 Person */
.r26 .elementSection.elementSection_var281{padding-top:clamp(56px,7vw,104px) !important}
.r26 .elementSection_var281 > .sectionInner::before{content:"";grid-column:1 / -1;grid-row:1;height:1px;background:var(--ink);margin-bottom:clamp(20px,2.4vw,32px)}
.r26 .elementSection_var281 > .sectionInner > .elementHeadline{grid-column:1 / span 4;grid-row:2}
.r26 .elementSection_var281 .elementHeadline :is(h1,h2,h3){font-size:clamp(1.5rem,2.3vw,2.125rem);line-height:1.15}
.r26 .elementSection_var281 > .sectionInner > .elementHeadline + .elementText{grid-column:1 / span 4;grid-row:3;margin-top:10px;font:400 1rem/1.5 var(--cond);color:var(--mute)}
.r26 .elementSection_var281 > .sectionInner > .elementText ~ .elementText{grid-column:6 / span 6;grid-row:2 / span 4;color:var(--anth)}
.r26 .elementSection_var281 .elementText blockquote,.r26 .elementSection_var281 .elementText p.zitat{margin:0 0 1.4em;padding:0;font:400 var(--lead)/1.45 var(--sans);color:var(--ink);letter-spacing:-.01em}
.r26 .elementSection_var281 .elementText p.quelle{margin-top:-1em;font:400 var(--cap)/1.4 var(--cond);color:var(--mute)}
.r26 .elementSection_var281 .elementText ul{display:grid;gap:0;margin:0 0 1em;font:400 .9688rem/1.45 var(--cond)}
.r26 .elementSection_var281 .elementText li{padding:9px 0;border-top:1px solid var(--line)}
.r26 .elementSection_var281 > .sectionInner > .elementPicture{grid-column:1 / span 3;grid-row:4;margin-top:clamp(24px,3vw,40px)}
.r26 .elementSection_var281 .elementPicture img{aspect-ratio:4 / 5}

/* 282 Liste */
.r26 .elementSection.elementSection_var282{padding-top:clamp(64px,8vw,128px) !important}
.r26 .elementSection_var282 > .sectionInner > .elementHeadline{grid-column:1 / span 3;padding-top:.5em}
.r26 .elementSection_var282 .elementHeadline :is(h1,h2,h3){font:500 var(--cap)/1.4 var(--cond) !important;letter-spacing:.02em;color:var(--mute)}
.r26 .elementSection_var282 > .sectionInner > .elementText,.r26 .elementSection_var282 .elementHeadline + .elementText{grid-column:4 / span 9;grid-row:1;margin-top:0;font-size:var(--body);color:var(--anth)}
.r26 .elementSection_var282 .elementText ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gut);margin:0;font:400 1.0625rem/1.4 var(--sans)}
.r26 .elementSection_var282 .elementText li{padding:13px 0 14px;border-top:1px solid var(--line);color:var(--ink)}
.r26 .elementSection_var282 .elementText li span{display:block;margin-top:2px;font:400 .9375rem/1.4 var(--cond);color:var(--mute)}
.r26 .elementSection_var282 .elementText p{margin-top:1.4em}

/* 283 Formular */
.r26 .elementSection.elementSection_var283{padding-top:clamp(72px,9vw,144px) !important;padding-bottom:clamp(72px,8vw,120px) !important}
.r26 .elementSection_var283 > .sectionInner > .elementHeadline{grid-column:1 / span 4}
.r26 .elementSection_var283 .elementHeadline :is(h1,h2,h3){font-size:var(--h2);line-height:1.08}
.r26 .elementSection_var283 > .sectionInner > .elementText{grid-column:1 / span 4;margin-top:18px;color:var(--mute)}
.r26 .elementSection_var283 > .sectionInner > .elementForm{grid-column:6 / span 7;grid-row:1 / span 6;margin:0 !important;padding:0 !important;width:auto !important;float:none !important;background:none !important}
.r26 .elementSection_var283 form{margin:0;padding:0}
.r26 .elementSection_var283 dl.form{display:grid;grid-template-columns:1fr;gap:0;margin:0;padding:0}
.r26 .elementSection_var283 dl.form dt{float:none !important;width:auto !important;margin:22px 0 0 !important;padding:0 !important;text-align:left !important;font:500 var(--cap)/1.4 var(--cond);letter-spacing:.02em;color:var(--ink);display:flex;gap:var(--gut)}
.r26 .elementSection_var283 dl.form dt label{float:none !important;width:auto !important;margin:0 !important;padding:0 !important;font:inherit;color:inherit}
.r26 .elementSection_var283 dl.form dt label.S{flex:0 0 calc(40% - var(--gut) / 2)}
.r26 .elementSection_var283 dl.form dt label.L{flex:1}
.r26 .elementSection_var283 dl.form dt.blank{display:none}
.r26 .elementSection_var283 dl.form dd{float:none !important;width:auto !important;margin:6px 0 0 !important;padding:0 !important;display:flex;flex-wrap:wrap;gap:6px var(--gut);background:none !important}
.r26 .elementSection_var283 .formLabelStar{color:var(--accent);margin-left:2px}
.r26 .elementSection_var283 :is(input[type="text"],input[type="tel"],input[type="email"],textarea){flex:1 1 100%;width:100% !important;max-width:none !important;height:auto !important;margin:0 !important;padding:10px 0 11px !important;border:0 !important;border-bottom:1px solid #a9aaa6 !important;border-radius:0 !important;background:transparent !important;box-shadow:none !important;font:400 1.0625rem/1.4 var(--sans) !important;color:var(--ink);transition:border-color var(--t-ui) var(--ease)}
.r26 .elementSection_var283 input.S{flex:0 0 calc(40% - var(--gut) / 2)}
.r26 .elementSection_var283 input.L{flex:1 1 0}
.r26 .elementSection_var283 textarea{min-height:9.5em;resize:vertical}
.r26 .elementSection_var283 :is(input,textarea):focus{outline:0;border-bottom-color:var(--accent) !important}
.r26 .elementSection_var283 :is(input,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.r26 .elementSection_var283 :is(.wglRadio,.wglRadioFloat){display:inline-flex !important;align-items:center;gap:8px;float:none !important;margin:0 18px 0 0 !important;padding:6px 0 !important;width:auto !important;min-height:40px}
.r26 .elementSection_var283 :is(.wglRadio,.wglRadioFloat) label{margin:0 !important;padding:0 !important;float:none !important;width:auto !important;font:400 1rem/1.3 var(--sans);color:var(--anth);cursor:pointer}
.r26 .elementSection_var283 input[type="radio"]{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:18px !important;height:18px !important;margin:0 !important;padding:0 !important;border:1px solid #8d8e8a !important;border-radius:50% !important;background:#fff !important;cursor:pointer;transition:border-color var(--t-ui),box-shadow var(--t-ui)}
.r26 .elementSection_var283 input[type="radio"]:checked{border-color:var(--accent) !important;box-shadow:inset 0 0 0 4px #fff,inset 0 0 0 10px var(--accent)}
.r26 .elementSection_var283 .formButtons{margin-top:32px !important;gap:16px}
.r26 .elementSection_var283 .buttonReset{display:none !important}
.r26 .elementSection_var283 .buttonSubmit{appearance:none;margin:0 !important;padding:16px 28px !important;border:0 !important;border-radius:0 !important;background:var(--ink) !important;color:#fff !important;font:500 1rem/1 var(--sans) !important;cursor:pointer;width:auto !important;height:auto !important;transition:background var(--t-ui) var(--ease)}
.r26 .elementSection_var283 .buttonSubmit:hover{background:var(--accent) !important}
.r26 .elementSection_var283 dd.full p{margin:18px 0 0;font-size:.875rem;line-height:1.55;color:var(--mute);max-width:42em}
.r26 .elementSection_var283 dd.full a{color:var(--ink);background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}
.r26 .elementSection_var283 .requiredFormfield{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden}
.r26 .elementSection_var283 :is(.formError,.error,.wglFormError,.formErrorMessage){color:var(--accent)}

/* Kontaktseite: Anschrift im Einstieg (Variante 261 mit HTML-Element) */
.r26 .elementSection_var261 > .sectionInner > .elementScript{grid-column:1 / span 5;margin-top:clamp(40px,6vw,96px);font-size:1.125rem;line-height:1.55;color:var(--ink)}
.r26 .elementSection_var261 > .sectionInner > .elementScript strong{display:block;margin-bottom:6px;font:500 var(--cap)/1.4 var(--cond);letter-spacing:.02em;color:var(--mute)}
.r26 .elementSection_var261 > .sectionInner > .elementScript p + p{margin-top:16px}
.r26 .elementSection_var261 > .sectionInner > .elementScript small{display:block;font-size:.8125rem;line-height:1.5;color:var(--mute);max-width:34em}
.r26 .elementSection_var261 > .sectionInner > .elementScript a{color:var(--ink);background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}
.r26 .elementSection_var261 > .sectionInner > .elementScript + .elementText{margin-top:28px;font-size:1.125rem;color:var(--ink)}

/* Tablet */
@media (max-width:1024px){
  .r26 .elementSection_var274 > .sectionInner > .elementHeadline{grid-column:1 / -1}
  .r26 .elementSection_var275 > .sectionInner > .elementHeadline,.r26 .elementSection_var275 > .sectionInner > .elementText:not(.elementText ~ .elementText){grid-column:1 / span 7 !important}
  .r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText{grid-column:9 / -1;grid-template-columns:1fr}
  .r26 :is(.elementSection_var277,.elementSection_var278) .elementList ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .r26 .elementSection_var278 > .sectionInner > .elementText{grid-column:1 / span 9}
  .r26 .elementSection_var279 > .sectionInner > :is(.elementText,.elementPicture,.elementHeadline ~ .elementHeadline),.r26 .elementSection_var279 .elementHeadline + .elementText{grid-column:2 / span 10}
  .r26 .elementSection_var280 > .sectionInner > .elementPicture{grid-column:1 / span 3}
  .r26 .elementSection_var280 > .sectionInner > :is(.elementHeadline,.elementText){grid-column:5 / -1}
  .r26 .elementSection_var281 > .sectionInner > .elementHeadline,.r26 .elementSection_var281 > .sectionInner > .elementHeadline + .elementText{grid-column:1 / span 5}
  .r26 .elementSection_var281 > .sectionInner > .elementText ~ .elementText{grid-column:7 / -1}
  .r26 .elementSection_var282 > .sectionInner > .elementHeadline{grid-column:1 / -1;margin-bottom:16px;padding-top:0}
  .r26 .elementSection_var282 > .sectionInner > .elementText,.r26 .elementSection_var282 .elementHeadline + .elementText{grid-column:1 / -1;grid-row:auto}
  .r26 .elementSection_var283 > .sectionInner > :is(.elementHeadline,.elementText){grid-column:1 / -1}
  .r26 .elementSection_var283 > .sectionInner > .elementForm{grid-column:1 / span 10;grid-row:auto;margin-top:40px !important}
  .r26 .elementSection_var261 > .sectionInner > .elementScript{grid-column:1 / span 7}
}

/* Smartphone */
@media (max-width:720px){
  .r26 .elementSection.elementSection_var274 > .sectionInner > .back{grid-row:1 !important}
  .r26 .elementSection.elementSection_var274 > .sectionInner > .elementHeadline{grid-row:2 !important}
  .r26 .elementSection.elementSection_var274 > .sectionInner > .elementText{grid-row:3 !important}
  .r26 .elementSection.elementSection_var274 > .sectionInner > :is(.elementPicture,.fade-ui){grid-row:4 !important;margin-left:calc(-1 * var(--m)) !important;margin-right:calc(-1 * var(--m)) !important}
  .r26 .elementSection.elementSection_var274 > .sectionInner > .fade-ui{padding:0 !important}
  .r26 .elementSection_var274 .elementPicture img{aspect-ratio:4 / 3}
  .r26 .elementSection_var274 .elementText p{display:block}
  .r26 .elementSection_var274 .elementText p + p::before{display:none}
  .r26 .elementSection_var275 > .sectionInner > .elementText ~ .elementText{margin-top:40px;grid-template-columns:1fr 1fr}
  .r26 .elementSection.elementSection_var276 > .sectionInner > .elementPicture{margin:0 !important}
  .r26 .elementSection.elementSection_var276 > .sectionInner > .elementPicture:nth-of-type(3n+1){margin-left:calc(-1 * var(--m)) !important;margin-right:calc(-1 * var(--m)) !important}
  .r26 .elementSection_var276 > .sectionInner > .elementPicture:nth-of-type(3n+1) .pictureSubtitle{padding:0 var(--m)}
  .r26 :is(.elementSection_var277,.elementSection_var278) .elementList ul{grid-template-columns:1fr;row-gap:40px}
  .r26 .chips{gap:0 18px}
  .r26 .elementSection.elementSection_var280 > .sectionInner > .elementPicture{grid-column:1 / span 6 !important;margin-top:28px !important;margin-left:0 !important;margin-right:0 !important}
  .r26 .elementSection.elementSection_var281 > .sectionInner::before{grid-row:auto !important}
  .r26 .elementSection_var281 > .sectionInner > .elementText ~ .elementText{margin-top:28px}
  .r26 .elementSection.elementSection_var281 > .sectionInner > .elementPicture{grid-column:1 / span 8 !important;margin-left:0 !important;margin-right:0 !important}
  .r26 .elementSection_var282 .elementText ul{grid-template-columns:1fr}
  .r26 .elementSection_var283 dl.form dt{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .js .r26 .elementSection_var274 > .sectionInner > .elementPicture img{opacity:1 !important;transform:none !important;transition:none !important}
  .r26 :is(.elementSection_var277,.elementSection_var278) .listEntryThumbnail{transition:none}
}
@media print{
  .hd,.ft nav,.fade-ui,.chips,.back{display:none !important}
  .r26 .elementSection > .sectionInner{display:block !important}
}

/* 276 Ergaenzung: Hochformate schmaler, Bildunterschrift nur in Bereichen mit Ueberschrift (z. B. Plaene), Plaene in voller Breite */
.r26 .elementSection_var276 > .sectionInner > .elementPicture.hoch:nth-of-type(3n+1){grid-column:2 / span 4}
.r26 .elementSection_var276 > .sectionInner > .elementPicture.hoch:nth-of-type(3n){grid-column:6 / span 4}
.r26 .elementSection_var276:not(:has(> .sectionInner > .elementHeadline)) .pictureSubtitle{position:absolute;width:1px !important;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.r26 .elementSection_var276:has(> .sectionInner > .elementHeadline) > .sectionInner > .elementPicture{grid-column:2 / span 10 !important;margin-top:0 !important}
@media (max-width:720px){.r26 .elementSection_var276 > .sectionInner > .elementPicture.hoch{grid-column:1 / -1 !important}.r26 .elementSection_var276:has(> .sectionInner > .elementHeadline) > .sectionInner > .elementPicture{grid-column:1 / -1 !important}}

@media (max-width:720px){
  .r26 .elementSection.elementSection_var275 > .sectionInner > :is(.elementHeadline,.elementText){grid-column:1 / -1 !important;grid-row:auto !important}
  .r26 .elementSection.elementSection_var275 > .sectionInner > .elementText:not(.elementText ~ .elementText){font-size:1.0625rem}
}
.r26 .elementSection.elementSection_var277{padding-bottom:clamp(72px,8vw,128px) !important}

.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryTitle,.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryTitle a{visibility:visible !important;opacity:1 !important;position:static;transform:none !important;height:auto !important}
.r26 :is(.elementSection_var277,.elementSection_var278) .listEntry,.r26 :is(.elementSection_var277,.elementSection_var278) .listEntryInner{overflow:visible !important}

.r26 :is(.elementSection_var275,.elementSection_var281,.elementSection_var282,.elementSection_var273) .elementText li{background:none !important;list-style:none}
.r26 :is(.elementSection_var275,.elementSection_var281,.elementSection_var282,.elementSection_var273) .elementText li::before{content:none !important;display:none !important}
.r26 .elementSection_var275 .elementText:not(.elementText ~ .elementText) ul{display:block;margin:0 0 1em;font:inherit}
.r26 .elementSection_var275 .elementText:not(.elementText ~ .elementText) li{position:relative;padding-left:1.25em;margin-bottom:.3em}
.r26 .elementSection_var275 .elementText:not(.elementText ~ .elementText) li::after{content:"";position:absolute;left:0;top:.85em;width:.6em;height:1px;background:var(--accent)}

.r26 .elementSection_var283 dl.form dd.formButtons{position:static !important;top:auto !important;right:auto !important;width:auto !important;height:auto !important;display:block !important}
.r26 .elementSection_var283 .buttonSubmit{display:inline-block !important;position:static !important;float:none !important;min-height:0 !important;text-transform:none !important;letter-spacing:0 !important}
.r26 .elementSection_var261 > .sectionInner > .elementScript strong{font-style:normal}

.r26 .elementSection_var283 dl.form dd.formButtons{text-align:left !important}

@media (max-width:720px){.r26 .elementSection.elementSection_var283 > .sectionInner > .elementForm{grid-column:1 / -1 !important}}
