﻿
@media (max-width: 1350px) {

    .navbar {
        width: 100%;
    }
    

    /* ITEM SIMPLU, NU GRID */
    .flag-section {
        padding: 20px 0;
        margin: 0 auto;
        width: 100%;
        max-width: 420px;
    }



    .eu-wrapper, .eu-wrapper__container{
        display: grid;
        grid-template-columns: 1fr;
        
       
        max-width: 100%;
        width: auto;
    }
    

    .flag_container {
        margin: 0 auto;
        text-align: center;
    }

    

    .Text_Flag {
        padding-bottom: 30px;
        text-align: center;
    }
}



@media (max-width: 950px) {
    .hamburger {
        display: flex;
    }

    .nav-links {
        position: fixed;
        top: 70px;
        right: -100%;
        width: 100%;
        height: calc(100vh - 70px);
        background: rgba(0, 0, 0, 0.95);
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 40px;
        transition: right 0.4s ease;
    }

        .nav-links.active {
            right: 0;
        }

        .nav-links a {
            font-size: 1.6rem;
        }
    /* ===== Servicii ===== */
    
    .services,
    .ofers_service {
        padding: 60px 0;
    }

   
    .flag-section {
        padding: 20px 0;
        margin: 0 auto;
        width: 100%;
        max-width: 420px;
    }

    

    /* ===== Fonduri Europene ===== */
    .eu-wrapper, .eu-wrapper__container {
        display: grid;
        grid-template-columns: 1fr; /* 1 coloană pe mobil */
        width: 95%;
        max-width: 700px;
        margin: 0 auto;
        
        
        color: brown;
    }

    
        /* ===== Fonduri Europene ===== */
        .eu-info-box {
            position: relative;
            width: 100%;
            max-width: 700px;
            margin: 0 auto;
            padding: 40px 20px;
            text-align: center;
            border-radius: 5px;
            overflow: hidden;
        }


            /* FLAG CONTAINER ca fundal */
            .eu-info-box .flag_container {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                z-index: 0; /* în spatele textului */
                opacity: 0.15; /* fundal subtil */
                pointer-events: none; /* nu interferează cu click-uri */
                width: 100%;
                max-width: 350px; /* dimensiune pe mobil */
                height: auto;
            }

            /* Text peste fundal */
            .eu-info-box > h3,
            .eu-info-box > p {
                position: relative;
                z-index: 1; /* text deasupra steagului */
            }

      
    .eu-visual {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        transform: scale(0.7);
    }



    .eu-flag {
        width: 90%;
        max-width: 350px;
        height: auto;
        margin: 0 auto;
    }

   




    /* ===== Banner ===== */
    .construction-overlay h1 {
        font-size: clamp(2rem, 4vw, 2.4rem);
    }

    .construction-overlay p {
        font-size: clamp(1.2rem, 3vw, 1.6rem);
    }

    


}
@media (max-width: 600px) {

    /* ===== CONTAINERE GENERALE ===== */
    .service-grid
     {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    /* ===== CARDURI ===== */
    .flag-section {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .custom-card {
        
        max-width: 300px;
        margin: 0 auto;
    }

        .custom-card h2 {
            font-size: 1.3rem;
        }

    /* ===== SERVICII ===== */
    
   
    /* CARD SERVICIU */

    .service-card {
        width: 100%;
        max-width: 320px; /* control pe mobil */
        margin: 0 auto; /* fallback */
    }


        .service-card h3 {
            font-size: 1.15rem;
        }

        .service-card p {
            font-size: 0.9rem;
        }

    /* ===== FONDURI EU ===== */
    .eu-info-box {
        max-width: 620px;
        padding: 30px 15px;
    }

        .eu-info-box h3 {
            font-size: 1.4rem;
        }

        .eu-info-box p {
            font-size: 0.95rem;
        }

        .eu-info-box .flag_container {
            max-width: 220px; /* fundal mai mic */
            opacity: 0.12;
        }

    .eu-flag {
        max-width: 220px;
    }

    div.stars-circle {
        max-width: 90px;
        height: auto;
    }

    /* ===== HERO ===== */
    .hero {
        padding: 20px;
        min-height: 55vh;
        text-align: center;
    }

    .hero-content h1 {
        font-size: clamp(1.6rem, 6vw, 2rem);
    }

    .hero-content p {
        font-size: 0.95rem;
    }

    

    /* ===== NAVBAR ===== */
    .nav-links {
        grid-template-columns: 1fr;
        gap: 8px;
        height:auto;
    }
}
