* {
    margin: 0;
    padding: 0;
}

body {
    background-color: black;
    font-family: Arial, sans-serif;
}
.config{
    margin-top: 200px;
    color: white;
    font-size: 3rem;
    text-align: center;
    padding: 2rem;
    font-weight: bold;
}
/* Replace the existing min-width: 2560px media query with a 4K-specific one */
@media screen and (min-width: 3840px) {
    body {
        margin-right: 600px; /* Increased margin to accommodate larger side banner */
        font-size: 1.2rem; /* Base font size increase for readability */
    }

    /* Configurator Section */
    .configurateur-4k {
        padding: 4rem 3rem; /* More padding for larger screens */
    }

    .config {
        font-size: 2rem; /* Larger text for better readability */
        max-width: 1600px; /* Limit text width to avoid strain */
        margin: 0 auto 2rem;
    }

    .configurateur {
        max-width: 2800px; /* Utilize more screen space for iframe */
        margin: 0 auto;
    }

    .frame-area {
        height: 1200px; /* Taller iframe for 4K screens */
        border-radius: 20px; /* Slightly larger border radius */
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); /* Enhanced shadow for depth */
    }

    /* Side Banner */
    .side-banner {
        width: 500px; /* Wider banner for 4K screens */
        padding: 30px;
        border-radius: 25px;
        top: 80px;
        height: calc(100vh - 80px); /* Adjust height for header */
        font-size: 1.4rem; /* Larger base font size */
    }

    .rappelle {
        padding-top: 50%; /* Adjusted for larger banner */
        font-size: 2.8rem;
    }

    .appelez-moi, .mail, .bouton-recrutement {
        font-size: 2.2rem; /* Larger buttons */
        padding: 15px 30px;
        border-radius: 15px;
    }

    .contact, .find-us, .recrutement {
        font-size: 2.8rem; /* Larger headings */
        margin-top: 15%;
    }

    .social-link img {
        width: 120px; /* Larger social media icons */
    }

    /* Logo Eldo */
    .logo-eldo .widget-001 {
        width: 180px; /* Larger widget for 4K */
        height: 180px;
        left: 30px;
        bottom: 60px;
    }

    /* General Adjustments for Other Sections */
    .hero-title {
        font-size: 4.5rem; /* Larger hero title */
    }

    .hero-subtitle {
        font-size: 2rem;
    }

    .hero-image {
        max-width: 2400px; /* Larger images for 4K */
    }

    .btn-primary, .btn-secondary {
        font-size: 1.8rem; /* Larger buttons */
        padding: 1.5rem 3rem;
    }

    .qui-somme-nous h2 {
        font-size: 4.5rem;
    }

    .qui-somme-nous p, .qui-somme-nous ul {
        font-size: 2.2rem;
    }

    .qui-somme-nous iframe {
        height: 800px; /* Larger video iframe */
    }

    .schedule-container {
        max-width: 1000px; /* Wider schedule table */
        font-size: 2rem;
    }

    .schedule-header a {
        font-size: 2.2rem;
    }

    .facilite-content h2 {
        font-size: 4rem;
    }

    .facilite-content p {
        font-size: 2rem;
    }

    .facilite-icon {
        width: 120px;
        height: 120px;
        font-size: 3rem;
    }

    .presentation_produit h2 {
        font-size: 4.5rem;
    }

    .presentation_produit .container {
        max-width: 2400px; /* Wider product grid */
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); /* Larger product cards */
        gap: 40px;
    }

    .product img {
        height: 400px; /* Larger product images */
    }

    .product h3 {
        font-size: 2rem;
    }

    .product button {
        font-size: 1.4rem;
        padding: 10px 20px;
    }

    .parrainage h2 {
        font-size: 4.5rem;
    }

    .parrainage p {
        font-size: 2.2rem;
        max-width: 1200px;
    }

    .temoignages h2 {
        font-size: 4.5rem;
    }

    .temoignages a {
        font-size: 2rem;
    }

    .eldo-iframe-container {
        max-width: 1600px; /* Wider testimonial iframe */
        height: 700px;
    }

    .garantie h2 {
        font-size: 4.5rem;
    }

    .garantie p {
        font-size: 2.2rem;
    }

    .garantie img {
        max-width: 1200px; /* Larger images */
    }

    .attestation {
        font-size: 2.2rem;
        padding: 20px 40px;
    }

    .reseaux h2 {
        font-size: 4.5rem;
    }

    .reseaux p {
        font-size: 2rem;
        max-width: 1200px;
    }

    .reseaux .reseau-link img {
        width: 150px;
        height: 150px;
    }

    .faq-title {
        font-size: 5rem;
    }

    .faq-subtitle {
        font-size: 2rem;
    }

    .faq-question {
        font-size: 2rem;
        padding: 30px 40px;
    }

    .faq-answer-content {
        font-size: 1.8rem;
        padding: 0 40px 40px;
    }

    .faq-stat-number {
        font-size: 3.5rem;
    }

    .faq-stat-label {
        font-size: 1.4rem;
    }

    .add-question-title {
        font-size: 3rem;
    }

    .add-question-subtitle {
        font-size: 1.8rem;
    }

    .question-input {
        font-size: 1.8rem;
        padding: 20px 30px;
        min-height: 150px;
    }

    .btn {
        font-size: 1.8rem;
        padding: 20px 40px;
    }

    .admin-faq-header h1 {
        font-size: 4rem;
    }

    .admin-faq-header p {
        font-size: 2rem;
    }

    .admin-faq-question {
        font-size: 1.8rem;
    }

    .admin-faq-answer {
        font-size: 1.6rem;
    }

    .admin-btn, .delete-btn, .repondre-btn, .save-reponse-btn {
        font-size: 1.4rem;
        padding: 12px 25px;
    }

    .reponse-input {
        font-size: 1.6rem;
        padding: 15px 25px;
    }

    .admin-add-question h2 {
        font-size: 3rem;
    }

    .admin-form-group label {
        font-size: 1.6rem;
    }

    .admin-form-group select,
    .admin-form-group input,
    .admin-form-group textarea {
        font-size: 1.6rem;
        padding: 15px 25px;
    }
}

/* Ensure smaller screens don't override 4K styles unnecessarily */
@media screen and (max-width: 2560px) {
    .side-banner {
        display: block !important; /* Ensure side banner is visible below 4K */
    }
}

@media screen and (max-width: 1024px) {
    .demande_devis {
        padding: 2%;
        margin-top: 1%;
    }

    .tel {
        padding: 1.8%;
        margin-top: 1%;
    }
}

@media screen and (max-width: 480px) {
    .tel,
    .demande_devis {
        width: 100%;
        font-size: 1rem;
        padding: 10px;
    }
}

@media screen and (max-width: 426px) {
    .frame-area {
        display: none;
    }

    .section-configurateur {
        font-size: 1.7rem;
        margin-top: 40%;
        margin-bottom: 70%;
        padding: 5%;
    }
}