/* ================================================================
   IVA VALUATION & ADVISORY AG — Shared Stylesheet
   ================================================================ */

/* Ampersand-Substitution: & aus Lora statt Playfair Display */
@font-face{
  font-family:"Playfair Display";
  src:url("/fonts/0QIhMX1D_JOuMw_LLPtLp_A.woff2") format("woff2");
  unicode-range:U+0026,U+0051;
  font-weight:100 900;
  font-style:normal italic;
  font-display:swap;
}

/* ---------- 1 · Token ---------- */
:root{
  --ci-rot:#CC051C;
  --ci-blau:#003781;
  --n-0:#FFFFFF;
  --n-50:#F7F8FB;
  --n-100:#ECEEF4;
  --n-200:#DCE1EA;
  --n-400:#98A1B7;
  --n-600:#556080;
  --n-900:#101A30;

  --text:var(--n-900);
  --text-2:var(--n-600);
  --grund:var(--n-50);
  --flaeche:var(--n-0);
  --linie:var(--n-200);

  --font:"Lora","Georgia","Times New Roman",serif;
  --font-display:"Playfair Display","Georgia",serif;
  --font-ui:"Libre Franklin",-apple-system,"Segoe UI",sans-serif;

  --s-4:4px;--s-8:8px;--s-12:12px;--s-16:16px;--s-24:24px;--s-32:32px;
  --s-48:48px;--s-64:64px;--s-96:96px;--s-128:128px;

  --max:1440px;
  --rand:48px;
  --mass:38rem;

  --ease:cubic-bezier(.16,1,.3,1);
  --ease2:cubic-bezier(.4,0,.2,1);
  --dauer-s:.35s;--dauer-m:.7s;
}

/* ---------- 2 · Basis ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--grund);color:var(--text);
  font-family:var(--font);font-size:1.0625rem;line-height:1.72;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
ul{list-style:none}
:focus-visible{outline:2px solid var(--ci-rot);outline-offset:3px}

.display{
  font-family:var(--font-display);font-weight:700;
  text-transform:uppercase;letter-spacing:.03em;
  font-size:clamp(1.875rem,3.2vw,2.75rem);line-height:1.05;
}
.mono{
  font-family:var(--font-ui);font-weight:500;font-size:.8125rem;
  letter-spacing:.2em;text-transform:uppercase;line-height:1.4;color:var(--text-2);
}

/* ---------- 3 · Signature: der rote Punkt ---------- */
.punkt::after{
  content:"";display:inline-block;background:var(--ci-rot);
  width:.28em;height:.28em;margin-left:.18em;vertical-align:middle;
  opacity:0;transition:opacity var(--dauer-m) var(--ease) .1s;
}
.ist-sichtbar .punkt::after,
.punkt.ist-sichtbar::after{opacity:1}

/* ---------- 4 · Scroll-Reveal ---------- */
.reveal{
  opacity:0;transform:translateY(10px);
  transition:opacity var(--dauer-m) var(--ease),transform var(--dauer-m) var(--ease);
}
.reveal.ist-sichtbar{opacity:1;transform:none}

/* ---------- Keyframes ---------- */
@keyframes strich-auf{
  from{transform:scaleX(0)}to{transform:scaleX(1)}
}
@keyframes links-rein{
  from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}
}
@keyframes aufblenden{
  from{opacity:0}to{opacity:1}
}
@keyframes hoch-wachsen{
  from{transform:scaleY(0)}to{transform:scaleY(1)}
}

/* ---------- Reduced Motion ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .punkt::after{opacity:1;transition:none}
  header::before,.hero-trenn-anim{transform:scaleX(1);animation:none}
  .hero .vorstellung,.hero h1 span,.hero-unter{opacity:1;transform:none;animation:none}
  .l-karte,.l-karte::before,.l-karte::after{
    opacity:1;transform:none;animation:none;transition:none;
    width:auto;height:auto;
  }
  .claim-strich{transform:scaleX(1);transition:none}
}

/* ---------- 5 · Scroll-Fortschritt ---------- */
#fortschritt{
  position:fixed;top:0;left:0;z-index:200;
  height:2px;background:var(--ci-rot);
  width:0%;transition:width .1s linear;
  pointer-events:none;
}

/* ---------- 6 · Header & Navigation ---------- */
header{
  position:sticky;top:0;z-index:100;
  background:var(--flaeche);
  border-bottom:1px solid var(--linie);
}
header::before{
  content:"";display:block;height:3px;background:var(--ci-rot);
  transform:scaleX(0);transform-origin:left center;
  animation:strich-auf .9s var(--ease) .1s forwards;
}
.kopf{
  max-width:100%;padding:var(--s-16) var(--rand);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-48);
}
.logo img{height:52px;width:auto;display:block}

/* Nav: Top-Level */
nav > ul{display:flex;gap:var(--s-24);flex-wrap:wrap;justify-content:flex-end;align-items:center}
nav > ul > li{position:relative}
nav a{
  font-family:var(--font-ui);font-size:.9375rem;font-weight:500;
  padding:var(--s-8) 0;position:relative;
  color:var(--text-2);letter-spacing:.01em;
  transition:color var(--dauer-s) var(--ease);
}
nav a::after{
  content:"";position:absolute;bottom:-1px;left:0;
  width:0;height:2px;background:var(--ci-rot);
  transition:width .3s var(--ease);
}
nav a:hover{color:var(--ci-blau)}
nav a:hover::after{width:100%}
nav a[aria-current]{color:var(--text)}
nav a[aria-current]::after{width:100%}


/* Nav: Dropdown-Menü */
.dropdown{
  position:absolute;top:calc(100% + 8px);right:0;left:auto;
  background:var(--flaeche);
  border:1px solid var(--linie);
  border-top:2px solid var(--ci-rot);
  min-width:260px;
  opacity:0;visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s .2s;
  z-index:200;box-shadow:0 8px 24px rgba(0,0,0,.08);
}
nav > ul > li:hover .dropdown,
nav > ul > li:focus-within .dropdown{
  opacity:1;visibility:visible;transform:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s 0s;
}
.dropdown li{border-bottom:1px solid var(--linie)}
.dropdown li:last-child{border-bottom:none}
.dropdown a{
  display:block;padding:var(--s-12) var(--s-16);
  font-size:.875rem;color:var(--text-2);
  transition:background .15s,color .15s;
}
.dropdown a::after{display:none}
.dropdown a:hover{background:var(--n-50);color:var(--ci-blau)}

/* ---------- 6b · Mega-Menü ---------- */
.hat-mega{position:relative}
.mega-menu{
  position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(-6px);
  background:var(--flaeche);border:1px solid var(--linie);border-top:2px solid var(--ci-rot);
  padding:var(--s-32);
  display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto 1fr;
  gap:0 var(--s-32);
  min-width:680px;box-shadow:0 8px 24px rgba(0,0,0,.08);
  opacity:0;visibility:hidden;
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s .2s;
  z-index:200;
}
.hat-mega:hover .mega-menu,
.hat-mega:focus-within .mega-menu{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s 0s;
}
.mega-titel{
  font-family:var(--font-ui);font-size:.6875rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ci-rot);
  display:block;padding-bottom:var(--s-8);margin-bottom:var(--s-16);
  border-bottom:1px solid var(--linie);
  align-self:end;
}
.mega-menu ul{list-style:none;padding:0;margin:0}
.mega-menu li{border-bottom:1px solid var(--linie)}
.mega-menu li:last-child{border-bottom:none}
.mega-menu a{
  display:block;padding:var(--s-8) 0;
  font-family:var(--font-ui);font-size:.875rem;color:var(--text-2);
  text-decoration:none;transition:color .15s;
}
.mega-menu a::after{display:none}
.mega-menu a:hover{color:var(--ci-blau)}

/* ---------- 7 · Akzent-Klasse ---------- */
.akzent{color:var(--ci-rot)}
footer .akzent{color:var(--ci-rot)}

/* ---------- 8 · CTA-Button ---------- */
.cta{
  display:inline-block;padding:var(--s-12) var(--s-32);
  background:var(--ci-blau);color:#fff;
  font-family:var(--font-ui);font-size:.9375rem;font-weight:500;
  letter-spacing:.03em;
  position:relative;overflow:hidden;
  transition:color .35s var(--ease);
  white-space:nowrap;
}
.cta::before{
  content:"";position:absolute;inset:0;
  background:var(--ci-rot);
  transform:translateX(-101%);
  transition:transform .4s var(--ease);
}
.cta-text{position:relative;z-index:1}
.cta:hover::before{transform:translateX(0)}

/* ---------- 9 · Seiten-Hero (Unterseiten) ---------- */
.seiten-hero{
  background:var(--flaeche);
  border-bottom:1px solid var(--linie);
}
.seiten-hero-innen{
  max-width:var(--max);margin:0 auto;
  padding:var(--s-96) var(--rand) var(--s-64);
}
.seiten-hero .mono{margin-bottom:var(--s-16)}
.seiten-hero h1{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(2rem,4vw,3.25rem);
  line-height:1.05;text-transform:uppercase;letter-spacing:.03em;
  margin-top:var(--s-8);
}
.seiten-hero p.intro{
  margin-top:var(--s-24);max-width:680px;
  font-family:var(--font);font-size:clamp(1rem,1.4vw,1.125rem);
  line-height:1.75;color:var(--text-2);
}

/* ---------- 10 · Text-Sektion (Unterseiten) ---------- */
.seite{background:var(--flaeche)}
.seite-innen{
  max-width:var(--max);margin:0 auto;
  padding:var(--s-96) var(--rand);
}
.seite-innen + .seite-innen{border-top:1px solid var(--linie)}

.text-block{max-width:780px}
.text-block h2{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.375rem,2vw,1.875rem);
  line-height:1.1;text-transform:uppercase;letter-spacing:.03em;
  margin-bottom:var(--s-24);
}
.text-block h3{
  font-family:var(--font-ui);font-weight:600;font-style:normal;
  font-size:clamp(1.125rem,1.6vw,1.375rem);
  line-height:1.2;margin-top:var(--s-48);margin-bottom:var(--s-16);
}
.text-block p{
  font-family:var(--font);font-size:clamp(1rem,1.3vw,1.0625rem);
  line-height:1.8;color:var(--n-600);margin-bottom:var(--s-16);
}
.text-block p:last-child{margin-bottom:0}
.text-block ul{margin-top:var(--s-12);margin-bottom:var(--s-16)}
.text-block li{
  font-family:var(--font);font-size:clamp(1rem,1.3vw,1.0625rem);line-height:1.8;
  color:var(--n-600);padding-left:var(--s-20,20px);position:relative;
  margin-bottom:var(--s-8);
}
.text-block li::before{
  content:"";position:absolute;left:0;top:.7em;
  width:10px;height:1px;background:var(--ci-rot);
}

/* ---------- 11 · Zwei-Spalten-Layout ---------- */
.zwei-spalten{
  display:grid;grid-template-columns:1fr 1fr;
  gap:var(--s-96);align-items:start;
}
.zwei-spalten.breit{grid-template-columns:2fr 1fr}
.zwei-spalten.schmal{grid-template-columns:1fr 2fr}

/* ---------- 12 · Personen-Karten (Vorstand / Aufsichtsrat) ---------- */
.personen-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:var(--s-64);margin-top:var(--s-64);
}
.person-karte{
  border-top:2px solid var(--ci-rot);
  padding-top:var(--s-32);
}
.person-karte .person-titel{
  font-family:var(--font-ui);font-size:.75rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--text-2);
  margin-bottom:var(--s-8);
}
.person-karte h3{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.125rem,1.6vw,1.375rem);
  line-height:1.15;margin-bottom:var(--s-4);
}
.person-karte .person-rolle{
  font-family:var(--font-ui);font-size:.875rem;
  color:var(--ci-blau);font-weight:500;margin-bottom:var(--s-24);
}
.person-karte p{
  font-family:var(--font);font-size:clamp(1rem,1.3vw,1.0625rem);line-height:1.8;
  color:var(--n-600);
}
.person-foto{
  width:120px;height:150px;object-fit:cover;object-position:top center;
  flex-shrink:0;display:block;margin-bottom:var(--s-24);
}
.person-karte ul{margin-top:var(--s-24);margin-bottom:0;}
.person-karte ul li{
  font-family:var(--font);font-size:clamp(1rem,1.3vw,1.0625rem);line-height:1.8;
  color:var(--n-600);padding-left:var(--s-20,20px);position:relative;
  margin-bottom:var(--s-8);
}
.person-karte ul li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:10px;height:1px;background:var(--ci-rot);
}
/* AR: Bild links, Text rechts */
.ar-karte{display:flex;flex-direction:row;gap:var(--s-32);align-items:stretch;border-top:none;padding-top:var(--s-64);}
.personen-grid .ar-karte:not(:first-child){
  background-image:linear-gradient(to right,transparent calc(50% - 54px),rgba(204,5,28,.45) calc(50% - 54px),rgba(204,5,28,.45) calc(50% + 54px),transparent calc(50% + 54px));
  background-size:100% 1px;background-repeat:no-repeat;background-position:0 0;
}
.ar-karte{position:relative;}
.ar-karte::before{
  content:"";position:absolute;left:0;top:var(--s-64);bottom:0;
  width:4px;background:var(--ci-rot);z-index:1;
}
.ar-karte .person-foto{
  width:130px;height:100%;flex-shrink:0;margin-bottom:0;
  object-fit:cover;object-position:top center;
  filter:grayscale(1);
}
.ar-karte .person-info{flex:1;align-self:flex-start;}

/* ---------- 13 · Timeline ---------- */
.timeline{margin-top:var(--s-64)}
.tl-eintrag{
  display:grid;grid-template-columns:80px 1fr;
  gap:var(--s-32);padding-bottom:var(--s-48);
  position:relative;
}
.tl-eintrag::before{
  content:"";position:absolute;
  left:38px;top:var(--s-8);bottom:0;
  width:1px;background:var(--linie);
}
.tl-eintrag:last-child::before{display:none}
.tl-jahr{
  font-family:var(--font-display);font-weight:700;
  font-size:1rem;color:var(--ci-rot);
  padding-top:2px;
}
.tl-inhalt p{
  font-family:var(--font);font-size:clamp(1rem,1.3vw,1.0625rem);
  line-height:1.8;color:var(--n-600);
}
.tl-inhalt .tl-dot{
  display:inline-block;width:10px;height:10px;
  background:var(--ci-rot);border-radius:50%;
  margin-right:var(--s-8);vertical-align:middle;
}

/* ---------- 14 · Referenzen ---------- */
.sektor-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:var(--s-32);margin-top:var(--s-48);
}
.sektor-karte{
  background:var(--flaeche);
  border:1px solid var(--linie);
  border-top:2px solid var(--ci-rot);
  padding:var(--s-32);
}
.sektor-karte h3{
  font-family:var(--font-ui);font-weight:600;font-size:.8125rem;
  letter-spacing:.15em;text-transform:uppercase;
  color:var(--text);margin-bottom:var(--s-16);
}
.sektor-karte p{
  font-family:var(--font-ui);font-size:.875rem;
  line-height:1.65;color:var(--n-600);
}
.sektor-karte ul{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:repeat(5,auto);
  grid-auto-flow:column;
  gap:var(--s-8) var(--s-24);
  align-items:start;
}
.sektor-karte{min-height:240px;}
.sektor-karte ul li{
  font-family:var(--font-ui);font-size:.875rem;line-height:1.6;
  color:var(--n-600);padding-left:var(--s-20,20px);position:relative;
}
.sektor-karte ul li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:8px;height:1px;background:var(--ci-rot);
}

/* Zitat-Karten */
.zitat-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:var(--s-32);margin-top:var(--s-48);
}
.zitat-karte{
  background:var(--n-50);
  border-left:3px solid var(--ci-rot);
  padding:var(--s-32);
  display:flex;flex-direction:column;
}
.zitat-karte blockquote{
  flex:1;display:flex;flex-direction:column;
}
.zitat-karte blockquote p{
  font-family:var(--font-display);font-style:normal;
  font-size:clamp(.9375rem,1.2vw,1.0625rem);
  line-height:1.65;color:var(--text);margin-bottom:var(--s-16);
  flex:1;
}
.zitat-karte cite{
  font-family:var(--font-ui);font-size:.75rem;
  letter-spacing:.04em;color:var(--n-400);font-style:normal;
}
.zitat-badge{
  display:inline-block;margin-top:var(--s-16);align-self:flex-start;
  font-family:var(--font-ui);font-size:.6875rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--ci-blau);border:1px solid var(--ci-blau);
  padding:3px var(--s-8);
}

/* ---------- 15 · Leistungen-Übersicht (Startseite) ---------- */
.leistungen{
  background:var(--flaeche);color:var(--n-900);
  border-top:1px solid var(--linie);
}
.leistungen-innen{max-width:var(--max);margin:0 auto;padding:var(--s-128) var(--rand)}

.leistungen .mono{
  color:var(--n-400);
  padding-left:var(--s-16);
  border-left:2px solid var(--ci-rot);
}
.leistungen h2{
  margin-top:var(--s-16);
}
.l-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:0;margin-top:var(--s-64);
  counter-reset:leistung;
}
.l-karte{
  position:relative;overflow:hidden;
  padding:var(--s-48) var(--s-32) 56px 0;
  counter-increment:leistung;
  opacity:0;transform:translateY(24px);
  transition:
    opacity .65s var(--ease) var(--d,0s),
    transform .65s var(--ease) var(--d,0s),
    background .3s var(--ease2);
}
.l-karte:nth-child(1){--d:0s}
.l-karte:nth-child(2){--d:.12s}
.l-karte:nth-child(3){--d:.24s}
.l-karte:nth-child(4){--d:.36s}
.l-karte.ist-sichtbar{opacity:1;transform:none}
.l-karte:hover{background:var(--n-50)}
.l-karte::before{
  content:"";position:absolute;top:0;left:0;height:2px;width:0;
  background:var(--ci-rot);
  transition:width .8s var(--ease) calc(var(--d,0s) + .25s);
}
.l-karte.ist-sichtbar::before{width:calc(100% - var(--s-32))}
.l-karte:last-child.ist-sichtbar::before{width:100%}
.l-karte:hover::before{width:100%;transition:width .3s var(--ease)}
.l-karte:not(:last-child)::after{
  content:"";position:absolute;
  top:var(--s-48);bottom:var(--s-48);right:0;width:1px;
  background:var(--linie);
  transform:scaleY(0);transform-origin:top center;
  transition:transform .6s var(--ease) calc(var(--d,0s) + .45s);
}
.l-karte.ist-sichtbar:not(:last-child)::after{transform:scaleY(1)}
.l-karte:not(:first-child){padding-left:var(--s-32)}
.l-karte:last-child{padding-right:0}
.l-karte h3::before{
  content:"0" counter(leistung);
  display:block;
  font-family:var(--font-ui);font-weight:500;font-style:normal;
  font-size:1.125rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--n-400);
  margin-bottom:var(--s-12);
}
.l-karte h3{
  font-family:var(--font-ui);font-weight:600;font-style:normal;
  text-transform:none;font-size:1.625rem;
  line-height:1.2;letter-spacing:0;color:var(--n-900);
}
.l-karte ul{margin-top:20px}
.l-karte li{
  padding:var(--s-8) 0 var(--s-8) var(--s-24);
  font-family:var(--font-ui);font-size:1rem;line-height:1.5;
  color:var(--n-600);position:relative;
  opacity:0;transform:translateX(-10px);
  transition:
    opacity .45s var(--ease) calc(var(--d,0s) + .55s + var(--li-d,0s)),
    transform .45s var(--ease) calc(var(--d,0s) + .55s + var(--li-d,0s)),
    color .25s var(--ease2);
}
.l-karte li:nth-child(1){--li-d:0s}
.l-karte li:nth-child(2){--li-d:.1s}
.l-karte li:nth-child(3){--li-d:.2s}
.l-karte li:nth-child(4){--li-d:.3s}
.l-karte.ist-sichtbar li{opacity:1;transform:none}
.l-karte li::before{
  content:"";position:absolute;left:0;top:calc(.875rem * .75);
  width:12px;height:1px;background:var(--ci-rot);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .35s var(--ease) calc(var(--d,0s) + .65s + var(--li-d,0s));
}
.l-karte.ist-sichtbar li::before{transform:scaleX(1)}
.l-karte li:hover{
  color:var(--n-900);
  padding-left:calc(var(--s-24) + 4px);
  transition:padding-left .2s var(--ease),color .2s;
}
.l-karte li:hover::before{width:16px;background:var(--ci-rot);transition:width .2s var(--ease),background .2s}

/* ---------- 16 · Claim ---------- */
.claim{border-bottom:1px solid var(--linie);background:var(--grund)}
.claim-innen{max-width:var(--max);margin:0 auto;padding:var(--s-128) var(--rand)}
.claim-strich{
  display:block;height:3px;width:48px;background:var(--ci-rot);
  transform:scaleX(0);transform-origin:left center;
  transition:transform .6s var(--ease) .05s;margin-bottom:var(--s-32);
}
.ist-sichtbar > .claim-strich,.claim-strich.ist-sichtbar{transform:scaleX(1)}
.claim h2{
  font-family:var(--font-display);
  font-size:clamp(1.875rem,3.2vw,2.75rem);
  line-height:1.05;text-transform:uppercase;letter-spacing:.03em;
}
.claim p .naechsten{color:var(--ci-rot);font-style:normal}
.claim p{
  margin-top:var(--s-32);max-width:58rem;
  font-family:var(--font);
  font-size:clamp(1.25rem,2.2vw,1.75rem);
  line-height:1.5;font-weight:400;font-style:italic;letter-spacing:0;
  color:var(--text-2);
}

/* ---------- 17 · Warum-Block ---------- */
.warum{background:#fff;border-top:1px solid var(--linie)}
.warum-innen{max-width:var(--max);margin:0 auto;padding:var(--s-96) var(--rand)}
.warum-innen > .mono{margin-bottom:var(--s-48)}

.warum-stack{
  display:flex;flex-direction:column;
  margin-top:var(--s-48);gap:0;
}
.warum-zeile1{
  display:flex;align-items:baseline;gap:.3em;line-height:1;
}
.warum-zahl{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(5rem,12vw,9rem);
  line-height:1;color:var(--ci-rot);
  font-variant-numeric:tabular-nums;flex-shrink:0;
}
.warum-jahre{
  font-family:var(--font-ui);font-weight:600;font-style:normal;
  font-size:clamp(2rem,4.5vw,3.5rem);
  color:var(--text);white-space:nowrap;
}
.warum-zeile2{
  font-family:var(--font-ui);font-weight:600;font-style:normal;
  font-size:clamp(2rem,4vw,3.25rem);
  line-height:1.15;color:var(--text);white-space:nowrap;
  margin-top:1cm;
}
.warum-stack-akzent{color:var(--ci-rot)}
.warum-satz{
  font-family:var(--font-ui);font-weight:400;
  font-size:clamp(1rem,1.15vw,1.125rem);
  line-height:2;color:var(--n-600);
  margin-top:var(--s-48);
  border-top:1px solid var(--linie);padding-top:var(--s-32);
}

/* ---------- 18 · Zahlen-Band ---------- */
.zahlen{background:var(--n-50);border-top:1px solid var(--linie)}
.zahlen-innen{max-width:var(--max);margin:0 auto;padding:var(--s-128) var(--rand)}
.zahlen-innen > .mono{margin-bottom:var(--s-16)}
.zahlen-innen > h2{margin-bottom:var(--s-64)}
.z-band{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-32)}
.z-item{padding-left:var(--s-24);border-left:2px solid var(--linie)}
.z-zahl{
  display:block;font-family:var(--font-display);
  font-size:clamp(2rem,3.5vw,3rem);font-weight:700;
  color:var(--ci-rot);line-height:1;margin-bottom:var(--s-8);
}
.z-label{
  display:block;font-family:var(--font-ui);font-size:.8125rem;
  letter-spacing:.04em;color:var(--n-600);line-height:1.5;
}

/* ---------- 19 · Zitat-Karussell ---------- */
.zitat-teaser{background:var(--ci-blau)}
.zitat-innen{max-width:860px;margin:0 auto;padding:var(--s-96) var(--rand);text-align:center}
.zitat-teaser .mono{color:rgba(255,255,255,.45);margin-bottom:var(--s-48);letter-spacing:.2em}
.zitat-karussell{position:relative}
.zitat-slides{display:grid}
.zitat-slide{
  grid-area:1/1;
  opacity:0;transform:translateY(10px);
  transition:opacity .55s var(--ease),transform .55s var(--ease);
  pointer-events:none;
}
.zitat-slide.aktiv{opacity:1;transform:none;pointer-events:auto}
.zitat-slide blockquote{
  border-top:1px solid rgba(255,255,255,.2);
  border-bottom:1px solid rgba(255,255,255,.2);
  padding:var(--s-48) 0;margin:0;
}
.zitat-slide blockquote p{
  font-family:var(--font-display);font-weight:400;font-style:normal;
  font-size:clamp(1.25rem,2.2vw,1.875rem);
  line-height:1.55;color:#fff;margin-bottom:var(--s-24);
}
.zitat-slide cite{
  font-family:var(--font-ui);font-size:.8125rem;
  letter-spacing:.06em;color:rgba(255,255,255,.45);font-style:normal;
}
.zitat-nav{
  display:flex;align-items:center;justify-content:center;
  gap:var(--s-24);margin-top:var(--s-48);
}
.zitat-pfeil{
  background:transparent;border:1px solid rgba(255,255,255,.3);
  color:rgba(255,255,255,.7);width:40px;height:40px;border-radius:50%;
  font-size:1rem;cursor:pointer;line-height:1;
  transition:border-color .2s,color .2s;
  display:flex;align-items:center;justify-content:center;
}
.zitat-pfeil:hover{border-color:#fff;color:#fff}
.zitat-dots{display:flex;gap:10px;align-items:center}
.zitat-dot{
  width:7px;height:7px;border-radius:50%;
  border:none;background:rgba(255,255,255,.3);cursor:pointer;
  transition:background .3s,transform .3s;padding:0;
}
.zitat-dot.aktiv{background:#fff;transform:scale(1.3)}

/* ---------- Kontaktformular ---------- */
.kf-wrap{
  display:grid;grid-template-columns:1fr 1.6fr;gap:var(--s-96);align-items:start;
}
.kf-info .mono{margin-bottom:var(--s-16)}
.kf-info h2{margin-bottom:var(--s-24)}
.kf-info p{
  font-family:var(--font-ui);font-size:.9375rem;
  line-height:1.75;color:var(--n-600);
}
.kf-info a{color:var(--ci-blau);border-bottom:1px solid transparent;transition:border-color .2s}
.kf-info a:hover{border-color:var(--ci-blau)}
.kf-form{display:flex;flex-direction:column;gap:var(--s-24)}
.kf-zeile{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-24)}
.kf-feld{display:flex;flex-direction:column;gap:var(--s-8)}
.kf-feld label{
  font-family:var(--font-ui);font-size:.8125rem;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;color:var(--text);
}
.kf-pflicht{color:var(--ci-rot)}
.kf-feld input,.kf-feld textarea{
  font-family:var(--font-ui);font-size:.9375rem;color:var(--text);
  background:#fff;border:1px solid var(--linie);
  padding:var(--s-12) var(--s-16);
  transition:border-color .2s;outline:none;resize:vertical;
}
.kf-feld input:focus,.kf-feld textarea:focus{border-color:var(--ci-blau)}
.kf-feld input::placeholder,.kf-feld textarea::placeholder{color:var(--n-400)}
.kf-submit{
  align-self:flex-start;
  font-family:var(--font-ui);font-size:.875rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  background:var(--ci-blau);color:#fff;border:none;
  padding:var(--s-16) var(--s-32);cursor:pointer;
  transition:background .2s;
}
.kf-submit:hover{background:#002a6a}
.kf-feld select{
  font-family:var(--font-ui);font-size:.9375rem;color:var(--text);
  background:#fff;border:1px solid var(--linie);
  padding:var(--s-12) var(--s-16);
  outline:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23003681' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right var(--s-16) center;
  cursor:pointer;transition:border-color .2s;
}
.kf-feld select:focus{border-color:var(--ci-blau)}
.kf-upload{display:flex;align-items:center;gap:var(--s-16);flex-wrap:wrap}
.kf-upload input[type="file"]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.kf-upload-label{
  font-family:var(--font-ui);font-size:.8125rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--ci-blau);color:var(--ci-blau);
  padding:var(--s-8) var(--s-24);cursor:pointer;
  transition:background .2s,color .2s;flex-shrink:0;
}
.kf-upload-label:hover{background:var(--ci-blau);color:#fff}
.kf-upload-name{
  font-family:var(--font-ui);font-size:.875rem;color:var(--n-400);
}
@media(max-width:960px){.kf-wrap{grid-template-columns:1fr}}
@media(max-width:640px){.kf-zeile{grid-template-columns:1fr}}

/* ---------- 20 · Fokus-Statement ---------- */
.fokus{background:var(--flaeche);border-top:1px solid var(--linie);border-bottom:1px solid var(--linie);}
.fokus-innen{max-width:var(--max);margin:0 auto;padding:var(--s-64) var(--rand);}
.leistungen-innen .fokus-innen{max-width:none;padding:var(--s-64) 0 0;margin-top:var(--s-64);border-top:1px solid var(--linie);}
.leistungen-innen .fokus-innen p{max-width:none;}
.fokus-innen p{
  font-family:var(--font);
  font-size:clamp(1.0625rem,1.5vw,1.25rem);
  line-height:1.8;color:var(--n-900);
  border-left:3px solid var(--ci-rot);
  padding-left:var(--s-32);
  max-width:900px;
}

/* ---------- 21 · Hero (Startseite) ---------- */
.hero{background:var(--flaeche);border-bottom:1px solid var(--linie);min-height:100svh;display:flex;flex-direction:column}
.hero-innen{
  max-width:var(--max);margin:0 auto;width:100%;
  padding:var(--s-96) var(--rand) calc(var(--s-96) - 2cm);
  flex:1;display:flex;flex-direction:column;justify-content:center;gap:clamp(var(--s-32),4vh,var(--s-48));
}
.hero .vorstellung{
  font-family:var(--font);font-style:italic;
  font-size:1.25rem;font-weight:400;
  color:var(--text-2);line-height:1.6;letter-spacing:.01em;
  opacity:0;animation:links-rein .6s var(--ease) .3s forwards;
}
.hero h1{
  font-family:var(--font-display);
  font-size:clamp(2.75rem,6.5vw,4.75rem);
  line-height:1.02;font-weight:700;
  text-transform:uppercase;letter-spacing:.025em;margin-top:var(--s-24);
}
.hero h1.hero-h1{font-size:clamp(1.875rem,3.4vw,2.875rem);line-height:1.35}
.hero h1 > span{
  display:block;opacity:0;animation:links-rein .7s var(--ease) forwards;
}
.hero h1 > span:nth-child(1){animation-delay:.45s}
.hero h1 > span:nth-child(2){animation-delay:.62s;color:var(--n-900)}
.hero h1 > span:nth-child(3){animation-delay:.79s}
.hero-trenn-anim{
  margin-top:calc(var(--s-48) + 1cm);height:1px;background:var(--linie);
  transform:scaleX(0);transform-origin:left center;
  animation:strich-auf .7s var(--ease) 1.0s forwards;
}
.hero-unter{
  margin-top:var(--s-32);
  display:flex;justify-content:space-between;align-items:center;
  gap:var(--s-48);flex-wrap:wrap;
  opacity:0;animation:aufblenden .6s var(--ease) 1.15s forwards;
}
.hero-unter .bezug{
  font-family:var(--font);font-size:clamp(1.0625rem,1.5vw,1.1875rem);
  line-height:1.65;max-width:var(--mass);color:var(--text-2);
}

/* ---------- 22 · Footer ---------- */
footer{background:var(--ci-blau);color:#fff}
.fuss{max-width:var(--max);margin:0 auto;padding:var(--s-96) var(--rand) var(--s-48)}
.fuss h2{
  font-family:var(--font-display);
  font-size:clamp(1.625rem,2.6vw,2.25rem);
  line-height:1.05;text-transform:uppercase;letter-spacing:.03em;
}
.fuss .offen{
  margin-top:var(--s-8);font-family:var(--font);font-style:italic;
  color:var(--n-400);font-size:1.0625rem;
}
.footer-cta{margin-bottom:var(--s-48)}
.footer-cta-satz{
  font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.375rem,2.2vw,2rem);color:#fff;
  margin-bottom:var(--s-32);line-height:1.2;
}
.footer-cta .cta{background:#fff;color:var(--ci-blau)}
.footer-cta .cta:hover{background:var(--n-100)}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-64);margin-top:var(--s-64)}
.f-grid h3{
  font-family:var(--font-ui);font-weight:500;font-size:.6875rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--n-400);
  margin-bottom:var(--s-24);
}
.f-grid p{
  font-family:var(--font-ui);font-size:.9375rem;line-height:1.65;
  color:rgba(255,255,255,.72);margin-bottom:var(--s-16);max-width:var(--mass);
}
.f-grid .adresse{color:#fff}
.f-grid a{transition:color var(--dauer-s) var(--ease)}
.f-grid a[href^="tel"]{white-space:nowrap}
.f-grid a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.copy{
  margin-top:var(--s-64);padding-top:var(--s-24);
  border-top:1px solid rgba(255,255,255,.15);
  display:flex;justify-content:space-between;gap:var(--s-24);flex-wrap:wrap;
  font-family:var(--font-ui);font-size:.8125rem;color:var(--n-400);
}
.copy ul{display:flex;gap:var(--s-24)}
.copy a:hover{color:#fff}

/* ---------- 23 · IVA Digital Asset Seite ---------- */

/* ---------- 24 · Responsiv ---------- */
@media(max-width:1100px){
  .dropdown{min-width:220px}
}
@media(max-width:960px){
  .z-band{grid-template-columns:repeat(2,1fr)}
  .l-grid{grid-template-columns:repeat(2,1fr)}
  .personen-grid{grid-template-columns:1fr}
  .sektor-grid,.zitat-grid{grid-template-columns:1fr}
  .zwei-spalten,.zwei-spalten.breit,.zwei-spalten.schmal{grid-template-columns:1fr}
  .l-karte{
    border-right:none;padding-right:0 !important;padding-left:0 !important;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  .l-karte::after{display:none}
  .l-karte:last-child{border-bottom:none}
  .l-karte::before{width:0}
  .l-karte.ist-sichtbar::before{width:100%}
  nav > ul{gap:var(--s-12)}
}
@media(max-width:640px){
  :root{--rand:20px}
  .hero-innen{padding-top:var(--s-64);padding-bottom:var(--s-96)}
  .z-band{grid-template-columns:1fr 1fr}
  .warum-text{padding-left:var(--s-16)}
  .l-grid,.f-grid{grid-template-columns:1fr;gap:0}
  .hero-unter{flex-direction:column;align-items:flex-start;gap:var(--s-24)}
  .leistungen-innen,.claim-innen{padding-top:var(--s-96);padding-bottom:var(--s-96)}
  .kopf{padding:var(--s-12) var(--rand)}
  .logo img{height:44px}
  nav a{font-size:.875rem}
  .tl-eintrag{grid-template-columns:60px 1fr;gap:var(--s-16)}
  .tl-eintrag::before{left:28px}
}