:root {
        --bg-light: #fdfdfd; /* Fundal general deschis */
        --accent-blue: #2c7a7b; /* Albastru mai închis pentru contrast pe alb */
        --accent-gold: #c69b02;
        --text-main: #1a1a1a; /* Text închis la culoare */
        --text-secondary: #555555;
        --line-color: rgba(0, 86, 179, 0.3);
    }

    .hero-container {
        display: flex;
        min-height: 100vh;
        position: relative;
        flex-direction: row;
        background: var(--bg-light); /* Eliminat fundalul negru */
        font-family: sans-serif;
    }

    /* --- PARTEA STÂNGĂ --- */
    .content-side {
        flex: 1.2;
        padding: 80px 5%;
        z-index: 10;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .brand-label {
        color: var(--accent-blue);
        font-weight: 800;
        letter-spacing: 2px;
        text-transform: uppercase;
        font-size: 0.9rem;
        margin-bottom: 1rem;
    }

  h1 {
    color: var(--text-main);
    font-size: clamp(1rem, 3vw, 2rem); /* mai mic decât înainte */
    line-height: 1.1;
    margin: 0 0 1.5rem 0;
    font-weight: 900;
}


    h1 span { color: var(--accent-blue); }

    .desc {
        font-size: 1.15rem;
        line-height: 1.6;
        color: var(--text-secondary);
        max-width: 600px;
        margin-bottom: 2rem;
    }

    /* --- HARTA ȘI EFECTE LINII --- */
    .map-wrapper {
        width: 100%;
        max-width: 750px;
        background: #ffffff;
        border-radius: 20px;
        padding: 20px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    }

    .node-point { 
        fill: var(--accent-blue); 
        stroke: #fff; 
        stroke-width: 2; 
    }

    .node-text { 
        fill: #333; 
        font-size: 12px; 
        font-weight: 700; 
    }

    .conn-line { 
        stroke: var(--line-color); 
        stroke-width: 2; 
        fill: none; 
        stroke-dasharray: 8, 5; /* Linie întreruptă */
    }

    /* EFECTUL DE MIȘCARE PE LINII */
    .animated-flow {
        animation: lineMove 2s linear infinite;
    }

    @keyframes lineMove {
        from { stroke-dashoffset: 26; }
        to { stroke-dashoffset: 0; }
    }

    /* --- PARTEA DREAPTĂ (FUNDAL ALB) --- */
    .image-side {
        flex: 1;
        position: relative;
        background: #ffffff; /* Fundal alb curat */
    }

    .truck-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        /* Gradient de la transparent (stânga) la vizibil (dreapta) */
        mask-image: linear-gradient(to left, black 70%, transparent 100%);
        -webkit-mask-image: linear-gradient(to left, black 70%, transparent 100%);
    }

    /* --- RESPONSIVE --- */
    @media (max-width: 1024px) {
        .hero-container { flex-direction: column; }
        .image-side { order: 3; min-height: 350px; }
        .content-side { padding: 40px 20px; text-align: center; align-items: center; }
        .map-wrapper { margin: 0 auto; }
        .truck-img {
            mask-image: linear-gradient(to top, black 70%, transparent 100%);
            -webkit-mask-image: linear-gradient(to top, black 70%, transparent 100%);
        }
    }