:root {
 /* Industrial greys: dominant neutral background, pale grey reading surface, navy and limited orange */
 --paper:#afb2b1;--sheet:#e9ebe9;--blue:#173b5c;--ink:#202b2f;--muted:#47545b;--orange:#bf5717;--line:#969c9d;--shade:#c8cccb;
 /* Eine einzige maximale Breite fuer ALLE aeußeren Rechtecke. */
 --site-max:1120px;
 /* Identischer innerer Rand: alle Textinhalte beginnen auf einer Flucht. */
 --content-pad:2rem;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:1.5rem}
body{margin:0;background:var(--paper);font:16px/1.63 "Liberation Sans",Arial,Helvetica,sans-serif;color:var(--ink)}
a{color:var(--blue);text-underline-offset:3px}
a:hover{text-decoration-color:var(--orange)}
a:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:"Liberation Sans",Arial,Helvetica,sans-serif;line-height:1.2;hyphens:auto}
h1{font-size:clamp(2.1rem,4.2vw,3.65rem);letter-spacing:-.027em;color:var(--blue);margin:.3rem 0 1rem}
h2{font-size:clamp(1.5rem,2.25vw,2.2rem);color:var(--blue);margin:0 0 1rem}
h3{font-size:1.16rem;color:var(--blue);margin:1.2rem 0 .35rem}
h4{font-size:1.01rem;color:var(--blue);margin:1.2rem 0 .3rem}
p{margin:.65rem 0 1rem}ul,ol{padding-left:1.35rem}li{padding:.12rem 0}strong{font-weight:750}
/* Kopf, Navigation, alle Inhaltsboxen, Referenzen und Fuss: exakt gleiche Aussenbreite. */
.site-header,#main,.site-footer{width:min(calc(100% - 1.5rem),var(--site-max));max-width:var(--site-max);margin-inline:auto}
/* .wrap schrumpft nicht mehr ein zweites Mal: verschachtelte Boxen bleiben bündig. */
.wrap{width:100%;max-width:none;margin-inline:auto}
/* Text selbst erhaelt dennoch einen durchgehenden Abstand zum Boxrand. */
.microbar,.masthead,.nav-inner,.footer-inner,.foot-bottom,
.page-head,.page-intro,.section-break>.wrap,.link-strip,
.reference-sections,.reference-photo-section{padding-inline:var(--content-pad)}
.skip{position:absolute;left:.7rem;top:-6rem;background:var(--orange);color:#111;padding:.65rem 1rem;z-index:100}.skip:focus{top:.5rem}
.site-header{background:#c9ccca;border-bottom:1px solid #909797}
.microbar{display:flex;justify-content:space-between;gap:1rem;padding:.37rem 0;font-size:.8rem;color:var(--muted);border-bottom:1px solid var(--line)}
.microbar a{margin-left:.55rem}.microbar-links{white-space:nowrap}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.35rem 0}
.brand{display:inline-flex;width:min(350px,65vw);flex:none}.brand img{width:100%}
.brand-aside{font-size:.87rem;color:var(--blue);font-weight:650;text-align:right}.brand-aside span{color:var(--orange);padding:.15rem}
.main-nav{border-top:1px solid var(--line);background:#a6acab}.nav-inner{display:flex;align-items:center;flex-wrap:wrap;gap:0}
.main-nav a{display:inline-block;padding:.73rem 1.08rem;text-decoration:none;font-size:.91rem;font-weight:700;border-bottom:3px solid transparent}
.main-nav a:hover,.main-nav a[aria-current="page"]{border-color:var(--orange);background:#e8eae8}
.surface{background:#d8dbd9;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.page-head{padding:3rem 0 2.6rem}.kicker{text-transform:uppercase;letter-spacing:.095em;font-size:.77rem;color:var(--orange);font-weight:800;margin:0 0 .6rem}
.lede{font-size:1.17rem;line-height:1.57;max-width:66ch;color:#313c43}
.lede strong{color:var(--blue)}
.provenance{font-size:.9rem;color:var(--muted);border-left:3px solid var(--orange);padding:.3rem 0 .3rem .9rem;max-width:75ch;margin-top:1.3rem}
.hero-figure{margin:0 auto 0;max-width:100%;padding-top:35px;background:#c2c5c3;border:1px solid var(--line)}
.hero-figure img{width:100%;height:auto;object-fit:contain;max-height:490px}
.hero-figure figcaption{color:var(--muted);font-size:.76rem;padding:.5rem .5rem;text-align:right}
.page-intro{padding:2.4rem 0}.two-intro{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
.hairline-title{border-bottom:2px solid var(--blue);padding-bottom:.8rem;margin-top:0}
.toc{border-top:3px solid var(--orange);border-bottom:1px solid var(--line);padding:1.35rem 1.6rem 1.55rem;margin:1.6rem auto 2rem;background:#d7dad8}
.toc h2{font-size:1.02rem;text-transform:uppercase;letter-spacing:.06em;margin:0 0 .8rem}
.toc ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.25rem 1.75rem}
.toc a{display:block;padding:.4rem 0;border-bottom:1px solid var(--line);font-weight:600;font-size:.91rem;line-height:1.35;text-decoration:none}.toc a:hover{border-color:var(--orange)}
.qa-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2.8rem;align-items:start;background:var(--sheet);padding:1.4rem 2rem 1.8rem;border:1px solid var(--line)}
.qa{padding:1.7rem 0 1.9rem;border-top:2px solid var(--blue);break-inside:avoid;scroll-margin-top:1rem}
.qa h2{font-size:clamp(1.35rem,2vw,1.7rem);margin:0 0 .75rem}
.qa .answer{font-size:1.075rem;line-height:1.5;color:var(--blue);font-weight:760;margin:.3rem 0 1.15rem;padding-left:.85rem;border-left:4px solid var(--orange)}
.qa h3{font-size:.98rem;margin-top:1.25rem;margin-bottom:.25rem;color:var(--blue);font-weight:800}
.qa p,.qa ul,.qa ol{margin:.6rem 0 1rem}
.qa .note{border-top:1px solid var(--line);padding-top:.7rem;color:var(--muted);font-size:.92rem}
.wide-section{padding:2rem 1.8rem 3rem;border-top:2px solid var(--blue);background:var(--sheet);margin-top:1.5rem;margin-bottom:1.5rem}
.wide-section>h2{margin-bottom:.6rem}.wide-section .answer{max-width:82ch;color:var(--blue);font-weight:750;font-size:1.1rem;border-left:4px solid var(--orange);padding-left:.8rem}
.comparison{width:100%;border-collapse:collapse;margin:1rem 0 1.4rem;font-size:.93rem}
.comparison caption{text-align:left;font-weight:bold;margin-bottom:.5rem;color:var(--blue)}
.comparison th,.comparison td{text-align:left;vertical-align:top;padding:.7rem .65rem;border-bottom:1px solid var(--line)}
.comparison th{background:#c9ced0;color:var(--blue)}
.link-strip{padding:1.1rem 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:.6rem 1.9rem}
.link-strip a{font-weight:bold;text-decoration:none;border-bottom:2px solid var(--orange);padding-bottom:.15rem}
.section-break{background:#c9cdcc;padding:1.8rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.factual-block{border-left:4px solid var(--orange);padding:.35rem 1.2rem;background:#f1f2f0;margin:1.3rem 0}
.plain-link{color:var(--blue);font-weight:750}
.origin-stamp{font-size:.93rem;font-weight:750;color:var(--blue);margin-top:1.3rem}
.system-mark{width:min(290px,75%);margin-bottom:1.5rem}
.ar-heading{text-align:right;direction:rtl;font-family:Tahoma,Arial,"Noto Naskh Arabic",sans-serif;line-height:1.55;unicode-bidi:isolate}
.page--gulf .qa{border-top-color:var(--orange)}.page--gulf .qa h2{font-size:1.6rem}
.page--gulf .english-subhead{text-transform:uppercase;letter-spacing:.04em;font-size:.75rem;color:var(--muted);font-weight:800;margin:-.2rem 0 .65rem}
.field-note{font-size:.86rem;color:var(--muted)}
.site-footer{margin-top:3rem;background:#36464f;color:#f5f6f4}.footer-inner{display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:2.8rem;padding:2.35rem 0}.site-footer strong{color:#fff}.site-footer p{margin:.55rem 0;color:#e0e3e5}.site-footer p.small{font-size:.89rem;line-height:1.5}.site-footer a{color:#fff}.foot-links a{display:block;margin:.28rem 0}.foot-bottom{border-top:1px solid #677078;display:flex;justify-content:space-between;padding:.9rem 0;font-size:.82rem}
@media(max-width:930px){.toc ul{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-aside{max-width:300px}.qa-grid{gap:0 1.5rem}}
@media(max-width:720px){:root{--content-pad:1rem}.site-header,#main,.site-footer{width:100%}.wrap{width:100%}.microbar{flex-wrap:wrap}.masthead{align-items:flex-start;flex-direction:column;gap:.55rem}.brand-aside{text-align:left}.nav-inner{flex-wrap:nowrap;overflow:auto;white-space:nowrap}.main-nav a{padding:.72rem .8rem}.page-head{padding:2rem 0}.page-intro{padding:1.7rem 0}.two-intro,.qa-grid,.footer-inner{grid-template-columns:1fr}.toc ul{grid-template-columns:1fr}.qa{padding:1.5rem 0}.footer-inner{gap:.8rem}.hero-figure figcaption{text-align:left}.comparison{font-size:.85rem}.comparison th,.comparison td{padding:.6rem .4rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{body{background:#fff;font-size:10pt;--content-pad:0}.site-header,#main,.site-footer{width:100%;max-width:none}.site-header,.site-footer,.toc,.link-strip,.skip{display:none}.wrap{width:100%}.qa-grid{gap:0 1.5rem}.qa{page-break-inside:avoid}a{color:#000;text-decoration:none}}

/* TP·VAS reference and tank-only project documentation — version 2 */
.language-notice{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem 1.4rem;margin-top:1.1rem;margin-bottom:.8rem;padding:.8rem 1.05rem;background:#dee1df;border-left:5px solid var(--orange);font-weight:700;color:var(--blue)}
.language-notice a{font-weight:800;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.project-intro{max-width:75ch}
.project-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;margin:1.5rem 0 2rem}
.project-card{background:var(--sheet);border:1px solid var(--line);border-top:3px solid var(--blue);padding:1.1rem 1.15rem;min-width:0}
.project-card h2{font-size:1.2rem;margin:.25rem 0 .6rem}
.project-card p{font-size:.94rem;margin:.45rem 0 .65rem;color:var(--muted)}
.project-card a{font-weight:750}
.project-card .small{font-size:.81rem}
.project-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.15rem 1.9rem;margin:1.1rem 0 1.8rem;background:var(--sheet);border-block:1px solid var(--line);padding:1rem 1.3rem}
.project-facts>div{min-width:0;padding:.45rem 0;border-bottom:1px solid #c8cccc}
.project-facts dt{font-size:.84rem;font-weight:750;color:var(--blue);margin-bottom:.1rem}
.project-facts dd{margin:0;overflow-wrap:anywhere}
.placeholder-value{color:var(--muted);font-style:italic}
.photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.15rem;margin:1.25rem 0 2rem}
.photo-figure{margin:0;min-width:0}
.photo-slot{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.5rem;padding:1.2rem;border:2px dashed #8d979a;background:linear-gradient(135deg,#d7dbd9,#c4c9c7);color:#43525e;text-align:center}
.photo-slot .slot-number{font-size:1rem;font-weight:800;color:var(--blue)}
.photo-slot .slot-note{font-size:.82rem;line-height:1.45}
.photo-real{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#cdd1cf}
.photo-figure figcaption{font-size:.9rem;color:var(--muted);margin:.4rem .15rem .65rem}
.reference-index{padding:1.5rem;background:#d6dad9;border-left:5px solid var(--orange);margin:1.1rem 0 2rem}
.reference-index h2{font-size:1.35rem;margin:0 0 .5rem}
.reference-index a{font-weight:750}
.reference-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.9rem}
.reference-sections .qa{border-top-color:var(--blue)}
.reference-photo-section{margin:2rem 0 2.5rem;border-top:2px solid var(--blue);padding-top:1.4rem}
.reference-photo-section h2{font-size:1.45rem}
.reference-photo-section .photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.project-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.reference-photo-section .photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.project-cards,.reference-sections,.project-facts{grid-template-columns:1fr}.language-notice{align-items:flex-start}.reference-photo-section .photo-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.photo-grid,.reference-photo-section .photo-grid{grid-template-columns:1fr}.project-facts{padding:.7rem 1rem}.photo-slot{min-height:170px}}

/* Narrow screens: grey surroundings and readable article margins stay visible. */
@media(max-width:720px){.qa-grid{padding:1rem 1rem 1.4rem}.toc{padding:1rem 1rem 1.2rem}.wide-section{padding:1.5rem 1rem 2rem}}


/* V5: Ein durchgehender horizontaler Satzspiegel innerhalb gleich breiter Boxen.
   Absichtlich ganz am Ende: fruehere padding-Kurzformen duerfen das nicht aufheben. */
.microbar,.masthead,.nav-inner,.footer-inner,.foot-bottom,
.page-head,.page-intro,.section-break>.wrap,.link-strip,
.reference-sections,.reference-photo-section,
.qa-grid,.toc,.wide-section,.reference-index,.language-notice {
  padding-inline:var(--content-pad);
}
/* Lange zusammengesetzte deutsche Ueberschriften duerfen auf sehr kleinen
   Displays keinen horizontalen Ueberlauf ausloesen. */
h1,h2,h3,h4{overflow-wrap:anywhere}


/* V6 – dezente Herkunftsrubrik auf TP·VAS, statt grossflaechigem Personenbild. */
.tp-origin{display:grid;grid-template-columns:minmax(0,1fr) 210px;
  gap:2.1rem;align-items:center;padding:2rem var(--content-pad);
  background:var(--sheet);border-top:2px solid var(--blue);border-bottom:1px solid var(--line);
  margin:1.5rem auto;}
.tp-origin h2{margin:.2rem 0 .7rem;}
.tp-origin .answer{font-size:1.05rem;font-weight:750;color:var(--blue);
  padding-left:.8rem;border-left:4px solid var(--orange);}
.tp-origin p{max-width:77ch;}
.tp-origin figure{width:100%;max-width:210px;justify-self:end;margin:0;}
.tp-origin img{display:block;width:100%;height:auto;border:1px solid var(--line);}
.tp-origin figcaption{font-size:.75rem;color:var(--muted);margin-top:.35rem;line-height:1.45;}
@media(max-width:720px){.tp-origin{grid-template-columns:minmax(0,1fr);gap:.7rem;
  padding:1.5rem var(--content-pad)}.tp-origin figure{max-width:160px;justify-self:start}}

/* Auch technische Tabellen duerfen auf 320-px-Telefonen
   die einheitliche Inhaltsbreite nicht aufsprengen. */
@media(max-width:480px){.comparison{display:block;max-width:100%;overflow-x:auto;
  -webkit-overflow-scrolling:touch}}

/* Spalten mit breiten technischen Tabellen muessen schrumpfen duerfen. */
@media(max-width:720px){.qa-grid{grid-template-columns:minmax(0,1fr)}.qa{min-width:0}}

h1, h2, h3, h4, .main-nav a {    font-family: "DejaVu Sans", Arial, sans-serif;}
h1 {    font-weight: 700;    letter-spacing: -0.015em;}
h2 {    font-weight: 700;    letter-spacing: -0.01em;}

/* TP·VAS – Titelfoto Behälter 14 (deutsche Systemseite) */
.tp-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .9fr);
  gap: clamp(1.2rem, 3vw, 2.1rem);
  align-items: center;
}
.tp-hero-copy { min-width: 0; }
.tp-hero-photo { margin: 0; min-width: 0; }
.tp-hero-photo a { display: block; }
.tp-hero-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--line);
}
.tp-hero-photo figcaption {
  color: var(--muted);
  font-size: .83rem;
  line-height: 1.4;
  margin: .4rem 0 0;
}
@media (max-width: 900px) {
  .tp-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .tp-hero-photo { width: 100%; max-width: 440px; }
}

