.products-hero { padding-block: 2.5rem 4.4rem; background: linear-gradient(110deg,#eef3e9,#f6f5ee 70%,#ece6d8); }
.products-hero .breadcrumbs { margin-bottom: 3rem; }
.products-hero-grid { display: grid; grid-template-columns: 1fr .43fr; gap: 3rem; }
.products-hero-copy h1 { margin-bottom: 1rem; font-size: clamp(3.8rem,7vw,6.1rem); }
.products-hero-copy > p:last-child { max-width: 620px; margin-bottom: 0; font-size: .9rem; }
.products-hero-aside { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding: 0 0 .5rem 1.6rem; border-left: 1px solid var(--gold-300); color: var(--green-800); font-family: var(--display-font); font-size: 1.35rem; font-style: italic; line-height: 1.4; }
.hero-aside-symbol { margin-bottom: .8rem; color: var(--gold-600); font-family: var(--body-font); font-size: 2rem; font-style: normal; }
.products-hero-aside a { margin-top: 1.5rem; color: var(--green-700); font-family: var(--body-font); font-size: .66rem; font-style: normal; font-weight: 700; }
.product-catalogue { background: white; }
.catalogue-top { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.catalogue-top h2 { margin-bottom: 0; }
.product-search { display: flex; width: min(100%,275px); height: 47px; align-items: center; gap: .6rem; padding-inline: .8rem; border: 1px solid var(--line); color: var(--gold-600); }
.product-search input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: .72rem; }
.product-search input::placeholder { color: #919990; }
.product-search:focus-within { border-color: var(--green-700); }
.filter-bar { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1rem; }
.filter-button { padding: .62rem .83rem; border: 1px solid var(--line); color: #626d63; background: white; cursor: pointer; font-size: .63rem; font-weight: 600; transition: color .2s ease, background .2s ease, border .2s ease; }
.filter-button span { margin-left: .38rem; color: var(--gold-600); font-size: .55rem; }
.filter-button:hover, .filter-button.is-selected { border-color: var(--green-800); color: white; background: var(--green-800); }
.filter-button.is-selected span { color: var(--gold-300); }
.filter-status { min-height: 1rem; margin: 0 0 .6rem; font-size: .65rem; }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.2rem; }
.product-card { overflow: hidden; border: 1px solid #e8ece6; background: #fff; transition: transform .25s var(--ease), box-shadow .25s ease; }
.product-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-soft); }
.product-card[hidden] { display: none; }
.product-art { position: relative; display: grid; min-height: 205px; overflow: hidden; place-items: center; isolation: isolate; }
.product-art > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease), filter .4s ease; }
.product-card:hover .product-art > img { transform: scale(1.035); }
.product-art::before, .product-art::after { position: absolute; z-index: -1; border: 1px solid rgba(255,255,255,.56); border-radius: 50%; content: ''; transition: transform .4s var(--ease); }
.product-art::before { width: 160px; height: 160px; }
.product-art::after { width: 225px; height: 225px; }
.product-card:hover .product-art::before { transform: scale(1.12); }
.product-card:hover .product-art::after { transform: scale(.95); }
.art-mango { background: linear-gradient(145deg,#e9dba9,#e6af60); }
.art-cinnamon { background: linear-gradient(145deg,#ddc7a1,#a86f4e); }
.art-coconut { background: linear-gradient(145deg,#dbe7cb,#9bac78); }
.art-turmeric { background: linear-gradient(145deg,#efd69f,#d99d4b); }
.art-ginger { background: linear-gradient(145deg,#e7d7bb,#c69768); }
.art-cardamom { background: linear-gradient(145deg,#d8e3c7,#89a77e); }
.art-chilli { background: linear-gradient(145deg,#ecc2a0,#c86645); }
.art-bonnet { background: linear-gradient(145deg,#ead5a5,#cc895a); }
.art-soy { background: linear-gradient(145deg,#e5dfb9,#b4a86b); }
.art-maize { background: linear-gradient(145deg,#f0e2ab,#cda84e); }
.art-fruit { display: grid; width: 99px; height: 99px; place-items: center; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; color: white; background: rgba(255,255,255,.24); font-size: 2.7rem; transition: transform .35s var(--ease); }
.product-card:hover .art-fruit { transform: scale(1.09) rotate(9deg); }
.art-label { position: absolute; bottom: .8rem; left: .9rem; color: rgba(35,52,36,.72); font-size: .53rem; font-weight: 700; letter-spacing: .12em; }
.product-card-copy { padding: 1.2rem 1.3rem 1.4rem; }
.product-meta { color: var(--gold-600); font-size: .55rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.product-card h3 { margin: .4rem 0 .55rem; font-family: var(--display-font); font-size: 1.38rem; font-weight: 500; }
.product-card p { min-height: 61px; margin-bottom: .9rem; font-size: .71rem; line-height: 1.7; }
.product-card .arrow-link { font-size: .66rem; }
.no-products { display: flex; min-height: 180px; align-items: center; justify-content: center; gap: 1rem; color: var(--gold-600); }
.no-products p { margin: 0; font-size: .8rem; }
.catalogue-note { margin: 1.5rem 0 0; padding: 1rem; border-left: 2px solid var(--gold-300); background: var(--paper); font-size: .68rem; }
.product-cta { padding-block: 3rem; background: var(--green-100); }
.product-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.product-cta h2 { margin-bottom: 0; }
@media (max-width: 850px) { .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 640px) {
  .products-hero { padding-block: 1.7rem 3rem; }
  .products-hero .breadcrumbs { margin-bottom: 2.2rem; }
  .products-hero-grid { grid-template-columns: 1fr; gap: 1.3rem; }
  .products-hero-copy h1 { font-size: clamp(3.4rem,14vw,4.8rem); }
  .products-hero-aside { position: relative; min-height: 90px; padding-left: 1rem; font-size: 1rem; }
  .hero-aside-symbol { position: absolute; top: .1rem; right: 1rem; }
  .products-hero-aside a { margin-top: .5rem; }
  .catalogue-top { align-items: flex-start; flex-direction: column; gap: 1.2rem; }
  .product-search { width: 100%; }
  .filter-bar { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .4rem; }
  .filter-button { flex: 0 0 auto; }
  .product-grid { grid-template-columns: 1fr; gap: .9rem; }
  .product-art { min-height: 180px; }
  .product-card-copy { padding: 1.1rem; }
  .product-card p { min-height: 0; }
  .product-cta-inner { align-items: flex-start; flex-direction: column; }
}
