/* ==========================================
   RESPONSIVE - Tablet (max 1024px)
   ========================================== */

@media (max-width: 1024px) {
    .tkp-categories-grid {
        grid-template-columns: repeat(3, 1fr);
    }

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

    .tkp-hero-title {
        font-size: 36px;
    }

    .tkp-hero-subtitle {
        font-size: 20px;
    }
}

/* ==========================================
   RESPONSIVE - Tablet small (max 768px)
   ========================================== */

@media (max-width: 768px) {
    .tkp-categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .tkp-products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .tkp-why-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .tkp-blog-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .tkp-steps-grid {
        flex-direction: column;
        align-items: center;
    }

    .tkp-step {
        max-width: 100%;
        width: 100%;
    }

    .tkp-step-arrow {
        transform: rotate(90deg);
        padding: 0;
    }

    .tkp-hero {
        padding: 48px 16px;
    }

    .tkp-hero-title {
        font-size: 28px;
    }

    .tkp-hero-subtitle {
        font-size: 18px;
    }

    .tkp-hero-tagline {
        font-size: 15px;
    }

    .tkp-hero-usps {
        gap: 8px;
        font-size: 13px;
    }

    .tkp-hero-usps span {
        padding: 4px 10px;
    }

    .tkp-hero-buttons {
        flex-direction: column;
        align-items: center;
    }

    .tkp-hero-buttons .tkp-btn {
        width: 100%;
        max-width: 300px;
    }

    .tkp-section-title {
        font-size: 24px;
        margin-bottom: 24px;
    }

    .tkp-trust-bar-inner {
        gap: 16px;
    }

    .tkp-trust-item {
        font-size: 12px;
    }

    .tkp-counter-amount {
        font-size: 40px;
    }

    .tkp-counter-inner h2 {
        font-size: 18px;
    }

    .tkp-newsletter-form {
        flex-direction: column;
    }

    .tkp-newsletter-input {
        border-right: 2px solid var(--tkp-border);
        border-radius: var(--tkp-radius-sm);
    }

    .tkp-newsletter-form .tkp-btn {
        border-radius: var(--tkp-radius-sm);
    }

    .tkp-page-content {
        padding: 24px 16px;
        margin: 12px;
    }

    #tkp-top-bar {
        font-size: 11px;
        padding: 6px 0;
    }

    /* Cookie banner mobile */
    .tkp-cookie-inner {
        flex-direction: column;
    }

    .tkp-cookie-buttons {
        width: 100%;
    }

    .tkp-cookie-btn {
        flex: 1;
        text-align: center;
    }
}

/* ==========================================
   RESPONSIVE - Mobile (max 480px)
   ========================================== */

@media (max-width: 480px) {
    .tkp-products-grid {
        grid-template-columns: 1fr;
    }

    .tkp-categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .tkp-category-card {
        padding: 16px 12px;
    }

    .tkp-category-icon {
        font-size: 32px;
    }

    .tkp-category-name {
        font-size: 13px;
    }

    .tkp-hero-title {
        font-size: 24px;
    }

    .tkp-product-card .tkp-product-info {
        padding: 12px;
    }

    .tkp-price-current {
        font-size: 18px;
    }

    .tkp-hero-search form {
        flex-direction: column;
        border-radius: var(--tkp-radius-sm);
    }

    .tkp-hero-search-input {
        border-radius: var(--tkp-radius-sm) var(--tkp-radius-sm) 0 0;
    }

    .tkp-hero-search-btn {
        border-radius: 0 0 var(--tkp-radius-sm) var(--tkp-radius-sm);
    }
}

/* ==========================================
   STICKY MOBILE CTA (Product Page)
   ========================================== */

@media (max-width: 768px) {
    .woocommerce div.product .single_add_to_cart_button {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 999;
        border-radius: 0 !important;
        margin: 0;
        padding: 16px 20px;
        font-size: 16px;
    }

    .woocommerce div.product {
        padding-bottom: 60px;
    }
}

/* ==========================================
   PRINT STYLES
   ========================================== */

@media print {
    #tkp-top-bar,
    #tkp-cookie-banner,
    #tkp-footer-disclaimer,
    .tkp-cta-button,
    .tkp-hero-search,
    .tkp-newsletter-section {
        display: none !important;
    }
}
