/* ============================================================
   Customized Landingpage – nur Layout/Spacing.
   Farben, Typografie, Hero- und Button-Styles kommen aus dem
   Site-Package (app.css, wm-*-Klassen).
   ============================================================ */

.wm-lp-section {
    padding: 3.5rem 0;
}

/* --- Einleitung: Breite/Ausrichtung über Backend-Layout-Auswahl --- */
.wm-lp-intro__inner {
    margin: 0 auto;
}

/* Standard: ca. 50 % Breite, mittig zentriert */
.wm-lp-intro--default .wm-lp-intro__inner {
    max-width: 600px;
    text-align: center;
}

/* Linksbündig, schmaler Block */
.wm-lp-intro--intro-left .wm-lp-intro__inner {
    max-width: 720px;
    margin-left: 0;
    text-align: left;
}

/* Breite Einleitung über volle Spaltenbreite */
.wm-lp-intro--wide .wm-lp-intro__inner {
    max-width: none;
    text-align: left;
}

/* --- Video: responsives 16:9-Fenster --- */
.wm-lp-video__frame {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #000;
    border-radius: 12px;
    overflow: hidden;
}

.wm-lp-video__frame iframe,
.wm-lp-video__player {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* --- Internes Video: Kachel mit goldener Umrandung --- */
.wm-lp-video__tile {
    padding: 12px;
    border-radius: 18px;
    border: 2px solid transparent;
    background:
        linear-gradient(#0c0c0c, #0c0c0c) padding-box,
        linear-gradient(135deg, #a96f21, #dc8f27 45%, #ffc857) border-box;
    box-shadow:
        0 14px 34px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(220, 143, 39, 0.18);
}

.wm-lp-video__tile .wm-lp-video__frame {
    border-radius: 10px;
}

/* --- CTA: zentriert (Button nutzt .button-content-element wie das Button-CE) --- */
.wm-lp-cta {
    text-align: center;
}

@media (max-width: 768px) {
    .wm-lp-intro--default .wm-lp-intro__inner {
        max-width: 100%;
    }
}

/* ---------------------------------------------------------------------------
   Freier Inhaltsbereich (verknüpfte Inhaltsseite)
   Grid-Layouts liefern die bootstrap_package-Container selbst.
   --------------------------------------------------------------------------- */
.wm-landingpage__content {
    margin: 0 auto;
}
