/* AJEB responsive system — product grids, overflow, phone / tablet / desktop */

.shop-canvas,
.shop-grid,
.woocommerce ul.products,
.related.products ul.products,
.upsells.products ul.products {
  width: 100%;
  max-width: 100%;
}

.shop-grid,
.woocommerce ul.products,
.related.products ul.products,
.upsells.products ul.products {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 1.1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce ul.products li.first,
.woocommerce ul.products li.last {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  clear: none !important;
  margin: 0 !important;
  padding: 0;
  min-width: 0;
}

.flavor-card {
  width: 100%;
  min-width: 0;
}

.flavor-card__cta,
.flavor-card .button,
.flavor-card .add_to_cart_button {
  width: 100%;
  justify-content: center;
}

.woocommerce-product-gallery,
.woocommerce div.product div.images,
.woocommerce #content div.product div.images,
.woocommerce div.product div.summary,
.woocommerce #content div.product div.summary,
.woocommerce-page div.product div.images,
.woocommerce-page div.product div.summary {
  width: 100% !important;
  float: none !important;
}

@media (min-width: 640px) {
  .shop-grid,
  .woocommerce ul.products,
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }

  .flavor-card__cta,
  .flavor-card .button,
  .flavor-card .add_to_cart_button {
    width: auto;
  }
}

@media (min-width: 1100px) {
  .shop-grid,
  .woocommerce ul.products,
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

body:not(.is-front) .site-header {
  background: color-mix(in oklch, var(--ajeb-ivory) 92%, transparent);
  border-bottom-color: color-mix(in oklch, var(--ajeb-champagne) 40%, var(--ajeb-line));
  backdrop-filter: blur(16px);
}

body.woocommerce-shop .site-main:not(:has(.shop-header)),
body.post-type-archive-product .site-main:not(:has(.shop-header)),
body.tax-product_cat .site-main:not(:has(.shop-header)) {
  padding: calc(var(--ajeb-nav-h) + env(safe-area-inset-top, 0px) + 1.75rem) var(--ajeb-pad) 5rem;
}

body.woocommerce-shop .site-main:not(:has(.shop-canvas)) ul.products,
body.post-type-archive-product .site-main:not(:has(.shop-canvas)) ul.products {
  width: min(100%, var(--ajeb-wide));
  margin-inline: auto;
}
@media (max-width: 639px) {
  :root {
    --ajeb-pad: 1rem;
    --ajeb-nav-h: 4.25rem;
  }

  .site-header__bar {
    gap: 0.5rem;
    width: calc(100% - 1.6rem);
  }

  .nav-icon {
    width: 2.35rem;
    height: 2.35rem;
  }

  .site-logo__word {
    letter-spacing: 0.2em;
    font-size: 0.95rem;
  }

  .btn {
    min-height: 3rem;
  }

  .hero {
    min-height: auto;
    padding-bottom: 1.5rem;
  }

  .hero__stage {
    min-height: 52vh;
  }

  .hero__product {
    width: min(72%, 18rem);
  }

  .hero__actions .btn {
    width: 100%;
    justify-content: center;
  }

  .hero__meta {
    flex-wrap: wrap;
    gap: 0.55rem 1.1rem;
  }

  .flavor-feature {
    min-height: 0;
    padding: 1.15rem;
  }

  .flavor-feature__product {
    width: min(78%, 16rem);
    margin-top: 2rem;
  }

  .flavor-row {
    grid-template-columns: 4.4rem minmax(0, 1fr);
    gap: 0.75rem;
  }

  .flavor-row img {
    width: 4.4rem;
    height: 5.4rem;
  }

  .flavor-row__price {
    grid-column: 2;
  }

  .flavor-card__media {
    min-height: 16rem;
  }

  .discovery__stage {
    min-height: 0;
  }

  .discovery__well {
    width: min(100%, 22rem);
  }

  .discovery__caption {
    font-size: clamp(1.5rem, 8vw, 2.2rem);
  }

  .story__figure img {
    min-height: 18rem;
  }

  .campaign {
    min-height: auto;
  }

  .campaign__shell {
    padding: 4.5rem 0 3.5rem;
  }

  .campaign__product {
    width: min(72%, 16rem);
  }

  .faq-item button {
    font-size: 1.12rem;
    padding: 1.1rem 0;
  }

  .age-gate {
    padding: 1rem;
    align-items: end;
  }

  .age-gate__panel {
    padding: 1.6rem 1.2rem 1.4rem;
    margin-bottom: env(safe-area-inset-bottom, 0.5rem);
  }

  .age-gate__actions .btn {
    width: 100%;
    justify-content: center;
  }

  .cart-drawer__panel {
    width: 100%;
  }

  .cart-drawer__foot .btn {
    width: 100%;
    justify-content: center;
  }

  .pdp__gallery {
    min-height: 18rem;
  }

  .woocommerce div.product form.cart {
    display: grid;
    grid-template-columns: 5rem 1fr;
    width: 100%;
  }

  .woocommerce div.product form.cart .button {
    width: 100%;
  }

  .woocommerce-tabs ul.tabs {
    flex-wrap: wrap;
    gap: 0.75rem 1.1rem;
  }

  .page-hero h1,
  .shop-header h1 {
    max-width: 12ch;
  }

  .error-404 {
    padding: 7rem 1rem 4rem;
  }
}

/* Cart + account tables on small screens */
@media (max-width: 768px) {
  .woocommerce table.shop_table_responsive thead {
    display: none;
  }

  .woocommerce table.shop_table_responsive tbody th {
    display: none;
  }

  .woocommerce table.shop_table_responsive tr {
    display: grid;
    gap: 0.65rem;
    padding: 1rem !important;
  }

  .woocommerce table.shop_table_responsive tr td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    text-align: right;
    border: 0 !important;
    padding: 0.15rem 0 !important;
  }

  .woocommerce table.shop_table_responsive tr td::before {
    content: attr(data-title);
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ajeb-muted);
    text-align: left;
  }

  .woocommerce table.shop_table_responsive tr td.product-thumbnail::before,
  .woocommerce table.shop_table_responsive tr td.product-remove::before {
    content: none;
  }

  .woocommerce-cart-form table.shop_table {
    border: 0;
    background: transparent;
  }

  .woocommerce-cart-form table.shop_table tbody tr {
    background: var(--ajeb-porcelain);
    border: 1px solid var(--ajeb-line);
    margin-bottom: 0.75rem;
  }

  .woocommerce .col2-set .col-1,
  .woocommerce .col2-set .col-2 {
    width: 100%;
    float: none;
  }

  .woocommerce-account .woocommerce {
    display: grid;
    gap: 1.5rem;
  }
}

@media (max-width: 980px) {
  .hero__fruit--apple {
    right: 0;
    width: min(40%, 10rem);
  }

  .hero__fruit--grapes {
    width: min(52%, 12rem);
  }
}

@media (hover: none) {
  .flavor-card:hover {
    box-shadow: 0 10px 30px -24px oklch(0.22 0.02 55 / 0.4);
  }

  .flavor-card:hover .flavor-card__product {
    transform: translateY(6px);
  }
}

@media (pointer: coarse) {
  .nav-icon,
  .world-chip,
  .shop-filters a,
  .shop-filters button {
    min-height: 44px;
  }
}