/* =========================================================
   STEINERLIZED BUSINESS — Preview im B2C-Look
   Farben/Typo gespiegelt aus dem B2C-Theme (Polo Kopie):
   Navy #0F1B2D, Weiß, Grau #8B8B8B, Border #E8E8E8, Soft #F7F7F7
   B2B-Akzent: feine Linie in Gold #B8960C
   Playfair Display (Headlines) + Assistant (Body)
   Inhalte/Bilder: 1:1 aus der bestehenden B2B-Seite
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --navy:#0F1B2D;
  --navy-soft:#1c2c44;
  --white:#FFFFFF;
  --grey:#8B8B8B;
  --border:#E8E8E8;
  --soft:#F7F7F7;
  --gold:#B8960C;
  --gold-lt:#D4AF37;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Assistant',-apple-system,system-ui,sans-serif;
  --content:1320px;
  --page:1440px;
}
html{scroll-behavior:smooth;font-size:100%;}
body{
  font-family:var(--sans);
  color:var(--navy);
  background:var(--white);
  font-size:15px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
em{font-style:italic;}
.wrap{max-width:var(--content);margin:0 auto;padding:0 32px;}

/* ── Eyebrow / Kicker (feine Gold-Linie) ────── */
.kicker{
  font-family:var(--sans);
  font-size:.72rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--grey);
  display:flex;align-items:center;gap:.7rem;
}
.kicker--center{justify-content:center;}
.kicker::before{content:'';width:28px;height:1px;background:var(--gold);display:block;}
.kicker--center::after{content:'';width:28px;height:1px;background:var(--gold);display:block;}

/* ── Headlines ──────────────────────────────── */
.sec-title{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.4vw,3rem);line-height:1.14;margin:1rem 0 1.1rem;}
.sec-title em{color:var(--navy);}
.sec-sub{font-size:1rem;color:var(--grey);font-weight:400;max-width:460px;}

/* ── Buttons (B2C-Stil) ─────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:14px 32px;font-family:var(--sans);font-size:13px;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;
  background:var(--navy);color:var(--white);border:1px solid var(--navy);
  cursor:pointer;transition:background .2s,color .2s;
}
.btn:hover{background:transparent;color:var(--navy);}
.btn--ghost{background:transparent;color:var(--navy);}
.btn--ghost:hover{background:var(--navy);color:var(--white);}
.btn--light{background:var(--white);color:var(--navy);border-color:var(--white);}
.btn--light:hover{background:transparent;color:var(--white);}
.btn--outline-white{background:transparent;color:var(--white);border-color:rgba(255,255,255,.6);}
.btn--outline-white:hover{background:var(--white);color:var(--navy);border-color:var(--white);}

/* ── TOP BAR (Marke + B2B-Kennung, Gold-Hairline) ── */
.topbar{height:38px;background:var(--navy);color:var(--white);display:flex;align-items:center;font-size:11px;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--gold);}
.topbar-inner{max-width:var(--page);width:100%;margin:0 auto;padding:0 32px;display:flex;align-items:center;justify-content:center;position:relative;}
.topbar-promo{text-align:center;opacity:.95;}
.topbar-promo b{font-weight:700;letter-spacing:.1em;}
.topbar-link{position:absolute;right:32px;display:flex;align-items:center;gap:.4rem;opacity:.85;transition:opacity .15s;}
.topbar-link:hover{opacity:1;}

/* ── HEADER ─────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:200;background:var(--white);border-bottom:1px solid var(--border);}
.header-inner{max-width:var(--page);margin:0 auto;padding:0 32px;height:80px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;}
.logo-lockup{display:flex;align-items:center;gap:12px;}
.logo-img{height:44px;width:auto;}
.logo-badge{font-family:var(--sans);font-size:.58rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--navy);border:1px solid var(--gold);padding:4px 9px;border-radius:2px;}
.main-nav{display:flex;gap:26px;justify-content:center;}
.main-nav a{font-size:13px;font-weight:500;letter-spacing:.06em;color:var(--navy);text-transform:uppercase;transition:color .15s;}
.main-nav a:hover{color:var(--grey);}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:16px;}
.header-actions .lang{font-size:12px;letter-spacing:.1em;border:1px solid var(--border);padding:6px 10px;color:var(--navy);}
.header-actions .lang:hover{border-color:var(--navy);}
.header-cta{padding:10px 22px;font-size:12px;}
.nav-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:.4rem;}
.nav-hamburger span{display:block;width:22px;height:2px;background:var(--navy);transition:transform .3s,opacity .3s;}
.nav-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-hamburger.open span:nth-child(2){opacity:0;}
.nav-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:1px solid var(--border);padding:.5rem 20px 1.5rem;flex-direction:column;box-shadow:0 12px 24px rgba(15,27,45,.08);}
.nav-mobile-menu.open{display:flex;}
.nav-mobile-menu a{font-size:.9rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--navy);text-decoration:none;padding:.9rem 0;border-bottom:1px solid var(--border);}
.nav-mobile-menu a:last-child{border-bottom:none;}

/* ── HERO (Full-Bleed Banner, B2C hero-slider Stil) ── */
.hero{position:relative;min-height:84vh;display:flex;align-items:center;color:var(--white);overflow:hidden;}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,27,45,.82) 0%,rgba(15,27,45,.55) 45%,rgba(15,27,45,.2) 100%);}
.hero-content{position:relative;z-index:2;max-width:var(--content);width:100%;margin:0 auto;padding:0 32px;}
.hero-inner{max-width:640px;}
.hero .kicker{color:#cfd6e2;}
.hero .kicker::before{background:var(--gold-lt);}
.hero-title{font-family:var(--serif);font-weight:400;font-size:clamp(2.8rem,5.5vw,4.6rem);line-height:1.05;margin:1.6rem 0 1.4rem;}
.hero-title em{color:#dfe5ee;font-style:italic;}
.hero-sub{font-size:1.1rem;font-weight:300;color:#e6eaf1;max-width:440px;margin-bottom:2.2rem;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}

/* ── STATS BAR ──────────────────────────────── */
.stats{background:var(--navy);color:var(--white);}
.stats-inner{max-width:var(--content);margin:0 auto;padding:34px 32px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.stat{text-align:center;border-right:1px solid rgba(255,255,255,.12);}
.stat:last-child{border-right:none;}
.stat-num{font-family:var(--serif);font-size:2.4rem;font-weight:500;line-height:1;}
.stat-label{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#aab4c4;margin-top:.5rem;}

/* ── Generic Section ────────────────────────── */
section.block{padding:6.5rem 0;}
.center-head{text-align:center;max-width:560px;margin:0 auto 3.5rem;}

/* ── PROCESS PATH (Kundenreise) ─────────────── */
.process-steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem;}
/* durchgehende Verbindungslinie durch die Kreismittelpunkte */
.process-steps::before{content:'';position:absolute;top:31px;left:12.5%;right:12.5%;height:2px;background:var(--border);z-index:0;}
.process-step{position:relative;z-index:1;text-align:center;padding:0 1rem;}
/* Verbindungslinie zwischen zwei Schritten in Gold "abgelaufen" einfärben (Akzent) */
.process-step:not(:last-child)::before{content:'';position:absolute;top:31px;left:50%;right:-50%;height:2px;background:linear-gradient(to right,var(--gold),transparent);opacity:.35;z-index:0;}
.process-num{width:62px;height:62px;border-radius:50%;background:var(--navy);color:var(--white);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.4rem;font-weight:500;margin:0 auto 1.7rem;position:relative;z-index:2;box-shadow:0 0 0 8px var(--white);}
.process-num::after{content:'';position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--gold);}
.process-step h3{font-family:var(--serif);font-weight:500;font-size:1.28rem;margin-bottom:.55rem;}
.process-step p{font-size:.9rem;color:var(--grey);}
.process-cta{text-align:center;margin-top:3.4rem;}

/* ── REFERENZEN BANNER (Navy Laufband) ──────── */
.ref{background:var(--navy);color:var(--white);padding:3.5rem 0 3rem;overflow:hidden;}
.ref-label{text-align:center;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:#aab4c4;margin-bottom:2rem;}
.ref-wrap{overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);}
.ref-track{display:flex;gap:3.5rem;width:max-content;animation:scroll 60s linear infinite;}
.ref-track:hover{animation-play-state:paused;}
.ref-card{flex-shrink:0;text-align:center;min-width:150px;}
.ref-name{font-family:var(--serif);font-size:1.25rem;font-weight:500;color:rgba(255,255,255,.9);white-space:nowrap;}
.ref-prod{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:.3rem;white-space:nowrap;}
@keyframes scroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ── EDITORIAL SPLIT (Warum) ────────────────── */
.split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:0;}
.split-text{padding:6.5rem clamp(2rem,5vw,5rem);}
.split-img{align-self:stretch;min-height:540px;overflow:hidden;}
.split-img img{width:100%;height:100%;object-fit:cover;}
.feature{display:flex;gap:1.2rem;margin-top:1.8rem;}
.feature-num{font-family:var(--serif);font-size:1.1rem;color:var(--gold);min-width:32px;}
.feature h4,.feature h3{font-size:1.02rem;font-weight:600;margin-bottom:.3rem;}
.feature p{font-size:.92rem;color:var(--grey);}

/* ── STORYTELLING BANNER (NEU, B2C-Stil) ────── */
.story{position:relative;min-height:62vh;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--white);overflow:hidden;}
.story img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;}
.story-overlay{position:absolute;inset:0;background:rgba(15,27,45,.55);}
.story-content{position:relative;z-index:2;max-width:720px;padding:0 32px;}
.story .kicker{color:#cfd6e2;justify-content:center;}
.story .kicker::before,.story .kicker::after{background:var(--gold-lt);}
.story h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4vw,3.4rem);line-height:1.12;margin:1.2rem 0 2rem;}

/* ── ÜBER UNS ───────────────────────────────── */
.about{background:var(--soft);}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}
.about-img-wrap{position:relative;}
.about-img-wrap .frame{position:absolute;bottom:-1.4rem;left:-1.4rem;width:55%;height:55%;border:1px solid var(--gold);z-index:0;}
.about-img-wrap img{position:relative;z-index:1;aspect-ratio:4/5;object-fit:cover;object-position:center 20%;width:100%;}
.about p.lead{font-size:1.02rem;color:var(--navy);line-height:1.85;margin-bottom:1.5rem;}
.team{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2.5rem;}
.team-card{text-align:center;}
.team-card .avatar{width:96px;height:96px;border-radius:50%;border:1px solid var(--gold);overflow:hidden;margin:0 auto 1rem;}
.team-card .avatar img{width:100%;height:100%;object-fit:cover;object-position:center 20%;}
.team-card .name{font-family:var(--serif);font-size:1.1rem;font-weight:500;}
.team-card .role{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-top:.2rem;}

/* ── KATALOG-TEASER (NEU, Produkt-Banner) ───── */
.catalog-scroller{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.catalog-scroller::-webkit-scrollbar{display:none;}
.catalog-strip{display:flex;gap:1.6rem;width:max-content;padding:0 max(32px,calc((100% - var(--content))/2 + 32px));}
.catalog-tile{flex:0 0 clamp(340px,33vw,480px);scroll-snap-align:start;position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--soft);border:1px solid var(--border);}
a.catalog-tile{color:inherit;text-decoration:none;}
.catalog-tile img{width:100%;height:100%;object-fit:contain;padding:2.4rem;mix-blend-mode:multiply;transition:transform .5s;}
.catalog-tile:hover img{transform:scale(1.04);}
.catalog-tile span{position:absolute;left:0;right:0;bottom:0;padding:14px;background:linear-gradient(transparent,rgba(15,27,45,.78));color:var(--white);font-family:var(--serif);font-size:1.05rem;}
/* feiner Fortschrittsbalken (folgt dem Wischen) */
.catalog-progress{max-width:480px;margin:1.9rem auto 0;padding:0 32px;}
.catalog-progress-track{position:relative;height:2px;background:var(--border);border-radius:2px;overflow:hidden;}
.catalog-progress-thumb{position:absolute;top:0;left:0;height:2px;width:30%;background:var(--navy);border-radius:2px;}

/* ── BRANCHEN ───────────────────────────────── */
.industries-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.industry{border:1px solid var(--border);padding:2.4rem 1.8rem;transition:border-color .2s,transform .2s;position:relative;}
.industry::after{content:'';position:absolute;left:0;top:0;width:0;height:2px;background:var(--gold);transition:width .25s;}
.industry:hover{border-color:var(--navy);transform:translateY(-3px);}
.industry:hover::after{width:100%;}
.industry-icon{font-size:1.8rem;}
.industry-name{font-family:var(--serif);font-size:1.25rem;font-weight:500;margin:.8rem 0 .5rem;}
.industry-desc{font-size:.9rem;color:var(--grey);}

/* ── CONTACT ────────────────────────────────── */
.contact{background:var(--navy);color:var(--white);}
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:5rem;}
.contact .kicker{color:#cfd6e2;}.contact .kicker::before{background:var(--gold-lt);}
.contact .sec-title{color:var(--white);}
.contact .sec-sub{color:#c4cdda;}
.contact-detail{display:flex;gap:1rem;align-items:flex-start;margin-top:1.8rem;}
.contact-detail .ic{font-size:1.1rem;color:var(--gold-lt);width:1.5rem;flex-shrink:0;text-align:center;}
.contact-detail .lbl{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#aab4c4;}
.contact-detail .val{font-size:1rem;}
.form-card{background:var(--white);color:var(--navy);padding:2.6rem;border-top:2px solid var(--gold);}
.form-title{font-family:var(--serif);font-size:1.6rem;font-weight:500;margin-bottom:.4rem;}
.form-sub{font-size:.9rem;color:var(--grey);margin-bottom:1.6rem;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem;}
.form-group{display:flex;flex-direction:column;}
.form-group label{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);margin-bottom:.4rem;}
.form-group input,.form-group select,.form-group textarea{border:1px solid var(--border);padding:11px 12px;font-family:var(--sans);font-size:.92rem;color:var(--navy);background:var(--white);}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--navy);}
.form-group textarea{min-height:90px;resize:vertical;}
.form-full{margin-bottom:1rem;}
.form-submit{width:100%;}
.form-note{font-size:.72rem;color:var(--grey);margin-top:1rem;}

/* ── FOOTER ─────────────────────────────────── */
footer{background:#0a131f;color:#c4cdda;padding:3.5rem 0;border-top:1px solid var(--gold);}
.footer-inner{max-width:var(--content);margin:0 auto;padding:0 32px;display:flex;flex-direction:column;align-items:center;gap:1.4rem;text-align:center;}
.footer-logo{display:flex;align-items:center;gap:12px;}
.footer-logo .logo-img{height:41px;filter:brightness(0) invert(1);}
.footer-logo .logo-badge{color:var(--white);border-color:var(--gold);}
.footer-links{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center;font-size:.85rem;list-style:none;}
.footer-links a:hover{color:var(--white);}
.footer-copy{font-size:.78rem;color:#6c7889;}

/* ── PREVIEW-Hinweisleiste ──────────────────── */
.preview-flag{background:#fff8e1;color:#7a5c00;text-align:center;font-size:12px;padding:8px 16px;border-bottom:1px solid #f0e2b0;letter-spacing:.04em;}

/* ── Responsive ─────────────────────────────── */
@media(max-width:1024px){
  .main-nav{display:none;}
  .header-inner{grid-template-columns:auto 1fr;padding:0 20px;column-gap:12px;}
  .nav-hamburger{display:flex;}
  .split,.about-grid,.contact-grid{grid-template-columns:1fr;}
  .split-img{min-height:360px;}
  /* Prozess wird zum vertikalen Pfad */
  .process-steps{grid-template-columns:1fr;gap:0;max-width:460px;margin:1rem auto 0;}
  .process-steps::before{display:none;}
  .process-step{display:grid;grid-template-columns:62px 1fr;column-gap:1.4rem;text-align:left;padding:0 0 2.6rem;}
  .process-step:last-child{padding-bottom:0;}
  .process-num{margin:0;grid-column:1;grid-row:1/-1;align-self:start;}
  .process-step h3,.process-step p{grid-column:2;}
  .process-step:not(:last-child)::before{content:'';position:absolute;top:62px;bottom:0;left:31px;right:auto;width:2px;height:auto;background:linear-gradient(to bottom,var(--gold),var(--border));opacity:.5;transform:none;}
  .process-step h3{margin-top:.5rem;}
  .stats-inner{grid-template-columns:repeat(2,1fr);}
  .stat:nth-child(2){border-right:none;}
  .industries-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){
  .topbar-link{display:none;}
  .header-inner{padding:0 16px;}
  .logo-img{height:30px;}
  .logo-badge{display:none;}
  .header-actions{gap:8px;}
  .header-actions .lang{padding:6px 8px;font-size:11px;}
  .header-cta{padding:9px 13px;font-size:11px;}
  .form-row{grid-template-columns:1fr;}
  .catalog-tile{flex-basis:78vw;}
  .industries-grid,.stats-inner{grid-template-columns:1fr;}
  .stat{border-right:none;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:14px;}
}
/* Scroll-Reveal Animationen (nur mit JS aktiv, progressive enhancement) */
.js-anim .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1);will-change:opacity,transform;}
.js-anim .reveal.visible{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.js-anim .reveal{opacity:1!important;transform:none!important;transition:none!important;}}

/* ── MOAT / TRUST GRID (Lokal-Landingpages) ───── */
.moat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:1rem;}
.moat-card{border:1px solid var(--border);padding:2rem 1.8rem;position:relative;}
.moat-card::after{content:'';position:absolute;left:0;top:0;width:0;height:2px;background:var(--gold);transition:width .25s;}
.moat-card:hover::after{width:100%;}
.moat-card .moat-num{font-family:var(--serif);font-size:.95rem;color:var(--gold);letter-spacing:.08em;}
.moat-card h3{font-family:var(--serif);font-size:1.2rem;font-weight:500;margin:.7rem 0 .5rem;}
.moat-card p{font-size:.9rem;color:var(--grey);}

/* ── LOCAL PROOF STRIP ───────────────────────── */
.local-proof{display:flex;flex-wrap:wrap;gap:2.4rem;align-items:flex-start;background:var(--soft);border:1px solid var(--border);padding:2.2rem 2.4rem;margin-top:1rem;}
.local-proof-item{flex:1;min-width:200px;}
.local-proof-item .lbl{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:.4rem;}
.local-proof-item p{font-size:.92rem;color:var(--navy);margin:0;}

/* ── INDUSTRY CARD AS LINK ───────────────────── */
a.industry{display:block;text-decoration:none;color:inherit;}
.industry-link-hint{font-size:.78rem;color:var(--gold);margin-top:.7rem;font-weight:600;letter-spacing:.02em;}

/* ── MINI FAQ (statisch, verlinkt auf volle FAQ) ── */
.mini-faq{display:grid;gap:1px;background:var(--border);border:1px solid var(--border);margin-top:1rem;}
.mini-faq-item{background:var(--white);padding:1.6rem 1.8rem;}
.mini-faq-item h3{font-family:var(--serif);font-size:1.05rem;font-weight:500;margin-bottom:.5rem;}
.mini-faq-item p{font-size:.9rem;color:var(--grey);margin:0;}

@media(max-width:1024px){
  .moat-grid{grid-template-columns:1fr;}
  .local-proof{flex-direction:column;gap:1.4rem;}
}
