/* Basics */
:root {
    --brand-primary: #0d6efd; /* Bootstrap primary */
    --brand-primary-100: #e7f1ff; /* subtle bg */
}

html, body {
    scroll-behavior: smooth;
}

.section {
    padding: 80px 0;
}

.section-alt {
    background: #f8fafc;
}

/* Hero */
.hero {
    min-height: 90vh;
    background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
    background-image: url('/images/img_head_wide.png');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: center center; /* <-- zentriert das Bild */
    color: wheat;
    padding-bottom: 50px;
}
.lead {
    color: wheat !important;
    padding-top: 400px;
}


    .hero .display-5 {
        letter-spacing: 0.2px;
        color:wheat;
    }

/* Cards & icon badges */
.card {
    border: 1px solid rgba(13, 110, 253, 0.06);
}

.icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 20px;
}

.feature-card {
    background: #fff;
}

/* Steps */
.step .step-num {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--brand-primary-100);
    color: var(--brand-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    margin-bottom: .5rem;
}

/* About image placeholder (replace with brand photo if available) */
.about-image {
    background-image: radial-gradient(1200px 400px at 80% -30%, #dfefff 0, transparent 60%), linear-gradient(135deg, #eef5ff 0%, #ffffff 60%);
    background-image: url('/images/img_about.png');
    /*background-attachment: fixed;*/
    background-size: cover;
    background-position: center center;
}

/* Navbar tweaks */
.navbar .nav-link {
    font-weight: 500;
}

.navbar .btn {
    border-radius: 10px;
}

/* Tables */
.table > :not(caption) > * > * {
    padding-top: .9rem;
    padding-bottom: .9rem;
}

/* Rounding and shadows */
.rounded-4 {
    border-radius: 1rem !important;
}

.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
}