.up-hero { max-width: 46rem; margin: 0; padding-top: 1rem; }
.up-hero__title { font-size: clamp(1.9rem, 4vw, 2.75rem); font-weight: 700; line-height: 1.15; margin-bottom: 1rem; }
.up-hero__title .accent { color: var(--bs-primary); }
.up-hero__lead { font-size: 1.1rem; color: var(--bs-secondary-color); }

.up-sadrzaj ol { columns: 2; column-gap: 2rem; padding-left: 1.25rem; margin: 1.5rem 0 0; }
.up-sadrzaj li { margin-bottom: 0.25rem; break-inside: avoid; }

.up-koraci { list-style: none; padding: 0; margin: 0; }
.up-korak {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: center;
    margin-top: 2.5rem;
    padding: 1.5rem;
    background: #fff;
    border: 1px solid var(--brand-border, #e2e8f0);
    border-radius: 1.25rem;
    scroll-margin-top: 1rem;
}
.up-korak__broj {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.25rem; height: 2.25rem; margin-bottom: 0.75rem;
    border-radius: 50%; background: var(--bs-primary); color: #fff; font-weight: 700;
}
.up-korak__naslov { font-size: clamp(1.25rem, 2.5vw, 1.5rem); font-weight: 700; margin-bottom: 0.5rem; }
.up-korak__savjet { color: var(--bs-secondary-color); font-size: 0.95rem; margin-bottom: 0; }
.up-popis { padding-left: 1.25rem; margin-bottom: 0; }
.up-popis li { margin-bottom: 0.4rem; }

.up-korak__slika { margin: 0; }
.up-korak__slika img {
    display: block; width: 100%; height: auto;
    border: 1px solid var(--brand-border, #e2e8f0);
    border-radius: 0.75rem;
    box-shadow: 0 0.5rem 1.5rem rgba(15, 23, 42, 0.1);
}
.up-korak__slika--uska { max-width: 18rem; margin-inline: auto; }

@media (min-width: 992px) {
    .up-korak { grid-template-columns: 1fr 1.2fr; gap: 2.5rem; padding: 2rem; }
    .up-koraci > .up-korak:nth-child(even) .up-korak__slika { order: -1; }
    .up-korak--poseban:not(:has(.up-korak__slika)) { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
    .up-sadrzaj ol { columns: 1; }
}

.up-poziv { text-align: center; margin: 3rem auto 1rem; max-width: 36rem; }
.up-poziv h2 { font-size: 1.5rem; font-weight: 700; }
.up-poziv p { color: var(--bs-secondary-color); }