/* Vektor — geteiltes CI, generiert 20260623. EINZIGE Design-Quelle (Mainpage-CSS). */

:root {
  --bg-0: #F5F2EA;
  --bg-1: #EDE9DF;
  --bg-2: #E4E0D5;
  --bg-3: #D8D4C8;
  --bg-4: #C8C4B8;
  --t1: #0F0E0C;
  --t2: #4A4840;
  --t3: #7A7870;
  --t4: #A8A49C;
  --y: #A67C00;
  --y-light: #C9A227;
  --y-bg: rgba(166,124,0,0.07);
  --y-border: rgba(166,124,0,0.22);
  --y-hover: #8A6600;
  --font: 'DM Sans', system-ui, -apple-system, sans-serif;
  --radius: 8px;
  --section: clamp(64px,10vw,100px) clamp(20px,5vw,52px);
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background: var(--bg-0); color: var(--t1); font-family: var(--font); font-size: 15px; line-height: 1.65; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
nav { position: fixed; top:0; left:0; right:0; z-index:200; height: 60px; background: rgba(245,242,234,0.96); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--bg-3); display: flex; align-items: center; padding: 0 clamp(20px,5vw,52px); }
.v-mark { width: 30px; height: 30px; background: var(--y); border-radius: 5px; display: flex; align-items: center; justify-content: center; font-family: 'Arial Black', sans-serif; font-weight: 900; font-size: 16px; color: #000; flex-shrink: 0; }
.nav-name { margin-left: 10px; font-size: 15px; font-weight: 700; letter-spacing: -.02em; color: var(--t1); line-height: 1.2; }
.nav-name em { font-style: normal; font-weight: 700; color: var(--t1); font-size: 15px; display: inline; letter-spacing: -.02em; }
.nav-links { margin-left: auto; display: flex; align-items: center; gap: 2px; }
.nav-link { padding: 6px 12px; font-size: 13px; color: var(--t2); border-radius: 6px; transition: color .15s, background .15s; white-space: nowrap; }
.nav-link:hover { color: var(--t1); background: var(--bg-1); }
.nav-cta { margin-left: 8px; padding: 8px 18px; background: var(--y); color: #000000; font-size: 13px; font-weight: 600; border-radius: var(--radius); transition: background .15s; white-space: nowrap; }
.nav-cta:hover { background: var(--y-hover); }
.nav-menu-btn { display: none; margin-left: auto; background: none; border: none; cursor: pointer; padding: 8px; color: var(--t1); flex-direction: column; gap: 5px; }
.nav-menu-btn span { display: block; width: 22px; height: 1.5px; background: var(--t1); border-radius: 1px; transition: all .2s; }
.nav-menu-btn.open span:nth-child(1) { transform: rotate(45deg) translate(4.5px,4.5px); }
.nav-menu-btn.open span:nth-child(2) { opacity: 0; }
.nav-menu-btn.open span:nth-child(3) { transform: rotate(-45deg) translate(4.5px,-4.5px); }
.nav-drawer { display: none; position: fixed; top: 60px; left: 0; right: 0; background: var(--bg-1); border-bottom: 1px solid var(--bg-3); padding: 16px 20px 20px; z-index: 199; flex-direction: column; gap: 4px; }
.nav-drawer.open { display: flex; }
.drawer-link { display: block; padding: 12px 14px; font-size: 15px; color: var(--t2); border-radius: var(--radius); transition: background .12s, color .12s; }
.drawer-link:hover { background: var(--bg-2); color: var(--t1); }
.drawer-cta { display: block; margin-top: 8px; padding: 13px 14px; background: var(--y); color: #000000; font-size: 15px; font-weight: 600; border-radius: var(--radius); text-align: center; }
#hero { min-height: 100svh; background: var(--bg-0); display: flex; align-items: center; padding: clamp(100px,16vw,140px) clamp(20px,5vw,52px) clamp(60px,10vw,80px); position: relative; overflow: hidden; }
#hero::before { display: none; }
#hero::after { display: none; }
.hero-inner { position: relative; z-index: 1; max-width: 720px; width: 100%; }
.hero-tag { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; color: var(--t3); margin-bottom: clamp(18px,3vw,24px); }
.hero-tag-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--y); flex-shrink: 0; }
.hero-brand { font-size: clamp(12px,1.6vw,14px); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--y); margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.hero-brand::before { content: ''; display: block; width: 28px; height: 1.5px; background: var(--y); flex-shrink: 0; }
.hero-h1 { font-size: clamp(34px,6vw,72px); font-weight: 700; letter-spacing: -.035em; line-height: 1.06; color: var(--t1); margin-bottom: clamp(16px,2.5vw,22px); }
.hero-sub { font-size: clamp(15px,2.2vw,18px); font-weight: 300; color: var(--t2); max-width: 540px; line-height: 1.75; margin-bottom: 10px; }
.hero-detail { font-size: 13px; color: var(--t3); margin-bottom: clamp(28px,5vw,42px); }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: clamp(40px,6vw,56px); }
.btn-primary { display: inline-flex; align-items: center; gap: 8px; background: var(--y); color: #000; font-size: clamp(13px,1.8vw,14px); font-weight: 600; padding: 13px 22px; border-radius: var(--radius); transition: background .15s; white-space: nowrap; }
.btn-primary:hover { background: var(--y-hover); }
.btn-ghost { font-size: clamp(13px,1.8vw,14px); font-weight: 400; color: var(--t2); display: inline-flex; align-items: center; gap: 6px; transition: color .15s; }
.btn-ghost:hover { color: var(--t1); }
.hero-proof { display: flex; flex-wrap: wrap; gap: 0; padding-top: clamp(28px,4vw,40px); border-top: 1px solid var(--bg-3); }
.proof-item { padding: 0 clamp(20px,4vw,40px) 0 0; margin-right: clamp(20px,4vw,40px); border-right: 1px solid var(--bg-3); }
.proof-item:last-child { border-right: none; margin-right: 0; padding-right: 0; }
.proof-num { font-size: clamp(24px,3.5vw,34px); font-weight: 700; letter-spacing: -.03em; color: var(--y-light); line-height: 1; }
.proof-label { font-size: 11px; color: var(--t3); margin-top: 4px; }
.section { padding: var(--section); }
.section-alt { background: var(--bg-1); border-top: 1px solid var(--bg-3); }
.section-tag { font-size: 11px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--y); display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.section-tag::before { content: ''; display: block; width: 18px; height: 1.5px; background: var(--y); flex-shrink: 0; }
.section-h2 { font-size: clamp(24px,3.8vw,46px); font-weight: 700; letter-spacing: -.03em; line-height: 1.1; color: var(--t1); margin-bottom: clamp(16px,3vw,24px); }
.emp-body { font-size: clamp(14px,2vw,16px); font-weight: 300; color: var(--t2); max-width: 560px; line-height: 1.85; }
.emp-body p { margin-bottom: 14px; }
.emp-body p:last-child { margin-bottom: 0; }
.emp-body strong { color: var(--t1); font-weight: 500; }
#proof-strip { background: var(--bg-0); border-top: 1px solid var(--y-border); border-bottom: 1px solid var(--y-border); padding: clamp(32px,5vw,48px) clamp(20px,5vw,52px); display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background-color: var(--bg-3); }
.ps-cell { background: var(--bg-0); padding: 24px 20px; text-align: center; }
.ps-num { font-size: clamp(34px,5vw,50px); font-weight: 700; letter-spacing: -.04em; color: var(--y-light); line-height: 1; }
.ps-label { font-size: 11px; color: var(--t3); margin-top: 6px; }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 10px; margin-top: clamp(32px,5vw,48px); }
.svc-card { background: var(--bg-0); border: 1px solid var(--bg-3); border-radius: var(--radius); padding: clamp(24px,4vw,32px) clamp(20px,3vw,28px); position: relative; transition: border-color .2s, background .2s; }
.svc-card:hover { border-color: var(--bg-4); background: var(--bg-1); }
.svc-card.featured { border-color: var(--y-border); background: rgba(166,124,0,0.03); }
.svc-badge { position: absolute; top: 16px; right: 16px; background: var(--y); color: #000; font-size: 10px; font-weight: 600; letter-spacing: .04em; padding: 3px 9px; border-radius: 4px; text-transform: uppercase; }
.svc-icon { width: 40px; height: 40px; background: var(--bg-1); border: 1px solid var(--bg-3); border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 18px; margin-bottom: 18px; }
.svc-title { font-size: clamp(15px,2vw,17px); font-weight: 600; color: var(--t1); margin-bottom: 10px; }
.svc-body { font-size: 14px; font-weight: 300; color: var(--t2); line-height: 1.75; margin-bottom: 20px; }
.svc-link { font-size: 13px; font-weight: 600; color: var(--y); display: inline-flex; align-items: center; gap: 5px; transition: gap .15s; }
.svc-link:hover { gap: 8px; }
.process-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 10px; margin-top: clamp(32px,5vw,48px); }
.step-card { background: var(--bg-1); border: 1px solid var(--bg-3); border-radius: var(--radius); padding: clamp(24px,4vw,32px) clamp(20px,3vw,28px); transition: border-color .15s; }
.step-card:hover { border-color: var(--bg-4); }
.step-num { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--y); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.step-num::before { content: ''; display: block; width: 14px; height: 1.5px; background: var(--y); flex-shrink: 0; }
.step-title { font-size: clamp(15px,2vw,18px); font-weight: 600; color: var(--t1); margin-bottom: 10px; }
.step-body { font-size: 14px; font-weight: 300; color: var(--t2); line-height: 1.75; }
.team-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 10px; margin-top: clamp(32px,5vw,48px); }
.team-card { background: var(--bg-0); border: 1px solid var(--bg-3); border-radius: var(--radius); padding: clamp(28px,4vw,36px) clamp(20px,3vw,32px); }
.team-avatar { width: 52px; height: 52px; background: var(--y-bg); border: 1px solid var(--y-border); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700; color: var(--y); margin-bottom: 18px; }
.team-name { font-size: clamp(18px,2.5vw,22px); font-weight: 700; letter-spacing: -.02em; color: var(--t1); margin-bottom: 3px; }
.team-role { font-size: 11px; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; color: var(--t3); margin-bottom: 18px; }
.team-divider { width: 24px; height: 1.5px; background: var(--y-border); margin-bottom: 18px; }
.team-bio { font-size: 14px; font-weight: 300; color: var(--t2); line-height: 1.8; margin-bottom: 18px; }
.team-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { font-size: 11px; color: var(--t2); padding: 3px 10px; border: 1px solid var(--bg-3); border-radius: 100px; background: var(--bg-1); }
.blog-preview-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 10px; margin-top: clamp(32px,5vw,48px); }
.blog-card { background: var(--bg-0); border: 1px solid var(--bg-3); border-radius: var(--radius); padding: clamp(20px,3vw,28px); display: flex; flex-direction: column; gap: 12px; transition: border-color .2s; }
.blog-card:hover { border-color: var(--bg-4); }
.blog-card.new { border-color: var(--y-border); }
.blog-card-tag { font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--t3); }
.blog-card-badge { display: inline-block; background: var(--y); color: #000; font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 3px; margin-left: 7px; }
.blog-card-h3 { font-size: clamp(15px,2vw,17px); font-weight: 600; color: var(--t1); line-height: 1.3; flex: 1; }
.blog-card-meta { font-size: 12px; color: var(--t3); }
.blog-card-link { font-size: 13px; font-weight: 600; color: var(--y); display: inline-flex; align-items: center; gap: 5px; transition: gap .15s; }
.blog-card:hover .blog-card-link { gap: 8px; }
.form-container { max-width: 560px; margin: 0 auto; }
.form-header { text-align: center; margin-bottom: clamp(32px,5vw,48px); }
.form-header .section-tag { justify-content: center; }
.form-sub { font-size: clamp(14px,2vw,16px); font-weight: 300; color: var(--t2); line-height: 1.7; margin-top: 14px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field label { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--t3); }
.form-field input,.form-field textarea { background: var(--bg-0); border: 1px solid var(--bg-3); color: var(--t1); padding: 11px 14px; font-family: var(--font); font-size: 15px; font-weight: 300; border-radius: var(--radius); outline: none; transition: border-color .15s, background .15s; width: 100%; -webkit-appearance: none; }
.form-field input::placeholder,.form-field textarea::placeholder { color: var(--t4); }
.form-field input:focus,.form-field textarea:focus { border-color: var(--y); background: var(--bg-1); }
.form-field textarea { height: 90px; resize: none; }
.form-submit { width: 100%; background: var(--y); color: #000; border: none; padding: 14px; font-family: var(--font); font-size: 15px; font-weight: 600; border-radius: var(--radius); cursor: pointer; margin-top: 4px; transition: background .15s; -webkit-appearance: none; touch-action: manipulation; }
.form-submit:hover { background: var(--y-hover); }
.form-note { text-align: center; font-size: 12px; color: var(--t4); margin-top: 10px; font-weight: 300; }
footer { padding: clamp(28px,5vw,40px) clamp(20px,5vw,52px); background: var(--bg-1); border-top: 1px solid var(--bg-3); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.footer-info { font-size: 12px; color: var(--t4); }
.footer-links { display: flex; gap: 4px; }
.footer-link { font-size: 12px; color: var(--t3); padding: 4px 10px; border-radius: 4px; transition: color .15s; }
.footer-link:hover { color: var(--t1); }
@media(max-width:768px) { .nav-links { display: none; } .nav-menu-btn { display: flex; } .hero-proof .proof-item { padding-right: 16px; margin-right: 16px; } #proof-strip { grid-template-columns: 1fr 1fr; } .services-grid,.process-grid,.team-grid,.blog-preview-grid { grid-template-columns: 1fr; } .form-grid { grid-template-columns: 1fr; } footer { flex-direction: column; align-items: flex-start; } }
@media(max-width:480px) { .hero-h1 { font-size: 30px; } .proof-num { font-size: 22px; } .hero-proof .proof-item { padding-right: 12px; margin-right: 12px; } }
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--bg-3); border-radius: 2px; }


/* ============ HERO (Desktop-Basis) ============ */
#hero{padding-top:74px!important}
#hero .hero-tag{display:none!important}
#hero .hero-inner{max-width:1180px!important;margin:0 auto!important;width:100%!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important}
#hero .hero-brand{margin:0 0 94px 0!important;line-height:0!important;font-size:0!important;padding:0!important}
#hero .hero-brand::before{display:none!important}
#hero .hero-brand img{display:block!important;width:clamp(300px,50vw,660px)!important;height:auto!important;margin:0 auto!important}
#hero .hero-h1{font-size:clamp(30px,3.8vw,58px)!important;line-height:1.12!important;letter-spacing:-.03em!important;width:100%!important;max-width:700px!important;margin:0 auto!important;text-align:center!important}
#hero .hero-sub{font-size:clamp(16px,1.4vw,20px)!important;width:100%!important;max-width:700px!important;margin:26px auto 0!important;text-align:center!important}
#hero .hero-detail{width:100%!important;max-width:700px!important;margin:14px auto 0!important;text-align:center!important}
#hero .hero-actions{width:100%!important;max-width:700px!important;justify-content:center!important;margin:34px auto 0!important}
#hero .hero-proof{width:100%!important;max-width:700px!important;margin:40px auto 0!important;justify-content:center!important}
/* Desktop: Logo ~1cm hoeher, aber nur auf hohen Fenstern (sonst Nav-Ueberlappung) */
@media(min-width:681px) and (min-height:900px){ #hero .hero-inner{transform:translateY(-38px)!important} }
/* ============ HERO (Mobile: Logo+Text mittig, Kennzahlen unten am Rand) ============ */
@media(max-width:680px){
  #hero{position:relative!important;min-height:100svh!important;align-items:center!important}
  #hero .hero-inner{position:static!important;padding-top:0!important;padding-bottom:120px!important;transform:none!important}
  #hero .hero-brand{margin:0 0 clamp(40px,6vh,58px) 0!important}
  #hero .hero-brand img{width:clamp(225px,55vw,300px)!important}
  #hero .hero-proof{position:absolute!important;bottom:clamp(26px,4vh,42px)!important;left:50%!important;transform:translateX(-50%)!important;width:90%!important;max-width:700px!important;margin:0!important}
}
/* ============ NAV-LOGO (nur kleines V) ============ */
.v-mark{width:34px!important;height:34px!important;background:none!important;border:none!important;padding:0!important;font-size:0!important;display:block!important}
.v-mark img{width:100%!important;height:100%!important;display:block!important}
.nav-name{display:none!important}
/* ============ ALLE SEKTIONEN ZENTRIEREN ============ */
.section .section-tag{justify-content:center!important}
.section .section-h2{text-align:center!important}
#empathy .emp-body{max-width:790px!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
#diskretion .d-lead{max-width:730px!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
#faq .f-wrap{margin-left:auto!important;margin-right:auto!important;text-align:center!important}
section#marktcheck .form-container{margin-left:auto!important;margin-right:auto!important}
#marktcheck .form-header{text-align:center!important}
#marktcheck .form-sub,#marktcheck .form-header>p{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
/* ============ GOLD-BUTTONS: Creme-Text statt Schwarz ============ */
.nav-cta,.drawer-cta,.btn-primary,.form-submit{color:#FBF7EE!important}


    #branchen .bgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:14px;margin-top:36px}
    #branchen .bcard{display:flex;flex-direction:column;gap:12px;background:var(--bg-0,#F5F2EA);border:1px solid var(--bg-3,#D8D4C8);border-radius:8px;padding:28px;transition:border-color .2s,transform .2s;text-decoration:none}
    #branchen .bcard:hover{border-color:rgba(166,124,0,0.45);transform:translateY(-2px)}
    #branchen .btag{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--y,#A67C00)}
    #branchen .bname{font-size:22px;font-weight:700;color:var(--t1,#0F0E0C);letter-spacing:-.02em;line-height:1.2}
    #branchen .bdesc{font-size:14px;font-weight:300;color:var(--t2,#4A4840);line-height:1.65}
    #branchen .bsub{font-size:12px;color:var(--t3,#7A7870);margin-top:2px}
    #branchen .bmore{margin-top:auto;padding-top:8px;font-size:13px;font-weight:700;color:var(--y,#A67C00)}
  

    #referenzen .r-logos{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
    #referenzen .r-logo{flex:1 1 180px;min-width:160px;height:92px;border:1px solid var(--bg-3,#D8D4C8);border-radius:8px;background:var(--bg-0,#F5F2EA);display:flex;align-items:center;justify-content:center;padding:18px}
    #referenzen .r-logo img{max-height:46px;max-width:100%;object-fit:contain;mix-blend-mode:multiply}
    #referenzen .r-fallback{display:none;font-weight:700;font-size:15px;color:var(--t2,#4A4840);text-align:center}
  

    #diskretion .d-lead{font-size:17px;font-weight:300;color:var(--t2,#4A4840);line-height:1.7;max-width:620px;margin-top:8px}
    #diskretion .d-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));margin-top:36px}
    #diskretion .d-item{display:flex;gap:16px;align-items:flex-start}
    #diskretion .d-num{flex-shrink:0;width:34px;height:34px;border:1.5px solid rgba(166,124,0,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--y,#A67C00);margin-top:2px}
    #diskretion .d-item h3{font-size:16px;font-weight:600;color:var(--t1,#0F0E0C);margin-bottom:8px}
    #diskretion .d-item p{font-size:14px;font-weight:300;color:var(--t2,#4A4840);line-height:1.7}
  

    #faq .f-wrap{max-width:760px;margin:0 auto;text-align:center}
    #faq .section-tag{justify-content:center}
    #faq .f-lead{font-size:17px;font-weight:300;color:var(--t2,#4A4840);line-height:1.7;margin-top:8px;margin-left:auto;margin-right:auto}
    #faq .f-list{margin-top:32px;display:flex;flex-direction:column;gap:6px;text-align:left}
    #faq details{border:1px solid var(--bg-3,#D8D4C8);border-radius:8px;background:var(--bg-0,#F5F2EA);overflow:hidden}
    #faq details[open]{border-color:rgba(166,124,0,0.35)}
    #faq summary{padding:18px 20px;font-weight:600;font-size:15px;color:var(--t1,#0F0E0C);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
    #faq summary::-webkit-details-marker{display:none}
    #faq summary::after{content:"+";font-size:20px;font-weight:300;color:var(--y,#A67C00);flex-shrink:0}
    #faq details[open] summary::after{content:"×"}
    #faq .f-a{padding:0 20px 18px;color:var(--t2,#4A4840);font-weight:300;line-height:1.75;font-size:14px}
  

#marktcheck .form-container{max-width:1000px!important;margin:0 auto!important;display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,4vw,48px);align-items:start}
#marktcheck .form-header{grid-column:1/-1;text-align:center!important}
#marktcheck .section-tag{justify-content:center!important}
@media(max-width:860px){#marktcheck .form-container{grid-template-columns:1fr}}
#marktcheck .mc-cal-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--t3,#7A7870);margin-bottom:14px}
#marktcheck .mc-cal-embed{background:var(--bg-0,#F5F2EA);border:1px solid var(--bg-3,#D8D4C8);border-radius:8px;overflow:hidden;min-height:560px}
#marktcheck .mc-cal-embed .calendly-inline-widget{min-width:280px;height:580px}
#marktcheck .mc-cal-note{font-size:12px;font-weight:300;color:var(--t4,#A8A49C);margin-top:14px}

/* Sticky-Footer: kurze Seiten -> Footer am unteren Rand */
body{min-height:100vh;display:flex;flex-direction:column}
body>footer{margin-top:auto}