/* Hero with Big Title — Figma baseline 1440px, vw skaliranje */

/* ===== SEKCIJA ===== */
/* Tekst završava na 325+84=409px, + ~60px daha = 469px */
.hero-big-title {
    position: relative;
    width: 100%;
    background: #fff;
    height: 32.569vw; /* 469px @ 1440px */
}

/* ===== NASLOV ===== */
/* Figma: top 230px, left 22px, width 638px, Open Sans 400, 62px, line-height 68px, letter-spacing -1% */
.hero-big-title__title {
    position: absolute;
    top: 15.972vw;     /* 230px @ 1440px */
    left: 1.528vw;     /* 22px @ 1440px */
    width: 44.306vw;   /* 638px @ 1440px */
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 4.306vw;   /* 62px @ 1440px */
    line-height: 4.722vw; /* 68px @ 1440px */
    letter-spacing: -0.01em;
    color: #000;
    margin: 0;
}

/* ===== TEKST ===== */
/* Figma: top 325px, left 22px, width 764px, Open Sans 400, 16px, line-height 24px */
.hero-big-title__text {
    position: absolute;
    top: 22.569vw;     /* 325px @ 1440px */
    left: 1.528vw;     /* 22px @ 1440px */
    width: 53.056vw;   /* 764px @ 1440px */
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 1.111vw;   /* 16px @ 1440px */
    line-height: 1.667vw; /* 24px @ 1440px */
    letter-spacing: 0;
    color: #000;
    margin: 0;
}

.hero-big-title__text p {
    margin: 0;
}

/* ===== TABLET ( < 1300px ) ===== */
@media (max-width: 1300px) {
    .hero-big-title {
        height: auto;
        padding: 8vw 5vw 5vw;
        display: flex;
        flex-direction: column;
    }

    .hero-big-title__title,
    .hero-big-title__text {
        position: static;
        width: 100%;
    }

    .hero-big-title__title {
        font-size: clamp(32px, 4.306vw, 62px);
        line-height: 1.15;
        margin-bottom: 2vw;
    }

    .hero-big-title__text {
        font-size: 16px;
        line-height: 24px;
    }
}

/* ===== MOBITEL ( < 768px ) ===== */
@media (max-width: 767px) {
    .hero-big-title {
        padding: 80px 20px 40px;
    }

    .hero-big-title__title {
        font-size: 36px;
        line-height: 1.15;
        margin-bottom: 16px;
    }

    .hero-big-title__text {
        font-size: 16px;
        line-height: 24px;
    }
}