:root {
    --ms-bg: #080d16;
    --ms-surface: #111827;
    --ms-surface-soft: #0c1421;
    --ms-surface-raised: #162033;
    --ms-border: #29364b;
    --ms-border-soft: #202c3e;
    --ms-text: #f8fafc;
    --ms-muted: #9aa8ba;
    --ms-green: #22c55e;
    --ms-green-hover: #34d66d;
    --ms-green-dark: #052e16;
    --ms-danger: #f87171;
    --ms-radius-sm: 10px;
    --ms-radius: 16px;
    --ms-radius-lg: 22px;
    --ms-shadow: 0 22px 60px rgba(0, 0, 0, .28);
    --ms-content: 1120px;
}

html {
    color-scheme: dark;
    scroll-behavior: smooth;
}

body.ms-public-page {
    min-height: 100vh;
    color: var(--ms-text);
    background:
        radial-gradient(circle at 10% -10%, rgba(34, 197, 94, .07), transparent 32rem),
        var(--ms-bg);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

.ms-public-page *,
.ms-public-page *::before,
.ms-public-page *::after {
    box-sizing: border-box;
}

.ms-public-page img {
    max-width: 100%;
}

.ms-public-page a,
.ms-public-page button,
.ms-public-page input,
.ms-public-page select,
.ms-public-page textarea {
    -webkit-tap-highlight-color: transparent;
}

.ms-public-page a,
.ms-public-page button {
    transition:
        color .18s ease,
        background-color .18s ease,
        border-color .18s ease,
        opacity .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.ms-public-page :focus-visible {
    outline: 3px solid rgba(74, 222, 128, .8);
    outline-offset: 3px;
}

.ms-public-page ::selection {
    color: #fff;
    background: rgba(34, 197, 94, .55);
}

.ms-public-page .container,
.ms-public-page .shell {
    width: min(calc(100% - 32px), var(--ms-content));
    margin-inline: auto;
}

.ms-public-page .navbar,
.ms-public-page .topbar {
    border-bottom: 1px solid rgba(148, 163, 184, .15);
    background: rgba(8, 13, 22, .84);
    box-shadow: 0 10px 35px rgba(0, 0, 0, .15);
    backdrop-filter: blur(14px);
}

.ms-page-guide .nav {
    position: absolute;
    border-bottom: 1px solid rgba(148, 163, 184, .15);
    background: rgba(8, 13, 22, .9);
    box-shadow: 0 10px 35px rgba(0, 0, 0, .15);
    backdrop-filter: blur(14px);
}

.ms-public-page .brand-name,
.ms-public-page .brand strong,
.ms-public-page .brand > span:first-child {
    letter-spacing: .1em;
}

.ms-public-page :is(.card, .form-card, .form-panel, .info-box, .step-card, .cta-box) {
    border-color: var(--ms-border);
}

.ms-public-page :is(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea
) {
    min-height: 50px;
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius-sm);
    color: var(--ms-text);
    background: var(--ms-surface-soft);
    font: inherit;
}

.ms-public-page :is(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea
):hover {
    border-color: #43536d;
}

.ms-public-page :is(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea
):focus {
    border-color: var(--ms-green);
    box-shadow: 0 0 0 4px rgba(34, 197, 94, .12);
    outline: none;
}

.ms-public-page :is(input, select, textarea)::placeholder {
    color: #708096;
    opacity: 1;
}

.ms-public-page button:not(.preview-close):not(.preview-nav),
.ms-public-page :is(.btn, .button, .nav-btn, .hero-btn, .cart-btn, .download-zip-btn) {
    min-height: 46px;
    border-radius: var(--ms-radius-sm);
    font-weight: 800;
}

.ms-public-page button:not(.preview-close):not(.preview-nav):hover,
.ms-public-page :is(.btn, .button, .nav-btn, .hero-btn, .cart-btn, .download-zip-btn):hover {
    transform: translateY(-1px);
}

.ms-public-page button:disabled {
    transform: none;
    cursor: not-allowed;
}

.ms-public-page .footer-links a,
.ms-public-page footer a,
.ms-public-page .footer a {
    text-underline-offset: 4px;
}

.ms-public-legal-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 16px;
    margin: 28px auto 0;
    color: var(--ms-muted);
    font-size: 13px;
}

.ms-public-legal-links a {
    color: var(--ms-muted);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.ms-public-legal-links a:hover {
    color: var(--ms-text);
}

.ms-public-page .alert,
.ms-public-page .error,
.ms-public-page .notice {
    border: 1px solid rgba(248, 113, 113, .32);
}

.ms-public-page .success {
    border-color: rgba(34, 197, 94, .34);
}

/* Startseite */
.ms-page-home .section {
    padding-block: clamp(64px, 8vw, 100px);
}

.ms-page-home .step-card,
.ms-page-home .cta-box {
    box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
}

/* Formulare */
.ms-page-finder .card,
.ms-page-shooting .form-card {
    box-shadow: var(--ms-shadow);
}

.ms-page-finder .form-step {
    animation: ms-step-in .2s ease-out;
}

.ms-page-finder .form-actions {
    padding-top: 4px;
    border-top: 1px solid var(--ms-border-soft);
}

@keyframes ms-step-in {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: none; }
}

/* Galerie und Kauf */
.ms-page-gallery .item,
.ms-page-checkout .image-card,
.ms-page-download .item {
    border: 1px solid rgba(148, 163, 184, .18);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
}

.ms-page-gallery .pricing-bar {
    border-top: 1px solid rgba(148, 163, 184, .22);
    background: rgba(8, 13, 22, .94);
    backdrop-filter: blur(16px);
}

.ms-page-checkout .card {
    border: 1px solid var(--ms-border);
    box-shadow: var(--ms-shadow);
}

.ms-public-page .social-consent-box {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid rgba(34, 197, 94, .32);
    border-radius: var(--ms-radius);
    background: rgba(34, 197, 94, .065);
}

.ms-public-page .social-consent-choice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #dce8df;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}

.ms-public-page .social-consent-choice input {
    width: 21px;
    min-width: 21px;
    height: 21px;
    margin-top: 1px;
    accent-color: var(--ms-green);
}

.ms-public-page .social-consent-info {
    margin: 0;
    color: var(--ms-muted);
    font-size: 13px;
    line-height: 1.55;
}

.ms-public-page .social-consent-info strong {
    color: #bbf7d0;
}

/* Recht und Systemseiten */
.ms-page-legal .card,
.ms-page-status .card,
.ms-page-system .content {
    border: 1px solid var(--ms-border);
    box-shadow: var(--ms-shadow);
}

.ms-page-legal :is(h1, h2, h3) {
    scroll-margin-top: 24px;
}

.ms-page-legal h2 {
    padding-top: 8px;
    border-top: 1px solid var(--ms-border-soft);
}

.ms-page-legal .logo-img {
    width: 72px;
    max-width: 72px;
    height: 72px;
    margin-bottom: 12px;
}

@media (max-width: 720px) {
    .ms-public-page .container,
    .ms-public-page .shell {
        width: min(calc(100% - 22px), var(--ms-content));
    }

    .ms-public-page :is(.card, .form-card, .form-panel) {
        border-radius: 14px;
    }

    .ms-public-page :is(
        input:not([type="checkbox"]):not([type="radio"]),
        select,
        textarea
    ) {
        font-size: 16px;
    }

    .ms-page-home .section {
        padding-block: 58px;
    }

    .ms-page-finder .form-actions {
        position: sticky;
        bottom: 0;
        z-index: 4;
        margin-inline: -6px;
        padding: 12px 6px 4px;
        background: linear-gradient(transparent, var(--ms-surface) 22%);
    }

    .ms-page-legal .logo-img {
        width: 64px;
        max-width: 64px;
        height: 64px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .ms-public-page *,
    .ms-public-page *::before,
    .ms-public-page *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}
