/* ==========================================================================
   ANNAM FARM — Responsive
   Breakpoints: 1440 · 1200 · 992 · 768 · 576 · 375
   ========================================================================== */

/* ============================ ≤ 1366 (small laptop) ===================== */
@media (max-width: 1366px) {
  .hero { min-height: 580px; }
  .hero__inner { min-height: 480px; }
  .hero__title { font-size: clamp(2.4rem, 4.2vw, 3.6rem); }
}

/* ============================ ≤ 1200 (laptop) =========================== */
@media (max-width: 1200px) {
  :root { --section-pad: 80px; }
  .product-grid { grid-template-columns: repeat(4, 1fr); }
  .product-grid--shop { grid-template-columns: repeat(3, 1fr); }
  .shop-banner__grid { gap: 30px; }
  .glass-card--flour { left: -10px; }
  .shop-features__grid { grid-template-columns: repeat(3, 1fr); }
  .products-slider .product-grid { grid-auto-columns: 25%; }
  .promo-grid { grid-template-columns: repeat(2, 1fr); }
  .testi-grid { grid-template-columns: repeat(2, 1fr); }
  .cat-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .footer__top { grid-template-columns: 1.3fr 1fr 1fr; gap: 34px; }
  .footer__col:nth-child(4), .footer__col:nth-child(5) { grid-column: span 1; }
  .hero__inner { gap: 20px; }
  .mega-menu { min-width: 640px; }
  .cat-mega { max-width: 900px; }
  .cat-mega__grid { grid-template-columns: repeat(3, 1fr); }
  .dash-grid { grid-template-columns: 240px 1fr; }
}

/* ============================ ≤ 1024 (small tablet) ==================== */
@media (max-width: 1024px) {
  .hero { min-height: 540px; }
  .hero__title { font-size: clamp(2.2rem, 3.8vw, 3.2rem); }
  .hero__inner { padding: 50px var(--container-pad) 40px; min-height: 440px; }
  .product-grid { grid-template-columns: repeat(4, 1fr); }
  .cat-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .footer__top { grid-template-columns: 1.2fr 1fr 1fr; gap: 30px; }
}

/* ============================ ≤ 992 (tablet) ============================ */
@media (max-width: 992px) {
  :root { --section-pad: 64px; }

  .announce__items { display: none; }
  .announce__inner { justify-content: center; }

  .site-nav { display: none; }
  .header-nav { display: none; }
  .burger { display: flex; }
  .header-main { flex-wrap: wrap; gap: 14px; }
  .header-search { order: 3; flex-basis: 100%; max-width: 100%; }
  .logo { flex: 1; }
  .logo__img--header { width: 176px; max-height: 58px; }
  .act span, .act--login .who { display: none; }
  .act .count-badge { display: grid; }
  .act { flex-direction: row; padding: 10px; }
  .act--login { border: none; }

  .hero { min-height: auto; }
  .hero__inner { grid-template-columns: 1fr; padding-top: 42px; padding-bottom: 40px; min-height: auto; }
  .hero__copy { text-align: center; display: flex; flex-direction: column; align-items: center; }
  .hero__desc { margin-left: auto; margin-right: auto; max-width: 100%; }
  .hero__cta { justify-content: center; }
  .hero__trust { grid-template-columns: repeat(4, auto); justify-content: center; }
  .hero__visual { display: none; }
  .hero__inner { min-height: auto; }
  .hero-arrow { width: 44px; height: 44px; }
  .hero-arrow--prev { left: 12px; }
  .hero-arrow--next { right: 12px; }
  .hero-dots { bottom: 50px; }
  .hero-stats { display: none; }

  .why__inner { grid-template-columns: 1fr; gap: 48px; }
  .why__media .frame img { height: 440px; }
  .float-card--a { right: 8px; }
  .float-card--b { left: 8px; }

  .newsletter { grid-template-columns: 1fr; padding: 48px 34px; }
  .newsletter__bowl { display: none; }

  .shop-layout { grid-template-columns: 1fr; }
  .sidebar { position: static; }
  .sidebar-card { display: none; }
  .sidebar.is-open .sidebar-card { display: block; }
  .filter-toggle { display: inline-flex; }

  /* Shop page: sidebar becomes a slide-in drawer */
  .shop-sidebar {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 110;
    width: min(340px, 86vw); margin: 0; padding: 20px;
    background: var(--bg); overflow-y: auto;
    transform: translateX(-104%);
    transition: transform var(--t-slow);
    box-shadow: 24px 0 60px rgba(44,38,26,.2);
  }
  .shop-sidebar.is-open { transform: translateX(0); }
  .shop-sidebar .sidebar-card { display: block; }
  .shop-sidebar.is-open .sidebar-card { display: block; }
  .shop-banner__grid { grid-template-columns: 1fr; gap: 36px; padding-bottom: 52px; }
  .shop-banner__copy { text-align: center; display: flex; flex-direction: column; align-items: center; }
  .shop-banner__desc { margin-left: auto; margin-right: auto; }
  .shop-banner__meta { justify-content: center; }
  .shop-banner__img { max-width: 520px; margin: 0 auto; }
  .glass-card--flour { left: 2%; }
  .qv-modal__card { grid-template-columns: 1fr; max-height: 90vh; }
  .qv-modal__media { border-radius: 24px 24px 0 0; padding: 26px; }
  .qv-modal__media img { max-width: 220px; }

  .pd-layout { grid-template-columns: 1fr; gap: 34px; }
  .pd-gallery { position: static; }
  .pd-details { grid-template-columns: 1fr; gap: 30px; }
  .pd-facts { position: static; }

  .contact-grid { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .dash-grid { grid-template-columns: 1fr; }
  .dash-menu { display: flex; flex-wrap: wrap; }
  .dash-menu .user-chip { width: 100%; }
  .dash-menu a { flex: 1 1 auto; justify-content: center; border-right: 1px solid var(--border-soft); }
  .dash-menu a.is-danger { border-right: none; }

  .cart-table { display: block; }
  .cart-table thead { display: none; }
  .cart-table tbody, .cart-table tr, .cart-table td { display: block; width: 100%; }
  .cart-table tr { border-bottom: 1px solid var(--border); padding: 8px 0; }
  .cart-table td { border-bottom: none; }
  .cart-table .prod-cell { justify-content: flex-start; }

  .mobile-nav-cat {
    display: flex !important; align-items: center; gap: 8px;
    background: var(--green); color: #fff; font-weight: 600; font-size: .9rem;
    padding: 13px 20px; margin: 0; border-radius: var(--r-pill); border: none;
  }
}

/* ============================ ≤ 768 (mobile) ============================ */
@media (max-width: 768px) {
  .section { padding: 56px 0; }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .product-grid--shop { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .shop-features__grid { grid-template-columns: repeat(2, 1fr); gap: 22px 12px; }
  .shop-topbar { flex-direction: column; align-items: flex-start; gap: 12px; }
  .shop-topbar__right { width: 100%; justify-content: space-between; }
  .sort-dropdown__btn { min-width: 0; flex: 1; justify-content: flex-start; }
  .sort-dropdown__btn span:not(.sort-dropdown__chev):not(.sort-dropdown__ico) { flex: 1; text-align: left; }
  .glass-card--flour { left: 0; padding: 12px 14px; gap: 8px 14px; max-width: 300px; }
  .glass-card__item svg { width: 17px; height: 17px; }
  .qv-modal__body { padding: 26px 22px 24px; }
  .qv-modal__name { font-size: 1.4rem; }
  .products-slider .product-grid { grid-auto-columns: 55%; }
  .promo-grid { grid-template-columns: 1fr; }
  .testi-grid { grid-template-columns: 1fr; }
  .cat-grid { grid-template-columns: repeat(3, 1fr); }
  .why__points { grid-template-columns: 1fr; }
  .stats__grid { grid-template-columns: repeat(2, 1fr); gap: 30px 0; }
  .stat + .stat::before { display: none; }
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__col:first-child { grid-column: 1 / -1; }
  .order-steps { flex-wrap: wrap; gap: 8px; }
  .order-step .bar { display: none; }
  .form-row { grid-template-columns: 1fr; }
  .social-btns { grid-template-columns: 1fr; }
  .tabs-bar { overflow-x: auto; scrollbar-width: none; }
  .tabs-bar::-webkit-scrollbar { display: none; }
  .tabs-bar button { white-space: nowrap; }
  .nutrition-grid { grid-template-columns: repeat(2, 1fr); }
  .pd-gallery__inner { flex-direction: column-reverse; }
  .pd-rail { flex-direction: row; flex-basis: auto; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
  .pd-rail::-webkit-scrollbar { display: none; }
  .pd-thumb { flex: 0 0 74px; width: 74px; height: 74px; }
  .pd-variant-list { grid-template-columns: repeat(4, 1fr); }
  .pd-trust { grid-template-columns: 1fr; }
  .pd-steps { grid-template-columns: 1fr; }
  .pd-review { flex-direction: column; gap: 10px; }
  .stat-cards { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: 1fr; }
  .products-head { flex-direction: column; align-items: flex-start; }
  .products-head .slider-nav { align-self: flex-end; margin-top: -54px; }
  .hero__trust { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .trust-item { justify-content: flex-start; }
  .newsletter__form { flex-direction: column; border-radius: var(--r-lg); padding: 12px; }
  .newsletter__form input { padding: 14px; }
  .newsletter__form .btn { width: 100%; }
  .header-search { order: 3; }
  .act--login { display: none; }
  .back-top { right: 16px; bottom: 16px; width: 44px; height: 44px; }
}

/* ============================ ≤ 576 (mobile) ============================ */
@media (max-width: 576px) {
  :root { --container-pad: 18px; }
  .logo__img--header { width: 148px; max-height: 50px; }
  .header-main { gap: 8px; padding-top: 12px; padding-bottom: 12px; }
  .header-main .logo { flex: 0 1 auto; }
  .header-actions { gap: 4px; }
  .header-actions .act { width: 36px; height: 36px; padding: 0; }
  .header-actions .act--login { display: grid; }
  .header-actions .act svg { width: 19px; height: 19px; }
  .header-actions .act--login svg { width: 18px; height: 18px; }
  .header-actions .act .count-badge { top: -2px; right: -2px; min-width: 17px; height: 17px; font-size: .58rem; }
  .burger { padding: 8px; }
  .burger span { width: 22px; }
  .footer .logo__img--footer { width: 190px; max-height: 64px; }
  .logo__text small { display: none; }
  .shop-banner__meta { gap: 8px; }
  .shop-banner__meta span { padding: 7px 12px; font-size: .72rem; }
  .shop-features__grid { grid-template-columns: 1fr; padding: 26px 20px; }
  .shop-feature { display: flex; align-items: center; gap: 14px; text-align: left; }
  .shop-feature .ico { margin: 0; width: 48px; height: 48px; }
  .shop-feature .ico svg { width: 22px; height: 22px; }
  .filter-actions { grid-template-columns: 1fr; }
  .hero { min-height: 420px; }
  .hero__title { font-size: 2.2rem; }
  .hero-arrow { display: none; }
  .hero-dots { bottom: 30px; }
  .hero__scroll { display: none; }
  .hero-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; position: static; margin-top: 20px; max-width: 100%; }
  .hero-stat { padding: 8px 10px; }
  .hero-stat .num { font-size: .95rem; }
  .hero-stat .label { font-size: .6rem; }
  .hero__cta .btn { width: 100%; }
  .promo-card { min-height: 160px; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); }
  .cat-mega__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1fr; gap: 30px; }
  .footer__bottom-inner { flex-direction: column; text-align: center; }
  .form-card { padding: 28px 22px; }
  .auth-wrap { padding: 36px 14px; }
  .product-card__body { padding: 14px; }
  .products-slider .product-grid { grid-auto-columns: 72%; }
  .pd-variant-list { grid-template-columns: repeat(2, 1fr); }
  .pd-buy { flex-direction: column; align-items: stretch; }
  .pd-buy .qty { align-self: flex-start; }
  .pd-buy .btn { flex: 1 1 auto; }
  .pd-price-row .price { font-size: 1.8rem; }
  .pd-reviews__head { padding: 18px 16px; }
  .lightbox__nav { width: 44px; height: 44px; }
  .lightbox__nav--prev { left: 12px; }
  .lightbox__nav--next { right: 12px; }
  .lightbox__close { top: 14px; right: 14px; }
}

/* ============================ ≤ 480 (small mobile) ===================== */
@media (max-width: 480px) {
  .hero { min-height: 380px; }
  .hero__title { font-size: 2rem; }
  .hero__desc { font-size: .88rem; }
  .hero__trust { grid-template-columns: 1fr 1fr; gap: 8px; }
  .trust-item .ico { width: 36px; height: 36px; }
  .trust-item .ico svg { width: 17px; height: 17px; }
  .trust-item b { font-size: .72rem; }
  .trust-item small { font-size: .64rem; }
  .product-grid { gap: 10px; }
  .product-card__body { padding: 12px; }
  .btn { padding: 14px 24px; font-size: .88rem; }
  .drawer { width: 100vw; }
}

/* ============================ ≤ 430 (iPhone 14 Pro Max) ================= */
@media (max-width: 430px) {
  .logo__img--header { width: 126px; }
  .header-actions .act { width: 34px; height: 34px; }
  .header-actions { gap: 3px; }
  .hero__title { font-size: 1.9rem; }
  .hero__trust { gap: 6px; }
  .hero__badge { font-size: .7rem; padding: 6px 14px; }
}

/* ============================ ≤ 390 (iPhone 14 Pro) ===================== */
@media (max-width: 390px) {
  .hero__title { font-size: 1.7rem; }
  .hero__badge { font-size: .65rem; padding: 5px 12px; }
  .hero__desc { font-size: .82rem; }
  .cat-card .ring { width: 80px; height: 80px; }
  .cat-card .ring img { width: 66px; height: 66px; }
}

/* ============================ ≤ 375 (small) ============================= */
@media (max-width: 375px) {
  .hero { min-height: 380px; }
  .hero__title { font-size: 1.8rem; }
  .hero__badge { font-size: .68rem; padding: 6px 12px; }
  .hero__desc { font-size: .85rem; }
  .hero__trust { grid-template-columns: 1fr 1fr; gap: 8px; }
  .trust-item .ico { width: 36px; height: 36px; }
  .trust-item .ico svg { width: 18px; height: 18px; }
  .trust-item b { font-size: .7rem; }
  .trust-item small { font-size: .62rem; }
  .stats__grid { grid-template-columns: 1fr; }
  .products-slider .product-grid { grid-auto-columns: 84%; }
  .drawer { width: 100vw; }
  .toast { font-size: .8rem; padding: 11px 16px; }
}

/* ============================ ≤ 360 (extra small) ====================== */
@media (max-width: 360px) {
  :root { --container-pad: 14px; }
  .hero__title { font-size: 1.6rem; }
  .hero__trust { grid-template-columns: 1fr; }
  .product-grid { gap: 10px; }
  .product-card__body { padding: 10px; }
  .product-card__name { font-size: .82rem; }
  .cat-grid { gap: 8px; }
  .cat-card .ring { width: 80px; height: 80px; }
}

/* ============================ ≤ 320 (smallest) ========================= */
@media (max-width: 320px) {
  .hero__title { font-size: 1.4rem; }
  .hero__badge { font-size: .6rem; padding: 4px 10px; }
  .btn { font-size: .82rem; padding: 12px 20px; }
  .product-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   ANNAM FARM — Responsive polish
   Fluid control & typography scaling so buttons, product cards and headings
   stay balanced on every screen size. Appended last so these win the cascade.
   ========================================================================== */

/* Fluid type: clamp() already on h1/h2 — give h3 and card text the same treatment */
@media (max-width: 1200px) {
  h3 { font-size: 1.24rem; }
  .blog-card h3 { font-size: 1.12rem; }
  .rc-card__body h3 { font-size: .98rem; }
}

@media (max-width: 992px) {
  .btn { padding: 14px 26px; font-size: .92rem; }
  .btn--lg { padding: 16px 34px; }
  .product-card__name { font-size: .92rem; }
  .product-card--shop .product-card__name { font-size: .94rem; }
  .product-grid--shop .product-card__media,
  .product-card--shop .product-card__media { height: 250px; min-height: 250px; }
  .price-block .price { font-size: 1.12rem; }
}

@media (max-width: 768px) {
  h3 { font-size: 1.18rem; }
  .btn { padding: 13px 22px; font-size: .9rem; }
  .btn--lg { padding: 15px 28px; font-size: .94rem; }
  .btn--sm { padding: 9px 18px; font-size: .82rem; }
  .product-card__name { font-size: .9rem; }
  .product-card--shop .product-card__name { font-size: .92rem; }
  .product-grid--shop .product-card__media,
  .product-card--shop .product-card__media { height: 230px; min-height: 230px; }
  .product-card__weight { font-size: .72rem; }
  .price-block .price { font-size: 1.08rem; }
  .price-block .old { font-size: .78rem; }
  .rating-line { font-size: .7rem; }
  .add-cart-btn { width: 44px; height: 44px; }
  .add-cart-btn svg { width: 19px; height: 19px; }
  .blog-card h3 { font-size: 1.08rem; }
  .rc-card__body h3 { font-size: .95rem; }
  .cat-card b { font-size: .92rem; }
}

@media (max-width: 576px) {
  h3 { font-size: 1.1rem; }
  .btn { padding: 12px 20px; font-size: .88rem; }
  .product-card__name { font-size: .87rem; }
  .product-card--shop .product-card__name { font-size: .9rem; }
  .product-card__weight { font-size: .7rem; }
  .price-block .price { font-size: 1.04rem; }
  .rating-line { font-size: .68rem; }
  .add-cart-btn--full { font-size: .8rem; height: 42px; }
  .blog-card h3 { font-size: 1.05rem; }
  .rc-card__body h3 { font-size: .92rem; }
  .rc-card__meta span { font-size: .72rem; }
  .rc-feature b { font-size: .84rem; }
  .rc-feature small { font-size: .68rem; }
}

@media (max-width: 480px) {
  .btn { padding: 12px 18px; font-size: .86rem; }
  .btn--lg { padding: 14px 24px; font-size: .9rem; }
  .product-card__name { font-size: .85rem; }
  .product-card--shop .product-card__name { font-size: .88rem; }
  .price-block .price { font-size: 1rem; }
  .add-cart-btn { width: 42px; height: 42px; }
  .add-cart-btn--full { font-size: .78rem; height: 40px; }
  .filter-toggle { padding: 10px 14px; font-size: .8rem; }
  .sort-dropdown__btn { padding: 10px 14px; font-size: .82rem; }
  .sort-dropdown__btn .sort-dropdown__ico { width: 16px; height: 16px; }
}

@media (max-width: 390px) {
  .filter-toggle, .sort-dropdown__btn { padding: 9px 12px; font-size: .78rem; }
}

@media (max-width: 430px) {
  .btn { font-size: .85rem; padding: 11px 16px; }
  .product-card__name { font-size: .83rem; }
  .product-card--shop .product-card__name { font-size: .86rem; }
  .price-block .price { font-size: .98rem; }
  .hero__cta .btn { padding: 13px 18px; }
}

@media (max-width: 390px) {
  .btn { font-size: .84rem; }
  .product-card__name { font-size: .81rem; }
  .product-card--shop .product-card__name { font-size: .84rem; }
  .price-block .price { font-size: .96rem; }
  .blog-card h3 { font-size: 1rem; }
  .rc-card__body h3 { font-size: .9rem; }
}

@media (max-width: 375px) {
  .btn { font-size: .83rem; padding: 10px 15px; }
  .product-card__name { font-size: .8rem; }
  .product-card--shop .product-card__name { font-size: .83rem; }
  .product-card__weight { font-size: .66rem; }
  .price-block .price { font-size: .94rem; }
  .rating-line { font-size: .64rem; }
  .add-cart-btn { width: 40px; height: 40px; }
  .add-cart-btn--full { font-size: .76rem; }
}

@media (max-width: 360px) {
  h3 { font-size: 1.05rem; }
  .btn { font-size: .82rem; padding: 10px 14px; }
  .product-card__name { font-size: .79rem; }
  .product-card--shop .product-card__name { font-size: .82rem; }
  .price-block .price { font-size: .92rem; }
  .rating-line { font-size: .62rem; }
}

@media (max-width: 320px) {
  .btn { font-size: .8rem; padding: 9px 13px; }
  .product-card__name { font-size: .77rem; }
  .product-card--shop .product-card__name { font-size: .8rem; }
  .price-block .price { font-size: .9rem; }
  .add-cart-btn { width: 38px; height: 38px; border-radius: 12px; }
}

/* Final mobile homepage overrides: keep product discovery compact. */
@media (max-width: 576px) {
  .products-slider .home-product-rail {
    grid-auto-columns: calc((100% - 10px) / 2) !important;
    gap: 10px !important;
  }
  .home-product-rail .product-card__media {
    height: 168px !important;
    min-height: 168px !important;
  }
  .home-product-rail .product-card__media img {
    object-fit: contain !important;
    object-position: center;
  }
  .home-category-grid {
    display: flex !important;
    grid-template-columns: none !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
  }
  .home-category-grid .cat-card {
    flex: 0 0 82px !important;
    width: 82px !important;
    min-width: 82px !important;
  }
}

@media (max-width: 360px) {
  .products-slider .home-product-rail {
    grid-auto-columns: calc((100% - 8px) / 2) !important;
    gap: 8px !important;
  }
  .home-product-rail .product-card__media {
    height: 150px !important;
    min-height: 150px !important;
  }
}