/* Schriften und Symbole – lokal aus site/assets/fonts/, nicht von fremden CDNs.
   Bis zum 19.09.2026 lud jede Seite Inter von fonts.googleapis.com und
   Boxicons von unpkg.com; beides übertrug die IP-Adresse jedes Besuchers an
   Dritte. Die Dateien liegen jetzt im Webroot, die <head>-Blöcke sind leer
   davon, und tests/keine-fremdquellen.sh hält den Zustand fest.

   Inter v20, SIL Open Font License 1.1, von fonts.gstatic.com geholt.
   Eine Datei je unicode-range, beide variabel über den ganzen Gewichtsbereich –
   Google liefert für 400/500/600/700 denselben variablen Schnitt aus, deshalb
   steht hier eine Regel mit "font-weight:100 900" statt vier gleichen. Die
   Seite braucht heute 400 bis 700; angegeben ist die Achse der Datei, damit
   ein späteres font-weight:800 nicht an dieser Zeile hängenbleibt.
   latin-ext trägt heute kein Zeichen des Textes; der Browser holt die Datei
   nur, wenn eines auftaucht (z. B. ein polnischer Name), und bis dahin kostet
   sie nichts. */
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url(assets/fonts/inter-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url(assets/fonts/inter-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* Boxicons 2.1.4 (Icons CC BY 4.0, Code MIT), Schriftdatei unverändert von
   unpkg.com geholt. Sie trägt alle rund 1500 Zeichen; benannt sind hier nur
   die acht, die diese Seite benutzt – die Stelle, an der eine neue dazukommt.
   font-display:block, damit statt des Symbols nichts steht und nicht das
   Ersatzzeichen der Textschrift. Wer hier eine Klasse vergisst, fällt
   tests/keine-fremdquellen.sh auf. */
@font-face{
  font-family:boxicons;
  font-style:normal;
  font-weight:400;
  font-display:block;
  src:url(assets/fonts/boxicons.woff2) format('woff2');
}
.bx{font-family:boxicons!important;font-weight:400;font-style:normal;font-variant:normal;
  line-height:1;display:inline-block;text-transform:none;text-rendering:auto;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.bx-check:before{content:"\ea41"}
.bx-chevron-right:before{content:"\ea50"}
.bx-chip:before{content:"\ea5a"}
.bx-code-block:before{content:"\ea6a"}
.bx-compass:before{content:"\ea7f"}
.bx-link-external:before{content:"\eb3e"}
.bx-menu:before{content:"\eb5f"}
.bx-x:before{content:"\ec8d"}

/* Kowalczyk GmbH – Version 1 „Klar“
   Apple-nahes, helles Konzept: Weiß, Hellgrau, Tinte, ein tiefblauer Akzent.
   --ink3 war #86868b (3,6:1 auf Weiß) und ist seit NetPicker Lauf 74 so weit
   gedunkelt, dass es auf --bg und --bg2 4,5:1 hält (tests/kontrast.sh). */
:root{
  --bg:#ffffff; --bg2:#fafafa; --ink:#1d1d1f; --ink2:#6e6e73; --ink3:#707075;
  --line:#d2d2d7; --accent:#0f766e; --accent-dark:#0b5f59; --accent-light:#7fd1c5; --link:#0f766e; --dark:#111113;
  --font:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --wrap:1180px; --gutter:clamp(20px,5vw,64px);
  --ease:cubic-bezier(.22,.61,.36,1); --dur:.9s;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.5;
  font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-weight:600;letter-spacing:-.025em;line-height:1.08}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.wrap--narrow{max-width:820px}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.lead{font-size:clamp(19px,2.2vw,24px);color:var(--ink2);line-height:1.45;max-width:38em}
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border-radius:999px;
  background:var(--accent);color:#fff;font-weight:500;font-size:16px;transition:transform .35s var(--ease),background .3s}
.btn:hover{background:var(--accent-dark);text-decoration:none;transform:translateY(-1px)}
.btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn--ghost:hover{background:var(--bg2);color:var(--ink)}
.btn--ghost:hover{background:var(--bg2)}
.btn--light{background:#fff;color:var(--ink)}
.btn--light:hover{background:#eee}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--link)}
.link i{font-size:20px;transition:transform .3s var(--ease)}
.link:hover i{transform:translateX(3px)}
.link:hover{text-decoration:none}

/* Navigation ---------------------------------------------------------- */
.nav{position:fixed;inset:0 0 auto 0;height:52px;z-index:50;display:flex;align-items:center;
  background:rgba(255,255,255,.72);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.nav.is-scrolled{border-bottom-color:rgba(0,0,0,.08)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;width:100%}
.brand{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:17px;color:var(--ink2);letter-spacing:0;display:flex;align-items:center;gap:8px}
.brand:hover{text-decoration:none}
.brand__mark{font-weight:600;letter-spacing:-.02em}
.brand small{font-weight:400;color:var(--accent)}
.nav__links{display:flex;gap:34px;list-style:none;align-items:center}
/* Abgeschwächt über die Farbe, nicht über opacity: #3f3f41 ist --ink zu 85 %
   auf Weiß, wie vorher – aber .ext (--ink2) blieb unter opacity bei 3,7:1. */
.nav__links a{color:#3f3f41;font-size:14px;font-weight:400;transition:color .2s}
.nav__links a:hover,.nav__links a.is-active{color:var(--ink);text-decoration:none}
.nav__links a.ext{display:inline-flex;align-items:center;gap:4px;color:var(--ink2)}
.nav__burger{display:none;background:none;border:0;font-size:26px;color:var(--ink);cursor:pointer;line-height:1}
.nav__mobile{display:none;position:fixed;inset:52px 0 0 0;background:rgba(255,255,255,.96);z-index:49;padding:24px var(--gutter)}
.nav__mobile.is-open{display:block}
.nav__mobile a{display:block;font-size:24px;font-weight:600;color:var(--ink);padding:16px 0;border-bottom:1px solid var(--line)}
.nav__mobile a:hover{text-decoration:none}
@media (max-width:860px){.nav__links{display:none}.nav__burger{display:block}}

/* Hero ----------------------------------------------------------------- */
.hero{min-height:100svh;display:grid;place-items:center;text-align:center;padding:100px var(--gutter) 90px;position:relative}
.hero__inner{max-width:900px;width:100%;min-width:0;margin:0 auto;
  transform:translateY(calc(var(--p,0) * -60px));opacity:calc(1 - var(--p,0) * 1.4)}
.hero h1{font-size:clamp(36px,7.4vw,96px);font-weight:700;letter-spacing:-.04em;line-height:.98;margin:0 0 26px}
.hero h1 .soft{color:var(--ink3);font-weight:600}
.hero .lead{margin:0 auto 36px}
.hero__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero__hint{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);color:var(--ink3);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:8px;opacity:calc(1 - var(--p,0) * 3)}
.hero__hint::after{content:"";width:1px;height:36px;background:linear-gradient(var(--ink3),transparent);animation:drip 1.8s var(--ease) infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* Sub-page hero */
.phero{padding:150px 0 70px}
.phero h1{font-size:clamp(40px,6vw,76px);font-weight:700;letter-spacing:-.035em;margin-bottom:22px}
.crumb{font-size:13px;color:var(--ink3);margin-bottom:22px}
.crumb a{color:var(--ink3)}

/* Scroll-Scrub Bild (skaliert beim Hereinscrollen) ---------------------- */
.scrub-img{padding:0 var(--gutter) 40px}
.scrub-img__frame{max-width:1400px;margin:0 auto;border-radius:24px;overflow:hidden;aspect-ratio:16/8.5;
  transform:scale(calc(.88 + var(--p,0) * .12));transition:transform .05s linear}
.scrub-img__frame img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.15 - var(--p,0) * .15))}
@media (max-width:700px){.scrub-img__frame{aspect-ratio:4/3;border-radius:16px}}

/* Sections ------------------------------------------------------------- */
.sec{padding:clamp(80px,12vw,150px) 0}
.sec--grey{background:var(--bg2)}
.sec--dark{background:var(--dark);color:#fff}
.sec--dark .lead{color:#a1a1a6}
.sec--dark h2{color:#fff}
.sec--tight{padding-top:clamp(40px,6vw,80px)}
.shead{max-width:760px;margin-bottom:clamp(40px,6vw,72px)}
.shead h2{font-size:clamp(34px,4.6vw,60px);margin-bottom:18px}
.shead.center{margin-left:auto;margin-right:auto;text-align:center}
.shead.center .lead{margin:0 auto}

/* Karten */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:#fff;border-radius:22px;padding:36px 32px 40px;min-height:340px;display:flex;flex-direction:column;
  border:1px solid #ececef;box-shadow:0 1px 0 rgba(0,0,0,.03);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.card:hover{transform:translateY(-4px);box-shadow:0 24px 50px -30px rgba(0,0,0,.25)}
.card i{font-size:72px;line-height:1;color:var(--accent);margin-bottom:auto}
.card h3{font-size:24px;margin:28px 0 12px}
.card p{color:var(--ink2);font-size:16px}
.card .link{margin-top:22px;font-size:15px}
.sec--dark .card{background:#1c1c1e}
.sec--dark .card p{color:#a1a1a6}
@media (max-width:900px){.cards{grid-template-columns:1fr}.card{min-height:0}}

/* Arbeitsweise – Spotlight-Schritte */
.method{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,120px);align-items:start}
.method__sticky{position:sticky;top:120px}
.method__sticky h2{font-size:clamp(34px,4.6vw,60px);margin-bottom:18px}
.steps{display:flex;flex-direction:column}
.step{padding:56px 0;border-top:1px solid var(--line);opacity:.28;transform:translateX(12px);
  transition:opacity .6s var(--ease),transform .6s var(--ease)}
.step:last-child{border-bottom:1px solid var(--line)}
.step.is-active{opacity:1;transform:none}
.step__n{font-size:13px;font-weight:600;color:var(--accent);letter-spacing:.08em;margin-bottom:12px}
.step h3{font-size:clamp(26px,3vw,38px);margin-bottom:12px}
.step p{color:var(--ink2);max-width:32em}
@media (max-width:900px){.method{grid-template-columns:1fr}.method__sticky{position:static}.step{padding:36px 0;transform:none}}

/* Kennzahlen */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fact{padding:36px 0;border-top:1px solid var(--line)}
.fact__v{font-size:clamp(48px,6vw,84px);font-weight:700;letter-spacing:-.04em;line-height:1;margin-bottom:12px}
.fact__v small{font-size:.5em;font-weight:600;color:var(--accent);margin-left:2px}
.fact p{color:var(--ink2);max-width:22em}
@media (max-width:760px){.facts{grid-template-columns:1fr}.fact{padding:26px 0}}

/* Split (Text + Bild) */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,7vw,110px);align-items:center}
.split--rev .split__img{order:-1}
.split h2,.split h3.big{font-size:clamp(32px,4vw,52px);margin-bottom:18px}
.split p{color:var(--ink2);margin-bottom:16px}
.split__img{border-radius:22px;overflow:hidden;aspect-ratio:4/3}
.split__img img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.4s var(--ease)}
.is-in .split__img img{transform:scale(1)}
.split ul{list-style:none;margin:20px 0 0;padding:0}
.split li{padding:12px 0;border-top:1px solid var(--line);display:flex;gap:12px;align-items:flex-start;color:var(--ink)}
.split li i{color:var(--accent);font-size:20px;flex:none;margin-top:2px}
.split li:last-child{border-bottom:1px solid var(--line)}
.sec--dark .split p{color:#a1a1a6}
@media (max-width:900px){.split{grid-template-columns:1fr}.split--rev .split__img{order:0}}

/* Zwei-Marken-Vergleich */
.twin{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.twin__col{border-radius:22px;padding:40px 36px;background:#1c1c1e}
.twin__col.is-brand{background:#fff;color:var(--ink)}
.sec--dark .eyebrow,.twin__col .eyebrow{color:var(--accent-light)}
.twin__col.is-brand .eyebrow{color:var(--accent)}
.twin__col h3{font-size:30px;margin-bottom:12px}
.twin__col p{color:#a1a1a6;margin-bottom:18px}
.twin__col.is-brand p{color:var(--ink2)}
.twin__col ul{list-style:none;color:#d1d1d6;font-size:15px}
.twin__col.is-brand ul{color:var(--ink)}
.twin__col li{padding:9px 0;border-top:1px solid rgba(255,255,255,.12)}
.twin__col.is-brand li{border-top-color:var(--line)}
@media (max-width:800px){.twin{grid-template-columns:1fr}}

/* Chips / Technologien */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:10px 16px;border-radius:999px;border:1px solid var(--line);font-size:14px;color:var(--ink);background:#fff}

/* Team */
.people{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.person{background:#fff;border:1px solid #ececef;border-radius:22px;overflow:hidden}
.person__img{aspect-ratio:1/1;overflow:hidden}
.person__img img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.person__body{padding:28px 30px 32px}
.person h3{font-size:24px;margin-bottom:4px}
.person .role{color:var(--accent);font-weight:500;font-size:14px;margin-bottom:12px}
.person p{color:var(--ink2);font-size:15px}
@media (max-width:760px){.people{grid-template-columns:1fr}}

/* Kontakt */
.contact{text-align:center}
.contact h2{font-size:clamp(36px,5.4vw,72px);margin-bottom:18px}
.contact .lead{margin:0 auto 34px}
.contact__row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:26px}
.contact__row--links{justify-content:flex-start;margin-top:28px}
.contact__meta{color:var(--ink2);font-size:15px}
.contact__meta a{color:var(--ink)}

/* Footer */
.footer{border-top:1px solid var(--line);padding:40px 0 48px;font-size:13px;color:var(--ink2)}
.footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
.footer nav{display:flex;gap:22px;flex-wrap:wrap}
.footer a{color:var(--ink2)}
.footer a:hover{color:var(--ink)}
.footer .brand{font-size:15px}

/* Rechtstexte */
.legal{max-width:760px}
.legal h2{font-size:22px;margin:40px 0 12px}
.legal h3{font-size:17px;margin:24px 0 8px}
.legal p,.legal li{color:var(--ink2);font-size:16px;margin-bottom:12px}
.legal ul{padding-left:20px}
.legal .addr{color:var(--ink);font-size:17px;line-height:1.6}
.legal .note{font-size:13px;color:var(--ink3);border-left:2px solid var(--accent);padding-left:12px}

/* Reveal ---------------------------------------------------------------- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);
  transition-delay:calc(var(--d,0) * 1ms)}
/* Verzögerung je Element über data-d statt style="--d:…": Die
   Content-Security-Policy lässt keine style-Attribute zu (tests/csp.sh). */
[data-d="100"]{--d:100}[data-d="120"]{--d:120}[data-d="180"]{--d:180}[data-d="240"]{--d:240}
[data-reveal].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none;transition:none}
  .hero__inner,.scrub-img__frame,.scrub-img__frame img{transform:none!important;opacity:1!important}
  .step{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* Rechtsseiten: kein doppelter Abstand unter der Überschrift */
.sec--legal{padding-top:0}
.legal>h2:first-child{margin-top:0}

/* Wortmarke im Hero / Seitenkopf (Systemschrift, reiner Text) */
.hero__mark{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:600;
  font-size:clamp(20px,2.4vw,30px);letter-spacing:0;color:var(--ink);margin-bottom:clamp(22px,3vw,36px)}
.hero__mark small{font-weight:400;font-size:.85em;color:var(--ink3)}
.hero__mark--sub{font-size:clamp(18px,2vw,24px);margin-bottom:18px}
/* Ohne Bilder: Split einspaltig, Team-Karten ohne Foto */
.split--solo{grid-template-columns:1fr;max-width:860px}
.split--solo ul{max-width:640px}
.person__body{padding:32px 30px 34px}
.person__body h3{margin-top:0}
.person .role::before{content:"";display:block;width:36px;height:2px;background:var(--accent);margin-bottom:14px}

/* ASCII-Art über der Hero-Headline */
.hero__art{font-family:"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;font-size:clamp(8px,0.85vw,12px);line-height:1.22;
  color:var(--ink2);text-align:left;display:inline-block;margin:0 auto clamp(28px,4vw,48px);white-space:pre;max-width:100%;overflow-x:auto}
.hero__art::selection{background:var(--accent);color:#fff}
.hero__art--wide{display:none;font-size:clamp(9px,0.8vw,12px)}
@media (min-width:900px){.hero__art--narrow{display:none}.hero__art--wide{display:inline-block}}
@media (max-width:640px){.hero__art{font-size:7.5px;line-height:1.2}}

/* Marke als Überschrift (Kontakt/Anschrift) */
.contact h2.brand--big{display:inline-flex;justify-content:center;font-size:clamp(30px,4.6vw,56px);letter-spacing:-.02em;gap:.25em;margin-bottom:14px}
.contact h2.brand--big small{font-size:.85em}

/* ===== ASCII-Diagramme (Block A) ===================================== */
.fig{font-family:"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  font-size:clamp(9px,1.05vw,14px);line-height:1.34;color:var(--ink2);
  white-space:pre;margin:0;overflow-x:auto;max-width:100%}
.fig b{color:var(--accent);font-weight:400}
.fig--c{text-align:left;display:inline-block}
.figwrap{display:flex;justify-content:center;padding:clamp(14px,2vw,24px) 0}
.split .fig{align-self:center;font-size:clamp(8px,0.92vw,12.5px)}
/* Split mit Diagramm rechts: wieder zweispaltig */
.split--fig{grid-template-columns:1fr 1fr;max-width:none}
.split--fig ul{max-width:none}
@media (max-width:900px){.split--fig{grid-template-columns:1fr}}
/* Zeitstrahl unter den Kennzahlen */
.timeline{border-top:1px solid var(--line);margin-top:clamp(30px,4vw,48px);padding-top:clamp(26px,3vw,38px);text-align:center}
.timeline .fig{display:inline-block;text-align:left;font-size:clamp(9px,1.15vw,15px)}

/* ===== Terminal, hell ================================================ */
.term{max-width:620px;border-radius:12px;overflow:hidden;background:#fff;
  border:1px solid var(--line);box-shadow:0 20px 44px -34px rgba(0,0,0,.35)}
.term--start{margin-top:clamp(26px,3vw,38px)}
.term--kontakt{margin-top:clamp(30px,4vw,44px)}
.term__bar{display:flex;align-items:center;gap:7px;padding:10px 14px;
  background:var(--bg2);border-bottom:1px solid var(--line)}
.term__bar i{width:10px;height:10px;border-radius:50%;background:#dcdce0;display:block}
.term__bar i:nth-child(1){background:#e5a8a0}
.term__bar i:nth-child(2){background:#e8d2a0}
.term__bar i:nth-child(3){background:#a8d8b4}
.term__bar span{margin-left:8px;font-family:"SF Mono",Menlo,Consolas,monospace;
  font-size:11px;color:var(--ink3);letter-spacing:.02em}
.term__body{padding:18px 20px 22px;font-family:"SF Mono",Menlo,Consolas,monospace;
  font-size:13px;line-height:1.75;color:var(--ink2);min-height:210px;white-space:pre-wrap}
.term__body div:empty{height:1.75em}
.term__body .p{color:var(--accent);font-weight:500}
.term__body .c{color:var(--ink);font-weight:500}
.term__body .o{color:var(--ink3)}
.term__body .ok{color:var(--accent);font-weight:500}
.cur{display:inline-block;width:7px;height:14px;background:var(--accent);
  vertical-align:-2px;animation:blink 1.05s steps(1) infinite}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@media (max-width:620px){.term__body{font-size:11.5px;padding:14px 14px 18px}}
@media (prefers-reduced-motion:reduce){.cur{animation:none}}
/* Diagramme auf dunklem Grund aufhellen */
.sec--dark .fig{color:#a1a1a6}
.sec--dark .fig b{color:var(--accent-light)}

/* ===== Hardware-Bänder (Explosionszeichnungen) ======================= */
.band{padding:clamp(18px,2.6vw,36px) 0}
.band--tight{padding-top:0}
.band__img{max-width:1100px;margin:0 auto;display:block;width:100%;height:auto}
.band__img--s{max-width:760px}
.band__cap{max-width:640px;margin:clamp(16px,2.2vw,28px) auto 0;text-align:center;
  font-family:"SF Mono",Menlo,Consolas,monospace;font-size:12.5px;line-height:1.7;
  color:var(--ink3);letter-spacing:.01em}
.band__cap b{color:var(--ink2);font-weight:500}
.sec--dark .band__cap{color:#86868b}
/* Bild im Seitenkopf */
.phero__img{margin-top:clamp(26px,4vw,44px)}
@media (max-width:700px){.band{padding:clamp(28px,6vw,44px) 0}}


/* Großes Bildband: mehr Fläche, weniger Luft zu den Nachbarabschnitten */
.band--gross{padding:clamp(6px,1.4vw,20px) 0 clamp(14px,2vw,28px)}
.band--gross .band__img{max-width:1320px}
.band--gross .band__cap{margin-top:clamp(10px,1.6vw,20px)}