/* ============================================================
   RUWAC UNTERNEHMEN - SHARED STYLES
   Gemeinsame CSS-Datei für alle Unternehmens-Content-Blocks
   ============================================================ */

/* === GLOBAL RESET === */
.rw-unternehmen-wrapper { width: 100%; overflow-x: hidden; }
.rw-unternehmen-wrapper * { box-sizing: border-box; }

/* === SEKTIONEN & LAYOUTS === */
.rw-scl-section { 
    padding: var(--Size-11, 6rem) 0; 
    overflow: hidden; 
    width: 100%; 
}

.rw-unternehmen-wrapper [data-rw-lazy-section] {
    content-visibility: auto;
    contain-intrinsic-size: 900px;
}

.rw-bg-light { background-color: var(--rw-bg-light-1, #f8f9fa); }
.rw-bg-white { background-color: var(--rw-bg-light-2, #ffffff); }

/* === CONTAINER === */
.rw-scl-container { 
    width: 100%;
    max-width: var(--rw-container-max-width, 1664px); 
    padding-left: clamp(20px, 5vw, 72px); 
    padding-right: clamp(20px, 5vw, 72px); 
    margin: 0 auto; 
    position: relative; 
    z-index: 2; 
}

/* === TYPOGRAFIE === */
.rw-scl-section-title {
    color: var(--rw-primary-color, #E90006);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 0.5em;
    text-align: left;
    font-family: 'Aeonik Extended Pro', sans-serif;
    hyphens: auto;
}

.rw-scl-headline-text {
    color: var(--RWC_Black, #1A1A1A);
    font-size: clamp(1.4rem, 3.5vw, 2rem);
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

/* === RTE TEXT STYLES === */
.rw-text-rte {
    font-size: 1rem;
    line-height: 1.6;
}

.rw-text-rte p { 
    margin-bottom: 1.5rem; 
    max-width: 65ch; 
}

.rw-text-rte p:last-child { 
    margin-bottom: 0; 
}

.rw-highlight-text-block { 
    max-width: 900px; 
}

/* === LISTEN STYLING === */
.rw-text-rte ul, 
.rw-hero-list ul, 
.rw-content-list ul {
    list-style: none;
    padding-left: 0;
    margin: 0 0 1.5rem 0;
}

.rw-text-rte li, 
.rw-hero-list li, 
.rw-content-list li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 0.5rem;
    font-weight: 400;
    color: var(--rw-text-on-light, #495057);
    line-height: 1.6;
    font-size: 1rem;
}

.rw-text-rte li::before, 
.rw-hero-list li::before, 
.rw-content-list li::before {
    content: '-';
    position: absolute;
    left: 0;
    color: var(--RWC_Black, #1A1A1A);
    font-weight: bold;
}

/* === HERO SECTION === */
.rw-hero-head { 
    position: relative;
    left: 50%;
    width: 100vw;
    max-width: 100vw;
    margin-left: -50vw;
    margin-right: -50vw;
    padding: clamp(56px, 5.4vw, 96px) 0 clamp(44px, 3.4vw, 60px);
    background-color: #fff; 
    overflow: hidden; 
}

.rw-hero-head__grid {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: clamp(24px, 3.2vw, 64px);
    align-items: start;
}

.rw-hero-head__grid > * {
    min-width: 0;
}

.rw-hero-content { 
    position: relative; 
    z-index: 2; 
    max-width: 62ch; 
    padding-right: 0; 
}

.rw-hero-video-background {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    border-radius: 24px;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #ddd;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
}

.rw-hero-video-background::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(to bottom, #ffffff 0%, rgba(255, 255, 255, 0) 28%);
}

.rw-hero-video-background video {
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: inherit;
    position: relative;
    z-index: 0;
}

.rw-hero-title { 
    font-size: clamp(2.85rem, 2.8vw + 1.15rem, 4.5rem); 
    font-weight: 800; 
    color: var(--rw-primary-color, #E90006); 
    line-height: 1; 
    margin-bottom: clamp(14px, 1vw, 20px); 
    font-family: 'Aeonik Extended Pro', sans-serif; 
}

.rw-hero-separator { 
    width: clamp(44px, 2.8vw, 60px); 
    height: clamp(8px, 0.45vw, 10px); 
    background-color: var(--rw-primary-color, #E90006); 
    margin-bottom: clamp(20px, 1.5vw, 30px); 
}

.rw-hero-subtitle { 
    font-size: clamp(1.2rem, 0.75vw + 0.95rem, 1.5rem); 
    font-weight: 700; 
    color: #1A1A1A; 
    line-height: 1.3;
    margin-bottom: clamp(10px, 0.8vw, 15px); 
    max-width: 26ch;
}

/* === ALTERNATING LAYOUTS === */
.rw-alt-layout { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: clamp(40px, 5vw, 100px); 
    align-items: center; 
}

.rw-alt-layout.image-right .rw-alt-content { 
    order: 1; 
    min-width: 0; 
}

.rw-alt-layout.image-right .rw-alt-image { 
    order: 2; 
}

.rw-alt-layout.image-left .rw-alt-image { 
    order: 1; 
}

.rw-alt-layout.image-left .rw-alt-content { 
    order: 2; 
    min-width: 0; 
}

.rw-alt-image { 
    width: 100%; 
}

.rw-alt-image img, 
.rw-alt-image video { 
    width: 100%; 
    height: auto;
    max-width: 100%;
    border-radius: 4px; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.05); 
    background-color: #ddd; 
    aspect-ratio: 4/3; 
    object-fit: cover; 
    display: block; 
}

/* === CTA & BUTTONS === */
.rw-centered-content { 
    text-align: center; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    max-width: 800px; 
    margin: 0 auto; 
    padding: 0 10px;
}

.rw-centered-content p, 
.rw-centered-content .rw-text-rte p { 
    text-align: center; 
    margin-left: auto; 
    margin-right: auto; 
}

.rw-btn-group { 
    display: flex; 
    gap: 20px; 
    flex-wrap: wrap; 
    margin-top: 30px; 
    justify-content: center; 
}

/* === DESKTOP HERO: ORIGINAL LAYOUT === */
@media (min-width: 992px) {
    .rw-hero-head {
        height: 90vh;
        min-height: 600px;
        display: flex;
        align-items: center;
        padding: clamp(36px, 2.7vw, 56px) 0 clamp(36px, 2.5vw, 48px);
        box-sizing: border-box;
        background-color: #111;
    }

    .rw-hero-head::after {
        content: '';
        position: absolute;
        inset: 0;
        background:
            linear-gradient(to right, rgba(255,255,255,0.95) 30%, rgba(255,255,255,0.2) 100%);
        pointer-events: none;
        z-index: 2;
    }

    .rw-hero-head .rw-scl-container {
        z-index: 3;
        width: 100%;
        top: clamp(-72px, -3.8vw, -28px);
        background: transparent;
    }

    .rw-hero-head__grid {
        width: 100%;
    }

    .rw-hero-content {
        z-index: 3;
        max-width: 700px;
    }

    .rw-hero-video-background--desktop {
        position: absolute;
        inset: -1px;
        width: calc(100% + 2px);
        height: calc(100% + 2px);
        max-width: none;
        z-index: 1;
        border-radius: 0;
        aspect-ratio: auto;
        box-shadow: none;
        background: #111;
        overflow: hidden;
    }

    .rw-hero-video-background--desktop video {
        width: 100%;
        max-width: none;
        height: 100%;
        border-radius: 0;
        opacity: 0.6;
        object-fit: cover;
        display: block;
        transform: translateZ(0) scale(1.01);
        backface-visibility: hidden;
    }

    .rw-hero-video-background--desktop img {
        width: 100%;
        max-width: none;
        height: 100%;
        border-radius: 0;
        opacity: 0.6;
        object-fit: cover;
        display: block;
        transform: translateZ(0) scale(1.01);
        backface-visibility: hidden;
    }

    .rw-hero-video-background--mobile {
        display: none;
    }
}

/* === MOBILE RESPONSIVE === */
@media (max-width: 991px) {
    .rw-hero-head { 
        padding: clamp(56px, 11vw, 76px) 0 56px; 
    }

    .rw-hero-head__grid {
        grid-template-columns: 1fr;
    }

    .rw-hero-video-background--desktop {
        display: none;
    }

    .rw-hero-video-background--mobile {
        order: -1;
    }
    
    .rw-alt-layout { 
        grid-template-columns: 1fr; 
        gap: 40px; 
    }
    
    .rw-alt-layout.image-left .rw-alt-image { 
        order: 2; 
    } 
    
    .rw-alt-layout.image-left .rw-alt-content { 
        order: 1; 
    }
    
    .rw-scl-section-title { 
        font-size: 2.2rem; 
    }

    .rw-hero-title {
        font-size: clamp(2.1rem, 5vw, 3.4rem);
    }
}

@media (max-width: 768px) {
    .rw-scl-section-title {
        font-size: clamp(1.8rem, 7vw, 2.35rem);
    }

    .rw-hero-head {
        padding: clamp(48px, 12vw, 64px) 0 48px;
    }

    .rw-hero-title {
        font-size: clamp(2rem, 9vw, 2.75rem);
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
        text-wrap: balance;
        hyphens: none;
    }

    .rw-hero-subtitle {
        font-size: clamp(1rem, 4vw, 1.35rem);
    }

    .rw-hero-video-background,
    .rw-hero-video-background video {
        border-radius: 24px;
    }
}
