/* ============================================
   BDK Wheels Solutions S.R.L. - Desktop ONLY
   Se aplica DOAR pe ecrane >= 769px
   ============================================ */

@media (min-width: 769px) {

    .hero {
        padding: 5rem 0 2rem;
    }

    /* .hero-actions e gol in prezent (fara butoane) — margin-bottom: 60px
       ocupa spatiu mort si impinge .hero-stats in afara containerului.
       Pe desktop: fara margin, fara sa afecteze layout-ul cand e gol. */
    .hero-actions {
        margin-bottom: 0;
    }

    /* Textul din hero e aliniat la STANGA — la marginea conținutului site-ului,
       nu la centru și nu la x=0.
       - .hero e flex cu justify-content: center: fara margin-right: auto,
         blocul (titlu, sub titlu, stats) mergea la CENTRU — defectul văzut.
       - margin-left: 24px = gutter-ul conținutului (vezi base.css .container
         si header.css .header-inner.container: ambele 24px). Fara el textul
         ar ajunge lipit de marginea ecranului (x=0), mai în stânga de siglă.
       - max-width restrânge zona de text, ca titlul să nu se întindă
         peste toată lățimea. */
    .hero-content {
        position: relative;
        margin: 0 auto 0 24px;
        padding: 0;
        max-width: min(760px, calc(100vw - 48px));
        width: 100%;
        box-sizing: border-box;
        text-align: left;
    }

    /* MOBILĂ (portocaliu): wrapperul hardcodeaza height: 1.2em din font-size
       mostenit (hero-title ~32px -> 38px), dar copilul are 51.2px -> textul
       iese 13px sub fereastra cu overflow: hidden si se vede "taiat jos".
       Fix: fereastraWrapperului = inaltimea reala a copilului (font 3.2rem
       clamp -> line-height 1.2em = 61.4px), plus animatia slideText
       deplaseaza pe orizontala, nu verticala — ocupam toata inaltimea. */
    .hero-title-main-wrap {
        height: 1.35em;
        font-size: clamp(1.9rem, 5vw, 3.2rem);
        line-height: 1.2;
    }

    /* Titlul ramane pe un singur rand, niciodata rupt */
    .hero-title-top {
        white-space: nowrap;
        word-break: keep-all;
        overflow-wrap: normal;
        hyphens: none;
    }

    .hero-title-main {
        white-space: nowrap;
    }

    section {
        padding: 100px 0;
    }

    .servicii-grid {
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    }

    .galerie-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }

    .zone-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .zone-card h3 {
        font-size: 1.45rem;
    }

    .zone-card p {
        font-size: 1.05rem;
    }


    .preturi-single {
        max-width: 800px;
        margin: 0 auto;
    }

    /* Nav orizontal pe desktop */
    .nav {
        display: flex;
    }

    .nav-toggle {
        display: none;
    }
}