/* ============================================================
   S+C Defense — Stylesheet
   Fonts: Readex Pro (Headlines) · IBM Plex Sans (Text)
   ============================================================ */

:root{
  --green:#354420;          /* Primär / Marke */
  --green-accent:#5F7238;   /* Akzent */
  --green-dark:#1c2410;
  --ink:#202730;            /* Headlines (Dunkelgrau) */
  --text:#42505f;           /* Fließtext */
  --muted:#54616f;
  --muted-light:#697787;
  --bg:#f2f1e9;
  --card:#ffffff;
  --line:#e4e2d6;
  --line-soft:#eceadf;
  --olive-pale:#edefdd;
  --pale-active:#f1f3ea;
  --maxw:1280px;
}

/* ==========================================================================
   LOCAL FONTS
   ========================================================================== */

/* --------------------------------------------------------------------------
   IBM Plex Sans
   -------------------------------------------------------------------------- */

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex-sans/IBMPlexSans-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex-sans/IBMPlexSans-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex-sans/IBMPlexSans-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "IBM Plex Sans";
    src: url("../fonts/ibm-plex-sans/IBMPlexSans-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* --------------------------------------------------------------------------
   Readex Pro
   -------------------------------------------------------------------------- */

@font-face {
    font-family: "Readex Pro";
    src: url("../fonts/readex-pro/ReadexPro-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Readex Pro";
    src: url("../fonts/readex-pro/ReadexPro-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Readex Pro";
    src: url("../fonts/readex-pro/ReadexPro-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Readex Pro";
    src: url("../fonts/readex-pro/ReadexPro-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}


/* ---------- Reset / Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:#0e1726;
  font-family:'IBM Plex Sans',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
h1,h2,h3,h4,p{margin:0}
p{font:400 16.5px/1.65 'IBM Plex Sans',sans-serif;color:var(--text);margin:0}


/* ---------- i18n ---------- */
.lang-de .i18n-en{display:none}
.lang-en .i18n-de{display:none}

/* ---------- Layout helpers ---------- */
.container{max-width:var(--maxw);margin:0 auto;padding:0 40px;width:100%}
.section{padding:90px 0}
.section--tight{padding:84px 0 40px}
.section--alt{background:var(--card);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}

.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 18px;
  font:600 13px/1.4 'IBM Plex Sans',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--green-accent)}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--green-accent);display:block;flex:none}
.eyebrow--light{color:#c2d49c}
.eyebrow--light::before{background:#a9be7a}

.h2{font:700 40px/1.1 'Readex Pro',sans-serif;letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.h2--ondark{color:#fff}
.lead{font:400 18px/1.65 'IBM Plex Sans',sans-serif;color:var(--text);text-wrap:pretty}

/* ---------- Buttons ---------- */
.btn{display:inline-block;border:0;border-radius:6px;padding:15px 28px;
  font:700 15px/1 'IBM Plex Sans',sans-serif;letter-spacing:.02em;transition:filter .15s,background .15s}
.btn--primary{background:var(--green-accent);color:#fff}
.btn--primary:hover{filter:brightness(1.08)}
.btn--ghost{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.4)}
.btn--ghost:hover{background:rgba(255,255,255,.16)}

/* ---------- Header ---------- */
.header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.header__inner{height:76px;display:flex;align-items:center;gap:28px}


/* ---------- Header Logo ---------- */
.logo {
    display: flex;
    align-items: center;
    /* gap: 13px;*/
	gap: 0px;
}

.logo__mark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: var(--green);
    border-radius: 5px;
    color: #fff;
    font: 700 18px/1 'Readex Pro', sans-serif;
}

.logo__mark--light {
    background: #fff;
}

.logo__text {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.logo__text strong {
    font: 700 16px/1 'Readex Pro', sans-serif;
    letter-spacing: .05em;
    text-transform: uppercase;
}

@media (max-width:520px){
	.logo__text strong {
    	font: 700 12px/1 'Readex Pro', sans-serif;
    	letter-spacing: .05em;
	}
}

.logo__tag {
    font: 600 10px/1 'IBM Plex Sans', sans-serif;
    letter-spacing: .36em;
    text-transform: uppercase;
    margin-top: 5px;
}

/* ---------- Header Logo Responsive ---------- */

/* Zwischen lg (992px) und xl (1200px) ausblenden */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .logo__text {
        display: none;
    }
}

/* ---------- Header Nav ---------- */
.nav {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
}

.nav__link {
    padding: 10px 13px;
    border-radius: 6px;

    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 11.0px;
    font-weight: 600;
    line-height: 1;

    color: #44525f;
    white-space: nowrap;

    transition: color .15s;
}

.nav__link:hover {
    color: var(--green);
}

.nav__link--active {
    color: var(--green);
    box-shadow: inset 0 -2px 0 var(--green-accent);
}

@media (max-width: 1400px) {
    .nav__link--home,
    .nav__link--contact {
        display: none;
    }
}

.header__right{display:flex;align-items:center;gap:12px}
.lang{display:flex;align-items:center;gap:2px;border:1px solid #d5d4c8;border-radius:999px;padding:3px}
.lang__btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:0;padding:6px 12px;border-radius:999px;background:transparent;color:#6b7787;
  font:700 12px/1 'IBM Plex Sans',sans-serif;letter-spacing:.06em;transition:all .15s}
.lang__btn.is-active,
.lang__btn[aria-current="page"]{background:var(--green);color:#fff}

.burger{display:none;width:46px;height:46px;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  background:none;border:1px solid #d5d4c8;border-radius:8px}
.burger span{display:block;width:20px;height:2px;background:var(--green);transition:transform .2s,opacity .2s}
body.nav-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0}
body.nav-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-nav{display:none;border-top:1px solid var(--line);background:rgba(255,255,255,.98);backdrop-filter:blur(12px)}
.mobile-nav nav{display:flex;flex-direction:column;gap:4px;padding:10px 40px 18px}
.mobile-nav a{padding:14px 16px;border-radius:8px;font:600 16px/1 'IBM Plex Sans',sans-serif;color:#2a3138}
.mobile-nav a:hover{background:var(--pale-active);color:var(--green)}
body.nav-open .mobile-nav{display:block}

/* ---------- Logo Head---------- */
.logo{
    display:flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
}

@media (max-width:520px){
	.logo{
    	gap:8px;
	}
}

.logo__img{
    width: 60px;
    height:auto;
    display:block;
    flex:none;
}

.footer__brand{
    display:flex;
    align-items:center;
    gap:14px;
}

.footer__logo{
    width:180px;
    height:auto;
    display:block;
    flex:none;
}

/* ---------- Hero (Home) ---------- */

.hero {
    position: relative;
    display: flex;
    flex-direction: column;

    min-height: 660px;
    overflow: hidden;

    background: var(--green);
    color: #fff;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;

    background:
        linear-gradient(180deg,
            rgba(38, 50, 22, .12),
            rgba(16, 22, 9, .48)),
        url(../assets/img/home/header/camo.jpg) center / cover;
}
/*
.hero__pic {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;

    width: 68%;

    background: url(../assets/img/home/header/tank2-front.jpg) right center / cover;

    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0, 0, 0, .4) 24%,
        #000 58%
    );

    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0, 0, 0, .4) 24%,
        #000 58%
    );
}
*/

.hero__pics {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.hero__pic {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;

    width: 68%;

    background-position: right center;
    background-size: cover;
    background-repeat: no-repeat;

    transition: opacity 1.5s ease;

    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.4) 24%,
        #000 58%
    );

    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.4) 24%,
        #000 58%
    );
}


.hero__pic--1 {
    opacity: 1;
}

.hero__pic--2 {
    opacity: 0;
}


.hero__wash {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(12, 18, 7, .6) 0%,
            rgba(12, 18, 7, .38) 28%,
            rgba(12, 18, 7, .12) 50%,
            rgba(12, 18, 7, 0) 68%
        ),
        linear-gradient(
            180deg,
            rgba(16, 22, 9, .4),
            transparent 24%,
            transparent 64%,
            rgba(16, 22, 9, .6)
        );
}

.hero__grid {
    position: absolute;
    inset: 0;

    opacity: .45;

    background-image:
        repeating-linear-gradient(
            90deg,
            rgba(255, 255, 255, .04) 0 1px,
            transparent 1px 68px
        );
}

.hero__inner {
    position: relative;
    display: flex;
    flex: 1;
    align-items: center;

    padding: 96px 0 88px;
}

.hero__content {
    max-width: 620px;
}

.hero__title {
    margin: 0 0 22px;

    font: 700 clamp(42px, 5.6vw, 72px) / 1.02 'Readex Pro', sans-serif;
    letter-spacing: -.01em;

    text-wrap: balance;
    text-shadow: 0 2px 20px rgba(0, 0, 0, .6);
}

.hero__sub {
    max-width: 52ch;
    margin: 0 0 32px;

    font: 400 19px / 1.6 'IBM Plex Sans', sans-serif;
    color: rgba(255, 255, 255, .9);

    text-shadow: 0 1px 12px rgba(0, 0, 0, .55);
}

.hero__actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.hero__stats {
    display: flex;
    gap: 44px;
    flex-wrap: wrap;

    margin-top: 52px;
}

.hero__stat b {
    display: block;

    font: 700 34px / 1 'Readex Pro', sans-serif;
    color: #fff;
}

.hero__stat span {
    display: block;

    max-width: 16ch;
    margin-top: 7px;

    font: 500 13px / 1.35 'IBM Plex Sans', sans-serif;
    color: rgba(255, 255, 255, .62);
}

.hero__tagline {
    position: relative;

    border-top: 1px solid rgba(255, 255, 255, .13);
    background: rgba(0, 0, 0, .28);
}

.hero__tagline .container {
    padding-top: 15px;
    padding-bottom: 15px;

    font: 600 12.5px / 1 'IBM Plex Sans', sans-serif;
    letter-spacing: .34em;
    text-transform: uppercase;

    color: rgba(255, 255, 255, .68);
}

/* ---------- Dark bands (page-hero, cta, corrosion) ---------- */
.band-dark{position:relative;overflow:hidden;background:var(--green);color:#fff}
.band-dark::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(52,68,32,.5),rgba(20,26,11,.9)),url(../assets/img/home/header/camo.jpg) center/cover}
.band-dark>*{position:relative}
.page-hero{padding:78px 0 70px}
.page-hero__title{font:700 clamp(36px,4.6vw,58px)/1.06 'Readex Pro',sans-serif;letter-spacing:-.01em;margin:0;max-width:24ch;text-wrap:balance}
.page-hero__sub{font:400 19px/1.6 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.8);margin:20px 0 0;max-width:56ch}

.cta{padding:88px 0;text-align:center}
.cta__inner{max-width:820px;margin:0 auto}
.cta h2{font:700 clamp(34px,4.4vw,52px)/1.08 'Readex Pro',sans-serif;letter-spacing:-.01em;margin:0 0 18px;text-wrap:balance}
.cta p{font:400 18px/1.65 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.8);margin:0 auto 30px;max-width:56ch}




/* ---------- Kennzahlen und BDSV-Logo ---------- */

.hero__stats {
    margin-top: 48px;
}

.hero__stats-items {
    display: flex;
    /*align-items: flex-end;*/
    flex-wrap: wrap;
    gap: 42px;
}

.hero__association {
    display: flex;
    align-items: center;
    flex: none;
}

.hero__association img {
    display: block;
    width: auto;
    max-height: 64px;
}

@media (max-width: 768px) {
    .hero__association {
        display: none;
    }
}

/* ---------- Grids & cards ---------- */

.grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:56px;
  align-items:center;
}

.grid-2--top{
  align-items:start;
}

.media{
  border-radius:9px;
  overflow:hidden;
}

.media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* ---------- Process Cards ---------- */

.process-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  gap:24px;
  margin-top:44px;
  align-items:stretch;
}

.process-item{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}

.process-media{
  aspect-ratio:16 / 9;
  border-radius:9px;
  overflow:hidden;
  background:#f3f3f3;
}

.process-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}

.process-item:hover .process-media img{
  transform:scale(1.03);
}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:9px;
}

.process-card{
  display:flex;
  flex-direction:column;
  padding:30px 28px;
  flex:1;
  min-width:0;
}

.process-card > *{
  min-width:0;
}

.tag{
  align-self:flex-start;
  font:600 11px/1 'IBM Plex Sans',sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--green-accent);
  background:var(--olive-pale);
  padding:7px 11px;
  border-radius:5px;
  margin-bottom:18px;
  overflow-wrap:anywhere;
}

.card-title{
  font:700 24px/1.15 'Readex Pro',sans-serif;
  color:var(--ink);
  margin:0 0 18px;
  overflow-wrap:anywhere;
  hyphens:auto;
}

.spec-list{
  display:flex;
  flex-direction:column;
  border-top:1px solid var(--line-soft);
}

.spec{
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:10px 0;
  border-bottom:1px solid var(--line-soft);
}

.spec dt{
  font:500 13.5px/1.4 'IBM Plex Sans',sans-serif;
  color:#697787;
  margin:0;
}

.spec dd{
  font:600 13.5px/1.4 'IBM Plex Sans',sans-serif;
  color:#1b2637;
  margin:0;
  text-align:right;
}

.note{
  font:400 12px/1.5 'IBM Plex Sans',sans-serif;
  color:#8a96a4;
  margin-top:16px;
  overflow-wrap:anywhere;
}

/* ---------- Lists ---------- */

.checklist{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin:0;
  padding:0;
  list-style:none;
}

.checklist li{
  display:flex;
  gap:13px;
  align-items:flex-start;
  font:500 16px/1.5 'IBM Plex Sans',sans-serif;
  color:#26313f;
}

.checklist svg{
  flex:none;
  margin-top:1px;
}

/* ---------- Misc ---------- */

.subheading{
  font:700 28px/1.15 'Readex Pro',sans-serif;
  color:var(--ink);
  margin:0 0 24px;
}

.values{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  gap:22px;
}

.value-card{
  padding:26px 24px 28px;
}

.value-card__n{
  font:700 15px/1 'Readex Pro',sans-serif;
  color:#cbcbb8;
  margin-bottom:16px;
}

.value-card h3{
  font:700 19px/1.2 'IBM Plex Sans',sans-serif;
  color:var(--ink);
  margin:0 0 12px;
}

.value-card p{
  font:400 14.5px/1.6 'IBM Plex Sans',sans-serif;
  color:var(--muted);
  margin:0;
}



/* ---------- Competence stats ---------- */

.stats{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:1px;
    margin-top:48px;
    background:var(--line);
    border:1px solid var(--line);
    border-radius:10px;
    overflow:hidden;
}

.stat{
    background:var(--card);
    padding:34px 28px;
    text-align:center;
}

.stat__icon{
    display:block;
    width:50px;
    height:50px;
    margin:0 auto 22px;

    background-color:var(--green);

    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    -webkit-mask-size:contain;

    mask-repeat:no-repeat;
    mask-position:center;
    mask-size:contain;
}

/* ---------- Einzelne Icons ---------- */

.icon-ausstattung{
    -webkit-mask-image:url("../assets/icons/Real-Estate-Dimensions-Block.svg");
    mask-image:url("../assets/icons/Real-Estate-Dimensions-Block.svg");
}

.icon-chemiker{
    -webkit-mask-image:url("../assets/icons/Multiple-Actions-Graduate.svg");
    mask-image:url("../assets/icons/Multiple-Actions-Graduate.svg");
}

.icon-projekte{
    -webkit-mask-image:url("../assets/icons/Project-Blueprint-Idea.svg");
    mask-image:url("../assets/icons/Project-Blueprint-Idea.svg");
}

.icon-patente{
    -webkit-mask-image:url("../assets/icons/Amazon-Web-Service-License-Manager-1.svg");
    mask-image:url("../assets/icons/Amazon-Web-Service-License-Manager-1.svg");
}

.icon-partner{
    -webkit-mask-image:url("../assets/icons/Study-Virtual-Classroom-2.svg");
    mask-image:url("../assets/icons/Study-Virtual-Classroom-2.svg");
}

.icon-forschungsprojekte{
    -webkit-mask-image:url("../assets/icons/Microscope-1.svg");
    mask-image:url("../assets/icons/Microscope-1.svg");
}

.stat b{
    display:block;
    font:700 44px/1 'Readex Pro',sans-serif;
    color:var(--green);
}

.stat span{
    display:block;
    margin:12px auto 0;
    max-width:18ch;
    font:500 15px/1.45 'IBM Plex Sans',sans-serif;
    color:var(--muted);
}



.highlight-list{display:flex;flex-direction:column;gap:16px;margin:0;padding:0;list-style:none}
.highlight-list li{display:flex;gap:14px;align-items:flex-start;padding-bottom:16px;border-bottom:1px solid var(--line-soft)}
.highlight-list .n{font:700 13px/1.5 'IBM Plex Sans',sans-serif;color:var(--green-accent);flex:none;width:24px}
.highlight-list .t{font:500 16.5px/1.5 'IBM Plex Sans',sans-serif;color:#26313f}

/* ---------- Applications ---------- */
.intro{max-width:1000px;margin:0 auto}
.intro__lead{font:400 20px/1.65 'IBM Plex Sans',sans-serif;color:#26313f;margin:0 0 22px;text-wrap:pretty}

/* ---------- Cards Einsatzgebiete ---------- */

.domains {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
}

.domain-card {
    display: flex;
    flex-direction: column;
    gap: 16px;

    min-height: 150px;
    padding: 24px 20px;

    align-items: center;
    text-align: center;
}

.domain-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 64px;
    height: 64px;

    background: var(--green);
    border-radius: 11px;

    align-self: center;
}

.domain-card__icon img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.domain-card__name {
    /*margin-top: auto;*/

    font: 600 17px/1.25 'IBM Plex Sans', sans-serif;
    color: var(--ink);
}

.block-title{font:700 26px/1.16 'Readex Pro',sans-serif;color:var(--ink);margin:0 0 14px}
.block-text{font:400 16.5px/1.65 'IBM Plex Sans',sans-serif;color:var(--text);margin:0}
.stack{display:flex;flex-direction:column;gap:24px}

.products{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.product-card{overflow:hidden}
.product-card__head{background:var(--green);color:#fff;padding:15px 20px;font:700 15px/1.2 'Readex Pro',sans-serif;letter-spacing:.02em}
.product-card__body{padding:8px 20px 14px}
.product-card__body div{font:500 15px/1.4 'IBM Plex Sans',sans-serif;color:#26313f;padding:11px 0;border-bottom:1px solid var(--line-soft)}

/* corrosion */
.corrosion{background:#0a1a08}
.corrosion::before{background:linear-gradient(rgba(30,38,17,.9),rgba(22,28,12,.94)),url(../assets/camo.jpg) center/cover}
.corr-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.corr-points{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.corr-point{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:9px;padding:22px 20px}
.corr-point h4{font:700 16px/1.2 'IBM Plex Sans',sans-serif;color:#fff;margin:0 0 10px}
.corr-point p{font:400 13.5px/1.55 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.68);margin:0}
.corr-foot{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;margin-top:44px;padding-top:44px;border-top:1px solid rgba(255,255,255,.12)}
.corr-foot h4{font:700 14px/1 'IBM Plex Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#9dbe7a;margin:0 0 18px}
.examples{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;margin:0;padding:0;list-style:none}
.examples li{display:flex;gap:10px;align-items:flex-start;font:500 15px/1.5 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.85)}
.examples li::before{content:"—";color:#9dbe7a;font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{font:600 13.5px/1 'IBM Plex Sans',sans-serif;color:#dce7f5;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);padding:9px 14px;border-radius:999px}

/* references */
.ref-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
.placeholder{position:relative;min-height:210px;border-radius:5px;overflow:hidden;
  background:linear-gradient(135deg,#3a4a20,#1c2410);display:flex;align-items:center;justify-content:center}
.placeholder::before{content:"";position:absolute;inset:0;
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 2px,transparent 2px 20px)}
.placeholder span{position:relative;font:600 11px/1.4 'IBM Plex Sans',sans-serif;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.68);text-align:center;padding:0 18px}

/* ---------- References ---------- */

.ref-grid--logos{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:24px;
    margin-top:8px;
}

.ref-logo{
    aspect-ratio:16 / 9;
    background:#fff;
    border-radius:8px;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.ref-logo img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.ref-logo:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 28px rgba(20,30,45,.10);
}

@media (max-width:1200px){
    .ref-grid--logos{
        grid-template-columns:repeat(4,1fr);
    }
}

@media (max-width:992px){
    .ref-grid--logos{
        grid-template-columns:repeat(3,1fr);
    }
}

@media (max-width:768px){
    .ref-grid--logos{
        grid-template-columns:repeat(2,1fr);
        gap:18px;
    }
}

@media (max-width:520px){
    .ref-grid--logos{
        grid-template-columns:1fr;
    }
}

/* ===================== DIENSTLEISTUNGEN ===================== */

.service-module {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(32px, 5vw, 80px);
}

.service-module__content {
  min-width: 0;
}

.service-module__content .h2 {
  max-width: 28ch;
}

.service-module__content .lead {
  margin: 24px 0 0;
}

.service-module__content > p:not(.eyebrow):not(.lead) {
  margin: 24px 0 0;
}

.service-module__media {
  min-width: 0;
  margin: 0;
}

.service-module__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* Bild links, Text rechts */
.service-module--reverse {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
}

.service-module--reverse .service-module__media {
  grid-column: 1;
  grid-row: 1;
}

.service-module--reverse .service-module__content {
  grid-column: 2;
  grid-row: 1;
}

@media (max-width: 991px) {
  .service-module,
  .service-module--reverse {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .service-module--reverse .service-module__content,
  .service-module--reverse .service-module__media {
    grid-column: auto;
    grid-row: auto;
  }
}

/* ===================== REFERENZEN TEXT ===================== */

.references {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px;
}

.references__group {
  min-width: 0;
  border-top: 3px solid #5f7238;
}

.references__heading {
  margin: 0;
  padding: 22px 0;
  font-size: 1.325rem;
  font-weight: 600;
  line-height: 1.5;
}

.references__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.references__list li {
  position: relative;
  padding: 17px 0 17px 32px;
  border-top: 1px solid rgba(53, 68, 32, 0.18);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: break-word;
}

.references__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(17px + 0.75em - 10px);
  width: 20px;
  height: 20px;
  background: url("/assets/icons/arrow-right-circle.svg")
              center / contain no-repeat;
}

.references__note {
  display: inline-block;
  font-size: 0.875rem;
  font-weight: 400;
}

@media (max-width: 767px) {
  .references {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:start}
.info-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:30px}
.info-card+.info-card{margin-top:22px}
.info-card__label{font:600 12px/1 'IBM Plex Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--green-accent);margin-bottom:18px}
.info-card__name{font:700 24px/1.1 'Readex Pro',sans-serif;color:var(--ink)}
.info-card__role{font:500 15px/1.4 'IBM Plex Sans',sans-serif;color:var(--muted);margin-top:6px}
.info-card__rows{display:flex;flex-direction:column;gap:12px;margin-top:22px;padding-top:22px;border-top:1px solid var(--line-soft)}
.info-card__rows a{display:flex;gap:11px;align-items:center;font:600 15px/1 'IBM Plex Sans',sans-serif;color:var(--green)}
.info-card__company{font:700 18px/1.3 'IBM Plex Sans',sans-serif;color:var(--ink)}
.info-card address{font:400 15px/1.7 'IBM Plex Sans',sans-serif;color:var(--muted);margin-top:8px;font-style:normal}

.form-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:34px}
.form-card h3{font:700 24px/1.15 'Readex Pro',sans-serif;color:var(--ink);margin:0 0 6px}
.form-card>p{font:400 15px/1.55 'IBM Plex Sans',sans-serif;color:var(--muted-light);margin:0 0 24px}
.form{display:flex;flex-direction:column;gap:16px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form label{display:flex;flex-direction:column;gap:7px;font:600 13px/1 'IBM Plex Sans',sans-serif;color:#3a4656}
.form input,.form textarea{width:100%;padding:12px 14px;border:1px solid #d3dae3;border-radius:7px;
  font:400 15px 'IBM Plex Sans',sans-serif;color:#0e1726;background:#fff}
.form input:focus,.form textarea:focus{border-color:var(--green-accent);outline:none}
.form textarea{resize:vertical}
.form-success{display:none;gap:13px;align-items:center;background:#eaf4ee;border:1px solid #bbdcc8;border-radius:8px;padding:22px 24px}
.form-success span{font:600 16px/1.4 'IBM Plex Sans',sans-serif;color:#1e5c38}
.is-sent .form{display:none}
.is-sent .form-success{display:flex}

.form__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 1.5;
}

.form__consent input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 3px 0 0;
}

.form-error {
  color: #a12622;
}

.form-error[hidden] {
  display: none;
}

.form button[type="submit"]:disabled {
  opacity: 0.65;
  cursor: wait;
}

/* ---------- Footer ---------- */
.footer{background:#00110a;color:rgba(255,255,255,.72);position:relative}
.footer .container{position:relative}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1.1fr 1fr;gap:48px;padding:64px 40px 40px}
.footer__brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.footer__about{font:400 14.5px/1.65 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.6);margin:0 0 18px;max-width:38ch}
.footer__tagline{font:600 11px/1 'IBM Plex Sans',sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#a9be7a}
.footer__h{font:700 12px/1 'IBM Plex Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin:0 0 18px}
.footer__links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}

.footer__links a
,.footer__links li{
	font:500 15px/1 'IBM Plex Sans',sans-serif;
	color:rgba(255,255,255,.72)
}
.footer__links a:hover{color:#fff}
.footer__addr{font:400 14.5px/1.8 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.66);font-style:normal}

.footer__contact {
	display:flex;
	flex-direction:column;
	gap:8px;
	margin-top:16px
}
.footer__contact a {
	font:600 14.5px/1 'IBM Plex Sans',sans-serif;
	color:#a9be7a;
}

.footer__contact a {
  display: flex;
  gap: 11px;
    row-gap: 11px;
    column-gap: 11px;
  align-items: center;
}

.footer__bar{border-top:1px solid rgba(255,255,255,.1)}
.footer__bar-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:22px 40px;
  font:400 13px/1 'IBM Plex Sans',sans-serif;color:rgba(255,255,255,.5)}
.footer__legal{display:flex;gap:24px;flex-wrap:wrap}
.footer__legal a{color:rgba(255,255,255,.55)}
.footer__legal a:hover{color:#fff}

.footer__bdsv {
    display: flex;
    align-items: center;
    flex: none;
	padding-top: 20px;
}

.footer__bdsv img {
    display: block;
    width: auto;
    max-height: 64px;
}

@media (max-width: 768px) {
    .footer__bdsv {
        display: none;
    }
}



/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .footer__grid{grid-template-columns:1fr 1fr;gap:40px}
}
@media (max-width:991px){
  .nav{display:none}
  .burger{display:flex}
  .header__right{margin-left:auto}
  .process-grid,.values,.domains,.products,.stats{grid-template-columns:1fr 1fr}
  .domains{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:768px){
  .container{padding:0 24px}
  .section{padding:64px 0}
  .grid-2,.contact-grid,.corr-grid,.corr-foot{grid-template-columns:1fr;gap:32px}
  .hero__pic{width:100%;opacity:.5;-webkit-mask-image:linear-gradient(180deg,transparent,#000 60%);mask-image:linear-gradient(180deg,transparent,#000 60%)}
  .process-grid,.values,.products,.stats,.examples,.corr-points{grid-template-columns:1fr}
  .domains{grid-template-columns:1fr 1fr}
  .footer__grid{grid-template-columns:1fr 1fr;padding:56px 24px 32px}
  .mobile-nav nav{padding:10px 24px 18px}
  .footer__bar-inner{padding:20px 24px}
  .footer__logo {
   width: 120px;

  }
}
@media (max-width:520px){
  .h2{font-size:28px}
  .domains,.footer__grid{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr}
  .hero__stats{gap:28px}
}
@media (max-width:400px){

  /*.logo__text{display:none}*/

}

/* Tastaturfokus für Sprachlinks */
.lang__btn:focus-visible{outline:2px solid var(--green);outline-offset:3px}