/* ==========================================================================
   Oberig.club — media-style.css (responsive / mobile)
   Breakpoints: 640px (sm), 768px (md), 1024px (lg)
   ========================================================================== */

/* --------------------------------------------------------------------------
   640px — sm
   -------------------------------------------------------------------------- */

@media (min-width: 640px) {
    .hero__actions {
        flex-direction: row;
        align-items: center;
    }

    .footer__bottom {
        flex-direction: row;
        justify-content: space-between;
    }
}

/* --------------------------------------------------------------------------
   768px — md
   -------------------------------------------------------------------------- */

@media (min-width: 768px) {
    .container {
        padding: 0 3rem;
    }

    .nav__menu {
        display: flex;
    }

    .nav__cta {
        display: inline-flex;
    }

    .nav__burger {
        display: none;
    }

    .nav__mobile-menu {
        display: none !important;
    }

    .hero__title {
        font-size: 3.75rem;
    }

    .hero__text {
        font-size: 1.25rem;
    }

    .hero__stats {
        grid-template-columns: repeat(4, 1fr);
    }

    .section__title {
        font-size: 2.25rem;
    }

    .features__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .masonry-gallery {
        columns: 2;
    }

    .risk__grid {
        grid-template-columns: 0.9fr 1.1fr;
        gap: 3rem;
    }

    .process__line {
        display: block;
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        height: 2px;
        background: linear-gradient(to right, transparent, rgba(245, 158, 11, 0.5), transparent);
        transform: translateY(-50%);
        z-index: 0;
    }

    .process__steps {
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }

    .testimonials__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .cta-form__row {
        grid-template-columns: repeat(2, 1fr);
    }

    .cta__card {
        padding: 3rem;
    }

    .footer__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* --------------------------------------------------------------------------
   1024px — lg
   -------------------------------------------------------------------------- */

@media (min-width: 1024px) {
    .hero__title {
        font-size: 4.5rem;
    }

    .about__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 4rem;
    }

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

    .masonry-gallery {
        columns: 3;
    }

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

    .footer__grid {
        grid-template-columns: 2fr 1fr 1fr;
        gap: 3rem;
    }
}

@media (min-width: 1280px) {
    .masonry-gallery {
        columns: 4;
    }
}

/* --------------------------------------------------------------------------
   Mobile-specific adjustments (< 768px)
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .about__badge {
        left: 0;
        bottom: -1rem;
        padding: 1rem;
        gap: 0.75rem;
    }

    .about__badge-icon {
        width: 2.5rem;
        height: 2.5rem;
    }

    .about__image-wrap {
        margin-bottom: 2rem;
    }

    .testimonial-card__quote {
        padding-right: 0;
    }

    .cta__card {
        padding: 1.5rem;
    }

    .footer__legal {
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }
}

@media (max-width: 479px) {
    .hero__title {
        font-size: 2.25rem;
    }

    .hero__stat-value {
        font-size: 1.5rem;
    }

    .section {
        padding: 4rem 0;
    }

    .section__header {
        margin-bottom: 2.5rem;
    }
}