/* =================== Datenschutzerklärung – Styles (Verkaufs.Werk) =================== */
/* Font wie auf der Startseite */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

/* ===== Theme-Variablen aus indexstyle.css (gleiche Werte) ===== */
:root {
    /* Blautöne */
    --col1: #160f29;
    --col2: #1a2b3e;
    --col3: #1d4653;
    --col4: #206268;
    --col5: #237d7d;
    /* Rest */
    --creme: #a2785b;
    --linen: #ece7e2;
    --inkwell: #2c3639;
    --lunar: #3f4e4f;
    --lait: #dcd7c9;
    --header-color: var(--lait);
    --main-color: var(--inkwell);
    --floating-color: var(--col5);
    --primary-color: var(--inkwell);
    --secondary-color: var(--lunar);
    --accent-color: var(--col5);
    --text-color-dark: var(--col5);
    --text-color-light: var(--lait);
    --muted-color: #888;
}

/* ===== Grundlayout & Typo ===== */
* {
    box-sizing: border-box;
    font-family: 'Outfit', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

html,
body {
    margin: 0;
    padding: 0;
    background: var(--primary-color);
    color: var(--text-color-light);
}

main.ds {
    width: min(92vw, 980px);
    margin: 8vh auto 10vh;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 1.2vw;
    padding: 4vh 3vw;
    box-shadow: 0 1.2vh 3vh rgba(0, 0, 0, .25);
}

.ds h1 {
    font-size: 2rem;
    margin: 0 0 2vh 0;
}

.ds h2 {
    font-size: 1.35rem;
    margin: 3.2vh 0 1.6vh 0;
}

.ds h3 {
    font-size: 1.1rem;
    margin: 2.4vh 0 1.2vh 0;
}

.ds p,
.ds li {
    line-height: 1.6;
    font-size: 1rem;
}

.ds .muted {
    opacity: .85;
}

.ds code {
    background: rgba(0, 0, 0, .2);
    padding: .2rem .4rem;
    border-radius: .4rem;
}

.ds a {
    color: var(--accent-color);
    text-decoration: none;
    border-bottom: .25vh solid transparent;
    transition: border-color .2s ease, filter .2s ease;
}

.ds a:hover {
    border-bottom-color: currentColor;
    filter: brightness(.95);
}

.ds .tag {
    display: inline-block;
    padding: .2rem .5rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    margin-left: .4rem;
    font-size: .85rem;
}

.ds .box {
    background: rgba(0, 0, 0, .07);
    padding: 2vh 2vw;
    border-radius: .8vw;
}

.ds ul {
    padding-left: 1.2rem;
}

.floating-logo {
    position: fixed;
    top: 2vh;
    left: 2vw;
    z-index: 1000;
}

.floating-logo img {
    height: 6vh;
    width: auto;
    max-width: 20vw;
    object-fit: contain;
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.4));
}