/* =========================================================
   GIFTTREE BD — RESPONSIVE CSS
   Mobile-first breakpoints: 1024px, 768px, 480px
   ========================================================= */

/* =========================================================
   TABLET — max-width: 1024px
   ========================================================= */
@media (max-width: 1024px) {

    /* Categories grid: 6 → 3 columns */
    .categories-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Products grid: 4 → 2 or 3 */
    .products-grid-4col {
        grid-template-columns: repeat(3, 1fr);
    }

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

    /* Why choose us: 4 → 2 */
    .why-choose-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Hero */
    .hero-inner {
        gap: 40px;
    }

    .hero-headline {
        font-size: clamp(1.8rem, 4.5vw, 3rem);
    }

    /* Shop layout */
    .shop-layout {
        grid-template-columns: 200px 1fr;
        gap: 24px;
    }

    /* Footer grid */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 36px;
    }

    /* Nav font size */
    .primary-menu > li > a {
        padding: 16px 10px;
        font-size: 0.82rem;
    }

    /* Single product */
    .single-product-layout {
        gap: 32px;
    }

    /* Cart layout */
    .cart-layout {
        grid-template-columns: 1fr 300px;
    }

    /* Checkout layout */
    .checkout-layout {
        grid-template-columns: 1fr 320px;
    }

    /* Occasion banners */
    .occasion-banner {
        padding: 36px 28px;
        min-height: 220px;
    }

    .occasion-banner-title {
        font-size: 1.8rem;
    }

    /* Testimonials */
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* =========================================================
   MOBILE — max-width: 768px
   ========================================================= */
@media (max-width: 768px) {

    /* Section spacing */
    :root {
        --section-padding-desktop: var(--section-padding-mobile);
    }

    .section {
        padding: var(--section-padding-mobile) 0;
    }

    /* Container */
    .container {
        padding: 0 16px;
    }

    /* ---- HEADER ---- */
    .header-search {
        display: none;
    }

    .hamburger-btn {
        display: flex;
    }

    .header-top-inner {
        grid-template-columns: auto auto;
    }

    .header-nav {
        display: none;
    }

    .header-icons .header-icon-btn:not(.cart-icon-btn):not(.hamburger-btn):not(:last-child) {
        display: none;
    }

    /* ---- HERO ---- */
    .hero-inner {
        grid-template-columns: 1fr;
        gap: 32px;
        text-align: center;
    }

    .hero-image-wrap {
        order: -1;
    }

    .hero-flower-illustration {
        max-width: 280px;
        margin: 0 auto;
    }

    .hero-subtext {
        max-width: 100%;
    }

    .hero-stats {
        justify-content: center;
    }

    .hero-trust-badges {
        align-items: center;
    }

    .hero-cta-group {
        justify-content: center;
    }

    .hero-accent-card {
        display: none;
    }

    /* ---- CATEGORIES ---- */
    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    /* ---- PRODUCTS ---- */
    .products-grid-4col,
    .products-grid-3col {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    /* ---- OCCASIONS ---- */
    .occasion-banners-grid {
        grid-template-columns: 1fr;
    }

    .occasion-banner {
        min-height: 200px;
        padding: 32px 24px;
    }

    .occasion-quicklinks {
        gap: 8px;
    }

    .occasion-quicklink {
        font-size: 0.8rem;
        padding: 8px 14px;
    }

    /* ---- WHY CHOOSE ---- */
    .why-choose-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    .feature-card {
        padding: 24px 16px;
    }

    /* ---- TESTIMONIALS ---- */
    .testimonials-grid {
        grid-template-columns: 1fr;
    }

    .testimonials-aggregate {
        flex-direction: column;
        gap: 16px;
        padding: 20px 24px;
    }

    .aggregate-divider {
        width: 60px;
        height: 1px;
    }

    /* ---- FOOTER ---- */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 28px;
    }

    .footer-col-brand {
        grid-column: 1 / -1;
    }

    .newsletter-strip-inner {
        flex-direction: column;
        text-align: center;
    }

    .newsletter-input {
        width: 100%;
    }

    .footer-bottom-inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 12px;
    }

    /* ---- CART ---- */
    .cart-layout {
        grid-template-columns: 1fr;
    }

    .cart-summary-column {
        position: static;
    }

    .cart-table-header {
        display: none;
    }

    .cart-table-row {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 16px;
    }

    .cart-price-cell::before { content: attr(data-label) ': '; font-weight: 600; color: var(--color-muted); }
    .cart-qty-cell::before   { content: attr(data-label) ': '; font-weight: 600; color: var(--color-muted); }
    .cart-total-cell::before { content: attr(data-label) ': '; font-weight: 600; color: var(--color-muted); }

    .cart-remove-cell {
        justify-self: end;
    }

    /* ---- CHECKOUT ---- */
    .checkout-layout {
        grid-template-columns: 1fr;
    }

    .checkout-summary-column {
        position: static;
        order: -1;
    }

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

    .payment-gateway-cards {
        grid-template-columns: 1fr;
    }

    /* ---- SHOP ---- */
    .shop-layout {
        grid-template-columns: 1fr;
    }

    .shop-sidebar {
        position: static;
    }

    /* ---- SINGLE PRODUCT ---- */
    .single-product-layout {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .quantity-and-cart {
        flex-direction: column;
    }

    /* ---- CONTENT + SIDEBAR ---- */
    .content-layout-with-sidebar {
        grid-template-columns: 1fr;
    }

    .sidebar-column {
        position: static;
    }

    /* ---- POSTS GRID ---- */
    .posts-grid {
        grid-template-columns: 1fr;
    }

    /* ---- PAGE HERO ---- */
    .page-hero {
        padding: 28px 0;
    }
}


/* =========================================================
   SMALL MOBILE — max-width: 480px
   ========================================================= */
@media (max-width: 480px) {

    /* Typography */
    body {
        font-size: 14px;
    }

    .page-hero-title,
    .error-404-title {
        font-size: 22px;
    }

    /* Logo */
    .logo-text {
        font-size: 1.2rem;
    }

    /* Products grid: still 2 columns but smaller gap */
    .products-grid-4col,
    .products-grid-3col,
    .products-grid-2col {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .product-card-body {
        padding: 10px 12px 12px;
    }

    .product-card-title {
        font-size: 0.8rem;
    }

    .btn {
        padding: 10px 20px;
        font-size: 0.85rem;
    }

    .btn-lg {
        padding: 14px 24px;
        font-size: 0.95rem;
    }

    /* Categories */
    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .category-card-image-wrap {
        width: 64px;
        height: 64px;
    }

    /* Why choose us */
    .why-choose-grid {
        grid-template-columns: 1fr;
    }

    /* Footer */
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .footer-main {
        padding: 40px 0 28px;
    }

    /* Occasion banners */
    .occasion-banner {
        min-height: auto;
        padding: 28px 20px;
    }

    .occasion-banner-title {
        font-size: 1.5rem;
    }

    .occasion-quicklinks {
        gap: 6px;
    }

    /* Cart */
    .cart-table-row {
        padding: 14px;
    }

    /* Checkout steps */
    .checkout-step-body {
        padding: 16px;
    }

    /* Hero */
    .hero-section {
        padding: 40px 0;
    }

    .hero-cta-group {
        flex-direction: column;
    }

    .hero-cta-group .btn {
        width: 100%;
        justify-content: center;
    }

    /* Section title */
    .section-title {
        font-size: 1.6rem;
    }

    /* Delivery notice */
    .delivery-notice-banner {
        font-size: 0.82rem;
    }

    /* Newsletter strip */
    .newsletter-input-group {
        flex-direction: column;
        width: 100%;
    }

    .newsletter-input {
        width: 100%;
    }

    /* Product tabs */
    .product-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .product-tab-btn {
        padding: 12px 16px;
        white-space: nowrap;
        font-size: 0.85rem;
    }

    /* Testimonials aggregate */
    .testimonials-aggregate {
        width: 100%;
    }
}