:root {
    --lunter-bordeaux: #e00000;
    --lunter-bordeaux-2: #a00000;
/*    --lunter-bordeaux: #7A1E2C;
    --lunter-bordeaux-2: #9B2B3C;
*/    --lunter-bg: #F4F5F7;
    --lunter-surface: #FFFFFF;
    --lunter-text: #101828;
    --lunter-muted: #667085;
    --lunter-border: rgba(16,24,40,.10);
    --lunter-radius: 1.25rem;
}
html, body{height:100%;}
body{
  background: var(--lunter-bg);
  color: var(--lunter-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a{ text-decoration:none; }
a:hover{ text-decoration:underline; }
.navbar{ backdrop-filter: saturate(160%) blur(10px); }
.brand-mark{
  display:inline-flex; width:12px; height:12px; border-radius:999px;
  background: var(--lunter-bordeaux); margin-right:.5rem; transform: translateY(-1px);
}
.surface{
  background: var(--lunter-surface);
  border: 1px solid var(--lunter-border);
  border-radius: var(--lunter-radius);
  box-shadow: 0 12px 36px rgba(16,24,40,.08);
}
.hero{ position:relative; overflow:hidden; }
.hero-bg{
  position:absolute; inset:0;
  background: url('/assets/imgg/hero.svg') no-repeat right -180px top -120px;
  background-size: 980px auto;
  pointer-events:none;
}
.kicker{
  color: var(--lunter-muted);
  text-transform: uppercase;
  font-size: .8rem;
  letter-spacing: .08em;
}
.btn-primary{
  --bs-btn-bg: var(--lunter-bordeaux);
  --bs-btn-border-color: var(--lunter-bordeaux);
  --bs-btn-hover-bg: var(--lunter-bordeaux-2);
  --bs-btn-hover-border-color: var(--lunter-bordeaux-2);
  --bs-btn-active-bg: var(--lunter-bordeaux-2);
  --bs-btn-active-border-color: var(--lunter-bordeaux-2);
}
.btn-outline-primary{
  --bs-btn-color: var(--lunter-bordeaux);
  --bs-btn-border-color: var(--lunter-bordeaux);
  --bs-btn-hover-bg: var(--lunter-bordeaux);
  --bs-btn-hover-border-color: var(--lunter-bordeaux);
}
.icon-badge{
  width:44px; height:44px; display:grid; place-items:center;
  border-radius:16px;
  background: rgba(122,30,44,.08);
  border: 1px solid rgba(122,30,44,.16);
}
.card-link:hover{ text-decoration:none; }
.card-link .surface{ transition: transform .12s ease, box-shadow .12s ease; }
.card-link:hover .surface{ transform: translateY(-2px); box-shadow: 0 18px 44px rgba(16,24,40,.12); }
.prose p{ margin-bottom:.9rem; }
.prose p:last-child{ margin-bottom:0; }
.side-nav a{
  display:flex; align-items:center; justify-content:space-between;
  padding:.65rem .85rem; border-radius:14px; color: var(--lunter-text);
}
.side-nav a:hover{ background: rgba(16,24,40,.04); text-decoration:none; }
.side-nav a.active{
  background: rgba(122,30,44,.10);
  border: 1px solid rgba(122,30,44,.18);
}
.footer-link{ color: var(--lunter-muted); }
.footer-link:hover{ color: var(--lunter-text); text-decoration:none; }
.form-hint{ color: var(--lunter-muted); font-size:.92rem; }


/* Titel insgesamt ~1.4em, skaliert je nach Bildschirm */
.brand-title {
    font-size: clamp(1.2em, 1.1vw + 1em, 1.4em); /* wächst bis ~1.4em */
    font-weight: 610;
    line-height: 0.90;
    white-space: nowrap;
}

/* "Unternehmensberatung" bleibt immer sichtbar */
.brand-unternehmensberatung {
    font-weight: 500;
}

/* Logo skaliert passend zum Titel */
.brand-logo {
    height: clamp(34px, 2.2vw + 20px, 56px);
    width: auto;
}


.hersteller-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .5rem;
}

.hersteller-logo {
    height: clamp(32px, 4vw, 48px);
    width: auto;
    max-width: 100%;
    max-inline-size: 112px;
    object-fit: contain;
    display: block;
}

.hersteller-name {
    font-size: .9rem;
    font-weight: 600;
}



/* Mobile: etwas kompakter, nur Untertitel sichtbar (Lunter ist bereits ausgeblendet) */
@media (max-width: 768px) {
        .brand-title {
            font-size: 0.9em; /* auf Mobile bewusst groß */
        }

        .brand-logo {
            height: 34px; /* ebenfalls größer als vorher */
        }
    }



/* Grundlayout */
.brand-wrap {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.brand-top {
    display: flex;
    align-items: center;
    gap: .5rem;
}

/* Logo */
.brand-logo {
    height: clamp(36px, 3vw, 52px);
    width: auto;
}

/* Desktop-Titel */
.brand-lunter {
    font-size: clamp(1.2em, 1vw + 1em, 1.4em);
    font-weight: 700;
}

.brand-desktop-sub {
    font-size: clamp(1.2em, 1vw + 1em, 1.4em);
    font-weight: 500;
    margin-left: .4rem;
}

/* Mobile zweite Zeile */
.brand-subline {
    margin-top: .1rem;
    font-size: 1.1em;
    font-weight: 500;
    color: #101828;
}


/* Logo skalierend */
.brand-logo {
    height: clamp(42px, 3vw, 56px);
    width: auto;
}

/* Desktop Titel */
.brand-title {
    font-size: clamp(1.2em, 1vw + 1em, 1.4em);
    font-weight: 450;
    white-space: nowrap;
}

/* Mobile zweite Zeile */
.brand-mobile-sub {
    text-align: left;
/*    padding: 0rem 1rem .15rem 0.8rem;
*/    
    padding: -0.5rem -0rem -0.5rem -0rem;
    font-size: 1.4em;
    font-weight: 350;
}