/* ==========================================================
   MWI TECHNICAL LAB – globale Anpassungen
   ========================================================== */

/* Scroll-to-top auf ALLEN Seiten */
html body .page_scrollup,
html body .page_scrollup:focus,
html body .page_scrollup:active {
    background: #ffbf00 !important;
    background-color: #ffbf00 !important;
    background-image: none !important;
    border-color: #ffbf00 !important;
    color: #111 !important;
}

html body .page_scrollup i,
html body .page_scrollup:focus i,
html body .page_scrollup:active i {
    color: #111 !important;
}

/* Hover */
html body .page_scrollup:hover {
    background: #ffd04a !important;
    background-color: #ffd04a !important;
    background-image: none !important;
    border-color: #ffd04a !important;
    color: #111 !important;
    box-shadow: 0 5px 16px rgba(255, 190, 0, .25) !important;
}

html body .page_scrollup:hover i {
    color: #111 !important;
}


/* ==========================================================
   MWI TECHNICAL LAB – globaler Footer
   Optisch passend zum Header
   ========================================================== */


/*
 * Wallstreet-Footer als schwebende dunkle Leiste
 */
html body .footer-copyright-section {
    width: calc(100% - 16px) !important;
    max-width: none !important;

    margin: 18px 8px 8px !important;
    padding: 14px 24px !important;

    background:
        linear-gradient(
            135deg,
            rgba(12, 16, 19, .96),
            rgba(20, 23, 25, .94)
        ) !important;

    border: 1px solid rgba(120, 135, 145, .28) !important;
    border-radius: 18px !important;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, .30),
        inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}


/*
 * Falls Wallstreet dem inneren Footer-Container noch
 * einen eigenen Hintergrund oder unnötige Höhe gibt.
 */
html body .footer-copyright-section .container {
    width: 100% !important;
    max-width: none !important;

    margin: 0 auto !important;
    padding: 0 !important;

    background: transparent !important;
}


/* Copyright kompakt und mittig */
html body .footer-copyright,
html body .footer-copyright p {
    margin: 0 !important;
    padding: 0 !important;

    text-align: center !important;

    color: #ffbf00 !important;

    font-size: 12px !important;
    line-height: 1.5 !important;
}


/* Links im Copyright */
html body .footer-copyright a {
    color: #ffbf00 !important;
    text-decoration: none !important;
}

html body .footer-copyright a:hover {
    color: #ffd04a !important;
}


/*
 * Eventuelle zusätzliche Wallstreet-Hintergründe rund
 * um den eigentlichen Copyright-Footer entfernen.
 */
html body footer,
html body .site-footer {
    background: transparent !important;
}


/* Mobil etwas weniger Rand */
@media (max-width: 900px) {

    html body .footer-copyright-section {
        width: calc(100% - 12px) !important;

        margin: 14px 6px 6px !important;
        padding: 12px 15px !important;

        border-radius: 14px !important;
    }
}



/* ==========================================================
   MWI TECHNICAL LAB – GLOBALER FOOTER
   Optik passend zum Header
   ========================================================== */

html body .footer_section {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    padding: 12px 0 14px !important;
    margin: 0 !important;
}


/* Eigentliche Footerbox */
html body .footer_section > .container {
    width: calc(100% - 20px) !important;
    max-width: none !important;

    margin: 0 10px !important;
    padding: 0 !important;

    background:
        linear-gradient(
            135deg,
            rgba(10, 14, 17, .97),
            rgba(22, 26, 29, .95)
        ) !important;

    border: 1px solid rgba(100, 112, 118, .55) !important;
    border-radius: 18px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 8px 24px rgba(0,0,0,.20) !important;
}


/* Bootstrap-Struktur neutralisieren */
html body .footer_section > .container > .row {
    margin: 0 !important;
}

html body .footer_section > .container > .row > .col-md-12 {
    padding: 0 !important;
}


/* Copyright mittig */
html body .footer_section .footer-copyright {
    min-height: 58px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 10px 75px !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    text-align: center !important;
}


/* Copyrighttext */
html body .footer_section .footer-copyright p {
    margin: 0 !important;
    padding: 0 !important;

    color: #ffbf00 !important;

    font-size: 12px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
}


/* Copyright-Link */
html body .footer_section .footer-copyright a,
html body .footer_section .footer-copyright a:visited {
    color: #ffbf00 !important;
    text-decoration: none !important;
}

html body .footer_section .footer-copyright a:hover {
    color: #ffd04a !important;
}


/* Scroll-to-top passend zum Footer */
html body .page_scrollup,
html body .page_scrollup:focus,
html body .page_scrollup:active {
    right: 24px !important;
    bottom: 24px !important;

    width: 46px !important;
    height: 38px !important;
    line-height: 38px !important;

    background: #ffbf00 !important;
    background-color: #ffbf00 !important;
    background-image: none !important;

    border: 1px solid #ffbf00 !important;
    border-radius: 9px !important;

    color: #111 !important;
    box-shadow: none !important;
}

html body .page_scrollup i,
html body .page_scrollup:focus i,
html body .page_scrollup:active i {
    color: #111 !important;
}


/* Hover */
html body .page_scrollup:hover {
    background: #ffd04a !important;
    background-color: #ffd04a !important;
    border-color: #ffd04a !important;
}

html body .page_scrollup:hover i {
    color: #111 !important;
}


/* Mobile */
@media (max-width: 850px) {

    html body .footer_section {
        padding: 8px 0 10px !important;
    }

    html body .footer_section > .container {
        width: calc(100% - 12px) !important;
        margin: 0 6px !important;
        border-radius: 13px !important;
    }

    html body .footer_section .footer-copyright {
        min-height: 50px !important;
        padding: 9px 60px 9px 15px !important;
    }

    html body .page_scrollup {
        right: 14px !important;
        bottom: 18px !important;
    }
}



/* ==========================================================
   MWI TECHNICAL LAB – Footer Typografie
   ========================================================== */

html body .footer_section .footer-copyright,
html body .footer_section .footer-copyright p,
html body .footer_section .footer-copyright a {
    font-family:
        "Segoe UI",
        "Helvetica Neue",
        Arial,
        sans-serif !important;

    font-size: 12px !important;
    font-weight: 500 !important;

    letter-spacing: .45px !important;
    line-height: 1.4 !important;

    color: #ffbf00 !important;
}


/* © etwas dezenter als der eigentliche Text */
html body .footer_section .footer-copyright {
    text-shadow: 0 0 10px rgba(255, 190, 0, .10) !important;
}



/* ==========================================================
   MWI TECHNICAL LAB – Glücksburg
   Breite wie News/Projekte + Rock Salt
   ========================================================== */


/* Hauptseite auf dieselbe Breite wie News/Projekte */
html body .gluecksburg-page {
    width: min(1652px, calc(100vw - 80px)) !important;
    max-width: none !important;
}


/* ----------------------------------------------------------
   Überschriften – Rock Salt
   ---------------------------------------------------------- */

/* Große Hero-Überschrift "Glücksburg" */
html body .gluecksburg-page .gluecksburg-hero h1 {
    font-family: "Rock Salt", cursive !important;

    /*
     * Rock Salt wirkt optisch größer als Permanent Marker.
     * Deshalb etwas zurückhaltender dimensioniert.
     */
    font-size: clamp(3.2rem, 4.7vw, 5.2rem) !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;

    letter-spacing: .01em;
}


/* Abschnittsüberschriften */
html body .gluecksburg-page h2 {
    font-family: "Rock Salt", cursive !important;
    font-size: clamp(2.15rem, 2.8vw, 3.15rem) !important;
    line-height: 1.45 !important;
    font-weight: 400 !important;

    color: #ffbf00 !important;

    margin-bottom: 24px !important;
}


/* Überschriften innerhalb der Bildkarten */
html body .gluecksburg-page .gluecksburg-card h3 {
    font-family: "Rock Salt", cursive !important;
    font-size: clamp(1.55rem, 1.7vw, 2rem) !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;

    color: #ffbf00 !important;
}


/* ----------------------------------------------------------
   Breite auf kleineren Geräten
   ---------------------------------------------------------- */

@media (max-width: 900px) {

    html body .gluecksburg-page {
        width: calc(100vw - 30px) !important;
    }

}


@media (max-width: 680px) {

    html body .gluecksburg-page {
        width: calc(100vw - 18px) !important;
    }

    html body .gluecksburg-page .gluecksburg-hero h1 {
        font-size: clamp(2.5rem, 10vw, 3.5rem) !important;
    }

    html body .gluecksburg-page h2 {
        font-size: clamp(1.75rem, 7vw, 2.35rem) !important;
    }

}



/* ==========================================================
   MWI TECHNICAL LAB – Glücksburg
   Dezente Karten wie News/Projekte
   ========================================================== */


/* Dunkle Boxen und Karten:
   dünner Goldrand statt Glow */
html body .gluecksburg-page .gluecksburg-darkbox,
html body .gluecksburg-page .gluecksburg-card {

    border: 1px solid rgba(255, 190, 0, .55) !important;

    box-shadow:
        0 10px 28px rgba(0, 0, 0, .24) !important;
}


/* Den bisherigen inneren Gold-Glow vollständig entfernen */
html body .gluecksburg-page .gluecksburg-darkbox::before,
html body .gluecksburg-page .gluecksburg-card::before {

    box-shadow: none !important;
}


/* Beim Hover kein Goldleuchten mehr */
html body .gluecksburg-page .gluecksburg-darkbox:hover,
html body .gluecksburg-page .gluecksburg-card:hover {

    box-shadow:
        0 12px 32px rgba(0, 0, 0, .28) !important;
}


/* Auch Bilder/Split-Bereiche nicht mehr stark beschatten */
html body .gluecksburg-page .gluecksburg-split > img,
html body .gluecksburg-page .gluecksburg-gallery img {

    box-shadow:
        0 10px 28px rgba(0, 0, 0, .24) !important;
}




/* ==========================================================
   MWI TECHNICAL LAB – Über mich
   Ruhige Goldkanten + Rock Salt + Typografie
   ========================================================== */


/* ----------------------------------------------------------
   1. Hero und große Sektionen:
      Glow entfernen, dezente News-Goldkante
   ---------------------------------------------------------- */

html body .mw-about .mw-hero,
html body .mw-about .mw-section {
    border: 1px solid rgba(255, 190, 0, .55) !important;

    box-shadow:
        0 10px 28px rgba(0, 0, 0, .24) !important;
}


/* Eventuelle Pseudo-Elemente dürfen ebenfalls nicht leuchten */
html body .mw-about .mw-hero::before,
html body .mw-about .mw-hero::after,
html body .mw-about .mw-section::before,
html body .mw-about .mw-section::after {
    box-shadow: none !important;
}


/* ----------------------------------------------------------
   2. Kleine Karten
   ---------------------------------------------------------- */

html body .mw-about .mw-card {
    border: 1px solid rgba(255, 190, 0, .55) !important;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, .24) !important;
}

html body .mw-about .mw-card::before,
html body .mw-about .mw-card::after {
    box-shadow: none !important;
}


/* Falls Karten einen Hover-Glow besitzen */
html body .mw-about .mw-card:hover,
html body .mw-about .mw-section:hover,
html body .mw-about .mw-hero:hover {
    box-shadow:
        0 12px 30px rgba(0, 0, 0, .28) !important;
}


/* ----------------------------------------------------------
   3. Hauptüberschrift – Rock Salt
   ---------------------------------------------------------- */

html body .mw-about .mw-hero h1 {
    font-family: "Rock Salt", cursive !important;

    font-size: clamp(2.8rem, 3.8vw, 4.5rem) !important;
    line-height: 1.35 !important;
    font-weight: 400 !important;

    letter-spacing: 0 !important;

    color: #ffbf00 !important;

    text-shadow: none !important;
}


/* ----------------------------------------------------------
   4. Abschnittsüberschriften – Rock Salt
   ---------------------------------------------------------- */

html body .mw-about .mw-section h2 {
    font-family: "Rock Salt", cursive !important;

    font-size: clamp(2rem, 2.4vw, 2.8rem) !important;
    line-height: 1.45 !important;
    font-weight: 400 !important;

    color: #ffbf00 !important;

    text-shadow: none !important;

    margin-bottom: 24px !important;
}


/* Kartenüberschriften ebenfalls in die neue Designsprache */
html body .mw-about .mw-card h3 {
    font-family: "Rock Salt", cursive !important;

    font-size: clamp(1.3rem, 1.35vw, 1.65rem) !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;

    color: #ffbf00 !important;

    text-shadow: none !important;
}


/* ----------------------------------------------------------
   5. Fließtext etwas ruhiger und besser lesbar
   ---------------------------------------------------------- */

html body .mw-about .mw-section p,
html body .mw-about .mw-card p {
    line-height: 1.75 !important;
}

html body .mw-about .mw-section p + p {
    margin-top: 16px !important;
}


/* ----------------------------------------------------------
   6. Portrait:
      keinerlei Glow/Schatten hinzufügen
   ---------------------------------------------------------- */

html body .mw-about .mw-photo-card,
html body .mw-about .mw-photo-card:hover {
    box-shadow: none !important;
}


/* ----------------------------------------------------------
   Mobile
   ---------------------------------------------------------- */

@media (max-width: 700px) {

    html body .mw-about .mw-hero h1 {
        font-size: clamp(2.1rem, 9vw, 3rem) !important;
        line-height: 1.4 !important;
    }

    html body .mw-about .mw-section h2 {
        font-size: clamp(1.65rem, 7vw, 2.2rem) !important;
    }

    html body .mw-about .mw-card h3 {
        font-size: 1.3rem !important;
    }
}



/* ==========================================================
   MWI TECHNICAL LAB – Über-mich Kicker
   ========================================================== */

html body .mw-about .mw-kicker {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;

    margin: 0 0 22px 0 !important;
    padding: 7px 15px 6px !important;

    background: #ffbf00 !important;

    border: 1px solid #ffbf00 !important;
    border-radius: 999px !important;

    box-shadow: none !important;
    text-shadow: none !important;

    color: #111 !important;

    font-family:
        "Segoe UI",
        "Helvetica Neue",
        Arial,
        sans-serif !important;

    font-size: 11px !important;
    font-weight: 700 !important;

    line-height: 1 !important;
    letter-spacing: 1.15px !important;
    text-transform: uppercase !important;
}


/* Mobil etwas kompakter */
@media (max-width: 700px) {

    html body .mw-about .mw-kicker {
        margin-bottom: 18px !important;
        padding: 6px 13px 5px !important;

        font-size: 10px !important;
        letter-spacing: 1px !important;
    }
}



/* ==========================================================
   MWI TECHNICAL LAB – Über mich Hero final
   ========================================================== */


/* "ÜBER MICH"-Badge entfernen */
html body .mw-about .mw-kicker {
    display: none !important;
}


/* Mehr Luft zwischen den beiden Zeilen des Hero-Titels */
html body .mw-about .mw-hero h1 {
    line-height: 1.48 !important;
}


/* Mobil etwas kompakter */
@media (max-width: 700px) {
    html body .mw-about .mw-hero h1 {
        line-height: 1.42 !important;
    }
}



/* ==========================================================
   MWI FOOTER – MEHR TRANSPARENZ
   ========================================================== */

html body footer,
html body .site-footer {
    background: rgba(10, 13, 15, .78) !important;
    background-color: rgba(10, 13, 15, .78) !important;
}



/* ==========================================================
   MWI FOOTER – OPTIK WIE HEADER
   Nur Design, Inhalt bleibt unverändert
   ========================================================== */

/*
 * Äußere Footer-Ebenen transparent halten.
 * Dadurch kann die Metallstruktur wie beim Header
 * durch die eigentliche Footer-Fläche hindurchscheinen.
 */
html body footer,
html body .site-footer,
html body .footer-section {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}


/*
 * Sichtbare Footer-Leiste:
 * kühles Schwarz/Anthrazit mit Transparenz ähnlich Header.
 */
html body .site-info {
    width: calc(100% - 20px) !important;
    max-width: none !important;

    margin: 10px auto 10px !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;

    background: rgba(10, 15, 18, .82) !important;
    background-color: rgba(10, 15, 18, .82) !important;
    background-image: none !important;

    border: 1px solid rgba(125, 140, 148, .42) !important;
    border-radius: 18px !important;

    box-shadow:
        0 8px 24px rgba(0, 0, 0, .28) !important;

    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
}


/*
 * Eventuelle Theme-Pseudoelemente dürfen keine
 * zusätzliche schwarze Schicht über den Footer legen.
 */
html body .site-info::before,
html body .site-info::after {
    background: transparent !important;
    box-shadow: none !important;
}


/*
 * Vorhandenen Copyright-Inhalt unverändert lassen.
 * Nur vorhandene Farben absichern.
 */
html body .site-info .footer-copyright,
html body .site-info .footer-copyright p {
    background: transparent !important;
}

html body .site-info .footer-copyright,
html body .site-info .footer-copyright p,
html body .site-info .footer-copyright a,
html body .site-info .mwi-footer-lab {
    color: #ffbf00 !important;
}


/*
 * Scroll-to-top bleibt inhaltlich und funktional unangetastet.
 * Nur bestehende Goldoptik absichern.
 */
html body .page_scrollup,
html body .page_scrollup:hover,
html body .page_scrollup:focus,
html body .page_scrollup:active {
    background: #ffbf00 !important;
    background-color: #ffbf00 !important;
    background-image: none !important;

    border: 1px solid #ffbf00 !important;
    box-shadow: none !important;

    color: #111 !important;
}

html body .page_scrollup i {
    color: #111 !important;
}


/* Mobile */
@media (max-width: 767px) {

    html body .site-info {
        width: calc(100% - 16px) !important;
        margin: 8px auto !important;
        border-radius: 15px !important;
    }
}



/* ==========================================================
   MWI FOOTER – FINAL: gleiche Glasoptik wie Header
   ========================================================== */

/*
 * Äußere Wallstreet-Footerflächen vollständig transparent.
 * Die sichtbare Fläche erzeugt ausschließlich der Container.
 */
html body .footer_section,
html body .footer-copyright-section,
html body footer.footer_section,
html body .site-footer {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
}

/*
 * Sichtbare Footerbox:
 * exakt dieselbe Grundfarbe/Transparenz wie .mwi-header-inner.
 */
html body .footer_section > .container,
html body .footer-copyright-section > .container {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin: 10px auto !important;
    padding: 0 !important;

    background: rgba(3, 8, 13, .70) !important;
    background-color: rgba(3, 8, 13, .70) !important;
    background-image: none !important;

    border: 1px solid rgba(255, 255, 255, .22) !important;
    border-radius: 24px !important;

    box-shadow:
        0 18px 52px rgba(0, 0, 0, .48),
        inset 0 1px rgba(255, 255, 255, .045) !important;

    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;

    overflow: hidden !important;
}

/*
 * Alle inneren Footer-Ebenen durchsichtig.
 */
html body .footer_section > .container > .row,
html body .footer_section > .container > .row > [class*="col-"],
html body .footer_section .footer-copyright,
html body .footer-copyright-section > .container > .row,
html body .footer-copyright-section .footer-copyright {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
}

/*
 * Copyright-Inhalt unverändert lassen.
 */
html body .footer_section .footer-copyright,
html body .footer-copyright-section .footer-copyright {
    min-height: 64px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 70px !important;
}


/* Mobil */
@media (max-width: 767px) {
    html body .footer_section > .container,
    html body .footer-copyright-section > .container {
        width: calc(100% - 16px) !important;
        margin: 8px auto !important;
        border-radius: 18px !important;
    }

    html body .footer_section .footer-copyright,
    html body .footer-copyright-section .footer-copyright {
        min-height: 58px !important;
        padding: 10px 55px 10px 16px !important;
    }
}


/* ==========================================================
   MWI FOOTER – FINAL TRANSPARENZ
   ========================================================== */

html body .footer_section > .container,
html body .footer-copyright-section > .container {
    background: rgba(3, 8, 13, .48) !important;
    background-color: rgba(3, 8, 13, .48) !important;

    /* Etwas weniger Blur, damit die Hintergrundstruktur
       deutlicher durch den Footer sichtbar bleibt. */
    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;
}