/*
 * A&M Farbwelt v3.1 — Weiss als ruhige Basis, Lila fuehrt, Orange setzt Waerme.
 * Diese Datei enthaelt nur visuelle Overrides. Geometrie, Inhalte und Funktionen
 * des Themes bleiben unveraendert.
 *
 * 27.08.2026: Jede Regel haengt jetzt an :where(html:not([data-theme="dark"])).
 * Hell bleibt der Standard und sieht unveraendert aus — :where() traegt keine
 * Spezifitaet, die Kaskade ist also dieselbe wie zuvor. Wer oben rechts auf
 * Dunkel schaltet, faellt sauber auf base.css zurueck: das alte dunkle Schema.
 */

:root:where(:not([data-theme="dark"])) {
    color-scheme: light;
    --bg: #FFFFFF;
    --bg-card: #FFFFFF;
    --bg-card-h: #FCFAFF;
    --bg-section: #FFFFFF;
    --bg-nav: rgba(255, 255, 255, 0.88);
    --bg-nav-solid: rgba(255, 255, 255, 0.97);

    --accent: #6D28D9;
    --accent-2: #4C1D95;
    --accent-3: #C2410C;
    --accent-light: #7C3AED;
    --accent-orange: #C2410C;
    --accent-orange-bright: #F97316;
    --accent-glow: rgba(109, 40, 217, 0.09);
    --orange-glow: rgba(249, 115, 22, 0.11);
    --accent-grad: linear-gradient(112deg, #6D28D9 0%, #7C3AED 45%, #C2410C 100%);
    --shadow-accent: rgba(109, 40, 217, 0.22);

    --text: #19151F;
    --text-muted: #554D5E;
    --text-dim: #6D6476;
    --border: rgba(49, 32, 65, 0.13);
    --border-accent: rgba(109, 40, 217, 0.38);
}

html:where(:not([data-theme="dark"])),
:where(html:not([data-theme="dark"])) body { background: #FFFFFF; }

/* Navigation: klares Weiss, die beiden Markenfarben nur als feine Signale. */
:where(html:not([data-theme="dark"])) .site-header,
:where(html:not([data-theme="dark"])) .site-header.scrolled {
    background: var(--bg-nav-solid);
    box-shadow: 0 1px 0 var(--border);
}
:where(html:not([data-theme="dark"])) .site-header::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: linear-gradient(90deg, transparent 8%, rgba(109, 40, 217, 0.38) 42%, rgba(249, 115, 22, 0.34) 62%, transparent 92%);
    pointer-events: none;
}
/* Das & im Logo bleibt Lila (base.css: var(--accent)); das satte Dunkelorange
   stach oben links aus der Farbwelt heraus. */
:where(html:not([data-theme="dark"])) .nav-links a:not(.nav-cta)::after { background: var(--accent-grad); }

/* Handlungsflaechen tragen das Duo satt, mit ausreichend dunklem Orange. */
:where(html:not([data-theme="dark"])) .btn-primary,
:where(html:not([data-theme="dark"])) .nav-cta {
    background: var(--accent-grad) !important;
    color: #FFFFFF !important;
    box-shadow: 0 10px 24px rgba(109, 40, 217, 0.14);
}
:where(html:not([data-theme="dark"])) .btn-primary:hover,
:where(html:not([data-theme="dark"])) .nav-cta:hover {
    opacity: 1;
    box-shadow: 0 13px 28px rgba(109, 40, 217, 0.18), 0 5px 14px rgba(194, 65, 12, 0.12);
}
:where(html:not([data-theme="dark"])) .btn-outline {
    background: #FFFFFF;
    border-color: rgba(109, 40, 217, 0.24);
}
:where(html:not([data-theme="dark"])) .btn-outline:hover {
    color: var(--accent-2);
    border-color: var(--accent-orange);
    box-shadow: 0 8px 20px rgba(194, 65, 12, 0.08);
}
:where(html:not([data-theme="dark"])) .scroll-progress { background: var(--accent-grad); }

/* Hero: echte weisse Flaeche, darauf zwei ruhige Farblichtquellen. */
:where(html:not([data-theme="dark"])) body .hero { background: #FFFFFF; }
:where(html:not([data-theme="dark"])) .hero .hero-bg {
    background:
        radial-gradient(circle at 79% 27%, rgba(109, 40, 217, 0.16) 0%, rgba(109, 40, 217, 0.06) 20%, transparent 42%),
        radial-gradient(circle at 14% 76%, rgba(249, 115, 22, 0.14) 0%, rgba(249, 115, 22, 0.045) 22%, transparent 43%),
        linear-gradient(118deg, rgba(109, 40, 217, 0.025), transparent 45%, rgba(249, 115, 22, 0.025));
    background-size: 108% 108%, 112% 112%, 100% 100%;
    animation: paletteDrift 18s ease-in-out infinite alternate;
}
:where(html:not([data-theme="dark"])) .hero .hero-bg::after {
    background: linear-gradient(90deg, transparent 8%, rgba(109, 40, 217, 0.22) 46%, rgba(249, 115, 22, 0.22) 58%, transparent 92%);
    background-size: 100% 1px;
    background-repeat: no-repeat;
    background-position: 50% calc(100% - 1px);
}
@keyframes paletteDrift {
    from { background-position: 100% 10%, 0% 100%, 0 0; }
    to   { background-position: 88% 17%, 12% 88%, 0 0; }
}

:where(html:not([data-theme="dark"])) .hero .hero-badge {
    color: var(--text-muted);
    border-left: 2px solid var(--accent-orange);
    padding-left: 0.75rem;
}
:where(html:not([data-theme="dark"])) .hero-title .accent {
    color: var(--accent);
    background: var(--accent-grad);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
}
:where(html:not([data-theme="dark"])) .hero-title .accent::after { background: var(--accent-grad); }
:where(html:not([data-theme="dark"])) .scroll-hint span { background: linear-gradient(to bottom, var(--accent), var(--accent-orange), transparent); }

/* Die Unterseiten erhalten dieselbe Farbsprache statt einer reinen Lavendelflaeche. */
:where(html:not([data-theme="dark"])) body .page-hero {
    background:
        radial-gradient(circle at 82% 20%, rgba(109, 40, 217, 0.13), transparent 35%),
        radial-gradient(circle at 12% 86%, rgba(249, 115, 22, 0.10), transparent 34%),
        linear-gradient(118deg, rgba(109, 40, 217, 0.022), transparent 48%, rgba(249, 115, 22, 0.024));
    border-bottom: 1px solid rgba(49, 32, 65, 0.11);
}
:where(html:not([data-theme="dark"])) body .page-hero .label::after { background: var(--accent-orange); }

/* Rubriken und Inhalte bleiben auf Weiss; Farbe dient der Orientierung. */
:where(html:not([data-theme="dark"])) .services-section,
:where(html:not([data-theme="dark"])) .anfrage-section,
:where(html:not([data-theme="dark"])) .quote-section,
:where(html:not([data-theme="dark"])) .cta-section { background: #FFFFFF; }

:where(html:not([data-theme="dark"])) .label { color: var(--accent); }
:where(html:not([data-theme="dark"])) .label::after { background: var(--accent-orange); }

:where(html:not([data-theme="dark"])) .services-grid .service-card::after { background: var(--accent-grad); }
:where(html:not([data-theme="dark"])) .services-grid .service-card:hover {
    background: linear-gradient(90deg, rgba(109, 40, 217, 0.045), rgba(255, 255, 255, 0) 48%, rgba(249, 115, 22, 0.045));
    box-shadow: none;
}
:where(html:not([data-theme="dark"])) .services-grid .service-card:nth-child(odd) .service-num,
:where(html:not([data-theme="dark"])) .services-grid .service-card:nth-child(odd) .service-link { color: var(--accent); }
:where(html:not([data-theme="dark"])) .services-grid .service-card:nth-child(even) .service-num,
:where(html:not([data-theme="dark"])) .services-grid .service-card:nth-child(even) .service-link { color: var(--accent-orange); }
:where(html:not([data-theme="dark"])) .services-grid .service-icon { color: var(--accent); }
:where(html:not([data-theme="dark"])) .services-grid .service-card:nth-child(even) .service-icon { color: var(--accent-orange); }

:where(html:not([data-theme="dark"])) .trust-section {
    background: linear-gradient(102deg, rgba(109, 40, 217, 0.065), rgba(255, 255, 255, 0.96) 48%, rgba(249, 115, 22, 0.085));
    border-top: 1px solid rgba(109, 40, 217, 0.09);
    border-bottom: 1px solid rgba(194, 65, 12, 0.10);
}
:where(html:not([data-theme="dark"])) .trust-grid .trust-item:nth-child(odd) .trust-number { color: var(--accent); }
:where(html:not([data-theme="dark"])) .trust-grid .trust-item:nth-child(even) .trust-number { color: var(--accent-orange); }
:where(html:not([data-theme="dark"])) .trust-grid .trust-item::after { background: var(--accent-grad); }

:where(html:not([data-theme="dark"])) .anfrage-info .card,
:where(html:not([data-theme="dark"])) .anfrage-steps {
    background: linear-gradient(#FFFFFF, #FFFFFF) padding-box,
                linear-gradient(125deg, rgba(109, 40, 217, 0.34), rgba(249, 115, 22, 0.30)) border-box;
    border: 1px solid transparent;
}
:where(html:not([data-theme="dark"])) .anfrage-form input:focus,
:where(html:not([data-theme="dark"])) .anfrage-form textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-glow), 0 0 0 5px rgba(249, 115, 22, 0.035);
}
:where(html:not([data-theme="dark"])) .anfrage-consent input { accent-color: var(--accent-orange); }

:where(html:not([data-theme="dark"])) .cta-section .cta-inner {
    background: linear-gradient(#FFFFFF, #FFFFFF) padding-box,
                linear-gradient(118deg, rgba(109, 40, 217, 0.70), rgba(249, 115, 22, 0.62)) border-box;
    border: 1px solid transparent;
    box-shadow: 0 24px 70px rgba(109, 40, 217, 0.08), 0 18px 46px rgba(194, 65, 12, 0.055);
}

:where(html:not([data-theme="dark"])) .site-footer {
    position: relative;
    background: #FFFFFF;
    border-top: 0;
}
:where(html:not([data-theme="dark"])) .site-footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(109, 40, 217, 0.40), rgba(249, 115, 22, 0.38), transparent);
}
:where(html:not([data-theme="dark"])) .footer-heading { color: var(--accent); }
:where(html:not([data-theme="dark"])) .footer-col:nth-child(even) .footer-heading { color: var(--accent-orange); }

/* Unterseiten: Orange antwortet jeweils auf den zweiten bzw. alternierenden Punkt. */
:where(html:not([data-theme="dark"])) body .mission-values .value-item:nth-child(even) .value-icon-wrap {
    color: var(--accent-orange);
    border-color: rgba(194, 65, 12, 0.30);
    background: var(--orange-glow);
}
:where(html:not([data-theme="dark"])) body .founder-card:nth-child(even) .founder-avatar { border-color: rgba(194, 65, 12, 0.46); }
:where(html:not([data-theme="dark"])) body .founder-card:nth-child(even) .founder-role { color: var(--accent-orange); }

:where(html:not([data-theme="dark"])) body .offering-section.alt .offering-badge,
:where(html:not([data-theme="dark"])) body .offering-section.alt .features-title,
:where(html:not([data-theme="dark"])) body .offering-section.alt .feat-icon { color: var(--accent-orange); }
:where(html:not([data-theme="dark"])) body .offering-section.alt .offering-badge {
    border-color: rgba(194, 65, 12, 0.30);
    background: var(--orange-glow);
}
:where(html:not([data-theme="dark"])) body .process-step:nth-child(even) .process-num {
    -webkit-text-stroke-color: var(--accent-orange);
}

:where(html:not([data-theme="dark"])) body .faq-item:nth-child(even) .faq-toggle::before,
:where(html:not([data-theme="dark"])) body .faq-item:nth-child(even) .faq-toggle::after { background: var(--accent-orange); }
:where(html:not([data-theme="dark"])) body .faq-item:nth-child(even)[open] { border-color: rgba(194, 65, 12, 0.34); }

:where(html:not([data-theme="dark"])) body .contact-info-item:nth-child(even) .contact-info-icon,
:where(html:not([data-theme="dark"])) body .contact-response .response-icon { color: var(--accent-orange); }
:where(html:not([data-theme="dark"])) body .contact-form .form-group input:focus,
:where(html:not([data-theme="dark"])) body .contact-form .form-group select:focus,
:where(html:not([data-theme="dark"])) body .contact-form .form-group textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-glow), 0 0 0 5px rgba(249, 115, 22, 0.035);
}

:where(html:not([data-theme="dark"])) body.page-template-page-feedback .amdi-star { color: rgba(109, 40, 217, 0.24); }
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .amdi-star:hover,
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .amdi-star.on {
    color: var(--accent-orange-bright);
}
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form .form-group {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form .form-group > label {
    color: var(--text);
    font-size: 0.88rem;
    font-weight: 600;
}
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form input:not([type="checkbox"]),
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form select,
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form textarea {
    width: 100%;
    background: #FFFFFF;
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    padding: 0.82rem 1rem;
    font: inherit;
    font-size: 0.95rem;
    line-height: 1.5;
    transition: border-color var(--transition), box-shadow var(--transition);
}
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form textarea {
    min-height: 9rem;
    resize: vertical;
}
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form input::placeholder,
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form textarea::placeholder { color: var(--text-dim); }
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form input[type="checkbox"] { accent-color: var(--accent-orange); }
:where(html:not([data-theme="dark"])) body.page-template-page-feedback .contact-form a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 0.16em;
}
:where(html:not([data-theme="dark"])) body .anfrage-info-list li:nth-child(even)::before { color: var(--accent-orange); }

@media (max-width: 768px) {
    :where(html:not([data-theme="dark"])) .nav-links { background: rgba(255, 255, 255, 0.98); }
    :where(html:not([data-theme="dark"])) .hero .hero-bg {
        background:
            radial-gradient(circle at 88% 22%, rgba(109, 40, 217, 0.14), transparent 38%),
            radial-gradient(circle at 6% 82%, rgba(249, 115, 22, 0.11), transparent 36%);
        animation: none;
    }
    :where(html:not([data-theme="dark"])) body .page-hero {
        background:
            radial-gradient(circle at 92% 14%, rgba(109, 40, 217, 0.12), transparent 39%),
            radial-gradient(circle at 4% 94%, rgba(249, 115, 22, 0.09), transparent 36%);
    }
}

@media (prefers-reduced-motion: reduce) {
    :where(html:not([data-theme="dark"])) .hero .hero-bg { animation: none; }
}