/* ============================================================
   MINK$BY$INA — Responsive Design
   ============================================================ */

/* === Tablet: 1024px === */
@media (max-width: 1024px) {
    .header__nav { display: none; }
    .header__hamburger { display: flex; }
    .header__cta { display: none; }

    .hero__img--1 { width: 200px; height: 280px; }
    .hero__img--2 { width: 180px; height: 250px; }
    .hero__img--3 { display: none; }

    .about__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .about__image-wrapper {
        max-width: 450px;
        margin: 0 auto;
    }

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

    .services-preview__showcase {
        grid-template-columns: 1fr 1fr;
    }

    .service-editorial--feature {
        margin-top: 0;
        margin-bottom: 0;
        grid-column: span 2;
    }

    .gallery-preview__masonry {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 200px;
    }

    .gallery-preview__item:nth-child(1) { grid-row: span 2; }
    .gallery-preview__item:nth-child(4) { grid-column: span 1; }

    .lash-builder__grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .lash-builder__summary-card {
        position: static;
    }

    .gallery__masonry {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 250px;
    }

    .gallery__item--wide { grid-column: span 1; }

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

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

    .testimonial-card:nth-child(3) { display: none; }

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

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

/* === Mobile: 768px === */
@media (max-width: 768px) {
    :root {
        --section-pad: clamp(3rem, 6vw, 5rem);
    }

    body { cursor: auto; }
    .custom-cursor, .custom-cursor-follower { display: none; }

    .hero {
        min-height: 100svh;
    }

    .hero__img { display: none; }

    .hero__logo-reveal img {
        width: 100px;
        height: 100px;
    }

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

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

    .hero__scroll { display: none; }

    .page-hero { height: 45vh; min-height: 300px; }
    .page-hero--compact { height: 35vh; min-height: 250px; }

    .about__stats {
        padding: 2rem 1.5rem;
    }

    .services-preview__showcase {
        grid-template-columns: 1fr;
    }

    .service-editorial--feature { grid-column: span 1; }

    .service-editorial__image { aspect-ratio: 4/3; }
    .service-editorial--feature .service-editorial__image { aspect-ratio: 4/3; }

    .gallery-preview__masonry {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 180px;
    }

    .gallery-preview__item:nth-child(1) { grid-row: span 1; }

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

    .gallery__masonry {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 200px;
    }

    .gallery__item--tall { grid-row: span 1; }

    .lightbox__prev { left: 1rem; }
    .lightbox__next { right: 1rem; }
    .lightbox__close { top: 1rem; right: 1rem; }

    .why-choose__grid {
        grid-template-columns: 1fr;
    }

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

    .testimonial-card:nth-child(3) { display: block; }

    .booking__progress {
        gap: 0.25rem;
    }

    .booking__step span { display: none; }

    .booking__step-line { width: 20px; }

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

    .booking__nav {
        flex-direction: column;
        gap: 0.75rem;
    }

    .booking__nav .btn { width: 100%; }

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

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

    .footer__social { justify-content: center; }
    .footer__contact li { justify-content: center; }

    .footer__bottom {
        flex-direction: column;
        text-align: center;
    }

    .floating-book {
        bottom: 1rem;
        right: 1rem;
        padding: 0.75rem 1.25rem;
    }

    .floating-book__text { display: none; }

    .floating-text {
        bottom: 1rem;
        left: 1rem;
        width: 44px;
        height: 44px;
    }

    .back-to-top {
        bottom: 4.5rem;
        right: 1rem;
        width: 40px;
        height: 40px;
    }

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

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

    .floating-cart {
        width: 100%;
        max-width: 100%;
    }

    .contact__form-wrapper { padding: 1.5rem; }
}

/* === Small Mobile: 480px === */
@media (max-width: 480px) {
    .hero__line {
        font-size: 2rem;
    }

    .hero__line--sub {
        font-size: 1rem;
    }

    .about__stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
        padding: 1.5rem 1rem;
    }

    .stat__number {
        font-size: 2rem;
    }

    .gallery-preview__masonry,
    .gallery__masonry {
        grid-template-columns: 1fr;
        grid-auto-rows: 250px;
    }

    .gallery__item--tall,
    .gallery__item--wide { grid-row: span 1; grid-column: span 1; }

    .lash-builder__choice {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .mobile-nav__link {
        font-size: 1.4rem;
    }

    .section-title {
        font-size: 1.8rem;
    }

    .page-hero__title {
        font-size: 2rem;
    }

    .booking__step-num {
        width: 30px;
        height: 30px;
        font-size: 0.75rem;
    }
}

/* === Large Screens: 1440px+ === */
@media (min-width: 1440px) {
    :root {
        --container-max: 1400px;
    }

    .hero__img--1 { width: 350px; height: 470px; }
    .hero__img--2 { width: 300px; height: 400px; }
    .hero__img--3 { width: 250px; height: 340px; }

    .gallery-preview__masonry {
        grid-auto-rows: 300px;
    }

    .gallery__masonry {
        grid-auto-rows: 320px;
    }
}

/* === Print === */
@media print {
    .header, .floating-book, .floating-text, .back-to-top,
    .floating-cart, .mobile-nav, .custom-cursor,
    .custom-cursor-follower, .loader, .hero__particles,
    .hero__glow { display: none !important; }

    body {
        background: white;
        color: black;
        cursor: auto;
    }

    .section-title, .gold { color: black !important; }
}
