.btn_movie_ru {
    background-image: url('film_ru.png');
}
.btn_movie_ru:hover {
    background-image: url('film_ru_clicked.png');
}

.btn_contact_ru {
    background-image: url('contact_ru.png');
}
.btn_contact_ru:hover {
    background-image: url('contact_ru_clicked.png');
}/* Grundlegender Stil */
body {
    background-color: #3C3C4E;
    color: #FFFFFF;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    display: grid;
    /* ADDED: Ensure minimum width so layout doesn't break on mobile */
    min-width: 1000px;
}

main {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0;
    box-sizing: border-box;
    background-color: #3C3C4E;
}

/* Header Styles */
#header-content {
    background-image: url('hgstartcont.jpg');
    background-size: cover;
    padding: 40px 20px;
    text-align: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

h1 {
    font-size: 56px;
    color: #FFFFFF;
    text-shadow: 3px 3px 6px #000000;
    margin: 0;
}

.subtitle {
    font-size: 22px;
    color: #CCCCCC;
    margin: 5px 0;
    text-shadow: 2px 2px 4px #000000;
    line-height: 1.4;
}

/* Video Section */
#video-section {
    text-align: center;
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.responsive {
    margin-top: 40px;
    margin-bottom: 80px;
/*    width: 100%;*/
    max-width: 1400px;
    height: auto;
    max-height: 400px;

    /* Subtle shadow on left and right only */
    box-shadow:
        -4px 0 8px rgba(0, 0, 0, 0.15),  /* Left shadow */
        4px 0 8px rgba(0, 0, 0, 0.15);   /* Right shadow */

    /* Very subtle 3D tilt */
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg);

    /* Smooth transition for hover effects */
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;

    /* Ensuring a solid background to avoid flickering */
    background-color: #3C3C4E;
}

/* On hover - subtle scaling and shadow enhancement */
.responsive:hover {
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg) scale(1.02);
    box-shadow:
        -6px 0 12px rgba(0, 0, 0, 0.25),  /* Enhanced left shadow */
        6px 0 12px rgba(0, 0, 0, 0.25);   /* Enhanced right shadow */
}

/* Buttons Section */
#buttons {
    margin-top: 10px;
}

.button-container {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin: 20px 0; /* Adjusted margin for spacing */
}

.button-group {
    display: flex;
    justify-content: center;
    gap: 10px; /* Space between buttons if more are added later */
}

button {
    border: none;
    height: 40px;
    width: 180px;
    background-size: cover;
    cursor: pointer;
}

/* German Button Styles */
.btn_text_ger {
    background-image: url('text_ger.png');
}
.btn_text_ger:hover {
    background-image: url('text_ger_clicked.png');
}

.btn_movie_ger {
    background-image: url('film_ger.png');
}
.btn_movie_ger:hover {
    background-image: url('film_ger_clicked.png');
}

.btn_contact_ger {
    background-image: url('impressum.png');
}
.btn_contact_ger:hover {
    background-image: url('impressum_clicked.png');
}

/* English Button Styles */
.btn_text_en {
    background-image: url('text_en.png');
}
.btn_text_en:hover {
    background-image: url('text_en_clicked.png');
}

.btn_movie_en {
    background-image: url('movie_en.png');
}
.btn_movie_en:hover {
    background-image: url('movie_en_clicked.png');
}

.btn_contact_en {
    background-image: url('contact_en.png');
}
.btn_contact_en:hover {
    background-image: url('contact_en_clicked.png');
}

/* Russian Button Styles */
.btn_text_ru {
    background-image: url('text_ru.png');
}
.btn_text_ru:hover {
    background-image: url('text_ru_clicked.png');
}

/* Chinese, Japanese, and Dubai Button Styles */
.btn_text_cn {
    background-image: url('text_cn.png');
}
.btn_text_cn:hover {
    background-image: url('text_cn_clicked.png');
}

.btn_text_jp {
    background-image: url('text_jp.png');
}
.btn_text_jp:hover {
    background-image: url('text_jp_clicked.png');
}

.btn_text_dubai {
    background-image: url('text_dubai.png');
}
.btn_text_dubai:hover {
    background-image: url('text_dubai_clicked.png');
}


/* Advantages Section */
#advantages {
    text-align: center;
    padding: 10px;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
}

.advantages-table {
    width: 100%;
    border-collapse: collapse; /* Collapses borders */
    table-layout: fixed; /* Fix the width of table columns */
}

.advantages-table tr {
    display: flex; /* Use flexbox for rows */
    justify-content: center; /* Center content */
    gap: 70px; /* Add a consistent gap between columns */
}

/* Ensure table cells and content are aligned consistently */
.advantages-table td {
    width: 500px; /* Maintain fixed width for each cell */
    max-width: 500px;
    display: flex;
    flex-direction: column; /* Stack button and content vertically */
    justify-content: center;
    align-items: center; /* Center content horizontally */
    padding: 0;
}

.cell-content {
    padding: 15px 65px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    width: 100%; /* Ensure content fills the cell */
    box-sizing: border-box;
}
.advantages {
    list-style: none;
    padding: 0;
    font-size: 18px;
    color: #CCCCCC;
    line-height: 1.6;
}

.style3 {
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 10px;
}

.advantages li:hover {
    color: #FFFFFF;
    transition: color 0.3s ease;
}

/* Footer Styles */
footer {
    text-align: center;
    padding: 10px 0;
    flex-shrink: 0;
    margin-top: 9rem;
}

.footer-content {
    color: #999999;
    font-size: 14px;
}