/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   AURIRA — Responsive Breakpoints
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ─── Tablet (768px – 1199px) ─── */
@media (max-width: 1199px) {
    :root {
        --gutter: 1.5rem;
    }

    .header__menu {
        gap: 1.5rem;
    }

    .featured-grid,
    .category-grid,
    .product-grid,
    .related-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-md);
    }

    .brand-promise__grid,
    .values-grid {
        gap: var(--space-lg);
    }

    .product-detail__main {
        gap: var(--space-xl);
    }

    .footer__main {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-lg);
    }

    .art-of-craft__inner {
        gap: var(--space-xl);
    }

    .brand-story__grid {
        gap: var(--space-xl);
    }

    .contact-grid {
        gap: var(--space-xl);
    }
}

/* ─── Mobile (< 768px) ─── */
@media (max-width: 767px) {
    :root {
        --gutter: 1rem;
    }

    /* Header */
    .header__nav,
    .header__cta {
        display: none;
    }

    .hamburger {
        display: flex;
    }

    .header__logo-text {
        font-size: 1.4rem;
    }

    /* Hero */
    .hero {
        min-height: 90vh;
    }

    .hero__actions {
        flex-direction: column;
        align-items: center;
    }

    .hero__actions .btn {
        width: 100%;
        max-width: 280px;
    }

    .hero__scroll-indicator {
        display: none;
    }

    /* Grids */
    .brand-promise__grid {
        grid-template-columns: 1fr;
        gap: var(--space-md);
    }

    .featured-grid,
    .product-grid,
    .related-grid {
        grid-template-columns: 1fr;
    }

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

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

    /* Product Detail */
    .product-detail__main {
        grid-template-columns: 1fr;
        gap: var(--space-lg);
    }

    .product-gallery {
        position: relative;
        top: 0;
    }

    .product-details-grid {
        grid-template-columns: 1fr;
    }

    /* Story */
    .story-hero {
        min-height: 50vh;
    }

    .brand-story__grid {
        grid-template-columns: 1fr;
    }

    .brand-story__image::before {
        display: none;
    }

    .process-timeline::before {
        left: 20px;
    }

    .process-step {
        grid-template-columns: 1fr;
        gap: var(--space-md);
        padding-left: 50px;
    }

    .process-step::before {
        left: 20px;
        top: 0;
        transform: translate(-50%, 0);
    }

    .process-step:nth-child(even) .process-step__image {
        order: 1;
    }

    .process-step:nth-child(even) .process-step__content {
        order: 2;
        text-align: left;
    }

    /* Art of Craft */
    .art-of-craft__inner {
        grid-template-columns: 1fr;
    }

    /* Contact */
    .contact-grid {
        grid-template-columns: 1fr;
    }

    .contact-form__row {
        grid-template-columns: 1fr;
    }

    /* Footer */
    .footer__main {
        grid-template-columns: 1fr;
        gap: var(--space-lg);
    }

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

    /* Filter Bar */
    .filter-bar {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: var(--space-xs);
    }

    .filter-bar::-webkit-scrollbar {
        display: none;
    }

    .filter-btn {
        white-space: nowrap;
        flex-shrink: 0;
    }

    /* Lightbox */
    .lightbox__nav { display: none; }

    /* WhatsApp */
    .whatsapp-float {
        bottom: 1.5rem;
        right: 1.5rem;
        width: 55px;
        height: 55px;
    }

    .whatsapp-float__tooltip {
        display: none;
    }

    /* Section spacing */
    .section {
        padding: var(--space-2xl) 0;
    }
}

/* ─── Small Mobile (< 480px) ─── */
@media (max-width: 479px) {
    .hero__title {
        font-size: 2.2rem;
    }

    .featured-card {
        aspect-ratio: 3/4;
    }

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