/**
 * ============================================================
 * Responsive Breakpoint'ler (responsive.css)
 * ============================================================
 * Mobile-first yaklaşım ile responsive kurallar
 */

/* ═══════════════ TABLET (max-width: 1024px) ═══════════════ */
@media (max-width: 1024px) {
    :root {
        --fs-hero: 3.5rem;
        --fs-3xl:  2rem;
        --fs-4xl:  2.5rem;
    }

    .hero .container {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .hero__subtitle {
        margin-left: auto;
        margin-right: auto;
    }

    .hero__actions {
        justify-content: center;
    }

    .hero__stats {
        justify-content: center;
    }

    .hero__visual {
        display: none;
    }

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

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

/* ═══════════════ MOBİL LARGE (max-width: 768px) ═══════════════ */
@media (max-width: 768px) {
    :root {
        --fs-hero: 2.75rem;
        --fs-3xl:  1.75rem;
        --header-height: 70px;
        --container-padding: 1rem;
    }

    /* Mobil navigasyon */
    .header__hamburger {
        display: flex;
    }

    .header.menu-open {
        z-index: 501; /* Her şeyin üstünde olmalı */
    }

    .nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 80%;
        max-width: 320px;
        height: 100vh;
        background: var(--color-white);
        box-shadow: -10px 0 40px rgba(0, 0, 0, 0.15);
        padding: calc(var(--header-height) + var(--space-xl)) var(--space-xl) var(--space-xl);
        z-index: 500; 
        transition: right var(--transition-slow);
        overflow-y: auto;
        pointer-events: auto; /* Etkileşimi garanti et */
    }

    .nav.open {
        right: 0;
    }

    .nav__list {
        flex-direction: column;
        gap: var(--space-xs);
    }

    .nav__link {
        display: block;
        padding: var(--space-sm) var(--space-md);
        font-size: var(--fs-base);
        border-radius: var(--radius-md);
    }

    .nav__link:hover,
    .nav__link.active {
        background: var(--color-gold-subtle);
    }

    .nav__link::after {
        display: none;
    }

    .nav__link--cta {
        text-align: center;
        margin-top: var(--space-md);
    }

    /* Top bar */
    .top-bar__left {
        gap: var(--space-sm);
    }

    .top-bar__link span {
        display: none;
    }

    .top-bar__right {
        display: none;
    }

    .hero {
        padding: var(--space-3xl) 0;
        min-height: auto;
    }

    .hero__stats {
        flex-wrap: wrap;
        gap: var(--space-lg);
    }

    .features__grid {
        grid-template-columns: 1fr;
    }

    .footer__grid {
        grid-template-columns: 1fr;
    }

    .footer__bottom .container {
        flex-direction: column;
        gap: var(--space-md);
        text-align: center;
    }

    .footer__bottom-links {
        flex-wrap: wrap;
        justify-content: center;
    }
}

/* ═══════════════ MOBİL SMALL (max-width: 480px) ═══════════════ */
@media (max-width: 480px) {
    :root {
        --fs-hero: 2.25rem;
        --fs-3xl: 1.5rem;
    }

    .hero__actions {
        flex-direction: column;
    }

    .hero__actions .btn {
        width: 100%;
    }

    .btn--lg {
        padding: 0.875rem 1.75rem;
        font-size: var(--fs-sm);
    }
}