/* ============================================
   AMMOURI PARFUM - RESPONSIVE STYLES
   ============================================ */

/* ============================================
   LARGE DESKTOP (1600px+)
   ============================================ */

@media (min-width: 1600px) {
    .container {
        max-width: 1500px;
    }

    .hero-title {
        font-size: 4.5rem;
    }
}

/* ============================================
   DESKTOP (1200px - 1599px)
   ============================================ */

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

/* ============================================
   SMALL DESKTOP / LAPTOP (992px - 1199px)
   ============================================ */

@media (max-width: 1199px) {
    :root {
        --header-height: 70px;
    }

    .container {
        padding: 0 1.5rem;
    }

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

    .hero-text {
        padding-right: var(--space-xl);
    }

    .hero-title {
        font-size: 2.8rem;
    }

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

    .collection-card-inner {
        height: 240px;
    }

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

    .promo-grid {
        min-height: 350px;
    }

    .brand-story-grid {
        gap: var(--space-2xl);
    }

    .footer-grid {
        grid-template-columns: 1.5fr 1fr 1fr 1fr;
    }

    .footer-grid .footer-column:last-child {
        grid-column: 1 / -1;
        padding-top: var(--space-xl);
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    .footer-contact-list {
        display: flex;
        gap: var(--space-2xl);
        flex-wrap: wrap;
    }

    .mega-menu {
        min-width: 700px;
    }
}

/* ============================================
   TABLET (768px - 991px)
   ============================================ */

@media (max-width: 991px) {
    :root {
        --space-5xl: 5rem;
        --space-4xl: 4rem;
    }

    /* Header: Switch to mobile nav */
    .header-nav {
        display: none;
    }

    .mobile-menu-toggle {
        display: flex;
    }

    .header-layout {
        gap: var(--space-md);
    }

    /* Hero */
    .hero-grid {
        grid-template-columns: 1fr;
        text-align: center;
        min-height: auto;
        padding-top: 2rem;
    }

    .hero-text {
        padding-right: 0;
        order: 1;
    }

    .hero-visual {
        order: 0;
    }

    .hero-product-showcase {
        max-width: 350px;
    }

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

    .hero-side-products {
        display: none;
    }

    .hero-title {
        font-size: 2.5rem;
    }

    /* Collections */
    .collections-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .collection-card-inner {
        height: 220px;
    }

    /* Products */
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-lg);
    }

    /* Promo */
    .promo-grid {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .promo-card {
        min-height: 250px;
    }

    /* Brand Story */
    .brand-story-grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }

    .brand-story-content {
        padding-left: 0;
    }

    .brand-story-image img,
    .brand-image-placeholder {
        height: 400px;
    }

    /* Newsletter */
    .newsletter-inner {
        flex-direction: column;
        text-align: center;
    }

    .newsletter-form {
        max-width: 100%;
    }

    /* Instagram */
    .instagram-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Footer */
    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-2xl);
    }

    .footer-brand {
        grid-column: 1 / -1;
        padding-right: 0;
        text-align: center;
    }

    .footer-logo {
        align-items: center;
    }

    .footer-social {
        justify-content: center;
    }

    .footer-grid .footer-column:last-child {
        grid-column: 1 / -1;
    }

    .footer-bottom-inner {
        flex-direction: column;
        text-align: center;
    }

    /* Section titles */
    .section-title {
        font-size: var(--fs-2xl);
        letter-spacing: 3px;
    }

    /* Quick View */
    .quick-view-body {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .quick-view-content {
        width: min(94%, 700px);
        max-height: 88vh;
    }

    .quick-view-gallery {
        max-height: none;
        align-items: stretch;
    }

    .quick-view-image {
        width: 100%;
        height: 250px;
        max-height: 250px;
        object-fit: contain;
    }

    /* Single Product Page */
    .single-product .ammouri-main {
        padding-top: 60px !important;
    }

    body.single-product .ammouri-page-wrapper > .container {
        padding-top: 20px !important;
    }
}

/* ============================================
   MOBILE LANDSCAPE (576px - 767px)
   ============================================ */

@media (max-width: 767px) {
    :root {
        --space-5xl: 4rem;
        --space-4xl: 3rem;
        --space-3xl: 2.5rem;
        --header-height: 65px;
    }

    .container {
        padding: 0 1rem;
    }

    /* Hero */
    .ammouri-hero {
        min-height: auto;
        padding-top: calc(var(--header-height) + 1rem);
        padding-bottom: var(--space-2xl);
    }

    .hero-content {
        padding: 0;
    }

    .hero-title {
        font-size: 2rem;
    }

    .hero-subtitle {
        font-size: var(--fs-md);
    }

    .hero-label {
        font-size: 0.65rem;
        padding: 0.35rem 1rem;
    }

    .hero-placeholder {
        min-height: 350px;
    }

    /* Collections */
    .collections-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-md);
    }

    .collection-card-inner {
        height: 200px;
    }

    .collection-card-content {
        padding: var(--space-md);
    }

    .collection-name {
        font-size: var(--fs-base);
    }

    /* Products */
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-md);
    }

    .products-filter {
        gap: 0.25rem;
    }

    .filter-btn {
        padding: 0.5rem 1rem;
        font-size: 0.65rem;
    }

    .product-card-info {
        padding: var(--space-md);
    }

    .product-card-image {
        padding: 1rem;
    }

    .product-card-image img {
        max-height: 160px;
    }

    .product-title {
        font-size: var(--fs-sm);
    }

    .product-price .price,
    .product-price .woocommerce-Price-amount {
        font-size: var(--fs-base);
    }

    .btn-add-to-cart,
    .btn-buy-now {
        padding: 0.55rem 0.5rem;
        font-size: 0.6rem;
        letter-spacing: 0.5px;
    }

    .product-card-buttons {
        gap: 0.35rem;
    }

    /* Promo */
    .promo-card-content {
        padding: var(--space-xl);
    }

    .promo-title {
        font-size: var(--fs-xl);
    }

    .promo-card-small .promo-title {
        font-size: var(--fs-2xl);
    }

    /* Brand Story */
    .brand-story-title {
        font-size: var(--fs-2xl);
    }

    .brand-story-stats {
        gap: var(--space-lg);
    }

    .stat-number {
        font-size: var(--fs-2xl);
    }

    .brand-story-image img,
    .brand-image-placeholder {
        height: 300px;
    }

    /* Testimonials */
    .testimonial-card {
        padding: var(--space-xl);
        margin: var(--space-sm);
    }

    .testimonial-text {
        font-size: var(--fs-base);
    }

    /* Newsletter */
    .newsletter-block {
        padding: var(--space-2xl) var(--space-lg);
    }

    .newsletter-block-title {
        font-size: var(--fs-xl);
    }

    .newsletter-block-input-group {
        flex-direction: column;
        gap: var(--space-sm);
    }

    /* Instagram */
    .instagram-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Single Product */
    body.single-product .ammouri-page-wrapper > .container {
        padding: 15px 0 2rem !important;
    }

    .single-product .woocommerce-breadcrumb {
        font-size: var(--fs-xs);
        margin-bottom: 8px;
    }

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

    .footer-title::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .footer-contact-list {
        flex-direction: column;
        align-items: center;
    }

    .footer-contact-list li {
        justify-content: center;
    }

    .newsletter-input-group {
        flex-direction: column;
        gap: var(--space-sm);
    }

    .newsletter-btn {
        justify-content: center;
    }

    /* Section */
    .section-header {
        margin-bottom: var(--space-2xl);
    }

    .section-title {
        font-size: var(--fs-xl);
        letter-spacing: 2px;
    }

    .section-cta {
        margin-top: var(--space-2xl);
    }

    /* Buttons */
    .btn {
        padding: 0.75rem 1.5rem;
        font-size: 0.7rem;
    }

    .btn-lg {
        padding: 0.875rem 2rem;
    }

    /* Back to Top */
    .back-to-top {
        width: 40px;
        height: 40px;
        bottom: 1rem;
        right: 1rem;
    }
}

/* ============================================
   MOBILE PORTRAIT (< 576px)
   ============================================ */

@media (max-width: 575px) {
    :root {
        --space-5xl: 3rem;
        --space-4xl: 2.5rem;
        --space-3xl: 2rem;
    }

    .hero-title {
        font-size: 1.75rem;
        letter-spacing: 1px;
    }

    .hero-subtitle {
        font-size: var(--fs-base);
    }

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

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

    /* Collections */
    .collections-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-sm);
    }

    .collection-card-inner {
        height: 160px;
    }

    .collection-icon {
        font-size: var(--fs-base);
    }

    .collection-name {
        font-size: var(--fs-sm);
        letter-spacing: 1px;
    }

    .collection-desc {
        display: none;
    }

    /* Products */
    .products-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--space-sm);
    }

    .product-card-info {
        padding: var(--space-sm) var(--space-sm) var(--space-md);
    }

    .product-card-image {
        padding: 0.75rem;
    }

    .product-card-image img {
        max-height: 140px;
    }

    .product-category {
        font-size: 0.6rem;
    }

    .product-title {
        font-size: var(--fs-xs);
    }

    .product-rating {
        gap: 0.25rem;
    }

    .ammouri-star-rating i {
        font-size: 0.6rem;
    }

    .rating-value {
        font-size: 0.65rem;
    }

    /* Promo */
    .promo-card {
        min-height: 200px;
    }

    .promo-card-content {
        padding: var(--space-lg);
    }

    .promo-title {
        font-size: var(--fs-lg);
    }

    .promo-card-small .promo-title {
        font-size: var(--fs-xl);
    }

    /* Brand Story */
    .brand-story-title {
        font-size: var(--fs-xl);
        letter-spacing: 2px;
    }

    .brand-story-stats {
        flex-direction: column;
        gap: var(--space-md);
    }

    .brand-story-image img,
    .brand-image-placeholder {
        height: 250px;
    }

    /* Quick View */
    .quick-view-actions {
        flex-direction: column;
    }

    .quantity-selector {
        width: 100%;
        justify-content: center;
    }

    .quick-view-info {
        padding: var(--space-lg);
    }

    .quick-view-title {
        font-size: var(--fs-xl);
    }

    .quick-view-thumb {
        width: 48px;
        height: 48px;
    }

    .quick-view-image {
        height: 220px;
        max-height: 220px;
    }

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

    /* Single Product */
    .single-product .ammouri-main {
        padding-top: 55px !important;
    }

    body.single-product .ammouri-page-wrapper > .container {
        padding: 10px 0 2rem !important;
    }

    /* Logo */
    .logo-name {
        font-size: 1.2rem;
        letter-spacing: 5px;
    }

    .logo-tagline {
        font-size: 0.5rem;
        letter-spacing: 4px;
    }

    /* Announcement */
    .ammouri-announcement-bar {
        font-size: 0.65rem;
        padding: 0.5rem 2rem 0.5rem 0.5rem;
    }
}

    /* ============================================
       ARABIC TYPOGRAPHY REFINEMENT (AR ONLY)
       ============================================ */

    html[lang^="ar"],
    body.rtl {
        --font-arabic-heading: "Amiri", serif;
        --font-arabic-ui: "Tajawal", "Noto Kufi Arabic", "Segoe UI", sans-serif;
    }

    html[lang^="ar"] body,
    body.rtl {
        font-family: var(--font-arabic-ui);
        font-size: 17px;
    }

    html[lang^="ar"] .nav-link,
    body.rtl .nav-link,
    html[lang^="ar"] .mobile-nav-menu > li > a,
    body.rtl .mobile-nav-menu > li > a,
    html[lang^="ar"] .mega-menu-title,
    body.rtl .mega-menu-title,
    html[lang^="ar"] .mega-menu-links a,
    body.rtl .mega-menu-links a,
    html[lang^="ar"] .header-action-btn,
    body.rtl .header-action-btn,
    html[lang^="ar"] .search-input,
    body.rtl .search-input {
        font-family: var(--font-arabic-ui) !important;
    }

    html[lang^="ar"] .nav-link,
    body.rtl .nav-link {
        font-size: calc(var(--fs-xs) * 1.14);
        letter-spacing: 0.25px;
    }

    html[lang^="ar"] .mobile-nav-menu > li > a,
    body.rtl .mobile-nav-menu > li > a {
        font-size: calc(var(--fs-sm) * 1.08);
        letter-spacing: 0.2px;
    }

    html[lang^="ar"] .mega-menu-title,
    body.rtl .mega-menu-title {
        font-size: calc(var(--fs-sm) * 1.1);
        letter-spacing: 0.3px;
    }

    html[lang^="ar"] .mega-menu-links a,
    body.rtl .mega-menu-links a {
        font-size: calc(var(--fs-sm) * 1.08);
    }

    html[lang^="ar"] .hero-label,
    body.rtl .hero-label,
    html[lang^="ar"] .hero-subtitle,
    body.rtl .hero-subtitle {
        font-family: var(--font-arabic-ui) !important;
    }

    html[lang^="ar"] .hero-title,
    body.rtl .hero-title,
    html[lang^="ar"] .section-title,
    body.rtl .section-title,
    html[lang^="ar"] .newsletter-title,
    body.rtl .newsletter-title,
    html[lang^="ar"] .footer-title,
    body.rtl .footer-title,
    html[lang^="ar"] .promo-title,
    body.rtl .promo-title,
    html[lang^="ar"] .brand-story-title,
    body.rtl .brand-story-title,
    html[lang^="ar"] .collection-name,
    body.rtl .collection-name,
    html[lang^="ar"] .quick-view-title,
    body.rtl .quick-view-title,
    html[lang^="ar"] .page-header h1,
    body.rtl .page-header h1,
    html[lang^="ar"] .page-hero h1,
    body.rtl .page-hero h1,
    html[lang^="ar"] h1,
    body.rtl h1,
    html[lang^="ar"] h2,
    body.rtl h2,
    html[lang^="ar"] h3,
    body.rtl h3,
    html[lang^="ar"] h4,
    body.rtl h4,
    html[lang^="ar"] h5,
    body.rtl h5,
    html[lang^="ar"] h6,
    body.rtl h6 {
        font-family: var(--font-arabic-heading) !important;
    }

    html[lang^="ar"] .hero-label,
    body.rtl .hero-label {
        font-size: calc(var(--fs-xs) * 1.12);
        letter-spacing: 0.3px;
    }

    html[lang^="ar"] .hero-title,
    body.rtl .hero-title {
        font-size: clamp(2.35rem, 5.3vw, 4.1rem);
        line-height: 1.25;
        font-weight: var(--fw-regular);
    }

    html[lang^="ar"] .hero-subtitle,
    body.rtl .hero-subtitle {
        font-size: calc(var(--fs-lg) * 1.08);
        line-height: 1.75;
    }

    html[lang^="ar"] .btn,
    body.rtl .btn,
    html[lang^="ar"] .btn-add-to-cart,
    body.rtl .btn-add-to-cart,
    html[lang^="ar"] .btn-buy-now,
    body.rtl .btn-buy-now,
    html[lang^="ar"] .filter-btn,
    body.rtl .filter-btn,
    html[lang^="ar"] .newsletter-btn,
    body.rtl .newsletter-btn {
        font-family: var(--font-arabic-ui) !important;
        letter-spacing: 0.25px;
    }

    html[lang^="ar"] .btn,
    body.rtl .btn,
    html[lang^="ar"] .btn-add-to-cart,
    body.rtl .btn-add-to-cart,
    html[lang^="ar"] .btn-buy-now,
    body.rtl .btn-buy-now,
    html[lang^="ar"] .newsletter-btn,
    body.rtl .newsletter-btn {
        font-size: calc(var(--fs-sm) * 1.07);
    }

    html[lang^="ar"] .product-title,
    body.rtl .product-title,
    html[lang^="ar"] .product-category,
    body.rtl .product-category,
    html[lang^="ar"] .product-price .price,
    body.rtl .product-price .price,
    html[lang^="ar"] .product-price .woocommerce-Price-amount,
    body.rtl .product-price .woocommerce-Price-amount,
    html[lang^="ar"] .rating-value,
    body.rtl .rating-value,
    html[lang^="ar"] .rating-count,
    body.rtl .rating-count {
        font-family: var(--font-arabic-ui) !important;
    }

    html[lang^="ar"] .product-title,
    body.rtl .product-title {
        font-size: 17px;
        line-height: 1.5;
    }

    html[lang^="ar"] .product-category,
    body.rtl .product-category {
        font-size: calc(var(--fs-xs) * 1.1);
        letter-spacing: 0.2px;
    }

    html[lang^="ar"] .product-price .price,
    body.rtl .product-price .price,
    html[lang^="ar"] .product-price .woocommerce-Price-amount,
    body.rtl .product-price .woocommerce-Price-amount {
        font-size: calc(var(--fs-lg) * 1.07);
        font-weight: var(--fw-medium);
    }

    html[lang^="ar"] .section-label,
    body.rtl .section-label,
    html[lang^="ar"] .section-subtitle,
    body.rtl .section-subtitle,
    html[lang^="ar"] .footer-brand-text,
    body.rtl .footer-brand-text,
    html[lang^="ar"] .footer-links a,
    body.rtl .footer-links a,
    html[lang^="ar"] .footer-contact-list li,
    body.rtl .footer-contact-list li,
    html[lang^="ar"] .footer-copyright,
    body.rtl .footer-copyright,
    html[lang^="ar"] .footer-payment,
    body.rtl .footer-payment,
    html[lang^="ar"] .newsletter-text,
    body.rtl .newsletter-text,
    html[lang^="ar"] .newsletter-input,
    body.rtl .newsletter-input {
        font-family: var(--font-arabic-ui) !important;
    }

    html[lang^="ar"] .section-label,
    body.rtl .section-label,
    html[lang^="ar"] .footer-title,
    body.rtl .footer-title {
        letter-spacing: 0.2px;
    }

    html[lang^="ar"] .section-title,
    body.rtl .section-title,
    html[lang^="ar"] .newsletter-title,
    body.rtl .newsletter-title {
        letter-spacing: 0.25px;
    }

    html[lang^="ar"] .footer-brand-text,
    body.rtl .footer-brand-text,
    html[lang^="ar"] .footer-links a,
    body.rtl .footer-links a,
    html[lang^="ar"] .footer-contact-list li,
    body.rtl .footer-contact-list li,
    html[lang^="ar"] .footer-copyright,
    body.rtl .footer-copyright,
    html[lang^="ar"] .footer-payment,
    body.rtl .footer-payment,
    html[lang^="ar"] .newsletter-text,
    body.rtl .newsletter-text,
    html[lang^="ar"] .newsletter-input,
    body.rtl .newsletter-input {
        font-size: calc(var(--fs-sm) * 1.08);
    }